/* Build Date: 2025. 10. 24. 오후 5:12:18 */

@charset "UTF-8";
:root {
    --color-pl: #4262FF;
    --color-pn: #0114A7;
    --color-g100: #F7F9FD;
    --color-g200: #EDF1F7;
    --color-g300: #E0E6F1;
    --color-g400: #C8D2E4;
    --color-g500: #8694B1;
    --color-g600: #67748E;
    --color-g700: #4D596F;
    --color-g800: #3B4659;
    --color-g900: #020616;
    --color-cg300: #F1F6FB;
    --color-cg400: #EBECF0;
    --color-cg500: #E6EBF5;
    --color-cg600: #A6A6B3;
    --color-pb3: rgba(0, 0, 0, 0.03);
    --color-pb5: rgba(0, 0, 0, 0.05);
    --color-pb6: rgba(0, 0, 0, 0.06);
    --color-pb7: rgba(0, 0, 0, 0.07);
    --color-pb10: rgba(0, 0, 0, 0.1);
    --color-pb15: rgba(0, 0, 0, 0.15);
    --color-pb20: rgba(0, 0, 0, 0.2);
    --color-pb30: rgba(0, 0, 0, 0.3);
    --color-pb40: rgba(0, 0, 0, 0.4);
    --color-pb50: rgba(0, 0, 0, 0.5);
    --color-pb60: rgba(0, 0, 0, 0.6);
    --color-pb70: rgba(0, 0, 0, 0.7);
    --color-pb80: rgba(0, 0, 0, 0.8);
    --color-pb85: rgba(0, 0, 0, 0.85);
    --color-pb100: #000000;
    --color-w0: rgba(255, 255, 255, 0);
    --color-w10: rgba(255, 255, 255, 0.1);
    --color-w15: rgba(255, 255, 255, 0.15);
    --color-w20: rgba(255, 255, 255, 0.2);
    --color-w30: rgba(0, 0, 0, 0.25);
    --color-w50: rgba(255, 255, 255, 0.5);
    --color-w65: rgba(255, 255, 255, 0.65);
    --color-w70: rgba(255, 255, 255, 0.7);
    --color-w80: rgba(255, 255, 255, 0.8);
    --color-w85: rgba(255, 255, 255, 0.85);
    --color-w90: rgba(255, 255, 255, 0.9);
    --color-w100: #ffffff;
    --color-re25: #FCF0ED;
    --color-re50: #FFE5E0;
    --color-re100: #FFD5CC;
    --color-re200: #FEC0B4;
    --color-re300: #FFA594;
    --color-re400: #FC8773;
    --color-re500: #FE6C52;
    --color-re600: #F55142;
    --color-re700: #E23A32;
    --color-re800: #CB1F1A;
    --color-re900: #AD0001;
    --color-og25: #FCF3E3;
    --color-og50: #FFECCC;
    --color-og100: #FFDFAD;
    --color-og200: #FDD291;
    --color-og300: #FFBB63;
    --color-og400: #FFA037;
    --color-og500: #F68511;
    --color-og600: #E46F00;
    --color-og700: #CB5D00;
    --color-og800: #B14C00;
    --color-og900: #953D00;
    --color-yl25: #F8F7E2;
    --color-yl50: #FCF3A7;
    --color-yl100: #FAEB75;
    --color-yl200: #F7DF45;
    --color-yl300: #E8C600;
    --color-yl400: #E2BD03;
    --color-yl500: #CBA706;
    --color-yl600: #B78F01;
    --color-yl700: #9B7800;
    --color-yl800: #856600;
    --color-yl900: #755700;
    --color-lm25: #F1F8E2;
    --color-lm50: #DCFD9B;
    --color-lm100: #C5F76E;
    --color-lm200: #B6F23D;
    --color-lm300: #9EE411;
    --color-lm400: #8AD30D;
    --color-lm500: #79BD05;
    --color-lm600: #69A305;
    --color-lm700: #5C8E0B;
    --color-lm800: #4E7A00;
    --color-lm900: #466B06;
    --color-ce25: #EDF9E7;
    --color-ce50: #cdfcbf;
    --color-ce100: #aef69d;
    --color-ce200: #96ee85;
    --color-ce300: #72e06a;
    --color-ce400: #4ecf50;
    --color-ce500: #27bb36;
    --color-ce600: #09A522;
    --color-ce700: #039115;
    --color-ce800: #007C0F;
    --color-ce900: #00670F;
    --color-gn25: #ECF9F1;
    --color-gn50: #cef8e0;
    --color-gn100: #adf4ce;
    --color-gn200: #89ecbc;
    --color-gn300: #67dea8;
    --color-gn400: #49cc93;
    --color-gn500: #2fb880;
    --color-gn600: #15a46e;
    --color-gn700: #008f5d;
    --color-gn800: #007a4d;
    --color-gn900: #00653e;
    --color-sf25: #EBF9F9;
    --color-sf50: #cef7f3;
    --color-sf100: #ACECE8;
    --color-sf200: #80E0DC;
    --color-sf300: #57D1CC;
    --color-sf400: #2EBDB9;
    --color-sf500: #15ACA8;
    --color-sf600: #119C9A;
    --color-sf700: #148585;
    --color-sf800: #157374;
    --color-sf900: #136266;
    --color-cy25: #E9F8FC;
    --color-cy50: #c5f8ff;
    --color-cy100: #a4f0ff;
    --color-cy200: #88e7fa;
    --color-cy300: #60d8f3;
    --color-cy400: #33c5e8;
    --color-cy500: #12b0da;
    --color-cy600: #019cc8;
    --color-cy700: #0086b4;
    --color-cy800: #0074a2;
    --color-cy900: #005e8a;
    --color-bu25: #ECF5FE;
    --color-bu50: #D1ECFF;
    --color-bu100: #B2DFFF;
    --color-bu200: #8FCEFF;
    --color-bu300: #76BCFE;
    --color-bu400: #53ABFD;
    --color-bu500: #2E9AFF;
    --color-bu600: #088AFD;
    --color-bu700: #047AF1;
    --color-bu800: #066AE5;
    --color-bu900: #0A5BCD;
    --color-in25: #EDF0FC;
    --color-in50: #E6EBFF;
    --color-in100: #D2D9FE;
    --color-in200: #B9C5FE;
    --color-in300: #9EB0FF;
    --color-in400: #819AFE;
    --color-in500: #6C87FE;
    --color-in600: #5574FC;
    --color-in700: #4262FF;
    --color-in800: #324AFB;
    --color-in900: #2539E9;
    --color-vo25: #F5F0FF;
    --color-vo50: #F2EBFF;
    --color-vo100: #E6D8FE;
    --color-vo200: #DDC8FE;
    --color-vo300: #D1B4FD;
    --color-vo400: #C19CFC;
    --color-vo500: #B487FD;
    --color-vo600: #A773FC;
    --color-vo700: #9857FA;
    --color-vo800: #8941F6;
    --color-vo900: #7828F0;
    --color-pu25: #F7EFFA;
    --color-pu50: #F5E5FF;
    --color-pu100: #EDD3FE;
    --color-pu200: #E7C2FE;
    --color-pu300: #E0B0FC;
    --color-pu400: #D99CFC;
    --color-pu500: #D286FE;
    --color-pu600: #C66DFE;
    --color-pu700: #B855F6;
    --color-pu800: #AA33F5;
    --color-pu900: #9611EE;
    --color-fu25: #FAEFF8;
    --color-fu50: #FFE1F9;
    --color-fu100: #FDC9F5;
    --color-fu200: #FDB5F1;
    --color-fu300: #FDA0EF;
    --color-fu400: #FB88E8;
    --color-fu500: #F570DF;
    --color-fu600: #EE58D5;
    --color-fu700: #E63DCA;
    --color-fu800: #D624B8;
    --color-fu900: #C20FA4;
    --color-mg25: #FBEFF3;
    --color-mg50: #FEDCE7;
    --color-mg100: #FDC9DA;
    --color-mg200: #FFB8D1;
    --color-mg300: #FFA3C3;
    --color-mg400: #FE8AB3;
    --color-mg500: #FB6FA5;
    --color-mg600: #EF5897;
    --color-mg700: #DD377E;
    --color-mg800: #C92269;
    --color-mg900: #B30958;
    --color-w40: #FFFFFF7F;
    --color-re1000: #910304;
    --color-re1100: #650101;
    --color-re1200: #4C0101;
    --color-og1000: #7E3802;
    --color-og1100: #692F02;
    --color-og1200: #502102;
    --color-yl1000: #664900;
    --color-yl1100: #5C3F00;
    --color-yl1200: #473200;
    --color-lm1000: #3D5E02;
    --color-lm1100: #334E04;
    --color-lm1200: #2A4101;
    --color-ce1000: #00570E;
    --color-ce1100: #01460D;
    --color-ce1200: #023B0E;
    --color-gn1000: #005737;
    --color-gn1100: #00472D;
    --color-gn1200: #003822;
    --color-sf1000: #105356;
    --color-sf1100: #0A4547;
    --color-sf1200: #00383D;
    --color-cy1000: #004C70;
    --color-cy1100: #003B57;
    --color-cy1200: #003047;
    --color-bu1000: #0048AD;
    --color-bu1100: #00378A;
    --color-bu1200: #012B6F;
    --color-in1000: #1728C4;
    --color-in1100: #0114A7;
    --color-in1200: #17008C;
    --color-vo1000: #650BDA;
    --color-vo1100: #4E03B0;
    --color-vo1200: #39008A;
    --color-pu1000: #7F05CC;
    --color-pu1100: #6400A3;
    --color-pu1200: #4E0080;
    --color-fu1000: #AA098F;
    --color-fu1100: #8F0478;
    --color-fu1200: #740662;
    --color-mg1000: #990549;
    --color-mg1100: #790138;
    --color-mg1200: #650130;
    --color-grey-g1000: #020616;
    --color-grey-g800: #3B4659;
    --color-grey-g700: #4D596F;
    --color-grey-g600: #67748E;
    --color-grey-g500: #8694B1;
    --color-grey-g400: #C8D2E4;
    --color-grey-g300: #E0E6F1;
    --color-grey-g200: #EDF1F7;
    --color-grey-g100: #F7F9FD;
    --color-black-pb100: #000000;
    --color-black-pb85: #000000D8;
    --color-black-pb70: #000000B2;
    --color-black-pb50: #0000007F;
    --color-black-pb40: #00000066;
    --color-black-pb30: #0000004C;
    --color-black-pb20: #00000033;
    --color-black-pb10: #00000019;
    --color-black-pb7: #00000011;
    --color-black-pb5: #0000000C;
    --color-black-pb100-op100: #000000;
    --color-black-pb100-op85: #000000D9;
    --color-black-pb100-op70: #000000B2;
    --color-black-pb100-op50: #00000080;
    --color-black-pb100-op40: #00000066;
    --color-black-pb100-op30: #0000004D;
    --color-black-pb100-op20: #00000033;
    --color-black-pb100-op10: #0000001A;
    --color-black-pb100-op7: #00000012;
    --color-black-pb100-op5: #0000000D;
    --color-white-w100: #FFFFFF;
    --color-white-w85: #FFFFFFD8;
    --color-white-w80: #FFFFFFCC;
    --color-white-w70: #FFFFFFB2;
    --color-white-w65: #FFFFFFA5;
    --color-white-w50: #FFFFFF7F;
    --color-white-w30: #00000040;
    --color-white-w20: #FFFFFF33;
    --color-white-w15: #FFFFFF26;
    --color-white-w10: #FFFFFF19;
    --color-white-w0: #FFFFFF00;
    --color-white-w100-op100: #FFFFFF;
    --color-white-w100-op85: #FFFFFFD9;
    --color-white-w100-op80: #FFFFFFCC;
    --color-white-w100-op70: #FFFFFFB2;
    --color-white-w100-op65: #FFFFFFA6;
    --color-white-w100-op50: #FFFFFF7F;
    --color-white-w100-op40: #ffffff66;
    --color-white-w100-op20: #FFFFFF33;
    --color-white-w100-op15: #FFFFFF26;
    --color-white-w100-op10: #FFFFFF1A;
    --color-white-w100-op0: #FFFFFF00;
    --color-red-re50: #FFE5E0;
    --color-red-re100: #FFD5CC;
    --color-red-re200: #FEC0B4;
    --color-red-re300: #FFA594;
    --color-red-re400: #FC8773;
    --color-red-re500: #FE6C52;
    --color-red-re600: #F55142;
    --color-red-re700: #E23A32;
    --color-red-re800: #CB1F1A;
    --color-red-re900: #AD0001;
    --color-orange-og50: #FFECCC;
    --color-orange-og100: #FFDFAD;
    --color-orange-og200: #FDD291;
    --color-orange-og300: #FFBB63;
    --color-orange-og400: #FFA037;
    --color-orange-og500: #F68511;
    --color-orange-og600: #E46F00;
    --color-orange-og700: #CB5D00;
    --color-orange-og800: #B14C00;
    --color-orange-og900: #953D00;
    --color-yellow-yl50: #FCF3A7;
    --color-yellow-yl100: #FAEB75;
    --color-yellow-yl200: #F7DF45;
    --color-yellow-yl300: #E8C600;
    --color-yellow-yl400: #E2BD03;
    --color-yellow-yl500: #CBA706;
    --color-yellow-yl600: #B78F01;
    --color-yellow-yl700: #9B7800;
    --color-yellow-yl800: #856600;
    --color-yellow-yl900: #755700;
    --color-lime-lm50: #DCFD9B;
    --color-lime-lm100: #C5F76E;
    --color-lime-lm200: #B6F23D;
    --color-lime-lm300: #9EE411;
    --color-lime-lm400: #8AD30D;
    --color-lime-lm500: #79BD05;
    --color-lime-lm600: #69A305;
    --color-lime-lm700: #5C8E0B;
    --color-lime-lm800: #4E7A00;
    --color-lime-lm900: #466B06;
    --color-celery-ce50: #CDFCBF;
    --color-celery-ce100: #AEF69D;
    --color-celery-ce200: #96EE85;
    --color-celery-ce300: #72E06A;
    --color-celery-ce400: #4ECF50;
    --color-celery-ce500: #27BB36;
    --color-celery-ce600: #09A522;
    --color-celery-ce700: #039115;
    --color-celery-ce800: #007C0F;
    --color-celery-ce900: #00670F;
    --color-green-gn50: #CEF8E0;
    --color-green-gn100: #ADF4CE;
    --color-green-gn200: #89ECBC;
    --color-green-gn300: #67DEA8;
    --color-green-gn400: #49CC93;
    --color-green-gn500: #2FB880;
    --color-green-gn600: #15A46E;
    --color-green-gn700: #008F5D;
    --color-green-gn800: #007A4D;
    --color-green-gn900: #00653E;
    --color-seaform-sf50: #CEF7F3;
    --color-seaform-sf100: #ACECE8;
    --color-seaform-sf200: #80E0DC;
    --color-seaform-sf300: #57D1CC;
    --color-seaform-sf400: #2EBDB9;
    --color-seaform-sf500: #15ACA8;
    --color-seaform-sf600: #119C9A;
    --color-seaform-sf700: #148585;
    --color-seaform-sf800: #157374;
    --color-seaform-sf900: #136266;
    --color-cyan-cy50: #C5F8FF;
    --color-cyan-cy100: #A4F0FF;
    --color-cyan-cy200: #88E7FA;
    --color-cyan-cy300: #60D8F3;
    --color-cyan-cy400: #33C5E8;
    --color-cyan-cy500: #12B0DA;
    --color-cyan-cy600: #019CC8;
    --color-cyan-cy700: #0086B4;
    --color-cyan-cy800: #0074A2;
    --color-cyan-cy900: #005E8A;
    --color-blue-bu50: #D1ECFF;
    --color-blue-bu100: #B2DFFF;
    --color-blue-bu200: #8FCEFF;
    --color-blue-bu300: #76BCFE;
    --color-blue-bu400: #53ABFD;
    --color-blue-bu500: #2E9AFF;
    --color-blue-bu600: #088AFD;
    --color-blue-bu700: #047AF1;
    --color-blue-bu800: #066AE5;
    --color-blue-bu900: #0A5BCD;
    --color-indigo-in50: #E6EBFF;
    --color-indigo-in100: #D2D9FE;
    --color-indigo-in200: #B9C5FE;
    --color-indigo-in300: #9EB0FF;
    --color-indigo-in400: #819AFE;
    --color-indigo-in500: #6C87FE;
    --color-indigo-in600: #5574FC;
    --color-indigo-in700: #4262FF;
    --color-indigo-in800: #324AFB;
    --color-indigo-in900: #2539E9;
    --color-violet-vo50: #F2EBFF;
    --color-violet-vo100: #E6D8FE;
    --color-violet-vo200: #DDC8FE;
    --color-violet-vo300: #D1B4FD;
    --color-violet-vo400: #C19CFC;
    --color-violet-vo500: #B487FD;
    --color-violet-vo600: #A773FC;
    --color-violet-vo700: #9857FA;
    --color-violet-vo800: #8941F6;
    --color-violet-vo900: #7828F0;
    --color-purple-pu50: #F5E5FF;
    --color-purple-pu100: #EDD3FE;
    --color-purple-pu200: #E7C2FE;
    --color-purple-pu300: #E0B0FC;
    --color-purple-pu400: #D99CFC;
    --color-purple-pu500: #D286FE;
    --color-purple-pu600: #C66DFE;
    --color-purple-pu700: #B855F6;
    --color-purple-pu800: #AA33F5;
    --color-purple-pu900: #9611EE;
    --color-fuchisa-fu50: #FFE1F9;
    --color-fuchisa-fu100: #FDC9F5;
    --color-fuchisa-fu200: #FDB5F1;
    --color-fuchisa-fu300: #FDA0EF;
    --color-fuchisa-fu400: #FB88E8;
    --color-fuchisa-fu500: #F570DF;
    --color-fuchisa-fu600: #EE58D5;
    --color-fuchisa-fu700: #E63DCA;
    --color-fuchisa-fu800: #D624B8;
    --color-fuchisa-fu900: #C20FA4;
    --color-magenta-mg50: #FEDCE7;
    --color-magenta-mg100: #FDC9DA;
    --color-magenta-mg200: #FFB8D1;
    --color-magenta-mg300: #FFA3C3;
    --color-magenta-mg400: #FE8AB3;
    --color-magenta-mg500: #FB6FA5;
    --color-magenta-mg600: #EF5897;
    --color-magenta-mg700: #DD377E;
    --color-magenta-mg800: #C92269;
    --color-magenta-mg900: #B30958;
    --color-grey-g900: #252B37;
    --color-white-w40: #FFFFFF7F;
    --color-red-re1000: #910304;
    --color-red-re1100: #650101;
    --color-red-re1200: #4C0101;
    --color-orange-og1000: #7E3802;
    --color-orange-og1100: #692F02;
    --color-orange-og1200: #502102;
    --color-yellow-yl1000: #664900;
    --color-yellow-yl1100: #5C3F00;
    --color-yellow-yl1200: #473200;
    --color-lime-lm1000: #3D5E02;
    --color-lime-lm1100: #334E04;
    --color-lime-lm1200: #2A4101;
    --color-celery-ce1000: #00570E;
    --color-celery-ce1100: #01460D;
    --color-celery-ce1200: #023B0E;
    --color-green-gn1000: #005737;
    --color-green-gn1100: #00472D;
    --color-green-gn1200: #003822;
    --color-seaform-sf1000: #105356;
    --color-seaform-sf1100: #0A4547;
    --color-seaform-sf1200: #00383D;
    --color-cyan-cy1000: #004C70;
    --color-cyan-cy1100: #003B57;
    --color-cyan-cy1200: #003047;
    --color-blue-bu1000: #0048AD;
    --color-blue-bu1100: #00378A;
    --color-blue-bu1100-op20: #00378A33;
    --color-blue-bu1200: #012B6F;
    --color-indigo-in1000: #1728C4;
    --color-indigo-in1100: #0114A7;
    --color-indigo-in1200: #17008C;
    --color-violet-vo1000: #650BDA;
    --color-violet-vo1100: #4E03B0;
    --color-violet-vo1200: #39008A;
    --color-purple-pu1000: #7F05CC;
    --color-purple-pu1100: #6400A3;
    --color-purple-pu1200: #4E0080;
    --color-fuchisa-fu1000: #AA098F;
    --color-fuchisa-fu1100: #8F0478;
    --color-fuchisa-fu1200: #740662;
    --color-magenta-mg1000: #990549;
    --color-magenta-mg1100: #790138;
    --color-magenta-mg1200: #650130;
    --color-g100-op85: #f7f9fdd9;
    --color-pb100-op12: #0000001f;
    --color-pb100-op15: #00000026;
    --color-F4F6F9: #F4F6F9;
    --color-F85C39: #F85C39
}

:root {
    --filter-pl: brightness(0) saturate(100%) invert(38%) sepia(69%) saturate(5467%) hue-rotate(225deg) brightness(103%) contrast(101%);
    --filter-pn: brightness(0) saturate(100%) invert(7%) sepia(81%) saturate(5831%) hue-rotate(232deg) brightness(117%) contrast(106%);
    --filter-ico-disabled: brightness(0) saturate(100%) invert(91%) sepia(5%) saturate(836%) hue-rotate(186deg) brightness(92%) contrast(93%);
    --filter-ico-ter: brightness(0) saturate(100%) invert(62%) sepia(13%) saturate(663%) hue-rotate(182deg) brightness(93%) contrast(87%);
    --filter-ico-sec: brightness(0) saturate(100%) invert(33%) sepia(10%) saturate(1254%) hue-rotate(180deg) brightness(94%) contrast(85%);
    --filter-ico-qua: brightness(0) saturate(100%) invert(91%) sepia(5%) saturate(836%) hue-rotate(186deg) brightness(92%) contrast(93%);
    --bg-logo: var(--color-in1100);
    --color-gradient-lg: linear-gradient(0deg, #f8f8f8 0%, rgba(248, 248, 248, 0.85) 75%, rgba(255, 255, 255, 0) 100%);
    --color-gradient-lw: linear-gradient(0deg, #ffffff 0%, rgba(255, 255, 255, 0.85) 70%, rgba(255, 255, 255, 0) 100%);
    --color-gradient-l_w100_2_top: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #ffffff 100%);
    --color-gradient-l_w100t_2_down: linear-gradient(0deg, rgba(255, 255, 255, 0) 0%, #ffffff 100%);
    --color-gradient-l_w100t_3_top: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #ffffff 26.56%, #ffffff 100%);
    --color-gradient-l_w100t_4_top: linear-gradient(0deg, #ffffff 0%, #ffffff 32.24%, rgba(255, 255, 255, 0.85) 70.31%, rgba(255, 255, 255, 0) 100%);
    --color-gradient-l_g100t_3_top: linear-gradient(0deg, #f8f8f8 0%, rgba(248, 248, 248, 0.85) 70.83%, rgba(255, 255, 255, 0) 100%);
    --color-gradient-l_g100t_4_down: linear-gradient(to bottom, rgb(255, 255, 255) 0%, rgb(255, 255, 255) 50%, rgb(247, 249, 253) 51%, rgb(247, 249, 253) 100%);
    --color-gradient-l_w100_op0_2_up: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #ffffff 100%);
    --color-gradient-l_w100_op0_2_down: linear-gradient(0deg, rgba(255, 255, 255, 0) 0%, #ffffff 100%);
    --color-gradient-l_w100_op0_3_up: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #ffffff 26.56%, #ffffff 100%);
    --color-gradient-l_w100_op0_4_up: linear-gradient(0deg, #ffffff 0%, #ffffff 32.24%, rgba(255, 255, 255, 0.85) 70.31%, rgba(255, 255, 255, 0) 100%);
    --color-gradient-l_g100_op0_3_up: linear-gradient(0deg, #f8f8f8 0%, rgba(248, 248, 248, 0.85) 70.83%, rgba(255, 255, 255, 0) 100%);
    --filter-g1: grayscale(1);
    --filter-g100: brightness(0) saturate(100%) invert(90%) sepia(1%) saturate(1128%) hue-rotate(190deg) brightness(110%) contrast(98%);
    --filter-g300: brightness(0) saturate(100%) invert(92%) sepia(22%) saturate(290%) hue-rotate(183deg) brightness(97%) contrast(94%);
    --filter-g400: brightness(0) saturate(100%) invert(87%) sepia(21%) saturate(188%) hue-rotate(181deg) brightness(99%) contrast(86%);
    --filter-g500: brightness(0) saturate(100%) invert(67%) sepia(22%) saturate(369%) hue-rotate(182deg) brightness(84%) contrast(91%);
    --filter-g600: brightness(0) saturate(100%) invert(51%) sepia(13%) saturate(859%) hue-rotate(182deg) brightness(84%) contrast(79%);
    --filter-g700: brightness(0) saturate(100%) invert(31%) sepia(13%) saturate(1032%) hue-rotate(180deg) brightness(96%) contrast(80%);
    --filter-g800: brightness(0) saturate(100%) invert(27%) sepia(10%) saturate(1320%) hue-rotate(179deg) brightness(90%) contrast(91%);
    --filter-g900: brightness(0) saturate(100%) invert(8%) sepia(4%) saturate(6514%) hue-rotate(191deg) brightness(88%) contrast(111%);
    --filter-g1000: brightness(0) saturate(100%) invert(5%) sepia(7%) saturate(6454%) hue-rotate(193deg) brightness(94%) contrast(106%);
    --filter-cg600: brightness(0) saturate(100%) invert(66%) sepia(13%) saturate(194%) hue-rotate(201deg) brightness(99%) contrast(87%);
    --filter-pb100: brightness(0) saturate(100%);
    --filter-w100: brightness(0) invert(1);
    --filter-re500: brightness(0) saturate(100%) invert(54%) sepia(13%) saturate(3340%) hue-rotate(322deg) brightness(103%) contrast(99%);
    --filter-re700: brightness(0) saturate(100%) invert(39%) sepia(86%) saturate(3750%) hue-rotate(341deg) brightness(90%) contrast(96%);
    --filter-yl200: brightness(0) saturate(100%) invert(88%) sepia(74%) saturate(565%) hue-rotate(335deg) brightness(101%) contrast(94%);
    --filter-yl300: brightness(0) saturate(100%) invert(63%) sepia(89%) saturate(496%) hue-rotate(9deg) brightness(103%) contrast(101%);
    --filter-yl600: brightness(0) saturate(100%) invert(61%) sepia(26%) saturate(5467%) hue-rotate(19deg) brightness(92%) contrast(99%);
    --filter-lm100: brightness(0) saturate(100%) invert(94%) sepia(22%) saturate(1079%) hue-rotate(23deg) brightness(101%) contrast(94%);
    --filter-lm500: brightness(0) saturate(100%) invert(59%) sepia(91%) saturate(470%) hue-rotate(37deg) brightness(91%) contrast(96%);
    --filter-ce300: brightness(0) saturate(100%) invert(100%) sepia(24%) saturate(5373%) hue-rotate(47deg) brightness(95%) contrast(85%);
    --filter-ce700: brightness(0) saturate(100%) invert(18%) sepia(98%) saturate(4638%) hue-rotate(140deg) brightness(94%) contrast(98%);
    --filter-ce800: brightness(0) saturate(100%) invert(26%) sepia(71%) saturate(1641%) hue-rotate(105deg) brightness(99%) contrast(101%);
    --filter-gn400: brightness(0) saturate(100%) invert(69%) sepia(82%) saturate(336%) hue-rotate(97deg) brightness(90%) contrast(81%);
    --filter-sf200: brightness(0) saturate(100%) invert(77%) sepia(37%) saturate(388%) hue-rotate(129deg) brightness(100%) contrast(89%);
    --filter-bu200: brightness(0) saturate(100%) invert(73%) sepia(91%) saturate(509%) hue-rotate(176deg) brightness(100%) contrast(101%);
    --filter-bu400: brightness(0%) saturate(100%) invert(71%) sepia(29%) saturate(5864%) hue-rotate(183deg) brightness(99%) contrast(101%);
    --filter-bu500: brightness(0) saturate(100%) invert(49%) sepia(56%) saturate(2402%) hue-rotate(189deg) brightness(101%) contrast(103%);
    --filter-bu600: brightness(0) saturate(100%) invert(37%) sepia(99%) saturate(3408%) hue-rotate(195deg) brightness(109%) contrast(98%);
    --filter-bu700: brightness(0) saturate(100%) invert(33%) sepia(84%) saturate(3081%) hue-rotate(197deg) brightness(98%) contrast(97%);
    --filter-bu800: brightness(0) saturate(100%) invert(29%) sepia(68%) saturate(2173%) hue-rotate(199deg) brightness(96%) contrast(103%);
    --filter-bu900: brightness(0) saturate(100%) invert(24%) sepia(99%) saturate(1543%) hue-rotate(198deg) brightness(101%) contrast(96%);
    --filter-in100: brightness(0) saturate(100%) invert(83%) sepia(14%) saturate(592%) hue-rotate(196deg) brightness(101%) contrast(99%);
    --filter-in400: brightness(0) saturate(100%) invert(52%) sepia(100%) saturate(1393%) hue-rotate(203deg) brightness(106%) contrast(99%);
    --filter-in500: brightness(0) saturate(100%) invert(51%) sepia(14%) saturate(4470%) hue-rotate(206deg) brightness(101%) contrast(99%);
    --filter-in600: brightness(0) saturate(100%) invert(44%) sepia(22%) saturate(6722%) hue-rotate(215deg) brightness(98%) contrast(101%);
    --filter-in700: brightness(0) saturate(100%) invert(43%) sepia(88%) saturate(5067%) hue-rotate(223deg) brightness(101%) contrast(101%);
    --filter-in800: brightness(0) saturate(100%) invert(16%) sepia(97%) saturate(3369%) hue-rotate(235deg) brightness(114%) contrast(97%);
    --filter-in900: brightness(0) saturate(100%) invert(15%) sepia(99%) saturate(4775%) hue-rotate(239deg) brightness(93%) contrast(97%);
    --indigo-in1000: #1728C4;
    --indigo-in1100: #0114A7;
    --indigo-in1200: #17008C;
    --filter-in1100: brightness(0) saturate(100%) invert(7%) sepia(81%) saturate(5831%) hue-rotate(232deg) brightness(117%) contrast(106%);
    --color-comp100: 0 2px 4px 0 rgba(0, 0, 0, 0.06);
    --color-comp200: 0 2px 6px 0 rgba(0, 0, 0, 0.12);
    --color-comp300: 0 2px 8px 0 rgba(0, 0, 0, 0.16);
    --bg-accent-pri: #4262FF;
    --bg-accent-sec: #6C87FE;
    --bg-base: #ffffff;
    --bg-highlight: #B6F23D;
    --bg-pri: #0114A7;
    --bg-pri-active: #0114A7;
    --bg-base-invert: #000000;
    --bg-pri-base: #ffffff;
    --bg-pri-base-invert: #000000;
    --bg-pri-disabled: #EDF1F7;
    --bg-pri-down: #047AF1;
    --bg-pri-error: #E23A32;
    --bg-pri-invert: #FFFFFF26;
    --bg-pri-mark: #E23A32;
    --bg-pri-neutral: #7828F0;
    --bg-pri-success: #039115;
    --bg-pri-up: #E23A32;
    --bg-dim: #000000B3;
    --bg-dim-invert: var(--color-w100);
    --bg-qua: #F7F9FD;
    --bg-risk-high: #E46F00;
    --bg-risk-low: #69A305;
    --bg-risk-normal: #B78F01;
    --bg-risk-very-high: #E23A32;
    --bg-risk-very-low: #066AE5;
    --bg-sec: #E0E6F1;
    --bg-sec-active: #020616;
    --bg-sec-invert: var(--color-w10);
    --bg-sec-base: var(--color-white-w100-op85);
    --bg-sec-base-invert: #000000D9;
    --bg-sec-disabled: #F7F9FD;
    --bg-sec-error: #FFE5E0;
    --bg-sec-neutral: #F2EBFF;
    --bg-sec-success: #cdfcbf;
    --bg-ter: #EDF1F7;
    --bg-sec-solid: #E6EBFF;
    --bg-ter-active: #4262FF;
    --bg-ter-base-invert: var(--color-black-pb100-op70);
    --bg-qua-active: #F7F9FD;
    --bg-seaform-sf600: #119C9A;
    --bg-seaform-sf700: #148585;
    --bg-green-gn600: #15A46E;
    --bg-vo600: #A773FC;
    --border-accent-pri: #0114A7;
    --border-accent-sec: #4262FF;
    --border-disabled: #E0E6F1;
    --border-handle: #0000000D;
    --border-highlight: #B6F23D;
    --border-img: #00378a33;
    --border-pri: #020616;
    --border-pri-active: #1728C4;
    --border-pri-down: #047AF1;
    --border-pri-error: #E23A32;
    --border-pri-invert: #ffffff;
    --border-pri-neutral: #7828F0;
    --border-pri-success: #039115;
    --border-pri-up: #E23A32;
    --border-qua: #E0E6F1;
    --border-quin: #EDF1F7;
    --border-readonly: #67748E;
    --border-sec: #4D596F;
    --border-sec-active: #020616;
    --border-sec-invert: #FFFFFFB3;
    --border-ter: #C8D2E4;
    --border-ter-invert: #FFFFFF33;
    --border-ter-active: #4262FF;
    --ico-accent-pri: #0114A7;
    --ico-accent-sec: #2539E9;
    --ico-accent-ter: #4262FF;
    --filter-ico-accent-ter: brightness(0) saturate(100%) invert(30%) sepia(75%) saturate(1395%) hue-rotate(213deg) brightness(108%) contrast(117%);
    --ico-base: #F7F9FD;
    --ico-cursor: #4262FF;
    --ico-disabled: #C8D2E4;
    --ico-disabled-invert: #FFFFFF26;
    --ico-highlight: #B6F23D;
    --ico-pri: #020616;
    --ico-pri-active: #0114A7;
    --ico-pri-down: #047AF1;
    --filter-pri-down: var(--filter-bu700);
    --ico-pri-error: #E23A32;
    --ico-pri-like: #EF5897;
    --filter-ico-pri-like: brightness(0) saturate(100%) invert(51%) sepia(11%) saturate(4541%) hue-rotate(294deg) brightness(97%) contrast(93%);
    --ico-pri-invert: #ffffff;
    --ico-pri-mark: #E23A32;
    --ico-pri-neutral: #7828F0;
    --ico-pri-success: #039115;
    --ico-pri-up: #E23A32;
    --filter-pri-up: var(--filter-re700);
    --ico-pri-warning: #F7DF45;
    --ico-readonly: #67748E;
    --filter-ico-readonly: brightness(0) saturate(100%) invert(51%) sepia(13%) saturate(859%) hue-rotate(182deg) brightness(84%) contrast(79%);
    --ico-sec: #4D596F;
    --filter-ico-sec: brightness(0) saturate(100%) invert(33%) sepia(8%) saturate(1671%) hue-rotate(181deg) brightness(93%) contrast(83%);
    --ico-sec-active: #020616;
    --ico-sec-invert: #FFFFFFB3;
    --ico-sec-success: #49CC93;
    --filter-sec-success: var(--filter-gn400);
    --ico-sec-error: #FE6C52;
    --filter-sec-error: var(--filter-re500);
    --ico-ter: #8694B1;
    --ico-ter-active: #2539E9;
    --ico-qua: #C8D2E4;
    --ico-qua-active: #4D596F;
    --txt-accent-pri: #0114A7;
    --txt-accent-sec: #4262FF;
    --txt-disabled: #C8D2E4;
    --txt-disabled-invert: #FFFFFF26;
    --txt-placeholder: #8694B1;
    --txt-pri-placeholder: var(--color-g600);
    --txt-pri: #020616;
    --txt-pri-active: #0114A7;
    --txt-pri-down: #047AF1;
    --txt-pri-error: #E23A32;
    --txt-pri-invert: #ffffff;
    --txt-pri-neutral: #7828F0;
    --txt-pri-success: #039115;
    --txt-pri-up: #E23A32;
    --txt-pri-sell: #047af1;
    --txt-qua: #67748E;
    --txt-quin: #8694B1;
    --txt-readonly: #67748E;
    --txt-readonly-invert: #FFFFFFA6;
    --txt-sec: #3B4659;
    --txt-sec-active: #020616;
    --txt-sec-invert: #FFFFFFB3;
    --txt-ter: #4D596F;
    --txt-ter-active: #2539E9;
    --filter-color-grey-g800: brightness(0) saturate(100%) invert(24%) sepia(4%) saturate(3558%) hue-rotate(180deg) brightness(95%) contrast(84%);
    --filter-color-grey-g700: brightness(0) saturate(100%) invert(33%) sepia(10%) saturate(1305%) hue-rotate(180deg) brightness(93%) contrast(83%);
    --filter-color-grey-g600: brightness(0) saturate(100%) invert(46%) sepia(7%) saturate(1395%) hue-rotate(182deg) brightness(94%) contrast(90%);
    --filter-color-grey-g500: brightness(0) saturate(100%) invert(57%) sepia(25%) saturate(320%) hue-rotate(182deg) brightness(96%) contrast(94%);
    --filter-color-grey-g400: brightness(0) saturate(100%) invert(81%) sepia(8%) saturate(402%) hue-rotate(180deg) brightness(97%) contrast(106%);
    --filter-indigo-in700: brightness(0) saturate(100%) invert(30%) sepia(75%) saturate(1395%) hue-rotate(213deg) brightness(108%) contrast(117%);
    --filter-violet-vo400: brightness(0) saturate(100%) invert(65%) sepia(12%) saturate(1547%) hue-rotate(219deg) brightness(102%) contrast(98%);
    --bg-banner-bu: #ecf5fe;
    --bg-banner-in: #edf0fc;
    --bg-banner-og: #fcf3e3;
    --bg-banner-yl: #f8f7e2;
    --bg-banner-ce: #edf9e7;
    --bg-banner-cy: #e9f8fc;
    --ico-logo: var(--color-in1100)
}

:root {
    --kds-easing-linear: cubic-bezier(0, 0, 1, 1);
    --kds-easing-steady: cubic-bezier(0.42, 0, 0.58, 1);
    --kds-easing-decelerate: cubic-bezier(0.42, 0, 0.2, 1);
    --kds-easing-accelerate: cubic-bezier(0.8, 0, 0.58, 1);
    --kds-easing-smooth: cubic-bezier(0, 0, 0.25, 1);
    --kds-easing-bounce: cubic-bezier(.25, .1, 0, 1.2);
    --kds-easing-float: cubic-bezier(0, .5, .5, 1);
    --effect-blur-b2: 2px;
    --effect-blur-b4: 4px;
    --effect-blur-b6: 6px;
    --effect-blur-b8: 8px;
    --effect-blur-b10: 10px;
    --effect-blur-b12: 12px;
    --effect-blur-b16: 16px;
    --effect-blur-b20: 20px;
    --effect-blur-b24: 24px;
    --effect-blur-b36: 36px;
    --effect-blur-b52: 52px
}

:root {
    --path-auth-face-id: url(/resource/img/mmk/kds3_5/ico/auth/face_id.svg);
    --path-auth-fingerprint: url(/resource/img/mmk/kds3_5/ico/auth/fingerprint.svg);
    --path-checkbox-circle: url(/resource/img/mmk/kds3_5/ico/checkbox/circle.svg);
    --path-checkbox-circle-active: url(/resource/img/mmk/kds3_5/ico/checkbox/circle-active.svg);
    --path-checkbox-circle-disabled: url(/resource/img/mmk/kds3_5/ico/checkbox/circle-disabled.svg);
    --path-checkbox-circle-readonly: url(/resource/img/mmk/kds3_5/ico/checkbox/circle-readonly.svg);
    --path-checkbox-heart: url(/resource/img/mmk/kds3_5/ico/checkbox/heart.svg);
    --path-checkbox-heart-active: url(/resource/img/mmk/kds3_5/ico/checkbox/heart-active.svg);
    --path-checkbox-heart-disabled: url(/resource/img/mmk/kds3_5/ico/checkbox/heart-disabled.svg);
    --path-checkbox-heart-readonly: url(/resource/img/mmk/kds3_5/ico/checkbox/heart-readonly.svg);
    --path-checkbox-line: url(/resource/img/mmk/kds3_5/ico/checkbox/line.svg);
    --path-checkbox-line-2depth: url(/resource/img/mmk/kds3_5/ico/checkbox/line-2depth.svg);
    --path-checkbox-line-2depth-active: url(/resource/img/mmk/kds3_5/ico/checkbox/line-2depth-active.svg);
    --path-checkbox-line-2depth-disabled: url(/resource/img/mmk/kds3_5/ico/checkbox/line-2depth-disabled.svg);
    --path-checkbox-line-2depth-readonly: url(/resource/img/mmk/kds3_5/ico/checkbox/line-2depth-readonly.svg);
    --path-checkbox-line-active: url(/resource/img/mmk/kds3_5/ico/checkbox/line-active.svg);
    --path-checkbox-line-disabled: url(/resource/img/mmk/kds3_5/ico/checkbox/line-disabled.svg);
    --path-checkbox-line-readonly: url(/resource/img/mmk/kds3_5/ico/checkbox/line-readonly.svg);
    --path-checkbox-pin: url(/resource/img/mmk/kds3_5/ico/checkbox/pin.svg);
    --path-checkbox-pin-active: url(/resource/img/mmk/kds3_5/ico/checkbox/pin-active.svg);
    --path-checkbox-pin-disabled: url(/resource/img/mmk/kds3_5/ico/checkbox/pin-disabled.svg);
    --path-checkbox-pin-readonly: url(/resource/img/mmk/kds3_5/ico/checkbox/pin-readonly.svg);
    --path-checkbox-square: url(/resource/img/mmk/kds3_5/ico/checkbox/square.svg);
    --path-checkbox-square-active: url(/resource/img/mmk/kds3_5/ico/checkbox/square-active.svg);
    --path-checkbox-square-disabled: url(/resource/img/mmk/kds3_5/ico/checkbox/square-disabled.svg);
    --path-checkbox-square-readonly: url(/resource/img/mmk/kds3_5/ico/checkbox/square-readonly.svg);
    --path-checkbox-star: url(/resource/img/mmk/kds3_5/ico/checkbox/star.svg);
    --path-checkbox-star-active: url(/resource/img/mmk/kds3_5/ico/checkbox/star-active.svg);
    --path-checkbox-star-disabled: url(/resource/img/mmk/kds3_5/ico/checkbox/star-disabled.svg);
    --path-checkbox-star-readonly: url(/resource/img/mmk/kds3_5/ico/checkbox/star-readonly.svg);
    --path-component-tooltip-anchor-default-black: url(/resource/img/mmk/kds3_5/ico/component/tooltip/anchor_default_black.svg);
    --path-component-tooltip-anchor-default-default: url(/resource/img/mmk/kds3_5/ico/component/tooltip/anchor_default_default.svg);
    --path-component-tooltip-anchor-default-default-blue1: url(/resource/img/mmk/kds3_5/ico/component/tooltip/anchor_default_default_blue1.svg);
    --path-component-tooltip-anchor-default-white: url(/resource/img/mmk/kds3_5/ico/component/tooltip/anchor_default_white.svg);
    --path-component-tooltip-anchor-small-black: url(/resource/img/mmk/kds3_5/ico/component/tooltip/anchor_small_black.svg);
    --path-component-tooltip-anchor-small-default: url(/resource/img/mmk/kds3_5/ico/component/tooltip/anchor_small_default.svg);
    --path-component-tooltip-anchor-small-white: url(/resource/img/mmk/kds3_5/ico/component/tooltip/anchor_small_white.svg);
    --path-component-tooltip-anchor-test: url(/resource/img/mmk/kds3_5/ico/component/tooltip/anchor_test.svg);
    --path-etc-new: url(/resource/img/mmk/kds3_5/ico/etc/new.svg);
    --path-etc-scroll-down: url(/resource/img/mmk/kds3_5/ico/etc/scroll_down.svg);
    --path-etc-success: url(/resource/img/mmk/kds3_5/ico/etc/success.svg);
    --path-etc-success-effect: url(/resource/img/mmk/kds3_5/ico/etc/success-effect.svg);
    --path-etc-twinkle: url(/resource/img/mmk/kds3_5/ico/etc/twinkle.svg);
    --path-etc-warning: url(/resource/img/mmk/kds3_5/ico/etc/warning.svg);
    --path-etc-warning-effect: url(/resource/img/mmk/kds3_5/ico/etc/warning-effect.svg);
    --path-input-range-chevron-left-right: url(/resource/img/mmk/kds3_5/ico/input_range/chevron_left_right.svg);
    --path-input-range-chevron-left-right-disabled: url(/resource/img/mmk/kds3_5/ico/input_range/chevron_left_right-disabled.svg);
    --path-line-add: url(/resource/img/mmk/kds3_5/ico/line/add.svg);
    --path-line-add-circle: url(/resource/img/mmk/kds3_5/ico/line/add_circle.svg);
    --path-line-add-s10: url(/resource/img/mmk/kds3_5/ico/line/add_s10.svg);
    --path-line-alarm: url(/resource/img/mmk/kds3_5/ico/line/alarm.svg);
    --path-line-arrow-down: url(/resource/img/mmk/kds3_5/ico/line/arrow_down.svg);
    --path-line-arrow-down-circle: url(/resource/img/mmk/kds3_5/ico/line/arrow_down_circle.svg);
    --path-line-arrow-down-s10: url(/resource/img/mmk/kds3_5/ico/line/arrow_down_s10.svg);
    --path-line-arrow-left: url(/resource/img/mmk/kds3_5/ico/line/arrow_left.svg);
    --path-line-arrow-left-right: url(/resource/img/mmk/kds3_5/ico/line/arrow_left_right.svg);
    --path-line-arrow-left-s10: url(/resource/img/mmk/kds3_5/ico/line/arrow_left_s10.svg);
    --path-line-arrow-right: url(/resource/img/mmk/kds3_5/ico/line/arrow_right.svg);
    --path-line-arrow-right-s10: url(/resource/img/mmk/kds3_5/ico/line/arrow_right_s10.svg);
    --path-line-arrow-up: url(/resource/img/mmk/kds3_5/ico/line/arrow_up.svg);
    --path-line-arrow-up-right: url(/resource/img/mmk/kds3_5/ico/line/arrow_up_right.svg);
    --path-line-arrow-up-right-s10: url(/resource/img/mmk/kds3_5/ico/line/arrow_up_right_s10.svg);
    --path-line-arrow-up-s10: url(/resource/img/mmk/kds3_5/ico/line/arrow_up_s10.svg);
    --path-line-backspace: url(/resource/img/mmk/kds3_5/ico/line/backspace.svg);
    --path-line-building-double: url(/resource/img/mmk/kds3_5/ico/line/building_double.svg);
    --path-line-building-double-cancel: url(/resource/img/mmk/kds3_5/ico/line/building_double_cancel.svg);
    --path-line-building-double-down: url(/resource/img/mmk/kds3_5/ico/line/building_double_down.svg);
    --path-line-bulb: url(/resource/img/mmk/kds3_5/ico/line/bulb.svg);
    --path-line-calculator: url(/resource/img/mmk/kds3_5/ico/line/calculator.svg);
    --path-line-calendar: url(/resource/img/mmk/kds3_5/ico/line/calendar.svg);
    --path-line-calendar-check: url(/resource/img/mmk/kds3_5/ico/line/calendar_check.svg);
    --path-line-calendar-search: url(/resource/img/mmk/kds3_5/ico/line/calendar_search.svg);
    --path-line-call: url(/resource/img/mmk/kds3_5/ico/line/call.svg);
    --path-line-chat: url(/resource/img/mmk/kds3_5/ico/line/chat.svg);
    --path-line-check: url(/resource/img/mmk/kds3_5/ico/line/check.svg);
    --path-line-check-s10: url(/resource/img/mmk/kds3_5/ico/line/check_s10.svg);
    --path-line-chevron-double-left: url(/resource/img/mmk/kds3_5/ico/line/chevron_double_left.svg);
    --path-line-chevron-double-right: url(/resource/img/mmk/kds3_5/ico/line/chevron_double_right.svg);
    --path-line-chevron-down: url(/resource/img/mmk/kds3_5/ico/line/chevron_down.svg);
    --path-line-chevron-down-s10: url(/resource/img/mmk/kds3_5/ico/line/chevron_down_s10.svg);
    --path-line-chevron-left: url(/resource/img/mmk/kds3_5/ico/line/chevron_left.svg);
    --path-line-chevron-left-right: url(/resource/img/mmk/kds3_5/ico/line/chevron_left_right.svg);
    --path-line-chevron-left-s10: url(/resource/img/mmk/kds3_5/ico/line/chevron_left_s10.svg);
    --path-line-chevron-right: url(/resource/img/mmk/kds3_5/ico/line/chevron_right.svg);
    --path-line-chevron-right-s10: url(/resource/img/mmk/kds3_5/ico/line/chevron_right_s10.svg);
    --path-line-chevron-up: url(/resource/img/mmk/kds3_5/ico/line/chevron_up.svg);
    --path-line-chevron-up-s10: url(/resource/img/mmk/kds3_5/ico/line/chevron_up_s10.svg);
    --path-line-clap: url(/resource/img/mmk/kds3_5/ico/line/clap.svg);
    --path-line-clip: url(/resource/img/mmk/kds3_5/ico/line/clip.svg);
    --path-line-clipboard: url(/resource/img/mmk/kds3_5/ico/line/clipboard.svg);
    --path-line-clock: url(/resource/img/mmk/kds3_5/ico/line/clock.svg);
    --path-line-close: url(/resource/img/mmk/kds3_5/ico/line/close.svg);
    --path-line-close-circle: url(/resource/img/mmk/kds3_5/ico/line/close_circle.svg);
    --path-line-close-s10: url(/resource/img/mmk/kds3_5/ico/line/close_s10.svg);
    --path-line-coin: url(/resource/img/mmk/kds3_5/ico/line/coin.svg);
    --path-line-coin-double: url(/resource/img/mmk/kds3_5/ico/line/coin_double.svg);
    --path-line-colored-heart-ico-ter: url(/resource/img/mmk/kds3_5/ico/line/colored/heart_ico-ter.svg);
    --path-line-colored-pin-ico-ter: url(/resource/img/mmk/kds3_5/ico/line/colored/pin_ico-ter.svg);
    --path-line-colored-star-ico-ter: url(/resource/img/mmk/kds3_5/ico/line/colored/star_ico-ter.svg);
    --path-line-copy: url(/resource/img/mmk/kds3_5/ico/line/copy.svg);
    --path-line-del: url(/resource/img/mmk/kds3_5/ico/line/del.svg);
    --path-line-desktop: url(/resource/img/mmk/kds3_5/ico/line/desktop.svg);
    --path-line-document: url(/resource/img/mmk/kds3_5/ico/line/document.svg);
    --path-line-download: url(/resource/img/mmk/kds3_5/ico/line/download.svg);
    --path-line-drag-handle: url(/resource/img/mmk/kds3_5/ico/line/drag_handle.svg);
    --path-line-drag-handle-s10: url(/resource/img/mmk/kds3_5/ico/line/drag_handle_s10.svg);
    --path-line-edit: url(/resource/img/mmk/kds3_5/ico/line/edit.svg);
    --path-line-exclamation-circle: url(/resource/img/mmk/kds3_5/ico/line/exclamation_circle.svg);
    --path-line-filter: url(/resource/img/mmk/kds3_5/ico/line/filter.svg);
    --path-line-gift: url(/resource/img/mmk/kds3_5/ico/line/gift.svg);
    --path-line-glob: url(/resource/img/mmk/kds3_5/ico/line/glob.svg);
    --path-line-gold: url(/resource/img/mmk/kds3_5/ico/line/gold.svg);
    --path-line-headset: url(/resource/img/mmk/kds3_5/ico/line/headset.svg);
    --path-line-heart: url(/resource/img/mmk/kds3_5/ico/line/heart.svg);
    --path-line-hide: url(/resource/img/mmk/kds3_5/ico/line/hide.svg);
    --path-line-home: url(/resource/img/mmk/kds3_5/ico/line/home.svg);
    --path-line-info-circle: url(/resource/img/mmk/kds3_5/ico/line/info_circle.svg);
    --path-line-like: url(/resource/img/mmk/kds3_5/ico/line/like.svg);
    --path-line-link: url(/resource/img/mmk/kds3_5/ico/line/link.svg);
    --path-line-lock: url(/resource/img/mmk/kds3_5/ico/line/lock.svg);
    --path-line-mail: url(/resource/img/mmk/kds3_5/ico/line/mail.svg);
    --path-line-menu: url(/resource/img/mmk/kds3_5/ico/line/menu.svg);
    --path-line-mic: url(/resource/img/mmk/kds3_5/ico/line/mic.svg);
    --path-line-minus: url(/resource/img/mmk/kds3_5/ico/line/minus.svg);
    --path-line-minus-circle: url(/resource/img/mmk/kds3_5/ico/line/minus_circle.svg);
    --path-line-minus-s10: url(/resource/img/mmk/kds3_5/ico/line/minus_s10.svg);
    --path-line-more-hori: url(/resource/img/mmk/kds3_5/ico/line/more_hori.svg);
    --path-line-more-vert: url(/resource/img/mmk/kds3_5/ico/line/more_vert.svg);
    --path-line-none: url(/resource/img/mmk/kds3_5/ico/line/none.svg);
    --path-line-phone: url(/resource/img/mmk/kds3_5/ico/line/phone.svg);
    --path-line-pin: url(/resource/img/mmk/kds3_5/ico/line/pin.svg);
    --path-line-qr-code: url(/resource/img/mmk/kds3_5/ico/line/qr_code.svg);
    --path-line-question-circle: url(/resource/img/mmk/kds3_5/ico/line/question_circle.svg);
    --path-line-refresh: url(/resource/img/mmk/kds3_5/ico/line/refresh.svg);
    --path-line-rotate: url(/resource/img/mmk/kds3_5/ico/line/rotate.svg);
    --path-line-scroll-down: url(/resource/img/mmk/kds3_5/ico/line/scroll_down.svg);
    --path-line-search: url(/resource/img/mmk/kds3_5/ico/line/search.svg);
    --path-line-setting: url(/resource/img/mmk/kds3_5/ico/line/setting.svg);
    --path-line-share: url(/resource/img/mmk/kds3_5/ico/line/share.svg);
    --path-line-shopping: url(/resource/img/mmk/kds3_5/ico/line/shopping.svg);
    --path-line-show: url(/resource/img/mmk/kds3_5/ico/line/show.svg);
    --path-line-star: url(/resource/img/mmk/kds3_5/ico/line/star.svg);
    --path-line-switch-vert: url(/resource/img/mmk/kds3_5/ico/line/switch_vert.svg);
    --path-line-user: url(/resource/img/mmk/kds3_5/ico/line/user.svg);
    --path-solid-account: url(/resource/img/mmk/kds3_5/ico/solid/account.svg);
    --path-solid-account-arrow-left-right: url(/resource/img/mmk/kds3_5/ico/solid/account_arrow_left_right.svg);
    --path-solid-account-arrow-up: url(/resource/img/mmk/kds3_5/ico/solid/account_arrow_up.svg);
    --path-solid-account-glob: url(/resource/img/mmk/kds3_5/ico/solid/account_glob.svg);
    --path-solid-account-loan: url(/resource/img/mmk/kds3_5/ico/solid/account_loan.svg);
    --path-solid-account-search: url(/resource/img/mmk/kds3_5/ico/solid/account_search.svg);
    --path-solid-account-show: url(/resource/img/mmk/kds3_5/ico/solid/account_show.svg);
    --path-solid-add-circle: url(/resource/img/mmk/kds3_5/ico/solid/add_circle.svg);
    --path-solid-ai: url(/resource/img/mmk/kds3_5/ico/solid/ai.svg);
    --path-solid-alarm: url(/resource/img/mmk/kds3_5/ico/solid/alarm.svg);
    --path-solid-alarm-usd: url(/resource/img/mmk/kds3_5/ico/solid/alarm_usd.svg);
    --path-solid-arrow-down: url(/resource/img/mmk/kds3_5/ico/solid/arrow_down.svg);
    --path-solid-arrow-left-right: url(/resource/img/mmk/kds3_5/ico/solid/arrow_left_right.svg);
    --path-solid-arrow-up: url(/resource/img/mmk/kds3_5/ico/solid/arrow_up.svg);
    --path-solid-backspace: url(/resource/img/mmk/kds3_5/ico/solid/backspace.svg);
    --path-solid-basket: url(/resource/img/mmk/kds3_5/ico/solid/basket.svg);
    --path-solid-bitcoin: url(/resource/img/mmk/kds3_5/ico/solid/bitcoin.svg);
    --path-solid-bolt: url(/resource/img/mmk/kds3_5/ico/solid/bolt.svg);
    --path-solid-box: url(/resource/img/mmk/kds3_5/ico/solid/box.svg);
    --path-solid-box-krw: url(/resource/img/mmk/kds3_5/ico/solid/box_krw.svg);
    --path-solid-building: url(/resource/img/mmk/kds3_5/ico/solid/building.svg);
    --path-solid-calculator: url(/resource/img/mmk/kds3_5/ico/solid/calculator.svg);
    --path-solid-calendar: url(/resource/img/mmk/kds3_5/ico/solid/calendar.svg);
    --path-solid-calendar-check: url(/resource/img/mmk/kds3_5/ico/solid/calendar_check.svg);
    --path-solid-calendar-search: url(/resource/img/mmk/kds3_5/ico/solid/calendar_search.svg);
    --path-solid-call: url(/resource/img/mmk/kds3_5/ico/solid/call.svg);
    --path-solid-card: url(/resource/img/mmk/kds3_5/ico/solid/card.svg);
    --path-solid-card-circle: url(/resource/img/mmk/kds3_5/ico/solid/card_circle.svg);
    --path-solid-chat: url(/resource/img/mmk/kds3_5/ico/solid/chat.svg);
    --path-solid-chat-circle: url(/resource/img/mmk/kds3_5/ico/solid/chat_circle.svg);
    --path-solid-check: url(/resource/img/mmk/kds3_5/ico/solid/check.svg);
    --path-solid-check-circle: url(/resource/img/mmk/kds3_5/ico/solid/check_circle.svg);
    --path-solid-chevron-down: url(/resource/img/mmk/kds3_5/ico/solid/chevron_down.svg);
    --path-solid-chevron-left: url(/resource/img/mmk/kds3_5/ico/solid/chevron_left.svg);
    --path-solid-chevron-right: url(/resource/img/mmk/kds3_5/ico/solid/chevron_right.svg);
    --path-solid-chevron-up: url(/resource/img/mmk/kds3_5/ico/solid/chevron_up.svg);
    --path-solid-clipboard-krw: url(/resource/img/mmk/kds3_5/ico/solid/clipboard_krw.svg);
    --path-solid-clock: url(/resource/img/mmk/kds3_5/ico/solid/clock.svg);
    --path-solid-close-circle: url(/resource/img/mmk/kds3_5/ico/solid/close_circle.svg);
    --path-solid-coin: url(/resource/img/mmk/kds3_5/ico/solid/coin.svg);
    --path-solid-colored-account: url(/resource/img/mmk/kds3_5/ico/solid/colored/account.svg);
    --path-solid-colored-account-add: url(/resource/img/mmk/kds3_5/ico/solid/colored/account_add.svg);
    --path-solid-colored-account-deposit: url(/resource/img/mmk/kds3_5/ico/solid/colored/account_deposit.svg);
    --path-solid-colored-account-error: url(/resource/img/mmk/kds3_5/ico/solid/colored/account_error.svg);
    --path-solid-colored-account-loan: url(/resource/img/mmk/kds3_5/ico/solid/colored/account_loan.svg);
    --path-solid-colored-account-success: url(/resource/img/mmk/kds3_5/ico/solid/colored/account_success.svg);
    --path-solid-colored-account-switch: url(/resource/img/mmk/kds3_5/ico/solid/colored/account_switch.svg);
    --path-solid-colored-account-switch-bu: url(/resource/img/mmk/kds3_5/ico/solid/colored/account_switch_bu.svg);
    --path-solid-colored-account-warning: url(/resource/img/mmk/kds3_5/ico/solid/colored/account_warning.svg);
    --path-solid-colored-account-withdraw: url(/resource/img/mmk/kds3_5/ico/solid/colored/account_withdraw.svg);
    --path-solid-colored-add: url(/resource/img/mmk/kds3_5/ico/solid/colored/add.svg);
    --path-solid-colored-airplain: url(/resource/img/mmk/kds3_5/ico/solid/colored/airplain.svg);
    --path-solid-colored-apartment-loan: url(/resource/img/mmk/kds3_5/ico/solid/colored/apartment_loan.svg);
    --path-solid-colored-bag-krw: url(/resource/img/mmk/kds3_5/ico/solid/colored/bag_krw.svg);
    --path-solid-colored-bag-krw-in: url(/resource/img/mmk/kds3_5/ico/solid/colored/bag_krw_in.svg);
    --path-solid-colored-bag-month: url(/resource/img/mmk/kds3_5/ico/solid/colored/bag_month.svg);
    --path-solid-colored-bag-percent: url(/resource/img/mmk/kds3_5/ico/solid/colored/bag_percent.svg);
    --path-solid-colored-bag-percent-gn: url(/resource/img/mmk/kds3_5/ico/solid/colored/bag_percent_gn.svg);
    --path-solid-colored-bag-percent-vo: url(/resource/img/mmk/kds3_5/ico/solid/colored/bag_percent_vo.svg);
    --path-solid-colored-bag-usd: url(/resource/img/mmk/kds3_5/ico/solid/colored/bag_usd.svg);
    --path-solid-colored-basket: url(/resource/img/mmk/kds3_5/ico/solid/colored/basket.svg);
    --path-solid-colored-beer: url(/resource/img/mmk/kds3_5/ico/solid/colored/beer.svg);
    --path-solid-colored-bill-krw: url(/resource/img/mmk/kds3_5/ico/solid/colored/bill_krw.svg);
    --path-solid-colored-bone: url(/resource/img/mmk/kds3_5/ico/solid/colored/bone.svg);
    --path-solid-colored-book: url(/resource/img/mmk/kds3_5/ico/solid/colored/book.svg);
    --path-solid-colored-bus: url(/resource/img/mmk/kds3_5/ico/solid/colored/bus.svg);
    --path-solid-colored-cafe: url(/resource/img/mmk/kds3_5/ico/solid/colored/cafe.svg);
    --path-solid-colored-calendar: url(/resource/img/mmk/kds3_5/ico/solid/colored/calendar.svg);
    --path-solid-colored-calendar-add: url(/resource/img/mmk/kds3_5/ico/solid/colored/calendar_add.svg);
    --path-solid-colored-calendar-error: url(/resource/img/mmk/kds3_5/ico/solid/colored/calendar_error.svg);
    --path-solid-colored-calendar-og: url(/resource/img/mmk/kds3_5/ico/solid/colored/calendar_og.svg);
    --path-solid-colored-calendar-success: url(/resource/img/mmk/kds3_5/ico/solid/colored/calendar_success.svg);
    --path-solid-colored-calendar-switch: url(/resource/img/mmk/kds3_5/ico/solid/colored/calendar_switch.svg);
    --path-solid-colored-calendar-warning: url(/resource/img/mmk/kds3_5/ico/solid/colored/calendar_warning.svg);
    --path-solid-colored-car: url(/resource/img/mmk/kds3_5/ico/solid/colored/car.svg);
    --path-solid-colored-car-loan: url(/resource/img/mmk/kds3_5/ico/solid/colored/car_loan.svg);
    --path-solid-colored-card: url(/resource/img/mmk/kds3_5/ico/solid/colored/card.svg);
    --path-solid-colored-card-add: url(/resource/img/mmk/kds3_5/ico/solid/colored/card_add.svg);
    --path-solid-colored-card-bu: url(/resource/img/mmk/kds3_5/ico/solid/colored/card_bu.svg);
    --path-solid-colored-card-error: url(/resource/img/mmk/kds3_5/ico/solid/colored/card_error.svg);
    --path-solid-colored-card-success: url(/resource/img/mmk/kds3_5/ico/solid/colored/card_success.svg);
    --path-solid-colored-card-switch: url(/resource/img/mmk/kds3_5/ico/solid/colored/card_switch.svg);
    --path-solid-colored-card-warning: url(/resource/img/mmk/kds3_5/ico/solid/colored/card_warning.svg);
    --path-solid-colored-cart: url(/resource/img/mmk/kds3_5/ico/solid/colored/cart.svg);
    --path-solid-colored-chat-heart: url(/resource/img/mmk/kds3_5/ico/solid/colored/chat_heart.svg);
    --path-solid-colored-check: url(/resource/img/mmk/kds3_5/ico/solid/colored/check.svg);
    --path-solid-colored-check-ico-pri-active: url(/resource/img/mmk/kds3_5/ico/solid/colored/check_ico-pri-active.svg);
    --path-solid-colored-check-ico-pri-error: url(/resource/img/mmk/kds3_5/ico/solid/colored/check_ico-pri-error.svg);
    --path-solid-colored-check-ico-pri-invert: url(/resource/img/mmk/kds3_5/ico/solid/colored/check_ico-pri-invert.svg);
    --path-solid-colored-check-ico-pri-like: url(/resource/img/mmk/kds3_5/ico/solid/colored/check_ico-pri-like.svg);
    --path-solid-colored-check-ico-pri-success: url(/resource/img/mmk/kds3_5/ico/solid/colored/check_ico-pri-success.svg);
    --path-solid-colored-check-ico-sec-active: url(/resource/img/mmk/kds3_5/ico/solid/colored/check_ico-sec-active.svg);
    --path-solid-colored-check-ico-ter: url(/resource/img/mmk/kds3_5/ico/solid/colored/check_ico-ter.svg);
    --path-solid-colored-check-ico-ter-active: url(/resource/img/mmk/kds3_5/ico/solid/colored/check_ico-ter-active.svg);
    --path-solid-colored-circle-arrow-in: url(/resource/img/mmk/kds3_5/ico/solid/colored/circle_arrow_in.svg);
    --path-solid-colored-circle-arrow-out: url(/resource/img/mmk/kds3_5/ico/solid/colored/circle_arrow_out.svg);
    --path-solid-colored-clock: url(/resource/img/mmk/kds3_5/ico/solid/colored/clock.svg);
    --path-solid-colored-confetti: url(/resource/img/mmk/kds3_5/ico/solid/colored/confetti.svg);
    --path-solid-colored-coupon: url(/resource/img/mmk/kds3_5/ico/solid/colored/coupon.svg);
    --path-solid-colored-cross: url(/resource/img/mmk/kds3_5/ico/solid/colored/cross.svg);
    --path-solid-colored-cvs: url(/resource/img/mmk/kds3_5/ico/solid/colored/cvs.svg);
    --path-solid-colored-error: url(/resource/img/mmk/kds3_5/ico/solid/colored/error.svg);
    --path-solid-colored-etc: url(/resource/img/mmk/kds3_5/ico/solid/colored/etc.svg);
    --path-solid-colored-event: url(/resource/img/mmk/kds3_5/ico/solid/colored/event.svg);
    --path-solid-colored-exclamation-circle-ico-pri-active: url(/resource/img/mmk/kds3_5/ico/solid/colored/exclamation_circle_ico-pri-active.svg);
    --path-solid-colored-exclamation-circle-ico-pri-error: url(/resource/img/mmk/kds3_5/ico/solid/colored/exclamation_circle_ico-pri-error.svg);
    --path-solid-colored-exclamation-circle-ico-pri-invert: url(/resource/img/mmk/kds3_5/ico/solid/colored/exclamation_circle_ico-pri-invert.svg);
    --path-solid-colored-exclamation-circle-ico-pri-like: url(/resource/img/mmk/kds3_5/ico/solid/colored/exclamation_circle_ico-pri-like.svg);
    --path-solid-colored-exclamation-circle-ico-pri-success: url(/resource/img/mmk/kds3_5/ico/solid/colored/exclamation_circle_ico-pri-success.svg);
    --path-solid-colored-exclamation-circle-ico-sec-active: url(/resource/img/mmk/kds3_5/ico/solid/colored/exclamation_circle_ico-sec-active.svg);
    --path-solid-colored-exclamation-circle-ico-ter: url(/resource/img/mmk/kds3_5/ico/solid/colored/exclamation_circle_ico-ter.svg);
    --path-solid-colored-exclamation-circle-ico-ter-active: url(/resource/img/mmk/kds3_5/ico/solid/colored/exclamation_circle_ico-ter-active.svg);
    --path-solid-colored-fee-waiver: url(/resource/img/mmk/kds3_5/ico/solid/colored/fee_waiver.svg);
    --path-solid-colored-finance: url(/resource/img/mmk/kds3_5/ico/solid/colored/finance.svg);
    --path-solid-colored-flag: url(/resource/img/mmk/kds3_5/ico/solid/colored/flag.svg);
    --path-solid-colored-food: url(/resource/img/mmk/kds3_5/ico/solid/colored/food.svg);
    --path-solid-colored-gas: url(/resource/img/mmk/kds3_5/ico/solid/colored/gas.svg);
    --path-solid-colored-gift: url(/resource/img/mmk/kds3_5/ico/solid/colored/gift.svg);
    --path-solid-colored-glob: url(/resource/img/mmk/kds3_5/ico/solid/colored/glob.svg);
    --path-solid-colored-graduation: url(/resource/img/mmk/kds3_5/ico/solid/colored/graduation.svg);
    --path-solid-colored-guaranteed-loan: url(/resource/img/mmk/kds3_5/ico/solid/colored/guaranteed_loan.svg);
    --path-solid-colored-guaranteed-loan-vo: url(/resource/img/mmk/kds3_5/ico/solid/colored/guaranteed_loan_vo.svg);
    --path-solid-colored-heart-ico-pri-active: url(/resource/img/mmk/kds3_5/ico/solid/colored/heart_ico-pri-active.svg);
    --path-solid-colored-heart-ico-pri-error: url(/resource/img/mmk/kds3_5/ico/solid/colored/heart_ico-pri-error.svg);
    --path-solid-colored-heart-ico-pri-invert: url(/resource/img/mmk/kds3_5/ico/solid/colored/heart_ico-pri-invert.svg);
    --path-solid-colored-heart-ico-pri-like: url(/resource/img/mmk/kds3_5/ico/solid/colored/heart_ico-pri-like.svg);
    --path-solid-colored-heart-ico-pri-success: url(/resource/img/mmk/kds3_5/ico/solid/colored/heart_ico-pri-success.svg);
    --path-solid-colored-heart-ico-sec-active: url(/resource/img/mmk/kds3_5/ico/solid/colored/heart_ico-sec-active.svg);
    --path-solid-colored-heart-ico-ter: url(/resource/img/mmk/kds3_5/ico/solid/colored/heart_ico-ter.svg);
    --path-solid-colored-heart-ico-ter-active: url(/resource/img/mmk/kds3_5/ico/solid/colored/heart_ico-ter-active.svg);
    --path-solid-colored-home: url(/resource/img/mmk/kds3_5/ico/solid/colored/home.svg);
    --path-solid-colored-home-ceo: url(/resource/img/mmk/kds3_5/ico/solid/colored/home_ceo.svg);
    --path-solid-colored-home-loan: url(/resource/img/mmk/kds3_5/ico/solid/colored/home_loan.svg);
    --path-solid-colored-home-loan-vo: url(/resource/img/mmk/kds3_5/ico/solid/colored/home_loan_vo.svg);
    --path-solid-colored-housing: url(/resource/img/mmk/kds3_5/ico/solid/colored/housing.svg);
    --path-solid-colored-income: url(/resource/img/mmk/kds3_5/ico/solid/colored/income.svg);
    --path-solid-colored-institution: url(/resource/img/mmk/kds3_5/ico/solid/colored/institution.svg);
    --path-solid-colored-interest: url(/resource/img/mmk/kds3_5/ico/solid/colored/interest.svg);
    --path-solid-colored-investment: url(/resource/img/mmk/kds3_5/ico/solid/colored/investment.svg);
    --path-solid-colored-letter: url(/resource/img/mmk/kds3_5/ico/solid/colored/letter.svg);
    --path-solid-colored-life: url(/resource/img/mmk/kds3_5/ico/solid/colored/life.svg);
    --path-solid-colored-like: url(/resource/img/mmk/kds3_5/ico/solid/colored/like.svg);
    --path-solid-colored-loan: url(/resource/img/mmk/kds3_5/ico/solid/colored/loan.svg);
    --path-solid-colored-lock: url(/resource/img/mmk/kds3_5/ico/solid/colored/lock.svg);
    --path-solid-colored-lock-add: url(/resource/img/mmk/kds3_5/ico/solid/colored/lock_add.svg);
    --path-solid-colored-lock-error: url(/resource/img/mmk/kds3_5/ico/solid/colored/lock_error.svg);
    --path-solid-colored-lock-success: url(/resource/img/mmk/kds3_5/ico/solid/colored/lock_success.svg);
    --path-solid-colored-lock-switch: url(/resource/img/mmk/kds3_5/ico/solid/colored/lock_switch.svg);
    --path-solid-colored-lock-warning: url(/resource/img/mmk/kds3_5/ico/solid/colored/lock_warning.svg);
    --path-solid-colored-lugage: url(/resource/img/mmk/kds3_5/ico/solid/colored/lugage.svg);
    --path-solid-colored-luggage: url(/resource/img/mmk/kds3_5/ico/solid/colored/luggage.svg);
    --path-solid-colored-message: url(/resource/img/mmk/kds3_5/ico/solid/colored/message.svg);
    --path-solid-colored-message-add: url(/resource/img/mmk/kds3_5/ico/solid/colored/message_add.svg);
    --path-solid-colored-message-check: url(/resource/img/mmk/kds3_5/ico/solid/colored/message_check.svg);
    --path-solid-colored-message-error: url(/resource/img/mmk/kds3_5/ico/solid/colored/message_error.svg);
    --path-solid-colored-message-switch: url(/resource/img/mmk/kds3_5/ico/solid/colored/message_switch.svg);
    --path-solid-colored-message-warning: url(/resource/img/mmk/kds3_5/ico/solid/colored/message_warning.svg);
    --path-solid-colored-mirror: url(/resource/img/mmk/kds3_5/ico/solid/colored/mirror.svg);
    --path-solid-colored-moneybag-loan: url(/resource/img/mmk/kds3_5/ico/solid/colored/moneybag_loan.svg);
    --path-solid-colored-moneybag-loan-vo: url(/resource/img/mmk/kds3_5/ico/solid/colored/moneybag_loan_vo.svg);
    --path-solid-colored-movie: url(/resource/img/mmk/kds3_5/ico/solid/colored/movie.svg);
    --path-solid-colored-none: url(/resource/img/mmk/kds3_5/ico/solid/colored/none.svg);
    --path-solid-colored-notice: url(/resource/img/mmk/kds3_5/ico/solid/colored/notice.svg);
    --path-solid-colored-null-account-krw: url(/resource/img/mmk/kds3_5/ico/solid/colored/null_account_krw.svg);
    --path-solid-colored-null-bag-krw: url(/resource/img/mmk/kds3_5/ico/solid/colored/null_bag_krw.svg);
    --path-solid-colored-null-card: url(/resource/img/mmk/kds3_5/ico/solid/colored/null_card.svg);
    --path-solid-colored-null-coupon: url(/resource/img/mmk/kds3_5/ico/solid/colored/null_coupon.svg);
    --path-solid-colored-null-exclamation-circle: url(/resource/img/mmk/kds3_5/ico/solid/colored/null_exclamation_circle.svg);
    --path-solid-colored-null-paper: url(/resource/img/mmk/kds3_5/ico/solid/colored/null_paper.svg);
    --path-solid-colored-pencil: url(/resource/img/mmk/kds3_5/ico/solid/colored/pencil.svg);
    --path-solid-colored-phone: url(/resource/img/mmk/kds3_5/ico/solid/colored/phone.svg);
    --path-solid-colored-phone-add: url(/resource/img/mmk/kds3_5/ico/solid/colored/phone_add.svg);
    --path-solid-colored-phone-check: url(/resource/img/mmk/kds3_5/ico/solid/colored/phone_check.svg);
    --path-solid-colored-phone-error: url(/resource/img/mmk/kds3_5/ico/solid/colored/phone_error.svg);
    --path-solid-colored-phone-money: url(/resource/img/mmk/kds3_5/ico/solid/colored/phone_money.svg);
    --path-solid-colored-phone-switch: url(/resource/img/mmk/kds3_5/ico/solid/colored/phone_switch.svg);
    --path-solid-colored-phone-warning: url(/resource/img/mmk/kds3_5/ico/solid/colored/phone_warning.svg);
    --path-solid-colored-phone-wifi: url(/resource/img/mmk/kds3_5/ico/solid/colored/phone_wifi.svg);
    --path-solid-colored-pill: url(/resource/img/mmk/kds3_5/ico/solid/colored/pill.svg);
    --path-solid-colored-point: url(/resource/img/mmk/kds3_5/ico/solid/colored/point.svg);
    --path-solid-colored-popcorn: url(/resource/img/mmk/kds3_5/ico/solid/colored/popcorn.svg);
    --path-solid-colored-review: url(/resource/img/mmk/kds3_5/ico/solid/colored/review.svg);
    --path-solid-colored-reward: url(/resource/img/mmk/kds3_5/ico/solid/colored/reward.svg);
    --path-solid-colored-ring: url(/resource/img/mmk/kds3_5/ico/solid/colored/ring.svg);
    --path-solid-colored-rocket: url(/resource/img/mmk/kds3_5/ico/solid/colored/rocket.svg);
    --path-solid-colored-search: url(/resource/img/mmk/kds3_5/ico/solid/colored/search.svg);
    --path-solid-colored-shield: url(/resource/img/mmk/kds3_5/ico/solid/colored/shield.svg);
    --path-solid-colored-shopping: url(/resource/img/mmk/kds3_5/ico/solid/colored/shopping.svg);
    --path-solid-colored-shopping-travel: url(/resource/img/mmk/kds3_5/ico/solid/colored/shopping_travel.svg);
    --path-solid-colored-star-ico-pri-active: url(/resource/img/mmk/kds3_5/ico/solid/colored/star_ico-pri-active.svg);
    --path-solid-colored-star-ico-pri-error: url(/resource/img/mmk/kds3_5/ico/solid/colored/star_ico-pri-error.svg);
    --path-solid-colored-star-ico-pri-invert: url(/resource/img/mmk/kds3_5/ico/solid/colored/star_ico-pri-invert.svg);
    --path-solid-colored-star-ico-pri-like: url(/resource/img/mmk/kds3_5/ico/solid/colored/star_ico-pri-like.svg);
    --path-solid-colored-star-ico-pri-success: url(/resource/img/mmk/kds3_5/ico/solid/colored/star_ico-pri-success.svg);
    --path-solid-colored-star-ico-sec-active: url(/resource/img/mmk/kds3_5/ico/solid/colored/star_ico-sec-active.svg);
    --path-solid-colored-star-ico-ter: url(/resource/img/mmk/kds3_5/ico/solid/colored/star_ico-ter.svg);
    --path-solid-colored-star-ico-ter-active: url(/resource/img/mmk/kds3_5/ico/solid/colored/star_ico-ter-active.svg);
    --path-solid-colored-stroller: url(/resource/img/mmk/kds3_5/ico/solid/colored/stroller.svg);
    --path-solid-colored-success: url(/resource/img/mmk/kds3_5/ico/solid/colored/success.svg);
    --path-solid-colored-switch: url(/resource/img/mmk/kds3_5/ico/solid/colored/switch.svg);
    --path-solid-colored-switch-bu: url(/resource/img/mmk/kds3_5/ico/solid/colored/switch_bu.svg);
    --path-solid-colored-taxi: url(/resource/img/mmk/kds3_5/ico/solid/colored/taxi.svg);
    --path-solid-colored-tennis-ball: url(/resource/img/mmk/kds3_5/ico/solid/colored/tennis_ball.svg);
    --path-solid-colored-train: url(/resource/img/mmk/kds3_5/ico/solid/colored/train.svg);
    --path-solid-colored-transfer: url(/resource/img/mmk/kds3_5/ico/solid/colored/transfer.svg);
    --path-solid-colored-umbrella: url(/resource/img/mmk/kds3_5/ico/solid/colored/umbrella.svg);
    --path-solid-colored-user: url(/resource/img/mmk/kds3_5/ico/solid/colored/user.svg);
    --path-solid-colored-users: url(/resource/img/mmk/kds3_5/ico/solid/colored/users.svg);
    --path-solid-colored-warning: url(/resource/img/mmk/kds3_5/ico/solid/colored/warning.svg);
    --path-solid-colored-warning-yl: url(/resource/img/mmk/kds3_5/ico/solid/colored/warning_yl.svg);
    --path-solid-coupon: url(/resource/img/mmk/kds3_5/ico/solid/coupon.svg);
    --path-solid-credit-score: url(/resource/img/mmk/kds3_5/ico/solid/credit_score.svg);
    --path-solid-document: url(/resource/img/mmk/kds3_5/ico/solid/document.svg);
    --path-solid-dutchpay: url(/resource/img/mmk/kds3_5/ico/solid/dutchpay.svg);
    --path-solid-edit: url(/resource/img/mmk/kds3_5/ico/solid/edit.svg);
    --path-solid-exclamation: url(/resource/img/mmk/kds3_5/ico/solid/exclamation.svg);
    --path-solid-exclamation-circle: url(/resource/img/mmk/kds3_5/ico/solid/exclamation_circle.svg);
    --path-solid-gift: url(/resource/img/mmk/kds3_5/ico/solid/gift.svg);
    --path-solid-gift-active: url(/resource/img/mmk/kds3_5/ico/solid/gift-active.svg);
    --path-solid-glob: url(/resource/img/mmk/kds3_5/ico/solid/glob.svg);
    --path-solid-glob-chat: url(/resource/img/mmk/kds3_5/ico/solid/glob_chat.svg);
    --path-solid-gold: url(/resource/img/mmk/kds3_5/ico/solid/gold.svg);
    --path-solid-graph-area-down: url(/resource/img/mmk/kds3_5/ico/solid/graph_area_down.svg);
    --path-solid-graph-area-up: url(/resource/img/mmk/kds3_5/ico/solid/graph_area_up.svg);
    --path-solid-graph-area-up-active: url(/resource/img/mmk/kds3_5/ico/solid/graph_area_up-active.svg);
    --path-solid-graph-bar-down: url(/resource/img/mmk/kds3_5/ico/solid/graph_bar_down.svg);
    --path-solid-graph-bar-up: url(/resource/img/mmk/kds3_5/ico/solid/graph_bar_up.svg);
    --path-solid-heart: url(/resource/img/mmk/kds3_5/ico/solid/heart.svg);
    --path-solid-hide: url(/resource/img/mmk/kds3_5/ico/solid/hide.svg);
    --path-solid-home: url(/resource/img/mmk/kds3_5/ico/solid/home.svg);
    --path-solid-home-active: url(/resource/img/mmk/kds3_5/ico/solid/home-active.svg);
    --path-solid-hospital: url(/resource/img/mmk/kds3_5/ico/solid/hospital.svg);
    --path-solid-info-circle: url(/resource/img/mmk/kds3_5/ico/solid/info_circle.svg);
    --path-solid-kbankpay: url(/resource/img/mmk/kds3_5/ico/solid/kbankpay.svg);
    --path-solid-loan: url(/resource/img/mmk/kds3_5/ico/solid/loan.svg);
    --path-solid-loan-krw: url(/resource/img/mmk/kds3_5/ico/solid/loan_krw.svg);
    --path-solid-mail: url(/resource/img/mmk/kds3_5/ico/solid/mail.svg);
    --path-solid-menu: url(/resource/img/mmk/kds3_5/ico/solid/menu.svg);
    --path-solid-menu-active: url(/resource/img/mmk/kds3_5/ico/solid/menu-active.svg);
    --path-solid-minus-circle: url(/resource/img/mmk/kds3_5/ico/solid/minus_circle.svg);
    --path-solid-moneytalk: url(/resource/img/mmk/kds3_5/ico/solid/moneytalk.svg);
    --path-solid-notice: url(/resource/img/mmk/kds3_5/ico/solid/notice.svg);
    --path-solid-pause: url(/resource/img/mmk/kds3_5/ico/solid/pause.svg);
    --path-solid-percent-circle: url(/resource/img/mmk/kds3_5/ico/solid/percent_circle.svg);
    --path-solid-phone: url(/resource/img/mmk/kds3_5/ico/solid/phone.svg);
    --path-solid-piggy-bank: url(/resource/img/mmk/kds3_5/ico/solid/piggy_bank.svg);
    --path-solid-pin: url(/resource/img/mmk/kds3_5/ico/solid/pin.svg);
    --path-solid-play: url(/resource/img/mmk/kds3_5/ico/solid/play.svg);
    --path-solid-question-circle: url(/resource/img/mmk/kds3_5/ico/solid/question_circle.svg);
    --path-solid-search: url(/resource/img/mmk/kds3_5/ico/solid/search.svg);
    --path-solid-setting: url(/resource/img/mmk/kds3_5/ico/solid/setting.svg);
    --path-solid-share: url(/resource/img/mmk/kds3_5/ico/solid/share.svg);
    --path-solid-shopping: url(/resource/img/mmk/kds3_5/ico/solid/shopping.svg);
    --path-solid-shopping-active: url(/resource/img/mmk/kds3_5/ico/solid/shopping-active.svg);
    --path-solid-show: url(/resource/img/mmk/kds3_5/ico/solid/show.svg);
    --path-solid-star: url(/resource/img/mmk/kds3_5/ico/solid/star.svg);
    --path-solid-switch-vert: url(/resource/img/mmk/kds3_5/ico/solid/switch_vert.svg);
    --path-solid-syringe: url(/resource/img/mmk/kds3_5/ico/solid/syringe.svg);
    --path-solid-triangle-down: url(/resource/img/mmk/kds3_5/ico/solid/triangle_down.svg);
    --path-solid-triangle-down-re: url(/resource/img/mmk/kds3_5/ico/solid/triangle_down_re.svg);
    --path-solid-triangle-left-right: url(/resource/img/mmk/kds3_5/ico/solid/triangle_left_right.svg);
    --path-solid-triangle-up: url(/resource/img/mmk/kds3_5/ico/solid/triangle_up.svg);
    --path-solid-triangle-up-down: url(/resource/img/mmk/kds3_5/ico/solid/triangle_up_down.svg);
    --path-solid-triangle-up-re: url(/resource/img/mmk/kds3_5/ico/solid/triangle_up_re.svg);
    --path-solid-user: url(/resource/img/mmk/kds3_5/ico/solid/user.svg)
}

:root {
    --path-solid-colored-account: url(/resource/img/mmk/kds3_5/ico/solid/colored/account.svg);
    --path-solid-colored-account_add: url(/resource/img/mmk/kds3_5/ico/solid/colored/account_add.svg);
    --path-solid-colored-account_deposit: url(/resource/img/mmk/kds3_5/ico/solid/colored/account_deposit.svg);
    --path-solid-colored-account_error: url(/resource/img/mmk/kds3_5/ico/solid/colored/account_error.svg);
    --path-solid-colored-account_loan: url(/resource/img/mmk/kds3_5/ico/solid/colored/account_loan.svg);
    --path-solid-colored-account_success: url(/resource/img/mmk/kds3_5/ico/solid/colored/account_success.svg);
    --path-solid-colored-account_switch: url(/resource/img/mmk/kds3_5/ico/solid/colored/account_switch.svg);
    --path-solid-colored-account_switch_bu: url(/resource/img/mmk/kds3_5/ico/solid/colored/account_switch_bu.svg);
    --path-solid-colored-account_warning: url(/resource/img/mmk/kds3_5/ico/solid/colored/account_warning.svg);
    --path-solid-colored-account_withdraw: url(/resource/img/mmk/kds3_5/ico/solid/colored/account_withdraw.svg);
    --path-solid-colored-add: url(/resource/img/mmk/kds3_5/ico/solid/colored/add.svg);
    --path-solid-colored-airplain: url(/resource/img/mmk/kds3_5/ico/solid/colored/airplain.svg);
    --path-solid-colored-apartment_loan: url(/resource/img/mmk/kds3_5/ico/solid/colored/apartment_loan.svg);
    --path-solid-colored-bag_krw: url(/resource/img/mmk/kds3_5/ico/solid/colored/bag_krw.svg);
    --path-solid-colored-bag_krw_in: url(/resource/img/mmk/kds3_5/ico/solid/colored/bag_krw_in.svg);
    --path-solid-colored-bag_month: url(/resource/img/mmk/kds3_5/ico/solid/colored/bag_month.svg);
    --path-solid-colored-bag_percent: url(/resource/img/mmk/kds3_5/ico/solid/colored/bag_percent.svg);
    --path-solid-colored-bag_percent_gn: url(/resource/img/mmk/kds3_5/ico/solid/colored/bag_percent_gn.svg);
    --path-solid-colored-bag_percent_vo: url(/resource/img/mmk/kds3_5/ico/solid/colored/bag_percent_vo.svg);
    --path-solid-colored-bag_usd: url(/resource/img/mmk/kds3_5/ico/solid/colored/bag_usd.svg);
    --path-solid-colored-basket: url(/resource/img/mmk/kds3_5/ico/solid/colored/basket.svg);
    --path-solid-colored-beer: url(/resource/img/mmk/kds3_5/ico/solid/colored/beer.svg);
    --path-solid-colored-bill_krw: url(/resource/img/mmk/kds3_5/ico/solid/colored/bill_krw.svg);
    --path-solid-colored-bone: url(/resource/img/mmk/kds3_5/ico/solid/colored/bone.svg);
    --path-solid-colored-book: url(/resource/img/mmk/kds3_5/ico/solid/colored/book.svg);
    --path-solid-colored-bus: url(/resource/img/mmk/kds3_5/ico/solid/colored/bus.svg);
    --path-solid-colored-cafe: url(/resource/img/mmk/kds3_5/ico/solid/colored/cafe.svg);
    --path-solid-colored-calendar: url(/resource/img/mmk/kds3_5/ico/solid/colored/calendar.svg);
    --path-solid-colored-calendar_add: url(/resource/img/mmk/kds3_5/ico/solid/colored/calendar_add.svg);
    --path-solid-colored-calendar_error: url(/resource/img/mmk/kds3_5/ico/solid/colored/calendar_error.svg);
    --path-solid-colored-calendar_og: url(/resource/img/mmk/kds3_5/ico/solid/colored/calendar_og.svg);
    --path-solid-colored-calendar_success: url(/resource/img/mmk/kds3_5/ico/solid/colored/calendar_success.svg);
    --path-solid-colored-calendar_switch: url(/resource/img/mmk/kds3_5/ico/solid/colored/calendar_switch.svg);
    --path-solid-colored-calendar_warning: url(/resource/img/mmk/kds3_5/ico/solid/colored/calendar_warning.svg);
    --path-solid-colored-car: url(/resource/img/mmk/kds3_5/ico/solid/colored/car.svg);
    --path-solid-colored-car_loan: url(/resource/img/mmk/kds3_5/ico/solid/colored/car_loan.svg);
    --path-solid-colored-card: url(/resource/img/mmk/kds3_5/ico/solid/colored/card.svg);
    --path-solid-colored-card_add: url(/resource/img/mmk/kds3_5/ico/solid/colored/card_add.svg);
    --path-solid-colored-card_bu: url(/resource/img/mmk/kds3_5/ico/solid/colored/card_bu.svg);
    --path-solid-colored-card_error: url(/resource/img/mmk/kds3_5/ico/solid/colored/card_error.svg);
    --path-solid-colored-card_success: url(/resource/img/mmk/kds3_5/ico/solid/colored/card_success.svg);
    --path-solid-colored-card_switch: url(/resource/img/mmk/kds3_5/ico/solid/colored/card_switch.svg);
    --path-solid-colored-card_warning: url(/resource/img/mmk/kds3_5/ico/solid/colored/card_warning.svg);
    --path-solid-colored-cart: url(/resource/img/mmk/kds3_5/ico/solid/colored/cart.svg);
    --path-solid-colored-chat_heart: url(/resource/img/mmk/kds3_5/ico/solid/colored/chat_heart.svg);
    --path-solid-colored-check: url(/resource/img/mmk/kds3_5/ico/solid/colored/check.svg);
    --path-solid-colored-check_ico-pri-active: url(/resource/img/mmk/kds3_5/ico/solid/colored/check_ico-pri-active.svg);
    --path-solid-colored-check_ico-pri-error: url(/resource/img/mmk/kds3_5/ico/solid/colored/check_ico-pri-error.svg);
    --path-solid-colored-check_ico-pri-invert: url(/resource/img/mmk/kds3_5/ico/solid/colored/check_ico-pri-invert.svg);
    --path-solid-colored-check_ico-pri-like: url(/resource/img/mmk/kds3_5/ico/solid/colored/check_ico-pri-like.svg);
    --path-solid-colored-check_ico-pri-success: url(/resource/img/mmk/kds3_5/ico/solid/colored/check_ico-pri-success.svg);
    --path-solid-colored-check_ico-sec-active: url(/resource/img/mmk/kds3_5/ico/solid/colored/check_ico-sec-active.svg);
    --path-solid-colored-check_ico-ter: url(/resource/img/mmk/kds3_5/ico/solid/colored/check_ico-ter.svg);
    --path-solid-colored-check_ico-ter-active: url(/resource/img/mmk/kds3_5/ico/solid/colored/check_ico-ter-active.svg);
    --path-solid-colored-circle_arrow_in: url(/resource/img/mmk/kds3_5/ico/solid/colored/circle_arrow_in.svg);
    --path-solid-colored-circle_arrow_out: url(/resource/img/mmk/kds3_5/ico/solid/colored/circle_arrow_out.svg);
    --path-solid-colored-clock: url(/resource/img/mmk/kds3_5/ico/solid/colored/clock.svg);
    --path-solid-colored-confetti: url(/resource/img/mmk/kds3_5/ico/solid/colored/confetti.svg);
    --path-solid-colored-coupon: url(/resource/img/mmk/kds3_5/ico/solid/colored/coupon.svg);
    --path-solid-colored-cross: url(/resource/img/mmk/kds3_5/ico/solid/colored/cross.svg);
    --path-solid-colored-cvs: url(/resource/img/mmk/kds3_5/ico/solid/colored/cvs.svg);
    --path-solid-colored-error: url(/resource/img/mmk/kds3_5/ico/solid/colored/error.svg);
    --path-solid-colored-etc: url(/resource/img/mmk/kds3_5/ico/solid/colored/etc.svg);
    --path-solid-colored-event: url(/resource/img/mmk/kds3_5/ico/solid/colored/event.svg);
    --path-solid-colored-exclamation_circle_ico-pri-active: url(/resource/img/mmk/kds3_5/ico/solid/colored/exclamation_circle_ico-pri-active.svg);
    --path-solid-colored-exclamation_circle_ico-pri-error: url(/resource/img/mmk/kds3_5/ico/solid/colored/exclamation_circle_ico-pri-error.svg);
    --path-solid-colored-exclamation_circle_ico-pri-invert: url(/resource/img/mmk/kds3_5/ico/solid/colored/exclamation_circle_ico-pri-invert.svg);
    --path-solid-colored-exclamation_circle_ico-pri-like: url(/resource/img/mmk/kds3_5/ico/solid/colored/exclamation_circle_ico-pri-like.svg);
    --path-solid-colored-exclamation_circle_ico-pri-success: url(/resource/img/mmk/kds3_5/ico/solid/colored/exclamation_circle_ico-pri-success.svg);
    --path-solid-colored-exclamation_circle_ico-sec-active: url(/resource/img/mmk/kds3_5/ico/solid/colored/exclamation_circle_ico-sec-active.svg);
    --path-solid-colored-exclamation_circle_ico-ter: url(/resource/img/mmk/kds3_5/ico/solid/colored/exclamation_circle_ico-ter.svg);
    --path-solid-colored-exclamation_circle_ico-ter-active: url(/resource/img/mmk/kds3_5/ico/solid/colored/exclamation_circle_ico-ter-active.svg);
    --path-solid-colored-fee_waiver: url(/resource/img/mmk/kds3_5/ico/solid/colored/fee_waiver.svg);
    --path-solid-colored-finance: url(/resource/img/mmk/kds3_5/ico/solid/colored/finance.svg);
    --path-solid-colored-flag: url(/resource/img/mmk/kds3_5/ico/solid/colored/flag.svg);
    --path-solid-colored-food: url(/resource/img/mmk/kds3_5/ico/solid/colored/food.svg);
    --path-solid-colored-gas: url(/resource/img/mmk/kds3_5/ico/solid/colored/gas.svg);
    --path-solid-colored-gift: url(/resource/img/mmk/kds3_5/ico/solid/colored/gift.svg);
    --path-solid-colored-glob: url(/resource/img/mmk/kds3_5/ico/solid/colored/glob.svg);
    --path-solid-colored-graduation: url(/resource/img/mmk/kds3_5/ico/solid/colored/graduation.svg);
    --path-solid-colored-guaranteed_loan: url(/resource/img/mmk/kds3_5/ico/solid/colored/guaranteed_loan.svg);
    --path-solid-colored-guaranteed_loan_vo: url(/resource/img/mmk/kds3_5/ico/solid/colored/guaranteed_loan_vo.svg);
    --path-solid-colored-heart_ico-pri-active: url(/resource/img/mmk/kds3_5/ico/solid/colored/heart_ico-pri-active.svg);
    --path-solid-colored-heart_ico-pri-error: url(/resource/img/mmk/kds3_5/ico/solid/colored/heart_ico-pri-error.svg);
    --path-solid-colored-heart_ico-pri-invert: url(/resource/img/mmk/kds3_5/ico/solid/colored/heart_ico-pri-invert.svg);
    --path-solid-colored-heart_ico-pri-like: url(/resource/img/mmk/kds3_5/ico/solid/colored/heart_ico-pri-like.svg);
    --path-solid-colored-heart_ico-pri-success: url(/resource/img/mmk/kds3_5/ico/solid/colored/heart_ico-pri-success.svg);
    --path-solid-colored-heart_ico-sec-active: url(/resource/img/mmk/kds3_5/ico/solid/colored/heart_ico-sec-active.svg);
    --path-solid-colored-heart_ico-ter: url(/resource/img/mmk/kds3_5/ico/solid/colored/heart_ico-ter.svg);
    --path-solid-colored-heart_ico-ter-active: url(/resource/img/mmk/kds3_5/ico/solid/colored/heart_ico-ter-active.svg);
    --path-solid-colored-home: url(/resource/img/mmk/kds3_5/ico/solid/colored/home.svg);
    --path-solid-colored-home_ceo: url(/resource/img/mmk/kds3_5/ico/solid/colored/home_ceo.svg);
    --path-solid-colored-home_loan: url(/resource/img/mmk/kds3_5/ico/solid/colored/home_loan.svg);
    --path-solid-colored-home_loan_vo: url(/resource/img/mmk/kds3_5/ico/solid/colored/home_loan_vo.svg);
    --path-solid-colored-housing: url(/resource/img/mmk/kds3_5/ico/solid/colored/housing.svg);
    --path-solid-colored-income: url(/resource/img/mmk/kds3_5/ico/solid/colored/income.svg);
    --path-solid-colored-institution: url(/resource/img/mmk/kds3_5/ico/solid/colored/institution.svg);
    --path-solid-colored-interest: url(/resource/img/mmk/kds3_5/ico/solid/colored/interest.svg);
    --path-solid-colored-investment: url(/resource/img/mmk/kds3_5/ico/solid/colored/investment.svg);
    --path-solid-colored-letter: url(/resource/img/mmk/kds3_5/ico/solid/colored/letter.svg);
    --path-solid-colored-life: url(/resource/img/mmk/kds3_5/ico/solid/colored/life.svg);
    --path-solid-colored-like: url(/resource/img/mmk/kds3_5/ico/solid/colored/like.svg);
    --path-solid-colored-loan: url(/resource/img/mmk/kds3_5/ico/solid/colored/loan.svg);
    --path-solid-colored-lock: url(/resource/img/mmk/kds3_5/ico/solid/colored/lock.svg);
    --path-solid-colored-lock_add: url(/resource/img/mmk/kds3_5/ico/solid/colored/lock_add.svg);
    --path-solid-colored-lock_error: url(/resource/img/mmk/kds3_5/ico/solid/colored/lock_error.svg);
    --path-solid-colored-lock_success: url(/resource/img/mmk/kds3_5/ico/solid/colored/lock_success.svg);
    --path-solid-colored-lock_switch: url(/resource/img/mmk/kds3_5/ico/solid/colored/lock_switch.svg);
    --path-solid-colored-lock_warning: url(/resource/img/mmk/kds3_5/ico/solid/colored/lock_warning.svg);
    --path-solid-colored-lugage: url(/resource/img/mmk/kds3_5/ico/solid/colored/lugage.svg);
    --path-solid-colored-luggage: url(/resource/img/mmk/kds3_5/ico/solid/colored/luggage.svg);
    --path-solid-colored-message: url(/resource/img/mmk/kds3_5/ico/solid/colored/message.svg);
    --path-solid-colored-message_add: url(/resource/img/mmk/kds3_5/ico/solid/colored/message_add.svg);
    --path-solid-colored-message_check: url(/resource/img/mmk/kds3_5/ico/solid/colored/message_check.svg);
    --path-solid-colored-message_error: url(/resource/img/mmk/kds3_5/ico/solid/colored/message_error.svg);
    --path-solid-colored-message_switch: url(/resource/img/mmk/kds3_5/ico/solid/colored/message_switch.svg);
    --path-solid-colored-message_warning: url(/resource/img/mmk/kds3_5/ico/solid/colored/message_warning.svg);
    --path-solid-colored-mirror: url(/resource/img/mmk/kds3_5/ico/solid/colored/mirror.svg);
    --path-solid-colored-moneybag_loan: url(/resource/img/mmk/kds3_5/ico/solid/colored/moneybag_loan.svg);
    --path-solid-colored-moneybag_loan_vo: url(/resource/img/mmk/kds3_5/ico/solid/colored/moneybag_loan_vo.svg);
    --path-solid-colored-movie: url(/resource/img/mmk/kds3_5/ico/solid/colored/movie.svg);
    --path-solid-colored-none: url(/resource/img/mmk/kds3_5/ico/solid/colored/none.svg);
    --path-solid-colored-notice: url(/resource/img/mmk/kds3_5/ico/solid/colored/notice.svg);
    --path-solid-colored-null_account_krw: url(/resource/img/mmk/kds3_5/ico/solid/colored/null_account_krw.svg);
    --path-solid-colored-null_bag_krw: url(/resource/img/mmk/kds3_5/ico/solid/colored/null_bag_krw.svg);
    --path-solid-colored-null_card: url(/resource/img/mmk/kds3_5/ico/solid/colored/null_card.svg);
    --path-solid-colored-null_coupon: url(/resource/img/mmk/kds3_5/ico/solid/colored/null_coupon.svg);
    --path-solid-colored-null_exclamation_circle: url(/resource/img/mmk/kds3_5/ico/solid/colored/null_exclamation_circle.svg);
    --path-solid-colored-null_paper: url(/resource/img/mmk/kds3_5/ico/solid/colored/null_paper.svg);
    --path-solid-colored-pencil: url(/resource/img/mmk/kds3_5/ico/solid/colored/pencil.svg);
    --path-solid-colored-phone: url(/resource/img/mmk/kds3_5/ico/solid/colored/phone.svg);
    --path-solid-colored-phone_add: url(/resource/img/mmk/kds3_5/ico/solid/colored/phone_add.svg);
    --path-solid-colored-phone_check: url(/resource/img/mmk/kds3_5/ico/solid/colored/phone_check.svg);
    --path-solid-colored-phone_error: url(/resource/img/mmk/kds3_5/ico/solid/colored/phone_error.svg);
    --path-solid-colored-phone_money: url(/resource/img/mmk/kds3_5/ico/solid/colored/phone_money.svg);
    --path-solid-colored-phone_switch: url(/resource/img/mmk/kds3_5/ico/solid/colored/phone_switch.svg);
    --path-solid-colored-phone_warning: url(/resource/img/mmk/kds3_5/ico/solid/colored/phone_warning.svg);
    --path-solid-colored-phone_wifi: url(/resource/img/mmk/kds3_5/ico/solid/colored/phone_wifi.svg);
    --path-solid-colored-pill: url(/resource/img/mmk/kds3_5/ico/solid/colored/pill.svg);
    --path-solid-colored-point: url(/resource/img/mmk/kds3_5/ico/solid/colored/point.svg);
    --path-solid-colored-popcorn: url(/resource/img/mmk/kds3_5/ico/solid/colored/popcorn.svg);
    --path-solid-colored-review: url(/resource/img/mmk/kds3_5/ico/solid/colored/review.svg);
    --path-solid-colored-reward: url(/resource/img/mmk/kds3_5/ico/solid/colored/reward.svg);
    --path-solid-colored-ring: url(/resource/img/mmk/kds3_5/ico/solid/colored/ring.svg);
    --path-solid-colored-rocket: url(/resource/img/mmk/kds3_5/ico/solid/colored/rocket.svg);
    --path-solid-colored-search: url(/resource/img/mmk/kds3_5/ico/solid/colored/search.svg);
    --path-solid-colored-shield: url(/resource/img/mmk/kds3_5/ico/solid/colored/shield.svg);
    --path-solid-colored-shopping: url(/resource/img/mmk/kds3_5/ico/solid/colored/shopping.svg);
    --path-solid-colored-shopping_travel: url(/resource/img/mmk/kds3_5/ico/solid/colored/shopping_travel.svg);
    --path-solid-colored-star_ico-pri-active: url(/resource/img/mmk/kds3_5/ico/solid/colored/star_ico-pri-active.svg);
    --path-solid-colored-star_ico-pri-error: url(/resource/img/mmk/kds3_5/ico/solid/colored/star_ico-pri-error.svg);
    --path-solid-colored-star_ico-pri-invert: url(/resource/img/mmk/kds3_5/ico/solid/colored/star_ico-pri-invert.svg);
    --path-solid-colored-star_ico-pri-like: url(/resource/img/mmk/kds3_5/ico/solid/colored/star_ico-pri-like.svg);
    --path-solid-colored-star_ico-pri-success: url(/resource/img/mmk/kds3_5/ico/solid/colored/star_ico-pri-success.svg);
    --path-solid-colored-star_ico-sec-active: url(/resource/img/mmk/kds3_5/ico/solid/colored/star_ico-sec-active.svg);
    --path-solid-colored-star_ico-ter: url(/resource/img/mmk/kds3_5/ico/solid/colored/star_ico-ter.svg);
    --path-solid-colored-star_ico-ter-active: url(/resource/img/mmk/kds3_5/ico/solid/colored/star_ico-ter-active.svg);
    --path-solid-colored-stroller: url(/resource/img/mmk/kds3_5/ico/solid/colored/stroller.svg);
    --path-solid-colored-success: url(/resource/img/mmk/kds3_5/ico/solid/colored/success.svg);
    --path-solid-colored-switch: url(/resource/img/mmk/kds3_5/ico/solid/colored/switch.svg);
    --path-solid-colored-switch_bu: url(/resource/img/mmk/kds3_5/ico/solid/colored/switch_bu.svg);
    --path-solid-colored-taxi: url(/resource/img/mmk/kds3_5/ico/solid/colored/taxi.svg);
    --path-solid-colored-tennis_ball: url(/resource/img/mmk/kds3_5/ico/solid/colored/tennis_ball.svg);
    --path-solid-colored-train: url(/resource/img/mmk/kds3_5/ico/solid/colored/train.svg);
    --path-solid-colored-transfer: url(/resource/img/mmk/kds3_5/ico/solid/colored/transfer.svg);
    --path-solid-colored-umbrella: url(/resource/img/mmk/kds3_5/ico/solid/colored/umbrella.svg);
    --path-solid-colored-user: url(/resource/img/mmk/kds3_5/ico/solid/colored/user.svg);
    --path-solid-colored-users: url(/resource/img/mmk/kds3_5/ico/solid/colored/users.svg);
    --path-solid-colored-warning: url(/resource/img/mmk/kds3_5/ico/solid/colored/warning.svg);
    --path-solid-colored-warning_yl: url(/resource/img/mmk/kds3_5/ico/solid/colored/warning_yl.svg);
    --path-component-tooltip-anchor_small_black: url(/resource/img/mmk/kds3_5/ico/component/tooltip/anchor_small_black.svg);
    --path-component-tooltip-anchor_small_default: url(/resource/img/mmk/kds3_5/ico/component/tooltip/anchor_small_default.svg);
    --path-component-tooltip-anchor_small_white: url(/resource/img/mmk/kds3_5/ico/component/tooltip/anchor_small_white.svg);
    --path-component-tooltip-anchor_default_black: url(/resource/img/mmk/kds3_5/ico/component/tooltip/anchor_default_black.svg);
    --path-component-tooltip-anchor_default_default: url(/resource/img/mmk/kds3_5/ico/component/tooltip/anchor_default_default.svg);
    --path-component-tooltip-anchor_default_white: url(/resource/img/mmk/kds3_5/ico/component/tooltip/anchor_default_white.svg);
    --path-component-tooltip-anchor_default_white: url(/resource/img/mmk/kds3_5/ico/component/tooltip/anchor_default_white.svg);
    --path-component-tooltip-anchor_default_default_blue1: url(/resource/img/mmk/kds3_5/ico/component/tooltip/anchor_default_default_blue1.svg);
    --path-3d-achieve-medal_star_silver: url(/resource/img/mmk/kds3_5/3d/achieve/medal_star_silver.png);
    --path-3d-arrow-exchange_glass_navy_leftup: url(/resource/img/mmk/kds3_5/3d/arrow/exchange_glass_navy_leftup.png);
    --path-3d-arrow-exchange_navy_leftup: url(/resource/img/mmk/kds3_5/3d/arrow/exchange_navy_leftup.png);
    --path-3d-arrow-rotate_glass_navy_leftup: url(/resource/img/mmk/kds3_5/3d/arrow/rotate_glass_navy_leftup.png);
    --path-3d-bank-account_close_navy: url(/resource/img/mmk/kds3_5/3d/bank/account_close_navy.png);
    --path-3d-bank-account_close_navy_left: url(/resource/img/mmk/kds3_5/3d/bank/account_close_navy_left.png);
    --path-3d-bank-account_close_navy_rightup: url(/resource/img/mmk/kds3_5/3d/bank/account_close_navy_rightup.png);
    --path-3d-bank-creditcard_blank_navy_left: url(/resource/img/mmk/kds3_5/3d/bank/creditcard_blank_navy_left.png);
    --path-3d-bank-creditcard_blank_navy_up: url(/resource/img/mmk/kds3_5/3d/bank/creditcard_blank_navy_up.png);
    --path-3d-bank-envelope_horizontal_open_1000_navy: url(/resource/img/mmk/kds3_5/3d/bank/envelope_horizontal_open_1000_navy.png);
    --path-3d-bank-envelope_horizontal_open_10000_navy: url(/resource/img/mmk/kds3_5/3d/bank/envelope_horizontal_open_10000_navy.png);
    --path-3d-bank-envelope_horizontal_open_50000_navy: url(/resource/img/mmk/kds3_5/3d/bank/envelope_horizontal_open_50000_navy.png);
    --path-3d-bank-envelope_vertical_white: url(/resource/img/mmk/kds3_5/3d/bank/envelope_vertical_white.png);
    --path-3d-bank-gold_ticket_combi: url(/resource/img/mmk/kds3_5/3d/bank/gold_ticket_combi.png);
    --path-3d-bank-vault_open_navy_left: url(/resource/img/mmk/kds3_5/3d/bank/vault_open_navy_left.png);
    --path-3d-bank-account_close_navy_right: url(/resource/img/mmk/kds3_5/3d/bank/account_close_navy_right.png);
    --path-3d-bill-10000_bundle_iso_white: url(/resource/img/mmk/kds3_5/3d/bill/10000_bundle_iso_white.png);
    --path-3d-bill-10000_portrait_bundle_iso_white: url(/resource/img/mmk/kds3_5/3d/bill/10000_portrait_bundle_iso_white.png);
    --path-3d-bill-50000_bundle_iso_white: url(/resource/img/mmk/kds3_5/3d/bill/50000_bundle_iso_white.png);
    --path-3d-building-house_navy_iso: url(/resource/img/mmk/kds3_5/3d/building/house_navy_iso.png);
    --path-3d-celeb-confetti_navy_rightup: url(/resource/img/mmk/kds3_5/3d/celeb/confetti_navy_rightup.png);
    --path-3d-coin-bitcoin_orange_rightup: url(/resource/img/mmk/kds3_5/3d/coin/bitcoin_orange_rightup.png);
    --path-3d-coin-krw_navy: url(/resource/img/mmk/kds3_5/3d/coin/krw_navy.png);
    --path-3d-document-file_navy_iso: url(/resource/img/mmk/kds3_5/3d/document/file_navy_iso.png);
    --path-3d-document-folder_silver_left: url(/resource/img/mmk/kds3_5/3d/document/folder_silver_left.png);
    --path-3d-document-graduationcap: url(/resource/img/mmk/kds3_5/3d/document/graduationcap.png);
    --path-3d-emoji-negative_angry2_red: url(/resource/img/mmk/kds3_5/3d/emoji/negative_angry2_red.png);
    --path-3d-emoji-negative_blue: url(/resource/img/mmk/kds3_5/3d/emoji/negative_blue.png);
    --path-3d-emoji-negative_blue_typing: url(/resource/img/mmk/kds3_5/3d/emoji/negative_blue_typing.png);
    --path-3d-emoji-negative_devil_red: url(/resource/img/mmk/kds3_5/3d/emoji/negative_devil_red.png);
    --path-3d-emoji-negative_dislike_blue: url(/resource/img/mmk/kds3_5/3d/emoji/negative_dislike_blue.png);
    --path-3d-emoji-negative_dislike_red: url(/resource/img/mmk/kds3_5/3d/emoji/negative_dislike_red.png);
    --path-3d-emoji-negative_embarrass_blue: url(/resource/img/mmk/kds3_5/3d/emoji/negative_embarrass_blue.png);
    --path-3d-emoji-negative_sad_blue: url(/resource/img/mmk/kds3_5/3d/emoji/negative_sad_blue.png);
    --path-3d-emoji-positive_happy_yellow: url(/resource/img/mmk/kds3_5/3d/emoji/positive_happy_yellow.png);
    --path-3d-emoji-positive_heart_yellow: url(/resource/img/mmk/kds3_5/3d/emoji/positive_heart_yellow.png);
    --path-3d-emoji-positive_smile1_yellow_heart: url(/resource/img/mmk/kds3_5/3d/emoji/positive_smile1_yellow_heart.png);
    --path-3d-emoji-positive_smile3_yellow: url(/resource/img/mmk/kds3_5/3d/emoji/positive_smile3_yellow.png);
    --path-3d-emoji-positive_yellow: url(/resource/img/mmk/kds3_5/3d/emoji/positive_yellow.png);
    --path-3d-emoji-positive_yellow_question: url(/resource/img/mmk/kds3_5/3d/emoji/positive_yellow_question.png);
    --path-3d-emoji-positive_yellow_typing: url(/resource/img/mmk/kds3_5/3d/emoji/positive_yellow_typing.png);
    --path-3d-etc-heart_red: url(/resource/img/mmk/kds3_5/3d/etc/heart_red.png);
    --path-3d-etc-joystick_navy: url(/resource/img/mmk/kds3_5/3d/etc/joystick_navy.png);
    --path-3d-etc-lucky_clover_green_left: url(/resource/img/mmk/kds3_5/3d/etc/lucky_clover_green_left.png);
    --path-3d-etc-star_left_blue: url(/resource/img/mmk/kds3_5/3d/etc/star_left_blue.png);
    --path-3d-gift-navy_left: url(/resource/img/mmk/kds3_5/3d/gift/navy_left.png);
    --path-3d-gift-navy_left_tiltup2: url(/resource/img/mmk/kds3_5/3d/gift/navy_left_tiltup2.png);
    --path-3d-gift-navy_left_2: url(/resource/img/mmk/kds3_5/3d/gift/navy_left_2.png);
    --path-3d-glob-earth_green_airplane: url(/resource/img/mmk/kds3_5/3d/glob/earth_green_airplane.png);
    --path-3d-graph-bar_navy: url(/resource/img/mmk/kds3_5/3d/graph/bar_navy.png);
    --path-3d-graph-circle_leftup: url(/resource/img/mmk/kds3_5/3d/graph/circle_leftup.png);
    --path-3d-graph-stock_down: url(/resource/img/mmk/kds3_5/3d/graph/stock_down.png);
    --path-3d-graph-stock_up: url(/resource/img/mmk/kds3_5/3d/graph/stock_up.png);
    --path-3d-hand-clap_point: url(/resource/img/mmk/kds3_5/3d/hand/clap_point.png);
    --path-3d-hand-give_coin_krw_gold: url(/resource/img/mmk/kds3_5/3d/hand/give_coin_krw_gold.png);
    --path-3d-hand-give_heart_navy: url(/resource/img/mmk/kds3_5/3d/hand/give_heart_navy.png);
    --path-3d-hand-give_heart_red: url(/resource/img/mmk/kds3_5/3d/hand/give_heart_red.png);
    --path-3d-hand-give_moneybag_navy: url(/resource/img/mmk/kds3_5/3d/hand/give_moneybag_navy.png);
    --path-3d-hand-give_wallet_full: url(/resource/img/mmk/kds3_5/3d/hand/give_wallet_full.png);
    --path-3d-hand-grasp_credit_card_navy_left: url(/resource/img/mmk/kds3_5/3d/hand/grasp_credit_card_navy_left.png);
    --path-3d-industry-chemystry: url(/resource/img/mmk/kds3_5/3d/industry/chemystry.png);
    --path-3d-industry-cloud: url(/resource/img/mmk/kds3_5/3d/industry/cloud.png);
    --path-3d-industry-ironpipe: url(/resource/img/mmk/kds3_5/3d/industry/ironpipe.png);
    --path-3d-industry-microchip: url(/resource/img/mmk/kds3_5/3d/industry/microchip.png);
    --path-3d-industry-robot_blue: url(/resource/img/mmk/kds3_5/3d/industry/robot_blue.png);
    --path-3d-industry-safety_helmet_yellow: url(/resource/img/mmk/kds3_5/3d/industry/safety_helmet_yellow.png);
    --path-3d-life-basket_navy_leftup: url(/resource/img/mmk/kds3_5/3d/life/basket_navy_leftup.png);
    --path-3d-life-dumbbell: url(/resource/img/mmk/kds3_5/3d/life/dumbbell.png);
    --path-3d-life-fashion_white: url(/resource/img/mmk/kds3_5/3d/life/fashion_white.png);
    --path-3d-life-juice_navy_tiltright: url(/resource/img/mmk/kds3_5/3d/life/juice_navy_tiltright.png);
    --path-3d-life-lipstick: url(/resource/img/mmk/kds3_5/3d/life/lipstick.png);
    --path-3d-life-movie_black: url(/resource/img/mmk/kds3_5/3d/life/movie_black.png);
    --path-3d-life-plant: url(/resource/img/mmk/kds3_5/3d/life/plant.png);
    --path-3d-life-rice: url(/resource/img/mmk/kds3_5/3d/life/rice.png);
    --path-3d-life-trip_palmtree: url(/resource/img/mmk/kds3_5/3d/life/trip_palmtree.png);
    --path-3d-life-washingmachine: url(/resource/img/mmk/kds3_5/3d/life/washingmachine.png);
    --path-3d-medical-drug_combination_light_blue: url(/resource/img/mmk/kds3_5/3d/medical/drug_combination_light_blue.png);
    --path-3d-mobile-kbank_navy_leftup2: url(/resource/img/mmk/kds3_5/3d/mobile/kbank_navy_leftup2.png);
    --path-3d-moneybag-krw_navy: url(/resource/img/mmk/kds3_5/3d/moneybag/krw_navy.png);
    --path-3d-moneybag-krw_navy_left: url(/resource/img/mmk/kds3_5/3d/moneybag/krw_navy_left.png);
    --path-3d-moneybag-krw_navy_rightup: url(/resource/img/mmk/kds3_5/3d/moneybag/krw_navy_rightup.png);
    --path-3d-moneybag-krw_white: url(/resource/img/mmk/kds3_5/3d/moneybag/krw_white.png);
    --path-3d-moneybag-krw_white_left: url(/resource/img/mmk/kds3_5/3d/moneybag/krw_white_left.png);
    --path-3d-notice-bell_off_navy: url(/resource/img/mmk/kds3_5/3d/notice/bell_off_navy.png);
    --path-3d-notice-bell_off_silver: url(/resource/img/mmk/kds3_5/3d/notice/bell_off_silver.png);
    --path-3d-notice-bulb_on_white: url(/resource/img/mmk/kds3_5/3d/notice/bulb_on_white.png);
    --path-3d-notice-calendar_blank_white_left: url(/resource/img/mmk/kds3_5/3d/notice/calendar_blank_white_left.png);
    --path-3d-notice-calendar_paper_check_left: url(/resource/img/mmk/kds3_5/3d/notice/calendar_paper_check_left.png);
    --path-3d-notice-hourglass: url(/resource/img/mmk/kds3_5/3d/notice/hourglass.png);
    --path-3d-notice-megaphone_off_navy_right: url(/resource/img/mmk/kds3_5/3d/notice/megaphone_off_navy_right.png);
    --path-3d-notice-megaphone_off_white_right: url(/resource/img/mmk/kds3_5/3d/notice/megaphone_off_white_right.png);
    --path-3d-notice-mic_front: url(/resource/img/mmk/kds3_5/3d/notice/mic_front.png);
    --path-3d-notice-timer_white: url(/resource/img/mmk/kds3_5/3d/notice/timer_white.png);
    --path-3d-notice-timer_white_left_tiltright: url(/resource/img/mmk/kds3_5/3d/notice/timer_white_left_tiltright.png);
    --path-3d-setting-chain_connect_off_navy: url(/resource/img/mmk/kds3_5/3d/setting/chain_connect_off_navy.png);
    --path-3d-setting-chain_connect_on_navy: url(/resource/img/mmk/kds3_5/3d/setting/chain_connect_on_navy.png);
    --path-3d-setting-loading_circle_navy: url(/resource/img/mmk/kds3_5/3d/setting/loading_circle_navy.png);
    --path-3d-setting-lock_navy_leftup: url(/resource/img/mmk/kds3_5/3d/setting/lock_navy_leftup.png);
    --path-3d-setting-shield_check_navy_leftuup: url(/resource/img/mmk/kds3_5/3d/setting/shield_check_navy_leftuup.png);
    --path-3d-setting-shield_check_white_leftup: url(/resource/img/mmk/kds3_5/3d/setting/shield_check_white_leftup.png);
    --path-3d-setting-warningsign_red: url(/resource/img/mmk/kds3_5/3d/setting/warningsign_red.png);
    --path-3d-shop-shop_B_navy_iso: url(/resource/img/mmk/kds3_5/3d/shop/shop_B_navy_iso.png);
    --path-3d-store-diamond_left_tiltright: url(/resource/img/mmk/kds3_5/3d/store/diamond_left_tiltright.png);
    --path-3d-store-percent_plate_navy_leftup: url(/resource/img/mmk/kds3_5/3d/store/percent_plate_navy_leftup.png);
    --path-3d-store-shop_A_navy_down: url(/resource/img/mmk/kds3_5/3d/store/shop_A_navy_down.png);
    --path-3d-store-shop_A_navy_iso: url(/resource/img/mmk/kds3_5/3d/store/shop_A_navy_iso.png);
    --path-3d-store-sunglass_navy_left: url(/resource/img/mmk/kds3_5/3d/store/sunglass_navy_left.png);
    --path-3d-talk-circle_exclamation_navy: url(/resource/img/mmk/kds3_5/3d/talk/circle_exclamation_navy.png);
    --path-3d-talk-circle_exclamation_white: url(/resource/img/mmk/kds3_5/3d/talk/circle_exclamation_white.png);
    --path-3d-talk-cloud_question_navy: url(/resource/img/mmk/kds3_5/3d/talk/cloud_question_navy.png);
    --path-3d-traffic-car_navy_iso: url(/resource/img/mmk/kds3_5/3d/traffic/car_navy_iso.png);
    --path-3d-traffic-ev_white_iso: url(/resource/img/mmk/kds3_5/3d/traffic/ev_white_iso.png);
    --path-3d-traffic-rocket_navy: url(/resource/img/mmk/kds3_5/3d/traffic/rocket_navy.png);
    --path-3d-traffic-ship_navy: url(/resource/img/mmk/kds3_5/3d/traffic/ship_navy.png);
    --path-3d-traffic-tank_green: url(/resource/img/mmk/kds3_5/3d/traffic/tank_green.png);
    --path-3d-traffic-truck_navy_right: url(/resource/img/mmk/kds3_5/3d/traffic/truck_navy_right.png);
    --path-3d-achieve-medal_star_silver_12x: url(/resource/img/mmk/kds3_5/3d/achieve/medal_star_silver_12x.png);
    --path-3d-achieve-trophy_star_silver_12x: url(/resource/img/mmk/kds3_5/3d/achieve/trophy_star_silver_12x.png);
    --path-3d-arrow-exchange_navy_leftup_12x: url(/resource/img/mmk/kds3_5/3d/arrow/exchange_navy_leftup_12x.png);
    --path-3d-celeb-confetti_navy_rightup_12x: url(/resource/img/mmk/kds3_5/3d/celeb/confetti_navy_rightup_12x.png);
    --path-3d-document-file_navy_iso_12x: url(/resource/img/mmk/kds3_5/3d/document/file_navy_iso_12x.png);
    --path-3d-emoji-negative_embarrass_blue_12x: url(/resource/img/mmk/kds3_5/3d/emoji/negative_embarrass_blue_12x.png);
    --path-3d-emoji-negative_sad_blue_12x: url(/resource/img/mmk/kds3_5/3d/emoji/negative_sad_blue_12x.png);
    --path-3d-emoji-positive_bigeye_yellow_12x: url(/resource/img/mmk/kds3_5/3d/emoji/positive_bigeye_yellow_12x.png);
    --path-3d-emoji-positive_happy_yellow_12x: url(/resource/img/mmk/kds3_5/3d/emoji/positive_happy_yellow_12x.png);
    --path-3d-emoji-positive_happy_yellow_heart_navy_12x: url(/resource/img/mmk/kds3_5/3d/emoji/positive_happy_yellow_heart_navy_12x.png);
    --path-3d-emoji-positive_smile3_yellow_12x: url(/resource/img/mmk/kds3_5/3d/emoji/positive_smile3_yellow_12x.png);
    --path-3d-emoji-positive_yellow_typing_12x: url(/resource/img/mmk/kds3_5/3d/emoji/positive_yellow_typing_12x.png);
    --path-3d-etc-lucky_clover_green_left_12x: url(/resource/img/mmk/kds3_5/3d/etc/lucky_clover_green_left_12x.png);
    --path-3d-gift-navy_left_tiltup2_12x: url(/resource/img/mmk/kds3_5/3d/gift/navy_left_tiltup2_12x.png);
    --path-3d-hand-give_heart_red_12x: url(/resource/img/mmk/kds3_5/3d/hand/give_heart_red_12x.png);
    --path-3d-hand-grasp_search_blank_right_12x: url(/resource/img/mmk/kds3_5/3d/hand/grasp_search_blank_right_12x.png);
    --path-3d-medical-heart_beat_navy_12x: url(/resource/img/mmk/kds3_5/3d/medical/heart_beat_navy_12x.png);
    --path-3d-moneybag-krw_navy_leftup_12x: url(/resource/img/mmk/kds3_5/3d/moneybag/krw_navy_leftup_12x.png);
    --path-3d-notice-megaphone_on_white_right_12x: url(/resource/img/mmk/kds3_5/3d/notice/megaphone_on_white_right_12x.png);
    --path-3d-notice-timer_white_12x: url(/resource/img/mmk/kds3_5/3d/notice/timer_white_12x.png);
    --path-3d-setting-circle_check_white_12x: url(/resource/img/mmk/kds3_5/3d/setting/circle_check_white_12x.png);
    --path-3d-setting-loading_circle_navy_12x: url(/resource/img/mmk/kds3_5/3d/setting/loading_circle_navy_12x.png);
    --path-3d-setting-lock_navy_leftup_12x: url(/resource/img/mmk/kds3_5/3d/setting/lock_navy_leftup_12x.png);
    --path-3d-setting-shield_check_navy_left_12x: url(/resource/img/mmk/kds3_5/3d/setting/shield_check_navy_left_12x.png);
    --path-3d-store-shop_A_navy_down_12x: url(/resource/img/mmk/kds3_5/3d/store/shop_A_navy_down_12x.png);
    --path-3d-talk-cloud_question_white_12x: url(/resource/img/mmk/kds3_5/3d/talk/cloud_question_white_12x.png);
    --path-3d-talk-square_exclamation_white_12x: url(/resource/img/mmk/kds3_5/3d/talk/square_exclamation_white_12x.png);
    --path-square-logo_etc_hf: url(/resource/img/mmk/kds3_5/logo/square/logo_etc_hf.png);
    --path-square-logo_etc_gcgf: url(/resource/img/mmk/kds3_5/logo/square/logo_etc_gcgf.png)
}

/*!
* notch Header for main mixin
*/

/*! webfont */

@font-face {
    font-family: 'Pretendard K Edition';
    font-style: normal;
    font-display: swap;
    font-weight: 400;
    src: url("font/PretendardKEdition-Regular-1303-subset.woff2") format("woff2"), url("font/PretendardKEdition-Regular-1303-subset.woff") format("woff")
}

@font-face {
    font-family: 'Pretendard K Edition';
    font-style: normal;
    font-display: swap;
    font-weight: 700;
    src: url("font/PretendardKEdition-Bold-1303-subset.woff2") format("woff2"), url("font/PretendardKEdition-Bold-1303-subset.woff") format("woff")
}

@font-face {
    font-family: 'Pretendard K Edition';
    font-style: normal;
    font-display: swap;
    font-weight: 500;
    src: url("font/PretendardKEdition-Medium-1303-subset.woff2") format("woff2"), url("font/PretendardKEdition-Medium-1303-subset.woff") format("woff")
}

/*! reset */

*,
*::after,
*::before {
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

html {
    -webkit-text-size-adjust: 100%;
    -moz-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    text-size-adjust: 100%;
    font-size: 10px;
    font-weight: 400;
    line-height: 1.15;
    word-break: break-all;
    word-wrap: break-word;
    letter-spacing: 0
}

@media (max-width: 375px) {
    html {
        font-size: calc(10px + 20 * ((100vw - 375px) / 750)) !important
    }
}

html.mobile #wrap-mmk *:not([class*="ui-"]>*) {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

html.pc_m.mobile #wrap-mmk * {
    -webkit-user-select: inherit;
    -moz-user-select: inherit;
    -ms-user-select: inherit;
    user-select: inherit
}

html.font-large {
    font-size: 70% !important
}

article,
aside,
audio,
blockquote,
body,
canvas,
code,
dd,
details,
div,
dl,
dt,
fieldset,
figcaption,
figure,
footer,
form,
h1,
h2,
h3,
h4,
h5,
h6,
header,
hgroup,
input,
legend,
li,
mark,
nav,
ol,
p,
pre,
section,
td,
textarea,
th,
time,
ul,
video {
    margin: 0;
    padding: 0
}

body {
    color: var(--color-g900, #141414);
    background-color: var(--color-w100, #fff);
    font-size: 1.6rem;
    font-family: 'Pretendard K Edition', -apple-system, BlinkMacSystemFont, system-ui, Roboto, 'Helvetica Neue', 'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', sans-serif;
    font-variant-numeric: tabular-nums
}

body * {
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none
}

html.pc *:focus {
    outline: auto;
    outline-offset: -2px
}

html.mobile *:focus {
    outline: none
}

body a,
body button {
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none;
    outline: none
}

img {
    border: 0;
    border-style: none;
    vertical-align: top
}

button {
    border: 0;
    background: none;
    padding: 0;
    cursor: pointer;
    line-height: 1.15
}

button,
input,
optgroup,
select,
textarea {
    margin: 0;
    font-size: 100%;
    font-family: inherit
}

table {
    border-collapse: collapse;
    border-spacing: 0
}

fieldset {
    border: 0
}

legend {
    color: var(--color-pb100, #000)
}

address,
caption,
cite,
code,
dfn,
em,
strong,
th,
var {
    font-style: normal;
    font-weight: normal
}

ol,
ul {
    list-style: none
}

caption,
th {
    text-align: left
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-size: 100%;
    font-weight: normal;
    line-height: 1
}

caption,
hr,
legend {
    width: 0;
    height: 0;
    font-size: 1px;
    text-indent: -9999em;
    line-height: 0
}

a {
    color: inherit;
    text-decoration: none;
    background-color: transparent
}

a:visited span {
    border: inherit
}

/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */

main {
    display: block
}

abbr[title] {
    border-bottom: none;
    text-decoration: underline;
    -webkit-text-decoration: underline dotted;
    text-decoration: underline dotted
}

small {
    font-size: 80%
}

sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline
}

sub {
    bottom: -0.25em
}

sup {
    top: -0.5em
}

button,
input {
    overflow: visible
}

input:disabled {
    opacity: 1;
    -webkit-text-fill-color: var(--color-g500, #b8b8b8)
}

:root input:disabled {
    -webkit-text-fill-color: var(--txt-disabled)
}

button,
select {
    text-transform: none;
    color: var(--color-g900, #141414)
}

[type="button"],
[type="reset"],
[type="submit"],
button {
    -webkit-appearance: button;
    color: var(--color-g900)
}

[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner,
button::-moz-focus-inner {
    border-style: none;
    padding: 0
}

[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring,
button:-moz-focusring {
    outline: 0
}

progress {
    vertical-align: baseline
}

textarea {
    overflow: auto
}

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
    height: auto
}

[type="search"] {
    -webkit-appearance: textfield;
    outline-offset: -2px
}

[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none
}

::-webkit-file-upload-button {
    -webkit-appearance: button;
    font: inherit
}

details {
    display: block
}

template {
    display: none
}

[hidden] {
    display: none
}

.ui-kbank-page-control {
    opacity: 0
}

.ui-kbank-page-control.activeSlide {
    opacity: 1
}

a,
img {
    -webkit-user-drag: none
}

/*! print */

@media print {
    *,
    *:after,
    *:before {
        background: transparent !important;
        color: var(--color-pb100, #000) !important;
        -webkit-box-shadow: none !important;
        box-shadow: none !important;
        text-shadow: none !important
    }
    a,
    a:visited {
        text-decoration: underline
    }
    a[href]:after {
        content: " (" attr(href) ")"
    }
    abbr[title]:after {
        content: " (" attr(title) ")"
    }
    a[href^="#"]:after,
    a[href^="javascript:"]:after {
        content: ""
    }
    pre {
        white-space: pre-wrap !important
    }
    blockquote,
    pre {
        border: 1px solid #999;
        page-break-inside: avoid
    }
    thead {
        display: table-header-group
    }
    img,
    tr {
        page-break-inside: avoid
    }
    h2,
    h3,
    p {
        orphans: 3;
        widows: 3
    }
    h2,
    h3 {
        page-break-after: avoid
    }
}

/*! jquery.scrollbar */

.scroll-wrapper {
    overflow: hidden !important;
    padding: 0 !important;
    position: relative
}

.scroll-wrapper>.scroll-content {
    border: none !important;
    -webkit-box-sizing: content-box !important;
    box-sizing: content-box !important;
    height: auto;
    left: 0;
    margin: 0;
    max-height: none;
    max-width: none !important;
    overflow: scroll !important;
    padding: 0;
    position: relative !important;
    top: 0;
    width: auto !important
}

.scroll-wrapper>.scroll-content::-webkit-scrollbar {
    height: 0;
    width: 0
}

.scroll-element {
    display: none
}

.scroll-element,
.scroll-element div {
    -webkit-box-sizing: content-box;
    box-sizing: content-box
}

.scroll-element.scroll-x.scroll-scrollx_visible,
.scroll-element.scroll-y.scroll-scrolly_visible {
    display: block
}

.scroll-element .scroll-arrow,
.scroll-element .scroll-bar {
    cursor: default
}

.scroll-textarea {
    border: 1px solid #ccc;
    border-top-color: #999
}

.scroll-textarea>.scroll-content {
    overflow: hidden !important
}

.scroll-textarea>.scroll-content>textarea {
    border: none !important;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    height: 100% !important;
    margin: 0;
    max-height: none !important;
    max-width: none !important;
    overflow: scroll !important;
    outline: none;
    padding: 2px;
    position: relative !important;
    top: 0;
    width: 100% !important
}

.scroll-textarea>.scroll-content>textarea::-webkit-scrollbar {
    height: 0;
    width: 0
}

.scrollbar-inner>.scroll-element,
.scrollbar-inner>.scroll-element div {
    border: none;
    margin: 0;
    padding: 0;
    position: absolute;
    z-index: 10
}

.scrollbar-inner>.scroll-element div {
    display: block;
    height: 100%;
    left: 0;
    top: 0;
    width: 100%
}

.scrollbar-inner>.scroll-element.scroll-x {
    bottom: 2px;
    height: 8px;
    left: 0;
    width: 100%
}

.scrollbar-inner>.scroll-element.scroll-y {
    height: 100%;
    right: 2px;
    top: 0;
    width: 8px
}

.scrollbar-inner>.scroll-element .scroll-element_outer {
    overflow: hidden
}

.scrollbar-inner>.scroll-element .scroll-bar,
.scrollbar-inner>.scroll-element .scroll-element_outer,
.scrollbar-inner>.scroll-element .scroll-element_track {
    border-radius: 8px
}

.scrollbar-inner>.scroll-element .scroll-bar,
.scrollbar-inner>.scroll-element .scroll-element_track {
    opacity: 0.4
}

.scrollbar-inner>.scroll-element .scroll-element_track {
    background-color: var(--color-g300, #e0e0e0)
}

.scrollbar-inner>.scroll-element .scroll-bar {
    background-color: #c2c2c2
}

.scrollbar-inner>.scroll-element:hover .scroll-bar {
    background-color: #919191
}

.scrollbar-inner>.scroll-element.scroll-draggable .scroll-bar {
    background-color: #919191
}

.scrollbar-inner>.scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_track {
    left: -12px
}

.scrollbar-inner>.scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_track {
    top: -12px
}

.scrollbar-inner>.scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_size {
    left: -12px
}

.scrollbar-inner>.scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_size {
    top: -12px
}

.scrollbar-outer>.scroll-element,
.scrollbar-outer>.scroll-element div {
    border: none;
    margin: 0;
    padding: 0;
    position: absolute;
    z-index: 10
}

.scrollbar-outer>.scroll-element {
    background-color: var(--color-w100, #fff)
}

.scrollbar-outer>.scroll-element div {
    display: block;
    height: 100%;
    left: 0;
    top: 0;
    width: 100%
}

.scrollbar-outer>.scroll-element.scroll-x {
    bottom: 0;
    height: 12px;
    left: 0;
    width: 100%
}

.scrollbar-outer>.scroll-element.scroll-y {
    height: 100%;
    right: 0;
    top: 0;
    width: 12px
}

.scrollbar-outer>.scroll-element.scroll-x .scroll-element_outer {
    height: 8px;
    top: 2px
}

.scrollbar-outer>.scroll-element.scroll-y .scroll-element_outer {
    left: 2px;
    width: 8px
}

.scrollbar-outer>.scroll-element .scroll-element_outer {
    overflow: hidden
}

.scrollbar-outer>.scroll-element .scroll-element_track {
    background-color: var(--color-g200, #eee)
}

.scrollbar-outer>.scroll-element .scroll-bar,
.scrollbar-outer>.scroll-element .scroll-element_outer,
.scrollbar-outer>.scroll-element .scroll-element_track {
    border-radius: 8px
}

.scrollbar-outer>.scroll-element .scroll-bar {
    background-color: #d9d9d9
}

.scrollbar-outer>.scroll-element .scroll-bar:hover {
    background-color: #c2c2c2
}

.scrollbar-outer>.scroll-element.scroll-draggable .scroll-bar {
    background-color: #919191
}

.scrollbar-outer>.scroll-content.scroll-scrolly_visible {
    left: -12px;
    margin-left: 12px
}

.scrollbar-outer>.scroll-content.scroll-scrollx_visible {
    top: -12px;
    margin-top: 12px
}

.scrollbar-outer>.scroll-element.scroll-x .scroll-bar {
    min-width: 10px
}

.scrollbar-outer>.scroll-element.scroll-y .scroll-bar {
    min-height: 10px
}

.scrollbar-outer>.scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_track {
    left: -14px
}

.scrollbar-outer>.scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_track {
    top: -14px
}

.scrollbar-outer>.scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_size {
    left: -14px
}

.scrollbar-outer>.scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_size {
    top: -14px
}

.scrollbar-macosx>.scroll-element,
.scrollbar-macosx>.scroll-element div {
    background: none;
    border: none;
    margin: 0;
    padding: 0;
    position: absolute;
    z-index: 10
}

.scrollbar-macosx>.scroll-element div {
    display: block;
    height: 100%;
    left: 0;
    top: 0;
    width: 100%
}

.scrollbar-macosx>.scroll-element .scroll-element_track {
    display: none
}

.scrollbar-macosx>.scroll-element .scroll-bar {
    background-color: #6c6e71;
    display: block;
    opacity: 0;
    border-radius: 7px;
    -webkit-transition: opacity 0.2s linear;
    -o-transition: opacity 0.2s linear;
    transition: opacity 0.2s linear
}

.scrollbar-macosx>.scroll-element.scroll-draggable .scroll-bar,
.scrollbar-macosx:hover>.scroll-element .scroll-bar {
    opacity: 0.7
}

.scrollbar-macosx>.scroll-element.scroll-x {
    bottom: 0;
    height: 0;
    left: 0;
    min-width: 100%;
    overflow: visible;
    width: 100%
}

.scrollbar-macosx>.scroll-element.scroll-y {
    height: 100%;
    min-height: 100%;
    right: 0;
    top: 0;
    width: 0
}

.scrollbar-macosx>.scroll-element.scroll-x .scroll-bar {
    height: 7px;
    min-width: 10px;
    top: -9px
}

.scrollbar-macosx>.scroll-element.scroll-y .scroll-bar {
    left: -9px;
    min-height: 10px;
    width: 7px
}

.scrollbar-macosx>.scroll-element.scroll-x .scroll-element_outer {
    left: 2px
}

.scrollbar-macosx>.scroll-element.scroll-x .scroll-element_size {
    left: -4px
}

.scrollbar-macosx>.scroll-element.scroll-y .scroll-element_outer {
    top: 2px
}

.scrollbar-macosx>.scroll-element.scroll-y .scroll-element_size {
    top: -4px
}

.scrollbar-macosx>.scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_size {
    left: -11px
}

.scrollbar-macosx>.scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_size {
    top: -11px
}

.scrollbar-light>.scroll-element,
.scrollbar-light>.scroll-element div {
    border: none;
    margin: 0;
    overflow: hidden;
    padding: 0;
    position: absolute;
    z-index: 10
}

.scrollbar-light>.scroll-element {
    background-color: var(--color-w100, #fff)
}

.scrollbar-light>.scroll-element div {
    display: block;
    height: 100%;
    left: 0;
    top: 0;
    width: 100%
}

.scrollbar-light>.scroll-element .scroll-element_outer {
    border-radius: 10px
}

.scrollbar-light>.scroll-element .scroll-element_size {
    background: #dbdbdb;
    background: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2RiZGJkYiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlOGU4ZTgiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+");
    background: -o-linear-gradient(left, #dbdbdb 0, #e8e8e8 100%);
    background: -webkit-gradient(linear, left top, right top, color-stop(0, #dbdbdb), to(#e8e8e8));
    background: linear-gradient(to right, #dbdbdb 0, #e8e8e8 100%);
    border-radius: 10px
}

.scrollbar-light>.scroll-element.scroll-x {
    bottom: 0;
    height: 17px;
    left: 0;
    min-width: 100%;
    width: 100%
}

.scrollbar-light>.scroll-element.scroll-y {
    height: 100%;
    min-height: 100%;
    right: 0;
    top: 0;
    width: 17px
}

.scrollbar-light>.scroll-element .scroll-bar {
    background: #fefefe;
    background: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZlZmVmZSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmNWY1ZjUiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+");
    background: -o-linear-gradient(left, #fefefe 0, #f5f5f5 100%);
    background: -webkit-gradient(linear, left top, right top, color-stop(0, #fefefe), to(#f5f5f5));
    background: linear-gradient(to right, #fefefe 0, #f5f5f5 100%);
    border: 1px solid #dbdbdb;
    border-radius: 10px
}

.scrollbar-light>.scroll-content.scroll-scrolly_visible {
    left: -17px;
    margin-left: 17px
}

.scrollbar-light>.scroll-content.scroll-scrollx_visible {
    top: -17px;
    margin-top: 17px
}

.scrollbar-light>.scroll-element.scroll-x .scroll-bar {
    height: 10px;
    min-width: 10px;
    top: 0
}

.scrollbar-light>.scroll-element.scroll-y .scroll-bar {
    left: 0;
    min-height: 10px;
    width: 10px
}

.scrollbar-light>.scroll-element.scroll-x .scroll-element_outer {
    height: 12px;
    left: 2px;
    top: 2px
}

.scrollbar-light>.scroll-element.scroll-x .scroll-element_size {
    left: -4px
}

.scrollbar-light>.scroll-element.scroll-y .scroll-element_outer {
    left: 2px;
    top: 2px;
    width: 12px
}

.scrollbar-light>.scroll-element.scroll-y .scroll-element_size {
    top: -4px
}

.scrollbar-light>.scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_size {
    left: -19px
}

.scrollbar-light>.scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_size {
    top: -19px
}

.scrollbar-light>.scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_track {
    left: -19px
}

.scrollbar-light>.scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_track {
    top: -19px
}

.scrollbar-rail>.scroll-element,
.scrollbar-rail>.scroll-element div {
    border: none;
    margin: 0;
    overflow: hidden;
    padding: 0;
    position: absolute;
    z-index: 10
}

.scrollbar-rail>.scroll-element {
    background-color: var(--color-w100, #fff)
}

.scrollbar-rail>.scroll-element div {
    display: block;
    height: 100%;
    left: 0;
    top: 0;
    width: 100%
}

.scrollbar-rail>.scroll-element .scroll-element_size {
    background-color: #999;
    background-color: rgba(0, 0, 0, 0.3)
}

.scrollbar-rail>.scroll-element .scroll-element_outer:hover .scroll-element_size {
    background-color: #666;
    background-color: var(--color-pb50, #0000007F)
}

.scrollbar-rail>.scroll-element.scroll-x {
    bottom: 0;
    height: 12px;
    left: 0;
    min-width: 100%;
    padding: 3px 0 2px;
    width: 100%
}

.scrollbar-rail>.scroll-element.scroll-y {
    height: 100%;
    min-height: 100%;
    padding: 0 2px 0 3px;
    right: 0;
    top: 0;
    width: 12px
}

.scrollbar-rail>.scroll-element .scroll-bar {
    background-color: #d0b9a0;
    border-radius: 2px;
    -webkit-box-shadow: 1px 1px 3px var(--color-pb50, #0000007F);
    box-shadow: 1px 1px 3px var(--color-pb50, #0000007F)
}

.scrollbar-rail>.scroll-element .scroll-element_outer:hover .scroll-bar {
    -webkit-box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.6);
    box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.6)
}

.scrollbar-rail>.scroll-content.scroll-scrolly_visible {
    left: -17px;
    margin-left: 17px
}

.scrollbar-rail>.scroll-content.scroll-scrollx_visible {
    margin-top: 17px;
    top: -17px
}

.scrollbar-rail>.scroll-element.scroll-x .scroll-bar {
    height: 10px;
    min-width: 10px;
    top: 1px
}

.scrollbar-rail>.scroll-element.scroll-y .scroll-bar {
    left: 1px;
    min-height: 10px;
    width: 10px
}

.scrollbar-rail>.scroll-element.scroll-x .scroll-element_outer {
    height: 15px;
    left: 5px
}

.scrollbar-rail>.scroll-element.scroll-x .scroll-element_size {
    height: 2px;
    left: -10px;
    top: 5px
}

.scrollbar-rail>.scroll-element.scroll-y .scroll-element_outer {
    top: 5px;
    width: 15px
}

.scrollbar-rail>.scroll-element.scroll-y .scroll-element_size {
    left: 5px;
    top: -10px;
    width: 2px
}

.scrollbar-rail>.scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_size {
    left: -25px
}

.scrollbar-rail>.scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_size {
    top: -25px
}

.scrollbar-rail>.scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_track {
    left: -25px
}

.scrollbar-rail>.scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_track {
    top: -25px
}

.scrollbar-dynamic>.scroll-element,
.scrollbar-dynamic>.scroll-element div {
    background: none;
    border: none;
    margin: 0;
    padding: 0;
    position: absolute;
    z-index: 10
}

.scrollbar-dynamic>.scroll-element div {
    display: block;
    height: 100%;
    left: 0;
    top: 0;
    width: 100%
}

.scrollbar-dynamic>.scroll-element.scroll-x {
    bottom: 2px;
    height: 7px;
    left: 0;
    min-width: 100%;
    width: 100%
}

.scrollbar-dynamic>.scroll-element.scroll-y {
    height: 100%;
    min-height: 100%;
    right: 2px;
    top: 0;
    width: 7px
}

.scrollbar-dynamic>.scroll-element .scroll-element_outer {
    opacity: 0.3;
    border-radius: 12px
}

.scrollbar-dynamic>.scroll-element .scroll-element_size {
    background-color: #ccc;
    opacity: 0;
    border-radius: 12px;
    -webkit-transition: opacity 0.2s;
    -o-transition: opacity 0.2s;
    transition: opacity 0.2s
}

.scrollbar-dynamic>.scroll-element .scroll-bar {
    background-color: #6c6e71;
    border-radius: 7px
}

.scrollbar-dynamic>.scroll-element.scroll-x .scroll-bar {
    bottom: 0;
    height: 7px;
    min-width: 24px;
    top: auto
}

.scrollbar-dynamic>.scroll-element.scroll-y .scroll-bar {
    left: auto;
    min-height: 24px;
    right: 0;
    width: 7px
}

.scrollbar-dynamic>.scroll-element.scroll-x .scroll-element_outer {
    bottom: 0;
    top: auto;
    left: 2px;
    -webkit-transition: height 0.2s;
    -o-transition: height 0.2s;
    transition: height 0.2s
}

.scrollbar-dynamic>.scroll-element.scroll-y .scroll-element_outer {
    left: auto;
    right: 0;
    top: 2px;
    -webkit-transition: width 0.2s;
    -o-transition: width 0.2s;
    transition: width 0.2s
}

.scrollbar-dynamic>.scroll-element.scroll-x .scroll-element_size {
    left: -4px
}

.scrollbar-dynamic>.scroll-element.scroll-y .scroll-element_size {
    top: -4px
}

.scrollbar-dynamic>.scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_size {
    left: -11px
}

.scrollbar-dynamic>.scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_size {
    top: -11px
}

.scrollbar-dynamic>.scroll-element.scroll-draggable .scroll-element_outer,
.scrollbar-dynamic>.scroll-element:hover .scroll-element_outer {
    overflow: hidden;
    opacity: 0.7
}

.scrollbar-dynamic>.scroll-element.scroll-draggable .scroll-element_outer .scroll-element_size,
.scrollbar-dynamic>.scroll-element:hover .scroll-element_outer .scroll-element_size {
    opacity: 1
}

.scrollbar-dynamic>.scroll-element.scroll-draggable .scroll-element_outer .scroll-bar,
.scrollbar-dynamic>.scroll-element:hover .scroll-element_outer .scroll-bar {
    height: 100%;
    width: 100%;
    border-radius: 12px
}

.scrollbar-dynamic>.scroll-element.scroll-x.scroll-draggable .scroll-element_outer,
.scrollbar-dynamic>.scroll-element.scroll-x:hover .scroll-element_outer {
    height: 20px;
    min-height: 7px
}

.scrollbar-dynamic>.scroll-element.scroll-y.scroll-draggable .scroll-element_outer,
.scrollbar-dynamic>.scroll-element.scroll-y:hover .scroll-element_outer {
    min-width: 7px;
    width: 20px
}

.scrollbar-chrome>.scroll-element,
.scrollbar-chrome>.scroll-element div {
    border: none;
    margin: 0;
    overflow: hidden;
    padding: 0;
    position: absolute;
    z-index: 10
}

.scrollbar-chrome>.scroll-element {
    background-color: var(--color-w100, #fff)
}

.scrollbar-chrome>.scroll-element div {
    display: block;
    height: 100%;
    left: 0;
    top: 0;
    width: 100%
}

.scrollbar-chrome>.scroll-element .scroll-element_track {
    background: #f1f1f1;
    border: 1px solid #dbdbdb
}

.scrollbar-chrome>.scroll-element.scroll-x {
    bottom: 0;
    height: 16px;
    left: 0;
    min-width: 100%;
    width: 100%
}

.scrollbar-chrome>.scroll-element.scroll-y {
    height: 100%;
    min-height: 100%;
    right: 0;
    top: 0;
    width: 16px
}

.scrollbar-chrome>.scroll-element .scroll-bar {
    background-color: #d9d9d9;
    border: 1px solid #bdbdbd;
    cursor: default;
    border-radius: 2px
}

.scrollbar-chrome>.scroll-element .scroll-bar:hover {
    background-color: #c2c2c2;
    border-color: #a9a9a9
}

.scrollbar-chrome>.scroll-element.scroll-draggable .scroll-bar {
    background-color: #919191;
    border-color: #7e7e7e
}

.scrollbar-chrome>.scroll-content.scroll-scrolly_visible {
    left: -16px;
    margin-left: 16px
}

.scrollbar-chrome>.scroll-content.scroll-scrollx_visible {
    top: -16px;
    margin-top: 16px
}

.scrollbar-chrome>.scroll-element.scroll-x .scroll-bar {
    height: 8px;
    min-width: 10px;
    top: 3px
}

.scrollbar-chrome>.scroll-element.scroll-y .scroll-bar {
    left: 3px;
    min-height: 10px;
    width: 8px
}

.scrollbar-chrome>.scroll-element.scroll-x .scroll-element_outer {
    border-left: 1px solid #dbdbdb
}

.scrollbar-chrome>.scroll-element.scroll-x .scroll-element_track {
    height: 14px;
    left: -3px
}

.scrollbar-chrome>.scroll-element.scroll-x .scroll-element_size {
    height: 14px;
    left: -4px
}

.scrollbar-chrome>.scroll-element.scroll-y .scroll-element_outer {
    border-top: 1px solid #dbdbdb
}

.scrollbar-chrome>.scroll-element.scroll-y .scroll-element_track {
    top: -3px;
    width: 14px
}

.scrollbar-chrome>.scroll-element.scroll-y .scroll-element_size {
    top: -4px;
    width: 14px
}

.scrollbar-chrome>.scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_size {
    left: -19px
}

.scrollbar-chrome>.scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_size {
    top: -19px
}

.scrollbar-chrome>.scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_track {
    left: -19px
}

.scrollbar-chrome>.scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_track {
    top: -19px
}

/*! jQuery UI - v1.12.1 - 2022-03-15 http://jqueryui.com Includes:draggable.css, sortable.css, core.css, datepicker.css, theme.css To view and modify this theme, visit http://jqueryui.com/themeroller/?scope=&folderName=base&cornerRadiusShadow=8px&offsetLeftShadow=0px&offsetTopShadow=0px&thicknessShadow=5px&opacityShadow=30&bgImgOpacityShadow=0&bgTextureShadow=flat&bgColorShadow=666666&opacityOverlay=30&bgImgOpacityOverlay=0&bgTextureOverlay=flat&bgColorOverlay=aaaaaa&iconColorError=cc0000&fcError=5f3f3f&borderColorError=f1a899&bgTextureError=flat&bgColorError=fddfdf&iconColorHighlight=777620&fcHighlight=777620&borderColorHighlight=dad55e&bgTextureHighlight=flat&bgColorHighlight=fffa90&iconColorActive=ffffff&fcActive=ffffff&borderColorActive=003eff&bgTextureActive=flat&bgColorActive=007fff&iconColorHover=555555&fcHover=2b2b2b&borderColorHover=cccccc&bgTextureHover=flat&bgColorHover=ededed&iconColorDefault=777777&fcDefault=454545&borderColorDefault=c5c5c5&bgTextureDefault=flat&bgColorDefault=f6f6f6&iconColorContent=444444&fcContent=333333&borderColorContent=dddddd&bgTextureContent=flat&bgColorContent=ffffff&iconColorHeader=444444&fcHeader=333333&borderColorHeader=dddddd&bgTextureHeader=flat&bgColorHeader=e9e9e9&cornerRadius=3px&fwDefault=normal&fsDefault=1em&ffDefault=Arial%2CHelvetica%2Csans-serif Copyright jQuery Foundation and other contributors;Licensed MIT */

.jui-draggable-handle {
    -ms-touch-action: none;
    touch-action: none
}

.jui-sortable-handle {
    -ms-touch-action: none;
    touch-action: none
}

.jui-helper-hidden {
    display: none
}

.jui-helper-hidden-accessible {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px
}

.jui-helper-reset {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    line-height: 1.3;
    text-decoration: none;
    font-size: 100%;
    list-style: none
}

.jui-helper-clearfix:after,
.jui-helper-clearfix:before {
    content: "";
    display: table;
    border-collapse: collapse
}

.jui-helper-clearfix:after {
    clear: both
}

.jui-helper-zfix {
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    position: absolute;
    opacity: 0;
    filter: Alpha(Opacity=0)
}

.jui-front {
    z-index: 100
}

.jui-state-disabled {
    cursor: default !important;
    pointer-events: none
}

.jui-icon {
    display: inline-block;
    vertical-align: middle;
    margin-top: -.25em;
    position: relative;
    text-indent: -99999px;
    overflow: hidden;
    background-repeat: no-repeat
}

.jui-widget-icon-block {
    left: 50%;
    margin-left: -8px;
    display: block
}

.jui-widget-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.jui-datepicker {
    width: 17em;
    padding: .2em .2em 0;
    display: none
}

.jui-datepicker .jui-datepicker-header {
    position: relative;
    padding: .2em 0
}

.jui-datepicker .jui-datepicker-next,
.jui-datepicker .jui-datepicker-prev {
    position: absolute;
    top: 2px;
    width: 1.8em;
    height: 1.8em
}

.jui-datepicker .jui-datepicker-next-hover,
.jui-datepicker .jui-datepicker-prev-hover {
    top: 1px
}

.jui-datepicker .jui-datepicker-prev {
    left: 2px
}

.jui-datepicker .jui-datepicker-next {
    right: 2px
}

.jui-datepicker .jui-datepicker-prev-hover {
    left: 1px
}

.jui-datepicker .jui-datepicker-next-hover {
    right: 1px
}

.jui-datepicker .jui-datepicker-next span,
.jui-datepicker .jui-datepicker-prev span {
    display: block;
    position: absolute;
    left: 50%;
    margin-left: -8px;
    top: 50%;
    margin-top: -8px
}

.jui-datepicker .jui-datepicker-title {
    margin: 0 2.3em;
    line-height: 1.8em;
    text-align: center
}

.jui-datepicker .jui-datepicker-title select {
    font-size: 1em;
    margin: 1px 0
}

.jui-datepicker select.jui-datepicker-month,
.jui-datepicker select.jui-datepicker-year {
    width: 45%
}

.jui-datepicker table {
    width: 100%;
    font-size: .9em;
    border-collapse: collapse;
    margin: 0 0 .4em
}

.jui-datepicker th {
    padding: .7em .3em;
    text-align: center;
    font-weight: bold;
    border: 0
}

.jui-datepicker td {
    border: 0;
    padding: 1px
}

.jui-datepicker td a,
.jui-datepicker td span {
    display: block;
    padding: .2em;
    text-align: right;
    text-decoration: none
}

.jui-datepicker .jui-datepicker-buttonpane {
    background-image: none;
    margin: .7em 0 0 0;
    padding: 0 .2em;
    border-left: 0;
    border-right: 0;
    border-bottom: 0
}

.jui-datepicker .jui-datepicker-buttonpane button {
    float: right;
    margin: .5em .2em .4em;
    cursor: pointer;
    padding: .2em .6em .3em .6em;
    width: auto;
    overflow: visible
}

.jui-datepicker .jui-datepicker-buttonpane button.jui-datepicker-current {
    float: left
}

.jui-datepicker.jui-datepicker-multi {
    width: auto
}

.jui-datepicker-multi .jui-datepicker-group {
    float: left
}

.jui-datepicker-multi .jui-datepicker-group table {
    width: 95%;
    margin: 0 auto .4em
}

.jui-datepicker-multi-2 .jui-datepicker-group {
    width: 50%
}

.jui-datepicker-multi-3 .jui-datepicker-group {
    width: 33.3%
}

.jui-datepicker-multi-4 .jui-datepicker-group {
    width: 25%
}

.jui-datepicker-multi .jui-datepicker-group-last .jui-datepicker-header,
.jui-datepicker-multi .jui-datepicker-group-middle .jui-datepicker-header {
    border-left-width: 0
}

.jui-datepicker-multi .jui-datepicker-buttonpane {
    clear: left
}

.jui-datepicker-row-break {
    clear: both;
    width: 100%;
    font-size: 0
}

.jui-datepicker-rtl {
    direction: rtl
}

.jui-datepicker-rtl .jui-datepicker-prev {
    right: 2px;
    left: auto
}

.jui-datepicker-rtl .jui-datepicker-next {
    left: 2px;
    right: auto
}

.jui-datepicker-rtl .jui-datepicker-prev:hover {
    right: 1px;
    left: auto
}

.jui-datepicker-rtl .jui-datepicker-next:hover {
    left: 1px;
    right: auto
}

.jui-datepicker-rtl .jui-datepicker-buttonpane {
    clear: right
}

.jui-datepicker-rtl .jui-datepicker-buttonpane button {
    float: left
}

.jui-datepicker-rtl .jui-datepicker-buttonpane button.jui-datepicker-current,
.jui-datepicker-rtl .jui-datepicker-group {
    float: right
}

.jui-datepicker-rtl .jui-datepicker-group-last .jui-datepicker-header,
.jui-datepicker-rtl .jui-datepicker-group-middle .jui-datepicker-header {
    border-right-width: 0;
    border-left-width: 1px
}

.jui-datepicker .jui-icon {
    display: block;
    text-indent: -99999px;
    overflow: hidden;
    background-repeat: no-repeat;
    left: .5em;
    top: .3em
}

.jui-widget {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1em
}

.jui-widget .jui-widget {
    font-size: 1em
}

.jui-widget button,
.jui-widget input,
.jui-widget select,
.jui-widget textarea {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1em
}

.jui-widget.jui-widget-content {
    border: 1px solid #c5c5c5
}

.jui-widget-content {
    border: 1px solid var(--color-g300, #e0e0e0);
    background: var(--color-w100, #fff);
    color: #333
}

.jui-widget-content a {
    color: #333
}

.jui-widget-header {
    border: 1px solid var(--color-g300, #e0e0e0);
    background: var(--color-g200, #eee);
    color: #333;
    font-weight: bold
}

.jui-widget-header a {
    color: #333
}

.jui-button,
.jui-state-default,
.jui-widget-content .jui-state-default,
.jui-widget-header .jui-state-default,
html .jui-button.jui-state-disabled:active,
html .jui-button.jui-state-disabled:hover {
    border: 1px solid #c5c5c5;
    background: var(--color-g100, #f8f8f8);
    font-weight: normal;
    color: #454545
}

.jui-button,
.jui-state-default a,
.jui-state-default a:link,
.jui-state-default a:visited,
a.jui-button,
a:link.jui-button,
a:visited.jui-button {
    color: #454545;
    text-decoration: none
}

.jui-button:focus,
.jui-button:hover,
.jui-state-focus,
.jui-state-hover,
.jui-widget-content .jui-state-focus,
.jui-widget-content .jui-state-hover,
.jui-widget-header .jui-state-focus,
.jui-widget-header .jui-state-hover {
    border: 1px solid #ccc;
    background: #ededed;
    font-weight: normal;
    color: #2b2b2b
}

.jui-state-focus a,
.jui-state-focus a:hover,
.jui-state-focus a:link,
.jui-state-focus a:visited,
.jui-state-hover a,
.jui-state-hover a:hover,
.jui-state-hover a:link,
.jui-state-hover a:visited,
a.jui-button:focus,
a.jui-button:hover {
    color: #2b2b2b;
    text-decoration: none
}

.jui-visual-focus {
    -webkit-box-shadow: 0 0 3px 1px #5e9ed6;
    box-shadow: 0 0 3px 1px #5e9ed6
}

.jui-button.jui-state-active:hover,
.jui-button:active,
.jui-state-active,
.jui-widget-content .jui-state-active,
.jui-widget-header .jui-state-active,
a.jui-button:active {
    border: 1px solid #003eff;
    background: #007fff;
    font-weight: normal;
    color: var(--color-w100, #fff)
}

.jui-icon-background,
.jui-state-active .jui-icon-background {
    border: #003eff;
    background-color: var(--color-w100, #fff)
}

.jui-state-active a,
.jui-state-active a:link,
.jui-state-active a:visited {
    color: var(--color-w100, #fff);
    text-decoration: none
}

.jui-state-highlight,
.jui-widget-content .jui-state-highlight,
.jui-widget-header .jui-state-highlight {
    border: 1px solid #dad55e;
    background: #fffa90;
    color: #777620
}

.jui-state-checked {
    border: 1px solid #dad55e;
    background: #fffa90
}

.jui-state-highlight a,
.jui-widget-content .jui-state-highlight a,
.jui-widget-header .jui-state-highlight a {
    color: #777620
}

.jui-state-error,
.jui-widget-content .jui-state-error,
.jui-widget-header .jui-state-error {
    border: 1px solid #f1a899;
    background: #fddfdf;
    color: #5f3f3f
}

.jui-state-error a,
.jui-widget-content .jui-state-error a,
.jui-widget-header .jui-state-error a {
    color: #5f3f3f
}

.jui-state-error-text,
.jui-widget-content .jui-state-error-text,
.jui-widget-header .jui-state-error-text {
    color: #5f3f3f
}

.jui-priority-primary,
.jui-widget-content .jui-priority-primary,
.jui-widget-header .jui-priority-primary {
    font-weight: bold
}

.jui-priority-secondary,
.jui-widget-content .jui-priority-secondary,
.jui-widget-header .jui-priority-secondary {
    opacity: .7;
    filter: Alpha(Opacity=70);
    font-weight: normal
}

.jui-state-disabled,
.jui-widget-content .jui-state-disabled,
.jui-widget-header .jui-state-disabled {
    opacity: .35;
    filter: Alpha(Opacity=35);
    background-image: none
}

.jui-widget-content .jui-state-disabled,
.jui-widget-header .jui-state-disabled,
:root .jui-state-disabled {
    opacity: 1;
    filter: Alpha(Opacity=100)
}

.jui-corner-all:active,
.jui-corner-all:hover,
.jui-state-disabled.jui-state-hover,
.jui-state-disabled:active,
.jui-state-disabled:hover {
    border: none !important;
    background-color: var(--colo-w100) !important
}

.jui-state-disabled .jui-icon {
    filter: Alpha(Opacity=35)
}

.jui-icon {
    width: 16px;
    height: 16px
}

.jui-icon,
.jui-widget-content .jui-icon {
    background-image: url("images/jui-icons_444444_256x240.png")
}

.jui-widget-header .jui-icon {
    background-image: url("images/jui-icons_444444_256x240.png")
}

.jui-button:focus .jui-icon,
.jui-button:hover .jui-icon,
.jui-state-focus .jui-icon,
.jui-state-hover .jui-icon {
    background-image: url("images/jui-icons_555555_256x240.png")
}

.jui-button:active .jui-icon,
.jui-state-active .jui-icon {
    background-image: url("images/jui-icons_ffffff_256x240.png")
}

.jui-button .jui-state-highlight.jui-icon,
.jui-state-highlight .jui-icon {
    background-image: url("images/jui-icons_777620_256x240.png")
}

.jui-state-error .jui-icon,
.jui-state-error-text .jui-icon {
    background-image: url("images/jui-icons_cc0000_256x240.png")
}

.jui-button .jui-icon {
    background-image: url("images/jui-icons_777777_256x240.png")
}

.jui-icon-blank {
    background-position: 16px 16px
}

.jui-icon-caret-1-n {
    background-position: 0 0
}

.jui-icon-caret-1-ne {
    background-position: -16px 0
}

.jui-icon-caret-1-e {
    background-position: -32px 0
}

.jui-icon-caret-1-se {
    background-position: -48px 0
}

.jui-icon-caret-1-s {
    background-position: -65px 0
}

.jui-icon-caret-1-sw {
    background-position: -80px 0
}

.jui-icon-caret-1-w {
    background-position: -96px 0
}

.jui-icon-caret-1-nw {
    background-position: -112px 0
}

.jui-icon-caret-2-n-s {
    background-position: -128px 0
}

.jui-icon-caret-2-e-w {
    background-position: -144px 0
}

.jui-icon-triangle-1-n {
    background-position: 0 -16px
}

.jui-icon-triangle-1-ne {
    background-position: -16px -16px
}

.jui-icon-triangle-1-e {
    background-position: -32px -16px
}

.jui-icon-triangle-1-se {
    background-position: -48px -16px
}

.jui-icon-triangle-1-s {
    background-position: -65px -16px
}

.jui-icon-triangle-1-sw {
    background-position: -80px -16px
}

.jui-icon-triangle-1-w {
    background-position: -96px -16px
}

.jui-icon-triangle-1-nw {
    background-position: -112px -16px
}

.jui-icon-triangle-2-n-s {
    background-position: -128px -16px
}

.jui-icon-triangle-2-e-w {
    background-position: -144px -16px
}

.jui-icon-arrow-1-n {
    background-position: 0 -32px
}

.jui-icon-arrow-1-ne {
    background-position: -16px -32px
}

.jui-icon-arrow-1-e {
    background-position: -32px -32px
}

.jui-icon-arrow-1-se {
    background-position: -48px -32px
}

.jui-icon-arrow-1-s {
    background-position: -65px -32px
}

.jui-icon-arrow-1-sw {
    background-position: -80px -32px
}

.jui-icon-arrow-1-w {
    background-position: -96px -32px
}

.jui-icon-arrow-1-nw {
    background-position: -112px -32px
}

.jui-icon-arrow-2-n-s {
    background-position: -128px -32px
}

.jui-icon-arrow-2-ne-sw {
    background-position: -144px -32px
}

.jui-icon-arrow-2-e-w {
    background-position: -160px -32px
}

.jui-icon-arrow-2-se-nw {
    background-position: -176px -32px
}

.jui-icon-arrowstop-1-n {
    background-position: -192px -32px
}

.jui-icon-arrowstop-1-e {
    background-position: -208px -32px
}

.jui-icon-arrowstop-1-s {
    background-position: -224px -32px
}

.jui-icon-arrowstop-1-w {
    background-position: -240px -32px
}

.jui-icon-arrowthick-1-n {
    background-position: 1px -48px
}

.jui-icon-arrowthick-1-ne {
    background-position: -16px -48px
}

.jui-icon-arrowthick-1-e {
    background-position: -32px -48px
}

.jui-icon-arrowthick-1-se {
    background-position: -48px -48px
}

.jui-icon-arrowthick-1-s {
    background-position: -64px -48px
}

.jui-icon-arrowthick-1-sw {
    background-position: -80px -48px
}

.jui-icon-arrowthick-1-w {
    background-position: -96px -48px
}

.jui-icon-arrowthick-1-nw {
    background-position: -112px -48px
}

.jui-icon-arrowthick-2-n-s {
    background-position: -128px -48px
}

.jui-icon-arrowthick-2-ne-sw {
    background-position: -144px -48px
}

.jui-icon-arrowthick-2-e-w {
    background-position: -160px -48px
}

.jui-icon-arrowthick-2-se-nw {
    background-position: -176px -48px
}

.jui-icon-arrowthickstop-1-n {
    background-position: -192px -48px
}

.jui-icon-arrowthickstop-1-e {
    background-position: -208px -48px
}

.jui-icon-arrowthickstop-1-s {
    background-position: -224px -48px
}

.jui-icon-arrowthickstop-1-w {
    background-position: -240px -48px
}

.jui-icon-arrowreturnthick-1-w {
    background-position: 0 -64px
}

.jui-icon-arrowreturnthick-1-n {
    background-position: -16px -64px
}

.jui-icon-arrowreturnthick-1-e {
    background-position: -32px -64px
}

.jui-icon-arrowreturnthick-1-s {
    background-position: -48px -64px
}

.jui-icon-arrowreturn-1-w {
    background-position: -64px -64px
}

.jui-icon-arrowreturn-1-n {
    background-position: -80px -64px
}

.jui-icon-arrowreturn-1-e {
    background-position: -96px -64px
}

.jui-icon-arrowreturn-1-s {
    background-position: -112px -64px
}

.jui-icon-arrowrefresh-1-w {
    background-position: -128px -64px
}

.jui-icon-arrowrefresh-1-n {
    background-position: -144px -64px
}

.jui-icon-arrowrefresh-1-e {
    background-position: -160px -64px
}

.jui-icon-arrowrefresh-1-s {
    background-position: -176px -64px
}

.jui-icon-arrow-4 {
    background-position: 0 -80px
}

.jui-icon-arrow-4-diag {
    background-position: -16px -80px
}

.jui-icon-extlink {
    background-position: -32px -80px
}

.jui-icon-newwin {
    background-position: -48px -80px
}

.jui-icon-refresh {
    background-position: -64px -80px
}

.jui-icon-shuffle {
    background-position: -80px -80px
}

.jui-icon-transfer-e-w {
    background-position: -96px -80px
}

.jui-icon-transferthick-e-w {
    background-position: -112px -80px
}

.jui-icon-folder-collapsed {
    background-position: 0 -96px
}

.jui-icon-folder-open {
    background-position: -16px -96px
}

.jui-icon-document {
    background-position: -32px -96px
}

.jui-icon-document-b {
    background-position: -48px -96px
}

.jui-icon-note {
    background-position: -64px -96px
}

.jui-icon-mail-closed {
    background-position: -80px -96px
}

.jui-icon-mail-open {
    background-position: -96px -96px
}

.jui-icon-suitcase {
    background-position: -112px -96px
}

.jui-icon-comment {
    background-position: -128px -96px
}

.jui-icon-person {
    background-position: -144px -96px
}

.jui-icon-print {
    background-position: -160px -96px
}

.jui-icon-trash {
    background-position: -176px -96px
}

.jui-icon-locked {
    background-position: -192px -96px
}

.jui-icon-unlocked {
    background-position: -208px -96px
}

.jui-icon-bookmark {
    background-position: -224px -96px
}

.jui-icon-tag {
    background-position: -240px -96px
}

.jui-icon-home {
    background-position: 0 -112px
}

.jui-icon-flag {
    background-position: -16px -112px
}

.jui-icon-calendar {
    background-position: -32px -112px
}

.jui-icon-cart {
    background-position: -48px -112px
}

.jui-icon-pencil {
    background-position: -64px -112px
}

.jui-icon-clock {
    background-position: -80px -112px
}

.jui-icon-disk {
    background-position: -96px -112px
}

.jui-icon-calculator {
    background-position: -112px -112px
}

.jui-icon-zoomin {
    background-position: -128px -112px
}

.jui-icon-zoomout {
    background-position: -144px -112px
}

.jui-icon-search {
    background-position: -160px -112px
}

.jui-icon-wrench {
    background-position: -176px -112px
}

.jui-icon-gear {
    background-position: -192px -112px
}

.jui-icon-heart {
    background-position: -208px -112px
}

.jui-icon-star {
    background-position: -224px -112px
}

.jui-icon-link {
    background-position: -240px -112px
}

.jui-icon-cancel {
    background-position: 0 -128px
}

.jui-icon-plus {
    background-position: -16px -128px
}

.jui-icon-plusthick {
    background-position: -32px -128px
}

.jui-icon-minus {
    background-position: -48px -128px
}

.jui-icon-minusthick {
    background-position: -64px -128px
}

.jui-icon-close {
    background-position: -80px -128px
}

.jui-icon-closethick {
    background-position: -96px -128px
}

.jui-icon-key {
    background-position: -112px -128px
}

.jui-icon-lightbulb {
    background-position: -128px -128px
}

.jui-icon-scissors {
    background-position: -144px -128px
}

.jui-icon-clipboard {
    background-position: -160px -128px
}

.jui-icon-copy {
    background-position: -176px -128px
}

.jui-icon-contact {
    background-position: -192px -128px
}

.jui-icon-image {
    background-position: -208px -128px
}

.jui-icon-video {
    background-position: -224px -128px
}

.jui-icon-script {
    background-position: -240px -128px
}

.jui-icon-alert {
    background-position: 0 -144px
}

.jui-icon-info {
    background-position: -16px -144px
}

.jui-icon-notice {
    background-position: -32px -144px
}

.jui-icon-help {
    background-position: -48px -144px
}

.jui-icon-check {
    background-position: -64px -144px
}

.jui-icon-bullet {
    background-position: -80px -144px
}

.jui-icon-radio-on {
    background-position: -96px -144px
}

.jui-icon-radio-off {
    background-position: -112px -144px
}

.jui-icon-pin-w {
    background-position: -128px -144px
}

.jui-icon-pin-s {
    background-position: -144px -144px
}

.jui-icon-play {
    background-position: 0 -160px
}

.jui-icon-pause {
    background-position: -16px -160px
}

.jui-icon-seek-next {
    background-position: -32px -160px
}

.jui-icon-seek-prev {
    background-position: -48px -160px
}

.jui-icon-seek-end {
    background-position: -64px -160px
}

.jui-icon-seek-start {
    background-position: -80px -160px
}

.jui-icon-seek-first {
    background-position: -80px -160px
}

.jui-icon-stop {
    background-position: -96px -160px
}

.jui-icon-eject {
    background-position: -112px -160px
}

.jui-icon-volume-off {
    background-position: -128px -160px
}

.jui-icon-volume-on {
    background-position: -144px -160px
}

.jui-icon-power {
    background-position: 0 -176px
}

.jui-icon-signal-diag {
    background-position: -16px -176px
}

.jui-icon-signal {
    background-position: -32px -176px
}

.jui-icon-battery-0 {
    background-position: -48px -176px
}

.jui-icon-battery-1 {
    background-position: -64px -176px
}

.jui-icon-battery-2 {
    background-position: -80px -176px
}

.jui-icon-battery-3 {
    background-position: -96px -176px
}

.jui-icon-circle-plus {
    background-position: 0 -192px
}

.jui-icon-circle-minus {
    background-position: -16px -192px
}

.jui-icon-circle-close {
    background-position: -32px -192px
}

.jui-icon-circle-triangle-e {
    background-position: -48px -192px
}

.jui-icon-circle-triangle-s {
    background-position: -64px -192px
}

.jui-icon-circle-triangle-w {
    background-position: -80px -192px
}

.jui-icon-circle-triangle-n {
    background-position: -96px -192px
}

.jui-icon-circle-arrow-e {
    background-position: -112px -192px
}

.jui-icon-circle-arrow-s {
    background-position: -128px -192px
}

.jui-icon-circle-arrow-w {
    background-position: -144px -192px
}

.jui-icon-circle-arrow-n {
    background-position: -160px -192px
}

.jui-icon-circle-zoomin {
    background-position: -176px -192px
}

.jui-icon-circle-zoomout {
    background-position: -192px -192px
}

.jui-icon-circle-check {
    background-position: -208px -192px
}

.jui-icon-circlesmall-plus {
    background-position: 0 -208px
}

.jui-icon-circlesmall-minus {
    background-position: -16px -208px
}

.jui-icon-circlesmall-close {
    background-position: -32px -208px
}

.jui-icon-squaresmall-plus {
    background-position: -48px -208px
}

.jui-icon-squaresmall-minus {
    background-position: -64px -208px
}

.jui-icon-squaresmall-close {
    background-position: -80px -208px
}

.jui-icon-grip-dotted-vertical {
    background-position: 0 -224px
}

.jui-icon-grip-dotted-horizontal {
    background-position: -16px -224px
}

.jui-icon-grip-solid-vertical {
    background-position: -32px -224px
}

.jui-icon-grip-solid-horizontal {
    background-position: -48px -224px
}

.jui-icon-gripsmall-diagonal-se {
    background-position: -64px -224px
}

.jui-icon-grip-diagonal-se {
    background-position: -80px -224px
}

.jui-corner-all,
.jui-corner-left,
.jui-corner-tl,
.jui-corner-top {
    border-top-left-radius: 3px
}

.jui-corner-all,
.jui-corner-right,
.jui-corner-top,
.jui-corner-tr {
    border-top-right-radius: 3px
}

.jui-corner-all,
.jui-corner-bl,
.jui-corner-bottom,
.jui-corner-left {
    border-bottom-left-radius: 3px
}

.jui-corner-all,
.jui-corner-bottom,
.jui-corner-br,
.jui-corner-right {
    border-bottom-right-radius: 3px
}

.jui-widget-overlay {
    background: #aaa;
    opacity: .3;
    filter: Alpha(Opacity=30)
}

.jui-widget-shadow {
    -webkit-box-shadow: 0 0 5px #666;
    box-shadow: 0 0 5px #666
}

.preventClickFalse .jui-state-disabled {
    pointer-events: auto
}

/*! Swiper 5.4.5 */

@font-face {
    font-family: swiper-icons;
    src: url("data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA") format("woff");
    font-weight: 400;
    font-style: normal
}

:root {
    --swiper-theme-color: #007aff
}

.swiper-container {
    margin-left: auto;
    margin-right: auto;
    position: relative;
    overflow: hidden;
    list-style: none;
    padding: 0;
    z-index: 1
}

.ui-swiper[data-no] .swiper-wrapper .swiper-slide:first-child {
    opacity: 1
}

.ui-swiper[data-no="0"] .swiper-wrapper .swiper-slide:first-child {
    opacity: 1
}

.ui-swiper[data-no] .swiper-wrapper .swiper-slide.swiper-slide-active:first-child {
    opacity: 1
}

.group-spinner-swiper.ui-swiper[data-no] .swiper-wrapper .swiper-slide:first-child {
    opacity: 1
}

.carousel-select-group .swiper-wrapper,
.swiper-container-vertical>.swiper-wrapper {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.swiper-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-transition-property: -webkit-transform;
    transition-property: -webkit-transform;
    -o-transition-property: transform;
    transition-property: transform;
    transition-property: transform, -webkit-transform;
    transition-property: transform, -webkit-transform;
    -webkit-box-sizing: content-box;
    box-sizing: content-box
}

.swiper-container-android .swiper-slide,
.swiper-wrapper {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0)
}

.swiper-container-multirow>.swiper-wrapper {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.swiper-container-multirow-column>.swiper-wrapper {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.swiper-container-free-mode>.swiper-wrapper {
    -webkit-transition-timing-function: ease-out;
    -o-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    margin: 0 auto
}

.swiper-slide {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    width: 100%;
    height: 100%;
    position: relative;
    -webkit-transition-property: -webkit-transform;
    transition-property: -webkit-transform;
    -o-transition-property: transform;
    transition-property: transform;
    transition-property: transform, -webkit-transform;
    transition-property: transform, -webkit-transform
}

.swiper-slide-invisible-blank {
    visibility: hidden
}

.swiper-container-autoheight,
.swiper-container-autoheight .swiper-slide {
    height: auto
}

.swiper-container-autoheight .swiper-wrapper {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-transition-property: height, -webkit-transform;
    transition-property: height, -webkit-transform;
    -o-transition-property: transform, height;
    transition-property: transform, height;
    transition-property: transform, height, -webkit-transform
}

.swiper-container-3d {
    -webkit-perspective: 1200px;
    perspective: 1200px
}

.swiper-container-3d .swiper-cube-shadow,
.swiper-container-3d .swiper-slide,
.swiper-container-3d .swiper-slide-shadow-bottom,
.swiper-container-3d .swiper-slide-shadow-left,
.swiper-container-3d .swiper-slide-shadow-right,
.swiper-container-3d .swiper-slide-shadow-top,
.swiper-container-3d .swiper-wrapper {
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d
}

.swiper-container-3d .swiper-slide-shadow-bottom,
.swiper-container-3d .swiper-slide-shadow-left,
.swiper-container-3d .swiper-slide-shadow-right,
.swiper-container-3d .swiper-slide-shadow-top {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 10
}

.swiper-container-3d .swiper-slide-shadow-left {
    background-image: -o-linear-gradient(right, var(--color-pb50, #0000007F), rgba(0, 0, 0, 0));
    background-image: -webkit-gradient(linear, right top, left top, from(var(--color-pb50, #0000007F)), to(rgba(0, 0, 0, 0)));
    background-image: linear-gradient(to left, var(--color-pb50, #0000007F), rgba(0, 0, 0, 0))
}

.swiper-container-3d .swiper-slide-shadow-right {
    background-image: -o-linear-gradient(left, var(--color-pb50, #0000007F), rgba(0, 0, 0, 0));
    background-image: -webkit-gradient(linear, left top, right top, from(var(--color-pb50, #0000007F)), to(rgba(0, 0, 0, 0)));
    background-image: linear-gradient(to right, var(--color-pb50, #0000007F), rgba(0, 0, 0, 0))
}

.swiper-container-3d .swiper-slide-shadow-top {
    background-image: -o-linear-gradient(bottom, var(--color-pb50, #0000007F), rgba(0, 0, 0, 0));
    background-image: -webkit-gradient(linear, left bottom, left top, from(var(--color-pb50, #0000007F)), to(rgba(0, 0, 0, 0)));
    background-image: linear-gradient(to top, var(--color-pb50, #0000007F), rgba(0, 0, 0, 0))
}

.swiper-container-3d .swiper-slide-shadow-bottom {
    background-image: -o-linear-gradient(top, var(--color-pb50, #0000007F), rgba(0, 0, 0, 0));
    background-image: -webkit-gradient(linear, left top, left bottom, from(var(--color-pb50, #0000007F)), to(rgba(0, 0, 0, 0)));
    background-image: linear-gradient(to bottom, var(--color-pb50, #0000007F), rgba(0, 0, 0, 0))
}

.swiper-container-css-mode>.swiper-wrapper {
    overflow: auto;
    scrollbar-width: none;
    -ms-overflow-style: none
}

.swiper-container-css-mode>.swiper-wrapper::-webkit-scrollbar {
    display: none
}

.swiper-container-css-mode>.swiper-wrapper>.swiper-slide {
    scroll-snap-align: start start
}

.swiper-container-horizontal.swiper-container-css-mode>.swiper-wrapper {
    -webkit-scroll-snap-type: x mandatory;
    -ms-scroll-snap-type: x mandatory;
    scroll-snap-type: x mandatory
}

.swiper-container-vertical.swiper-container-css-mode>.swiper-wrapper {
    -webkit-scroll-snap-type: y mandatory;
    -ms-scroll-snap-type: y mandatory;
    scroll-snap-type: y mandatory
}

:root {
    --swiper-navigation-size: 44px
}

.swiper-button-next,
.swiper-button-prev {
    position: absolute;
    top: 50%;
    width: calc(var(--swiper-navigation-size)/ 44 * 27);
    height: var(--swiper-navigation-size);
    margin-top: calc(-1 * var(--swiper-navigation-size)/ 2);
    z-index: 10;
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: var(--swiper-navigation-color, var(--swiper-theme-color))
}

.swiper-button-next.swiper-button-disabled,
.swiper-button-prev.swiper-button-disabled {
    opacity: .35;
    cursor: auto;
    pointer-events: none
}

.swiper-button-next:after,
.swiper-button-prev:after {
    font-family: swiper-icons;
    font-size: var(--swiper-navigation-size);
    text-transform: none !important;
    letter-spacing: 0;
    text-transform: none;
    font-variant: initial;
    line-height: 1
}

.swiper-button-prev,
.swiper-container-rtl .swiper-button-next {
    left: 10px;
    right: auto
}

.swiper-button-prev:after,
.swiper-container-rtl .swiper-button-next:after {
    content: 'prev'
}

.swiper-button-next,
.swiper-container-rtl .swiper-button-prev {
    right: 10px;
    left: auto
}

.swiper-button-next:after,
.swiper-container-rtl .swiper-button-prev:after {
    content: 'next'
}

.swiper-button-next.swiper-button-white,
.swiper-button-prev.swiper-button-white {
    --swiper-navigation-color: var(--color-w100, #FFFFFF)
}

.swiper-button-next.swiper-button-black,
.swiper-button-prev.swiper-button-black {
    --swiper-navigation-color: var(--color-pb100, #000000)
}

.swiper-button-lock {
    display: none
}

.swiper-pagination {
    position: absolute;
    text-align: center;
    -webkit-transition: .3s opacity;
    -o-transition: .3s opacity;
    transition: .3s opacity;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    z-index: 10
}

.swiper-pagination.swiper-pagination-hidden {
    opacity: 0
}

.swiper-container-horizontal>.swiper-pagination-bullets,
.swiper-pagination-custom,
.swiper-pagination-fraction {
    bottom: 10px;
    left: 0;
    width: 100%
}

.swiper-pagination-bullets-dynamic {
    overflow: hidden;
    font-size: 0
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
    -webkit-transform: scale(0.33);
    -ms-transform: scale(0.33);
    transform: scale(0.33);
    position: relative
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1)
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1)
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev {
    -webkit-transform: scale(0.66);
    -ms-transform: scale(0.66);
    transform: scale(0.66)
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev {
    -webkit-transform: scale(0.33);
    -ms-transform: scale(0.33);
    transform: scale(0.33)
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next {
    -webkit-transform: scale(0.66);
    -ms-transform: scale(0.66);
    transform: scale(0.66)
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next {
    -webkit-transform: scale(0.33);
    -ms-transform: scale(0.33);
    transform: scale(0.33)
}

.swiper-pagination-bullet {
    width: 8px;
    height: 8px;
    display: inline-block;
    border-radius: 100%;
    background: var(--color-pb100, #000);
    opacity: .2
}

button.swiper-pagination-bullet {
    border: none;
    margin: 0;
    padding: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none
}

.swiper-pagination-clickable .swiper-pagination-bullet {
    cursor: pointer
}

.swiper-pagination-bullet-active {
    opacity: 1;
    background: var(--swiper-pagination-color, var(--swiper-theme-color))
}

.swiper-container-vertical>.swiper-pagination-bullets {
    right: 10px;
    top: 50%;
    -webkit-transform: translate3d(0, -50%, 0);
    transform: translate3d(0, -50%, 0)
}

.swiper-container-vertical>.swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 6px 0;
    display: block
}

.swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 8px
}

.swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
    display: inline-block;
    -webkit-transition: .2s transform, .2s top;
    -o-transition: .2s transform, .2s top;
    transition: .2s transform, .2s top
}

.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 0 4px
}

.swiper-container-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    white-space: nowrap
}

.swiper-container-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
    -webkit-transition: .2s transform, .2s left;
    -o-transition: .2s transform, .2s left;
    transition: .2s transform, .2s left
}

.swiper-container-horizontal.swiper-container-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
    -webkit-transition: .2s transform, .2s right;
    -o-transition: .2s transform, .2s right;
    transition: .2s transform, .2s right
}

.swiper-pagination-progressbar {
    background: rgba(0, 0, 0, 0.25);
    position: absolute
}

.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
    background: var(--swiper-pagination-color, var(--swiper-theme-color));
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    -webkit-transform: scale(0);
    -ms-transform: scale(0);
    transform: scale(0);
    -webkit-transform-origin: left top;
    -ms-transform-origin: left top;
    transform-origin: left top
}

.swiper-container-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
    -webkit-transform-origin: right top;
    -ms-transform-origin: right top;
    transform-origin: right top
}

.swiper-container-horizontal>.swiper-pagination-progressbar,
.swiper-container-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite {
    width: 100%;
    height: 4px;
    left: 0;
    top: 0
}

.swiper-container-horizontal>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,
.swiper-container-vertical>.swiper-pagination-progressbar {
    width: 4px;
    height: 100%;
    left: 0;
    top: 0
}

.swiper-pagination-white {
    --swiper-pagination-color: var(--color-w100, #FFFFFF)
}

.swiper-pagination-black {
    --swiper-pagination-color: var(--color-pb100, #000000)
}

.swiper-pagination-lock {
    display: none
}

.swiper-scrollbar {
    border-radius: 10px;
    position: relative;
    background: var(--color-pb10, #00000019)
}

.swiper-container-horizontal>.swiper-scrollbar {
    position: absolute;
    left: 1%;
    bottom: 3px;
    z-index: 50;
    height: 5px;
    width: 98%
}

.swiper-container-vertical>.swiper-scrollbar {
    position: absolute;
    right: 3px;
    top: 1%;
    z-index: 50;
    width: 5px;
    height: 98%
}

.swiper-scrollbar-drag {
    height: 100%;
    width: 100%;
    position: relative;
    background: var(--color-pb50, #0000007F);
    border-radius: 10px;
    left: 0;
    top: 0
}

.swiper-scrollbar-cursor-drag {
    cursor: move
}

.swiper-scrollbar-lock {
    display: none
}

.swiper-zoom-container {
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center
}

.swiper-zoom-container>canvas,
.swiper-zoom-container>img,
.swiper-zoom-container>svg {
    max-width: 100%;
    max-height: 100%;
    -o-object-fit: contain;
    object-fit: contain
}

.swiper-slide-zoomed {
    cursor: move
}

.swiper-lazy-preloader {
    width: 42px;
    height: 42px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -21px;
    margin-top: -21px;
    z-index: 10;
    -webkit-transform-origin: 50%;
    -ms-transform-origin: 50%;
    transform-origin: 50%;
    -webkit-animation: swiper-preloader-spin 1s infinite linear;
    animation: swiper-preloader-spin 1s infinite linear;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border: 4px solid var(--swiper-preloader-color, var(--swiper-theme-color));
    border-radius: 50%;
    border-top-color: transparent
}

.swiper-lazy-preloader-white {
    --swiper-preloader-color: var(--color-w100, #FFFFFF)
}

.swiper-lazy-preloader-black {
    --swiper-preloader-color: var(--color-pb100, #000000)
}

@-webkit-keyframes swiper-preloader-spin {
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

@keyframes swiper-preloader-spin {
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

.swiper-container .swiper-notification {
    position: absolute;
    left: 0;
    top: 0;
    pointer-events: none;
    opacity: 0;
    z-index: -1000
}

.swiper-container-fade.swiper-container-free-mode .swiper-slide {
    -webkit-transition-timing-function: ease-out;
    -o-transition-timing-function: ease-out;
    transition-timing-function: ease-out
}

.swiper-container-fade .swiper-slide {
    pointer-events: none;
    -webkit-transition-property: opacity;
    -o-transition-property: opacity;
    transition-property: opacity
}

.swiper-container-fade .swiper-slide .swiper-slide {
    pointer-events: none
}

.swiper-container-fade .swiper-slide-active,
.swiper-container-fade .swiper-slide-active .swiper-slide-active {
    pointer-events: auto
}

.swiper-container-cube {
    overflow: visible
}

.swiper-container-cube .swiper-slide {
    pointer-events: none;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    z-index: 1;
    visibility: hidden;
    -webkit-transform-origin: 0 0;
    -ms-transform-origin: 0 0;
    transform-origin: 0 0;
    width: 100%;
    height: 100%
}

.swiper-container-cube .swiper-slide .swiper-slide {
    pointer-events: none
}

.swiper-container-cube.swiper-container-rtl .swiper-slide {
    -webkit-transform-origin: 100% 0;
    -ms-transform-origin: 100% 0;
    transform-origin: 100% 0
}

.swiper-container-cube .swiper-slide-active,
.swiper-container-cube .swiper-slide-active .swiper-slide-active {
    pointer-events: auto
}

.swiper-container-cube .swiper-slide-active,
.swiper-container-cube .swiper-slide-next,
.swiper-container-cube .swiper-slide-next+.swiper-slide,
.swiper-container-cube .swiper-slide-prev {
    pointer-events: auto;
    visibility: visible
}

.swiper-container-cube .swiper-slide-shadow-bottom,
.swiper-container-cube .swiper-slide-shadow-left,
.swiper-container-cube .swiper-slide-shadow-right,
.swiper-container-cube .swiper-slide-shadow-top {
    z-index: 0;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

.swiper-container-cube .swiper-cube-shadow {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background: var(--color-pb100, #000);
    opacity: .6;
    -webkit-filter: blur(50px);
    filter: blur(50px);
    z-index: 0
}

.swiper-container-flip {
    overflow: visible
}

.swiper-container-flip .swiper-slide {
    pointer-events: none;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    z-index: 1
}

.swiper-container-flip .swiper-slide .swiper-slide {
    pointer-events: none
}

.swiper-container-flip .swiper-slide-active,
.swiper-container-flip .swiper-slide-active .swiper-slide-active {
    pointer-events: auto
}

.swiper-container-flip .swiper-slide-shadow-bottom,
.swiper-container-flip .swiper-slide-shadow-left,
.swiper-container-flip .swiper-slide-shadow-right,
.swiper-container-flip .swiper-slide-shadow-top {
    z-index: 0;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

[class^="component"].no-space .swiper-container {
    padding-left: 2rem;
    padding-right: 2rem
}

.swiper-container-fade .swiper-slide {
    opacity: 0 !important
}

.swiper-container-fade .swiper-slide.swiper-slide-active,
.swiper-container-fade .swiper-slide.swiper-slide-duplicate-active {
    opacity: 1 !important
}

.carousel-group-animation .swiper-slide {
    padding-top: 1.8rem;
    -webkit-transition: padding-top 0.2s var(--kds-easing-linear);
    -o-transition: padding-top 0.2s var(--kds-easing-linear);
    transition: padding-top 0.2s var(--kds-easing-linear)
}

.carousel-group-animation .swiper-slide .kds-banner-card__btn {
    padding-top: 0;
    -webkit-transition: padding-top 0.2s var(--kds-easing-linear);
    -o-transition: padding-top 0.2s var(--kds-easing-linear);
    transition: padding-top 0.2s var(--kds-easing-linear)
}

.carousel-group-animation .swiper-slide-active {
    padding-top: 0
}

.carousel-group-animation .swiper-slide-active .kds-banner-card__btn {
    padding-top: 1.8rem
}

.carousel-group-animation .swiper-pagination {
    margin-top: 1.6rem
}

.swiper-container.swiper-container-flex .swiper-slide {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    height: auto;
    max-width: 28rem
}

.swiper-container.swiper-container-flex .swiper-slide>* {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 100%;
    flex: 1 1 100%
}

/*! 공통 스타일 */

.mt-1 {
    margin-top: -0.1rem !important
}

.mt-2 {
    margin-top: -0.2rem !important
}

.mt-3 {
    margin-top: -0.3rem !important
}

.mt-4 {
    margin-top: -0.4rem !important
}

.mt-5 {
    margin-top: -0.5rem !important
}

.mt-15 {
    margin-top: -1.5rem !important
}

.mt2 {
    margin-top: 0.2rem !important
}

.mt3 {
    margin-top: 0.3rem !important
}

.mt4 {
    margin-top: 0.4rem !important
}

.mt5 {
    margin-top: 0.5rem !important
}

.mt6 {
    margin-top: 0.6rem !important
}

.mt7 {
    margin-top: 0.7rem !important
}

.mt8 {
    margin-top: 0.8rem !important
}

.mt9 {
    margin-top: 0.9rem !important
}

.mt11 {
    margin-top: 1.1rem !important
}

.mt12 {
    margin-top: 1.2rem !important
}

.mt14 {
    margin-top: 1.4rem !important
}

.mt16 {
    margin-top: 1.6rem !important
}

.mt17 {
    margin-top: 1.7rem !important
}

.mt18 {
    margin-top: 1.8rem !important
}

.mt23 {
    margin-top: 2.3rem !important
}

.mt24 {
    margin-top: 2.4rem !important
}

.mt26 {
    margin-top: 2.6rem !important
}

.mt28 {
    margin-top: 2.8rem !important
}

.mt32 {
    margin-top: 3.2rem !important
}

.mt36 {
    margin-top: 3.6rem !important
}

.mt38 {
    margin-top: 3.8rem !important
}

.mt52 {
    margin-top: 5.2rem !important
}

.mt54 {
    margin-top: 5.4rem !important
}

.mt60 {
    margin-top: 6rem !important
}

.mt64 {
    margin-top: 6.4rem !important
}

.mt72 {
    margin-top: 7.2rem !important
}

.mt74 {
    margin-top: 7.4rem !important
}

.mt76 {
    margin-top: 7.6rem !important
}

.mt77 {
    margin-top: 7.7rem !important
}

.mt100 {
    margin-top: 10rem !important
}

.mt108 {
    margin-top: 10.8rem !important
}

.mt111 {
    margin-top: 11.1rem !important
}

.mt190 {
    margin-top: 19rem !important
}

.mt227 {
    margin-top: 22.7rem !important
}

.mt246 {
    margin-top: 24.6rem !important
}

.m00 {
    margin: 0 !important
}

.mt0 {
    margin-top: 0 !important
}

.mt5 {
    margin-top: 0.5rem !important
}

.mt10 {
    margin-top: 1rem !important
}

.mt11 {
    margin-top: 1.1rem !important
}

.mt12 {
    margin-top: 1.2rem !important
}

.mt15 {
    margin-top: 1.5rem !important
}

.mt16 {
    margin-top: 1.6rem !important
}

.mt19 {
    margin-top: 1.9rem !important
}

.mt20 {
    margin-top: 2rem !important
}

.mt22 {
    margin-top: 2.2rem !important
}

.mt24 {
    margin-top: 2.4rem !important
}

.mt25 {
    margin-top: 2.5rem !important
}

.mt28 {
    margin-top: 2.8rem !important
}

.mt30 {
    margin-top: 3rem !important
}

.mt32 {
    margin-top: 3.2rem !important
}

.mt35 {
    margin-top: 3.5rem !important
}

.mt36 {
    margin-top: 3.6rem !important
}

.mt40 {
    margin-top: 4rem !important
}

.mt44 {
    margin-top: 4.4rem !important
}

.mt45 {
    margin-top: 4.5rem !important
}

.mt48 {
    margin-top: 4.8rem !important
}

.mt50 {
    margin-top: 5rem !important
}

.mt54 {
    margin-top: 5.4rem !important
}

.mt56 {
    margin-top: 5.6rem !important
}

.mt60 {
    margin-top: 6rem !important
}

.mt64 {
    margin-top: 6.4rem !important
}

.mt70 {
    margin-top: 7rem !important
}

.mt80 {
    margin-top: 8rem !important
}

.mt90 {
    margin-top: 9rem !important
}

.mt92 {
    margin-top: 9.2rem !important
}

.mt96 {
    margin-top: 9.6rem !important
}

.mt97 {
    margin-top: 9.7rem !important
}

.mt100 {
    margin-top: 10rem !important
}

.mt120 {
    margin-top: 12rem !important
}

.mt127 {
    margin-top: 12.7rem !important
}

.ml-5 {
    margin-left: -.5rem !important
}

.ml-12 {
    margin-left: -1.2rem !important
}

.ml-auto {
    margin-left: auto
}

.ml0 {
    margin-left: 0 !important
}

.ml2 {
    margin-left: 0.2rem !important
}

.ml3 {
    margin-left: 0.3rem !important
}

.ml4 {
    margin-left: 0.4rem !important
}

.ml5 {
    margin-left: 0.5rem !important
}

.ml6 {
    margin-left: 0.6rem !important
}

.ml7 {
    margin-left: 0.7rem !important
}

.ml8 {
    margin-left: 0.8rem !important
}

.ml10 {
    margin-left: 1rem !important
}

.ml12 {
    margin-left: 1.2rem !important
}

.ml14 {
    margin-left: 1.4rem !important
}

.ml15 {
    margin-left: 1.5rem !important
}

.ml16 {
    margin-left: 1.6rem !important
}

.ml20 {
    margin-left: 2rem !important
}

.ml28 {
    margin-left: 2.8rem !important
}

.ml30 {
    margin-left: 3rem !important
}

.ml32 {
    margin-left: 3.2rem !important
}

.ml34 {
    margin-left: 3.4rem !important
}

.ml36 {
    margin-left: 3.6rem !important
}

.ml40 {
    margin-left: 4rem !important
}

.ml50 {
    margin-left: 5rem !important
}

.mlmr-20 {
    margin-left: -2rem !important;
    margin-right: -2rem !important
}

.mr0 {
    margin-right: 0 !important
}

.mr2 {
    margin-right: 0.2rem !important
}

.mr4 {
    margin-right: 0.4rem !important
}

.mr5 {
    margin-right: 0.5rem !important
}

.mr6 {
    margin-right: .6rem !important
}

.mr8 {
    margin-right: 0.8rem !important
}

.mr10 {
    margin-right: 1rem !important
}

.mr12 {
    margin-right: 1.2rem !important
}

.mr15 {
    margin-right: 1.5rem !important
}

.mr16 {
    margin-right: 1.6rem !important
}

.mr20 {
    margin-right: 2rem !important
}

.mr30 {
    margin-right: 3rem !important
}

.mr40 {
    margin-right: 4rem !important
}

.mr50 {
    margin-right: 5rem !important
}

.mb0 {
    margin-bottom: 0 !important
}

.mb2 {
    margin-bottom: 0.2rem !important
}

.mb4 {
    margin-bottom: 0.4rem !important
}

.mb5 {
    margin-bottom: 0.5rem !important
}

.mb8 {
    margin-bottom: 0.8rem !important
}

.mb9 {
    margin-bottom: 0.9rem !important
}

.mb10 {
    margin-bottom: 1rem !important
}

.mb11 {
    margin-bottom: 1.1rem !important
}

.mb12 {
    margin-bottom: 1.2rem !important
}

.mb14 {
    margin-bottom: 1.4rem !important
}

.mb15 {
    margin-bottom: 1.5rem !important
}

.mb16 {
    margin-bottom: 1.6rem !important
}

.mb18 {
    margin-bottom: 1.8rem !important
}

.mb20 {
    margin-bottom: 2rem !important
}

.mb24 {
    margin-bottom: 2.4rem !important
}

.mb25 {
    margin-bottom: 2.5rem !important
}

.mb28 {
    margin-bottom: 2.8rem !important
}

.mb30 {
    margin-bottom: 3rem !important
}

.mb32 {
    margin-bottom: 3.2rem !important
}

.mb34 {
    margin-bottom: 3.4rem !important
}

.mb36 {
    margin-bottom: 3.6rem !important
}

.mb40 {
    margin-bottom: 4rem !important
}

.mb42 {
    margin-bottom: 4.2rem !important
}

.mb44 {
    margin-bottom: 4.4rem !important
}

.mb48 {
    margin-bottom: 4.8rem !important
}

.mb50 {
    margin-bottom: 5rem !important
}

.mb56 {
    margin-bottom: 5.6rem !important
}

.mb60 {
    margin-bottom: 6rem !important
}

.mb64 {
    margin-bottom: 6.4rem !important
}

.mb70 {
    margin-bottom: 7rem !important
}

.mb80 {
    margin-bottom: 8rem !important
}

.mb90 {
    margin-bottom: 9rem !important
}

.mb96 {
    margin-bottom: 9.6rem !important
}

.mb100 {
    margin-bottom: 10rem !important
}

.mgbNone {
    margin-bottom: 0 !important
}

.mtb16 {
    margin: 1.6rem 0 !important
}

.mb-24 {
    margin-bottom: -2.4rem !important
}

.p00 {
    padding: 0 !important
}

.p16 {
    padding: 1.6rem !important
}

.pd0 {
    padding: 0 !important
}

.pd8 {
    padding: .8rem !important
}

.pdtb18 {
    padding-top: 1.8rem !important;
    padding-bottom: 1.8rem !important
}

.pdtb20 {
    padding-top: 2rem !important;
    padding-bottom: 2rem !important
}

.pt0 {
    padding-top: 0 !important
}

.pt2 {
    padding-top: 0.2rem !important
}

.pt4 {
    padding-top: 0.4rem !important
}

.pt7 {
    padding-top: 0.7rem !important
}

.pt8 {
    padding-top: 0.8rem !important
}

.pt10 {
    padding-top: 1rem !important
}

.pt12 {
    padding-top: 1.2rem !important
}

.pt13 {
    padding-top: 1.3rem !important
}

.pt16 {
    padding-top: 1.6rem !important
}

.pt-15,
.pt15 {
    padding-top: 1.5rem !important
}

.pt19 {
    padding-top: 1.9rem !important
}

.pt20 {
    padding-top: 2rem !important
}

.pt24 {
    padding-top: 2.4rem !important
}

.pt28 {
    padding-top: 2.8rem !important
}

.pt32 {
    padding-top: 3.2rem !important
}

.pt36 {
    padding-top: 3.6rem !important
}

.pt40 {
    padding-top: 4rem !important
}

.pt44 {
    padding-top: 4.4rem !important
}

.pt48 {
    padding-top: 4.8rem !important
}

.pt50 {
    padding-top: 5rem !important
}

.pt56 {
    padding-top: 5.6rem !important
}

.pt64 {
    padding-top: 6.4rem !important
}

.pt72 {
    padding-top: 7.2rem !important
}

.pt80 {
    padding-top: 8rem !important
}

.pt90 {
    padding-top: 9rem !important
}

.pt20vh {
    padding-top: 20vh !important
}

.pt120 {
    padding-top: 12rem !important
}

.pl0 {
    padding-left: 0 !important
}

.pl2 {
    padding-left: .2rem !important
}

.pl16 {
    padding-left: 1.6rem !important
}

.pl10 {
    padding-left: 1rem !important
}

.pl8 {
    padding-left: .8rem !important
}

.pl20 {
    padding-left: 2rem !important
}

.pl24 {
    padding-left: 2.4rem !important
}

.pl40 {
    padding-left: 4rem !important
}

.pr0 {
    padding-right: 0 !important
}

.pr2 {
    padding-right: .2rem !important
}

.pr10 {
    padding-right: 1rem !important
}

.pr20 {
    padding-right: 2rem !important
}

.pb0 {
    padding-bottom: 0 !important
}

.pb1 {
    padding-bottom: .1rem !important
}

.pb2 {
    padding-bottom: .2rem !important
}

.pb4 {
    padding-bottom: .4rem !important
}

.pb5 {
    padding-bottom: .5rem !important
}

.pb6 {
    padding-bottom: .6rem !important
}

.pb8 {
    padding-bottom: .8rem !important
}

.pb10 {
    padding-bottom: 1rem !important
}

.pb12 {
    padding-bottom: 1.2rem !important
}

.pb13 {
    padding-bottom: 1.3rem !important
}

.pb16 {
    padding-bottom: 1.6rem !important
}

.pb19 {
    padding-bottom: 1.9rem !important
}

.pb20 {
    padding-bottom: 2rem !important
}

.pb24 {
    padding-bottom: 2.4rem !important
}

.pb28 {
    padding-bottom: 2.8rem !important
}

.pb32 {
    padding-bottom: 3.2rem !important
}

.pb34 {
    padding-bottom: 3.4rem !important
}

.pb36 {
    padding-bottom: 3.6rem !important
}

.pb38 {
    padding-bottom: 3.8rem !important
}

.pb40 {
    padding-bottom: 4rem !important
}

.pb44 {
    padding-bottom: 4rem !important
}

.pb48 {
    padding-bottom: 4.8rem !important
}

.pb52 {
    padding-bottom: 5.2rem !important
}

.pb56 {
    padding-bottom: 5.6rem !important
}

.pb60 {
    padding-bottom: 6rem !important
}

.pb68 {
    padding-bottom: 6.8rem !important
}

.pb70 {
    padding-bottom: 7rem !important
}

.pb72 {
    padding-bottom: 7.2rem !important
}

.pb80 {
    padding-bottom: 8rem !important
}

.pb154 {
    padding-bottom: 15.4rem !important
}

.ptb12 {
    padding-top: 1.2rem !important;
    padding-bottom: 1.2rem !important
}

.ptb20 {
    padding-top: 2rem !important;
    padding-bottom: 2rem !important
}

.ptb18 {
    padding-top: 1.8rem !important;
    padding-bottom: 1.8rem !important
}

.ptb28 {
    padding-top: 2.8rem !important;
    padding-bottom: 2.8rem !important
}

.ptb32 {
    padding-top: 3.2rem !important;
    padding-bottom: 3.2rem !important
}

.prl12 {
    padding-right: 1.2rem !important;
    padding-left: 1.2rem !important
}

.prl20 {
    padding-right: 2rem !important;
    padding-left: 2rem !important
}

.prl22 {
    padding-right: 2.2rem !important;
    padding-left: 2.2rem !important
}

.px4 {
    padding-left: 0.4rem !important;
    padding-right: 0.4rem !important
}

.px6 {
    padding-left: 0.6rem !important;
    padding-right: 0.6rem !important
}

.px8 {
    padding-left: 0.8rem !important;
    padding-right: 0.8rem !important
}

.px24 {
    padding-left: 2.4rem !important;
    padding-right: 2.4rem !important
}

.p4 {
    padding: 0.4rem !important
}

.bd0 {
    border: 0 !important
}

.bt0 {
    border-top: 0 !important
}

.bb0 {
    border-bottom: 0 !important
}

.f11 {
    font-size: 1.1rem !important
}

.f12 {
    font-size: 1.2rem !important
}

.f13 {
    font-size: 1.3rem !important
}

.f14 {
    font-size: 1.4rem !important
}

.f15 {
    font-size: 1.5rem !important
}

.f16 {
    font-size: 1.6rem !important
}

.f17 {
    font-size: 1.7rem !important
}

.f18 {
    font-size: 1.8rem !important
}

.f19 {
    font-size: 1.9rem !important
}

.f20 {
    font-size: 2.0rem !important
}

.f21 {
    font-size: 2.1rem !important
}

.f22 {
    font-size: 2.2rem !important
}

.f24 {
    font-size: 2.4rem !important
}

.f26 {
    font-size: 2.6rem !important
}

.f30 {
    font-size: 3.0rem !important
}

.fw400 {
    font-weight: 400 !important
}

.fw500 {
    font-weight: 500 !important
}

.fw600 {
    font-weight: 600 !important
}

.bold {
    font-weight: 700 !important
}

.tac {
    text-align: center !important
}

.tar {
    text-align: right !important
}

.tal {
    text-align: left !important
}

.vam {
    vertical-align: middle !important
}

.vat {
    vertical-align: top !important
}

.relative {
    position: relative !important
}

.p-static {
    position: static !important
}

.z-top {
    z-index: 9999 !important
}

.z-bot {
    z-index: -9999 !important
}

.h-56 {
    height: 5.6rem !important
}

.h-80 {
    height: 8rem !important
}

.h-100 {
    height: 10rem !important
}

.h-120 {
    height: 12rem !important
}

.h-150 {
    height: 15rem !important
}

.over-x-none {
    overflow-x: hidden !important
}

.over-y-none {
    overflow-y: hidden !important
}

.over-y-auto {
    overflow-y: auto !important
}

.overflow-inherit {
    overflow: inherit !important
}

.border-none {
    border: 0 !important
}

.break-all {
    word-break: break-all !important
}

.keep-all {
    word-break: keep-all !important
}

.bg-attach-scroll {
    background-attachment: scroll
}

.dsp-inline {
    display: inline !important
}

.lh16 {
    line-height: 1.6rem !important
}

.lh30 {
    line-height: 3.0rem !important
}

.lh32 {
    line-height: 3.2rem !important
}

.ws-nowrap {
    white-space: nowrap !important
}

.bg-trans {
    background-color: transparent !important
}

.no-filter {
    -webkit-filter: none !important;
    filter: none !important
}

.bg-color-qua {
    background-color: var(--bg-qua) !important
}

.bg-unset {
    background: unset !important
}

.bg-color-violet-vo50 {
    background-color: var(--color-violet-vo50) !important
}

.bg-color-indigo-in50 {
    background-color: var(--color-indigo-in50) !important
}

.bg-color-seaform-sf600 {
    background-color: var(--color-seaform-sf600) !important
}

.bg-color-green-gn600 {
    background-color: var(--color-green-gn600) !important
}

.bg-color-vo400 {
    background-color: var(--color-vo400) !important
}

.bg-color-vo600 {
    background-color: var(--color-vo600) !important
}

.bg-color-vo800 {
    background-color: var(--color-vo800) !important
}

.bg-color-F4F6F9 {
    background-color: var(--color-F4F6F9) !important
}

.bg-color-bu50 {
    background-color: var(--color-bu50) !important
}

.bg-color-F85C39 {
    background-color: var(--color-F85C39) !important
}

.bg-color-w100 {
    background-color: var(--color-w100) !important
}

.bg-color-grey-g400 {
    background-color: var(--color-grey-g400) !important
}

.bg-color-grey-g500 {
    background-color: var(--color-grey-g500) !important
}

.bg-color-og300 {
    background-color: var(--color-og300) !important
}

.bg-color-og500 {
    background-color: var(--color-og500) !important
}

.bg-color-sf200 {
    background-color: var(--color-sf200) !important
}

.bg-color-sf500 {
    background-color: var(--color-sf500) !important
}

.bg-color-in25 {
    background-color: var(--color-in25) !important
}

.bg-color-in400 {
    background-color: var(--color-in400) !important
}

.bg-color-in600 {
    background-color: var(--color-in600) !important
}

.bg-color-bu25 {
    background-color: var(--color-bu25) !important
}

.bg-color-sf25 {
    background-color: var(--color-sf25) !important
}

.bg-color-yl200 {
    background-color: var(--color-yl200) !important
}

.border-color-qua {
    border-color: var(--border-qua) !important
}

.border-color-quin {
    border-color: var(--border-quin) !important
}

.border-color-sec-active {
    border-color: var(--border-sec-active) !important
}

.border-radius-2 {
    border-radius: 0.2rem !important
}

.border-radius-4 {
    border-radius: 0.4rem !important
}

.border-radius-6 {
    border-radius: 0.6rem !important
}

.border-radius-8 {
    border-radius: 0.8rem !important
}

.border-radius-10 {
    border-radius: 1rem !important
}

.border-radius-12 {
    border-radius: 1.2rem !important
}

.border-radius-14 {
    border-radius: 1.4rem !important
}

.border-radius-16 {
    border-radius: 1.6rem !important
}

.border-radius-18 {
    border-radius: 1.8rem !important
}

.border-radius-20 {
    border-radius: 2rem !important
}

.border-radius-21 {
    border-radius: 2.1rem !important
}

.border-radius-36 {
    border-radius: 3.6rem !important
}

.opacity-70 {
    opacity: 0.7 !important
}

.border-top {
    border-top-width: 0.1rem;
    border-top-style: solid
}

.border-right {
    border-right-width: 0.1rem;
    border-right-style: solid
}

.border-bottom {
    border-bottom-width: 0.1rem;
    border-bottom-style: solid
}

.border-left {
    border-left-width: 0.1rem;
    border-left-style: solid
}

/*! 한쪽 방향 border가 필요한 경우(상/하/좌/우)사용 Helper 클래스는 꼭 필요한 경우에만 임시로 사용 color는 _variables_a11y.scss에 --border-XX로 정의된 변수만 사용!!! */

.border-top-quin {
    border-top: 1px solid var(--border-quin)
}

.border-top-qua {
    border-top: 1px solid var(--border-qua)
}

.border-top-pri {
    border-top: 1px solid var(--border-pri)
}

.border-top-accent-pri {
    border-top: 1px solid var(--border-accent-pri)
}

.border-top-accent-sec {
    border-top: 1px solid var(--border-accent-sec)
}

.border-top-sec {
    border-top: 1px solid var(--border-sec)
}

.border-top-ter {
    border-top: 1px solid var(--border-ter)
}

.border-all-quin {
    border: 1px solid var(--border-quin)
}

.border-all-qua {
    border: 1px solid var(--border-qua)
}

.border-all-pri {
    border: 1px solid var(--border-pri)
}

.border-all-accent-pri {
    border: 1px solid var(--border-accent-pri)
}

.border-all-accent-sec {
    border: 1px solid var(--border-accent-sec)
}

.border-all-sec {
    border: 1px solid var(--border-sec)
}

.border-all-ter {
    border: 1px solid var(--border-ter)
}

.border-right-quin {
    border-right: 1px solid var(--border-quin)
}

.border-right-qua {
    border-right: 1px solid var(--border-qua)
}

.border-right-pri {
    border-right: 1px solid var(--border-pri)
}

.border-right-accent-pri {
    border-right: 1px solid var(--border-accent-pri)
}

.border-right-accent-sec {
    border-right: 1px solid var(--border-accent-sec)
}

.border-right-sec ter {
    border-right: 1px solid var(--border-sec ter)
}

.border-all-quin {
    border: 1px solid var(--border-quin)
}

.border-all-qua {
    border: 1px solid var(--border-qua)
}

.border-all-pri {
    border: 1px solid var(--border-pri)
}

.border-all-accent-pri {
    border: 1px solid var(--border-accent-pri)
}

.border-all-accent-sec {
    border: 1px solid var(--border-accent-sec)
}

.border-all-sec ter {
    border: 1px solid var(--border-sec ter)
}

.border-bottom-quin {
    border-bottom: 1px solid var(--border-quin)
}

.border-bottom-qua {
    border-bottom: 1px solid var(--border-qua)
}

.border-bottom-pri {
    border-bottom: 1px solid var(--border-pri)
}

.border-bottom-accent-pri {
    border-bottom: 1px solid var(--border-accent-pri)
}

.border-bottom-accent-sec {
    border-bottom: 1px solid var(--border-accent-sec)
}

.border-bottom-sec ter {
    border-bottom: 1px solid var(--border-sec ter)
}

.border-bottom-pri-down {
    border-bottom: 1px solid var(--border-pri-down)
}

.border-all-quin {
    border: 1px solid var(--border-quin)
}

.border-all-qua {
    border: 1px solid var(--border-qua)
}

.border-all-pri {
    border: 1px solid var(--border-pri)
}

.border-all-accent-pri {
    border: 1px solid var(--border-accent-pri)
}

.border-all-accent-sec {
    border: 1px solid var(--border-accent-sec)
}

.border-all-sec ter {
    border: 1px solid var(--border-sec ter)
}

.border-all-pri-down {
    border: 1px solid var(--border-pri-down)
}

.border-left-quin {
    border-left: 1px solid var(--border-quin)
}

.border-left-qua {
    border-left: 1px solid var(--border-qua)
}

.border-left-pri {
    border-left: 1px solid var(--border-pri)
}

.border-left-accent-pri {
    border-left: 1px solid var(--border-accent-pri)
}

.border-left-accent-sec {
    border-left: 1px solid var(--border-accent-sec)
}

.border-left-sec ter {
    border-left: 1px solid var(--border-sec ter)
}

.border-all-quin {
    border: 1px solid var(--border-quin)
}

.border-all-qua {
    border: 1px solid var(--border-qua)
}

.border-all-pri {
    border: 1px solid var(--border-pri)
}

.border-all-accent-pri {
    border: 1px solid var(--border-accent-pri)
}

.border-all-accent-sec {
    border: 1px solid var(--border-accent-sec)
}

.border-all-sec ter {
    border: 1px solid var(--border-sec ter)
}

/*! component element text util class */

.underline {
    text-decoration: underline;
    text-underline-offset: 1px
}

.ios .underline {
    text-underline-offset: 3px
}

.underline.primary1 {
    color: var(--color-pn, #17008c)
}

.line-through {
    text-decoration: line-through
}

.underline-after {
    display: inline-block;
    position: relative;
    font-size: 2.8rem;
    font-weight: 400;
    line-height: 4.2rem;
    color: var(--txt-pri);
    padding: 0 .5rem
}

.underline-after::after {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    bottom: -.2rem;
    width: 100%;
    height: 2rem;
    background-color: var(--ico-highlight);
    z-index: -1
}

/*! flex class */

.d-flex {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important
}

.d-flex-inline {
    display: -webkit-inline-box !important;
    display: -ms-inline-flexbox !important;
    display: inline-flex !important
}

.d-flex-wr {
    -ms-flex-wrap: wrap !important;
    flex-wrap: wrap !important
}

.d-flex-nwr {
    -ms-flex-wrap: nowrap !important;
    flex-wrap: nowrap !important
}

.d-flex-dr-c {
    -webkit-box-orient: vertical !important;
    -webkit-box-direction: normal !important;
    -ms-flex-direction: column !important;
    flex-direction: column !important
}

.d-flex-dr-r {
    -webkit-box-orient: horizontal !important;
    -webkit-box-direction: normal !important;
    -ms-flex-direction: row !important;
    flex-direction: row !important
}

.d-flex-dr-cr {
    -webkit-box-orient: vertical !important;
    -webkit-box-direction: reverse !important;
    -ms-flex-direction: column-reverse !important;
    flex-direction: column-reverse !important
}

.d-flex-dr-rr {
    -webkit-box-orient: horizontal !important;
    -webkit-box-direction: reverse !important;
    -ms-flex-direction: row-reverse !important;
    flex-direction: row-reverse !important
}

.d-flex-ai-center {
    -webkit-box-align: center !important;
    -ms-flex-align: center !important;
    align-items: center !important
}

.d-flex-ai-start {
    -webkit-box-align: start !important;
    -ms-flex-align: start !important;
    align-items: flex-start !important
}

.d-flex-ai-end {
    -webkit-box-align: end !important;
    -ms-flex-align: end !important;
    align-items: flex-end !important
}

.d-flex-ai-stretch {
    -webkit-box-align: stretch !important;
    -ms-flex-align: stretch !important;
    align-items: stretch !important
}

.d-flex-ac-center {
    -ms-flex-line-pack: center !important;
    align-content: center !important
}

.d-flex-ac-start {
    -ms-flex-line-pack: start !important;
    align-content: flex-start !important
}

.d-flex-ac-end {
    -ms-flex-line-pack: end !important;
    align-content: flex-end !important
}

.d-flex-ac-stretch {
    -ms-flex-line-pack: stretch !important;
    align-content: stretch !important
}

.d-flex-as-center {
    -ms-flex-item-align: center !important;
    align-self: center !important
}

.d-flex-as-start {
    -ms-flex-item-align: start !important;
    align-self: flex-start !important
}

.d-flex-as-end {
    -ms-flex-item-align: end !important;
    align-self: flex-end !important
}

.d-flex-as-stretch {
    -ms-flex-item-align: stretch !important;
    align-self: stretch !important
}

.d-flex-jc-center {
    -webkit-box-pack: center !important;
    -ms-flex-pack: center !important;
    justify-content: center !important
}

.d-flex-jc-start {
    -webkit-box-pack: start !important;
    -ms-flex-pack: start !important;
    justify-content: flex-start !important
}

.d-flex-jc-end {
    -webkit-box-pack: end !important;
    -ms-flex-pack: end !important;
    justify-content: flex-end !important
}

.d-flex-jc-around {
    -ms-flex-pack: distribute !important;
    justify-content: space-around !important
}

.d-flex-jc-between {
    -webkit-box-pack: justify !important;
    -ms-flex-pack: justify !important;
    justify-content: space-between !important
}

.d-flex-b {
    -ms-flex-preferred-size: auto !important;
    flex-basis: auto !important
}

.d-flex-b0 {
    -ms-flex-preferred-size: 0 !important;
    flex-basis: 0 !important
}

.d-flex-s {
    -ms-flex-negative: 1 !important;
    flex-shrink: 1 !important
}

.d-flex-s0 {
    -ms-flex-negative: 0 !important;
    flex-shrink: 0 !important
}

.d-flex-g {
    -webkit-box-flex: 0 !important;
    -ms-flex-positive: 0 !important;
    flex-grow: 0 !important
}

.d-flex-g1 {
    -webkit-box-flex: 1 !important;
    -ms-flex-positive: 1 !important;
    flex-grow: 1 !important
}

.d-flex0 {
    -webkit-box-flex: 0 !important;
    -ms-flex: 0 !important;
    flex: 0 !important
}

.d-flex1 {
    -webkit-box-flex: 1 !important;
    -ms-flex: 1 !important;
    flex: 1 !important
}

.d-flex11-auto {
    -webkit-box-flex: 1 !important;
    -ms-flex: 1 1 auto !important;
    flex: 1 1 auto !important
}

.d-flex01-auto {
    -webkit-box-flex: 0 !important;
    -ms-flex: 0 1 auto !important;
    flex: 0 1 auto !important
}

.d-flex00-auto {
    -webkit-box-flex: 0 !important;
    -ms-flex: 0 0 auto !important;
    flex: 0 0 auto !important
}

.gap4 {
    gap: 0.4rem
}

.gap12 {
    gap: 1.2rem
}

/*! 상품상세 대응 */

.pcshow {
    display: none !important
}

.mbshow {
    display: inherit !important
}

.pc_show {
    display: none !important
}

.mweb_show {
    display: none
}

.pc_table {
    display: none
}

.mob_tbale {
    display: table
}

.imgwidebox {
    position: relative
}

.imgwidebox img {
    display: block;
    max-width: 100%
}

.mob_show {
    display: none !important
}

.mobile .mob_show {
    display: block !important
}

.mobile .mobileweb .mob_show {
    display: none !important
}

@media screen and (min-width: 699px) {
    .mbshow {
        display: none !important
    }
    .pcshow {
        display: inherit !important
    }
    .pc_show {
        display: block !important
    }
    .pc_table {
        display: table
    }
    .mob_table {
        display: none
    }
}

@media screen and (max-width: 698px) {
    .mob_show {
        display: block !important
    }
}

/*! 유량제어팝업 솔루션 아이디값 속성 부여 */

#NetFunnel_Skin_Top {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9999;
    background-color: var(--color-w100, #fff)
}

/*! float 해제 클래스 */

.clfix:after,
.clfix:before {
    display: table;
    line-height: 0;
    content: ""
}

.clfix:after {
    clear: both
}

/*! 웹접근성 관련 소스 숨김 텍스트 처리 클래스 */

/*! s: FETASK-a11y common */

.blind,
.hide-txt {
    overflow: hidden;
    display: inline-block;
    position: absolute;
    width: 1px;
    height: 1px;
    font-size: 1px;
    line-height: 0;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    margin: -1px;
    padding: 0;
    border: 0
}

:root .hide-txt {
    /*! mixin :접근성을 위한 대체텍스트나 요소의 hidden 처리시 사용 */
    position: absolute;
    display: inline-block;
    overflow: hidden;
    width: 0;
    height: 0;
    margin: -1px;
    padding: 0;
    border: 0;
    clip: rect(0, 0, 0, 0);
    -webkit-clip-path: inset(50%);
    clip-path: inset(50%);
    font-size: 1px;
    line-height: 0;
    word-break: initial;
    word-wrap: initial;
    white-space: nowrap
}

:root .blind {
    /*! mixin :접근성을 위한 대체텍스트나 요소의 hidden 처리시 사용 */
    position: absolute;
    display: inline-block;
    overflow: hidden;
    width: 0;
    height: 0;
    margin: -1px;
    padding: 0;
    border: 0;
    clip: rect(0, 0, 0, 0);
    -webkit-clip-path: inset(50%);
    clip-path: inset(50%);
    font-size: 1px;
    line-height: 0;
    word-break: initial;
    word-wrap: initial;
    white-space: nowrap
}

:root .hide-txt-inline {
    /*! mixin :접근성을 위한 대체텍스트나 요소의 hidden 처리시 사용 */
    position: absolute;
    display: inline-block;
    overflow: hidden;
    width: 0;
    height: 0;
    margin: -1px;
    padding: 0;
    border: 0;
    clip: rect(0, 0, 0, 0);
    -webkit-clip-path: inset(50%);
    clip-path: inset(50%);
    font-size: 1px;
    line-height: 0;
    word-break: initial;
    word-wrap: initial;
    white-space: nowrap;
    z-index: -1;
    display: inline;
    position: relative
}

/*! e: FETASK-a11y common */

/*! 웹접근성 관련 소스 a태그 자식요소의 hide-txt 클래스는 모바일 디바이스 사이즈에서 font-size:1px 을 font-size:0 으로 변경해야 초점 오류를 방지할 수 있다. 참고사항 : 모바일 분기 사이즈에 따라 아래 max-width 값은 변경될 수 있음. */

@media (max-width: 1024px) {
    a .blind,
    a .hide-txt {
        font-size: 0
    }
}

/*! 웹접근성 관련 소스 보이스오버 초점 주의사항 : a태그의 before 가상클래스 사용하지 말 것 */

a:before {
    content: '';
    position: absolute;
    font-size: 0
}

/*! 웹접근성 관련 소스 강제 포커스 생성되는 곳의 아웃라인을 제거하는 소스 */

[tabindex="-1"]:focus {
    outline: 0
}

/*! skipnav 웹접근성 관련 네비게이션 */

.skipnav {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 9999;
    width: 100%;
    height: 0;
    line-height: 1
}

.skipnav a {
    display: block;
    overflow: hidden;
    width: 1px;
    height: 1px;
    margin: 0 -1px -1px 0;
    padding: 0;
    font-size: 0;
    line-height: 1
}

.skipnav a:active,
.skipnav a:focus,
.skipnav a:hover {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 50;
    width: 100%;
    height: 19px;
    margin: 0;
    padding: 5px 0;
    border: 1px solid #c4d7ea;
    background: #2b6cb0;
    color: var(--color-w100, #fff);
    font-weight: 700;
    font-size: 1.333em;
    text-align: center;
    line-height: 100%
}

/*! html layout 레이아웃 */

body,
html {
    height: 100%
}

#wrap-mmk {
    height: 100%
}

#content-mmk {
    height: 100%
}

[class^="kbank-page-container-"] {
    height: 100%
}

[class^="kbank-page-wrapper-"] {
    height: 100%
}

[class^="kbank-page-"] {
    width: 100%;
    background-color: var(--color-w100, #fff);
    height: 100%
}

.page-inner-scroll {
    position: relative;
    overflow-y: auto;
    height: 100%;
    z-index: 0
}

.page-inner-scroll.none {
    position: static;
    height: 100vh;
    overflow-y: hidden
}

.page-inner-scroll.scrolling .component-header {
    position: -webkit-sticky;
    position: sticky;
    -webkit-transition: background .3s;
    -o-transition: background .3s;
    transition: background .3s
}

.page-inner-scroll.scrolling .component-tab.sticky-tab02 .tab-round-group {
    position: -webkit-sticky;
    position: sticky;
    top: 5rem
}

.page-inner-scroll.scrolling .component-text-simple.fixed-top {
    position: -webkit-sticky;
    position: sticky;
    top: 0.9rem
}

.page-inner-scroll.bg-gradient-g100 {
    background: var(--color-gradient-l_g100t_4_down)
}

.page-inner-scroll.inandout-scroll {
    background: var(--bg-base-invert)
}

.page-inner-scroll.inandout-scroll.scrolling {
    background: -webkit-gradient(linear, left top, left bottom, from(black), color-stop(40%, #000), color-stop(41%, #fff));
    background: -o-linear-gradient(top, #000 0, #000 40%, #fff 41%);
    background: linear-gradient(to bottom, #000 0, #000 40%, #fff 41%)
}

.page-inner-scroll.today-coupon {
    background: url(/resource/img/mmk/common/today_coupon/random_bg.svg) no-repeat 50% 0/cover
}

.page-inner-scroll.money-mission {
    background: transparent !important
}

.page-inner-scroll.money-mission .money-mission-background {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background: url(/resource/img/mmk/common/moneymission/bg_moneymission.png) no-repeat 50% 0/cover
}

.page-inner-scroll.money-mission .container-component {
    padding-bottom: 0
}

.page-inner-scroll.money-mission .component-header {
    background: transparent
}

.page-inner-scroll.no-overscroll-y {
    overscroll-behavior-y: none
}

.page-inner-scroll.policy-detail .component-btn.fixed-bottom {
    display: none
}

.page-inner-scroll.policy-detail.scrolling .component-btn.fixed-bottom {
    display: block
}

.page-inner-scroll.bg-qua {
    background-color: var(--bg-qua)
}

.page-inner-scroll.bg-ter {
    background-color: var(--bg-ter)
}

.page-inner-scroll.bg-upbitlounge {
    background: -webkit-gradient(linear, left top, left bottom, from(#e3ebfc), color-stop(80%, #fff));
    background: -o-linear-gradient(top, #e3ebfc 0, #fff 80%);
    background: linear-gradient(180deg, #e3ebfc 0, #fff 80%)
}

.container-component.container-fixed {
    padding-top: 5rem
}

.container-component.container-fixed .component-header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%
}

.page-inner-scroll.no-overscroll-y .container-component {
    padding-top: 5rem
}

.page-inner-scroll.no-overscroll-y .container-component .component-header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%
}

.container-component.in-and-out {
    position: relative
}

.container-component.in-and-out::before {
    content: '';
    width: 100%;
    height: 70rem;
    position: absolute;
    background: url("../../../../resource/img/mmk/common/inandout/bg_inandout.png") no-repeat 0 0;
    background-size: 100% 100%;
    z-index: -1
}

.container-component.in-and-out .component-header {
    background-color: var(--color-w0)
}

.container-component.in-and-out .blur {
    display: block;
    -webkit-backdrop-filter: blur(1rem) opacity(0.8);
    backdrop-filter: blur(1rem) opacity(0.8)
}

.container-component.in-and-out.in-and-out-season2 {
    padding-bottom: 2rem
}

.container-component.in-and-out.in-and-out-season2::before {
    content: '';
    width: 100%;
    height: 55rem;
    position: absolute;
    background: url("../../../../resource/img/mmk/common/inandout/bg_inandout_type2.png") no-repeat 0 0;
    background-size: 100% 100%;
    z-index: -1
}

.page-inner-scroll.ailive-scroll1 {
    background: var(--color-pb100)
}

.page-inner-scroll.ailive-scroll2 {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(60%, #000), color-stop(40%, #020616));
    background: -o-linear-gradient(top, #000 60%, #020616 40%);
    background: linear-gradient(to bottom, #000 60%, #020616 40%)
}

.container-component.ai-live {
    padding-bottom: 0;
    background: none;
    background-color: var(--color-pb100)
}

.container-component.ai-live .component-header {
    background-color: transparent
}

.container-component.ai-live .component-header:after {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: -webkit-gradient(linear, left top, left bottom, from(var(--color-pb100)), to(rgba(0, 0, 0, 0.3)));
    background: -o-linear-gradient(top, var(--color-pb100) 0, rgba(0, 0, 0, 0.3) 100%);
    background: linear-gradient(180deg, var(--color-pb100) 0, rgba(0, 0, 0, 0.3) 100%);
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
    z-index: 1;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s
}

.container-component.ai-live .header-group {
    position: relative;
    z-index: 2
}

.container-component.ai-live-result {
    overflow: hidden;
    position: relative
}

.container-component.ai-live .section-component {
    min-height: 61.2rem;
    margin-top: -5rem;
    padding-top: 5rem;
    background-image: url(https://download.kbanknow.com/resource/img/mmk/common/bg_curtain.png);
    background-repeat: no-repeat;
    background-size: auto 61.2rem;
    background-position: 50% 0
}

.container-component.ai-live .section-component.type1 {
    min-height: auto;
    margin-top: 0;
    padding: 0 0 19.6rem;
    background-image: none;
    background: var(--color-g900)
}

.container-component.ai-live .section-component.type1 .component-prd-icon {
    margin: 0;
    padding: 2.4rem 0;
    background: -webkit-gradient(linear, left top, left bottom, from(#000), to(rgba(0, 0, 0, 0)));
    background: -o-linear-gradient(top, #000 0, rgba(0, 0, 0, 0) 100%);
    background: linear-gradient(180deg, #000 0, rgba(0, 0, 0, 0) 100%)
}

.container-component.ai-live .component-btn.fixed-bottom:before {
    background: -webkit-gradient(linear, left bottom, left top, from(#252b37), color-stop(32.24%, #252b37), color-stop(70.31%, rgba(37, 43, 55, 0.85)), to(rgba(37, 43, 55, 0)));
    background: -o-linear-gradient(bottom, #252b37 0, #252b37 32.24%, rgba(37, 43, 55, 0.85) 70.31%, rgba(37, 43, 55, 0) 100%);
    background: linear-gradient(0deg, #252b37 0, #252b37 32.24%, rgba(37, 43, 55, 0.85) 70.31%, rgba(37, 43, 55, 0) 100%)
}

.container-component.ai-live:last-child {
    padding-bottom: 0 !important
}

.container-component.ai-live .component-btn.fixed-bottom .btn-lv01.divider-gray {
    background-color: var(--bg-pri-invert)
}

.container-component.ai-live .component-btn.fixed-bottom .btn-lv01.divider-gray .txt {
    color: var(--txt-disabled) !important
}

.container-component.today-coupon .component-header {
    margin-bottom: 4rem;
    background: transparent
}

.container-component.today-coupon {
    position: relative;
    padding-bottom: 0 !important;
    overflow: hidden
}

.container-component.today-coupon.h-center {
    height: 100vh
}

.container-component.today-coupon.h-center .component-btn.fixed-bottom {
    -webkit-transition: all 0.3s ease-in;
    -o-transition: all 0.3s ease-in;
    transition: all 0.3s ease-in;
    opacity: 0
}

.container-component.today-coupon.finish .component-btn.fixed-bottom {
    opacity: 1
}

.container-component.today-coupon.h-center .section-component {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    height: calc(100% - 20.2rem);
    padding-bottom: 2.4rem
}

.container-component.ai-quiz .section-component.type2 {
    min-height: 67.4rem;
    margin-top: -5rem;
    padding-top: 5rem;
    background-image: url(/resource/img/mmk/common/ailive/main_bg.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 0 0
}

.container-component.ai-quiz .section-component.type2::after {
    content: "";
    position: absolute;
    bottom: 0;
    right: 0;
    left: 0;
    z-index: 1;
    height: 27.4rem;
    background: url(/resource/img/mmk/common/ailive/main_kv_coin.png) no-repeat 50% 100%/auto 27.4rem
}

.container-component.ai-quiz .section-component.type3 {
    padding: 1.2rem 0 28.2rem
}

.container-component.ai-quiz .section-component.type2 .component-prd-icon.ai-quiz {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: absolute;
    bottom: 0;
    right: 0;
    left: 0;
    z-index: 2;
    height: 6rem;
    margin: 0;
    padding: 0;
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(248, 249, 255, 0)), color-stop(35.5%, rgba(248, 249, 252, 0.61)), to(#f8f9fc));
    background: -o-linear-gradient(top, rgba(248, 249, 255, 0) 0, rgba(248, 249, 252, 0.61) 35.5%, #f8f9fc 100%);
    background: linear-gradient(180deg, rgba(248, 249, 255, 0) 0, rgba(248, 249, 252, 0.61) 35.5%, #f8f9fc 100%)
}

.container-component.ai-quiz.h-center {
    height: 100vh
}

.container-component.ai-quiz.h-center .section-component {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    height: calc(100% - 18.6rem);
    margin-top: 0
}

.container-component.ai-quiz.h-center .component-header {
    margin-bottom: 2.4rem
}

.container-component.ai-quiz .section-component.type4 {
    height: 100vh;
    margin-top: -5rem;
    padding-top: 5rem;
    background-image: url(/resource/img/mmk/common/ailive/main_bg.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 0 0
}

.container-component.ai-quiz .section-component.type4::after {
    content: "";
    position: absolute;
    bottom: 7rem;
    right: 0;
    left: 0;
    z-index: 1;
    padding-bottom: 73.07%;
    background: url(/resource/img/mmk/common/ailive/main_kv_coin.png) no-repeat 50% 100%/cover
}

.container-component.ai-quiz .section-component.type2.upbit::after {
    background-image: url(/resource/img/mmk/common/ailive/main_kv_coin_upbit.png)
}

.kbank-page-wrapper .ui-kbank-page-control {
    position: fixed;
    z-index: 99
}

.kbank-page-wrapper .ui-kbank-page-control.activeSlide {
    z-index: 101
}

#content-mmk>div:first-child,
#page-popup-widget {
    height: 100%
}

[class^="kbank-page-"].bg-black {
    background-color: var(--color-g800, #414141)
}

[class^="kbank-page-"].bg-black * {
    color: var(--color-w100, #fff) !important
}

.kbank-page-wrapper .ui-kbank-page-control.bg-black .component-header {
    background-color: transparent
}

.page-inner-scroll.aiquiz-scroll {
    background: url(/resource/img/mmk/common/ailive/intro_bg_02.png) no-repeat 50% 0/cover
}

.page-inner-scroll.aiquiz-scroll::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: url(/resource/img/mmk/common/ailive/intro_bg_01.png) no-repeat center;
    background-size: cover;
    -webkit-animation: ani-intro-aiquiz 2s linear infinite;
    animation: ani-intro-aiquiz 2s linear infinite
}

.page-inner-scroll.aiquiz-scroll .section-component {
    margin-top: 2.4rem
}

.page-inner-scroll.aiquiz-scroll2 {
    background: var(--bg-qua)
}

.container-component.ai-quiz {
    padding-bottom: 0 !important;
    background: none
}

.container-component.ai-quiz .header-group {
    position: relative;
    z-index: 2
}

.container-component.ai-quiz .component-header {
    background: transparent
}

.container-component.ai-quiz .component-header:after {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: transparent;
    z-index: 1;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s
}

.scrolling .container-component.ai-quiz .component-header:after {
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    z-index: 1;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s
}

@-webkit-keyframes ani-intro-aiquiz {
    0% {
        opacity: 1
    }
    25% {
        opacity: 1
    }
    50% {
        opacity: 0
    }
    100% {
        opacity: 1
    }
}

@keyframes ani-intro-aiquiz {
    0% {
        opacity: 1
    }
    25% {
        opacity: 1
    }
    50% {
        opacity: 0
    }
    100% {
        opacity: 1
    }
}

.container-component.ai-quiz .section-component {
    position: relative
}

/*! container layout 컴포넌트 부모 레이아웃 */

.container-component {
    min-height: 100%;
    padding: 0 0 2.4rem 0;
    -webkit-transition: background .3s;
    -o-transition: background .3s;
    transition: background .3s
}

.container-component.container-flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.container-component [class*=component-].container-flex-bottom {
    margin-top: auto
}

.container-component:last-child {
    padding-bottom: 15.4rem
}

.container-component:last-child.type2 {
    padding-bottom: 20rem
}

.container-component:last-child.type3 {
    padding-bottom: 8rem
}

.container-component:last-child.type4 {
    padding-bottom: 4rem
}

.container-component:last-child.type5 {
    padding-bottom: 7.2rem
}

.container-component:last-child.type6 {
    padding-bottom: 4.8rem
}

.container-component:last-child.type7 {
    padding-bottom: 24.5rem
}

.container-component:last-child.type8 {
    padding-bottom: 8rem
}

.container-component:last-child.type9 {
    padding-bottom: 6.4rem
}

.container-component:last-child.type10 {
    padding-bottom: 10rem
}

.container-component+.container-component {
    padding-top: 0
}

.container-component+.bg-gray {
    padding-top: 2.4rem
}

.container-component.bg-gray {
    background-color: var(--color-g100)
}

.container-component.bg-g200 {
    background-color: var(--color-g200)
}

.container-component.bg-gradient200 {
    background: -webkit-gradient(linear, left top, left bottom, from(var(--color-w100, #fff)), to(var(--color-g200, #eee)));
    background: -o-linear-gradient(top, var(--color-w100, #fff) 0, var(--color-g200, #eee) 100%);
    background: linear-gradient(180deg, var(--color-w100, #fff) 0, var(--color-g200, #eee) 100%)
}

.container-component.bg-gradient-sky {
    background: -o-linear-gradient(253deg, #ecf3ff 2.4%, #fff 94.42%);
    background: linear-gradient(197deg, #ecf3ff 2.4%, #fff 94.42%)
}

.container-component.bg-primary1 {
    background-color: var(--color-pn, #17008c)
}

.container-component.no-space {
    padding-bottom: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.container-component.no-space-notch {
    padding-bottom: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.container-component.bg-insure::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 32.1rem;
    background-color: var(--color-cg500, #e6ebf5)
}

.container-component.bg-gradient-sky2::before {
    display: none
}

.container-component.bg-gradient-sky2.show::before {
    content: '';
    position: fixed;
    display: block;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 1;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0.02%, #ebf2ff), color-stop(37.49%, #fff));
    background: -o-linear-gradient(top, #ebf2ff 0.02%, #fff 37.49%);
    background: linear-gradient(180deg, #ebf2ff 0.02%, #fff 37.49%);
    z-index: -1
}

.container-component.bg-gradient-sky2 .component-header {
    background-color: transparent
}

.container-component.bg-gradient-sky2 .component-header:after {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: transparent;
    z-index: 1;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s
}

.container-component.bg-gradient-sky2 .header-group {
    position: relative;
    z-index: 2
}

.scrolling .container-component.bg-gradient-sky2 .component-header:after {
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s
}

.container-component.moneytree,
.container-component.moneytree-intro {
    background-color: #e7f6fb
}

.bg-white {
    background-color: var(--color-w100, #fff) !important
}

.page-inner-scroll.collecting-stars {
    background-color: var(--color-grey-g900);
    -ms-scroll-chaining: none;
    overscroll-behavior: none;
    -webkit-overflow-scrolling: touch
}

.page-inner-scroll.collecting-stars .component-header {
    background-color: var(--color-grey-g900)
}

.page-inner-scroll.collecting-stars .container-component:last-child {
    height: 100%;
    padding-bottom: 0
}

.component-header.bg-blur {
    background-color: transparent
}

.component-header.bg-blur:after {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.4);
    z-index: 1;
    -webkit-backdrop-filter: blur(50px);
    backdrop-filter: blur(50px)
}

.component-header.bg-blur .header-group {
    position: relative;
    z-index: 2
}

.page-inner-scroll-blur .component-header.bg-blur {
    background-color: transparent
}

.page-inner-scroll-blur .component-header.bg-blur:after {
    background-color: transparent;
    -webkit-backdrop-filter: blur(1rem) opacity(0);
    backdrop-filter: blur(1rem) opacity(0);
    -webkit-transition: -webkit-backdrop-filter 0.3s var(--kds-easing-steady);
    transition: -webkit-backdrop-filter 0.3s var(--kds-easing-steady);
    -o-transition: backdrop-filter 0.3s var(--kds-easing-steady);
    transition: backdrop-filter 0.3s var(--kds-easing-steady);
    transition: backdrop-filter 0.3s var(--kds-easing-steady), -webkit-backdrop-filter 0.3s var(--kds-easing-steady)
}

.page-inner-scroll-blur.scrolling .component-header.bg-blur:after {
    -webkit-backdrop-filter: blur(1rem) opacity(0.8);
    backdrop-filter: blur(1rem) opacity(0.8)
}

.container-component.view-center {
    height: 100vh;
    padding-bottom: 0
}

.container-component.view-center .section-component {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    height: calc(100% - 18.6rem)
}

.container-component.view-center .section-component .component-nodata {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.container-component.view-center.type1 {
    height: 100vh;
    padding-bottom: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.container-component.view-center.type1 .component-img {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-top: 0;
    padding-bottom: 11.2rem
}

/*! component layout 컴포넌트 추가 클래스 관리 */

[class^="component-"] {
    padding: 0 2.0rem
}

[class^="component-"].fixed-bottom {
    position: fixed;
    bottom: 0;
    bottom: constant(safe-area-inset-bottom);
    bottom: env(safe-area-inset-bottom);
    left: 0;
    width: 100%;
    z-index: 82
}

[class^="component-"].fixed-bottom.complete-banner {
    bottom: 11.8rem
}

[class^="component-"].fixed-bottom.list-banner {
    bottom: 4rem
}

[class^="component-"].no-space {
    padding: 0
}

[class^="component-"].no-space.h-flexible {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-top: 0
}

[class^="component-"].no-space-horizon {
    padding-left: 0;
    padding-right: 0
}

[class^="component-"].fixed-bottom.btm112 {
    bottom: 11.2rem
}

.component-btn.fixed-bottom:before {
    content: '';
    position: absolute;
    z-index: -1;
    width: 100%;
    height: 100%;
    bottom: 0;
    left: 0;
    background: -webkit-gradient(linear, left bottom, left top, from(#fff), color-stop(32.24%, #fff), color-stop(70.31%, rgba(255, 255, 255, 0.85)), to(rgba(255, 255, 255, 0)));
    background: -o-linear-gradient(bottom, #fff 0, #fff 32.24%, rgba(255, 255, 255, 0.85) 70.31%, rgba(255, 255, 255, 0) 100%);
    background: linear-gradient(0deg, #fff 0, #fff 32.24%, rgba(255, 255, 255, 0.85) 70.31%, rgba(255, 255, 255, 0) 100%)
}

.component-btn.bg-type.fixed-bottom:before {
    content: '';
    position: absolute;
    z-index: -1;
    width: 100%;
    height: 100%;
    bottom: 0;
    left: 0;
    background: -webkit-gradient(linear, left bottom, left top, from(#f8f8f8), color-stop(70.83%, rgba(248, 248, 248, 0.85)), to(rgba(255, 255, 255, 0)));
    background: -o-linear-gradient(bottom, #f8f8f8 0, rgba(248, 248, 248, 0.85) 70.83%, rgba(255, 255, 255, 0) 100%);
    background: linear-gradient(0deg, #f8f8f8 0, rgba(248, 248, 248, 0.85) 70.83%, rgba(255, 255, 255, 0) 100%)
}

.component-btn.fixed-bottom.transparent:before {
    background: transparent
}

.ai-live .component-btn.fixed-bottom:before {
    background: -webkit-gradient(linear, left bottom, left top, from(#252b37), color-stop(32.24%, #252b37), color-stop(70.31%, rgba(37, 43, 55, 0.85)), to(rgba(37, 43, 55, 0)));
    background: -o-linear-gradient(bottom, #252b37 0, #252b37 32.24%, rgba(37, 43, 55, 0.85) 70.31%, rgba(37, 43, 55, 0) 100%);
    background: linear-gradient(0deg, #252b37 0, #252b37 32.24%, rgba(37, 43, 55, 0.85) 70.31%, rgba(37, 43, 55, 0) 100%)
}

/*! component layout divider 컴포넌트 영역 나누는 회색 라인 */

.component-line01 {
    height: 1.6rem;
    margin: 3.2rem 0;
    background-color: var(--color-g100, #f8f8f8)
}

.component-line02 {
    height: 1.6rem;
    margin: 3.2rem 0;
    background-color: var(--bg-qua, #f7f9fd)
}

.component-line03 {
    height: 1.6rem;
    margin: 2.4rem 0;
    background-color: var(--color-g100, #f8f8f8)
}

.component-line04 {
    height: 0.1rem;
    margin: 1.6rem -2rem 0;
    background-color: var(--color-g300, #e0e6f1)
}

.component-line05 {
    height: 1.6rem;
    margin: 0.8rem 0 2.8rem;
    background-color: var(--bg-qua)
}

.component-line06 {
    height: 1.6rem;
    margin: 7.4rem 0 6.4rem;
    background-color: var(--bg-qua)
}

.component-line07 {
    height: 0.1rem;
    margin: 1.6rem 0 0;
    background-color: var(--color-g300, #e0e6f1)
}

.component-line08 {
    height: 1.6rem;
    margin: 1.6rem 0 0;
    background-color: var(--bg-qua)
}

.component-line09 {
    height: 1.6rem;
    margin: 0.8rem 0 2.4rem !important;
    background-color: var(--bg-qua)
}

.component-line10 {
    height: 1.2rem;
    background-color: var(--bg-qua)
}

.component-line11 {
    height: 1.6rem;
    margin-top: 4.8rem;
    background-color: var(--bg-qua)
}

.component-line12 {
    height: 0.1rem;
    margin: 2.4rem 0 1.6rem 0;
    background-color: var(--bg-qua)
}

.component-line13 {
    height: 1.6rem;
    margin: 3.6rem 0 2.4rem 0;
    background-color: var(--bg-qua)
}

.component-line14 {
    height: 0.8rem;
    margin: 2.4rem 0 3rem 0;
    background-color: var(--bg-qua)
}

.component-line15 {
    height: 0.8rem;
    margin: 3rem 0;
    background-color: var(--bg-qua)
}

.component-line16 {
    height: 1.6rem;
    margin: 4rem 0;
    background-color: var(--bg-qua)
}

.component-line17 {
    height: 1.2rem;
    margin: 2.4rem 0 1.2rem;
    background-color: var(--bg-qua)
}

[class^="component-line"]+[class^="component-"].no-space {
    margin-top: -3.2rem
}

.component-line05+[class^="component-"].no-space {
    margin-top: 0
}

[class^="component-line"].border-top {
    border-top: 1px solid var(--border-qua)
}

.component-line07.border-qua {
    background-color: var(--border-qua)
}

/*! section layout 간격 */

.section-component>.component-tab {
    margin-top: 1.6rem
}

.section-component>.component-tab.bg-white {
    padding-top: 1.6rem
}

.section-component>.component-tab.no-top-space {
    margin-top: 0
}

.section-component .component-account-search {
    padding: 0
}

.section-component+.component-banner-talk {
    margin-top: 6.4rem
}

.section-component .component-list+.component-btn {
    margin-bottom: 2.4rem
}

.container-component.no-space .component-banner-talk {
    margin-top: auto;
    margin-bottom: 4.8rem
}

.section-component.no-space {
    margin-bottom: -15.4rem
}

/*! article layout 간격 */

.article-component .tab-content [class^="component-"]:first-child {
    margin-top: 2.4rem
}

.article-component[tab-content-id="investTab01"] .tab-content>.component-text-simple {
    margin-top: 3.2rem !important
}

.article-component[tab-content-id="investTab01"] .tab-content>.component-text-simple.mt80 {
    margin-top: 8rem !important
}

.article-component .tab-content .component-text-list:first-child {
    margin-top: 8rem
}

.article-component .tab-content .component-list-linebox:first-child,
.article-component .tab-content .component-search.bg-gray:first-child {
    margin-top: 0;
    padding-top: 1.2rem
}

.article-component .tab-content .component-list-linebox+.component-form {
    margin-top: 4.8rem
}

.article-component .tab-content.bg-gray [class^="component-"]:first-child,
.article-component .tab-content.bg-white [class^="component-"]:first-child {
    margin-top: 0;
    padding-top: 2.4rem
}

.article-component .tab-content.bg-gray [class^="component-"]:last-child,
.article-component .tab-content.bg-white [class^="component-"]:last-child {
    padding-bottom: 3.2rem
}

.article-component .tab-content.bg-gray .component-form {
    padding: 2.4rem 2.0rem 3.2rem
}

.article-component .tab-content .component-search[class*="fixed"] {
    margin-top: 0
}

.article-component .tab-content.bg-gray .component-text-list.last,
.article-component .tab-content.bg-white .component-text-list.last {
    padding-bottom: 15.4rem
}

.article-component .tab-content .component-card+.component-list-linebox,
.article-component .tab-content .component-nodata-statement+.component-list-linebox {
    margin-top: 3.2rem
}

/*! component layout button 간격 */

.component-btn.module-space,
.component-card+.component-btn.module-space {
    margin-top: 2.4rem
}

.component-btn.module-space+.component-card-sum {
    margin-top: 7.2rem
}

.component-btn.module-keypad {
    margin-top: 3.2rem;
    margin-bottom: 4rem
}

.component-btn.fixed-bottom {
    padding: 3.2rem 2.0rem 2.4rem
}

.component-btn.fixed-bottom .kds-arrow-scroll {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-top: -0.8rem;
    margin-bottom: 0.8rem;
    padding: 1.2rem 0
}

.component-btn .txt-group {
    font-size: 1.4rem;
    line-height: 1.42857;
    font-weight: 400;
    color: var(--color-g700);
    margin-bottom: 3rem
}

.component-btn .txt-group.center {
    text-align: center
}

.component-btn+.component-btn {
    margin-top: 4.8rem
}

.component-btn+.component-form {
    margin-top: 1.6rem
}

.component-btn .banner-group+.btn-group {
    margin-top: 6.4rem
}

.ui-accordion+.btn-group {
    margin-top: 2.4rem
}

/*! component layout header 간격 */

.component-header+[class^="component-"] {
    margin-top: 2.4rem
}

.component-header+[class^="component-kds-landing-title"] {
    margin-top: 0
}

.component-header+.component-board {
    margin-top: 0
}

.component-header+.component-carousel-rec-all {
    margin-top: 0.8rem
}

.component-header+.component-card-bg,
.component-header+.component-keypad {
    margin-top: 0
}

.component-header+.component-text-h64 {
    margin-top: 6.4rem
}

.component-header+.component-text-simple.bg-white {
    margin-top: 0;
    padding-top: 2.4rem
}

/*! component layout text 간격 */

.component-text+.component-list-h32 {
    margin-top: 1.8rem
}

.component-text>.text-icon-group,
.component-text-icon>.text-icon-group {
    margin-top: 3.2rem
}

.component-text>.text-icon-group.transfer,
.ui-full-change .popup-content .component-text>.text-icon-group.transfer {
    margin-top: 5.6rem
}

.popup-content .component-text>.text-icon-group.transfer {
    margin-top: 0
}

.popup-dialog.ui-bottom .component-text-icon>.text-icon-group {
    margin-top: 0
}

.component-text.h64 {
    margin-top: 6.4rem
}

.component-text-list {
    margin-top: 8rem
}

.component-text-list.bg-gray {
    background-color: var(--color-g100, #f8f8f8);
    padding: 4rem 2.0rem 15.4rem
}

.component-text-list.bg-gray [class^="table-group"] th {
    background: var(--color-g200, #eee)
}

.container-component.no-space .component-text-list.bg-gray {
    padding: 4rem 2.0rem 15.4rem
}

.component-text-list.bg-white {
    background-color: var(--color-w100, #fff)
}

.component-text-list.last {
    padding: 4rem 2.0rem 15.4rem
}

.component-text-list+.component-banner-talk {
    margin-top: 6.4rem
}

.component-text-list+.component-accordion {
    margin-top: 2.4rem
}

.component-text-list .bl-txt-group .btn-under-link.type1 {
    margin-top: 0.4rem
}

.component-text-list .bl-txt-group .btn-under-link.type2 {
    display: block;
    margin-top: 0.4rem
}

.component-text-list.bg-qua.type1 {
    padding: 4rem 2rem 15.4rem
}

.component-text-simple.bg-white {
    background-color: var(--color-w100, #fff)
}

.component-text-simple.bg-qua {
    background-color: var(--bg-qua)
}

.component-text-simple.bg-qua.type01 {
    background-color: var(--bg-qua);
    padding: 1.6rem 2rem !important;
    border-radius: 1.2rem
}

.component-text-simple+.component-cont-list {
    margin-top: 4.8rem
}

.component-text-simple+.component-list {
    margin-top: 4.8rem
}

.component-text-simple+.component-list.row-scroll {
    margin-top: 2.8rem;
    padding-bottom: 8.4rem
}

.component-text-simple+.component-bg-number {
    margin-top: 4.8rem
}

.component-text-simple+.component-list-infobox {
    margin-top: 3.2rem
}

.component-text-simple+.component-agreement {
    margin-top: 4.8rem
}

.component-text-simple+.component-form {
    margin-top: 4.8rem
}

.component-text-simple+.component-form-h32 {
    margin-top: 3.2rem
}

.component-text-simple+.component-card {
    margin-top: 4.8rem
}

.component-text-simple+.component-card-checklist {
    margin-top: 3.2rem
}

.component-text-simple+.component-card-sum {
    margin-top: 3.2rem
}

.component-text-simple+.component-text {
    margin-top: 2.4rem
}

.component-text-simple+.component-text-title {
    margin-top: 4.8rem
}

.component-text-simple+.component-number-group {
    margin-top: 4.8rem
}

.component-text-simple+.component-table {
    margin-top: 4.8rem
}

.component-text-simple+.component-img-card {
    margin-top: 4.8rem
}

.component-text-simple+.component-cert-group {
    margin-top: 8rem
}

.component-text-simple+.component-btn {
    margin-top: 4.8rem
}

.component-text-simple+.component-img {
    margin-top: 4.8rem
}

.component-text-simple+.component-card-accordion {
    margin-top: 4.8rem
}

.component-text-simple+.component-img-license {
    margin-top: 4.8rem
}

.component-text-simple+.component-img-license.type01 {
    margin: 7.7rem 0
}

.component-text-simple+.component-img-license.type01 img {
    max-width: 44rem;
    width: 100%
}

.component-text-simple+.component-banner {
    margin-top: 2.4rem
}

.component-text-simple+.component-search {
    margin-top: 3.2rem
}

.component-text-simple+.component-list-linebox.no-space {
    margin-top: 4.8rem
}

.component-text-simple+.component-step-count {
    margin-top: 4.8rem
}

.component-text-simple+.component-tab {
    margin-top: 2.4rem
}

.component-text-simple+.component-list-linebox {
    margin-top: 2rem
}

.component-text-complex+.component-list-infobox {
    margin-top: 4.8rem
}

.component-text-complex+.component-list-linebox {
    margin-top: 3.5rem
}

.component-text-simple+.component-banner-push {
    margin-top: 4rem
}

.component-text-icon+[class^="component-list"] {
    margin-top: 4.8rem
}

.component-text-icon+.component-text-list {
    margin-top: 12rem
}

.component-text-icon+.component-card {
    margin-top: 4.8rem
}

.component-text-version {
    margin-top: 15rem;
    margin-bottom: 3.2rem
}

.component-text-h64 {
    margin-top: 4.8rem
}

.component-text+.component-form {
    margin-top: 4.8rem
}

.component-text+.component-tab {
    margin-top: 2.4rem
}

.component-text+.component-card {
    margin-top: 4.8rem
}

.component-btn+.component-card {
    margin-top: 2.4rem
}

.component-btn+.component-list-infobox {
    margin-top: 2.8rem
}

.component-tab+.component-text-simple {
    margin-top: 3.6rem
}

.component-banner-talk+.component-text,
.component-list+.component-text {
    margin-top: 4.8rem
}

.component-list .title-group+.list-infobox-group {
    margin-top: 1.6rem
}

:root .component-list.no-space .title-group .txt-lv03 {
    font-weight: 700
}

.component-text-list.bg-qua.type2 {
    margin-top: 4rem;
    padding: 3.6rem 2rem 12rem
}

/*! component layout agreement 간격 */

[class^="component-agreement"]+.component-text-simple {
    margin-top: 4.8rem
}

[class^="component-agreement"]+.component-form {
    margin-top: 4.8rem
}

[class^="component-agreement"]+.component-form-h32 {
    margin-top: 3.2rem
}

[class^="component-agreement"]+.component-list-infobox {
    margin-top: 3.2rem
}

[class^="component-agreement"]+.component-btn {
    margin-top: 3.2rem
}

/*! component layout form 간격 */

.component-form.h24 {
    margin-top: 2.4rem
}

.component-form+.component-form {
    margin-top: 4.8rem
}

.component-form+.component-accordion {
    margin-top: 4.8rem
}

.component-form+.component-card {
    margin-top: 4.8rem
}

.component-form+.component-btn {
    margin-top: 1.6rem
}

.component-form+.component-tab {
    margin-top: 4.8rem
}

.component-form+.component-list-infobox {
    margin-top: 2.4rem
}

.component-form+.component-agreement {
    margin-top: 1.6rem
}

.component-form+.component-agreement-include {
    margin-top: 4.8rem
}

.component-form+.component-list {
    margin-top: 4.8rem
}

.component-form+.component-list-linebox {
    margin-top: 4.8rem
}

.component-form+.component-text {
    margin-top: 3.6rem
}

.component-form.bg-white {
    background: var(--color-w100, #fff);
    margin-top: 0;
    padding: 2.4rem 2.0rem
}

.component-form.bg-white+.component-card-checklist {
    margin-top: 2.4rem
}

/*! component layout tab 간격 */

.component-tab .tab-content-group .tab-content [class^="component-"]:first-child {
    margin-top: 2.4rem
}

.component-tab.bg-white {
    background-color: var(--color-w100, #fff);
    margin-top: 0;
    padding-top: 2.4rem
}

.component-tab+.component-banner-talk {
    margin-top: 6.4rem
}

.component-tab .form-group+.btn-group {
    margin-top: -0.8rem;
    padding: 0 2.0rem 2.4rem
}

/*! component layout card 간격 */

.component-card+.component-card {
    margin-top: 4.8rem
}

.component-card+.component-card.bg-gray {
    margin-top: 4.8rem
}

.component-card-bg {
    padding: 0
}

.component-card-bg+.component-search {
    padding: 0
}

.component-card-sum {
    margin: 4.8rem 0 0;
    padding: 0 2.0rem
}

.component-card+.component-list-linebox {
    margin-top: 2.4rem
}

.component-card+.component-list {
    margin-top: 4.8rem
}

.component-card+.component-bg-number {
    margin-top: 4.8rem
}

.component-card+.component-form {
    margin-top: 4.8rem
}

.component-card+.component-btn {
    margin-top: 2.4rem
}

.component-card+.component-text {
    margin-top: 4.8rem
}

.component-card.bg-gray+.component-list-linebox {
    margin-top: 0
}

.component-card+.component-money-talk {
    margin-top: 3.2rem
}

/*! component layout list 간격 */

.component-list-infobox+.component-list-linebox {
    margin-top: 3.2rem
}

.component-list-infobox+.component-form {
    margin-top: 4.8rem
}

.component-list-infobox+.component-btn {
    margin-top: 2.4rem
}

.component-list-infobox+.component-agreement {
    margin-top: 4.8rem
}

.component-list-infobox+.component-card {
    margin-top: 1.6rem
}

.component-list-infobox+.component-list-infobox {
    margin-top: 4.8rem
}

.component-list-infobox+.component-cont-list {
    margin-top: 4.8rem
}

.component-list-infobox+.component-table {
    margin-top: 2.4rem
}

.component-list-infobox+.component-table2 {
    margin-top: 4.8rem
}

.component-list-infobox+.component-banner {
    margin-top: 4.8rem
}

.component-list-linebox.bg-white+.component-banner {
    margin-top: 14.8rem
}

.component-list-infobox+.component-text {
    margin-top: 2.4rem
}

.component-list+.component-form {
    margin-top: 4.8rem
}

.component-list+.component-table {
    margin-top: 2.4rem
}

.component-list+.component-banner {
    margin-top: 4.8rem
}

.component-list+.component-board {
    margin-top: 4.8rem
}

.component-list+.component-btn {
    margin-top: 2.4rem
}

.component-list+.component-text-title {
    margin-top: 4.8rem
}

.component-list+.component-list-linebox.no-space {
    margin-top: 4.8rem
}

.component-list+.component-list {
    margin-top: 4.8rem
}

.component-list.mt16+.component-text-simple {
    margin-top: 4rem
}

.list-infobox-group+.form-group {
    margin-top: 2.4rem
}

/*! component layout banner 간격 */

.component-banner-loan {
    margin-top: 4.8rem
}

.component-banner-loan+.component-list-infobox {
    margin-top: 4.8rem
}

.component-banner+.component-cont-list {
    margin-top: 4.8rem
}

.component-banner+.component-cont-list-02 {
    margin-top: 2.4rem
}

.component-banner+.component-list-infobox {
    margin-top: 2.4rem
}

.component-banner+.component-list-linebox {
    margin-top: 4.8rem
}

.component-banner+.component-agreement {
    margin-top: 2.4rem
}

.component-paybanner+.component-money-talk {
    margin-top: 4.8rem
}

.component-cert-num {
    margin-top: 4.8rem
}

.component-money-talk+.component-banner {
    margin-top: 4.8rem
}

/*! component layout cont-list 간격 */

.component-cont-list-02+.component-agreement {
    margin-top: 3.2rem
}

.component-cont-list+.component-banner {
    margin-top: 4.8rem
}

.component-cont-list+.component-table {
    margin-top: 4.8rem
}

.component-cont-list+.component-card {
    margin-top: 4.8rem
}

.component-cont-list+.component-list-infobox {
    margin-top: 4.8rem
}

.component-cont-list+.component-cont-list {
    margin-top: 4.8rem
}

.component-cont-list.mb64 {
    margin-bottom: 6.4rem
}

/*! component layout search 간격 */

.component-search+.component-list-linebox {
    margin-top: 4.8rem
}

.component-search.no-space+.component-list-linebox {
    margin-top: 0
}

.component-search+.component-btn {
    margin-top: 2.4rem
}

.component-search+.component-addr-list,
.component-search+.component-list,
.component-search+.component-nation-list {
    margin-top: 2.4rem
}

.component-account-search+.component-card-sum {
    margin-top: 1.4rem
}

.component-search+.component-text,
.component-search.no-space+.component-card {
    margin-top: 1.6rem
}

/*! component layout table 간격 */

.component-table {
    margin-top: 4.8rem
}

.component-table2+.component-cont-list {
    margin-top: 4.8rem
}

.component-table+.component-list {
    margin-top: 4.8rem
}

.component-table+.component-btn {
    margin-top: 4.8rem
}

.component-table+.component-banner {
    margin-top: 4.8rem
}

.component-table+.component-list-infobox {
    margin-top: 4.8rem
}

.component-table+.component-cont-list {
    margin-top: 4.8rem
}

/*! component layout banner 간격 */

.component-img-license+.component-text-list.h32 {
    margin-top: 3.2rem
}

.component-img-license+.component-form {
    margin-top: 2.4rem
}

.component-img-document {
    margin-top: 4.8rem
}

.component-banner-talk+.component-search {
    margin-top: 2.4rem
}

/*! component layout number-group 간격 */

.component-number-group {
    margin-top: 4.8rem
}

.component-number-group+.component-banner {
    margin-top: 2.4rem
}

.component-number-group .title-group .title-field-01 {
    margin-bottom: 2.4rem
}

/*! component layout progress 간격 */

.component-progress+.component-list-infobox {
    margin-top: 3.2rem
}

/*! component layout img-card 간격 */

.component-img-card+.component-list-infobox {
    margin-top: 3.2rem
}

.component-img-card+.component-agreement {
    margin-top: 4.8rem
}

.component-img-card+.component-form {
    margin-top: 4.8rem
}

/*! component layout insurence 간격 */

.component-my-insurence {
    margin-top: 4.8rem
}

.component-my-insurence+.section-component {
    margin-top: 3.2rem
}

/*! component layout crf 간격 */

.component-crf {
    margin-top: 4.8rem
}

/*! component layout accordion 간격 */

.component-accordion.no-space+.component-btn {
    margin-top: 2.4rem
}

.component-accordion+.component-icon-list {
    margin-top: 4rem
}

/*! component layout carousel 간격 */

.component-carousel-rec-all+.component-carousel-rec-all {
    margin-top: 0.8rem
}

/*! component layout picker */

.component-picker-spinner {
    margin: 2.6rem -2rem 0
}

/*! component element text common line-height 가이드 반영 2023-09-05 ksy */

.txt-lv01 {
    font-size: 1.6rem !important;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g800, #414141)
}

.txt-lv01-01 {
    font-size: 1.6rem !important;
    line-height: 2rem;
    font-weight: 400
}

.txt-lv02 {
    font-size: 1.5rem !important;
    line-height: 2rem;
    font-weight: 400
}

.txt-lv03 {
    font-size: 1.4rem !important;
    line-height: 2rem;
    font-weight: 400
}

.txt-lv04 {
    font-size: 1.2rem !important;
    line-height: 1.6rem;
    font-weight: 400
}

.txt-lv05 {
    font-size: 1.8rem !important;
    line-height: 2.4rem;
    font-weight: 400
}

.txt-lv06 {
    font-size: 2.0rem !important;
    line-height: 2.6rem;
    font-weight: 400
}

.txt-lv07 {
    font-size: 2.1rem !important;
    line-height: 2.6rem;
    font-weight: 400
}

.txt-lv08 {
    font-size: 2.4rem !important;
    line-height: 3.2rem;
    font-weight: 400
}

.txt-lv09 {
    font-size: 2.6rem !important;
    line-height: 3.4rem;
    font-weight: 400
}

.txt-lv10 {
    font-size: 1.1rem !important;
    line-height: 1.4rem;
    font-weight: 400
}

.txt-lv11 {
    font-size: 2.8rem !important;
    line-height: 3.6rem;
    font-weight: 700
}

.txt-lv12 {
    font-size: 1.3rem !important;
    line-height: 1.6rem;
    font-weight: 400
}

.txt-lv13 {
    font-size: 1.6rem !important;
    line-height: 2.5rem !important
}

.txt-lv14 {
    font-size: 3.2rem !important;
    line-height: 3.2rem !important
}

.txt-lv15 {
    font-size: 1.6rem !important;
    line-height: 2.8rem !important
}

.txt-lv16 {
    font-size: 2.1rem !important;
    line-height: 2.8rem !important
}

.txt-lv04.gray {
    color: var(--color-g700)
}

.txt-circle {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-size: 1.2rem !important;
    color: var(--color-g700);
    width: 2.1rem;
    height: 2.1rem;
    border-radius: 99rem;
    border: 1px solid var(--color-g200, #eee)
}

*+.txt-circle {
    margin-left: 0.2rem !important
}

.content_lv01 {
    font-size: 1.6rem;
    line-height: 2.8rem;
    font-weight: 400
}

.ColorGray3 {
    color: #5f7289
}

.real-black {
    color: var(--color-pb100, #000) !important
}

:root .txt.real-black {
    color: var(--txt-pri-invert, #fff) !important
}

.black {
    color: var(--color-g900, #141414)
}

.black2 {
    color: #333e48 !important
}

.bg-in100 {
    background-color: var(--color-in100) !important
}

[class^="txt"].black {
    color: var(--color-g900, #141414) !important
}

[class^="txt"].darkgray,
[class^="txt"].darkgray1 {
    color: var(--color-g800, #414141) !important
}

[class^="txt"].darkgray-2,
[class^="txt"].darkgray2 {
    color: var(--color-g700) !important
}

[class^="txt"].gray-1,
[class^="txt"].gray1 {
    color: var(--color-g600, #9b9b9b) !important
}

:root [class^="txt"].gray-1,
:root [class^="txt"].gray1 {
    color: var(--txt-sec, #3b4659) !important
}

[class^="txt"].gray2 {
    color: var(--color-g500, #b8b8b8) !important
}

:root [class^="txt"].gray2 {
    color: var(--txt-qua, #67748e) !important
}

[class^="txt"].gray3 {
    color: var(--color-g400, #c7c7c7) !important
}

[class^="txt"].primary1 {
    color: var(--color-pn, #17008c) !important
}

[class^="txt"].secondary1-1 {
    color: var(--color-bu800) !important
}

[class^="txt"].secondary1-2 {
    color: var(--color-bu900) !important
}

[class^="txt"].secondary1-3 {
    color: var(--color-bu700) !important
}

:root [class^="txt"].secondary1-3 {
    color: var(--txt-accent-sec, #4262ff) !important
}

[class^="txt"].secondary1-4 {
    color: var(--color-bu600) !important
}

[class^="txt"].secondary1-5 {
    color: var(--color-blue-bu1200) !important
}

[class^="txt"].secondary2,
[class^="txt"].txt-pri-success {
    color: var(--txt-pri-success) !important
}

[class^="txt"].cy600 {
    color: var(--color-cy600, #019cc8) !important
}

.secondary2-1 {
    color: var(--color-ce600, #07a721) !important
}

[class^="txt"].warning {
    color: var(--color-re700) !important
}

[class^="txt"].white {
    color: var(--color-w100, #fff) !important
}

[class^="txt"].g900 {
    color: var(--color-g900) !important
}

[class^="txt"].gray-g900 {
    color: var(--color-grey-g900) !important
}

[class^="txt"].in700 {
    color: var(--color-in700, #5c59f9) !important
}

[class^="txt"].vo200 {
    color: var(--color-vo200) !important
}

[class^="txt"].vo700 {
    color: var(--color-vo700) !important
}

[class^="txt"].vo900 {
    color: var(--color-vo900) !important
}

[class^="txt"].txt-ter {
    color: var(--txt-ter) !important
}

[class^="txt"].txt-ter-active {
    color: var(--txt-ter-active) !important
}

[class^="txt"].txt-sec {
    color: var(--txt-sec) !important
}

[class^="txt"].txt-quin {
    color: var(--txt-quin) !important
}

[class^="txt"].txt-qua {
    color: var(--txt-qua) !important
}

.txt-pri,
[class^="txt"].txt-pri {
    color: var(--txt-pri) !important
}

[class^="txt"].txt-accent-pri {
    color: var(--txt-accent-pri) !important
}

[class^="txt"].txt-pri-active {
    color: var(--txt-pri-active) !important
}

[class^="txt"].txt-pri-sell {
    color: var(--txt-pri-sell) !important
}

[class^="txt"].txt-accent-sec {
    color: var(--txt-accent-sec) !important
}

[class^="txt"].txt-sec-invert {
    color: var(--txt-sec-invert) !important
}

[class^="txt"].txt-sec-active {
    color: var(--txt-sec-active) !important
}

[class^="txt"].sf600 {
    color: var(--color-seaform-sf600) !important
}

[class^="txt"].re600 {
    color: var(--color-re600) !important
}

[class^="txt"].bu600 {
    color: var(--color-bu600) !important
}

[class^="txt"].in300 {
    color: var(--color-in300) !important
}

[class^="txt"].yl200 {
    color: var(--color-yl200) !important
}

[class^="txt"].txt-pri-error {
    color: var(--txt-pri-error) !important
}

[class^="txt"].txt-pri-invert {
    color: var(--txt-pri-invert) !important
}

[class^="txt"].txt-pri-down {
    color: var(--txt-pri-down) !important
}

[class^="txt"].txt-pri-up {
    color: var(--txt-pri-up) !important
}

[class^="txt"].gn600 {
    color: var(--color-gn600) !important
}

[class^="txt"].txt-readonly {
    color: var(--txt-readonly-invert) !important
}

[class^="txt"].white-op70 {
    color: var(--color-white-w100-op70) !important
}

[class^="txt"].txt-mg600 {
    color: var(--color-mg600) !important
}

[class^="txt"].txt-placeholder {
    color: var(--txt-placeholder) !important
}

[class^="txt"].lm600 {
    color: var(--color-lm600) !important
}

[class^="txt"].yl600 {
    color: var(--color-yl600) !important
}

[class^="txt"].og600 {
    color: var(--color-og600) !important
}

/*! component element CTA Button common */

.btn-lv01,
.btn-lv02,
.btn-lv03,
.btn-lv04 {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

[class^="btn-lv"].divider-gray {
    background-color: var(--color-g200)
}

:root [class^="btn-lv"].divider-gray {
    background-color: var(--bg-ter)
}

:root [class^="btn-lv"].divider-gray [class^="ico"]:not([class*="mask"]) {
    -webkit-filter: var(--filter-pn);
    filter: var(--filter-pn)
}

:root [class^="btn-lv"].divider-gray [class^="ico"][class*="mask"] {
    background-color: var(--color-pn)
}

:root [class^="btn-lv"].divider-gray .txt {
    color: var(--txt-accent-pri)
}

[class^="btn-lv"].bg-coolgray2 {
    background-color: var(--color-cg500, #e6ebf5)
}

:root [class^="btn-lv"].bg-coolgray2 {
    background-color: var(--bg-ter, #edf1f7)
}

:root [class^="btn-lv"].bg-coolgray2 .txt {
    color: var(--txt-accent-pri, #0114a7)
}

:root [class^="btn-lv"].bg-coolgray2 [class^="ico"]:not([class*="mask"]) {
    -webkit-filter: var(--filter-pn);
    filter: var(--filter-pn)
}

:root [class^="btn-lv"].bg-coolgray2 [class^="ico"][class*="mask"] {
    background-color: var(--color-pn)
}

[class^="btn-lv"].primary1 {
    background-color: var(--color-pn, #17008c);
    color: var(--color-w100, #fff)
}

:root [class^="btn-lv"].primary1 {
    background-color: var(--bg-pri);
    color: var(--color-white-w100)
}

:root [class^="btn-lv"].primary1 [class^="ico"]:not([class*="mask"]) {
    -webkit-filter: var(--filter-w100);
    filter: var(--filter-w100)
}

:root [class^="btn-lv"].primary1 [class^="ico"][class*="mask"] {
    background-color: var(--color-w100)
}

:root [class^="btn-lv"].divider-gray.primary1 .txt {
    color: var(--color-white-w100)
}

[class^="btn-lv"].primary2 {
    background-color: var(--color-lm100, #c0f03e)
}

:root [class^="btn-lv"].primary2 {
    background-color: var(--bg-accent-pri, #4262ff)
}

:root [class^="btn-lv"].primary2 .txt {
    color: var(--txt-pri-invert, #fff)
}

:root [class^="btn-lv"].primary2 [class^="ico"]:not([class*="mask"]) {
    -webkit-filter: var(--filter-w100);
    filter: var(--filter-w100)
}

:root [class^="btn-lv"].primary2 [class^="ico"][class*="mask"] {
    background-color: var(--color-w100)
}

[class^="btn-lv"].gray-arrow {
    background: var(--color-g200, #eee);
    padding: 0 1.4rem;
    color: var(--color-g900, #141414)
}

[class^="btn-lv"].gray-arrow .txt-lv01 {
    display: block;
    width: 100%;
    color: var(--color-g900, #141414)
}

[class^="btn-lv"].gray-line {
    background: var(--color-w100, #fff);
    border: 1px solid var(--color-pb10, #00000019)
}

:root [class^="btn-lv"].gray-line {
    background: var(--bg-base);
    border: 1px solid var(--border-qua)
}

:root [class^="btn-lv"].gray-line [class^="ico-"] {
    -webkit-filter: var(--filter-pn);
    filter: var(--filter-pn)
}

:root [class^="btn-lv"].gray-line .ico-edit {
    -webkit-filter: var(--ico-pri, #020616);
    filter: var(--ico-pri, #020616)
}

[class^="btn-lv"].gray-line .txt {
    color: var(--color-g900, #0114a7)
}

:root [class^="btn-lv"].gray-line .txt {
    color: var(--color-in1100, #141414)
}

[class^="btn-lv"].gray-line.type2 {
    border: 1px solid var(--border-qua);
    padding: 0 1.2rem
}

:root [class^="btn-lv"].gray-line.type2 .txt,
[class^="btn-lv"].gray-line.type2 .txt {
    color: var(--txt-ter)
}

[class^="btn-lv"].gray-line.left {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    text-align: left;
    background-color: transparent
}

[class^="btn-lv"].pri-line {
    background: var(--bg-qua-active);
    border: 1px solid var(--border-pri-active)
}

[class^="btn-lv"].pri-line .txt {
    color: var(--txt-pri-active);
    font-weight: 700
}

[class^="btn-lv"].bg-green {
    background-color: var(--color-ce400, #4ecf50)
}

[class^="btn-lv"].bg-green .txt {
    color: var(--color-w100, #fff)
}

[class^="btn-lv"].bg-blue {
    background-color: var(--color-bu800, #0150ff)
}

[class^="btn-lv"].bg-blue .txt {
    color: var(--color-w100, #fff)
}

[class^="btn-lv"].bg-blue2 {
    background-color: var(--color-bu700, #006aff)
}

[class^="btn-lv"].bg-blue2 .txt {
    color: var(--color-w100, #fff)
}

[class^="btn-lv"].bg-blue2 i {
    -webkit-filter: var(--filter-w100);
    filter: var(--filter-w100)
}

[class^="btn-lv"].bg-blue3 {
    border-color: #e4edf8;
    background-color: #eff5fd
}

[class^="btn-lv"].bg-blue3 .txt {
    color: var(--txt-accent-pri)
}

[class^="btn-lv"].bg-blue [class^="ico"]:not([class*="mask"]) {
    -webkit-filter: var(--filter-w100);
    filter: var(--filter-w100)
}

[class^="btn-lv"].bg-blue [class^="ico"][class*="mask"] {
    background-color: var(--color-w100)
}

[class^="btn-lv"] [class^="ico-"] {
    margin-right: 0.4rem
}

.btn-lv01 [class^="ico-"] {
    margin-right: 0.8rem
}

[class^="btn-lv"] .ico-arrow-upright {
    margin-top: -0.2rem
}

.btn-lv03 [class^="ico-"] {
    margin-right: 0.4rem;
    width: 1.6rem;
    height: 1.6rem
}

[class^="btn-lv"] [class^="txt"]+[class^="ico-"] {
    margin-right: 0;
    margin-left: 0.4rem
}

[class^="btn-lv"].btn-flex {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

[class^="btn-lv"].btn-flex [class^="txt"]+[class^="ico-"] {
    margin-left: auto
}

[class^="btn-lv"].transparent {
    background-color: transparent !important
}

[class^="btn-lv"] [class^="txt"] {
    line-height: initial
}

[class^="btn-lv"] .ico {
    pointer-events: none
}

[class^="btn-lv"].bg-war {
    background-color: var(--color-re50, #ffebe7)
}

[class^="btn-lv"].bg-war .txt {
    color: var(--color-re700, #f02727)
}

[class^="btn-lv"].bg-pb70 {
    background-color: var(--color-pb70, rgba(0, 0, 0, 0.7))
}

[class^="btn-lv"].bg-pb70 .txt {
    color: var(--color-w100, #fff)
}

[class^="btn-lv"].dark-gray {
    background-color: var(--color-g800)
}

[class^="btn-lv"].dark-gray .txt {
    color: var(--color-in200) !important
}

:root [class^="btn-lv"].dark-gray.disabled {
    background-color: var(--color-g800)
}

[class^="btn-lv"].dark-gray.disabled .txt {
    color: var(--color-g600) !important
}

/*! background-alpha */

.bg-primary1 .btn-lv02,
[class^="btn-lv"].white {
    background-color: var(--color-w15, #fffFFF26)
}

.bg-primary1 .btn-lv02 .txt,
[class^="btn-lv"].white .txt {
    color: var(--color-w100, #fff)
}

[class^="btn-lv"].black {
    background-color: var(--color-pb7, #00000011)
}

[class^="btn-lv"].trans-black {
    background-color: var(--color-g200, #eee)
}

:root [class^="btn-lv"].trans-black {
    background-color: var(--bg-ter)
}

:root [class^="btn-lv"].trans-black [class^="ico"]:not([class*="mask"]) {
    -webkit-filter: var(--filter-pn);
    filter: var(--filter-pn)
}

:root [class^="btn-lv"].trans-black [class^="ico"][class*="mask"] {
    background-color: var(--color-pn)
}

[class^="btn-lv"].trans-black .txt {
    color: var(--color-pn, #17008c)
}

:root [class^="btn-lv"].trans-black .txt {
    color: var(--txt-accent-pri)
}

[class^="btn-lv"].bg-ter-active {
    background-color: var(--bg-ter-active)
}

[class^="btn-lv"].bg-ter-active .txt {
    color: var(--txt-pri-invert)
}

[class^="btn-lv"].bg-pri-invert {
    background-color: var(--bg-pri-invert)
}

[class^="btn-lv"].bg-pri-invert .txt {
    color: var(--color-g200)
}

/*! component element CTA Button active kds VI */

/*! component element CTA Button lv01 */

.btn-lv01 {
    height: 5.6rem;
    padding: 0 2rem;
    border-radius: 1.2rem;
    color: var(--color-pn, #17008c)
}

:root .btn-lv01 {
    padding: 0 1.6rem
}

.btn-lv01 .txt {
    font-size: 1.8rem;
    font-weight: 500;
    line-height: 2rem
}

.btn-lv01.type2 .txt {
    font-weight: 700
}

.btn-lv01 .ico-plus {
    width: 1.6rem;
    height: 1.6rem;
    border: 1px solid var(--color-pn, #17008c);
    border-radius: 99rem;
    background-size: 1.2rem 1.2rem
}

:root .btn-lv01>[class^="ico-"]:first-child+.txt {
    padding-right: .4rem
}

:root .btn-lv01>.txt:first-child {
    padding-left: .4rem
}

:root .btn-lv01>.txt:only-child {
    padding: 0
}

.btn-lv01.type3 {
    height: 5.2rem;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.btn-lv01.type3 .payback {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.btn-lv01.type4 {
    height: 5.4rem;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.btn-lv01.type4 .payback {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.btn-lv01.type4 .payback .ico-colored-moneybag-loan {
    -webkit-filter: unset;
    filter: unset
}

/*! component element CTA Button lv02 */

.btn-lv02 {
    height: 4.8rem;
    padding: 0 1.6rem;
    border-radius: 1.2rem;
    color: var(--color-pn, #17008c)
}

.btn-lv02 .txt {
    font-size: 1.6rem;
    white-space: nowrap;
    font-weight: 500;
    line-height: 2rem
}

.btn-lv02.line {
    background-color: var(--color-w10, #fffFFF19);
    border: 1px solid var(--color-g300, #e0e0e0);
    padding: 0 2rem;
    height: 5.2rem
}

.btn-lv02.line .txt {
    color: var(--color-g900, #141414);
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    text-align: left;
    margin-left: 0.8rem;
    text-decoration: underline
}

:root .btn-lv02>[class^="ico-"]:first-child+.txt {
    padding-right: .4rem
}

:root .btn-lv02>.txt:first-child {
    padding-left: .4rem
}

:root .btn-lv02>.txt:only-child {
    padding: 0
}

.btn-lv02.round-btn {
    border-radius: 1.2rem;
    padding: 1.2rem 1.6rem;
    background-color: var(--bg-ter)
}

/*! component element CTA Button lv03 */

.btn-lv03 {
    padding: 0 0.8rem;
    height: 3.2rem;
    border-radius: 0.8rem;
    background-color: var(--color-pl, #b6f23d);
    color: var(--color-pn, #17008c);
    vertical-align: middle
}

:root .btn-lv03 {
    color: var(--txt-pri-inver, #fff)
}

:root .btn-lv03.readonly,
:root .btn-lv03.success {
    background-color: var(--bg-pri-disabled)
}

.btn-lv03 .txt {
    font-size: 1.4rem;
    white-space: nowrap;
    font-weight: 500
}

.btn-lv03.gray2 {
    background-color: var(--color-g500, #b8b8b8);
    line-height: 1.6rem
}

.btn-lv03.bg-white {
    background: var(--color-w100, #fff);
    border: 1px solid var(--color-g200, #eee)
}

.btn-lv03.bg-white .txt {
    color: var(--color-g800, #414141)
}

.btn-lv03.secondary {
    background-color: var(--color-g200, #eee)
}

:root .btn-lv03.secondary {
    color: var(--txt-accent-pri, #0114a7)
}

.btn-lv03 .txt [class^="ico-"] {
    width: 1.4rem;
    height: 1.4rem
}

:root .btn-lv03>[class^="ico-"]:first-child+.txt {
    padding-right: .4rem
}

:root .btn-lv03>.txt:first-child {
    padding-left: .4rem
}

:root .btn-lv03>.txt:only-child {
    padding: 0
}

/*! component element CTA Button lv04 */

.btn-group.depth2 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.btn-group.depth2 [class^="btn-"] {
    -webkit-box-flex: 0;
    -ms-flex: 0;
    flex: 0
}

.btn-group.depth2 [class^="btn-"]:first-child {
    -webkit-box-flex: 1;
    -ms-flex: 1 0 auto;
    flex: 1 0 auto
}

.btn-group.depth2 [class^="btn-"]+.depth2-group {
    margin-left: 0.8rem
}

.btn-group.depth2 .depth2-group {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    width: 100%;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.btn-group.depth2 .depth2-group [class^="btn-"] {
    -webkit-box-flex: 1;
    -ms-flex: auto;
    flex: auto;
    position: relative
}

.btn-group.depth2 .depth2-group [class^="btn-"]:first-child {
    border-right: 0;
    border-radius: 0.8rem 0 0 0.8rem
}

.btn-group.depth2 .depth2-group [class^="btn-"]+[class^="btn-"] {
    margin-left: -0.4rem;
    border-left: 0;
    border-radius: 0 0.8rem 0.8rem 0
}

.btn-group.depth2 .depth2-group [class^="btn-"]+[class^="btn-"]:before {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    left: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 1px;
    height: 1rem;
    background-color: var(--color-pb10, #00000019)
}

.btn-lv04 {
    padding: 0 1.6rem;
    height: 4rem;
    border-radius: 0.8rem;
    background-color: var(--color-w100, #fff);
    color: var(--color-pn, #17008c);
    vertical-align: middle;
    border: 1px solid var(--color-g200, #eee)
}

.btn-lv04 .txt {
    font-size: 1.4rem;
    white-space: nowrap;
    font-weight: 500
}

.btn-lv04.bg-sky {
    background-color: var(--color-cg300, #f1f6fb);
    border: 1px solid var(--color-pb5, #0000000C)
}

.btn-lv04.ty01 {
    padding: 0 .8rem 0 1.2rem
}

.btn-lv04.ty01 .txt {
    font-weight: 400
}

.btn-lv04.gray-line.ty01 .txt {
    color: var(--color-g900) !important
}

:root .btn-lv04.ty01 .ico-arrow-sbr {
    -webkit-filter: var(--filter-g900);
    filter: var(--filter-g900)
}

.btn-lv04.ty02 {
    border: 1px solid var(--border-qua)
}

.btn-lv04.ty02 .txt {
    color: var(--txt-sec);
    font-weight: 500
}

.btn-lv04.ty02.bg-type {
    border: none;
    background-color: #f0f5fc
}

.btn-lv04.ty02.bg-type .txt {
    color: var(--txt-pri-active);
    font-weight: 500
}

.btn-lv04.ty02 [class^="ico-"] {
    width: 1.6rem;
    height: 1.6rem
}

.btn-lv04.ty02 .ico-plus {
    -webkit-filter: var(--filter-in1100);
    filter: var(--filter-in1100)
}

.btn-lv04.secondary {
    color: var(--txt-accent-pri, #0114a7)
}

/*! component element CTA Button lv05 간편홈(고령자모드) */

.btn-lv05 {
    padding: 1rem 1.6rem;
    height: 6rem;
    border-radius: 1rem;
    color: var(--color-pn, #17008c);
    vertical-align: middle
}

.btn-lv05 .txt {
    font-size: 2.1rem;
    color: var(--color-g700);
    white-space: nowrap;
    font-weight: 500
}

.btn-lv05.gray-line {
    border: 1px solid var(--color-g400, #c7c7c7);
    background-color: var(--color-cg400, #ebecf0)
}

.btn-lv05.gray-line .txt {
    color: var(--color-g700)
}

/*! component element CTA Button lv06 메인 */

.btn-lv06 {
    padding: 2rem;
    height: 6rem;
    border-radius: 1.6rem;
    background-color: var(--color-w100, #fff);
    text-align: center
}

.btn-lv06 .txt {
    font-size: 1.4rem;
    color: var(--color-g900, #141414);
    font-weight: 400
}

.btn-group.depth2 .depth2-group .btn-lv06+.btn-lv06:before {
    height: 2rem
}

.btn-group.depth2 .depth2-group .btn-lv06:first-child {
    border-radius: 1.6rem 0 0 1.6rem
}

.btn-group.depth2 .depth2-group .btn-lv06+.btn-lv06 {
    border-radius: 0 1.6rem 1.6rem 0
}

.component-btn.type2 .btn-group.depth2 .depth2-group {
    -webkit-box-shadow: 0 0.4rem 2rem 0 rgba(0, 0, 0, 0.05);
    box-shadow: 0 0.4rem 2rem 0 rgba(0, 0, 0, 0.05);
    border-radius: 1.6rem
}

/*! component element CTA Button lv07 구독료 무료 챌린지 */

.btn-lv07 {
    padding: 1.7rem 2rem;
    height: 7rem;
    border-radius: 1.6rem;
    background-color: var(--color-ce300, #72e06a);
    text-align: center
}

.btn-lv07 .txt {
    font-size: 1.5rem;
    color: var(--color-g900, #141414);
    font-weight: 700
}

.btn-lv07.bg-vo800 {
    background-color: var(--color-vo800, #8a46f7)
}

.btn-lv07.bg-vo800 .txt {
    color: var(--color-w100, #fff)
}

/*! component element CTA Button lv08 전 계좌조회 */

.btn-lv08 {
    padding: 0.8rem 1.2rem;
    height: 3.6rem;
    border-radius: 0.8rem;
    background-color: var(--color-w100);
    border: 1px solid var(--border-qua);
    text-align: center
}

.btn-lv08 .txt {
    font-size: 1.4rem;
    color: var(--txt-ter);
    font-weight: 500
}

.btn-lv08.gray-round {
    border-radius: 99.9rem;
    background-color: var(--color-pb5)
}

.btn-lv08.gray-round .txt {
    color: var(--txt-sec)
}

/*! component element CTA Button Disabled */

[class^="btn-lv"].disabled,
[class^="btn-lv"]:disabled {
    background-color: var(--color-g200, #eee);
    -ms-touch-action: none;
    touch-action: none
}

:root [class^="btn-lv"].disabled,
:root [class^="btn-lv"]:disabled {
    background-color: var(--bg-pri-disabled, #edf1f7);
    -ms-touch-action: none;
    touch-action: none
}

:root [class^="btn-lv"].disabled [class*="ico"]:not([class*="-mask"]),
:root [class^="btn-lv"]:disabled [class*="ico"]:not([class*="-mask"]) {
    -webkit-filter: var(--filter-g400);
    filter: var(--filter-g400)
}

:root [class^="btn-lv"].disabled [class*="ico"][class*="-mask"],
:root [class^="btn-lv"]:disabled [class*="ico"][class*="-mask"] {
    background-color: var(--color-grey-g400)
}

[class^="btn-lv"].disabled .ico-clock.readonly {
    -webkit-filter: var(--filter-ico-readonly);
    filter: var(--filter-ico-readonly)
}

[class^="btn-lv"].disabled .txt,
[class^="btn-lv"]:disabled .txt {
    color: var(--color-g500, #b8b8b8)
}

:root [class^="btn-lv"].disabled .txt,
:root [class^="btn-lv"].readonly .txt,
:root [class^="btn-lv"].success .txt,
:root [class^="btn-lv"]:disabled .txt {
    color: var(--txt-disabled)
}

.bg-primary1 .btn-lv02.disabled,
.bg-primary1 .btn-lv02:disabled,
[class^="btn-lv"].white.disabled,
[class^="btn-lv"].white:disabled {
    background-color: var(--color-w15, #fffFFF26)
}

.bg-primary1 .btn-lv02.disabled .txt,
.bg-primary1 .btn-lv02:disabled .txt,
[class^="btn-lv"].white.disabled .txt,
[class^="btn-lv"].white:disabled .txt {
    color: var(--color-w20, #fffFFF33)
}

[class^="btn-lv"].black.disabled,
[class^="btn-lv"].black:disabled,
[class^="btn-lv"].trans-black.disabled,
[class^="btn-lv"].trans-black:disabled {
    background-color: var(--color-pb5, #0000000C)
}

[class^="btn-lv"].black.disabled .txt,
[class^="btn-lv"].black:disabled .txt,
[class^="btn-lv"].trans-black.disabled .txt,
[class^="btn-lv"].trans-black:disabled .txt {
    color: var(--color-pb20, #00000033)
}

:root .bg-primary1 .btn-lv02.disabled,
:root .bg-primary1 .btn-lv02:disabled,
:root [class^="btn-lv"].white.disabled,
:root [class^="btn-lv"].white:disabled {
    background-color: var(--color-w15, #fffFFF26)
}

:root .bg-primary1 .btn-lv02.disabled .txt,
:root .bg-primary1 .btn-lv02:disabled .txt,
:root [class^="btn-lv"].white.disabled .txt,
:root [class^="btn-lv"].white:disabled .txt {
    color: var(--color-w20, #fffFFF33)
}

:root [class^="btn-lv"].black.disabled,
:root [class^="btn-lv"].black:disabled,
:root [class^="btn-lv"].trans-black.disabled,
:root [class^="btn-lv"].trans-black:disabled {
    background-color: var(--color-pb5, #0000000C)
}

:root [class^="btn-lv"].black.disabled .txt,
:root [class^="btn-lv"].black:disabled .txt,
:root [class^="btn-lv"].trans-black.disabled .txt,
:root [class^="btn-lv"].trans-black:disabled .txt {
    color: var(--color-pb20, #00000033)
}

[class^="btn-lv"].gray-line.disabled,
[class^="btn-lv"].gray-line:disabled {
    background-color: var(--color-w100, #fff)
}

[class^="btn-lv"].gray-line.disabled .txt,
[class^="btn-lv"].gray-line:disabled .txt {
    color: var(--color-g500, #b8b8b8) !important
}

:root [class^="btn-lv"].gray-line.disabled .txt,
:root [class^="btn-lv"].gray-line:disabled .txt {
    color: var(--txt-disabled, #c8d2e4) !important
}

[class^="btn-lv"].gray-line.disabled [class^="ico"],
[class^="btn-lv"].gray-line:disabled [class^="ico"] {
    -webkit-filter: var(--filter-g500);
    filter: var(--filter-g500)
}

:root [class^="btn-lv"].gray-line.disabled,
:root [class^="btn-lv"].gray-line:disabled {
    background-color: var(--bg-base)
}

:root [class^="btn-lv"].gray-line.disabled .txt,
:root [class^="btn-lv"].gray-line:disabled .txt {
    color: var(--txt-disabled)
}

:root [class^="btn-lv"].gray-line.disabled [class*="ico"]:not([class*="-mask"]),
:root [class^="btn-lv"].gray-line:disabled [class*="ico"]:not([class*="-mask"]) {
    -webkit-filter: var(--filter-g400);
    filter: var(--filter-g400)
}

:root [class^="btn-lv"].gray-line.disabled [class*="ico"][class*="-mask"],
:root [class^="btn-lv"].gray-line:disabled [class*="ico"][class*="-mask"] {
    background-color: var(--color-grey-g400)
}

/*! component element Button etc */

.btn-dot {
    position: relative;
    width: 3.6rem;
    height: 0;
    padding-top: 3.6rem;
    display: block;
    overflow: hidden;
    border-radius: 50%;
    background: var(--color-w100, #fff);
    -webkit-box-sizing: content-box;
    box-sizing: content-box
}

.btn-dot:after {
    content: '';
    display: block;
    width: 2.4rem;
    height: 2.4rem;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    background-image: var(--path-line-more-hori);
    background-position: 0 0;
    background-repeat: no-repeat;
    background-size: contain
}

.btn-camera {
    position: relative;
    width: 3.6rem;
    height: 3.6rem;
    display: block;
    border-radius: 50%;
    background: var(--color-w100, #fff)
}

.btn-sort2 {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 3rem;
    height: 3rem;
    border-radius: 50%;
    border: 1px solid var(--color-g700)
}

.btn-sort2 .ico-sort {
    width: 1.6rem;
    height: 1.6rem
}

.btn-sort2.active:after {
    content: '';
    display: block;
    position: absolute;
    top: .2rem;
    right: .2rem;
    width: .5rem;
    height: .5rem;
    background: var(--color-re700, #f02727);
    border-radius: 50%
}

.btn-export .ico-benefit-share {
    width: 2rem;
    height: 2rem
}

/*! component element Button 간편인증서 */

.btn-ico-logo {
    display: block;
    width: 100%;
    padding: 1.45rem 0;
    border: 1px solid var(--color-g200, #eee);
    border-radius: 0.8rem;
    text-align: center
}

.btn-ico-logo .txt {
    font-size: 1.4rem;
    color: var(--color-g900, #141414)
}

.btn-ico-logo [class^="ico-"],
.btn-ico-logo [class^="logo-bank"] {
    display: block;
    margin: 0 auto 1.2rem;
    width: 4.4rem;
    height: 4.4rem;
    border-radius: 99rem;
    overflow: hidden;
    background-size: cover
}

/*! component element Button varient button */

.keyword-filter-chips .filter-row,
.keyword-search-chips,
.keyword-select-chips {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    font-size: 0
}

/*! chips base */

.keyword-select-chips::-webkit-scrollbar {
    display: none
}

.keyword-filter-chips .filter-chips,
.keyword-search-chips .btn-chips,
.keyword-select-chips .select-chips {
    position: relative
}

.component-tab.scroll-chips .keyword-select-chips .chips-btn,
.keyword-filter-chips .filter-chips label,
.keyword-search-chips .btn-chips,
.keyword-select-chips .select-chips label {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    min-width: 5rem;
    height: 3.4rem;
    border-radius: 99rem;
    padding: 0 1.4rem;
    margin: 0 0.8rem 0.8rem 0;
    background-color: var(--color-w100, #fff);
    font-size: 1.4rem;
    line-height: 1.42857;
    font-weight: 400;
    color: var(--color-g800, #414141);
    border: 1px solid var(--color-g200, #eee)
}

:root .component-tab.scroll-chips .keyword-select-chips .chips-btn,
:root .keyword-filter-chips .filter-chips label,
:root .keyword-search-chips .btn-chips,
:root .keyword-select-chips .select-chips label {
    background-color: var(--bg-base);
    color: var(--txt-pri);
    border: 1px solid var(--border-qua)
}

.keyword-search-chips.type2 .btn-chips {
    height: 3.4rem;
    padding: 0.7rem 1.2rem;
    border-radius: 0.4rem;
    background-color: var(--color-cg300, #f1f6fb);
    border: 1px solid var(--color-pb5, #0000000C)
}

.keyword-filter-chips.type2 .filter-chips label {
    border-color: var(--color-g200, #eee);
    background-color: var(--color-g200, #eee)
}

:root .keyword-filter-chips.type2 .filter-chips label {
    border-color: var(--bg-ter);
    background-color: var(--bg-ter)
}

.keyword-filter-chips .filter-chips:last-child label,
.keyword-search-chips .btn-chips:last-child,
.keyword-select-chips .select-chips:last-child label {
    margin-right: 0
}

.keyword-filter-chips .filter-chips input,
.keyword-select-chips .select-chips input {
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    opacity: 0
}

:root .keyword-filter-chips .filter-chips input,
:root .keyword-select-chips .select-chips input {
    width: calc(100% - 0.8rem);
    height: 3.4rem
}

/*! chips active */

.keyword-select-chips.type2 .select-chips label {
    background-color: var(--color-g200, #eee);
    border: 0
}

:root .keyword-select-chips.type2 .select-chips label {
    background-color: var(--bg-ter);
    border: 0
}

.keyword-select-chips.type3 .select-chips label {
    background-color: var(--color-g200, #eee);
    border: 0
}

:root .keyword-select-chips.type3 .select-chips label {
    color: var(--txt-pri, #020616);
    background-color: var(--bg-ter, #edf1f7);
    border: 0
}

.keyword-select-chips .select-chips label {
    margin-bottom: 1.1rem
}

.keyword-select-chips .select-chips.new:after {
    content: '';
    display: block;
    position: absolute;
    right: 0.8rem;
    top: -0.5rem;
    width: 1.6rem;
    height: 1.6rem;
    background: var(--color-re700) var(--path-etc-new) no-repeat center;
    border-radius: 50%
}

.keyword-select-chips .select-chips:last-child.new:after {
    right: 4.4rem
}

.keyword-select-chips .select-chips.new.new-md:after {
    width: 0.6rem;
    height: 0.6rem;
    background: var(--color-re700) no-repeat center
}

:root .keyword-select-chips.main .select-chips.new:after {
    display: none
}

:root .keyword-select-chips.main .select-chips.new label:after {
    content: '';
    display: block;
    position: absolute;
    right: 0.8rem;
    top: -0.5rem;
    width: 1.6rem;
    height: 1.6rem;
    background: var(--color-re700) var(--path-etc-new) no-repeat center;
    border-radius: 50%
}

:root .keyword-select-chips.main .select-chips:last-child.new label:after {
    right: 4.4rem
}

.keyword-filter-chips .filter-chips input:checked+label,
.keyword-search-chips .btn-chips.active,
.keyword-select-chips .select-chips input:checked+label {
    background-color: var(--color-g900, #141414);
    color: var(--color-w100, #fff);
    font-weight: 700;
    border: 1px solid transparent
}

:root .keyword-filter-chips .filter-chips input:checked+label,
:root .keyword-search-chips .btn-chips.active,
:root .keyword-select-chips .select-chips input:checked+label {
    background-color: var(--bg-pri-active);
    color: var(--txt-pri-invert);
    border: 1px solid transparent
}

:root .keyword-filter-chips.type2 .filter-chips input:checked+label,
:root .keyword-search-chips.type2 .btn-chips.active,
:root .keyword-select-chips.type2 .select-chips input:checked+label {
    background-color: var(--bg-sec-active);
    color: var(--txt-pri-invert);
    border: 1px solid transparent
}

.keyword-select-chips.type3 .select-chips input:checked+label {
    background-color: var(--color-pn, #17008c);
    color: var(--color-w100, #fff);
    font-weight: 700;
    border: 0
}

.keyword-filter-chips .filter-chips input:checked+label:before {
    content: '';
    display: inline-block;
    vertical-align: middle;
    margin-right: 0.5rem;
    width: 1.6rem;
    height: 1.6rem;
    background-position: 0 0;
    background-repeat: no-repeat;
    background-image: var(--path-solid-colored-check-ico-pri-invert);
    background-size: contain
}

.keyword-filter-chips .filter-chips input:checked+label {
    padding-left: 1.5rem
}

/*! select-chips */

.keyword-select-chips {
    position: relative;
    overflow: hidden;
    margin: 0 -0.4rem 0 -2rem;
    min-height: 5.6rem
}

.chips-new-info {
    display: block;
    position: absolute;
    right: -0.4rem;
    top: -0.2rem;
    width: 1.6rem;
    height: 1.6rem;
    background: var(--color-re700) var(--path-etc-new) no-repeat center;
    border-radius: 50%
}

.active .chips-new-info,
.disabled .chips-new-info,
input:checked~.chips-new-info,
input:disabled~.chips-new-info {
    display: none
}

.chips-btn .chips-new-info,
.filter-chips .chips-new-info,
.select-chips .chips-new-info {
    margin-right: 0.8rem
}

:root .tab-group .tab-list-col .tab-item .tab-link.bg-pri-active,
:root .tab-group .tab-list-col .tab-item .tab-link.border-pri-active {
    background-color: var(--bg-base);
    color: var(--txt-pri);
    border: 1px solid var(--border-qua)
}

:root .tab-group .tab-list-col .tab-item.active .tab-link.bg-pri-active,
:root [class*="chips"].bg-pri-active input:checked+label,
:root [class*="chips"].bg-pri-active.active {
    background-color: var(--bg-pri-active);
    color: var(--txt-pri-invert);
    border: 1px solid transparent;
    font-weight: 700
}

:root .tab-group .tab-list-col .tab-item.active .tab-link.bg-sec-active,
:root [class*="chips"].bg-sec-active input:checked+label,
:root [class*="chips"].bg-sec-active.active {
    background-color: var(--bg-sec-active);
    color: var(--txt-pri-invert);
    border: 1px solid transparent
}

:root .tab-group .tab-list-col .tab-item.active .tab-link.border-pri-active,
:root [class*="chips"].border-pri-active input:checked+label,
:root [class*="chips"].border-pri-active.active {
    background-color: var(--bg-base);
    color: var(--txt-pri-active);
    font-weight: 700;
    border: 1px solid var(--border-pri-active)
}

:root .tab-group .tab-list-col .tab-item.disabled .tab-link {
    background-color: var(--bg-ter);
    border: 1px solid var(--bg-ter);
    color: var(--txt-disabled)
}

:root .tab-group .tab-list-col .tab-item.disabled .tab-link.bg-pri-active,
:root .tab-group .tab-list-col .tab-item.disabled .tab-link.border-pri-active {
    background-color: var(--bg-pri-base);
    border-color: var(--border-qua)
}

:root [class*="filter-chips"].bg-pri-active input:checked+label:before,
:root [class*="filter-chips"].border-pri-active input:checked+label:before {
    content: '';
    display: inline-block;
    vertical-align: middle;
    margin-right: 0.5rem;
    width: 1.6rem;
    height: 1.6rem;
    background-position: 0 0;
    background-repeat: no-repeat;
    background-image: var(--path-solid-colored-check-ico-pri-active);
    background-size: contain
}

:root [class*="filter-chips"].bg-pri-active input:checked+label:before {
    background-image: var(--path-solid-colored-check-ico-pri-invert)
}

.keyword-select-chips>.inner-scroll {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    overflow-x: auto;
    padding: 1.1rem 0.1rem 0 2rem
}

.keyword-select-chips>.inner-scroll::-webkit-scrollbar {
    display: none
}

.component-tab:not(.scroll-chips) .keyword-select-chips.type0 {
    padding: 1.1rem 0.1rem 0 2rem
}

.component-tab:not(.scroll-chips) .keyword-select-chips.type0 .inner-scroll {
    padding: 1.1rem 0 0;
    margin-top: -1.1rem
}

.component-tab:not(.scroll-chips) .keyword-select-chips.type0.open .inner-scroll {
    padding: 1.1rem 4.4rem 0 0
}

.keyword-select-chips .select-chips {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.keyword-select-chips .select-chips:last-child {
    padding-right: 4.4rem
}

.keyword-select-chips .btn-open {
    position: absolute;
    top: 1.1rem;
    right: 0;
    z-index: 2;
    display: none
}

.keyword-select-chips .btn-open:before {
    content: "";
    position: absolute;
    right: -2.2rem;
    top: -5px;
    display: block;
    height: 5rem;
    width: 8.6rem;
    background: -webkit-gradient(linear, right top, left top, color-stop(70%, var(--color-w100, #fff)), to(rgba(255, 255, 255, 0)));
    background: -o-linear-gradient(right, var(--color-w100, #fff) 70%, rgba(255, 255, 255, 0) 100%);
    background: linear-gradient(270deg, var(--color-w100, #fff) 70%, rgba(255, 255, 255, 0) 100%);
    z-index: 1
}

.keyword-select-chips .btn-open .ico-arrow-open {
    width: 3.4rem;
    height: 3.4rem;
    position: relative;
    border: 1px solid var(--color-g300, #e0e0e0);
    border-radius: 99rem;
    background-image: var(--path-line-chevron-down);
    background-size: 1.6rem 1.6rem;
    background-color: var(--color-g200, #eee);
    z-index: 2
}

:root .keyword-select-chips .btn-open .ico-arrow-open {
    border: unset
}

.keyword-select-chips.type2 .btn-open .ico-arrow-open,
.keyword-select-chips.type3 .btn-open .ico-arrow-open {
    background-color: var(--color-w100, #fff)
}

:root .keyword-select-chips.type2 .btn-open .ico-arrow-open,
:root .keyword-select-chips.type3 .btn-open .ico-arrow-open {
    border: 1px solid var(--color-g300)
}

.keyword-select-chips.open .btn-open .ico-arrow-open {
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg)
}

.keyword-select-chips.open>.inner-scroll {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding-right: 4.4rem;
    overflow-x: unset
}

.keyword-select-chips.inner-pr34>.inner-scroll {
    padding-right: 3.4rem
}

.keyword-select-chips.inner-pr34.open>.inner-scroll+.btn-open::before {
    display: none
}

.keyword-select-chips.moneytalk {
    padding: 1.1rem 0.1rem 0 2rem
}

.keyword-select-chips.moneytalk .inner-scroll {
    padding: 0
}

.keyword-select-chips.custom-policy {
    margin-top: 1.2rem;
    margin-left: 0;
    margin-right: 0;
    min-height: auto
}

.keyword-select-chips.custom-policy .select-chips label {
    margin-bottom: 0.8rem
}

.keyword-select-chips.custom-policy .select-chips:last-child {
    padding-right: 0
}

.keyword-select-chips.type4 {
    margin: 0 -2rem
}

.keyword-select-chips.type4 .select-chips input:checked+label {
    background-color: var(--bg-base);
    color: var(--txt-pri);
    border: 1px solid var(--border-qua);
    font-weight: 400
}

.keyword-select-chips.type4 .select-chips:last-child {
    padding-right: 0
}

.btn-keyword {
    border: 1px solid var(--color-g300, #e0e0e0);
    padding: 0 0.8rem 0 1.2rem;
    height: 3.2rem;
    border-radius: 0.8rem;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.btn-keyword .txt {
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 11rem;
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--color-g900, #141414);
    font-weight: 500
}

.btn-keyword .ico-delete {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin-left: 0.4rem;
    width: 1.6rem;
    height: 1.6rem;
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

.btn-keyword .ico-delete .line {
    width: 1.1rem;
    height: 1.1rem
}

.btn-keyword .ico-delete .line:before {
    background-color: var(--color-cg600, #a6a6b3);
    height: 1px
}

.btn-keyword .ico-delete .line:after {
    background-color: var(--color-cg600, #a6a6b3);
    width: 1px
}

.btn-keyword .ico-delete-input {
    margin-left: 0.8rem
}

.btn-search-address {
    padding: 0 1.2rem 0 0.8rem;
    height: 3.2rem;
    border-radius: 0.8rem;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: var(--color-g200, #eee)
}

.btn-search-address .txt {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 500;
    color: var(--color-pn, #17008c)
}

.btn-search-address .ico-search-list {
    width: 1.6rem;
    height: 1.6rem;
    margin-right: 0.4rem;
    -webkit-filter: var(--filter-pn);
    filter: var(--filter-pn)
}

.btn-condition {
    border-radius: 1.8rem;
    border: 0.1rem solid var(--color-bu900, #003fc7);
    padding: 0.5rem 1.2rem;
    color: var(--color-bu900, #003fc7);
    font-size: 1.4rem;
    line-height: 1.42857;
    font-weight: bold
}

.btn-condition .ico-arrow-link {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='4 1 7 12'%3E%3Cpath fill='%235163d1' d='M5.67 12.5L5 11.81 9.67 7 5 2.19l.67-.69L11 7z' class='ico-arrow-right'/%3E%3C/svg%3E")
}

.btn-tip {
    height: 3.2rem;
    padding: 0 0.8rem;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    background-color: var(--color-cg500, #e6ebf5);
    border-radius: 0.8rem
}

.btn-tip .txt {
    font-size: 1.4rem;
    color: var(--color-pn, #17008c);
    line-height: 2rem
}

.btn-tip .ico-help.solid {
    width: 1.6rem;
    height: 1.6rem;
    -webkit-filter: var(--filter-pn);
    filter: var(--filter-pn);
    margin-right: 0.2rem
}

.btn-tip .ico-help.solid.unset {
    -webkit-filter: unset;
    filter: unset
}

:root .component-tab.scroll-chips .keyword-select-chips input[disabled]+.chips-btn,
:root .keyword-filter-chips .filter-chips input[disabled]+label,
:root .keyword-search-chips .btn-chips.disabled,
:root .keyword-select-chips .select-chips input[disabled]+label {
    background-color: var(--bg-pri-base);
    border-color: var(--border-qua);
    color: var(--txt-disabled)
}

:root .component-tab.scroll-chips .keyword-select-chips.type2 input[disabled]+.chips-btn,
:root .keyword-filter-chips.type2 .filter-chips input[disabled]+label,
:root .keyword-search-chips.type2 .btn-chips.disabled,
:root .keyword-select-chips.type2 .select-chips input[disabled]+label {
    background-color: var(--bg-ter);
    border-color: var(--bg-ter);
    color: var(--txt-disabled)
}

.btn-general-search,
.btn-search-keyword {
    padding: 0 1.2rem;
    height: 4.4rem;
    border-radius: 1.2rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: var(--bg-qua)
}

.btn-general-search .ico-search-input,
.btn-search-keyword .ico-search-input {
    -webkit-filter: var(--filter-g600) !important;
    filter: var(--filter-g600) !important
}

.btn-general-search .txt,
.btn-search-keyword .txt {
    margin-left: 0.8rem;
    font-size: 1.6rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--txt-pri-placeholder)
}

/*! scroll chips */

.component-header+.component-tab.scroll-chips {
    margin-top: 0
}

.component-tab.scroll-chips {
    width: 100%;
    overflow: hidden
}

.component-tab.scroll-chips .keyword-select-chips {
    margin-right: -2rem
}

.component-tab.scroll-chips .keyword-select-chips .select-chips:last-child {
    padding-right: 2rem
}

.component-tab.scroll-chips .keyword-select-chips .chips-btn {
    background-color: var(--color-g200, #eee);
    border: 0;
    margin-bottom: 1.1rem
}

/*! component element Button 더보기 버튼들 */

.btn-view-more {
    display: block;
    width: 100%;
    text-align: center;
    padding: 1.5rem 0 1.5rem 0
}

.btn-view-more.type2 {
    padding: 2.4rem 0
}

.btn-view-more [class^="ico-"] {
    width: 1.6rem;
    height: 1.6rem;
    margin-left: 0.1rem
}

.btn-view-more [class^="ico-"].w14 {
    width: 1.4rem;
    height: 1.4rem
}

.btn-view-more .ico-arrow-open {
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700);
    margin-top: -0.2rem
}

.btn-view-more .ico-arrow-link {
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700);
    margin-top: -0.2rem
}

.btn-view-more .txt {
    font-size: 1.4rem;
    line-height: 1.42857;
    font-weight: 500;
    color: var(--color-g700)
}

.btn-view-more.line {
    border: 0.1rem solid var(--color-g300, #e0e0e0);
    border-radius: 0.9rem;
    background-color: var(--color-w100, #fff)
}

.btn-view-more.line .txt {
    font-size: 1.5rem;
    color: var(--color-g800, #414141)
}

.btn-view-more.line2 {
    -webkit-box-flex: 0;
    -ms-flex: 0 auto;
    flex: 0 auto;
    padding: 0 1.6rem 0 2rem;
    margin: 0 auto;
    width: auto;
    height: 4.8rem;
    border: 1px solid var(--color-g300, #e0e0e0);
    border-radius: 1.2rem
}

.btn-view-more.line2 .txt {
    font-size: 1.6rem;
    color: var(--color-g900, #141414);
    line-height: 2.1rem
}

.btn-view-more.line2 .ico-arrow-open {
    width: 2rem;
    height: 2rem;
    -webkit-filter: var(--filter-g900);
    filter: var(--filter-g900);
    margin-left: 0.3rem
}

.btn-view-more.divider-gray {
    -webkit-box-flex: 0;
    -ms-flex: 0 auto;
    flex: 0 auto;
    padding: 0 1.6rem;
    margin: 0 auto;
    width: auto;
    height: 4.4rem;
    border-radius: 1.2rem;
    background-color: var(--bg-ter)
}

.btn-view-more.divider-gray .txt {
    font-size: 1.4rem;
    font-weight: 500;
    line-height: 1.6rem;
    color: var(--txt-sec)
}

.btn-view-more.line2.type1 {
    width: 100%
}

.btn-view-more.line2.type1.hover:active {
    -webkit-animation: list-card-active 0.1s ease-in-out forwards;
    animation: list-card-active 0.1s ease-in-out forwards;
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    overflow: hidden
}

/*! component element Button underlink type */

.btn-under-link {
    display: inline-block;
    text-decoration: underline;
    text-underline-position: under;
    padding-bottom: 1px;
    color: var(--color-g900, #141414)
}

.btn-under-link.primary1 {
    color: var(--color-pn, #17008c)
}

.btn-under-link.secondary1-3 {
    color: var(--color-bu700, #006aff)
}

.btn-under-link.secondary1-4 {
    color: var(--color-bu900, #003fc7)
}

.btn-under-link.secondary1-5 {
    color: var(--txt-accent-sec)
}

.btn-under-link.secondary2 {
    color: var(--color-lm500, #69b405)
}

:root .btn-under-link.secondary2 {
    color: var(--txt-pri-success, #039115)
}

.btn-under-link.warning {
    color: var(--color-re700, #f02727)
}

.btn-under-link.gray2 {
    color: var(--color-g600, #9b9b9b)
}

.btn-under-link.darkgray {
    color: var(--color-g800, #414141)
}

.btn-under-link.darkgray2 {
    color: var(--color-g700)
}

.btn-under-link.block {
    display: block;
    margin: 0.8rem 0 0.6rem
}

.btn-under-link.block-medium {
    display: block;
    margin: 0;
    padding-top: 1.6rem;
    padding-bottom: 1.6rem
}

.btn-under-link.right {
    text-align: right
}

.btn-under-link+.txt-lv03 {
    margin-top: 0.4rem
}

.btn-under-link.white {
    color: var(--color-w100, #fff)
}

.btn-under-link.qua {
    color: var(--txt-qua)
}

.btn-under-link.ter {
    color: var(--txt-ter)
}

.btn-under-link.pri {
    color: var(--txt-pri)
}

.btn-under-link.sec {
    color: var(--txt-sec)
}

.btn-under-link.disable,
.btn-under-link.disable *,
.btn-under-link:disabled *,
html.ally .btn-under-link.disable {
    color: var(--txt-disabled, #c8d2e4) !important
}

/*! component element Button text type */

.inline-block {
    display: inline-block
}

.btn-text {
    color: var(--color-g900, #141414)
}

.btn-text.primary1 {
    color: var(--color-pn, #17008c)
}

.btn-text.secondary2 {
    color: var(--color-lm500, #69b405)
}

:root .btn-text.secondary2 {
    color: var(--txt-pri-success, #039115)
}

.btn-text.gray2 {
    color: var(--color-g600, #9b9b9b)
}

.btn-text.darkgray2 {
    color: var(--color-g700)
}

.btn-text.block {
    display: block;
    margin: 0.8rem 0
}

.btn-text.right {
    text-align: right
}

.btn-text:disabled *,
html.ally .btn-text.disable * {
    color: var(--txt-disabled, #c8d2e4) !important
}

html.ally .btn-text.disable [class*="ico"] {
    -webkit-filter: var(--filter-g400);
    filter: var(--filter-g400)
}

.btn-text.large .txt {
    font-size: 2.4rem;
    font-weight: 700;
    line-height: 3.3rem;
    vertical-align: middle
}

.btn-text.large.disabled .ico-triangle-down-sample01 {
    display: none
}

.btn-text.large .ico-triangle-down-sample01 {
    width: 1.6rem
}

/*! component element Button arrow type */

.btn-arrow {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.btn-arrow .ico-arrow-link {
    width: 1.3rem;
    height: 1.3rem
}

.btn-arrow.primary1 {
    color: var(--color-pn, #17008c)
}

.btn-arrow.primary1 .ico-arrow-link {
    -webkit-filter: var(--filter-pn);
    filter: var(--filter-pn)
}

.btn-arrow.secondary1 {
    color: var(--color-bu800, #0150ff)
}

.btn-arrow.secondary1 .ico-arrow-link {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='4 1 7 12'%3E%3Cpath fill='%2350ff' d='M5.67 12.5L5 11.81 9.67 7 5 2.19l.67-.69L11 7z' class='ico-arrow-right'/%3E%3C/svg%3E")
}

.btn-arrow.secondary2 {
    color: var(--color-lm500, #69b405)
}

:root .btn-arrow.secondary2 {
    color: var(--txt-pri-success, #039115)
}

.btn-arrow.secondary2 .ico-arrow-link {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='4 1 7 12'%3E%3Cpath fill='%2369b405' d='M5.67 12.5L5 11.81 9.67 7 5 2.19l.67-.69L11 7z' class='ico-arrow-right'/%3E%3C/svg%3E")
}

.btn-arrow.darkgray2 {
    color: var(--color-g700)
}

.btn-arrow.darkgray2 .ico-arrow-link {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='4 1 7 12'%3E%3Cpath fill='%237d7d7d' d='M5.67 12.5L5 11.81 9.67 7 5 2.19l.67-.69L11 7z' class='ico-arrow-right'/%3E%3C/svg%3E")
}

.bg-primary3 .btn-arrow .ico-arrow-link {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='4 1 7 12'%3E%3Cpath fill='%23ffffff' d='M5.67 12.5L5 11.81 9.67 7 5 2.19l.67-.69L11 7z' class='ico-arrow-right'/%3E%3C/svg%3E")
}

.btn-arrow.ty01 .ico-arrow-link {
    width: 1.6rem;
    height: 1.6rem;
    margin-left: .4rem;
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

.btn-arrow.ty01 .txt-lv01.black+.ico-arrow-link {
    -webkit-filter: var(--filter-g900);
    filter: var(--filter-g900)
}

.btn-arrow:disabled *,
html.ally .btn-arrow.disable * {
    color: var(--txt-disabled, #c8d2e4) !important
}

.btn-arrow:disabled [class*="ico"],
html.ally .btn-arrow.disable [class*="ico"] {
    -webkit-filter: var(--filter-g400);
    filter: var(--filter-g400)
}

/*! component element Button download 목록 */

.btn-down-gorup {
    margin-top: 2.4rem
}

.btn-down-gorup .btn-down {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
    height: 5rem;
    padding: 0 2rem;
    border-radius: 1.2rem;
    background-color: var(--color-g100, #f8f8f8)
}

.btn-down-gorup .btn-down+.btn-down {
    margin-top: 1.2rem
}

.btn-down-gorup .btn-down .txt {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    text-align: left
}

.btn-down-gorup .helper-msg {
    margin-top: 3.2rem;
    font-size: 1.4rem;
    line-height: 1.42857;
    font-weight: 400;
    color: var(--color-g700)
}

/*! component element Button link - 하단 버튼정렬 */

.link-group {
    text-align: center
}

.link-group+.btn-group {
    margin-top: 4.6rem
}

/*! component element Button 버튼정렬 */

.btn-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.btn-group [class^="btn-"] {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.btn-group [class^="btn-"].flex2 {
    -webkit-box-flex: 2;
    -ms-flex: 2;
    flex: 2
}

.btn-group [class^="btn-"].flex1 {
    padding: 0;
    min-width: auto
}

.btn-group [class^="btn-"].flex1.p16 {
    padding: 0 1.6rem
}

.btn-group [class^="btn-"].flex1.p25 {
    padding: 0 2.5rem
}

.btn-group [class^="btn-"]+[class^="btn-"] {
    margin-left: 1rem
}

.btn-group[button-num="1"] [class^="btn-"]+[class^="btn-"] {
    margin-left: 0
}

.btn-group.d-flex-dr-c [class^="btn-"]+[class^="btn-"] {
    margin-left: 0
}

.btn-group.onesize {
    margin: 0 3.6rem
}

.btn-group+.btn-group {
    margin-top: 1.6rem
}

.btn-group+.btn-group.all-ty {
    margin-top: .8rem
}

.btn-group.left {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.btn-group.left [class^="btn-"] {
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none
}

.btn-group.right {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.btn-group.right [class^="btn-"] {
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none
}

.btn-group.center {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.btn-group.center+.btn-group {
    margin-top: 6.4rem
}

.btn-group.center [class^="btn-"] {
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none
}

.btn-group .btn-under-link {
    margin-left: 0.2rem;
    margin-right: 0.2rem
}

.btn-group.border-bottom {
    border-bottom: 1px solid var(--color-g200)
}

.btn-group.border-top {
    margin-top: 1.2rem;
    border-top: 1px solid var(--border-quin)
}

/*! component element Button 버튼 border 제거 */

.btn-group.text-btn-group [class^="btn-"] {
    border: 0
}

/*! component element Button 라운드버튼 */

.btn-round {
    border-radius: 50%;
    margin: 0 0.4rem;
    width: 4rem;
    height: 4rem;
    background-color: var(--color-re700, #f02727)
}

.btn-round.red {
    background-color: var(--color-re700, #f02727)
}

.btn-round.black {
    background-color: var(--color-g900, #141414)
}

.btn-round.active {
    border: 0.3rem solid var(--color-pl, #b6f23d);
    -webkit-box-sizing: initial;
    box-sizing: initial
}

/*! component element Button 영역 */

.component-btn.bg-gray {
    background: var(--color-g100, #f8f8f8);
    padding: 6.4rem 0
}

.component-btn+.component-text-simple {
    margin-top: 2.4rem
}

.component-btn.center {
    text-align: center
}

/*! component element Button 영역 상단 - 가이드 텍스트 */

.component-btn .txt-guide {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-bottom: 3.2rem
}

.component-btn .tooltip-group {
    margin-left: 0.8rem
}

/*! component element Button 버튼 - 애니메이션 */

.txt-lv03.animate-btn .ico-refresh {
    -webkit-transform-origin: 47% 47%;
    -ms-transform-origin: 47% 47%;
    transform-origin: 47% 47%;
    -webkit-animation-name: btn-refresh;
    animation-name: btn-refresh;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards
}

@-webkit-keyframes btn-refresh {
    from {
        -webkit-transform: rotate(0);
        transform: rotate(0)
    }
    to {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

@keyframes btn-refresh {
    from {
        -webkit-transform: rotate(0);
        transform: rotate(0)
    }
    to {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

/*! 구소스 공지사항 > 신소스 copy FETASK-515 공지사항 어드민 가이드 2023-01-18 */

.csc-notice .txt-lv03+.bl-txt-group {
    padding: 2.4rem 0 0
}

.csc-notice .bl-txt-group>.txt {
    padding-left: 1.8rem
}

.csc-notice .bl-txt-group>.txt:before {
    content: '■'
}

.csc-notice .txt-lv03,
.csc-notice h4 {
    font-size: 1.4rem;
    line-height: 2.3rem
}

.csc-notice .bl-txt-group .txt {
    font-size: 1.4rem;
    color: var(--color-g900, #141414)
}

.csc-notice *+.txt-lv03,
.csc-notice .bl-txt-group+table,
.csc-notice table {
    margin-top: 2.4rem
}

.csc-notice table+b {
    width: 100%;
    display: inline-block;
    margin-top: 1rem
}

.csc-notice table * {
    font-weight: normal;
    padding: 0.1rem
}

.csc-notice table.table_type06 td,
.csc-notice table.table_type06 th {
    padding: 9px 10px
}

.law.lawReform strong {
    font-weight: bold
}

.law.lawReform h1 {
    font-size: 18px;
    font-weight: bold
}

.law.lawReform h2 {
    font-size: 18px;
    font-weight: bold
}

.btn-double-vert {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.btn-triangle {
    width: 3.6rem;
    height: 2.5rem
}

.btn-triangle:disabled,
.btn-triangle:disabled {
    cursor: default;
    background-color: unset
}

:root .btn-triangle:disabled,
:root .btn-triangle:disabled {
    cursor: default;
    background-color: unset
}

.btn-double-vert .btn-triangle [class^="ico"] {
    margin-right: 0;
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700);
    width: 1.6rem;
    height: 1.6rem
}

.btn-double-vert .btn-triangle:disabled [class^="ico"] {
    -webkit-filter: var(--filter-g400);
    filter: var(--filter-g400)
}

:root .btn-double-vert .btn-triangle [class^="ico"] {
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

:root .btn-double-vert .btn-triangle:disabled [class^="ico"] {
    -webkit-filter: var(--filter-g400);
    filter: var(--filter-g400)
}

.btn-shift {
    width: 3.6rem;
    height: 3.6rem;
    border: 1px solid var(--color-g300, #e0e0e0);
    border-radius: 0.8rem
}

.btn-shift+.btn-shift,
.sorting-group .btn-shift {
    margin-left: 0 !important
}

.btn-shift [class^="ico"] {
    width: 1.6rem;
    height: 1.6rem;
    margin-right: 0;
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

.btn-shift.active,
.btn-shift:focus {
    border-color: var(--color-pn, #17008c);
    background-color: var(--color-g100, #f8f8f8)
}

.btn-shift.active [class^="ico"],
.btn-shift:focus [class^="ico"] {
    -webkit-filter: var(--filter-pn);
    filter: var(--filter-pn)
}

.btn-account-copy {
    margin-top: .4rem
}

:root .btn-account-copy {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

:root .btn-account-copy .ico-copy {
    margin-left: .4rem
}

:root .btn-account-copy .txt-lv05 {
    color: var(--txt-sec, #3b4659)
}

/*! component element plusbox 이미지변경 Button common */

.btn-plusbox-choice {
    position: relative;
    width: 6.4rem;
    height: 6.4rem;
    border-radius: 99rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    background-color: var(--bg-qua);
    border: 0.5px solid var(--border-quin)
}

.btn-plusbox-choice .ico-plus-circle {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 2.4rem;
    height: 2.4rem;
    border-radius: 99rem;
    overflow: hidden;
    -webkit-filter: var(--filter-indigo-in700);
    filter: var(--filter-indigo-in700)
}

.btn-ico-type {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 100%;
    background-color: var(--bg-qua);
    border-radius: 1.6rem;
    border: 0.5px solid var(--border-quin);
    aspect-ratio: 1
}

.btn-ico-type.active,
.btn-ico-type:active {
    border: 1px solid var(--border-ter-active);
    background-color: var(--color-indigo-in50)
}

.btn-ico-type [class*="ico-"] {
    width: 4.4rem;
    height: 4.4rem
}

/*! component element btn-keyword 가이드 CHPFMTASK-1591 CMMSRH0000000000S_M01 CHPFMTASK-1630 PBKMAN0000003200S_M01 가이드 */

.btn-keyword-default,
.btn-keyword-line {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 3.2rem;
    background-color: var(--bg-base);
    border-radius: 99rem
}

.btn-keyword-default .close,
.btn-keyword-default .txt,
.btn-keyword-line .close,
.btn-keyword-line .txt {
    display: block
}

.btn-keyword-default .txt,
.btn-keyword-line .txt {
    padding-left: 1.2rem;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 13.8rem;
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--txt-sec);
    font-weight: 400
}

.btn-keyword-default .close,
.btn-keyword-line .close {
    margin-left: 0.4rem;
    padding-right: 1.2rem
}

.btn-keyword-default .ico-delete,
.btn-keyword-line .ico-delete {
    width: 1.6rem;
    height: 1.6rem;
    -webkit-filter: var(--filter-ico-ter);
    filter: var(--filter-ico-ter)
}

.btn-keyword-line {
    border: 1px solid var(--border-quin)
}

.btn-keyword-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-bottom: -0.8rem
}

.btn-keyword-group .btn-keyword-default,
.btn-keyword-group .btn-keyword-line {
    margin-right: 0.8rem;
    margin-bottom: 0.8rem
}

.btn-keyword-group .btn-keyword-default:last-child,
.btn-keyword-group .btn-keyword-line:last-child {
    margin-right: 0
}

.btn-keyword-group .btn-keyword-default .close,
.btn-keyword-group .btn-keyword-line .close {
    -webkit-filter: var(--filter-ico-ter);
    filter: var(--filter-ico-ter)
}

.btn-keyword-group.nowrap {
    overflow-y: hidden;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    margin: 0 -2rem;
    padding: 1.2rem 2rem
}

.btn-keyword-group.nowrap::-webkit-scrollbar {
    display: none
}

.btn-keyword-group.nowrap .btn-keyword-default,
.btn-keyword-group.nowrap .btn-keyword-line {
    margin-bottom: 0
}

[touchEventContainer],
[touchEventContents] {
    transition: transform 0.4s var(--kds-easing-steady), -webkit-transform 0.4s var(--kds-easing-steady)
}

[touchEventkv] {
    opacity: 0
}

[touchEventkv].directpage {
    opacity: 1
}

/*! txt-indent 불릿 들여쓰기 */

.txt-indent {
    padding-left: 1.2rem;
    text-indent: -1.2rem
}

/*! pointer-events:none */

.pointer-none {
    pointer-events: none
}

/*! component element btn-keyword 가이드 전체탭 */

.btn-keyword-group .btn-keyword-recent {
    margin-right: 0.8rem;
    margin-bottom: 0.8rem
}

.btn-keyword-recent {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 3.8rem;
    border-radius: 1.6rem;
    background-color: var(--bg-qua)
}

.btn-keyword-recent .txt {
    max-width: 18.2rem;
    padding-left: 1.4rem;
    font-size: 1.4rem;
    line-height: 3.8rem;
    color: var(--txt-pri);
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis
}

.btn-keyword-recent .ico-pin-off,
.btn-keyword-recent .ico-pin-on {
    width: 3.5rem;
    height: 3.8rem;
    background-size: 1.4rem 1.4rem;
    background-position: 0.8rem center
}

/*! CHPFMTASK-2451에서 요청 사항 .no-animation 글러벌 클래스 - 애니메이션 삭제를 위한 클래스이며 요청에 따라 개발 또는 스크립트에서 toggle로 사용 가능할 수 있음 */

.no-animation {
    -webkit-animation: none !important;
    animation: none !important
}

.bg-accent-pri {
    background-color: var(--bg-accent-pri) !important
}

.color-g100 {
    color: var(--color-g100) !important
}

.component-scroll-x {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    margin-bottom: -0.6rem;
    padding-bottom: 0.6rem
}

.component-scroll-x.component-tab {
    margin-bottom: 0;
    padding: 0
}

.component-scroll-x.scroll-snap {
    -webkit-scroll-snap-type: x mandatory;
    -ms-scroll-snap-type: x mandatory;
    scroll-snap-type: x mandatory;
    overscroll-behavior-x: none;
    -webkit-overflow-scrolling: none
}

.component-scroll-x.scroll-snap .scroll-snap-item {
    scroll-snap-align: start;
    scroll-snap-stop: always
}

.component-scroll-x::-webkit-scrollbar {
    display: none
}

.component-scroll-x>* {
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.keyword-search-chips .btn-chips .close {
    margin-left: 0.4rem
}

.component-text-simple+.component-tab-invest {
    margin-top: 1.9rem
}

.btn-group-invest .btn-view-more .txt,
.btn-group-invest .btn-view-more .txt-ter {
    font-size: 1.5rem;
    line-height: 2rem;
    vertical-align: middle
}

[class*=box-market-index] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    min-width: 6.5rem;
    height: 3.4rem;
    padding: 0.8rem;
    border-radius: 0.8rem;
    white-space: nowrap
}

[class*=box-market-index][class*=-up] {
    background: var(--color-re25);
    color: var(--txt-pri-up)
}

[class*=box-market-index][class*=-down] {
    background: var(--color-bu25);
    color: var(--txt-pri-down)
}

[class*=box-market-index][class*=-flat] {
    background: var(--bg-qua);
    color: var(--txt-sec)
}

[class*=box-market-index].box-block {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: auto;
    padding: 1.6rem 1.4rem;
    white-space: normal
}

[class*=box-market-index].box-block [class*=txt]+[class*=txt] {
    margin-left: 0.3em
}

[class*=box-market-index] [class*=txt] {
    color: inherit
}

.btn-group.ellipsis [class^="btn-"] {
    min-width: 0
}

.btn-group.ellipsis [class^="btn-"] .txt {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    min-width: 0;
    text-align: center;
    white-space: nowrap;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    overflow: hidden
}

/*! 공통 스타일 component element icon */

[class^="ico-"] {
    display: inline-block;
    vertical-align: middle;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain
}

[class^="ico-"].filter-white {
    -webkit-filter: var(--filter-w100);
    filter: var(--filter-w100)
}

[class^="ico-"].filter-g800 {
    -webkit-filter: var(--filter-g800);
    filter: var(--filter-g800)
}

[class^="ico-"].filter-sec {
    -webkit-filter: var(--filter-ico-sec);
    filter: var(--filter-ico-sec)
}

[class^="ico-"].w12 {
    width: 1.2rem;
    height: 1.2rem
}

[class^="ico-"].w14 {
    width: 1.4rem !important;
    height: 1.4rem !important
}

[class^="ico-"].w16 {
    width: 1.6rem;
    height: 1.6rem
}

[class^="ico-"].w18 {
    width: 1.8rem;
    height: 1.8rem
}

[class^="ico-"].w20 {
    width: 2rem !important;
    height: 2rem !important
}

[class^="ico-"].w22 {
    width: 2.2rem !important
}

[class^="ico-"].w24 {
    width: 2.4rem;
    height: 2.4rem
}

[class^="ico-"].w28 {
    width: 2.8rem;
    height: 2.8rem
}

[class^="ico-"].w30 {
    width: 3rem;
    height: 3rem
}

[class^="ico-"].w32 {
    width: 3.2rem;
    height: 3.2rem
}

[class^="ico-"].w34 {
    width: 3.4rem;
    height: 3.4rem
}

[class^="ico-"].w36 {
    width: 3.6rem;
    height: 3.6rem
}

[class^="ico-"].w38 {
    width: 3.8rem;
    height: 3.8rem
}

[class^="ico-"].w40 {
    width: 4rem;
    height: 4rem
}

[class^="ico-"].w42 {
    width: 4.2rem !important;
    height: 4.2rem !important
}

[class^="ico-"].w50 {
    width: 5rem;
    height: 5rem
}

[class^="ico-"].w52 {
    width: 5.2rem !important;
    height: 5.2rem !important
}

[class^="ico-"].w54 {
    width: 5.4rem !important;
    height: 5.4rem !important
}

[class^="ico-"].w56 {
    width: 5.6rem !important;
    height: 5.6rem !important
}

[class^="ico-"].w60 {
    width: 6rem !important;
    height: 6rem !important
}

[class^="ico-"].w64 {
    width: 6.4rem !important;
    height: 6.4rem !important;
    -webkit-box-flex: 0 !important;
    -ms-flex: 0 0 6.4rem !important;
    flex: 0 0 6.4rem !important
}

[class^="ico-"].w72 {
    width: 7.2rem;
    height: 7.2rem
}

[class^="ico-"].w80 {
    width: 8rem;
    height: 8rem
}

[class^="ico-"].w92 {
    width: 9.2rem !important;
    height: 9.2rem !important
}

[class^="ico-"].w100 {
    width: 10rem !important;
    height: 10rem !important;
    -webkit-box-flex: 0 !important;
    -ms-flex: 0 0 10rem !important;
    flex: 0 0 10rem !important
}

[class^="ico-"].w172 {
    width: 17.2rem !important;
    height: 17.2rem !important;
    -webkit-box-flex: 0 !important;
    -ms-flex: 0 0 17.2rem !important;
    flex: 0 0 17.2rem !important
}

[class*="ico"][class*="mask"] {
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-position: center center;
    mask-position: center center;
    -webkit-filter: none;
    filter: none
}

.ico-bg-accent-pri {
    background-color: var(--ico-accent-pri) !important
}

.ico-bg-accent-sec {
    background-color: var(--ico-accent-sec) !important
}

.ico-bg-accent-ter {
    background-color: var(--ico-accent-ter) !important
}

.ico-bg-base {
    background-color: var(--ico-base) !important
}

.ico-bg-cursor {
    background-color: var(--ico-cursor) !important
}

.ico-bg-disabled {
    background-color: var(--ico-disabled) !important
}

.ico-bg-disabled-invert {
    background-color: var(--ico-disabled-invert) !important
}

.ico-bg-highlight {
    background-color: var(--ico-highlight) !important
}

.ico-bg-pri {
    background-color: var(--ico-pri) !important
}

.ico-bg-pri-active {
    background-color: var(--ico-pri-active) !important
}

.ico-bg-pri-down {
    background-color: var(--ico-pri-down) !important
}

.ico-bg-pri-error {
    background-color: var(--ico-pri-error) !important
}

.ico-bg-pri-like {
    background-color: var(--ico-pri-like) !important
}

.ico-bg-pri-invert {
    background-color: var(--ico-pri-invert) !important
}

.ico-bg-pri-mark {
    background-color: var(--ico-pri-mark) !important
}

.ico-bg-pri-neutral {
    background-color: var(--ico-pri-neutral) !important
}

.ico-bg-pri-success {
    background-color: var(--ico-pri-success) !important
}

.ico-bg-pri-up {
    background-color: var(--ico-pri-up) !important
}

.ico-bg-pri-warning {
    background-color: var(--ico-pri-warning) !important
}

.ico-bg-readonly {
    background-color: var(--ico-readonly) !important
}

.ico-bg-sec {
    background-color: var(--ico-sec) !important
}

.ico-bg-sec-active {
    background-color: var(--ico-sec-active) !important
}

.ico-bg-sec-invert {
    background-color: var(--ico-sec-invert) !important
}

.ico-bg-sec-success {
    background-color: var(--ico-sec-success) !important
}

.ico-bg-sec-error {
    background-color: var(--ico-sec-error) !important
}

.ico-bg-ter {
    background-color: var(--ico-ter) !important
}

.ico-bg-ter-active {
    background-color: var(--ico-ter-active) !important
}

.ico-bg-qua {
    background-color: var(--ico-qua) !important
}

.ico-bg-qua-active {
    background-color: var(--ico-qua-active) !important
}

/*! component element icon img 태그 사용 시 */

.ico-img-wrap>img {
    width: 100%
}

/*! component element icon 화살표타입 */

.ico-back {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-chevron-left)
}

.ico-back.white {
    -webkit-filter: var(--filter-w100);
    filter: var(--filter-w100)
}

.ico-arrow-open {
    width: 1.4rem;
    height: 1.4rem;
    background-image: var(--path-line-chevron-down)
}

.ico-arrow-open.g400 {
    -webkit-filter: var(--filter-g400) !important;
    filter: var(--filter-g400) !important
}

.ico-arrow-open.g500 {
    -webkit-filter: var(--filter-g500) !important;
    filter: var(--filter-g500) !important
}

.ico-arrow-open.g700 {
    -webkit-filter: var(--filter-g700) !important;
    filter: var(--filter-g700) !important
}

.ico-arrow-open.g900 {
    -webkit-filter: var(--filter-g900) !important;
    filter: var(--filter-g900) !important
}

.ico-arrow-open.indigo-in700 {
    -webkit-filter: var(--filter-indigo-in700);
    filter: var(--filter-indigo-in700)
}

.ico-arrow-sbl {
    width: 1.4rem;
    height: 1.4rem;
    background-image: var(--path-line-chevron-left)
}

.ico-arrow-link,
.ico-arrow-sbr {
    width: 1.4rem;
    height: 1.4rem;
    background-image: var(--path-line-chevron-right)
}

.ico-arrow-sbr.g500 {
    -webkit-filter: var(--filter-color-grey-g500) !important;
    filter: var(--filter-color-grey-g500) !important
}

.ico-arrow-sbr.g400 {
    -webkit-filter: var(--filter-color-grey-g400) !important;
    filter: var(--filter-color-grey-g400) !important
}

.ico-arrow-sbr.w24,
:root .ico-arrow-link.w24 {
    width: 2.4rem;
    height: 2.4rem
}

:root .ico-arrow-link,
:root .ico-arrow-sbr {
    width: 1.6rem;
    height: 1.6rem
}

.ico-arrow-link.w20 {
    width: 2rem;
    height: 2rem
}

.ico-arrow-link.g100 {
    -webkit-filter: var(--filter-g100) !important;
    filter: var(--filter-g100) !important
}

.ico-arrow-link.g700 {
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

.ico-arrow-link.g400 {
    -webkit-filter: var(--filter-g400) !important;
    filter: var(--filter-g400) !important
}

.ico-arrow-link.white {
    -webkit-filter: var(--filter-w100);
    filter: var(--filter-w100)
}

.ico-arrow-link.pl {
    -webkit-filter: var(--filter-pl);
    filter: var(--filter-pl)
}

.ico-arrow-link.w16 {
    width: 1.6rem !important;
    height: 1.6rem !important
}

.ico-arrow-link.ico-ter {
    -webkit-filter: var(--filter-ico-ter) !important;
    filter: var(--filter-ico-ter) !important
}

.ico-arrow-link.in1100 {
    -webkit-filter: var(--filter-in1100) !important;
    filter: var(--filter-in1100) !important
}

.ico-arrow-sbr.w14 {
    width: 1.4rem;
    height: 1.4rem
}

.ico-arrow-sbr.w24 {
    width: 2.4rem;
    height: 2.4rem
}

.ico-arrow-sbr.ico-ter {
    -webkit-filter: var(--filter-ico-ter) !important;
    filter: var(--filter-ico-ter) !important
}

.open .ico-arrow-open {
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg)
}

.btn-view-more.close .ico-arrow-open {
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg)
}

.ico-arrow-upright {
    width: 2rem;
    height: 2rem;
    background-image: url(../../img/mmk/kds3/ico/line/arrow_up_right_pn.svg)
}

.ico-calc {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-calculator)
}

.ico-arrow-up {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-arrow-up)
}

.ico-arrow-up.solid {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-chevron-up)
}

.ico-arrow-down.solid {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-chevron-down)
}

.ico-arrow-left.solid {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-chevron-left)
}

.ico-arrow-left.bu700 {
    -webkit-filter: var(--filter-bu700);
    filter: var(--filter-bu700)
}

.ico-arrow-right.solid {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-chevron-right)
}

.ico-arrow-right.bu700 {
    -webkit-filter: var(--filter-bu700);
    filter: var(--filter-bu700)
}

.ico-arrow-right.in700 {
    -webkit-filter: var(--filter-in700);
    filter: var(--filter-in700)
}

.ico-arrow-right.w16 {
    width: 1.6rem;
    height: 1.6rem
}

.ico-arrow-right.w12 {
    width: 1.2rem;
    height: 1.2rem
}

.ico-arrow-right.ter {
    -webkit-filter: var(--filter-ico-ter);
    filter: var(--filter-ico-ter)
}

.ico-limit_change.solid {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-switch-vert)
}

.ico-arrow-line-right {
    width: 1.6rem;
    height: 1.6rem;
    background-image: var(--path-line-arrow-right)
}

.ico-arrow-line-right.ter {
    -webkit-filter: var(--filter-ico-ter);
    filter: var(--filter-ico-ter)
}

.ico-arrow-right.line-ter {
    width: 1.2rem;
    height: 1.2rem;
    background-image: url("/resource/img/mmk/common/chevron_right_ter_12.svg")
}

/*! component element icon */

.ico-triangle-up-sample01 {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-triangle-up)
}

.ico-triangle-up-sample01.re700 {
    -webkit-filter: var(--filter-re700);
    filter: var(--filter-re700)
}

.ico-triangle-down-sample01 {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-triangle-down)
}

.ico-triangle-down-sample01.bu600 {
    -webkit-filter: var(--filter-bu600);
    filter: var(--filter-bu600)
}

.ico-triangle-left-sample01 {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-triangle-up);
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg)
}

.ico-triangle-right-sample01 {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-triangle-up);
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg)
}

.ico-triangle-up-solid {
    margin-right: 0;
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-triangle-up)
}

.ico-triangle-up-solid.pri-up {
    -webkit-filter: var(--filter-pri-up);
    filter: var(--filter-pri-up)
}

.ico-triangle-down-solid {
    margin-right: 0;
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-triangle-down)
}

.ico-triangle-down-solid.in700 {
    -webkit-filter: var(--filter-in700);
    filter: var(--filter-in700)
}

.ico-triangle-down-solid.pri-down {
    -webkit-filter: var(--filter-pri-down);
    filter: var(--filter-pri-down)
}

.ico-triangle-up-credit {
    width: 1.3rem;
    height: 1.2rem;
    background-image: url(../../img/mmk/common/ceoreport/sme_credit_re_up.png)
}

.ico-triangle-down-credit {
    width: 1.3rem;
    height: 1.2rem;
    background-image: url(../../img/mmk/common/ceoreport/sme_credit_re_down.png)
}

/*! component element icon 라인타입 */

.ico-close-popup {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-close)
}

.ico-close-popup.white {
    -webkit-filter: var(--filter-w100);
    filter: var(--filter-w100)
}

.ico-close-popup.re700 {
    -webkit-filter: var(--filter-re700);
    filter: var(--filter-re700)
}

.ico-close-popup.w16 {
    width: 1.6rem;
    height: 1.6rem
}

.ico-close {
    width: 1.6rem;
    height: 1.6rem;
    background-image: url("/resource/img/mmk/common/ico_close.png")
}

.ico-delete {
    width: 1.2rem;
    height: 1.2rem;
    background-image: var(--path-line-close);
    -webkit-filter: var(--filter-g500);
    filter: var(--filter-g500)
}

.ico-plus {
    width: 2rem;
    height: 2rem;
    background-image: var(--path-line-add)
}

.ico-plus.ico-ter {
    -webkit-filter: var(--filter-ico-ter) !important;
    filter: var(--filter-ico-ter) !important
}

.ico-minus {
    width: 2rem;
    height: 2rem;
    background-image: var(--path-line-minus)
}

.ico-minus.ico-ter {
    -webkit-filter: var(--filter-ico-ter) !important;
    filter: var(--filter-ico-ter) !important
}

.ico-add {
    position: relative;
    width: 3.4rem;
    height: 3.4rem;
    background-color: var(--color-pn, #17008c);
    border-radius: 50%
}

.ico-add:after {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 2.4rem;
    height: 2.4rem;
    background: var(--path-line-add);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
    -webkit-filter: var(--filter-w100);
    filter: var(--filter-w100)
}

.ico-add.type01 {
    background-color: var(--bg-ter);
    margin-right: 1.2rem
}

.ico-add.type01:after {
    -webkit-filter: var(--filter-ico-ter);
    filter: var(--filter-ico-ter);
    width: 2rem;
    height: 2rem
}

.ico-add-wbk {
    width: 3.4rem;
    height: 3.4rem;
    background-image: url("../../../banking/webresource/img/mmk/wbk/icon_plus.png")
}

.ico-tap {
    width: 1.8rem;
    height: 1.8rem;
    background-image: var(--path-line-drag-handle)
}

.ico-x {
    margin: 0 2px 0 8px;
    width: 1.0rem;
    height: 1.6rem;
    background-image: url("../../img/mmk/svg_common/ico_x.svg")
}

.ico-benefit-share {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-share)
}

.ico-benefit-share.white {
    -webkit-filter: var(--filter-w100);
    filter: var(--filter-w100)
}

.ico-benefit-share.blue {
    -webkit-filter: var(--filter-pn);
    filter: var(--filter-pn)
}

.ico-benefit-heart {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-heart);
    -webkit-animation: heartbeat2 .3s 1 ease-in-out;
    animation: heartbeat2 .3s 1 ease-in-out
}

:root .ico-benefit-heart {
    background-image: var(--path-checkbox-heart)
}

:root .ico-benefit-heart {
    -webkit-filter: var(--filter-g900);
    filter: var(--filter-g900)
}

.ico-calendar {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-calendar)
}

.ico-calendar.solid {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-calendar)
}

.ico-calendar-check {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-calendar-check)
}

.ico-calendar-check.solid {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-calendar-check)
}

.ico-calendar_search {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-calendar-search)
}

.ico-calendar_search.solid {
    background-image: var(--path-solid-calendar-search)
}

.ico-copy {
    width: 2rem;
    height: 2rem;
    background-image: var(--path-line-copy)
}

:root .ico-copy {
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

@-webkit-keyframes heartbeat2 {
    0% {
        -webkit-transform: scale(0.75);
        transform: scale(0.75)
    }
    100% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

@keyframes heartbeat2 {
    0% {
        -webkit-transform: scale(0.75);
        transform: scale(0.75)
    }
    100% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

input:checked+.ico-benefit-heart {
    margin-left: -0.1rem;
    background-image: var(--path-solid-colored-heart-ico-pri-success);
    -webkit-animation: heartbeat .3s 1 ease-in-out;
    animation: heartbeat .3s 1 ease-in-out
}

:root input:checked+.ico-benefit-heart {
    background-image: var(--path-checkbox-heart-active)
}

:root input:checked+.ico-benefit-heart {
    -webkit-filter: none;
    filter: none
}

@-webkit-keyframes heartbeat {
    0% {
        -webkit-transform: scale(0.75);
        transform: scale(0.75)
    }
    100% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

@keyframes heartbeat {
    0% {
        -webkit-transform: scale(0.75);
        transform: scale(0.75)
    }
    100% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

.ico-paper {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-document)
}

.ico-paper.solid {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-document)
}

.ico-star-line {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-star)
}

.ico-heart.g600 {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-colored-heart-ico-ter)
}

.ico-minus-circle2 {
    width: 1.6rem;
    height: 1.6rem;
    background-image: url("../../img/mmk/main/ico_minus_circle2.svg")
}

.ico-menu {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-menu)
}

.ico-menu.solid {
    background-image: var(--path-solid-menu)
}

.ico-minus-circle {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-minus-circle)
}

.ico-minus-circle.solid {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-minus-circle)
}

.ico-minus-circle.re500 {
    -webkit-filter: var(--filter-re500);
    filter: var(--filter-re500)
}

.ico-minus-circle.solid.w16 {
    width: 1.6rem;
    height: 1.6rem
}

.ico-calendar-search {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-calendar-search)
}

.ico-add-s10 {
    width: 1rem;
    height: 1rem;
    background-image: var(--path-line-add-s10)
}

.ico-arrow-down-s10 {
    width: 1rem;
    height: 1rem;
    background-image: var(--path-line-arrow-down-s10)
}

.ico-arrow-left-s10 {
    width: 1rem;
    height: 1rem;
    background-image: var(--path-line-arrow-left-s10)
}

.ico-arrow-right-s10 {
    width: 1rem;
    height: 1rem;
    background-image: var(--path-line-arrow-right-s10)
}

.ico-arrow-up-right-s10 {
    width: 1rem;
    height: 1rem;
    background-image: var(--path-line-arrow-up-right-s10)
}

.ico-arrow-up-s10 {
    width: 1rem;
    height: 1rem;
    background-image: var(--path-line-arrow-up-s10)
}

.ico-check-s10 {
    width: 1rem;
    height: 1rem;
    background-image: var(--path-line-check-s10)
}

.ico-chevron-down-s10 {
    width: 1rem;
    height: 1rem;
    background-image: var(--path-line-chevron-down-s10)
}

.ico-chevron-left-s10 {
    width: 1rem;
    height: 1rem;
    background-image: var(--path-line-chevron-left-s10)
}

.ico-chevron-right-s10 {
    width: 1rem;
    height: 1rem;
    background-image: var(--path-line-chevron-right-s10)
}

.ico-chevron-up-s10 {
    width: 1rem;
    height: 1rem;
    background-image: var(--path-line-chevron-up-s10)
}

.ico-close-s10 {
    width: 1rem;
    height: 1rem;
    background-image: var(--path-line-close-s10)
}

.ico-drag-handle-s10 {
    width: 1rem;
    height: 1rem;
    background-image: var(--path-line-drag-handle-s10)
}

.ico-minus-s10 {
    width: 1rem;
    height: 1rem;
    background-image: var(--path-line-minus-s10)
}

/*!
 * component element
 * icon
 * 기타아이콘
*/

.ico-search {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-search)
}

.ico-search.solid {
    background-image: var(--path-solid-search)
}

.ico-search-input {
    width: 2rem;
    height: 2rem;
    background-image: var(--path-line-search);
    -webkit-filter: var(--filter-g500);
    filter: var(--filter-g500)
}

.ico-search-input.g600 {
    -webkit-filter: var(--filter-g600);
    filter: var(--filter-g600)
}

:root .ico-search-input {
    -webkit-filter: var(--filter-g900);
    filter: var(--filter-g900)
}

.ico-search-list {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-search)
}

.ico-search-solid {
    width: 1.6rem;
    height: 1.6rem;
    background-image: var(--path-solid-search)
}

.ico-search-solid.g700 {
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

.ico-refresh {
    width: 1.6rem;
    height: 1.6rem;
    background-image: var(--path-line-refresh)
}

.ico-refresh.w24 {
    width: 2.4rem;
    height: 2.4rem
}

.ico-refresh.g700 {
    -webkit-filter: var(--filter-ico-sec);
    filter: var(--filter-ico-sec)
}

.ico-refresh.g500 {
    -webkit-filter: var(--filter-g500);
    filter: var(--filter-g500)
}

.ico-refresh.touch-area {
    width: 2.1rem;
    height: 2.1rem;
    background-size: 1.6rem;
    background-position: 0 0.3rem
}

.ico-edit {
    width: 1.6rem;
    height: 1.6rem;
    background-image: var(--path-solid-edit)
}

.ico-edit.ter {
    -webkit-filter: var(--filter-ico-ter);
    filter: var(--filter-ico-ter)
}

.ico-edit.w14 {
    width: 1.4rem;
    height: 1.4rem
}

.ico-edit.ty1 {
    opacity: .6
}

.ico-view {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-show)
}

.ico-view.solid {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-show)
}

.ico-help {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-question-circle);
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

.ico-help.warning {
    -webkit-filter: var(--filter-re700);
    filter: var(--filter-re700)
}

:root .ico-help.warning {
    -webkit-filter: var(--filter-re700);
    filter: var(--filter-re700)
}

.ico-help.solid {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-question-circle);
    -webkit-filter: none;
    filter: none
}

.ico-help.black {
    width: 1.7rem;
    height: 1.7rem;
    vertical-align: -0.3rem;
    -webkit-filter: none;
    filter: none
}

.ico-help.ter {
    -webkit-filter: var(--filter-ico-ter);
    filter: var(--filter-ico-ter)
}

.ico-help.ico-ter {
    -webkit-filter: var(--filter-ico-ter);
    filter: var(--filter-ico-ter)
}

.ico-help2 {
    width: 1.7rem;
    height: 1.7rem;
    background-image: var(--path-line-question-circle)
}

.darkgray2 .ico-help2,
.ico-help2.darkgray2 {
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

.ico-help3 {
    width: 1.8rem;
    height: 1.8rem;
    background-image: var(--path-solid-question-circle);
    -webkit-filter: var(--filter-g500);
    filter: var(--filter-g500)
}

.ico-help3.g600 {
    -webkit-filter: var(--filter-g600);
    filter: var(--filter-g600)
}

.ico-help.re700 {
    -webkit-filter: var(--filter-re700);
    filter: var(--filter-re700)
}

.ico-help.g700 {
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

.ico-help.g900 {
    -webkit-filter: var(--filter-g900);
    filter: var(--filter-g900)
}

.ico-help.g500 {
    -webkit-filter: var(--filter-g500);
    filter: var(--filter-g500)
}

.ico-help.pn {
    -webkit-filter: var(--filter-pn);
    filter: var(--filter-pn)
}

.ico-help.w18 {
    width: 1.8rem;
    height: 1.8rem
}

.ico-help.w16 {
    width: 1.6rem;
    height: 1.6rem
}

.ico-cs {
    width: 1.8rem;
    height: 1.8rem;
    background-image: url("../../img/mmk/common/ico_cs.png")
}

.ico-won {
    width: 2.2rem;
    height: 2.2rem;
    border-radius: 50%;
    background-image: url("../../img/mmk/common/ico_money.svg")
}

.ico-percent {
    width: 2.2rem;
    height: 2.2rem;
    border-radius: 50%;
    background-image: url("../../img/mmk/common/ico_percentage.svg")
}

.ico-info {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-info-circle);
    -webkit-filter: var(--filter-g600);
    filter: var(--filter-g600)
}

.ico-info.solid {
    background-image: var(--path-solid-info-circle)
}

.ico-info.g500.w20 {
    width: 2rem;
    height: 2rem;
    -webkit-filter: var(--filter-color-grey-g500);
    filter: var(--filter-color-grey-g500)
}

:root .ico-info {
    -webkit-filter: var(--filter-g900);
    filter: var(--filter-g900)
}

.ico-info.bu600 {
    -webkit-filter: var(--filter-bu600);
    filter: var(--filter-bu600)
}

.ico-info.black {
    -webkit-filter: none;
    filter: none
}

.ico-delete-keypad {
    width: 3.2rem;
    height: 3.2rem;
    background-image: var(--path-line-arrow-left);
    -webkit-filter: var(--filter-pb100);
    filter: var(--filter-pb100)
}

.ico-delete-input {
    width: 2rem;
    height: 2rem;
    background-image: var(--path-solid-close-circle);
    -webkit-filter: var(--filter-g500);
    filter: var(--filter-g500)
}

.ico-delete-input.re700 {
    width: 1.8rem;
    height: 1.8rem;
    -webkit-filter: var(--filter-re700);
    filter: var(--filter-re700)
}

.ico-home {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-home)
}

.ico-more-dot {
    width: 3rem;
    height: 3rem;
    background-image: var(--path-line-more-vert);
    -webkit-filter: var(--filter-g600);
    filter: var(--filter-g600);
    background-position: -.1rem .2rem
}

:root .ico-more-dot {
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

.ico-quickMore-dot {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-more-vert);
    -webkit-filter: var(--filter-g800);
    filter: var(--filter-g800)
}

.ico-file {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-clip);
    -webkit-filter: var(--filter-g500);
    filter: var(--filter-g500)
}

.ico-nodata {
    width: 13rem;
    height: 13rem;
    background-image: url("../../img/mmk/common/ico_nodata.png")
}

.ico-nodata-01 {
    width: 10rem;
    height: 10rem;
    background-image: url("../../img/mmk/common/ico_nodata_01.png")
}

.ico-nodata.w60 {
    width: 6rem;
    height: 6rem
}

.ico-nodata.w98 {
    width: 9.8rem;
    height: 9.8rem
}

.ico-loan-result {
    width: 6rem;
    height: 6rem;
    background-image: url("../../img/mmk/common/ico_loan_result.png")
}

.ico-download {
    width: 2rem;
    height: 2rem;
    background-image: var(--path-line-download)
}

.ico-download.type1 {
    -webkit-filter: var(--filter-g500);
    filter: var(--filter-g500)
}

.ico-reject {
    width: 13rem;
    height: 13rem;
    background-image: url("../../img/mmk/common/ico_reject.png")
}

.ico-reject.w50 {
    width: 5rem;
    height: 5rem
}

.ico-caution {
    width: 5rem;
    height: 5rem;
    background-image: url("../../img/mmk/common/ico_caution.png")
}

.ico-mark1 {
    width: 10rem;
    height: 10rem;
    background-image: url("../../img/mmk/common/ico_mark1.png")
}

.ico-mark2 {
    width: 10rem;
    height: 10rem;
    background-image: url("../../img/mmk/common/ico_mark2.png")
}

.ico-star {
    width: 3.6rem;
    height: 4rem;
    background-image: url("../../img/mmk/common/ico_star.png")
}

.ico-complete {
    width: 6.4rem;
    height: 6.4rem;
    background-image: var(--path-solid-check);
    -webkit-filter: var(--filter-pl);
    filter: var(--filter-pl)
}

.ico-complete01 {
    width: 1.8rem;
    height: 1.8rem;
    background-image: var(--path-solid-colored-check-ico-pri-invert)
}

.ico-complete01 {
    width: 1.8rem;
    height: 1.8rem;
    background-image: var(--path-solid-check)
}

.ico-complete01.w16 {
    width: 1.6rem;
    height: 1.6rem
}

.ico-complete01.bu800 {
    background-image: var(--path-solid-colored-check-ico-sec-active)
}

.ico-complete01.g300 {
    background-image: var(--path-solid-colored-check-ico-ter)
}

.ico-complete01.g500 {
    background-image: var(--path-solid-colored-check-ico-ter-active)
}

.ico-complete01.lm500 {
    background-image: var(--path-solid-colored-check-ico-pri-success)
}

.ico-complete01.pl {
    background-image: var(--path-solid-colored-check-ico-sec-active)
}

.ico-complete01.pn {
    background-image: var(--path-checkbox-line-active)
}

.ico-complete01.re700 {
    background-image: var(--path-solid-colored-check-ico-pri-error)
}

.ico-complete01.w100 {
    background-image: var(--path-solid-colored-check-ico-pri-invert)
}

.ico-check-w {
    width: 1.6rem;
    height: 1.6rem;
    background-image: url("../../img/mmk/kds3/ico/solid/check_w.svg")
}

.ico-plus2 {
    width: 1.6rem;
    height: 1.6rem;
    background-image: url("../../img/mmk/kds3/ico/solid/plus.svg")
}

.ico-complete-agree {
    width: 10rem;
    height: 10rem;
    background-image: url("../../img/mmk/common/ico_complete_agree.png")
}

.ico-logo-app-update {
    width: 7.2rem;
    height: 7.2rem;
    background-image: url("../../img/mmk/common/ico_logo_app_update.png")
}

.ico-complete-animation {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 6.8rem;
    height: 6.8rem
}

.ico-complete-animation:before {
    display: block;
    content: '';
    position: absolute;
    top: 2.5rem;
    left: 0.2rem;
    border-right: 0.8rem solid transparent;
    border-bottom: 0.8rem solid transparent;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transform-origin: 0 100%;
    -ms-transform-origin: 0 100%;
    transform-origin: 0 100%;
    -webkit-animation: checkbox-check 0.5s 1s cubic-bezier(0.4, 0, 0.23, 1) forwards;
    animation: checkbox-check 0.5s 1s cubic-bezier(0.4, 0, 0.23, 1) forwards;
    -webkit-box-sizing: unset;
    box-sizing: unset
}

.ico-empty-card {
    width: 3.2rem;
    height: 3.2rem;
    background-image: url("../../img/mmk/common/traffic_card/empty_card.svg")
}

@-webkit-keyframes checkbox-check {
    0% {
        width: 0;
        height: 0;
        border-color: var(--color-pl, #b6f23d);
        -webkit-transform: translate3d(0, 0, 0) rotate(45deg);
        transform: translate3d(0, 0, 0) rotate(45deg)
    }
    33% {
        width: 2.7rem;
        height: 0;
        -webkit-transform: translate3d(0, 0, 0) rotate(45deg);
        transform: translate3d(0, 0, 0) rotate(45deg)
    }
    100% {
        width: 2.7rem;
        height: 4.7rem;
        border-color: var(--color-pl, #b6f23d);
        -webkit-transform: translate3d(0, -4.7rem, 0) rotate(45deg);
        transform: translate3d(0, -4.7rem, 0) rotate(45deg)
    }
}

@keyframes checkbox-check {
    0% {
        width: 0;
        height: 0;
        border-color: var(--color-pl, #b6f23d);
        -webkit-transform: translate3d(0, 0, 0) rotate(45deg);
        transform: translate3d(0, 0, 0) rotate(45deg)
    }
    33% {
        width: 2.7rem;
        height: 0;
        -webkit-transform: translate3d(0, 0, 0) rotate(45deg);
        transform: translate3d(0, 0, 0) rotate(45deg)
    }
    100% {
        width: 2.7rem;
        height: 4.7rem;
        border-color: var(--color-pl, #b6f23d);
        -webkit-transform: translate3d(0, -4.7rem, 0) rotate(45deg);
        transform: translate3d(0, -4.7rem, 0) rotate(45deg)
    }
}

.ico-complete-file {
    width: 12rem;
    height: 12rem;
    background-image: url("../../img/mmk/common/my_security_check.png")
}

.ico-fail {
    width: 6.4rem;
    height: 6.4rem;
    background-image: var(--path-solid-exclamation);
    -webkit-filter: var(--filter-pl);
    filter: var(--filter-pl)
}

.ico-sec-success {
    -webkit-filter: var(--filter-gn400);
    filter: var(--filter-gn400)
}

.ico-sec-error {
    -webkit-filter: var(--filter-re500);
    filter: var(--filter-re500)
}

.ico-account-inquiry.big {
    width: 6.4rem;
    height: 6.4rem;
    background-image: var(--path-solid-account-search);
    -webkit-filter: var(--filter-pl);
    filter: var(--filter-pl)
}

.ico-connectiong {
    position: relative;
    left: 2rem;
    width: 1rem;
    height: 1rem;
    margin: 2.9rem 0;
    background-color: var(--color-pl, #b6f23d);
    color: var(--color-pl, #b6f23d);
    -webkit-animation: connecting 1s infinite linear alternate;
    animation: connecting 1s infinite linear alternate;
    -webkit-animation-delay: .5s;
    animation-delay: .5s
}

.ico-invite {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-user-invite)
}

:root .ico-connectiong {
    background-color: var(--color-pl, #4262ff);
    color: var(--color-pl, #4262ff);
    -webkit-animation: connecting-a11y 1s infinite linear alternate;
    animation: connecting-a11y 1s infinite linear alternate;
    -webkit-animation-delay: .5s;
    animation-delay: .5s
}

.ico-connectiong:after,
.ico-connectiong:before {
    content: '';
    display: inline-block;
    position: absolute;
    top: 0
}

.ico-connectiong:before {
    left: -2rem;
    width: 1rem;
    height: 1rem;
    background-color: var(--color-pl, #b6f23d);
    color: var(--color-pl, #b6f23d);
    -webkit-animation: connecting 1s infinite alternate;
    animation: connecting 1s infinite alternate;
    -webkit-animation-delay: 0s;
    animation-delay: 0s
}

:root .ico-connectiong:before {
    background-color: var(--color-in100, #d2d9fe);
    color: var(--color-in100, #d2d9fe);
    -webkit-animation: connecting-a11y 1s infinite alternate;
    animation: connecting-a11y 1s infinite alternate;
    -webkit-animation-delay: 0s;
    animation-delay: 0s
}

.ico-connectiong:after {
    left: 2rem;
    width: 1rem;
    height: 1rem;
    background-color: var(--color-pl, #b6f23d);
    color: var(--color-pl, #b6f23d);
    -webkit-animation: connecting 1s infinite alternate;
    animation: connecting 1s infinite alternate;
    -webkit-animation-delay: 1s;
    animation-delay: 1s
}

:root .ico-connectiong:after {
    background-color: var(--color-pl, #4262ff);
    color: var(--color-pl, #4262ff);
    -webkit-animation: connecting-a11y 1s infinite alternate;
    animation: connecting-a11y 1s infinite alternate;
    -webkit-animation-delay: 1s;
    animation-delay: 1s
}

.ico-drag-handle {
    margin-right: 0;
    width: 2.4rem;
    height: 2.4rem;
    background: url("../../img/mmk/kds4/ico/line/drag_handle.svg") no-repeat center;
    background-size: contain
}

.ico-connectiong.type2,
.ico-connectiong.type2::after,
.ico-connectiong.type2::before {
    border-radius: 50%
}

.ico-connectiong.type3,
.ico-connectiong.type3::after,
.ico-connectiong.type3::before {
    border-radius: 50%;
    width: 0.3rem;
    height: 0.3rem
}

.ico-connectiong.type4,
.ico-connectiong.type4::after,
.ico-connectiong.type4::before {
    border-radius: 0.1rem;
    width: 0.3rem;
    height: 0.3rem
}

.ico-connectiong {}

.ico-connectiong.type3 {
    left: 0;
    margin: 0
}

.ico-connectiong.type3::after {
    left: 0.5rem
}

.ico-connectiong.type3::before {
    left: -0.5rem
}

.ico-connectiong.type4,
.ico-connectiong.type4::after,
.ico-connectiong.type4::before {
    background-color: var(--color-g500);
    -webkit-animation: connecting-type4 .6s infinite alternate;
    animation: connecting-type4 .6s infinite alternate
}

.ico-connectiong.type4 {
    left: 0;
    margin: 0;
    -webkit-animation-delay: 0s;
    animation-delay: 0s
}

.ico-connectiong.type4::before {
    left: 0.7rem;
    -webkit-animation-delay: .3s;
    animation-delay: .3s
}

.ico-connectiong.type4::after {
    left: 1.4rem;
    -webkit-animation-delay: .6s;
    animation-delay: .6s
}

@-webkit-keyframes connecting {
    0% {
        background-color: var(--color-pl, #b6f23d)
    }
    100%,
    50% {
        background-color: var(--color-lm50, #dbfc6e)
    }
}

@keyframes connecting {
    0% {
        background-color: var(--color-pl, #b6f23d)
    }
    100%,
    50% {
        background-color: var(--color-lm50, #dbfc6e)
    }
}

@-webkit-keyframes connecting-a11y {
    0% {
        background-color: var(--color-in100, #d2d9fe)
    }
    100%,
    50% {
        background-color: var(--color-pl, #4262ff)
    }
}

@keyframes connecting-a11y {
    0% {
        background-color: var(--color-in100, #d2d9fe)
    }
    100%,
    50% {
        background-color: var(--color-pl, #4262ff)
    }
}

@-webkit-keyframes connecting-type4 {
    0% {
        background-color: var(--color-g500)
    }
    50% {
        background-color: var(--color-g400)
    }
    100% {
        background-color: var(--color-g300)
    }
}

@keyframes connecting-type4 {
    0% {
        background-color: var(--color-g500)
    }
    50% {
        background-color: var(--color-g400)
    }
    100% {
        background-color: var(--color-g300)
    }
}

.ico-list-pressed {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-check-ico-pri-success)
}

.ico-check-line {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-check)
}

.ico-check-line.bu700 {
    -webkit-filter: var(--filter-bu700);
    filter: var(--filter-bu700)
}

.ico-warning {
    width: 1.8rem;
    height: 1.8rem;
    background-image: var(--path-line-exclamation-circle)
}

.ico-warning.solid {
    background-image: var(--path-solid-exclamation-circle)
}

.ico-warning.g500 {
    -webkit-filter: var(--filter-g500) !important;
    filter: var(--filter-g500) !important
}

.ico-warning.g600 {
    -webkit-filter: var(--filter-g600);
    filter: var(--filter-g600)
}

.ico-warning.g700 {
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

.ico-warning.g800 {
    -webkit-filter: var(--filter-g800);
    filter: var(--filter-g800)
}

.ico-warning.re700 {
    -webkit-filter: var(--filter-re700);
    filter: var(--filter-re700)
}

.ico-warning.re700.border {
    background-image: url("../../img/mmk/kds3/ico/solid/exclamation_mark_re700_border.svg");
    -webkit-filter: none;
    filter: none
}

.ico-warning.white {
    -webkit-filter: var(--filter-w100);
    filter: var(--filter-w100)
}

.ico-warning.disabled {
    -webkit-filter: var(--filter-ico-disabled) !important;
    filter: var(--filter-ico-disabled) !important
}

.ico-warning.pn {
    -webkit-filter: var(--filter-pn);
    filter: var(--filter-pn)
}

.ico-warning.w16 {
    width: 1.6rem;
    height: 1.6rem
}

.ico-warning.w24 {
    width: 2.4rem;
    height: 2.4rem
}

.ico-warning.w20 {
    width: 2rem;
    height: 2rem
}

.ico-warning.w64 {
    width: 6.4rem;
    height: 6.4rem
}

.ico-naver {
    width: 1.2rem;
    height: 1.2rem;
    margin-right: 1rem;
    background-color: var(--color-w100, #fff)
}

.ico-logo-naver {
    width: 4.4rem;
    height: 4.4rem;
    background-image: url("../../img/mmk/common/ico_lo_naver.png")
}

.ico-logo-pass {
    width: 4.4rem;
    height: 4.4rem;
    background-image: url("../../img/mmk/common/ico_lo_pass.png")
}

.ico-my-tax-bulb1 {
    width: 6rem;
    height: 6rem;
    background-image: url("/resource/img/bim/my_tax_bulb_1.png")
}

.ico-my-tax-bulb2 {
    width: 6.4rem;
    height: 6.4rem;
    background-image: url("/resource/img/bim/my_tax_bulb_2.png")
}

.ico-my-tax1 {
    width: 5rem;
    height: 5rem;
    background-image: url("/resource/img/bim/my_tax_1.png")
}

.ico-my-caution {
    width: 2.8rem;
    height: 2.8rem;
    background-image: url("/resource/img/bim/my_caution.png")
}

.ico-my-caution.w120 {
    width: 12rem;
    height: 12rem
}

.ico-my-krw50000-hand1 {
    width: 3.2rem;
    height: 3.2rem;
    background-image: url("/resource/img/bim/my_krw50000_hand_1.png")
}

.ico-my-account3 {
    width: 3.2rem;
    height: 3.2rem;
    background-image: url("/resource/img/bim/my_account_3.png")
}

.ico-my-apt {
    width: 3.2rem;
    height: 3.2rem;
    background-image: url("/resource/img/bim/my_apt.png")
}

.ico-my-apt.w52 {
    width: 5.2rem;
    height: 5.2rem
}

.ico-my-feed-noti1 {
    width: 6rem;
    height: 6rem;
    background-image: url("/resource/img/bim/my_feed_noti_1.png")
}

.ico-my-tablet-blank {
    width: 6rem;
    height: 6rem;
    background-image: url("/resource/img/bim/my_tablet_blank.png")
}

.ico-my-loan-check {
    width: 6rem;
    height: 6rem;
    background-image: url("/resource/img/bim/my_loan_check.png")
}

.ico-my-loan-check.w64 {
    width: 6.4rem;
    height: 6.4rem
}

.ico-clock {
    width: 2rem;
    height: 2rem;
    background-image: var(--path-line-clock)
}

.ico-clock.readonly {
    -webkit-filter: var(--filter-ico-readonly);
    filter: var(--filter-ico-readonly)
}

.ico-clock.disabled {
    -webkit-filter: var(--filter-ico-disabled);
    filter: var(--filter-ico-disabled)
}

.ico-clock.solid {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-clock)
}

.ico-clock.bold {
    margin-right: 0.4rem;
    width: 1.8rem;
    height: 1.8rem;
    background-image: url("../../img/mmk/kds3/ico/line/circle_time_bold.svg")
}

.ico-clock02 {
    width: 10.0rem;
    height: 10.0rem;
    background-image: url("/resource/img/mmk/common/ico_clock_02.png")
}

.ico-clock02.w90 {
    width: 9rem;
    height: 9rem
}

.ico-clock03 {
    width: 3.6rem;
    height: 3.6rem;
    background-image: url("/resource/img/mmk/common/ico_clock_03.svg")
}

.ico-my-clock-02 {
    width: 7rem;
    height: 7rem;
    background-image: url("/resource/img/bim/my_clock_2.png")
}

.ico-my-chat-heart03 {
    width: 6.4rem;
    height: 6.4rem;
    background-image: url("/resource/img/bim/my_chat_heart_3.png")
}

.ico-my-hand-phone {
    width: 7rem;
    height: 7rem;
    background-image: url("/resource/img/bim/my_hand_phone.png")
}

.ico-phone,
.ico-telephone {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-call)
}

.ico-phone {
    -webkit-filter: var(--filter-pn);
    filter: var(--filter-pn)
}

.ico-telephone.reverse {
    width: 2rem;
    height: 2rem
}

.ico-telephone-line {
    width: 2rem;
    height: 2rem;
    background-image: var(--path-line-call)
}

.ico-homepage {
    width: 1.8rem;
    height: 2rem;
    background-image: url("../../img/mmk/common/ico_homepage.png")
}

.ico-delete-post,
.ico-delete-tresh {
    width: 2rem;
    height: 2rem;
    background-image: var(--path-line-del);
    -webkit-filter: var(--filter-g600);
    filter: var(--filter-g600)
}

.ico-loan-apt {
    width: 4.6rem;
    height: 4.8rem;
    background-image: url("../../img/mmk/common/ico_loan_apt.png")
}

.ico-house-01 {
    width: 2rem;
    height: 2rem;
    background-image: var(--path-solid-building)
}

.ico-house-01.lm500 {
    -webkit-filter: var(--filter-lm500);
    filter: var(--filter-lm500)
}

.ico-house-01.g500 {
    -webkit-filter: var(--filter-g500);
    filter: var(--filter-g500)
}

.ico-house-02 {
    width: 2rem;
    height: 2rem;
    background-image: var(--path-line-building-double-cancel)
}

.ico-house-03 {
    width: 2rem;
    height: 2rem;
    background-image: var(--path-line-building-double-down)
}

.ico-sort {
    width: 2rem;
    height: 2rem;
    background-image: var(--path-line-filter)
}

.ico-rate {
    width: 2rem;
    height: 2rem;
    background-image: var(--path-line-switch-vert)
}

.ico-rate.ico-ter {
    -webkit-filter: var(--filter-ico-ter);
    filter: var(--filter-ico-ter)
}

.ico-cert-01 {
    width: 6rem;
    height: 8rem;
    background-image: url("../../img/mmk/common/ico_cert_authentication01.png")
}

.ico-cert-02 {
    width: 6rem;
    height: 8rem;
    background-image: url("../../img/mmk/common/ico_cert_authentication02.png")
}

.ico-cert-03 {
    width: 6rem;
    height: 8rem;
    background-image: url("../../img/mmk/common/ico_cert_authentication03.png")
}

.ico-cert-04 {
    width: 6rem;
    height: 8rem;
    background-image: url("../../img/mmk/common/ico_cert_authentication04.png")
}

.ico-cert-04.w48 {
    width: 4.8rem;
    height: 4.8rem
}

.ico-cert-05 {
    width: 6rem;
    height: 8rem;
    background-image: url("../../img/mmk/common/ico_cert_finance_auc.png")
}

.ico-cert-06 {
    width: 6rem;
    height: 8rem;
    background-image: url("../../img/mmk/common/ico_cert_bankid.png")
}

.ico-cert-07 {
    width: 6rem;
    height: 8rem;
    background-image: url("../../img/mmk/common/ico_cert_kt_auc.png")
}

.ico-cert-08 {
    width: 6rem;
    height: 8rem;
    background-image: url("../../img/mmk/common/ico_cert_ubikey.png")
}

.ico-cert-09 {
    width: 6rem;
    height: 8rem;
    background-image: url("../../img/mmk/common/ico_cert_olleh.png")
}

.ico-cert-10 {
    width: 6rem;
    height: 8rem;
    background-image: url("../../img/mmk/common/ico_cert_elec_tax.png")
}

.ico-cert-11 {
    width: 6rem;
    height: 8rem;
    background-image: url("../../img/mmk/common/ico_cert_expired.svg")
}

.ico-document {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-document)
}

.ico-bill,
.ico-file2 {
    width: 3.2rem;
    height: 3.2rem;
    background-image: var(--path-line-document)
}

.ico-cert-face,
.ui-lottie.ico-cert-face {
    width: 18.2rem;
    height: 18.2rem
}

.ico-cert-face.ing {
    width: 18.2rem;
    height: 18.2rem;
    background-image: url("../../img/mmk/common/cert/face-onboarding-loading.gif")
}

.ico-desktop {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-desktop)
}

.ico-pc-cert {
    width: 3.2rem;
    height: 3.2rem;
    background-image: var(--path-line-desktop)
}

.ico-useguide {
    width: 3.2rem;
    height: 3.2rem;
    background-image: var(--path-line-info-circle)
}

.ico-kbank {
    width: 5rem;
    height: 1.2rem;
    background-image: url("../../img/mmk/common/ico_kbank.png")
}

.ico-kbank-navy {
    width: 5rem;
    height: 1.2rem;
    background-image: url("../../img/mmk/common/ico_kbank_navy.png");
    -webkit-filter: var(--filter-pn);
    filter: var(--filter-pn)
}

.ico-kbank-gray {
    width: 5rem;
    height: 1.2rem;
    background-image: url("../../img/mmk/common/ico_kbank_gray.png")
}

.ico-kbank-gray.size01 {
    width: 8rem;
    height: 2.5rem
}

.ico-qr_code {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-qr-code)
}

.ico-pay {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-qr-code);
    -webkit-filter: var(--filter-w100);
    filter: var(--filter-w100)
}

.ico-pin-search {
    width: 2rem;
    height: 2rem;
    background-image: url("../../img/mmk/common/ico_pin_search.png")
}

.ico-transfer {
    width: 1.4rem;
    height: 1.4rem;
    background-image: var(--path-solid-chevron-right);
    -webkit-filter: var(--filter-lm500);
    filter: var(--filter-lm500)
}

.ui-lottie.ico-mycredit-loading-paper {
    height: 7rem;
    width: 100%;
    margin-top: 16.5rem
}

.ui-lottie.ico-mycredit-loading-paper.ty01 {
    height: 6.4rem;
    margin-top: 0
}

:root .ico-transfer {
    -webkit-filter: var(--filter-pl);
    filter: var(--filter-pl)
}

.ico-transfer-animation {
    width: 5rem;
    height: 3rem;
    background-image: url("../../img/mmk/common/ico_remit_loadingarrow_ani_new1.png")
}

.ico-loading {
    width: 2rem;
    height: 2rem;
    background-image: url("../../img/mmk/common/ico_remit_loadingdot.png")
}

.ico-lock {
    width: 6.4rem;
    height: 6.4rem;
    background-image: url("../../img/mmk/common/ico_prd_lock.png")
}

.ico-lock02 {
    width: 2.4rem;
    height: 2.4rem;
    background-image: url("../../img/mmk/common/traffic_card/lock.svg")
}

.ico-share-msg {
    width: 3.4rem;
    height: 3.4rem;
    background-color: var(--color-g200, #eee);
    background-image: url("../../img/mmk/svg_common/ico_shareothers.svg");
    border-radius: 99rem
}

.ico-share-msg.ico_kakao {
    border-radius: 99rem;
    background-image: url("../../img/mmk/common/ico_kakaotalk.svg");
    background-size: cover
}

.ico-kakao {
    width: 100%;
    height: 100%;
    border-radius: 99rem;
    background-image: url("../../img/mmk/common/ico_kakaotalk.svg")
}

.ico-kakao.w44 {
    width: 4.4rem;
    height: 4.4rem
}

.ico-like {
    width: 100%;
    height: 100%;
    background-image: url("../../img/mmk/common/ico_thumb_solid_white.png")
}

.ico-edit-view-on {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-show)
}

.ico-edit-view-off {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-hide)
}

.ico-edit-view-disabled {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-show);
    -webkit-filter: var(--filter-g500);
    filter: var(--filter-g500)
}

.ico-edit-list-on {
    width: 2.4rem;
    height: 2.4rem;
    background-image: url("../../img/mmk/kds4/ico/line/drag_handle.svg")
}

.ico-edit-list-off {
    width: 2.4rem;
    height: 2.4rem;
    background-image: url("../../img/mmk/kds4/ico/line/drag_handle.svg");
    -webkit-filter: var(--filter-g500);
    filter: var(--filter-g500)
}

:root .ico-edit-view-on {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-show)
}

:root .ico-edit-view-off {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-hide)
}

:root .ico-edit-view-off.solid {
    background-image: var(--path-solid-hide)
}

:root .ico-edit-view-disabled {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-hide);
    -webkit-filter: none;
    filter: none
}

.ico-write {
    width: 1.8rem;
    height: 1.8rem;
    background-image: url("../../img/mmk/home/icon_write.svg")
}

.ico-write.g600 {
    -webkit-filter: var(--filter-color-grey-g600);
    filter: var(--filter-color-grey-g600)
}

.ico-write.w24 {
    width: 2.4rem !important
}

.ico-location {
    width: 1.6rem;
    height: 1.6rem;
    background-image: url("../../img/mmk/home/icon_location.svg")
}

.ico-allmenu-security {
    width: 2.1rem;
    height: 2.1rem;
    background-image: url("../../img/mmk/common/ic_allmenu_security.svg")
}

.ico-set {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-setting)
}

.ico-alarm {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-alarm)
}

.ico-alarm.solid {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-alarm)
}

.ico-alarm.solid.in1100 {
    -webkit-filter: var(--filter-in1100);
    filter: var(--filter-in1100)
}

.ico-alarm.solid.white {
    -webkit-filter: brightness(0) invert(1);
    filter: brightness(0) invert(1)
}

.ico-alarm.solid.sf200 {
    -webkit-filter: var(--filter-sf200);
    filter: var(--filter-sf200)
}

.ico-set.white {
    -webkit-filter: brightness(0) invert(1);
    filter: brightness(0) invert(1)
}

.ico-alarm.white {
    -webkit-filter: brightness(0) invert(1);
    filter: brightness(0) invert(1)
}

.ico-speaker {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-notice)
}

.ico-speaker.accent {
    -webkit-filter: var(--filter-indigo-in700);
    filter: var(--filter-indigo-in700)
}

.ico-speaker.w64 {
    width: 6.4rem;
    height: 6.4rem
}

.ico-speaker-black {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-notice)
}

.ico-speaker-gray {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-notice);
    -webkit-filter: var(--filter-g500);
    filter: var(--filter-g500)
}

.ico-camera {
    width: 2rem;
    height: 2rem;
    background-image: url("../../img/mmk/svg_common/ico_camera.svg")
}

.alarm-noti.type1 {
    position: absolute;
    top: 0.8rem;
    right: 0.8rem;
    width: auto;
    height: auto;
    padding: 0.4rem;
    background-color: var(--bg-pri-mark);
    border-radius: 99rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-size: 0.9rem;
    color: var(--txt-pri-invert);
    line-height: 0.6rem;
    font-weight: 700
}

.ico-siren {
    width: 8rem;
    height: 8rem;
    background-image: url("../../img/mmk/common/ico_siren.png")
}

.ico-my-overseas5 {
    width: 20rem;
    height: 20rem;
    background-image: url("../../img/mmk/common/my_overseas_5.png")
}

.ico-dsr-main {
    width: 19.6rem;
    height: 18rem;
    background-image: url("../../img/mmk/common/dsr_main_img-1.png")
}

.ico-dsr-main-list1 {
    display: block;
    min-width: 4.4rem;
    height: 4.4rem;
    background-image: url("../../img/mmk/common/dsr_main_list_1.png")
}

.ico-dsr-main-list2 {
    display: block;
    min-width: 4.4rem;
    height: 4.4rem;
    background-image: url("../../img/mmk/common/dsr_main_list_2.png")
}

.ico-dsr-main-list3 {
    display: block;
    min-width: 4.4rem;
    height: 4.4rem;
    background-image: url("../../img/mmk/common/dsr_main_list_3.png")
}

.ico-oxquiz-x {
    width: 3rem;
    height: 3rem;
    background-image: url("../../img/mmk/common/dsr_oxquiz_x.svg")
}

.ico-oxquiz-o {
    width: 3rem;
    height: 3rem;
    background-image: url("../../img/mmk/common/dsr_oxquiz_o.svg")
}

.ico-dsr-added-list {
    width: 3.4rem;
    height: 3.4rem;
    background-image: url("../../img/mmk/common/dsr_added_list.svg")
}

.ico-dsr-emoji-happy,
.ico-dsr-emoji-sad {
    width: 11.7rem;
    height: 11.7rem
}

.ico-dsr-emoji-sad {
    background-image: url("../../img/mmk/common/dsr_result_sad-1.png")
}

.ico-dsr-emoji-happy {
    background-image: url("../../img/mmk/common/dsr_result_happy-1.png")
}

.ico-dsr-share {
    width: 3.7rem;
    height: 4rem;
    background-image: url("../../img/mmk/common/dsr_ico_share.png")
}

/*! component element icon kds3 추가 */

.ico-account {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-account)
}

.ico-account-hide {
    width: 2.4rem;
    height: 2.4rem;
    background: var(--path-solid-account-show)
}

.ico-account-inquiry {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-account-search)
}

.ico-loan {
    width: 2.4rem;
    height: 2.4rem;
    background: var(--path-solid-account-loan)
}

.ico-account-lift-limit {
    width: 2.4rem;
    height: 2.4rem;
    background: var(--path-solid-account-arrow-up)
}

.ico-account-oversea {
    width: 2.4rem;
    height: 2.4rem;
    background: var(--path-solid-account-glob)
}

.ico-account-transfer {
    width: 2.4rem;
    height: 2.4rem;
    background: var(--path-solid-account-arrow-left-right)
}

.ico-alarm-money {
    width: 2.4rem;
    height: 2.4rem;
    background: var(--path-solid-alarm-usd)
}

.ico-building {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-building)
}

.ico-calc.solid {
    width: 2.4rem;
    height: 2.4rem;
    background: var(--path-solid-calculator)
}

.ico-arrow-double-left {
    width: 2.4rem;
    height: 2.4rem;
    background: var(--path-line-chevron-double-left)
}

.ico-arrow-double-right {
    width: 2.4rem;
    height: 2.4rem;
    background: var(--path-line-chevron-double-right)
}

.ico-talk {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-chat-circle)
}

.ico-success {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-check-circle)
}

.ico-success.bu600 {
    -webkit-filter: var(--filter-bu600);
    filter: var(--filter-bu600)
}

.ico-success.bu600.w18 {
    width: 1.8rem;
    height: 1.8rem
}

.ico-coin {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-coin)
}

.ico-coin.in400 {
    -webkit-filter: var(--filter-in400);
    filter: var(--filter-in400)
}

.ico-coin.in500 {
    -webkit-filter: var(--filter-in500);
    filter: var(--filter-in500)
}

.ico-money-won {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-coin)
}

.ico-history,
.ico-money-won {
    width: 4rem;
    height: 4rem
}

.ico-coin.yl200 {
    width: 2.4rem;
    height: 2.4rem;
    background-image: url("../../img/mmk/kds3/ico/solid/circle_coin_yl200.svg")
}

.ico-coins {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-coin)
}

.ico-bitcoin {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-bitcoin)
}

.ico-card {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-card-circle)
}

.ico-coupon {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-coupon)
}

.ico-coupon.white {
    width: 1.2rem;
    height: 1.2rem;
    -webkit-filter: brightness(0) invert(1);
    filter: brightness(0) invert(1)
}

.ico-coupon.sf200 {
    width: 2rem;
    height: 2rem;
    -webkit-filter: var(--filter-sf200);
    filter: var(--filter-sf200)
}

.ico-credit-card {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-card)
}

.ico-credit-card.bu500 {
    -webkit-filter: var(--filter-bu500);
    filter: var(--filter-bu500)
}

.ico-credit-card.in500 {
    -webkit-filter: var(--filter-in500);
    filter: var(--filter-in500)
}

.ico-credit-card.vo400 {
    -webkit-filter: var(--filter-violet-vo400);
    filter: var(--filter-violet-vo400)
}

.ico-credit-management {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-credit-score)
}

.ico-delete-keypad.solid {
    width: 2.8rem;
    height: 2.8rem;
    background-image: var(--path-solid-backspace)
}

.ico-exclamation {
    width: 2.8rem;
    height: 2.8rem;
    background-image: var(--path-solid-exclamation)
}

.ico-dutchpay {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-dutchpay)
}

.ico-dutchpay.g400 {
    -webkit-filter: var(--filter-color-grey-g400);
    filter: var(--filter-color-grey-g400)
}

.ico-gold.solid {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-gold)
}

.ico-gold {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-gold)
}

.ico-gold.solid.yl300 {
    width: 4.8rem;
    height: 4.8rem;
    -webkit-filter: var(--filter-yl300);
    filter: var(--filter-yl300)
}

.ico-headset {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-headset)
}

.ico-home.solid {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-home)
}

.ico-hospital.solid {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-hospital)
}

.ico-injection.solid {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-syringe)
}

.ico-kbankpay.solid {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-kbankpay)
}

.ico-kbankpay.solid.in600 {
    -webkit-filter: var(--filter-in600);
    filter: var(--filter-in600)
}

.ico-loan2 {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-loan-krw)
}

.ico-loan_acct_book.solid {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-clipboard-krw)
}

.ico-loan-ai.solid {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-ai)
}

.ico-loan-ai.g500.solid {
    width: 1.6rem;
    height: 1.6rem;
    -webkit-filter: var(--filter-color-grey-g500);
    filter: var(--filter-color-grey-g500)
}

.ico-luckybox.solid {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-gift)
}

.ico-luckybox.solid.w14 {
    width: 1.4rem;
    height: 1.4rem
}

.ico-message {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-mail)
}

.ico-message.solid {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-mail)
}

.ico-mobile {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-phone)
}

.ico-moneytalk.solid {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-moneytalk)
}

.ico-dot-hori {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-more-hori)
}

.ico-dot-hori.w64 {
    width: 6.4rem;
    height: 6.4rem;
    -webkit-filter: var(--filter-lm100);
    filter: var(--filter-lm100)
}

.ico-dot-hori.w34 {
    width: 3.4rem;
    height: 3.4rem
}

.ico-dot-hori.w16 {
    width: 1.6rem;
    height: 1.6rem
}

.ico-dot-hori.re700 {
    -webkit-filter: var(--filter-re700);
    filter: var(--filter-re700)
}

:root .ico-dot-hori.w64 {
    width: 6.4rem;
    height: 6.4rem;
    -webkit-filter: var(--filter-pl, #4262ff);
    filter: var(--filter-pl, #4262ff)
}

.ico-dot-hori.white {
    -webkit-filter: brightness(0) invert(1);
    filter: brightness(0) invert(1)
}

.ico-dot-hori.g600 {
    -webkit-filter: var(--filter-color-grey-g600);
    filter: var(--filter-color-grey-g600)
}

.ico-dot-hori.disabled {
    -webkit-filter: var(--filter-ico-disabled);
    filter: var(--filter-ico-disabled)
}

.ico-none.solid {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-none)
}

.ico-oversea {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-glob)
}

.ico-oversea.solid {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-glob)
}

.ico-oversea-info.solid {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-glob-chat)
}

.ico-percent2 {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-percent-circle)
}

.ico-pig.solid {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-piggy-bank)
}

.ico-pin {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-pin)
}

.ico-pin.solid {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-pin)
}

.ico-pin.solid.accent-sec {
    background-image: var(--path-checkbox-pin-active)
}

.ico-present {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-gift)
}

.ico-quick-transfer.solid {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-bolt)
}

.ico-rotation {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-rotate)
}

.ico-rotation.w16 {
    width: 1.6rem;
    height: 1.6rem
}

.ico-rotation.re700 {
    -webkit-filter: var(--filter-re700);
    filter: var(--filter-re700)
}

.ico-rotation.g400 {
    -webkit-filter: var(--filter-ico-disabled);
    filter: var(--filter-ico-disabled)
}

.ico-rotation.ani-ty {
    width: 1.6rem;
    height: 1.6rem;
    -webkit-animation: ico-rotation-ani 1s linear infinite;
    animation: ico-rotation-ani 1s linear infinite
}

@-webkit-keyframes ico-rotation-ani {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0)
    }
    100% {
        -webkit-transform: rotate(-360deg);
        transform: rotate(-360deg)
    }
}

@keyframes ico-rotation-ani {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0)
    }
    100% {
        -webkit-transform: rotate(-360deg);
        transform: rotate(-360deg)
    }
}

.ico-scroll_down {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-scroll-down)
}

.ico-arrow_down {
    width: 2.8rem;
    height: 1.2rem;
    background-image: var(--path-etc-scroll-down)
}

.ico-arrow_up {
    width: 2.8rem;
    height: 1.2rem;
    background-image: var(--path-etc-scroll-down);
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg)
}

.ico-security {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-lock)
}

.ico-benefit-share.solid {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-share)
}

.ico-smartphone.solid {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-phone)
}

.ico-star.solid {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-star)
}

.ico-star.solid.vo400 {
    -webkit-filter: var(--filter-violet-vo400);
    filter: var(--filter-violet-vo400)
}

.ico-stock.solid {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-graph-bar-up)
}

.ico-stock-fall.solid {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-graph-bar-down)
}

.ico-stock-fall.solid.g400,
.ico-stock.solid.g400 {
    -webkit-filter: var(--filter-g400);
    filter: var(--filter-g400)
}

.ico-stock-fall.solid.g500,
.ico-stock.solid.g500 {
    -webkit-filter: var(--filter-g500);
    filter: var(--filter-g500)
}

.ico-stock-fall.solid.g600,
.ico-stock.solid.g600 {
    -webkit-filter: var(--filter-g600);
    filter: var(--filter-g600)
}

.ico-talk2 {
    width: 2.4rem;
    height: 2.4rem;
    background: var(--path-line-chat)
}

.ico-talk2.solid {
    width: 2.4rem;
    height: 2.4rem;
    background: var(--path-solid-chat)
}

.ico-thumb {
    width: 2.4rem;
    height: 2.4rem;
    background: var(--path-line-like)
}

.ico-transferbox.solid {
    width: 2.4rem;
    height: 2.4rem;
    background: var(--path-solid-box-krw)
}

.ico-handle {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-drag-handle)
}

.ico-clap-2d {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-clap)
}

.ico-triangle_both_hori {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-triangle-left-right)
}

.ico-triangle_up_down {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-triangle-up-down)
}

.ico-user {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-user)
}

.ico-user.solid {
    background-image: var(--path-solid-user)
}

.ico-user.solid.g400 {
    -webkit-filter: var(--filter-color-grey-g400);
    filter: var(--filter-color-grey-g400)
}

.ico-user.solid.g500 {
    -webkit-filter: var(--filter-color-grey-g500);
    filter: var(--filter-color-grey-g500)
}

.ico-human {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-user)
}

.ico-human.solid {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-user)
}

.ico-user-add {
    width: 2.4rem;
    height: 2.4rem;
    background-image: url("/resource/img/mmk/common/ico_line_user_add.png")
}

.ico-heart.solid {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-heart)
}

.ico-heart.re600.solid {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-heart-ico-pri-like)
}

.ico-heart.white.solid {
    width: 1.2rem;
    height: 1.2em;
    -webkit-filter: brightness(0) invert(1);
    filter: brightness(0) invert(1)
}

.ico-box.solid {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-box)
}

.ico-shopping {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-shopping)
}

.ico-shopping.solid {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-shopping)
}

.ico-link {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-link)
}

.ico-play {
    width: 2.4rem;
    height: 2.4rem
}

.ico-play.solid {
    background-image: var(--path-solid-play)
}

.ico-gift {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-gift)
}

.ico-gift.solid {
    background-image: var(--path-solid-gift)
}

.ico-gift.solid.g400 {
    -webkit-filter: var(--filter-color-grey-g400);
    filter: var(--filter-color-grey-g400)
}

.ico-clipboard,
.ico-history {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-clipboard)
}

.ico-coin.line {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-coin)
}

.ico-history {
    width: 4rem;
    height: 4rem
}

/*! component element icon 국가 */

.ico-flag {
    width: 3.4rem;
    height: 3.4rem;
    border-radius: 99rem;
    overflow: hidden;
    background-color: var(--color-g100, #f8f8f8)
}

.ico-flag.w40 {
    width: 4rem;
    height: 4rem;
    background-size: contain
}

.ico-flag.w44 {
    width: 4.4rem;
    height: 4.4rem;
    background-size: contain
}

.ico-flag.AU {
    background-image: url("../../img/mmk/kds3/flag/AU.svg")
}

.ico-flag.CA {
    background-image: url("../../img/mmk/kds3/flag/CA.svg")
}

.ico-flag.CN {
    background-image: url("../../img/mmk/kds3/flag/CN.svg")
}

.ico-flag.DK {
    background-image: url("../../img/mmk/kds3/flag/DK.svg")
}

.ico-flag.EU {
    background-image: url("../../img/mmk/kds3/flag/EU.svg")
}

.ico-flag.GB {
    background-image: url("../../img/mmk/kds3/flag/GB.svg")
}

.ico-flag.HK {
    background-image: url("../../img/mmk/kds3/flag/HK.svg")
}

.ico-flag.HU {
    background-image: url("../../img/mmk/kds3/flag/HU.svg")
}

.ico-flag.ID {
    background-image: url("../../img/mmk/kds3/flag/ID.svg")
}

.ico-flag.IN {
    background-image: url("../../img/mmk/kds3/flag/IN.svg")
}

.ico-flag.JP {
    background-image: url("../../img/mmk/kds3/flag/JP.svg")
}

.ico-flag.MY {
    background-image: url("../../img/mmk/kds3/flag/MY.svg")
}

.ico-flag.NO {
    background-image: url("../../img/mmk/kds3/flag/NO.svg")
}

.ico-flag.NZ {
    background-image: url("../../img/mmk/kds3/flag/NZ.svg")
}

.ico-flag.PH {
    background-image: url("../../img/mmk/kds3/flag/PH.svg")
}

.ico-flag.PL {
    background-image: url("../../img/mmk/kds3/flag/PL.svg")
}

.ico-flag.SE {
    background-image: url("../../img/mmk/kds3/flag/SE.svg")
}

.ico-flag.SG {
    background-image: url("../../img/mmk/kds3/flag/SG.svg")
}

.ico-flag.TH {
    background-image: url("../../img/mmk/kds3/flag/TH.svg")
}

.ico-flag.US {
    background-image: url("../../img/mmk/kds3/flag/US.svg")
}

.ico-flag.VN {
    background-image: url("../../img/mmk/kds3/flag/VN.svg")
}

.ico-flag.VN {
    background-image: url("../../img/mmk/kds3/flag/VN.svg")
}

.ico-flag.KR {
    background-image: url("../../img/mmk/kds3_5/flag/KR.svg")
}

/*! component element icon 보험사 logo 보험 메인 로고 */

.ico-insure-01 {
    width: 3.4rem;
    height: 3.4rem;
    background-image: url("../../img/mmk/common/img_insure_01.png")
}

.ico-insure-02 {
    width: 3.4rem;
    height: 3.4rem;
    background-image: url("../../img/mmk/common/img_insure_02.png")
}

.ico-insure-03 {
    width: 3.4rem;
    height: 3.4rem;
    background-image: url("../../img/mmk/common/img_insure_03.png")
}

.ico-insure-04 {
    width: 3.4rem;
    height: 3.4rem;
    background-image: url("../../img/mmk/common/img_insure_04.png")
}

.ico-insure-05 {
    width: 3.4rem;
    height: 3.4rem;
    background-image: url("../../img/mmk/common/img_insure_05.png")
}

.ico-insure-06 {
    width: 3.4rem;
    height: 3.4rem;
    background-image: url("../../img/mmk/common/img_insure_06.png")
}

.ico-insure-07 {
    width: 3.4rem;
    height: 3.4rem;
    background-image: url("../../img/mmk/common/img_insure_07.png")
}

/*! component element icon bank logo 제휴사연계대출 로고 */

.ico-logo-cap01 {
    width: 2.2rem;
    height: 2.2rem;
    background-image: url("../../img/mmk/common/ico_logo_cap01.png")
}

.ico-logo-cap02 {
    width: 2.2rem;
    height: 2.2rem;
    background-image: url("../../img/mmk/common/ico_logo_cap02.png")
}

.ico-logo-cap03 {
    width: 2.2rem;
    height: 2.2rem;
    background-image: url("../../img/mmk/common/ico_logo_cap03.png")
}

.ico-logo-cap04 {
    width: 2.2rem;
    height: 2.2rem;
    background-image: url("../../img/mmk/common/ico_logo_cap04.png")
}

.ico-logo-cap05 {
    width: 2.2rem;
    height: 2.2rem;
    background-image: url("../../img/mmk/common/ico_logo_cap05.png")
}

.ico-logo-cap06 {
    width: 2.2rem;
    height: 2.2rem;
    background-image: url("../../img/mmk/common/ico_logo_cap06.png")
}

.ico-logo-cap07 {
    width: 2.2rem;
    height: 2.2rem;
    background-image: url("../../img/mmk/common/ico_logo_cap07.png")
}

.ico-logo-cap08 {
    width: 2.2rem;
    height: 2.2rem;
    background-image: url("../../img/mmk/common/ico_logo_cap08.png")
}

.ico-logo-cap09 {
    width: 2.2rem;
    height: 2.2rem;
    background-image: url("../../img/mmk/common/ico_logo_cap09.png")
}

.ico-logo-cap10 {
    width: 2.2rem;
    height: 2.2rem;
    background-image: url("../../img/mmk/common/ico_logo_cap10.png")
}

.ico-logo-cap11 {
    width: 2.2rem;
    height: 2.2rem;
    background-image: url("../../img/mmk/common/ico_logo_cap11.png")
}

.ico-logo-cap12 {
    width: 2.2rem;
    height: 2.2rem;
    background-image: url("../../img/mmk/common/ico_logo_cap12.png")
}

.ico-logo-cap13 {
    width: 2.2rem;
    height: 2.2rem;
    background-image: url("../../img/mmk/common/ico_logo_cap13.png")
}

.ico-logo-cap14 {
    width: 2.2rem;
    height: 2.2rem;
    background-image: url("../../img/mmk/common/ico_logo_cap14.png")
}

.ico-logo-cap15 {
    width: 2.2rem;
    height: 2.2rem;
    background-image: url("../../img/mmk/common/ico_logo_cap15.png")
}

.ico-bell {
    width: 6rem;
    height: 6rem;
    background-image: url("../../img/mmk/common/ico_bell.png")
}

.ico-insu-01 {
    width: 3.4rem;
    height: 3.4rem;
    background-image: url("../../img/mmk/common/ico_insu_01.png")
}

.ico-insu-02 {
    width: 3.4rem;
    height: 3.4rem;
    background-image: url("../../img/mmk/common/ico_insu_02.png")
}

.ico-insu-03 {
    width: 3.4rem;
    height: 3.4rem;
    background-image: url("../../img/mmk/common/ico_insu_03.png")
}

.ico-voicefishing {
    width: 14rem;
    height: 14rem;
    background-image: url("../../img/mmk/common/voicePhishing_bg.png")
}

/*! component element icon 대출 아이콘 */

.ico-loan-01 {
    width: 4.4rem;
    height: 4.4rem;
    background-image: url("../../img/mmk/common/loan/ico_krw50000.png")
}

.ico-loan-02 {
    width: 4.4rem;
    height: 4.4rem;
    background-image: url("../../img/mmk/common/loan/ico_bankbook.png")
}

.ico-loan-03 {
    width: 6rem;
    height: 6rem;
    background-image: url("../../img/mmk/common/loan/ico_heart_hands.png")
}

.ico-loan-04 {
    width: 6rem;
    height: 6rem;
    background-image: url("../../img/mmk/common/loan/ico_dashboard.png")
}

.ico-loan-05 {
    width: 3.2rem;
    height: 3.2rem;
    background-image: url("../../img/mmk/common/loan/ico_loan_noti.png")
}

.ico-loan-06 {
    width: 3.2rem;
    height: 3.2rem;
    background-image: url("../../img/mmk/common/loan/ico_loan_my_apt.png")
}

.ico-loan-07 {
    width: 6rem;
    height: 6rem;
    background-image: url("../../img/mmk/common/loan/ico_loan_my_chat_check.png")
}

.ico-loan-08 {
    width: 4rem;
    height: 4rem;
    background-image: url("../../img/mmk/common/ceoreport/sme_credit_re_ico_1.png")
}

.ico-loan-09 {
    width: 4rem;
    height: 4rem;
    background-image: url("../../img/mmk/common/ceoreport/sme_credit_re_ico_2.png")
}

.ico-loan-10 {
    width: 4rem;
    height: 4rem;
    background-image: url("../../img/mmk/common/ceoreport/sme_credit_re_ico_4.png")
}

.ico-ceoreport-scrolldow {
    display: block;
    text-align: center;
    padding: 0 2rem;
    margin: 5.6rem 0 3.2rem;
    width: 100%;
    height: 1.1rem;
    background-image: url("../../img/mmk/common/ceoreport/ico_scrolldownarrow.png")
}

.ico-ceo-trophy {
    width: 4.4rem;
    height: 4.4rem;
    background-image: url("../../img/mmk/common/ceoreport/adm_SME__A_Home_E.png")
}

/*! component element icon 생활통장 아이콘 */

.ico-s-account-color {
    width: 4.6rem;
    height: 3.2rem;
    background-image: url("../../img/mmk/common/s_account_color.svg")
}

.ico-s-account-gray {
    width: 4.6rem;
    height: 3.2rem;
    background-image: url("../../img/mmk/common/s_account_gray.svg")
}

.ico-s-chagne-arrow {
    width: 2.3rem;
    height: 0.8rem;
    background-image: url("../../img/mmk/common/s_chagne_arrow.svg")
}

.ico-s_account_dual_k {
    width: 4.6rem;
    height: 3.2rem;
    background-image: url("../../img/mmk/common/s_account_dual_k.svg")
}

.ico-s_account_s {
    width: 4.6rem;
    height: 4.3rem;
    background-image: url("../../img/mmk/common/s_account_s.svg")
}

.ico-s_vs {
    width: 2.3rem;
    height: 2.2rem;
    background-image: url("../../img/mmk/common/s_vs.svg")
}

/*! component element tag 공통스타일 */

.tag-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.tag-wrap .tag+.tag {
    margin-left: 0.8rem
}

.tag {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: var(--color-g200, #eee);
    height: 2rem;
    border-radius: 99rem;
    padding: 0.1rem 0.8rem 0;
    vertical-align: middle
}

.tag.type2 {
    border-radius: 0.4rem
}

.tag .txt {
    font-size: 1.1rem;
    line-height: 100%;
    color: var(--color-g700, #7d7d7d);
    font-weight: normal;
    white-space: nowrap
}

.tag.chip {
    padding: 0.4rem 1.2rem;
    height: 2.8rem
}

.tag.chip .txt {
    font-size: 1.4rem
}

.tag [class^="ico-"] {
    width: 1rem;
    height: 1rem;
    margin-right: 0.5rem
}

.tag[class*="lv-0"] {
    border: 0.5px solid var(--color-pb5, #0000000C)
}

.tag[class*="lv-0"] .txt {
    font-size: 1.1rem;
    font-weight: bold;
    color: var(--color-w100, #fff)
}

.tag.lv-01 {
    background-color: var(--color-bu800, #0150ff)
}

.tag.lv-02 {
    background-color: var(--color-lm600, #639e00)
}

.tag.lv-03 {
    background-color: var(--color-yl600, #b08c00)
}

.tag.lv-04 {
    background-color: var(--color-og600, #e46f00)
}

.tag.lv-05 {
    background-color: var(--color-re700, #f02727)
}

.tag.positive {
    background-color: var(--color-cg500, #e6ebf5)
}

.tag.positive .txt {
    color: var(--color-bu800, #0150ff)
}

:root .tag.positive {
    background-color: var(--bg-sec-success)
}

:root .tag.positive .txt {
    color: var(--txt-pri-success)
}

.tag.negative {
    background-color: var(--color-re100, #ffddd6)
}

.tag.negative .txt {
    color: var(--color-re700, #f02727)
}

:root .tag.negative {
    background-color: var(--bg-sec-error)
}

:root .tag.negative .txt {
    color: var(--txt-pri-error)
}

.tag.neutral {
    background-color: var(--color-in200, #d3d2fe)
}

.tag.neutral .txt {
    color: var(--color-in900, #2b27f1)
}

:root .tag.neutral {
    background-color: var(--bg-sec-neutral)
}

:root .tag.neutral .txt {
    color: var(--txt-pri-neutral)
}

.tag.solid {
    background-color: var(--bg-sec-solid)
}

.tag.solid .txt {
    color: var(--txt-accent-sec)
}

.tag.new {
    background-color: var(--color-bu900, #003fc7);
    height: 1.8rem
}

.tag.new .txt {
    color: var(--color-w100, #fff);
    font-weight: bold
}

.tag.new2 {
    background-color: var(--bg-risk-very-low-soft)
}

.tag.new2 .txt {
    color: var(--color-bu800)
}

.tag.new3 {
    background-color: var(--bg-risk-very-low)
}

.tag.new3 .txt {
    color: var(--txt-pri-invert);
    font-weight: 700
}

.tag.event {
    height: 2.4rem;
    padding: 0.4rem 1rem;
    background: var(--color-pn, #17008c)
}

.tag.event .txt {
    color: var(--color-w100, #fff);
    font-weight: 500;
    font-size: 1.2rem
}

.tag.event2 {
    background-color: var(--bg-sec-active)
}

.tag.event2 .txt {
    color: var(--txt-pri-invert);
    font-weight: 700
}

.tag.event3 {
    background-color: var(--bg-pri-error)
}

.tag.event3 .txt {
    color: var(--color-w100);
    font-weight: 700
}

.tag.service-type1 {
    border: 1px solid var(--color-bu800, #0150ff);
    background-color: var(--color-w100, #fff)
}

.tag.service-type1 .txt {
    color: var(--color-bu800, #0150ff)
}

.tag.service-type2 {
    background-color: var(--color-bu900, #003fc7)
}

.tag.service-type2 .txt {
    color: var(--color-w100, #fff);
    font-weight: bold
}

.tag.red {
    background-color: var(--color-re50, #ffebe7)
}

.tag.red .txt {
    color: var(--color-re800, #d3140f)
}

.tag.red02 {
    background-color: var(--color-re50, #ffebe7)
}

.tag.red02 .txt {
    color: var(--color-re700, #f02727)
}

.tag.blue {
    background: var(--color-bu50, #e0f2ff)
}

.tag.blue .txt {
    color: var(--color-bu800, #0150ff)
}

.tag.benefit {
    background-color: var(--color-lm500, #69b405);
    height: 1.8rem
}

.tag.benefit .txt {
    color: var(--color-w100, #fff)
}

.tag.fee {
    background-color: var(--color-in50, #efefff);
    height: 2.2rem
}

.tag.fee .txt {
    color: var(--color-pn, #17008c);
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: bold
}

.tag.ex {
    background-color: var(--color-bu50, #e0f2ff);
    border-radius: 0.6rem
}

.tag.ex .txt {
    color: var(--color-bu800, #0150ff);
    font-size: 1.4rem;
    line-height: 1.7rem
}

.tag.cashback {
    padding: 0.4rem 0.8rem;
    background-color: var(--color-pu50, #f9efff);
    border-radius: 0.6rem;
    height: auto
}

.tag.cashback .txt {
    color: var(--color-pu800, #b346f7);
    font-size: 1.2rem;
    line-height: 1.6rem;
    font-weight: 700
}

.tag.cashback.suc {
    background-color: var(--color-bu600, #0082ff)
}

.tag.cashback.suc .txt {
    color: var(--color-w100, #fff)
}

.tag.bg-light2 {
    background-color: var(--color-in50, #efefff)
}

.tag.bg-light2 .txt {
    color: var(--color-in900, #2b27f1)
}

.tag.bg-light {
    background: var(--color-bu800, #0150ff)
}

:root .tag.bg-light {
    background: var(--bg-accent-pri)
}

.tag.bg-light .txt {
    color: var(--color-w100, #fff)
}

.tag.bg-dark {
    background: var(--color-w20, #fffFFF33)
}

:root .tag.bg-dark {
    background: var(--bg-pri-invert)
}

.tag.bg-dark .txt {
    color: var(--color-w100, #fff)
}

.tag.line-dark {
    border: 1px solid var(--border-ter-invert);
    background: transparent
}

:root .tag.line-dark {
    border: 1px solid var(--border-ter-invert);
    background: transparent
}

.tag.line-dark .txt {
    color: var(--color-w100, #fff)
}

.tag.color01 .txt {
    color: var(--color-pn, #17008c)
}

.tag.color02 .txt {
    color: var(--color-bu800, #0150ff)
}

.tag.color03 .txt {
    color: var(--color-re700, #f02727)
}

.tag.color04 .txt {
    color: var(--color-lm500, #69b405)
}

:root .tag.color04 .txt {
    color: var(--txt-pri-success, #039115)
}

.tag.color05 .txt {
    color: var(--color-bu800, #0150ff)
}

.tag.color06 .txt {
    color: var(--color-g700, #7d7d7d)
}

.tag-wrap button.tag {
    margin-top: 0.8rem;
    padding: 0 1.0rem;
    height: 2.4rem;
    border-radius: 8px;
    background-color: var(--color-cg500, #e6ebf5);
    font-size: 1.4rem;
    color: var(--color-g900, #141414)
}

.tag.light-gray {
    background: var(--color-g200, #eee);
    border: 0
}

.tag.light-gray .txt {
    font-size: 1.2rem;
    font-weight: bold;
    color: var(--color-g800, #414141)
}

.tag.light-gray02 {
    background-color: var(--color-cg300, #f1f6fb)
}

.tag.light-gray02 .txt {
    color: var(--color-g800, #414141)
}

.tag.line-light {
    border: 1px solid var(--color-bu800, #0150ff);
    background: transparent
}

:root .tag.line-light {
    border: 1px solid var(--border-accent-sec);
    background: transparent
}

.tag.line-light .txt {
    color: var(--color-bu800, #0150ff)
}

:root .tag.line-light .txt {
    color: var(--txt-accent-sec)
}

.tag.line-gray {
    border: 1px solid var(--color-g600, #9b9b9b);
    background: transparent
}

.tag.line-gray .txt {
    color: var(--color-g600, #9b9b9b)
}

.tag.stock-label-dot-1 {
    background: rgba(205, 252, 191, 0.5)
}

.tag.stock-label-dot-1 .txt {
    color: var(--color-ce600, #07a721);
    font-weight: bold
}

.tag.stock-label-dot-2 {
    background: rgba(224, 242, 255, 0.5)
}

.tag.stock-label-dot-2 .txt {
    color: var(--color-bu600, #0082ff);
    font-weight: bold
}

.tag.stock-label-dot-3 {
    background: rgba(255, 235, 231, 0.5)
}

.tag.stock-label-dot-3 .txt {
    color: var(--color-re600, #f75d46);
    font-weight: bold
}

.tag[class*="price-"] {
    height: 2.4rem;
    border-radius: 0.4rem;
    padding: 0.1rem 0.6rem 0
}

.tag[class*="price-"] .txt {
    font-size: 1.4rem;
    font-weight: bold;
    line-height: 1.7rem
}

.tag.price-down {
    background-color: var(--color-bu50, #e0f2ff)
}

.tag.price-down .txt {
    color: var(--color-bu600, #0082ff)
}

.tag.price-up {
    background-color: var(--color-re50, #ffebe7)
}

.tag.price-up .txt {
    color: var(--color-re700, #f02727)
}

.tag.price-similar {
    background-color: var(--color-g200, #eee)
}

.tag.price-similar .txt {
    color: var(--color-g600, #9b9b9b)
}

.tag.menu {
    height: 2.3rem;
    border-radius: 999rem;
    padding: 0.4rem 0.8rem
}

.tag.menu .txt {
    color: var(--color-g800, #414141)
}

.tag.account {
    background-color: var(--color-pl, #b6f23d)
}

:root .tag.account {
    background-color: var(--bg-accent-pri, #4262ff)
}

.tag.account .txt {
    color: var(--color-pn, #17008c)
}

:root .tag.account .txt {
    color: var(--txt-pri-invert, #fff)
}

.tag.minimum {
    background-color: var(--color-g600, #9b9b9b)
}

.tag.minimum .txt {
    color: var(--color-w100, #fff)
}

.tag.cy600 {
    background-color: var(--color-cy600, #019cc8)
}

.tag.cy600 .txt {
    color: var(--color-w100, #fff);
    font-weight: 700
}

.tag.cy500 {
    background-color: var(--color-cy500, #12b0da)
}

.tag.cy500 .txt {
    color: var(--color-w100, #fff);
    font-weight: 700
}

.tag.w100 {
    background-color: var(--color-w100, #fff)
}

.tag.w100 .txt {
    color: var(--color-g600, #9b9b9b);
    font-weight: 700
}

.tag.in700 {
    background-color: var(--color-in700, #5c59f9)
}

.tag.in700 .txt {
    color: var(--color-w100, #fff)
}

.tag.coupon {
    border-radius: 0.4rem;
    padding: 0.2rem 0.4rem
}

.tag.coupon .txt {
    font-weight: 700
}

.tag.ce50 {
    background-color: var(--color-ce50, #cdfcbf)
}

.tag.ce50 .txt {
    color: var(--color-ce700, #009112)
}

.tag.prd {
    background-color: var(--color-w100, #fff)
}

.tag.prd .txt {
    color: var(--color-pn, #17008c);
    font-weight: 700
}

.tag.listing {
    background-color: var(--color-g200, #eee);
    padding: 0 0.8rem
}

.tag.listing .txt {
    color: var(--color-bu700, #006aff);
    font-size: 1.2rem;
    line-height: 1.6rem
}

:root .tag.listing {
    background-color: var(--bg-ter)
}

:root .tag.listing .txt {
    color: var(--txt-pri-down)
}

.tag.shadow {
    background-color: var(--bg-pri-base);
    -webkit-box-shadow: 0 2px 8px 0 var(--color-pb100-op15);
    box-shadow: 0 2px 8px 0 var(--color-pb100-op15)
}

:root .tag.disabled {
    background-color: var(--bg-pri-disabled)
}

:root .tag.line-light.disabled {
    background-color: transparent;
    border-color: var(--border-disabled)
}

:root .tag.bg-dark.disabled {
    background-color: var(--bg-pri-invert)
}

:root .tag.line-dark.disabled {
    background-color: transparent;
    border-color: var(--border-ter-invert)
}

:root .tag.disabled .txt {
    color: var(--txt-disabled)
}

:root .tag.bg-dark.disabled .txt,
:root .tag.line-dark.disabled .txt {
    color: var(--txt-disabled-invert)
}

.tag [class^="ico-"]:last-child {
    margin-right: 0
}

.tag.line-light [class^="ico-"],
.tag.solid [class^="ico-"] {
    -webkit-filter: var(--filter-in700);
    filter: var(--filter-in700)
}

.tag.bg-light [class^="ico-"] {
    -webkit-filter: var(--filter-w100);
    filter: var(--filter-w100)
}

.tag.default [class^="ico-"],
.tag.shadow [class^="ico-"] {
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

.tag.act01 {
    background-color: var(--bg-ter)
}

.tag.act01 .txt {
    color: var(--txt-ter)
}

.tag.act02 {
    background-color: var(--bg-sec-error)
}

.tag.act02 .txt {
    color: var(--txt-pri-error)
}

.tag.act03 {
    background-color: var(--bg-risk-very-low)
}

.tag.act03 .txt {
    color: var(--txt-pri-invert);
    font-weight: 700
}

.tag.act04 {
    border: 1px solid var(--border-accent-sec);
    background-color: var(--color-w100)
}

.tag.act04 .txt {
    color: var(--txt-accent-sec);
    font-weight: 700
}

.tag.act05 {
    background: transparent;
    border: 1px solid var(--border-pri-invert)
}

.tag.act05 .txt {
    color: var(--color-w100);
    font-weight: 700
}

.tag[class*="report-"] {
    border-radius: .4rem;
    padding: .3rem .6rem;
    font-size: 1.1rem;
    font-weight: 700;
    line-height: 1.5rem;
    height: unset;
    vertical-align: unset
}

.tag[class*="report-"] .txt {
    font-size: 1.1rem;
    font-weight: bold;
    line-height: 1.7rem
}

.tag.report-badge01 {
    background-color: var(--color-bu50)
}

.tag.report-badge01 .txt {
    color: var(--color-bu700)
}

.tag.report-badge02 {
    background-color: var(--color-green-gn100)
}

.tag.report-badge02 .txt {
    color: var(--color-green-gn800)
}

.tag.report-badge03 {
    background-color: var(--color-yellow-yl50)
}

.tag.report-badge03 .txt {
    color: var(--color-yl700)
}

.tag.report-badge04 {
    background-color: var(--color-orange-og100)
}

.tag.report-badge04 .txt {
    color: var(--color-orange-og800)
}

.tag.report-badge05 {
    background-color: var(--color-red-re50)
}

.tag.report-badge05 .txt {
    color: var(--color-red-re700)
}

.tag.big {
    padding: 0 0.8rem;
    height: 2.6rem
}

.tag.g300 {
    background-color: var(--color-grey-g300)
}

.tag.g300.big .txt {
    font-size: 1.4rem;
    color: var(--txt-sec)
}

.tag.g300 .txt strong {
    font-weight: 700
}

.tag.in100 {
    background-color: var(--color-in100)
}

.tag.in100.big .txt {
    font-size: 1.4rem;
    color: var(--color-indigo-in800)
}

.tag.in100 .txt strong {
    font-weight: 700
}

.tag.og50 {
    background-color: var(--color-og50)
}

.tag.og50 .txt {
    color: var(--color-og700)
}

.tag.defualt {
    padding: 0.2rem 0.6rem;
    border-radius: 0.6rem;
    margin-bottom: 0.6rem;
    background-color: var(--color-bu50, #e0f2ff)
}

.tag.defualt .txt {
    font-weight: bold;
    font-size: 1.2rem;
    color: var(--color-bu600, #0082ff)
}

.tag.add {
    border-radius: 0.6rem;
    padding: 0.2rem 0.6rem;
    margin-bottom: 0.6rem;
    background-color: var(--bg-sec-neutral)
}

.tag.add .txt {
    font-weight: bold;
    font-size: 1.2rem;
    color: var(--txt-pri-neutral)
}

.tag.loan {
    background: var(--bg-sec-solid)
}

.tag.loan .txt {
    color: var(--bg-accent-sec)
}

.tag.level4 {
    background-color: var(--bg-risk-normal);
    padding: 0.25rem 0.8rem
}

.tag.level4 .txt {
    color: var(--color-w100);
    font-weight: bold
}

.tag.level5 {
    background-color: var(--bg-risk-low);
    padding: 0.25rem 0.8rem
}

.tag.level5 .txt {
    color: var(--color-w100);
    font-weight: bold
}

.tag.level6 {
    background-color: var(--bg-risk-very-low);
    padding: 0.25rem 0.8rem
}

.tag.level6 .txt {
    color: var(--color-w100);
    font-weight: bold
}

.tag.pink {
    margin-left: 0.4rem !important;
    padding-right: 0.6rem;
    padding-left: 0.6rem;
    background-color: var(--color-mg600);
    border: 1px solid var(--border-img)
}

.tag.pink .txt {
    color: var(--txt-pri-invert);
    font-size: 1.2rem;
    font-weight: bold
}

.tag.blue02 {
    margin-left: 0.4rem !important;
    padding-right: 0.6rem;
    padding-left: 0.6rem;
    background-color: var(--bg-ter-active);
    border: 1px solid var(--border-img)
}

.tag.blue02 .txt {
    color: var(--txt-pri-invert);
    font-size: 1.2rem;
    font-weight: bold
}

.tag.blue02 .ico-coupon {
    width: 1.2rem;
    height: 1.2rem
}

.tag.blue03 {
    background-color: var(--bg-sec-solid)
}

.tag.blue03 .txt {
    color: var(--txt-accent-sec)
}

.tag.blue03 [class^="ico-"] {
    margin-right: 0;
    margin-left: 0.2rem;
    -webkit-filter: var(--filter-ico-accent-ter);
    filter: var(--filter-ico-accent-ter)
}

.tag.tag-accent-sec {
    background-color: var(--bg-sec-solid)
}

.tag.tag-accent-sec .txt {
    color: var(--txt-accent-sec)
}

.tag.live {
    padding: 0 0.5rem;
    border: 1px solid var(--color-re300);
    background-color: transparent
}

.tag.live .txt {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 1.2rem;
    font-weight: 700;
    line-height: 1.6rem;
    color: var(--color-re300)
}

.tag.live .txt::before {
    content: "";
    display: block;
    width: 0.4rem;
    height: 0.4rem;
    margin-right: 0.4rem;
    border-radius: 100%;
    background-color: var(--color-re300)
}

.tag.interest-coupon {
    padding: .5rem .8rem .5rem 1rem;
    border-radius: .6rem;
    background: var(--bg-sec-solid);
    height: 2.4rem
}

.tag.interest-coupon .txt {
    font-size: 1.2rem;
    line-height: 1.4rem;
    color: var(--txt-accent-sec)
}

.tag.accent-sec,
.tag.bg-sec {
    background: var(--bg-sec-solid)
}

.tag.accent-sec .txt,
.tag.bg-sec .txt {
    color: var(--txt-accent-sec)
}

.tag.gradient {
    width: 2.9rem;
    height: 2.2rem;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 0;
    border: 1.2px solid transparent;
    background: -o-linear-gradient(white, #fff) padding-box, -o-linear-gradient(341deg, #23b4d7 0, #4262e3 50%, #8c59dc 100%);
    background: linear-gradient(white, #fff) padding-box, linear-gradient(109deg, #23b4d7 0, #4262e3 50%, #8c59dc 100%);
    background-origin: border-box;
    background-clip: padding-box, border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.tag.gradient .txt {
    font-size: 1.1rem;
    line-height: 1.4rem;
    font-weight: bold;
    background: -o-linear-gradient(341deg, #23b4d7 0, #4262e3 50%, #8c59dc 100%);
    background: linear-gradient(109deg, #23b4d7 0, #4262e3 50%, #8c59dc 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent
}

.tag.gn50 {
    height: 2.2rem;
    padding: 0 0.6rem;
    background-color: var(--color-gn50);
    border-radius: 0.6rem
}

.tag.gn50 .txt {
    font-size: 1.2rem;
    font-weight: 700;
    color: var(--color-gn700)
}

.tag.gn50.h24 {
    height: 2.4rem;
    padding: 0 0.8rem
}

.tag.vo50 {
    height: 2.4rem;
    padding: 0 0.6rem;
    background-color: var(--color-vo50);
    border-radius: 0.6rem
}

.tag.vo50 .txt {
    font-size: 1.2rem;
    font-weight: 700;
    color: var(--color-vo800)
}

.tag.ter {
    height: 2.4rem;
    padding: 0 0.8rem;
    background-color: var(--bg-ter);
    border-radius: 0.6rem
}

.tag.ter .txt {
    font-size: 1.2rem;
    font-weight: 700;
    color: var(--txt-ter)
}

.tag.sec {
    height: 2.2rem;
    padding: 0 0.6rem;
    background-color: var(--bg-sec);
    border-radius: 0.6rem
}

.tag.sec .txt {
    font-weight: 700;
    color: var(--txt-ter)
}

.tag.ad-light {
    background: var(--bg-pri-base);
    border: 1px solid var(--border-qua)
}

.tag.ad-light .txt {
    color: var(--txt-quin)
}

.tag.ad-dark {
    color: var(--txt-sec-invert);
    background: var(--bg-sec-invert);
    border: 1px solid var(--border-ter-invert)
}

.tag.ad-dark .txt {
    color: var(--txt-sec-invert)
}

.tag.ad-light.type2 {
    margin-left: .4rem;
    height: 1.4rem;
    border-radius: 99rem;
    padding: 0 .8rem
}

.tag.ad-light.type2 .txt {
    font-size: .9rem;
    font-weight: 400;
    line-height: 1.4rem;
    color: var(--txt-quin)
}

.tag.ad-light.type3 {
    margin-left: .4rem;
    height: 1.4rem;
    border-radius: 99rem;
    padding: 0 .4rem
}

.tag.ad-light.type3 .txt {
    font-size: .9rem;
    font-weight: 400;
    line-height: 1.4rem;
    color: var(--txt-quin)
}

/*! component element icon tipbox 예금가입 아이콘스타일 */

.ico-finger {
    width: 3.2rem;
    height: 3.2rem;
    background-image: var(--path-auth-fingerprint)
}

.ico-face_id {
    width: 3.2rem;
    height: 3.2rem;
    background-image: var(--path-auth-face-id)
}

.ico-bio {
    width: 17.6rem;
    height: 17rem;
    background-image: url("../../img/mmk/common/ico_bio.png")
}

.ico-bio-ios {
    width: 17.6rem;
    height: 17rem;
    background-image: url("../../img/mmk/common/ico_bio_ios.png")
}

.icon-center-group {
    margin: 10.4rem auto 0;
    text-align: center
}

.ico-rocketwow {
    width: 1.2rem;
    height: 1.2rem;
    background-image: url("../../img/mmk/svg_common/ico_wowcashback.svg")
}

/*!
* component element
* icon
* tipbox
* 간편홈 아이콘스타일
*/

.ico-clipboard.ico-history {
    width: 4rem;
    height: 4rem
}

.ico-coin.ico-money-won {
    width: 4rem;
    height: 4rem
}

.ico-plus-circle {
    width: 4rem;
    height: 4rem;
    background-image: var(--path-line-add-circle)
}

/*!
* component element
* icon
* 플러스박스 개편
*/

.ico-plus-circle.solid {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-add-circle)
}

.ico-smile {
    width: 2.4rem;
    height: 2.4rem;
    background-image: url("../../img/mmk/svg_common/ico_smile.svg")
}

/*!
* component element
* icon
* CHPFMTASK-2201
*/

.ico-plus-circle.w16 {
    width: 1.6rem;
    height: 1.6rem
}

.ico-plus-circle.bu400 {
    -webkit-filter: var(--filter-bu400);
    filter: var(--filter-bu400)
}

/*!
* component element
* icon
* kds 선반영
*/

.ico-etc-new-large {
    width: 1.6rem;
    height: 1.6rem;
    background: var(--color-re700) var(--path-etc-new) no-repeat center;
    border-radius: 50%
}

/*!
* component element
* icon
* 회원가입 > 관심토픽 선택
*/

[class^="ico-topic"] {
    width: 5.8rem;
    height: 5.8rem
}

/*!
* component element
* lottie
* 로티 이미지
*/

.ui-lottie {
    display: inline-block;
    width: 100%;
    height: 100%
}

/*!
* component element
* icon
* 메인 > 상단 아이콘
* 보안솔루션 상대경로 이슈대응
*/

.ico-timeline-refresh {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-refresh);
    background-size: contain
}

.ico-setting {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-setting);
    background-size: contain
}

.ico-setting.solid {
    background-image: var(--path-solid-setting)
}

/*!
* component element
* icon
* FETASK-1638 오늘의 생활시세
* 주유소 로고
*/

.ico-oil-logo {
    width: 3.4rem;
    height: 3.4rem;
    border-radius: 99rem;
    background-color: var(--color-g100, #f8f8f8)
}

.ico-oil-logo.E1G {
    background-image: url("/resource/img/mmk/svg_common/oil/E1G.svg");
    background-size: contain
}

.ico-oil-logo.ETC {
    background-image: url("/resource/img/mmk/svg_common/oil/ETC.svg");
    background-size: contain
}

.ico-oil-logo.GSC {
    background-image: url("/resource/img/mmk/svg_common/oil/GSC.svg");
    background-size: contain
}

.ico-oil-logo.HDO {
    background-image: url("/resource/img/mmk/svg_common/oil/HDO.svg");
    background-size: contain
}

.ico-oil-logo.NHO {
    background-image: url("/resource/img/mmk/svg_common/oil/NHO.svg");
    background-size: contain
}

.ico-oil-logo.RTO {
    background-image: url("/resource/img/mmk/svg_common/oil/RTO.svg");
    background-size: contain
}

.ico-oil-logo.RTX {
    background-image: url("/resource/img/mmk/svg_common/oil/RTX.svg");
    background-size: contain
}

.ico-oil-logo.SKE {
    background-image: url("/resource/img/mmk/svg_common/oil/SKE.svg");
    background-size: contain
}

.ico-oil-logo.SKG {
    background-image: url("/resource/img/mmk/svg_common/oil/SKG.svg");
    background-size: contain
}

.ico-oil-logo.SOL {
    background-image: url("/resource/img/mmk/svg_common/oil/SOL.svg");
    background-size: contain
}

/*!
* component element
* icon
* FETASK-1641 플러스박스 이자 한번에 받기
*/

.ico-coin-flip {
    width: 6.4rem;
    height: 6.4rem;
    background-image: url("/resource/img/mmk/common/plusbox-coin_flip.png");
    background-size: contain
}

.ico-list-open {
    width: 3.2rem;
    height: 3.2rem;
    background-image: url("/resource/img/mmk/svg_common/ico_list_open.svg");
    background-size: contain
}

/*!
* component element
* icon
* 썸네일 아이콘
*/

[class*="ico-thumbnail"] {
    width: 2.4rem;
    height: 2.4rem;
    background-image: url("/resource/img/mmk/svg_common/thumbnail/ico_thumbnail_02.svg")
}

[class*="ico-thumbnail"].w28 {
    width: 2.8rem;
    height: 2.8rem
}

.ico-thumbnail-01 {
    background-image: url("/resource/img/mmk/svg_common/thumbnail/ico_thumbnail_01.svg")
}

.ico-thumbnail-02 {
    background-image: url("/resource/img/mmk/svg_common/thumbnail/ico_thumbnail_02.svg")
}

.ico-thumbnail-03 {
    background-image: url("/resource/img/mmk/svg_common/thumbnail/ico_thumbnail_03.svg")
}

.ico-thumbnail-04 {
    background-image: url("/resource/img/mmk/svg_common/thumbnail/ico_thumbnail_04.svg")
}

.ico-thumbnail-05 {
    background-image: url("/resource/img/mmk/svg_common/thumbnail/ico_thumbnail_05.svg")
}

.ico-thumbnail-06 {
    background-image: url("/resource/img/mmk/svg_common/thumbnail/ico_thumbnail_06.svg")
}

.ico-thumbnail-07 {
    background-image: url("/resource/img/mmk/svg_common/thumbnail/ico_thumbnail_07.svg")
}

.ico-thumbnail-08 {
    background-image: url("/resource/img/mmk/svg_common/thumbnail/ico_thumbnail_08.svg")
}

.ico-thumbnail-09 {
    background-image: url("/resource/img/mmk/svg_common/thumbnail/ico_thumbnail_09.svg")
}

.ico-thumbnail-10 {
    background-image: url("/resource/img/mmk/svg_common/thumbnail/ico_thumbnail_10.svg")
}

.ico-thumbnail-11 {
    background-image: url("/resource/img/mmk/svg_common/thumbnail/ico_thumbnail_11.svg")
}

.ico-thumbnail-12 {
    background-image: url("/resource/img/mmk/svg_common/thumbnail/ico_thumbnail_12.svg")
}

.ico-thumbnail-13 {
    background-image: url("/resource/img/mmk/svg_common/thumbnail/ico_thumbnail_13.svg")
}

.ico-thumbnail-14 {
    background-image: url("/resource/img/mmk/svg_common/thumbnail/ico_thumbnail_14.svg")
}

.ico-thumbnail-15 {
    background-image: url("/resource/img/mmk/svg_common/thumbnail/ico_thumbnail_15.svg")
}

.ico-thumbnail-16 {
    background-image: url("/resource/img/mmk/svg_common/thumbnail/ico_thumbnail_16.svg")
}

.ico-thumbnail-17 {
    background-image: url("/resource/img/mmk/svg_common/thumbnail/ico_thumbnail_17.svg")
}

.ico-thumbnail-18 {
    background-image: url("/resource/img/mmk/svg_common/thumbnail/ico_thumbnail_18.svg")
}

.ico-thumbnail-19 {
    background-image: url("/resource/img/mmk/svg_common/thumbnail/ico_thumbnail_19.svg")
}

.ico-thumbnail-20 {
    background-image: url("/resource/img/mmk/svg_common/thumbnail/ico_thumbnail_20.svg")
}

.ico-thumbnail-21 {
    background-image: url("/resource/img/mmk/svg_common/thumbnail/ico_thumbnail_21.svg")
}

.ico-thumbnail-22 {
    background-image: url("/resource/img/mmk/svg_common/thumbnail/ico_thumbnail_22.svg")
}

.ico-thumbnail-23 {
    background-image: url("/resource/img/mmk/svg_common/thumbnail/ico_thumbnail_23.svg")
}

.ico-thumbnail-24 {
    background-image: url("/resource/img/mmk/svg_common/thumbnail/ico_thumbnail_24.svg")
}

.ico-thumbnail-25 {
    background-image: url("/resource/img/mmk/svg_common/thumbnail/ico_thumbnail_25.svg")
}

.ico-thumbnail-26 {
    background-image: url("/resource/img/mmk/svg_common/thumbnail/ico_thumbnail_26.svg")
}

.ico-thumbnail-27 {
    background-image: url("/resource/img/mmk/svg_common/thumbnail/ico_thumbnail_27.svg")
}

.ico-thumbnail-28 {
    background-image: url("/resource/img/mmk/svg_common/thumbnail/ico_thumbnail_28.svg")
}

.ico-thumbnail-29 {
    background-image: url("/resource/img/mmk/svg_common/thumbnail/ico_thumbnail_29.svg")
}

.ico-thumbnail-30 {
    background-image: url("/resource/img/mmk/svg_common/thumbnail/ico_thumbnail_30.svg")
}

.ico-thumbnail-31 {
    background-image: url("/resource/img/mmk/svg_common/thumbnail/ico_thumbnail_31.svg")
}

.ico-thumbnail-32 {
    background-image: url("/resource/img/mmk/svg_common/thumbnail/ico_thumbnail_32.svg")
}

/*!
* component element
* icon
* FETASK-1758 하나은행 환전지갑
*/

.ico-exchange-us {
    width: 5.2rem;
    height: 5.2rem;
    background-image: url("/resource/img/mmk/common/ico_exchange_us.png");
    background-size: contain
}

.ico-exchange-jp {
    width: 5.2rem;
    height: 5.2rem;
    background-image: url("/resource/img/mmk/common/ico_exchange_jp.png");
    background-size: contain
}

.ico-exchange-eu {
    width: 5.2rem;
    height: 5.2rem;
    background-image: url("/resource/img/mmk/common/ico_exchange_eu.png");
    background-size: contain
}

/*!
* component element
* icon
* FETASK-1905 구독료 무료챌린지
*/

.ico-logo-naverplus {
    width: 3.6rem;
    height: 3.6rem;
    background-image: url("/resource/img/mmk/common/ico_naverplus.png");
    background-size: contain
}

.ico-logo-coupang_rocket {
    width: 3.6rem;
    height: 3.6rem;
    background-image: url("/resource/img/mmk/common/ico_coupang_rocket.png");
    background-size: contain
}

/*!
* component element
* icon
* CHPFMTASK-784 사장님 입출금 통장
*/

.ico-account-fail {
    width: 11rem;
    height: 11rem;
    background: url("/resource/img/mmk/common/ico_account_fail.png") center no-repeat;
    background-size: contain
}

.ico-account-view {
    width: 4rem;
    height: 4rem;
    background-image: url("../../img/mmk/common/ceoreport/sme_credit_re_ico_3.png")
}

.ico-bulb {
    width: 6rem;
    height: 6rem;
    background-image: url("../../img/mmk/common/ceoreport/sme_credit_re_onboarding_2.png")
}

.ico-ceo-report-share {
    width: 4rem;
    height: 4rem;
    background-image: url("../../img/mmk/common/ceoreport/sme_credit_re_onboarding_7.png");
    background-color: var(--ico-pri-down);
    background-size: 2.4rem;
    border-radius: 50%
}

.ico-invest {
    width: 3.2rem;
    height: 1.1rem;
    background-image: url("../../img/mmk/common/ico-invest.png")
}

/*!
* component element
* icon
* CHPFMTASK-846 홈 개편
*/

.ico-badge-owner {
    width: 2rem;
    height: 2rem;
    background-image: url("/resource/img/mmk/home/badge_owner.svg")
}

.ico-badge-owner-disabled {
    width: 2rem;
    height: 2rem;
    background-image: url("/resource/img/mmk/home/badge_owner_disabled.svg")
}

.ico-badge-owner-ceo {
    width: 2.4rem;
    height: 2.4rem;
    background-image: url("/resource/img/mmk/home/badge_owner-ceo.svg")
}

.ico-badge-leader {
    width: 2rem;
    height: 2rem;
    background-image: url("/resource/img/mmk/home/badge_leader.svg")
}

.ico-home-moim {
    width: 3.2rem;
    height: 3.2rem;
    background-image: url("/resource/img/mmk/home/icon_moim.svg")
}

.ico-home-mood {
    width: 3.2rem;
    height: 3.2rem;
    background-image: url("/resource/img/mmk/home/icon_mood.svg")
}

.ico-home-challenge {
    width: 3.2rem;
    height: 3.2rem;
    background-image: url("/resource/img/mmk/home/icon_challenge.svg")
}

.ico-home-challenge.w28 {
    width: 2.8rem;
    height: 2.8rem
}

/*!
* component element
* icon
* CHPFMTASK-807 온라인설명의무
*/

.ico-btn-arrow {
    position: relative;
    width: 2rem;
    height: 2rem;
    margin-left: 2rem !important;
    margin-top: -.4rem
}

.ico-btn-arrow:after,
.ico-btn-arrow:before {
    content: '';
    display: block;
    width: 2rem;
    height: 2rem;
    position: absolute;
    top: .5rem;
    left: 0;
    background: var(--path-line-chevron-left) center no-repeat;
    background-size: contain;
    -webkit-filter: var(--filter-w100);
    filter: var(--filter-w100);
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg)
}

.ico-btn-arrow:before {
    -webkit-animation: arrow-down-ani 2s ease-in-out infinite;
    animation: arrow-down-ani 2s ease-in-out infinite
}

.ico-btn-arrow:after {
    -webkit-animation: arrow-down-ani 2s 1s ease-in-out infinite;
    animation: arrow-down-ani 2s 1s ease-in-out infinite
}

@-webkit-keyframes arrow-down-ani {
    0% {
        opacity: 0;
        top: -.5rem
    }
    70% {
        opacity: 1
    }
    100% {
        opacity: 0
    }
}

@keyframes arrow-down-ani {
    0% {
        opacity: 0;
        top: -.5rem
    }
    70% {
        opacity: 1
    }
    100% {
        opacity: 0
    }
}

/*!
* component element
* icon
* CHPFMTASK-722 개인사업자 부동산담보대출
*/

.ico-btn-arrow2 {
    margin: 3.2rem 0;
    position: relative;
    width: 2.2rem;
    height: 2.7rem
}

.ico-btn-arrow2:after,
.ico-btn-arrow2:before {
    content: '';
    display: block;
    width: 2.2rem;
    height: 2.2rem;
    position: absolute;
    top: .7rem;
    left: 0;
    background: var(--path-line-chevron-left) center no-repeat;
    background-size: contain;
    -webkit-filter: var(--filter-bu900);
    filter: var(--filter-bu900);
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg)
}

.ico-btn-arrow2:before {
    top: -.2rem;
    opacity: .3
}

.ico-btn-arrow2.arr-ani:before {
    top: 0;
    -webkit-animation: arrow-down-ani2 2s ease-in-out infinite;
    animation: arrow-down-ani2 2s ease-in-out infinite
}

.ico-btn-arrow2.arr-ani:after {
    top: 0;
    -webkit-animation: arrow-down-ani2 2s 1s ease-in-out infinite;
    animation: arrow-down-ani2 2s 1s ease-in-out infinite
}

@-webkit-keyframes arrow-down-ani2 {
    0% {
        opacity: 0;
        top: -1.2rem
    }
    70% {
        opacity: 1
    }
    100% {
        opacity: 0
    }
}

@keyframes arrow-down-ani2 {
    0% {
        opacity: 0;
        top: -1.2rem
    }
    70% {
        opacity: 1
    }
    100% {
        opacity: 0
    }
}

/*!
* component element
* icon
* CHPFMTASK-806 슈퍼쇼핑
*/

.ico-money-point {
    width: 1.8rem;
    height: 1.8rem;
    background: url("/resource/img/mmk/common/shopping/ico_money_point.png") center no-repeat;
    background-size: contain
}

.ico-money-point.type2 {
    width: 1.6rem;
    height: 1.6rem
}

.ico-money-point.type3 {
    width: 1.4rem;
    height: 1.4rem
}

.ico-category-01 {
    width: 3.4rem;
    height: 3.4rem;
    background: url("/resource/img/mmk/common/shopping/ico_category_01.png") center no-repeat;
    background-size: contain
}

.ico-category-02 {
    width: 3.4rem;
    height: 3.4rem;
    background: url("/resource/img/mmk/common/shopping/ico_category_02.png") center no-repeat;
    background-size: contain
}

.ico-category-03 {
    width: 3.4rem;
    height: 3.4rem;
    background: url("/resource/img/mmk/common/shopping/ico_category_03.png") center no-repeat;
    background-size: contain
}

.ico-category-04 {
    width: 3.4rem;
    height: 3.4rem;
    background: url("/resource/img/mmk/common/shopping/ico_category_04.png") center no-repeat;
    background-size: contain
}

.ico-category-05 {
    width: 3.4rem;
    height: 3.4rem;
    background: url("/resource/img/mmk/common/shopping/ico_category_05.png") center no-repeat;
    background-size: contain
}

.ico-category-06 {
    width: 3.4rem;
    height: 3.4rem;
    background: url("/resource/img/mmk/common/shopping/ico_category_06.png") center no-repeat;
    background-size: contain
}

.ico-category-07 {
    width: 3.4rem;
    height: 3.4rem;
    background: url("/resource/img/mmk/common/shopping/ico_category_07.png") center no-repeat;
    background-size: contain
}

.ico-category-08 {
    width: 3.4rem;
    height: 3.4rem;
    background: url("/resource/img/mmk/common/shopping/ico_category_08.png") center no-repeat;
    background-size: contain
}

.ico-category-09 {
    width: 3.4rem;
    height: 3.4rem;
    background: url("/resource/img/mmk/common/shopping/ico_category_09.png") center no-repeat;
    background-size: contain
}

.ico-shopping-01 {
    width: 5.8rem;
    height: 5.4rem;
    background: url("/resource/img/mmk/common/shopping/ico_shopping_01.png") center no-repeat;
    background-size: contain
}

.ico-shopping-02 {
    width: 5.8rem;
    height: 5.4rem;
    background: url("/resource/img/mmk/common/shopping/ico_shopping_02.png") center no-repeat;
    background-size: contain
}

.ico-shopping-03 {
    width: 5.8rem;
    height: 5.4rem;
    background: url("/resource/img/mmk/common/shopping/ico_shopping_03.png") center no-repeat;
    background-size: contain
}

.ico-clapping {
    width: 16.2rem;
    height: 16.2rem;
    background: url("/resource/img/mmk/common/shopping/ico_clapping.png") center no-repeat;
    background-size: contain
}

.logo-shopping-01 {
    width: 6.8rem;
    height: 6.8rem;
    background: url("/resource/img/mmk/common/shopping/logo_shopping_01.png") center no-repeat;
    background-size: contain
}

.logo-shopping-02 {
    width: 6.8rem;
    height: 6.8rem;
    background: url("/resource/img/mmk/common/shopping/logo_shopping_02.png") center no-repeat;
    background-size: contain
}

.logo-shopping-03 {
    width: 6.8rem;
    height: 6.8rem;
    background: url("/resource/img/mmk/common/shopping/logo_shopping_03.png") center no-repeat;
    background-size: contain
}

.logo-shopping-04 {
    width: 6.8rem;
    height: 6.8rem;
    background: url("/resource/img/mmk/common/shopping/logo_shopping_04.png") center no-repeat;
    background-size: contain
}

.logo-shopping-05 {
    width: 6.8rem;
    height: 6.8rem;
    background: url("/resource/img/mmk/common/shopping/logo_shopping_05.png") center no-repeat;
    background-size: contain
}

.logo-shopping-06 {
    width: 6.8rem;
    height: 6.8rem;
    background: url("/resource/img/mmk/common/shopping/logo_shopping_06.png") center no-repeat;
    background-size: contain
}

.logo-shopping-07 {
    width: 6.8rem;
    height: 6.8rem;
    background: url("/resource/img/mmk/common/shopping/logo_shopping_07.png") center no-repeat;
    background-size: contain
}

.logo-shopping-08 {
    width: 6.8rem;
    height: 6.8rem;
    background: url("/resource/img/mmk/common/shopping/logo_shopping_08.png") center no-repeat;
    background-size: contain
}

.logo-shopping-09 {
    width: 6.8rem;
    height: 6.8rem;
    background: url("/resource/img/mmk/common/shopping/logo_shopping_09.png") center no-repeat;
    background-size: contain
}

.logo-shopping-10 {
    width: 6.8rem;
    height: 6.8rem;
    background: url("/resource/img/mmk/common/shopping/logo_shopping_10.png") center no-repeat;
    background-size: contain
}

.logo-shopping-11 {
    width: 6.8rem;
    height: 6.8rem;
    background: url("/resource/img/mmk/common/shopping/logo_shopping_11.png") center no-repeat;
    background-size: contain
}

.logo-shopping-12 {
    width: 6.8rem;
    height: 6.8rem;
    background: url("/resource/img/mmk/common/shopping/logo_shopping_12.png") center no-repeat;
    background-size: contain
}

.logo-shopping-13 {
    width: 6.8rem;
    height: 6.8rem;
    background: url("/resource/img/mmk/common/shopping/logo_shopping_13.png") center no-repeat;
    background-size: contain
}

.logo-shopping-14 {
    width: 6.8rem;
    height: 6.8rem;
    background: url("/resource/img/mmk/common/shopping/logo_shopping_14.png") center no-repeat;
    background-size: contain
}

.logo-shopping-15 {
    width: 6.8rem;
    height: 6.8rem;
    background: url("/resource/img/mmk/common/shopping/logo_shopping_15.png") center no-repeat;
    background-size: contain
}

.logo-shopping-16 {
    width: 6.8rem;
    height: 6.8rem;
    background: url("/resource/img/mmk/common/shopping/logo_shopping_16.png") center no-repeat;
    background-size: contain
}

.logo-shopping-17 {
    width: 6.8rem;
    height: 6.8rem;
    background: url("/resource/img/mmk/common/shopping/logo_shopping_17.png") center no-repeat;
    background-size: contain
}

.logo-shopping-18 {
    width: 6.8rem;
    height: 6.8rem;
    background: url("/resource/img/mmk/common/shopping/logo_shopping_18.png") center no-repeat;
    background-size: contain
}

.logo-shopping-19 {
    width: 6.8rem;
    height: 6.8rem;
    background: url("/resource/img/mmk/common/shopping/logo_shopping_19.png") center no-repeat;
    background-size: contain
}

.logo-shopping-20 {
    width: 6.8rem;
    height: 6.8rem;
    background: url("/resource/img/mmk/common/shopping/logo_shopping_20.png") center no-repeat;
    background-size: contain
}

.logo-shopping-21 {
    width: 6.8rem;
    height: 6.8rem;
    background: url("/resource/img/mmk/common/shopping/logo_shopping_21.png") center no-repeat;
    background-size: contain
}

.logo-shopping-22 {
    width: 6.8rem;
    height: 6.8rem;
    background: url("/resource/img/mmk/common/shopping/logo_shopping_22.png") center no-repeat;
    background-size: contain
}

.logo-shopping-23 {
    width: 6.8rem;
    height: 6.8rem;
    background: url("/resource/img/mmk/common/shopping/logo_shopping_23.png") center no-repeat;
    background-size: contain
}

.logo-shopping-24 {
    width: 6.8rem;
    height: 6.8rem;
    background: url("/resource/img/mmk/common/shopping/logo_shopping_24.png") center no-repeat;
    background-size: contain
}

.logo-shopping-25 {
    width: 6.8rem;
    height: 6.8rem;
    background: url("/resource/img/mmk/common/shopping/logo_shopping_25.png") center no-repeat;
    background-size: contain
}

.logo-shopping-26 {
    width: 6.8rem;
    height: 6.8rem;
    background: url("/resource/img/mmk/common/shopping/logo_shopping_26.png") center no-repeat;
    background-size: contain
}

.logo-shopping-27 {
    width: 6.8rem;
    height: 6.8rem;
    background: url("/resource/img/mmk/common/shopping/logo_shopping_27.png") center no-repeat;
    background-size: contain
}

.logo-shopping-28 {
    width: 6.8rem;
    height: 6.8rem;
    background: url("/resource/img/mmk/common/shopping/logo_shopping_28.png") center no-repeat;
    background-size: contain
}

/*!
* component element
* icon
* CHPFMTASK-1124 슈퍼쇼핑
*/

.ico-success.shopping {
    width: 6.4rem;
    height: 6.4rem;
    -webkit-filter: var(--filter-in700);
    filter: var(--filter-in700)
}

.ico-point-set {
    width: 2.2rem;
    height: 2rem;
    background: url("/resource/img/mmk/common/shopping/ico_point_set.png") center no-repeat;
    background-size: contain
}

/*!
*  component element
*  icon
*  CHPFMTASK-1019
*/

.ico-folding-pin {
    width: 2rem;
    height: 2rem;
    background-image: url("/resource/img/mmk/common/ico_folding_pin.png")
}

/*!
*  component element
*  icon
*  CHPFMTASK-722
*/

.ico-home-loan {
    width: 3.4rem;
    height: 3.4rem;
    background-image: url("../../img/mmk/common/ico_home_loan.png")
}

.ico-credit-loan {
    width: 3.4rem;
    height: 3.4rem;
    background-image: url("../../img/mmk/common/ico_credit_loan.png")
}

.ico-coin-loan {
    width: 3.4rem;
    height: 3.4rem;
    background-image: url("../../img/mmk/common/ico_coin_loan.png")
}

/*!
*  component element
*  icon
*  CHPFMTASK-1363
*/

.ico-circle-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 4rem;
    height: 4rem;
    border-radius: 100%;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.ico-circle-wrap.circle-bg-gray01 {
    background-color: #f3f5f7
}

.ico-circle-wrap.bg-base {
    background-color: var(--bg-base)
}

.ico-circle-wrap.bg-ter {
    background-color: var(--bg-ter)
}

.ico-circle-wrap.bg-g200 {
    background-color: var(--color-grey-g200)
}

.ico-circle-wrap.bg-g300 {
    background: var(--color-grey-g300)
}

.ico-circle-wrap.w20 {
    width: 2rem;
    height: 2rem
}

.ico-circle-wrap.w36 {
    width: 3.6rem;
    height: 3.6rem
}

.ico-circle-wrap.w44 {
    width: 4.4rem;
    height: 4.4rem
}

.ico-circle-wrap.w52 {
    width: 5.2rem;
    height: 5.2rem
}

.ico-circle-wrap.w60 {
    width: 6rem;
    height: 6rem
}

.ico-circle-wrap[class*=ico-colored].w36 {
    background-size: 2.8rem
}

.ico-circle-wrap[class*=ico-pb],
.ico-circle-wrap[class*=img-feeling] {
    background-size: 87.5% !important;
    background-position: center !important
}

.ico-circle-wrap.ico-pb-001 {
    background-image: var(--path-solid-colored-bag_krw) !important
}

.ico-circle-wrap.ico-pb-002 {
    background-image: var(--path-solid-colored-chat_heart) !important
}

.ico-circle-wrap.ico-pb-003 {
    background-image: var(--path-solid-colored-airplain) !important
}

.ico-circle-wrap.ico-pb-004 {
    background-image: var(--path-solid-colored-car) !important
}

.ico-circle-wrap.ico-pb-005 {
    background-image: var(--path-solid-colored-home) !important
}

.ico-circle-wrap.ico-pb-006 {
    background-image: var(--path-solid-colored-rocket) !important
}

.ico-circle-wrap.ico-pb-007 {
    background-image: var(--path-solid-colored-confetti) !important
}

.ico-circle-wrap.ico-pb-008 {
    background-image: var(--path-solid-colored-investment) !important
}

.ico-circle-wrap.ico-pb-009 {
    background-image: var(--path-solid-colored-ring) !important
}

.ico-circle-wrap.ico-pb-010 {
    background-image: var(--path-solid-colored-graduation) !important
}

.ico-circle-wrap.img-feeling-h01 {
    background-image: url("/resource/img/mmk/common/feeling/new/img_happy_01_s.png") !important
}

.ico-circle-wrap.img-feeling-h02 {
    background-image: url("/resource/img/mmk/common/feeling/new/img_happy_02_s.png") !important
}

.ico-circle-wrap.img-feeling-h03 {
    background-image: url("/resource/img/mmk/common/feeling/new/img_happy_03_s.png") !important
}

.ico-circle-wrap.img-feeling-h04 {
    background-image: url("/resource/img/mmk/common/feeling/new/img_happy_04_s.png") !important
}

.ico-circle-wrap.img-feeling-h05 {
    background-image: url("/resource/img/mmk/common/feeling/new/img_happy_05_s.png") !important
}

.ico-circle-wrap.img-feeling-s01 {
    background-image: url("/resource/img/mmk/common/feeling/new/img_soso_01_s.png") !important
}

.ico-circle-wrap.img-feeling-s02 {
    background-image: url("/resource/img/mmk/common/feeling/new/img_soso_02_s.png") !important
}

.ico-circle-wrap.img-feeling-s03 {
    background-image: url("/resource/img/mmk/common/feeling/new/img_soso_03_s.png") !important
}

.ico-circle-wrap.img-feeling-s04 {
    background-image: url("/resource/img/mmk/common/feeling/new/img_soso_04_s.png") !important
}

.ico-circle-wrap.img-feeling-s05 {
    background-image: url("/resource/img/mmk/common/feeling/new/img_soso_05_s.png") !important
}

.ico-circle-wrap.img-feeling-d01 {
    background-image: url("/resource/img/mmk/common/feeling/new/img_sad_01_s.png") !important
}

.ico-circle-wrap.img-feeling-d02 {
    background-image: url("/resource/img/mmk/common/feeling/new/img_sad_02_s.png") !important
}

.ico-circle-wrap.img-feeling-d03 {
    background-image: url("/resource/img/mmk/common/feeling/new/img_sad_03_s.png") !important
}

.ico-circle-wrap.img-feeling-d04 {
    background-image: url("/resource/img/mmk/common/feeling/new/img_sad_04_s.png") !important
}

.ico-circle-wrap.img-feeling-d05 {
    background-image: url("/resource/img/mmk/common/feeling/new/img_sad_05_s.png") !important
}

.ico-circle-wrap.img-feeling-a01 {
    background-image: url("/resource/img/mmk/common/feeling/new/img_anger_01_s.png") !important
}

.ico-circle-wrap.img-feeling-a02 {
    background-image: url("/resource/img/mmk/common/feeling/new/img_anger_02_s.png") !important
}

.ico-circle-wrap.img-feeling-a03 {
    background-image: url("/resource/img/mmk/common/feeling/new/img_anger_03_s.png") !important
}

.ico-circle-wrap.img-feeling-a04 {
    background-image: url("/resource/img/mmk/common/feeling/new/img_anger_04_s.png") !important
}

.ico-circle-wrap.img-feeling-a05 {
    background-image: url("/resource/img/mmk/common/feeling/new/img_anger_05_s.png") !important
}

.ico-circle-wrap.ico-nfc {
    background-size: 1.2rem;
    background-color: var(--bg-ter);
    border: 1px solid var(--border-ter)
}

.ico-home-loan01 {
    width: 2.4rem;
    height: 2.4rem;
    background-image: url(../../img/mmk/common/ico_home_loan_big_02.png)
}

.ico-my-num-01 {
    width: 2rem;
    height: 2rem;
    background-image: url(../../img/mmk/common/my_num_1.png)
}

.ico-my-num-02 {
    width: 2rem;
    height: 2rem;
    background-image: url(../../img/mmk/common/my_num_2.png)
}

.ico-my-num-03 {
    width: 2rem;
    height: 2rem;
    background-image: url(../../img/mmk/common/my_num_3.png)
}

.ico-my-num-04 {
    width: 2rem;
    height: 2rem;
    background-image: url(../../img/mmk/common/my_num_4.png)
}

/*!
* component element
* icon
* CHPFMTASK-846/861/855 홈 개편
*/

.ico-info-detail-lock {
    width: 2.4rem;
    height: 2.4rem;
    background-image: url("/resource/img/mmk/home/icon_lock.svg")
}

.ico-info-detail-lock.w36 {
    width: 3.6rem;
    height: 3.6rem
}

.ico-info-detail-warning {
    width: 2.4rem;
    height: 2.4rem;
    background-image: url("/resource/img/mmk/home/icon_warning.svg")
}

.ico-info-detail-empty {
    width: 2.4rem;
    height: 2.4rem;
    background-image: url("/resource/img/mmk/home/icon_account_empty.svg")
}

.ico-info-detail-empty.w40 {
    width: 4rem;
    height: 4rem
}

.ico-info-detail-deposit {
    width: 2.4rem;
    height: 2.4rem;
    background-image: url("/resource/img/mmk/home/icon_deposit.svg")
}

.ico-info-detail-withdrawal {
    width: 2.4rem;
    height: 2.4rem;
    background-image: url("/resource/img/mmk/home/icon_withdrawal.svg")
}

.ico-info-detail-withdrawal.w28 {
    width: 2.8rem;
    height: 2.8rem
}

.ico-info-detail-pocket {
    width: 2.4rem;
    height: 2.4rem;
    background-image: url("/resource/img/mmk/home/icon_pocket.svg")
}

.ico-info-detail-calendar {
    width: 2.4rem;
    height: 2.4rem;
    background-image: url("/resource/img/mmk/home/icon_calendar.svg")
}

.ico-info-detail-calendar.w28 {
    width: 2.8rem;
    height: 2.8rem
}

.ico-info-detail-calendar-check {
    width: 2.4rem;
    height: 2.4rem;
    background-image: url("/resource/img/mmk/home/icon_calendar_check.svg")
}

.ico-info-detail-calendar-error {
    width: 2.4rem;
    height: 2.4rem;
    background-image: url("/resource/img/mmk/home/icon_calendar_error.svg")
}

.ico-info-detail-calendar-money {
    width: 2.4rem;
    height: 2.4rem;
    background-image: url("/resource/img/mmk/home/icon_calendar_money.svg")
}

.ico-info-detail-calendar-money.w28 {
    width: 2.8rem;
    height: 2.8rem
}

.ico-info-detail-card-empty {
    width: 2.4rem;
    height: 2.4rem;
    background-image: url("/resource/img/mmk/home/icon_card_empty.svg")
}

.ico-info-detail-pocket-empty {
    width: 2.4rem;
    height: 2.4rem;
    background-image: url("/resource/img/mmk/home/icon_pocket_empty.svg")
}

.ico-info-detail-deposit1 {
    width: 2.4rem;
    height: 2.4rem;
    background-image: url("/resource/img/mmk/home/icon_deposit1.svg")
}

.ico-info-detail-deposit1.w28 {
    width: 2.8rem;
    height: 2.8rem
}

.ico-info-detail-book {
    width: 2.4rem;
    height: 2.4rem;
    background-image: url("/resource/img/mmk/home/icon_book.svg")
}

.ico-info-detail-book.w28 {
    width: 2.8rem;
    height: 2.8rem
}

.ico-credit-gage {
    width: 3.2rem;
    height: 3.2rem;
    background-image: url("/resource/img/mmk/home/icon_ceo_ico_ceocredit.png");
    background-position: center 0;
    background-size: 3.2rem 3.2rem
}

.ico-ceo-seal {
    width: 3.2rem;
    height: 3.2rem;
    background-image: url("/resource/img/mmk/home/icon_ceo_ico_seal.png")
}

.ico-ceo-ceohome {
    width: 3.2rem;
    height: 3.2rem;
    background-image: url("/resource/img/mmk/home/icon_ceo_ceohome.png")
}

.ico-ceo-plusbox {
    width: 3.2rem;
    height: 3.2rem;
    background-image: url("/resource/img/mmk/home/icon_ceo_plusbox.png")
}

.ico-ceo-calendar {
    width: 3.2rem;
    height: 3.2rem;
    background-image: url("/resource/img/mmk/home/icon_ceo_calendar.png")
}

.ico-ceo-account {
    width: 3.2rem;
    height: 3.2rem;
    background-image: url("/resource/img/mmk/home/icon_ceo_account.png")
}

.ico-ceo-market {
    width: 3.2rem;
    height: 3.2rem;
    background-image: url("/resource/img/mmk/home/icon_ceo_market.png")
}

.ico-ceo-freepay {
    width: 3.2rem;
    height: 3.2rem;
    background-image: url("/resource/img/mmk/home/icon_ceo_freepay.png")
}

.ico-w3-dot {
    width: 0.3rem;
    height: 0.3rem;
    border-radius: 99rem;
    background-color: var(--ico-readonly);
    margin: -0.1rem 0.4rem 0
}

.ico-circle-pri-error {
    width: 1.5rem;
    height: 1.5rem;
    background-image: var(--path-solid-colored-exclamation-circle-ico-pri-error)
}

/*!
* component element
* icon : chevron_down(KDS기준 버튼용)
* [KDS] 3.50104 : 2024-05-28 추가(기존 공통이 없어 기존 유지하면서 신규로 공통 생성함.)
*/

.ico-chevron_down {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 50%
}

.ico-chevron_down::after {
    content: '';
    display: block;
    background-image: var(--path-line-chevron-down);
    background-position: center;
    background-size: contain
}

.ico-chevron_down.solid {
    background-color: var(--bg-ter)
}

.ico-chevron_down.stroke {
    border: 1px solid var(--border-qua)
}

.ico-chevron_down.shadow {
    -webkit-box-shadow: 0 0.2rem 0.8rem 0 rgba(0, 0, 0, 0.16);
    box-shadow: 0 0.2rem 0.8rem 0 rgba(0, 0, 0, 0.16);
    background-color: var(--bg-base)
}

.ico-chevron_down.pri.large {
    width: 5.2rem;
    height: 5.2rem
}

.ico-chevron_down.pri.large::after {
    width: 2.8rem;
    height: 2.8rem
}

.ico-chevron_down.pri.small {
    width: 4.4rem;
    height: 4.4rem
}

.ico-chevron_down.pri.small::after {
    width: 2.4rem;
    height: 2.4rem
}

.ico-chevron_down.sec.large {
    width: 3.6rem;
    height: 3.6rem
}

.ico-chevron_down.sec.large::after {
    width: 2rem;
    height: 2rem
}

.ico-chevron_down.sec.small {
    width: 3.2rem;
    height: 3.2rem
}

.ico-chevron_down.sec.small::after {
    width: 1.6rem;
    height: 1.6rem
}

.ico-chevron_down.ter.large {
    width: 2.4rem;
    height: 2.4rem
}

.ico-chevron_down.ter.large::after {
    width: 1.2rem;
    height: 1.2rem
}

.ico-chevron_down.ter.small {
    width: 1.8rem;
    height: 1.8rem
}

.ico-chevron_down.ter.small::after {
    width: 1rem;
    height: 1rem
}

.ico-chevron_down.solid.disabled {
    background-color: var(--bg-pri-disabled)
}

.ico-chevron_down.solid.disabled::after {
    -webkit-filter: var(--filter-g400);
    filter: var(--filter-g400)
}

.ico-chevron_down.stroke.disabled {
    border-color: var(--border-disabled)
}

.ico-chevron_down.stroke.disabled::after {
    -webkit-filter: var(--filter-g400);
    filter: var(--filter-g400)
}

.ico-chevron_down.shadow.disabled {
    -webkit-box-shadow: unset;
    box-shadow: unset;
    border: 1px solid var(--border-disabled)
}

.ico-chevron_down.shadow.disabled::after {
    -webkit-filter: var(--filter-g400);
    filter: var(--filter-g400)
}

.ico-chevron_down.none.disabled::after {
    -webkit-filter: var(--filter-g400);
    filter: var(--filter-g400)
}

.ico-chevron_down.prev {
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg)
}

.ico-chevron_down.next {
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg)
}

/*!
* component element
* icon : ETC(KDS기준 버튼용)
* [KDS] 3.50104 : 2024-05-29 추가
*/

.ico-etc-warning {
    width: 1.6rem;
    height: 1.6rem;
    background-image: var(--path-etc-warning)
}

.ico-etc-new {
    width: .8rem;
    height: .8rem;
    background-image: var(--path-etc-new)
}

.ico-etc-twinkle {
    width: 1.6rem;
    height: 1.6rem;
    background-image: var(--path-etc-twinkle)
}

/*!
*  component element
*  icon
*  CHPFMTASK-932 카드신청
*/

.ico-flip {
    background: url("/resource/img/mmk/common/ico_flip.svg") center no-repeat;
    background-size: contain
}

/*!
* component element
* icon
* CHPFMTASK-890 입출금리워드
*/

.ico-inandout-reward {
    width: 3.2rem;
    height: 4.5rem;
    background: url("../../img/mmk/common/inandout/ico_inandout_reward.png") center no-repeat;
    background-size: contain
}

.ico-inandout-blue {
    width: 1.1rem;
    height: 1.7rem;
    background-image: url("../../img/mmk/common/inandout/ico_in-and-out_blue.png")
}

.ico-inandout-gold {
    width: 1.1rem;
    height: 1.7rem;
    background-image: url("../../img/mmk/common/inandout/ico_in-and-out_gold.png")
}

.ico-inandout-service-blue {
    width: 3.2rem;
    height: 4.5rem;
    background-image: url("../../img/mmk/common/inandout/ico_inandout_blue.png")
}

.ico-inandout-service-gold {
    width: 3.2rem;
    height: 4.5rem;
    background-image: url("../../img/mmk/common/inandout/ico_inandout_gold.png")
}

.ico-inandout-coin {
    width: 6rem;
    height: 6rem;
    background-image: url("../../../../resource/img/mmk/common/inandout/ico_coin-front.png")
}

.ico-inandout-calendar,
.ico-inandout-pocket,
.ico-inandout-receive,
.ico-inandout-send {
    width: 7.2rem;
    height: 7.2rem
}

.ico-inandout-pocket {
    background-image: url("../../../../resource/img/mmk/common/inandout/ico_inandout_pocket_g.png")
}

.ico-inandout-receive {
    background-image: url("../../../../resource/img/mmk/common/inandout/ico_inandout_receive.png")
}

.ico-inandout-send {
    background-image: url("../../../../resource/img/mmk/common/inandout/ico_inandout_send.png")
}

.ico-inandout-calendar {
    background-image: url("../../../../resource/img/mmk/common/inandout/ico_inandout_calendar.png")
}

.ico-inandout-atm,
.ico-inandout-phone,
.ico-inandout-random,
.ico-inandout-tax {
    width: 7.2rem;
    height: 7.2rem
}

.ico-inandout-phone {
    background-image: url("../../../../resource/img/mmk/common/inandout/ico_inandout_phone.png")
}

.ico-inandout-tax {
    background-image: url("../../../../resource/img/mmk/common/inandout/ico_inandout_tax.png")
}

.ico-inandout-atm {
    background-image: url("../../../../resource/img/mmk/common/inandout/ico_inandout_atm.png")
}

.ico-inandout-random {
    background-image: url("../../../../resource/img/mmk/common/inandout/ico_inandout_random.png")
}

/*!
*  component element
*  icon
*  CHPFMTASK-1135 국내채권
*/

.ico-bond-percent {
    width: 3.2rem;
    height: 3.2rem;
    background-image: url("/resource/img/mmk/common/ico_bond_percent.png")
}

/*!
* component element
* icon
* CHPFMTASK-1154 : 홈 개편 > 투자
*/

.ico-home-invest-bit {
    width: 3.4rem;
    height: 3.4rem;
    background-image: url("../../img/mmk/home/invest/ico_main_invest_bit.png")
}

.ico-home-invest-mon {
    width: 3.4rem;
    height: 3.4rem;
    background-image: url("../../img/mmk/home/invest/ico_main_invest_mon.png")
}

.ico-home-invest-switch {
    border-radius: 99rem;
    width: 4.4rem;
    height: 4.4rem;
    background-image: url("../../img/mmk/home/invest/ico_switch_hori.svg");
    background-color: var(--bg-base)
}

.ico-home-invest-won {
    border-radius: 99rem;
    width: 4.4rem;
    height: 4.4rem;
    background-image: url("../../img/mmk/home/invest/ico_won.svg");
    background-color: var(--color-g700)
}

/*!
*  component element
*  icon
*  CHPFMTASK-1155 투자 > 인사이트
*  투자온도, 투자온도 안내(스와이프), 업종별 투자온도에 공통으로 같은 이미지 사용함.
*/

.ico-weather-temperature {
    width: 3rem;
    height: 3rem
}

.ico-weather-temperature.hottest {
    background-image: url("../../img/mmk/home/invest/bg_hottest.png")
}

.ico-weather-temperature.hot {
    background-image: url("../../img/mmk/home/invest/bg_hot.png")
}

.ico-weather-temperature.good {
    background-image: url("../../img/mmk/home/invest/bg_good.png")
}

.ico-weather-temperature.cold {
    background-image: url("../../img/mmk/home/invest/bg_cold.png")
}

.ico-weather-temperature.coldest {
    background-image: url("../../img/mmk/home/invest/bg_coldest.png")
}

.ico-weather-temperature.ver2.hottest {
    background-image: url("../../img/mmk/home/invest/bg_sm_hottest.png")
}

.ico-weather-temperature.ver2.hot {
    background-image: url("../../img/mmk/home/invest/bg_sm_hot.png")
}

.ico-weather-temperature.ver2.good {
    background-image: url("../../img/mmk/home/invest/bg_sm_good.png")
}

.ico-weather-temperature.ver2.cold {
    background-image: url("../../img/mmk/home/invest/bg_sm_cold.png")
}

.ico-weather-temperature.ver2.coldest {
    background-image: url("../../img/mmk/home/invest/bg_sm_coldest.png")
}

/*!
*  component element
*  icon
*  CHPFMTASK-1167 카드신청
*/

.ico-cash-coin {
    width: 2.4rem;
    height: 2.4rem;
    background-image: url("/resource/img/mmk/svg_common/ico_cash_coin.svg")
}

.ico-clover {
    width: 4.8rem;
    height: 4.8rem;
    background: url("/resource/img/mmk/common/img_benefit_01.png") no-repeat 0 0;
    background-size: 100%
}

.ico-lighting {
    width: 4.8rem;
    height: 4.8rem;
    background: url("/resource/img/mmk/common/img_benefit_02.png") no-repeat 0 0;
    background-size: 100%
}

.ico-dice {
    width: 4.8rem;
    height: 4.8rem;
    background: url("/resource/img/mmk/common/img_benefit_03.png") no-repeat 0 0;
    background-size: 100%
}

/*!
*  component element
*  icon
*  CHPFMTASK-1132 AI LIVE
*/

.ico-quizbot {
    width: 3.6rem;
    height: 3.6rem;
    margin: 0;
    border-radius: 99rem;
    border: 1px solid var(--border-img);
    background-image: url("/resource/img/mmk/common/ailive/quizbot.svg");
    background-color: var(--bg-sec)
}

.ico-grip {
    width: 6.4rem;
    height: 6.4rem;
    background-image: url("/resource/img/mmk/common/ailive/logo_grip.svg")
}

.ico-bulb01 {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-bulb)
}

.ico-solar {
    width: 3.6rem;
    height: 3.6rem;
    background-image: url("/resource/img/mmk/common/ailive/ico_solar_symbol.png");
    background-color: var(--bg-base);
    border-radius: 999rem;
    border: 1px solid var(--border-img)
}

.ico-solar.w24 {
    width: 2.4rem;
    height: 2.4rem
}

/*!
*  component element
*  icon
*  CHPFMTASK-1227 상담중 챗봇
*/

.ico-chatbot-trans {
    width: 4.8rem;
    height: 4.8rem;
    background-image: url("/resource/img/mmk/svg_common/chatbot_trans.svg")
}

/*!
* component element
* icon
* CHPFMTASK-1314 ONE 체크카드 상세페이지
*/

.ico-money-fee {
    width: 3.2rem;
    height: 3.2rem;
    background-image: url("/resource/img/mmk/svg_common/ico_money_fee.svg")
}

.ico-light {
    width: 3.2rem;
    height: 3.2rem;
    background-image: url("/resource/img/mmk/svg_common/ico_light.svg")
}

.ico-bus {
    width: 3.2rem;
    height: 3.2rem;
    background-image: url("/resource/img/mmk/svg_common/ico_bus.svg")
}

.ico-doc {
    width: 3.4rem;
    height: 3.4rem;
    background-image: url("/resource/img/mmk/svg_common/ico_doc.svg")
}

.ico-notice-blue {
    width: 1.6rem;
    height: 1.6rem;
    background-image: url("/resource/img/mmk/common/ico_notice_blue.png")
}

.ico-challenge {
    width: 3.2rem;
    height: 3.2rem;
    background-image: url("/resource/img/mmk/common/ico_challenge.png")
}

.ico-check-doc {
    width: 4.8rem;
    height: 4.8rem;
    background-image: url("/resource/img/mmk/common/ico_check_doc.svg")
}

.ico-clock-g {
    width: 2rem;
    height: 2rem;
    background-image: url("/resource/img/mmk/svg_common/ico_clock_g.svg")
}

.ico-clock-gr {
    width: 2rem;
    height: 2rem;
    background-image: url("/resource/img/mmk/svg_common/ico_clock_gr.svg")
}

.ico-arrow-link-bold {
    width: 1.6rem;
    height: 1.6rem;
    background-image: url("/resource/img/mmk/svg_common/chevron_right_bold.svg")
}

.ico-reward-blue {
    width: 2.4rem;
    height: 2.4rem;
    background-image: url("/resource/img/mmk/svg_common/ico_reward_bu.svg")
}

/*!
* component element
* icon
* CHPFMTASK-2283 아낌e보금자리
*/

.ico-line-coin {
    width: 3.2rem;
    height: 3.2rem;
    background-image: url("/resource/img/mmk/svg_common/ico-line-coin.svg")
}

/*!
* component element
* CHPFMTASK-1130 이의제기 신청 > no data
*/

.ico-no-account {
    margin-bottom: 1.6rem;
    width: 8rem;
    height: 8rem;
    background-image: url("/resource/img/bim/my_account_0_navy.png")
}

/*!
* component element
* logo-icon
* CHPFMTASK-1402 : 투자 > 인사이트 > 증권 > 해외 아이콘
*/

.logo-icon-invest {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    overflow: hidden;
    border-radius: 50%;
    position: relative;
    width: 3.4rem;
    height: 3.4rem
}

.logo-icon-invest:after {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    border-radius: 99rem;
    border: 0.5px solid rgba(0, 55, 138, 0.2);
    z-index: 3
}

.logo-icon-invest img.noimg-invest {
    display: block;
    width: 100%
}

.logo-icon-invest img {
    display: block;
    width: 80%
}

.ico-home-coin {
    border-radius: 99rem;
    width: 4.4rem;
    height: 4.4rem;
    background-image: url("/resource/img/mmk/common/pay/1.png");
    background-color: var(--bg-base);
    background-size: cover
}

/*!
* component element
* icon
* CHPFMTASK-1715 [사장님 신용대출] 거절자 랜딩페이지 변경 관련 퍼블리싱 요청의 건
*/

/*!
* component element
* logo-icon
* CHPFMTASK-1203 : KDS 상품상세
*/

.ico-landing-share {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-share)
}

.ico-landing-call {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-call)
}

.ico-landing-talk {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-chat)
}

/*!
* component element
* colored-icon
* CHPFMTASK-1415 : KDS ico / colored
*/

.ico-auth-face-id {
    background-image: url(/resource/img/mmk/kds3_5/ico/auth/face_id.svg)
}

.ico-auth-face-id-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/auth/face_id.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/auth/face_id.svg);
    background-color: var(--bg-sec-active)
}

.ico-auth-fingerprint {
    background-image: url(/resource/img/mmk/kds3_5/ico/auth/fingerprint.svg)
}

.ico-auth-fingerprint-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/auth/fingerprint.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/auth/fingerprint.svg);
    background-color: var(--bg-sec-active)
}

.ico-checkbox-circle {
    background-image: url(/resource/img/mmk/kds3_5/ico/checkbox/circle.svg)
}

.ico-checkbox-circle-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/circle.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/circle.svg);
    background-color: var(--bg-sec-active)
}

.ico-checkbox-circle-active {
    background-image: url(/resource/img/mmk/kds3_5/ico/checkbox/circle-active.svg)
}

.ico-checkbox-circle-active-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/circle-active.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/circle-active.svg);
    background-color: var(--bg-sec-active)
}

.ico-checkbox-circle-disabled {
    background-image: url(/resource/img/mmk/kds3_5/ico/checkbox/circle-disabled.svg)
}

.ico-checkbox-circle-disabled-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/circle-disabled.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/circle-disabled.svg);
    background-color: var(--bg-sec-active)
}

.ico-checkbox-circle-readonly {
    background-image: url(/resource/img/mmk/kds3_5/ico/checkbox/circle-readonly.svg)
}

.ico-checkbox-circle-readonly-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/circle-readonly.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/circle-readonly.svg);
    background-color: var(--bg-sec-active)
}

.ico-checkbox-heart {
    background-image: url(/resource/img/mmk/kds3_5/ico/checkbox/heart.svg)
}

.ico-checkbox-heart-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/heart.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/heart.svg);
    background-color: var(--bg-sec-active)
}

.ico-checkbox-heart-active {
    background-image: url(/resource/img/mmk/kds3_5/ico/checkbox/heart-active.svg)
}

.ico-checkbox-heart-active-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/heart-active.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/heart-active.svg);
    background-color: var(--bg-sec-active)
}

.ico-checkbox-heart-disabled {
    background-image: url(/resource/img/mmk/kds3_5/ico/checkbox/heart-disabled.svg)
}

.ico-checkbox-heart-disabled-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/heart-disabled.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/heart-disabled.svg);
    background-color: var(--bg-sec-active)
}

.ico-checkbox-heart-readonly {
    background-image: url(/resource/img/mmk/kds3_5/ico/checkbox/heart-readonly.svg)
}

.ico-checkbox-heart-readonly-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/heart-readonly.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/heart-readonly.svg);
    background-color: var(--bg-sec-active)
}

.ico-checkbox-line {
    background-image: url(/resource/img/mmk/kds3_5/ico/checkbox/line.svg)
}

.ico-checkbox-line-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/line.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/line.svg);
    background-color: var(--bg-sec-active)
}

.ico-checkbox-line-2depth {
    background-image: url(/resource/img/mmk/kds3_5/ico/checkbox/line-2depth.svg)
}

.ico-checkbox-line-2depth-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/line-2depth.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/line-2depth.svg);
    background-color: var(--bg-sec-active)
}

.ico-checkbox-line-2depth-active {
    background-image: url(/resource/img/mmk/kds3_5/ico/checkbox/line-2depth-active.svg)
}

.ico-checkbox-line-2depth-active-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/line-2depth-active.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/line-2depth-active.svg);
    background-color: var(--bg-sec-active)
}

.ico-checkbox-line-2depth-disabled {
    background-image: url(/resource/img/mmk/kds3_5/ico/checkbox/line-2depth-disabled.svg)
}

.ico-checkbox-line-2depth-disabled-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/line-2depth-disabled.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/line-2depth-disabled.svg);
    background-color: var(--bg-sec-active)
}

.ico-checkbox-line-2depth-readonly {
    background-image: url(/resource/img/mmk/kds3_5/ico/checkbox/line-2depth-readonly.svg)
}

.ico-checkbox-line-2depth-readonly-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/line-2depth-readonly.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/line-2depth-readonly.svg);
    background-color: var(--bg-sec-active)
}

.ico-checkbox-line-active {
    background-image: url(/resource/img/mmk/kds3_5/ico/checkbox/line-active.svg)
}

.ico-checkbox-line-active-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/line-active.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/line-active.svg);
    background-color: var(--bg-sec-active)
}

.ico-checkbox-line-disabled {
    background-image: url(/resource/img/mmk/kds3_5/ico/checkbox/line-disabled.svg)
}

.ico-checkbox-line-disabled-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/line-disabled.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/line-disabled.svg);
    background-color: var(--bg-sec-active)
}

.ico-checkbox-line-readonly {
    background-image: url(/resource/img/mmk/kds3_5/ico/checkbox/line-readonly.svg)
}

.ico-checkbox-line-readonly-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/line-readonly.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/line-readonly.svg);
    background-color: var(--bg-sec-active)
}

.ico-checkbox-pin {
    background-image: url(/resource/img/mmk/kds3_5/ico/checkbox/pin.svg)
}

.ico-checkbox-pin-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/pin.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/pin.svg);
    background-color: var(--bg-sec-active)
}

.ico-checkbox-pin-active {
    background-image: url(/resource/img/mmk/kds3_5/ico/checkbox/pin-active.svg)
}

.ico-checkbox-pin-active-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/pin-active.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/pin-active.svg);
    background-color: var(--bg-sec-active)
}

.ico-checkbox-pin-disabled {
    background-image: url(/resource/img/mmk/kds3_5/ico/checkbox/pin-disabled.svg)
}

.ico-checkbox-pin-disabled-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/pin-disabled.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/pin-disabled.svg);
    background-color: var(--bg-sec-active)
}

.ico-checkbox-pin-readonly {
    background-image: url(/resource/img/mmk/kds3_5/ico/checkbox/pin-readonly.svg)
}

.ico-checkbox-pin-readonly-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/pin-readonly.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/pin-readonly.svg);
    background-color: var(--bg-sec-active)
}

.ico-checkbox-square {
    background-image: url(/resource/img/mmk/kds3_5/ico/checkbox/square.svg)
}

.ico-checkbox-square-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/square.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/square.svg);
    background-color: var(--bg-sec-active)
}

.ico-checkbox-square-active {
    background-image: url(/resource/img/mmk/kds3_5/ico/checkbox/square-active.svg)
}

.ico-checkbox-square-active-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/square-active.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/square-active.svg);
    background-color: var(--bg-sec-active)
}

.ico-checkbox-square-disabled {
    background-image: url(/resource/img/mmk/kds3_5/ico/checkbox/square-disabled.svg)
}

.ico-checkbox-square-disabled-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/square-disabled.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/square-disabled.svg);
    background-color: var(--bg-sec-active)
}

.ico-checkbox-square-readonly {
    background-image: url(/resource/img/mmk/kds3_5/ico/checkbox/square-readonly.svg)
}

.ico-checkbox-square-readonly-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/square-readonly.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/square-readonly.svg);
    background-color: var(--bg-sec-active)
}

.ico-checkbox-star {
    background-image: url(/resource/img/mmk/kds3_5/ico/checkbox/star.svg)
}

.ico-checkbox-star-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/star.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/star.svg);
    background-color: var(--bg-sec-active)
}

.ico-checkbox-star-active {
    background-image: url(/resource/img/mmk/kds3_5/ico/checkbox/star-active.svg)
}

.ico-checkbox-star-active-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/star-active.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/star-active.svg);
    background-color: var(--bg-sec-active)
}

.ico-checkbox-star-disabled {
    background-image: url(/resource/img/mmk/kds3_5/ico/checkbox/star-disabled.svg)
}

.ico-checkbox-star-disabled-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/star-disabled.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/star-disabled.svg);
    background-color: var(--bg-sec-active)
}

.ico-checkbox-star-readonly {
    background-image: url(/resource/img/mmk/kds3_5/ico/checkbox/star-readonly.svg)
}

.ico-checkbox-star-readonly-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/star-readonly.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/checkbox/star-readonly.svg);
    background-color: var(--bg-sec-active)
}

.ico-component-tooltip-anchor-default-black {
    background-image: url(/resource/img/mmk/kds3_5/ico/component/tooltip/anchor_default_black.svg)
}

.ico-component-tooltip-anchor-default-black-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/component/tooltip/anchor_default_black.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/component/tooltip/anchor_default_black.svg);
    background-color: var(--bg-sec-active)
}

.ico-component-tooltip-anchor-default-default {
    background-image: url(/resource/img/mmk/kds3_5/ico/component/tooltip/anchor_default_default.svg)
}

.ico-component-tooltip-anchor-default-default-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/component/tooltip/anchor_default_default.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/component/tooltip/anchor_default_default.svg);
    background-color: var(--bg-sec-active)
}

.ico-component-tooltip-anchor-default-default-blue1 {
    background-image: url(/resource/img/mmk/kds3_5/ico/component/tooltip/anchor_default_default_blue1.svg)
}

.ico-component-tooltip-anchor-default-default-blue1-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/component/tooltip/anchor_default_default_blue1.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/component/tooltip/anchor_default_default_blue1.svg);
    background-color: var(--bg-sec-active)
}

.ico-component-tooltip-anchor-default-white {
    background-image: url(/resource/img/mmk/kds3_5/ico/component/tooltip/anchor_default_white.svg)
}

.ico-component-tooltip-anchor-default-white-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/component/tooltip/anchor_default_white.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/component/tooltip/anchor_default_white.svg);
    background-color: var(--bg-sec-active)
}

.ico-component-tooltip-anchor-small-black {
    background-image: url(/resource/img/mmk/kds3_5/ico/component/tooltip/anchor_small_black.svg)
}

.ico-component-tooltip-anchor-small-black-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/component/tooltip/anchor_small_black.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/component/tooltip/anchor_small_black.svg);
    background-color: var(--bg-sec-active)
}

.ico-component-tooltip-anchor-small-default {
    background-image: url(/resource/img/mmk/kds3_5/ico/component/tooltip/anchor_small_default.svg)
}

.ico-component-tooltip-anchor-small-default-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/component/tooltip/anchor_small_default.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/component/tooltip/anchor_small_default.svg);
    background-color: var(--bg-sec-active)
}

.ico-component-tooltip-anchor-small-white {
    background-image: url(/resource/img/mmk/kds3_5/ico/component/tooltip/anchor_small_white.svg)
}

.ico-component-tooltip-anchor-small-white-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/component/tooltip/anchor_small_white.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/component/tooltip/anchor_small_white.svg);
    background-color: var(--bg-sec-active)
}

.ico-component-tooltip-anchor-test {
    background-image: url(/resource/img/mmk/kds3_5/ico/component/tooltip/anchor_test.svg)
}

.ico-component-tooltip-anchor-test-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/component/tooltip/anchor_test.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/component/tooltip/anchor_test.svg);
    background-color: var(--bg-sec-active)
}

.ico-etc-new {
    background-image: url(/resource/img/mmk/kds3_5/ico/etc/new.svg)
}

.ico-etc-new-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/etc/new.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/etc/new.svg);
    background-color: var(--bg-sec-active)
}

.ico-etc-scroll-down {
    background-image: url(/resource/img/mmk/kds3_5/ico/etc/scroll_down.svg)
}

.ico-etc-scroll-down-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/etc/scroll_down.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/etc/scroll_down.svg);
    background-color: var(--bg-sec-active)
}

.ico-etc-success {
    background-image: url(/resource/img/mmk/kds3_5/ico/etc/success.svg)
}

.ico-etc-success-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/etc/success.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/etc/success.svg);
    background-color: var(--bg-sec-active)
}

.ico-etc-success-effect {
    background-image: url(/resource/img/mmk/kds3_5/ico/etc/success-effect.svg)
}

.ico-etc-success-effect-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/etc/success-effect.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/etc/success-effect.svg);
    background-color: var(--bg-sec-active)
}

.ico-etc-twinkle {
    background-image: url(/resource/img/mmk/kds3_5/ico/etc/twinkle.svg)
}

.ico-etc-twinkle-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/etc/twinkle.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/etc/twinkle.svg);
    background-color: var(--bg-sec-active)
}

.ico-etc-warning {
    background-image: url(/resource/img/mmk/kds3_5/ico/etc/warning.svg)
}

.ico-etc-warning-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/etc/warning.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/etc/warning.svg);
    background-color: var(--bg-sec-active)
}

.ico-etc-warning-effect {
    background-image: url(/resource/img/mmk/kds3_5/ico/etc/warning-effect.svg)
}

.ico-etc-warning-effect-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/etc/warning-effect.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/etc/warning-effect.svg);
    background-color: var(--bg-sec-active)
}

.ico-input-range-chevron-left-right {
    background-image: url(/resource/img/mmk/kds3_5/ico/input_range/chevron_left_right.svg)
}

.ico-input-range-chevron-left-right-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/input_range/chevron_left_right.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/input_range/chevron_left_right.svg);
    background-color: var(--bg-sec-active)
}

.ico-input-range-chevron-left-right-disabled {
    background-image: url(/resource/img/mmk/kds3_5/ico/input_range/chevron_left_right-disabled.svg)
}

.ico-input-range-chevron-left-right-disabled-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/input_range/chevron_left_right-disabled.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/input_range/chevron_left_right-disabled.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-add {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/add.svg)
}

.ico-line-add-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/add.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/add.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-add-circle {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/add_circle.svg)
}

.ico-line-add-circle-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/add_circle.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/add_circle.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-add-s10 {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/add_s10.svg)
}

.ico-line-add-s10-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/add_s10.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/add_s10.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-alarm {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/alarm.svg)
}

.ico-line-alarm-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/alarm.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/alarm.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-arrow-down {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/arrow_down.svg)
}

.ico-line-arrow-down-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/arrow_down.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/arrow_down.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-arrow-down-circle {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/arrow_down_circle.svg)
}

.ico-line-arrow-down-circle-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/arrow_down_circle.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/arrow_down_circle.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-arrow-down-s10 {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/arrow_down_s10.svg)
}

.ico-line-arrow-down-s10-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/arrow_down_s10.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/arrow_down_s10.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-arrow-left {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/arrow_left.svg)
}

.ico-line-arrow-left-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/arrow_left.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/arrow_left.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-arrow-left-right {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/arrow_left_right.svg)
}

.ico-line-arrow-left-right-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/arrow_left_right.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/arrow_left_right.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-arrow-left-s10 {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/arrow_left_s10.svg)
}

.ico-line-arrow-left-s10-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/arrow_left_s10.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/arrow_left_s10.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-arrow-right {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/arrow_right.svg)
}

.ico-line-arrow-right-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/arrow_right.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/arrow_right.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-arrow-right-s10 {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/arrow_right_s10.svg)
}

.ico-line-arrow-right-s10-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/arrow_right_s10.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/arrow_right_s10.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-arrow-up {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/arrow_up.svg)
}

.ico-line-arrow-up-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/arrow_up.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/arrow_up.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-arrow-up-right {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/arrow_up_right.svg)
}

.ico-line-arrow-up-right-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/arrow_up_right.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/arrow_up_right.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-arrow-up-right-s10 {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/arrow_up_right_s10.svg)
}

.ico-line-arrow-up-right-s10-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/arrow_up_right_s10.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/arrow_up_right_s10.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-arrow-up-s10 {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/arrow_up_s10.svg)
}

.ico-line-arrow-up-s10-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/arrow_up_s10.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/arrow_up_s10.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-backspace {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/backspace.svg)
}

.ico-line-backspace-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/backspace.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/backspace.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-building-double {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/building_double.svg)
}

.ico-line-building-double-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/building_double.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/building_double.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-building-double-cancel {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/building_double_cancel.svg)
}

.ico-line-building-double-cancel-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/building_double_cancel.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/building_double_cancel.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-building-double-down {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/building_double_down.svg)
}

.ico-line-building-double-down-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/building_double_down.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/building_double_down.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-bulb {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/bulb.svg)
}

.ico-line-bulb-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/bulb.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/bulb.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-calculator {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/calculator.svg)
}

.ico-line-calculator-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/calculator.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/calculator.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-calendar {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/calendar.svg)
}

.ico-line-calendar-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/calendar.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/calendar.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-calendar-check {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/calendar_check.svg)
}

.ico-line-calendar-check-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/calendar_check.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/calendar_check.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-calendar-search {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/calendar_search.svg)
}

.ico-line-calendar-search-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/calendar_search.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/calendar_search.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-call {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/call.svg)
}

.ico-line-call-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/call.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/call.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-chat {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/chat.svg)
}

.ico-line-chat-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/chat.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/chat.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-check {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/check.svg)
}

.ico-line-check-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/check.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/check.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-check-s10 {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/check_s10.svg)
}

.ico-line-check-s10-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/check_s10.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/check_s10.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-chevron-double-left {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/chevron_double_left.svg)
}

.ico-line-chevron-double-left-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/chevron_double_left.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/chevron_double_left.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-chevron-double-right {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/chevron_double_right.svg)
}

.ico-line-chevron-double-right-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/chevron_double_right.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/chevron_double_right.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-chevron-down {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/chevron_down.svg)
}

.ico-line-chevron-down-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/chevron_down.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/chevron_down.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-chevron-down-s10 {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/chevron_down_s10.svg)
}

.ico-line-chevron-down-s10-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/chevron_down_s10.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/chevron_down_s10.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-chevron-left {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/chevron_left.svg)
}

.ico-line-chevron-left-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/chevron_left.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/chevron_left.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-chevron-left-right {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/chevron_left_right.svg)
}

.ico-line-chevron-left-right-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/chevron_left_right.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/chevron_left_right.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-chevron-left-s10 {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/chevron_left_s10.svg)
}

.ico-line-chevron-left-s10-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/chevron_left_s10.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/chevron_left_s10.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-chevron-right {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/chevron_right.svg)
}

.ico-line-chevron-right-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/chevron_right.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/chevron_right.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-chevron-right-s10 {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/chevron_right_s10.svg)
}

.ico-line-chevron-right-s10-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/chevron_right_s10.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/chevron_right_s10.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-chevron-up {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/chevron_up.svg)
}

.ico-line-chevron-up-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/chevron_up.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/chevron_up.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-chevron-up-s10 {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/chevron_up_s10.svg)
}

.ico-line-chevron-up-s10-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/chevron_up_s10.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/chevron_up_s10.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-clap {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/clap.svg)
}

.ico-line-clap-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/clap.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/clap.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-clip {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/clip.svg)
}

.ico-line-clip-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/clip.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/clip.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-clipboard {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/clipboard.svg)
}

.ico-line-clipboard-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/clipboard.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/clipboard.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-clock {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/clock.svg)
}

.ico-line-clock-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/clock.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/clock.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-close {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/close.svg)
}

.ico-line-close-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/close.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/close.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-close-circle {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/close_circle.svg)
}

.ico-line-close-circle-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/close_circle.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/close_circle.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-close-s10 {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/close_s10.svg)
}

.ico-line-close-s10-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/close_s10.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/close_s10.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-coin {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/coin.svg)
}

.ico-line-coin-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/coin.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/coin.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-coin-double {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/coin_double.svg)
}

.ico-line-coin-double-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/coin_double.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/coin_double.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-colored-heart-ico-ter {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/colored/heart_ico-ter.svg)
}

.ico-line-colored-heart-ico-ter-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/colored/heart_ico-ter.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/colored/heart_ico-ter.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-colored-pin-ico-ter {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/colored/pin_ico-ter.svg)
}

.ico-line-colored-pin-ico-ter-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/colored/pin_ico-ter.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/colored/pin_ico-ter.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-colored-star-ico-ter {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/colored/star_ico-ter.svg)
}

.ico-line-colored-star-ico-ter-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/colored/star_ico-ter.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/colored/star_ico-ter.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-copy {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/copy.svg)
}

.ico-line-copy-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/copy.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/copy.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-del {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/del.svg)
}

.ico-line-del-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/del.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/del.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-desktop {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/desktop.svg)
}

.ico-line-desktop-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/desktop.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/desktop.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-document {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/document.svg)
}

.ico-line-document-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/document.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/document.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-download {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/download.svg)
}

.ico-line-download-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/download.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/download.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-drag-handle {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/drag_handle.svg)
}

.ico-line-drag-handle-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/drag_handle.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/drag_handle.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-drag-handle-s10 {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/drag_handle_s10.svg)
}

.ico-line-drag-handle-s10-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/drag_handle_s10.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/drag_handle_s10.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-edit {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/edit.svg)
}

.ico-line-edit-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/edit.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/edit.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-exclamation-circle {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/exclamation_circle.svg)
}

.ico-line-exclamation-circle-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/exclamation_circle.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/exclamation_circle.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-filter {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/filter.svg)
}

.ico-line-filter-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/filter.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/filter.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-gift {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/gift.svg)
}

.ico-line-gift-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/gift.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/gift.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-glob {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/glob.svg)
}

.ico-line-glob-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/glob.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/glob.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-gold {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/gold.svg)
}

.ico-line-gold-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/gold.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/gold.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-headset {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/headset.svg)
}

.ico-line-headset-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/headset.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/headset.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-heart {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/heart.svg)
}

.ico-line-heart-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/heart.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/heart.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-hide {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/hide.svg)
}

.ico-line-hide-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/hide.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/hide.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-home {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/home.svg)
}

.ico-line-home-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/home.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/home.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-info-circle {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/info_circle.svg)
}

.ico-line-info-circle-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/info_circle.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/info_circle.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-like {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/like.svg)
}

.ico-line-like-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/like.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/like.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-link {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/link.svg)
}

.ico-line-link-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/link.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/link.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-lock {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/lock.svg)
}

.ico-line-lock-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/lock.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/lock.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-mail {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/mail.svg)
}

.ico-line-mail-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/mail.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/mail.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-menu {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/menu.svg)
}

.ico-line-menu-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/menu.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/menu.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-mic {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/mic.svg)
}

.ico-line-mic-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/mic.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/mic.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-minus {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/minus.svg)
}

.ico-line-minus-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/minus.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/minus.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-minus-circle {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/minus_circle.svg)
}

.ico-line-minus-circle-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/minus_circle.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/minus_circle.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-minus-s10 {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/minus_s10.svg)
}

.ico-line-minus-s10-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/minus_s10.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/minus_s10.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-more-hori {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/more_hori.svg)
}

.ico-line-more-hori-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/more_hori.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/more_hori.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-more-vert {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/more_vert.svg)
}

.ico-line-more-vert-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/more_vert.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/more_vert.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-none {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/none.svg)
}

.ico-line-none-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/none.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/none.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-phone {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/phone.svg)
}

.ico-line-phone-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/phone.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/phone.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-pin {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/pin.svg)
}

.ico-line-pin-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/pin.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/pin.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-qr-code {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/qr_code.svg)
}

.ico-line-qr-code-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/qr_code.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/qr_code.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-question-circle {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/question_circle.svg)
}

.ico-line-question-circle-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/question_circle.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/question_circle.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-refresh {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/refresh.svg)
}

.ico-line-refresh-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/refresh.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/refresh.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-rotate {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/rotate.svg)
}

.ico-line-rotate-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/rotate.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/rotate.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-scroll-down {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/scroll_down.svg)
}

.ico-line-scroll-down-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/scroll_down.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/scroll_down.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-search {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/search.svg)
}

.ico-line-search-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/search.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/search.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-setting {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/setting.svg)
}

.ico-line-setting-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/setting.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/setting.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-share {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/share.svg)
}

.ico-line-share-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/share.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/share.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-shopping {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/shopping.svg)
}

.ico-line-shopping-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/shopping.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/shopping.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-show {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/show.svg)
}

.ico-line-show-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/show.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/show.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-star {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/star.svg)
}

.ico-line-star-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/star.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/star.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-switch-vert {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/switch_vert.svg)
}

.ico-line-switch-vert-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/switch_vert.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/switch_vert.svg);
    background-color: var(--bg-sec-active)
}

.ico-line-user {
    background-image: url(/resource/img/mmk/kds3_5/ico/line/user.svg)
}

.ico-line-user-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/user.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/user.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-account {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/account.svg)
}

.ico-solid-account-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/account.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/account.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-account-arrow-left-right {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/account_arrow_left_right.svg)
}

.ico-solid-account-arrow-left-right-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/account_arrow_left_right.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/account_arrow_left_right.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-account-arrow-up {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/account_arrow_up.svg)
}

.ico-solid-account-arrow-up-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/account_arrow_up.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/account_arrow_up.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-account-glob {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/account_glob.svg)
}

.ico-solid-account-glob-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/account_glob.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/account_glob.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-account-loan {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/account_loan.svg)
}

.ico-solid-account-loan-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/account_loan.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/account_loan.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-account-search {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/account_search.svg)
}

.ico-solid-account-search-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/account_search.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/account_search.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-account-show {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/account_show.svg)
}

.ico-solid-account-show-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/account_show.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/account_show.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-add-circle {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/add_circle.svg)
}

.ico-solid-add-circle-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/add_circle.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/add_circle.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-ai {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/ai.svg)
}

.ico-solid-ai-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/ai.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/ai.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-alarm {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/alarm.svg)
}

.ico-solid-alarm-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/alarm.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/alarm.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-alarm-usd {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/alarm_usd.svg)
}

.ico-solid-alarm-usd-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/alarm_usd.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/alarm_usd.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-arrow-down {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/arrow_down.svg)
}

.ico-solid-arrow-down-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/arrow_down.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/arrow_down.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-arrow-left-right {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/arrow_left_right.svg)
}

.ico-solid-arrow-left-right-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/arrow_left_right.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/arrow_left_right.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-arrow-up {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/arrow_up.svg)
}

.ico-solid-arrow-up-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/arrow_up.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/arrow_up.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-backspace {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/backspace.svg)
}

.ico-solid-backspace-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/backspace.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/backspace.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-basket {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/basket.svg)
}

.ico-solid-basket-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/basket.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/basket.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-bitcoin {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/bitcoin.svg)
}

.ico-solid-bitcoin-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/bitcoin.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/bitcoin.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-bolt {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/bolt.svg)
}

.ico-solid-bolt-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/bolt.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/bolt.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-box {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/box.svg)
}

.ico-solid-box-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/box.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/box.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-box-krw {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/box_krw.svg)
}

.ico-solid-box-krw-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/box_krw.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/box_krw.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-building {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/building.svg)
}

.ico-solid-building-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/building.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/building.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-calculator {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/calculator.svg)
}

.ico-solid-calculator-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/calculator.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/calculator.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-calendar {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/calendar.svg)
}

.ico-solid-calendar-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/calendar.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/calendar.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-calendar-check {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/calendar_check.svg)
}

.ico-solid-calendar-check-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/calendar_check.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/calendar_check.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-calendar-search {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/calendar_search.svg)
}

.ico-solid-calendar-search-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/calendar_search.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/calendar_search.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-call {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/call.svg)
}

.ico-solid-call-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/call.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/call.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-card {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/card.svg)
}

.ico-solid-card-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/card.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/card.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-card-circle {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/card_circle.svg)
}

.ico-solid-card-circle-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/card_circle.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/card_circle.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-chat {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/chat.svg)
}

.ico-solid-chat-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/chat.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/chat.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-chat-circle {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/chat_circle.svg)
}

.ico-solid-chat-circle-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/chat_circle.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/chat_circle.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-check {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/check.svg)
}

.ico-solid-check-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/check.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/check.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-check-circle {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/check_circle.svg)
}

.ico-solid-check-circle-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/check_circle.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/check_circle.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-chevron-down {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/chevron_down.svg)
}

.ico-solid-chevron-down-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/chevron_down.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/chevron_down.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-chevron-left {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/chevron_left.svg)
}

.ico-solid-chevron-left-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/chevron_left.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/chevron_left.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-chevron-right {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/chevron_right.svg)
}

.ico-solid-chevron-right-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/chevron_right.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/chevron_right.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-chevron-up {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/chevron_up.svg)
}

.ico-solid-chevron-up-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/chevron_up.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/chevron_up.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-clipboard-krw {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/clipboard_krw.svg)
}

.ico-solid-clipboard-krw-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/clipboard_krw.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/clipboard_krw.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-clock {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/clock.svg)
}

.ico-solid-clock-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/clock.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/clock.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-close-circle {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/close_circle.svg)
}

.ico-solid-close-circle-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/close_circle.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/close_circle.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-coin {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/coin.svg)
}

.ico-solid-coin-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/coin.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/coin.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-account {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/account.svg)
}

.ico-solid-colored-account-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/account.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/account.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-account-add {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/account_add.svg)
}

.ico-solid-colored-account-add-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/account_add.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/account_add.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-account-deposit {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/account_deposit.svg)
}

.ico-solid-colored-account-deposit-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/account_deposit.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/account_deposit.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-account-error {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/account_error.svg)
}

.ico-solid-colored-account-error-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/account_error.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/account_error.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-account-loan {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/account_loan.svg)
}

.ico-solid-colored-account-loan-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/account_loan.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/account_loan.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-account-success {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/account_success.svg)
}

.ico-solid-colored-account-success-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/account_success.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/account_success.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-account-switch {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/account_switch.svg)
}

.ico-solid-colored-account-switch-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/account_switch.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/account_switch.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-account-switch-bu {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/account_switch_bu.svg)
}

.ico-solid-colored-account-switch-bu-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/account_switch_bu.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/account_switch_bu.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-account-warning {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/account_warning.svg)
}

.ico-solid-colored-account-warning-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/account_warning.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/account_warning.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-account-withdraw {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/account_withdraw.svg)
}

.ico-solid-colored-account-withdraw-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/account_withdraw.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/account_withdraw.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-add {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/add.svg)
}

.ico-solid-colored-add-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/add.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/add.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-airplain {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/airplain.svg)
}

.ico-solid-colored-airplain-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/airplain.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/airplain.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-apartment-loan {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/apartment_loan.svg)
}

.ico-solid-colored-apartment-loan-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/apartment_loan.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/apartment_loan.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-bag-krw {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/bag_krw.svg)
}

.ico-solid-colored-bag-krw-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/bag_krw.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/bag_krw.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-bag-krw-in {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/bag_krw_in.svg)
}

.ico-solid-colored-bag-krw-in-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/bag_krw_in.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/bag_krw_in.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-bag-month {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/bag_month.svg)
}

.ico-solid-colored-bag-month-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/bag_month.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/bag_month.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-bag-percent {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/bag_percent.svg)
}

.ico-solid-colored-bag-percent-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/bag_percent.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/bag_percent.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-bag-percent-gn {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/bag_percent_gn.svg)
}

.ico-solid-colored-bag-percent-gn-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/bag_percent_gn.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/bag_percent_gn.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-bag-percent-vo {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/bag_percent_vo.svg)
}

.ico-solid-colored-bag-percent-vo-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/bag_percent_vo.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/bag_percent_vo.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-bag-usd {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/bag_usd.svg)
}

.ico-solid-colored-bag-usd-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/bag_usd.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/bag_usd.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-basket {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/basket.svg)
}

.ico-solid-colored-basket-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/basket.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/basket.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-beer {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/beer.svg)
}

.ico-solid-colored-beer-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/beer.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/beer.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-bill-krw {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/bill_krw.svg)
}

.ico-solid-colored-bill-krw-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/bill_krw.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/bill_krw.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-bone {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/bone.svg)
}

.ico-solid-colored-bone-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/bone.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/bone.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-book {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/book.svg)
}

.ico-solid-colored-book-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/book.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/book.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-bus {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/bus.svg)
}

.ico-solid-colored-bus-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/bus.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/bus.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-cafe {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/cafe.svg)
}

.ico-solid-colored-cafe-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/cafe.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/cafe.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-calendar {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/calendar.svg)
}

.ico-solid-colored-calendar-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/calendar.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/calendar.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-calendar-add {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/calendar_add.svg)
}

.ico-solid-colored-calendar-add-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/calendar_add.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/calendar_add.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-calendar-error {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/calendar_error.svg)
}

.ico-solid-colored-calendar-error-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/calendar_error.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/calendar_error.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-calendar-og {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/calendar_og.svg)
}

.ico-solid-colored-calendar-og-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/calendar_og.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/calendar_og.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-calendar-success {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/calendar_success.svg)
}

.ico-solid-colored-calendar-success-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/calendar_success.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/calendar_success.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-calendar-switch {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/calendar_switch.svg)
}

.ico-solid-colored-calendar-switch-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/calendar_switch.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/calendar_switch.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-calendar-warning {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/calendar_warning.svg)
}

.ico-solid-colored-calendar-warning-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/calendar_warning.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/calendar_warning.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-car {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/car.svg)
}

.ico-solid-colored-car-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/car.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/car.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-car-loan {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/car_loan.svg)
}

.ico-solid-colored-car-loan-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/car_loan.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/car_loan.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-card {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/card.svg)
}

.ico-solid-colored-card-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/card.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/card.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-card-add {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/card_add.svg)
}

.ico-solid-colored-card-add-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/card_add.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/card_add.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-card-bu {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/card_bu.svg)
}

.ico-solid-colored-card-bu-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/card_bu.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/card_bu.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-card-error {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/card_error.svg)
}

.ico-solid-colored-card-error-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/card_error.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/card_error.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-card-success {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/card_success.svg)
}

.ico-solid-colored-card-success-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/card_success.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/card_success.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-card-switch {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/card_switch.svg)
}

.ico-solid-colored-card-switch-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/card_switch.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/card_switch.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-card-warning {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/card_warning.svg)
}

.ico-solid-colored-card-warning-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/card_warning.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/card_warning.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-cart {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/cart.svg)
}

.ico-solid-colored-cart-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/cart.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/cart.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-chat-heart {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/chat_heart.svg)
}

.ico-solid-colored-chat-heart-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/chat_heart.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/chat_heart.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-check {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/check.svg)
}

.ico-solid-colored-check-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/check.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/check.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-check-ico-pri-active {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/check_ico-pri-active.svg)
}

.ico-solid-colored-check-ico-pri-active-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/check_ico-pri-active.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/check_ico-pri-active.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-check-ico-pri-error {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/check_ico-pri-error.svg)
}

.ico-solid-colored-check-ico-pri-error-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/check_ico-pri-error.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/check_ico-pri-error.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-check-ico-pri-invert {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/check_ico-pri-invert.svg)
}

.ico-solid-colored-check-ico-pri-invert-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/check_ico-pri-invert.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/check_ico-pri-invert.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-check-ico-pri-like {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/check_ico-pri-like.svg)
}

.ico-solid-colored-check-ico-pri-like-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/check_ico-pri-like.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/check_ico-pri-like.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-check-ico-pri-success {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/check_ico-pri-success.svg)
}

.ico-solid-colored-check-ico-pri-success-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/check_ico-pri-success.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/check_ico-pri-success.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-check-ico-sec-active {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/check_ico-sec-active.svg)
}

.ico-solid-colored-check-ico-sec-active-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/check_ico-sec-active.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/check_ico-sec-active.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-check-ico-ter {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/check_ico-ter.svg)
}

.ico-solid-colored-check-ico-ter-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/check_ico-ter.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/check_ico-ter.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-check-ico-ter-active {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/check_ico-ter-active.svg)
}

.ico-solid-colored-check-ico-ter-active-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/check_ico-ter-active.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/check_ico-ter-active.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-circle-arrow-in {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/circle_arrow_in.svg)
}

.ico-solid-colored-circle-arrow-in-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/circle_arrow_in.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/circle_arrow_in.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-circle-arrow-out {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/circle_arrow_out.svg)
}

.ico-solid-colored-circle-arrow-out-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/circle_arrow_out.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/circle_arrow_out.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-clock {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/clock.svg)
}

.ico-solid-colored-clock-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/clock.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/clock.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-confetti {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/confetti.svg)
}

.ico-solid-colored-confetti-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/confetti.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/confetti.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-coupon {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/coupon.svg)
}

.ico-solid-colored-coupon-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/coupon.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/coupon.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-cross {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/cross.svg)
}

.ico-solid-colored-cross-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/cross.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/cross.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-cvs {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/cvs.svg)
}

.ico-solid-colored-cvs-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/cvs.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/cvs.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-error {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/error.svg)
}

.ico-solid-colored-error-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/error.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/error.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-etc {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/etc.svg)
}

.ico-solid-colored-etc-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/etc.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/etc.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-event {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/event.svg)
}

.ico-solid-colored-event-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/event.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/event.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-exclamation-circle-ico-pri-active {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/exclamation_circle_ico-pri-active.svg)
}

.ico-solid-colored-exclamation-circle-ico-pri-active-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/exclamation_circle_ico-pri-active.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/exclamation_circle_ico-pri-active.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-exclamation-circle-ico-pri-error {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/exclamation_circle_ico-pri-error.svg)
}

.ico-solid-colored-exclamation-circle-ico-pri-error-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/exclamation_circle_ico-pri-error.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/exclamation_circle_ico-pri-error.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-exclamation-circle-ico-pri-invert {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/exclamation_circle_ico-pri-invert.svg)
}

.ico-solid-colored-exclamation-circle-ico-pri-invert-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/exclamation_circle_ico-pri-invert.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/exclamation_circle_ico-pri-invert.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-exclamation-circle-ico-pri-like {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/exclamation_circle_ico-pri-like.svg)
}

.ico-solid-colored-exclamation-circle-ico-pri-like-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/exclamation_circle_ico-pri-like.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/exclamation_circle_ico-pri-like.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-exclamation-circle-ico-pri-success {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/exclamation_circle_ico-pri-success.svg)
}

.ico-solid-colored-exclamation-circle-ico-pri-success-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/exclamation_circle_ico-pri-success.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/exclamation_circle_ico-pri-success.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-exclamation-circle-ico-sec-active {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/exclamation_circle_ico-sec-active.svg)
}

.ico-solid-colored-exclamation-circle-ico-sec-active-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/exclamation_circle_ico-sec-active.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/exclamation_circle_ico-sec-active.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-exclamation-circle-ico-ter {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/exclamation_circle_ico-ter.svg)
}

.ico-solid-colored-exclamation-circle-ico-ter-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/exclamation_circle_ico-ter.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/exclamation_circle_ico-ter.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-exclamation-circle-ico-ter-active {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/exclamation_circle_ico-ter-active.svg)
}

.ico-solid-colored-exclamation-circle-ico-ter-active-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/exclamation_circle_ico-ter-active.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/exclamation_circle_ico-ter-active.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-fee-waiver {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/fee_waiver.svg)
}

.ico-solid-colored-fee-waiver-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/fee_waiver.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/fee_waiver.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-finance {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/finance.svg)
}

.ico-solid-colored-finance-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/finance.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/finance.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-flag {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/flag.svg)
}

.ico-solid-colored-flag-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/flag.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/flag.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-food {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/food.svg)
}

.ico-solid-colored-food-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/food.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/food.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-gas {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/gas.svg)
}

.ico-solid-colored-gas-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/gas.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/gas.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-gift {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/gift.svg)
}

.ico-solid-colored-gift-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/gift.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/gift.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-glob {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/glob.svg)
}

.ico-solid-colored-glob-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/glob.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/glob.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-graduation {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/graduation.svg)
}

.ico-solid-colored-graduation-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/graduation.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/graduation.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-guaranteed-loan {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/guaranteed_loan.svg)
}

.ico-solid-colored-guaranteed-loan-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/guaranteed_loan.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/guaranteed_loan.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-guaranteed-loan-vo {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/guaranteed_loan_vo.svg)
}

.ico-solid-colored-guaranteed-loan-vo-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/guaranteed_loan_vo.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/guaranteed_loan_vo.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-heart-ico-pri-active {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/heart_ico-pri-active.svg)
}

.ico-solid-colored-heart-ico-pri-active-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/heart_ico-pri-active.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/heart_ico-pri-active.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-heart-ico-pri-error {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/heart_ico-pri-error.svg)
}

.ico-solid-colored-heart-ico-pri-error-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/heart_ico-pri-error.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/heart_ico-pri-error.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-heart-ico-pri-invert {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/heart_ico-pri-invert.svg)
}

.ico-solid-colored-heart-ico-pri-invert-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/heart_ico-pri-invert.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/heart_ico-pri-invert.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-heart-ico-pri-like {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/heart_ico-pri-like.svg)
}

.ico-solid-colored-heart-ico-pri-like-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/heart_ico-pri-like.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/heart_ico-pri-like.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-heart-ico-pri-success {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/heart_ico-pri-success.svg)
}

.ico-solid-colored-heart-ico-pri-success-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/heart_ico-pri-success.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/heart_ico-pri-success.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-heart-ico-sec-active {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/heart_ico-sec-active.svg)
}

.ico-solid-colored-heart-ico-sec-active-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/heart_ico-sec-active.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/heart_ico-sec-active.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-heart-ico-ter {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/heart_ico-ter.svg)
}

.ico-solid-colored-heart-ico-ter-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/heart_ico-ter.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/heart_ico-ter.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-heart-ico-ter-active {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/heart_ico-ter-active.svg)
}

.ico-solid-colored-heart-ico-ter-active-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/heart_ico-ter-active.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/heart_ico-ter-active.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-home {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/home.svg)
}

.ico-solid-colored-home-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/home.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/home.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-home-ceo {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/home_ceo.svg)
}

.ico-solid-colored-home-ceo-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/home_ceo.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/home_ceo.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-home-loan {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/home_loan.svg)
}

.ico-solid-colored-home-loan-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/home_loan.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/home_loan.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-home-loan-vo {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/home_loan_vo.svg)
}

.ico-solid-colored-home-loan-vo-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/home_loan_vo.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/home_loan_vo.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-housing {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/housing.svg)
}

.ico-solid-colored-housing-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/housing.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/housing.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-income {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/income.svg)
}

.ico-solid-colored-income-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/income.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/income.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-institution {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/institution.svg)
}

.ico-solid-colored-institution-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/institution.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/institution.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-interest {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/interest.svg)
}

.ico-solid-colored-interest-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/interest.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/interest.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-investment {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/investment.svg)
}

.ico-solid-colored-investment-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/investment.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/investment.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-letter {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/letter.svg)
}

.ico-solid-colored-letter-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/letter.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/letter.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-life {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/life.svg)
}

.ico-solid-colored-life-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/life.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/life.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-like {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/like.svg)
}

.ico-solid-colored-like-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/like.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/like.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-loan {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/loan.svg)
}

.ico-solid-colored-loan-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/loan.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/loan.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-lock {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/lock.svg)
}

.ico-solid-colored-lock-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/lock.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/lock.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-lock-add {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/lock_add.svg)
}

.ico-solid-colored-lock-add-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/lock_add.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/lock_add.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-lock-error {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/lock_error.svg)
}

.ico-solid-colored-lock-error-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/lock_error.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/lock_error.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-lock-success {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/lock_success.svg)
}

.ico-solid-colored-lock-success-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/lock_success.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/lock_success.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-lock-switch {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/lock_switch.svg)
}

.ico-solid-colored-lock-switch-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/lock_switch.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/lock_switch.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-lock-warning {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/lock_warning.svg)
}

.ico-solid-colored-lock-warning-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/lock_warning.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/lock_warning.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-lugage {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/lugage.svg)
}

.ico-solid-colored-lugage-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/lugage.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/lugage.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-luggage {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/luggage.svg)
}

.ico-solid-colored-luggage-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/luggage.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/luggage.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-message {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/message.svg)
}

.ico-solid-colored-message-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/message.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/message.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-message-add {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/message_add.svg)
}

.ico-solid-colored-message-add-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/message_add.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/message_add.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-message-check {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/message_check.svg)
}

.ico-solid-colored-message-check-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/message_check.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/message_check.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-message-error {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/message_error.svg)
}

.ico-solid-colored-message-error-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/message_error.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/message_error.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-message-switch {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/message_switch.svg)
}

.ico-solid-colored-message-switch-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/message_switch.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/message_switch.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-message-warning {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/message_warning.svg)
}

.ico-solid-colored-message-warning-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/message_warning.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/message_warning.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-mirror {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/mirror.svg)
}

.ico-solid-colored-mirror-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/mirror.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/mirror.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-moneybag-loan {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/moneybag_loan.svg)
}

.ico-solid-colored-moneybag-loan-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/moneybag_loan.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/moneybag_loan.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-moneybag-loan-vo {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/moneybag_loan_vo.svg)
}

.ico-solid-colored-moneybag-loan-vo-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/moneybag_loan_vo.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/moneybag_loan_vo.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-movie {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/movie.svg)
}

.ico-solid-colored-movie-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/movie.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/movie.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-none {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/none.svg)
}

.ico-solid-colored-none-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/none.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/none.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-notice {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/notice.svg)
}

.ico-solid-colored-notice-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/notice.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/notice.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-null-account-krw {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/null_account_krw.svg)
}

.ico-solid-colored-null-account-krw-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/null_account_krw.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/null_account_krw.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-null-bag-krw {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/null_bag_krw.svg)
}

.ico-solid-colored-null-bag-krw-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/null_bag_krw.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/null_bag_krw.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-null-card {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/null_card.svg)
}

.ico-solid-colored-null-card-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/null_card.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/null_card.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-null-coupon {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/null_coupon.svg)
}

.ico-solid-colored-null-coupon-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/null_coupon.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/null_coupon.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-null-exclamation-circle {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/null_exclamation_circle.svg)
}

.ico-solid-colored-null-exclamation-circle-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/null_exclamation_circle.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/null_exclamation_circle.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-null-paper {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/null_paper.svg)
}

.ico-solid-colored-null-paper-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/null_paper.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/null_paper.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-pencil {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/pencil.svg)
}

.ico-solid-colored-pencil-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/pencil.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/pencil.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-phone {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/phone.svg)
}

.ico-solid-colored-phone-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/phone.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/phone.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-phone-add {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/phone_add.svg)
}

.ico-solid-colored-phone-add-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/phone_add.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/phone_add.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-phone-check {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/phone_check.svg)
}

.ico-solid-colored-phone-check-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/phone_check.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/phone_check.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-phone-error {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/phone_error.svg)
}

.ico-solid-colored-phone-error-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/phone_error.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/phone_error.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-phone-money {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/phone_money.svg)
}

.ico-solid-colored-phone-money-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/phone_money.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/phone_money.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-phone-switch {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/phone_switch.svg)
}

.ico-solid-colored-phone-switch-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/phone_switch.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/phone_switch.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-phone-warning {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/phone_warning.svg)
}

.ico-solid-colored-phone-warning-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/phone_warning.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/phone_warning.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-phone-wifi {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/phone_wifi.svg)
}

.ico-solid-colored-phone-wifi-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/phone_wifi.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/phone_wifi.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-pill {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/pill.svg)
}

.ico-solid-colored-pill-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/pill.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/pill.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-point {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/point.svg)
}

.ico-solid-colored-point-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/point.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/point.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-popcorn {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/popcorn.svg)
}

.ico-solid-colored-popcorn-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/popcorn.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/popcorn.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-review {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/review.svg)
}

.ico-solid-colored-review-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/review.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/review.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-reward {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/reward.svg)
}

.ico-solid-colored-reward-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/reward.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/reward.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-ring {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/ring.svg)
}

.ico-solid-colored-ring-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/ring.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/ring.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-rocket {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/rocket.svg)
}

.ico-solid-colored-rocket-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/rocket.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/rocket.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-search {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/search.svg)
}

.ico-solid-colored-search-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/search.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/search.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-shield {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/shield.svg)
}

.ico-solid-colored-shield-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/shield.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/shield.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-shopping {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/shopping.svg)
}

.ico-solid-colored-shopping-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/shopping.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/shopping.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-shopping-travel {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/shopping_travel.svg)
}

.ico-solid-colored-shopping-travel-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/shopping_travel.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/shopping_travel.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-star-ico-pri-active {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/star_ico-pri-active.svg)
}

.ico-solid-colored-star-ico-pri-active-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/star_ico-pri-active.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/star_ico-pri-active.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-star-ico-pri-error {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/star_ico-pri-error.svg)
}

.ico-solid-colored-star-ico-pri-error-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/star_ico-pri-error.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/star_ico-pri-error.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-star-ico-pri-invert {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/star_ico-pri-invert.svg)
}

.ico-solid-colored-star-ico-pri-invert-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/star_ico-pri-invert.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/star_ico-pri-invert.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-star-ico-pri-like {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/star_ico-pri-like.svg)
}

.ico-solid-colored-star-ico-pri-like-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/star_ico-pri-like.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/star_ico-pri-like.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-star-ico-pri-success {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/star_ico-pri-success.svg)
}

.ico-solid-colored-star-ico-pri-success-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/star_ico-pri-success.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/star_ico-pri-success.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-star-ico-sec-active {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/star_ico-sec-active.svg)
}

.ico-solid-colored-star-ico-sec-active-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/star_ico-sec-active.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/star_ico-sec-active.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-star-ico-ter {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/star_ico-ter.svg)
}

.ico-solid-colored-star-ico-ter-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/star_ico-ter.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/star_ico-ter.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-star-ico-ter-active {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/star_ico-ter-active.svg)
}

.ico-solid-colored-star-ico-ter-active-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/star_ico-ter-active.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/star_ico-ter-active.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-stroller {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/stroller.svg)
}

.ico-solid-colored-stroller-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/stroller.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/stroller.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-success {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/success.svg)
}

.ico-solid-colored-success-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/success.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/success.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-switch {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/switch.svg)
}

.ico-solid-colored-switch-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/switch.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/switch.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-switch-bu {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/switch_bu.svg)
}

.ico-solid-colored-switch-bu-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/switch_bu.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/switch_bu.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-taxi {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/taxi.svg)
}

.ico-solid-colored-taxi-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/taxi.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/taxi.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-tennis-ball {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/tennis_ball.svg)
}

.ico-solid-colored-tennis-ball-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/tennis_ball.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/tennis_ball.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-train {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/train.svg)
}

.ico-solid-colored-train-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/train.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/train.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-transfer {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/transfer.svg)
}

.ico-solid-colored-transfer-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/transfer.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/transfer.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-umbrella {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/umbrella.svg)
}

.ico-solid-colored-umbrella-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/umbrella.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/umbrella.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-user {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/user.svg)
}

.ico-solid-colored-user-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/user.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/user.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-users {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/users.svg)
}

.ico-solid-colored-users-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/users.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/users.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-warning {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/warning.svg)
}

.ico-solid-colored-warning-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/warning.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/warning.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-colored-warning-yl {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/warning_yl.svg)
}

.ico-solid-colored-warning-yl-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/warning_yl.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/colored/warning_yl.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-coupon {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/coupon.svg)
}

.ico-solid-coupon-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/coupon.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/coupon.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-credit-score {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/credit_score.svg)
}

.ico-solid-credit-score-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/credit_score.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/credit_score.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-document {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/document.svg)
}

.ico-solid-document-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/document.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/document.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-dutchpay {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/dutchpay.svg)
}

.ico-solid-dutchpay-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/dutchpay.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/dutchpay.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-edit {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/edit.svg)
}

.ico-solid-edit-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/edit.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/edit.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-exclamation {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/exclamation.svg)
}

.ico-solid-exclamation-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/exclamation.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/exclamation.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-exclamation-circle {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/exclamation_circle.svg)
}

.ico-solid-exclamation-circle-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/exclamation_circle.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/exclamation_circle.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-gift {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/gift.svg)
}

.ico-solid-gift-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/gift.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/gift.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-gift-active {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/gift-active.svg)
}

.ico-solid-gift-active-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/gift-active.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/gift-active.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-glob {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/glob.svg)
}

.ico-solid-glob-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/glob.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/glob.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-glob-chat {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/glob_chat.svg)
}

.ico-solid-glob-chat-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/glob_chat.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/glob_chat.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-gold {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/gold.svg)
}

.ico-solid-gold-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/gold.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/gold.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-graph-area-down {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/graph_area_down.svg)
}

.ico-solid-graph-area-down-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/graph_area_down.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/graph_area_down.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-graph-area-up {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/graph_area_up.svg)
}

.ico-solid-graph-area-up-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/graph_area_up.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/graph_area_up.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-graph-area-up-active {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/graph_area_up-active.svg)
}

.ico-solid-graph-area-up-active-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/graph_area_up-active.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/graph_area_up-active.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-graph-bar-down {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/graph_bar_down.svg)
}

.ico-solid-graph-bar-down-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/graph_bar_down.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/graph_bar_down.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-graph-bar-up {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/graph_bar_up.svg)
}

.ico-solid-graph-bar-up-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/graph_bar_up.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/graph_bar_up.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-heart {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/heart.svg)
}

.ico-solid-heart-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/heart.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/heart.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-hide {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/hide.svg)
}

.ico-solid-hide-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/hide.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/hide.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-home {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/home.svg)
}

.ico-solid-home-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/home.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/home.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-home-active {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/home-active.svg)
}

.ico-solid-home-active-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/home-active.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/home-active.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-hospital {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/hospital.svg)
}

.ico-solid-hospital-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/hospital.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/hospital.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-info-circle {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/info_circle.svg)
}

.ico-solid-info-circle-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/info_circle.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/info_circle.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-kbankpay {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/kbankpay.svg)
}

.ico-solid-kbankpay-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/kbankpay.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/kbankpay.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-loan {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/loan.svg)
}

.ico-solid-loan-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/loan.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/loan.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-loan-krw {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/loan_krw.svg)
}

.ico-solid-loan-krw-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/loan_krw.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/loan_krw.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-mail {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/mail.svg)
}

.ico-solid-mail-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/mail.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/mail.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-menu {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/menu.svg)
}

.ico-solid-menu-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/menu.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/menu.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-menu-active {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/menu-active.svg)
}

.ico-solid-menu-active-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/menu-active.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/menu-active.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-minus-circle {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/minus_circle.svg)
}

.ico-solid-minus-circle-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/minus_circle.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/minus_circle.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-moneytalk {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/moneytalk.svg)
}

.ico-solid-moneytalk-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/moneytalk.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/moneytalk.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-notice {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/notice.svg)
}

.ico-solid-notice-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/notice.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/notice.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-pause {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/pause.svg)
}

.ico-solid-pause-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/pause.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/pause.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-percent-circle {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/percent_circle.svg)
}

.ico-solid-percent-circle-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/percent_circle.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/percent_circle.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-phone {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/phone.svg)
}

.ico-solid-phone-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/phone.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/phone.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-piggy-bank {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/piggy_bank.svg)
}

.ico-solid-piggy-bank-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/piggy_bank.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/piggy_bank.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-pin {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/pin.svg)
}

.ico-solid-pin-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/pin.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/pin.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-play {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/play.svg)
}

.ico-solid-play-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/play.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/play.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-question-circle {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/question_circle.svg)
}

.ico-solid-question-circle-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/question_circle.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/question_circle.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-search {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/search.svg)
}

.ico-solid-search-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/search.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/search.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-setting {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/setting.svg)
}

.ico-solid-setting-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/setting.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/setting.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-share {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/share.svg)
}

.ico-solid-share-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/share.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/share.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-shopping {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/shopping.svg)
}

.ico-solid-shopping-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/shopping.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/shopping.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-shopping-active {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/shopping-active.svg)
}

.ico-solid-shopping-active-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/shopping-active.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/shopping-active.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-show {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/show.svg)
}

.ico-solid-show-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/show.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/show.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-star {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/star.svg)
}

.ico-solid-star-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/star.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/star.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-switch-vert {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/switch_vert.svg)
}

.ico-solid-switch-vert-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/switch_vert.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/switch_vert.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-syringe {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/syringe.svg)
}

.ico-solid-syringe-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/syringe.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/syringe.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-triangle-down {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/triangle_down.svg)
}

.ico-solid-triangle-down-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/triangle_down.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/triangle_down.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-triangle-down-re {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/triangle_down_re.svg)
}

.ico-solid-triangle-down-re-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/triangle_down_re.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/triangle_down_re.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-triangle-left-right {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/triangle_left_right.svg)
}

.ico-solid-triangle-left-right-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/triangle_left_right.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/triangle_left_right.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-triangle-up {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/triangle_up.svg)
}

.ico-solid-triangle-up-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/triangle_up.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/triangle_up.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-triangle-up-down {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/triangle_up_down.svg)
}

.ico-solid-triangle-up-down-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/triangle_up_down.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/triangle_up_down.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-triangle-up-re {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/triangle_up_re.svg)
}

.ico-solid-triangle-up-re-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/triangle_up_re.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/triangle_up_re.svg);
    background-color: var(--bg-sec-active)
}

.ico-solid-user {
    background-image: url(/resource/img/mmk/kds3_5/ico/solid/user.svg)
}

.ico-solid-user-mask {
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/solid/user.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/solid/user.svg);
    background-color: var(--bg-sec-active)
}

.ico-colored-account {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-account)
}

.ico-colored-account-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-account);
    mask-image: var(--path-solid-colored-account)
}

.ico-colored-account-add {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-account_add)
}

.ico-colored-account-add-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-account_add);
    mask-image: var(--path-solid-colored-account_add)
}

.ico-colored-account-deposit {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-account_deposit)
}

.ico-colored-account-deposit-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-account_deposit);
    mask-image: var(--path-solid-colored-account_deposit)
}

.ico-colored-account-error {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-account_error)
}

.ico-colored-account-error-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-account_error);
    mask-image: var(--path-solid-colored-account_error)
}

.ico-colored-account-loan {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-account_loan)
}

.ico-colored-account-loan-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-account_loan);
    mask-image: var(--path-solid-colored-account_loan)
}

.ico-colored-account-success {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-account_success)
}

.ico-colored-account-success-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-account_success);
    mask-image: var(--path-solid-colored-account_success)
}

.ico-colored-account-switch {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-account_switch)
}

.ico-colored-account-switch-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-account_switch);
    mask-image: var(--path-solid-colored-account_switch)
}

.ico-colored-account-switch-bu {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-account_switch_bu)
}

.ico-colored-account-switch-bu-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-account_switch_bu);
    mask-image: var(--path-solid-colored-account_switch_bu)
}

.ico-colored-account-warning {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-account_warning)
}

.ico-colored-account-warning-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-account_warning);
    mask-image: var(--path-solid-colored-account_warning)
}

.ico-colored-account-withdraw {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-account_withdraw)
}

.ico-colored-account-withdraw-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-account_withdraw);
    mask-image: var(--path-solid-colored-account_withdraw)
}

.ico-colored-add {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-add)
}

.ico-colored-add-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-add);
    mask-image: var(--path-solid-colored-add)
}

.ico-colored-airplain {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-airplain)
}

.ico-colored-airplain-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-airplain);
    mask-image: var(--path-solid-colored-airplain)
}

.ico-colored-apartment-loan {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-apartment_loan)
}

.ico-colored-apartment-loan-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-apartment_loan);
    mask-image: var(--path-solid-colored-apartment_loan)
}

.ico-colored-bag-krw {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-bag_krw)
}

.ico-colored-bag-krw-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-bag_krw);
    mask-image: var(--path-solid-colored-bag_krw)
}

.ico-colored-bag-krw-in {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-bag_krw_in)
}

.ico-colored-bag-krw-in-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-bag_krw_in);
    mask-image: var(--path-solid-colored-bag_krw_in)
}

.ico-colored-bag-month {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-bag_month)
}

.ico-colored-bag-month-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-bag_month);
    mask-image: var(--path-solid-colored-bag_month)
}

.ico-colored-bag-percent {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-bag_percent)
}

.ico-colored-bag-percent-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-bag_percent);
    mask-image: var(--path-solid-colored-bag_percent)
}

.ico-colored-bag-percent-gn {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-bag_percent_gn)
}

.ico-colored-bag-percent-gn-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-bag_percent_gn);
    mask-image: var(--path-solid-colored-bag_percent_gn)
}

.ico-colored-bag-percent-vo {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-bag_percent_vo)
}

.ico-colored-bag-percent-vo-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-bag_percent_vo);
    mask-image: var(--path-solid-colored-bag_percent_vo)
}

.ico-colored-bag-usd {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-bag_usd)
}

.ico-colored-bag-usd-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-bag_usd);
    mask-image: var(--path-solid-colored-bag_usd)
}

.ico-colored-basket {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-basket)
}

.ico-colored-basket-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-basket);
    mask-image: var(--path-solid-colored-basket)
}

.ico-colored-beer {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-beer)
}

.ico-colored-beer-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-beer);
    mask-image: var(--path-solid-colored-beer)
}

.ico-colored-bill-krw {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-bill_krw)
}

.ico-colored-bill-krw-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-bill_krw);
    mask-image: var(--path-solid-colored-bill_krw)
}

.ico-colored-bone {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-bone)
}

.ico-colored-bone-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-bone);
    mask-image: var(--path-solid-colored-bone)
}

.ico-colored-book {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-book)
}

.ico-colored-book-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-book);
    mask-image: var(--path-solid-colored-book)
}

.ico-colored-bus {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-bus)
}

.ico-colored-bus-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-bus);
    mask-image: var(--path-solid-colored-bus)
}

.ico-colored-cafe {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-cafe)
}

.ico-colored-cafe-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-cafe);
    mask-image: var(--path-solid-colored-cafe)
}

.ico-colored-calendar {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-calendar)
}

.ico-colored-calendar-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-calendar);
    mask-image: var(--path-solid-colored-calendar)
}

.ico-colored-calendar-add {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-calendar_add)
}

.ico-colored-calendar-add-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-calendar_add);
    mask-image: var(--path-solid-colored-calendar_add)
}

.ico-colored-calendar-error {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-calendar_error)
}

.ico-colored-calendar-error-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-calendar_error);
    mask-image: var(--path-solid-colored-calendar_error)
}

.ico-colored-calendar-og {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-calendar_og)
}

.ico-colored-calendar-og-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-calendar_og);
    mask-image: var(--path-solid-colored-calendar_og)
}

.ico-colored-calendar-success {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-calendar_success)
}

.ico-colored-calendar-success-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-calendar_success);
    mask-image: var(--path-solid-colored-calendar_success)
}

.ico-colored-calendar-switch {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-calendar_switch)
}

.ico-colored-calendar-switch-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-calendar_switch);
    mask-image: var(--path-solid-colored-calendar_switch)
}

.ico-colored-calendar-warning {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-calendar_warning)
}

.ico-colored-calendar-warning-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-calendar_warning);
    mask-image: var(--path-solid-colored-calendar_warning)
}

.ico-colored-car {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-car)
}

.ico-colored-car-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-car);
    mask-image: var(--path-solid-colored-car)
}

.ico-colored-car-loan {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-car_loan)
}

.ico-colored-car-loan-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-car_loan);
    mask-image: var(--path-solid-colored-car_loan)
}

.ico-colored-card {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-card)
}

.ico-colored-card-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-card);
    mask-image: var(--path-solid-colored-card)
}

.ico-colored-card-add {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-card_add)
}

.ico-colored-card-add-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-card_add);
    mask-image: var(--path-solid-colored-card_add)
}

.ico-colored-card-bu {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-card_bu)
}

.ico-colored-card-bu-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-card_bu);
    mask-image: var(--path-solid-colored-card_bu)
}

.ico-colored-card-error {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-card_error)
}

.ico-colored-card-error-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-card_error);
    mask-image: var(--path-solid-colored-card_error)
}

.ico-colored-card-success {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-card_success)
}

.ico-colored-card-success-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-card_success);
    mask-image: var(--path-solid-colored-card_success)
}

.ico-colored-card-switch {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-card_switch)
}

.ico-colored-card-switch-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-card_switch);
    mask-image: var(--path-solid-colored-card_switch)
}

.ico-colored-card-warning {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-card_warning)
}

.ico-colored-card-warning-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-card_warning);
    mask-image: var(--path-solid-colored-card_warning)
}

.ico-colored-cart {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-cart)
}

.ico-colored-cart-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-cart);
    mask-image: var(--path-solid-colored-cart)
}

.ico-colored-chat-heart {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-chat_heart)
}

.ico-colored-chat-heart-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-chat_heart);
    mask-image: var(--path-solid-colored-chat_heart)
}

.ico-colored-check {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-check)
}

.ico-colored-check-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-check);
    mask-image: var(--path-solid-colored-check)
}

.ico-colored-check-ico-pri-active {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-check_ico-pri-active)
}

.ico-colored-check-ico-pri-active-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-check_ico-pri-active);
    mask-image: var(--path-solid-colored-check_ico-pri-active)
}

.ico-colored-check-ico-pri-error {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-check_ico-pri-error)
}

.ico-colored-check-ico-pri-error-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-check_ico-pri-error);
    mask-image: var(--path-solid-colored-check_ico-pri-error)
}

.ico-colored-check-ico-pri-invert {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-check_ico-pri-invert)
}

.ico-colored-check-ico-pri-invert-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-check_ico-pri-invert);
    mask-image: var(--path-solid-colored-check_ico-pri-invert)
}

.ico-colored-check-ico-pri-like {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-check_ico-pri-like)
}

.ico-colored-check-ico-pri-like-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-check_ico-pri-like);
    mask-image: var(--path-solid-colored-check_ico-pri-like)
}

.ico-colored-check-ico-pri-success {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-check_ico-pri-success)
}

.ico-colored-check-ico-pri-success-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-check_ico-pri-success);
    mask-image: var(--path-solid-colored-check_ico-pri-success)
}

.ico-colored-check-ico-sec-active {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-check_ico-sec-active)
}

.ico-colored-check-ico-sec-active-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-check_ico-sec-active);
    mask-image: var(--path-solid-colored-check_ico-sec-active)
}

.ico-colored-check-ico-ter {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-check_ico-ter)
}

.ico-colored-check-ico-ter-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-check_ico-ter);
    mask-image: var(--path-solid-colored-check_ico-ter)
}

.ico-colored-check-ico-ter-active {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-check_ico-ter-active)
}

.ico-colored-check-ico-ter-active-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-check_ico-ter-active);
    mask-image: var(--path-solid-colored-check_ico-ter-active)
}

.ico-colored-circle-arrow-in {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-circle_arrow_in)
}

.ico-colored-circle-arrow-in-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-circle_arrow_in);
    mask-image: var(--path-solid-colored-circle_arrow_in)
}

.ico-colored-circle-arrow-out {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-circle_arrow_out)
}

.ico-colored-circle-arrow-out-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-circle_arrow_out);
    mask-image: var(--path-solid-colored-circle_arrow_out)
}

.ico-colored-clock {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-clock)
}

.ico-colored-clock-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-clock);
    mask-image: var(--path-solid-colored-clock)
}

.ico-colored-confetti {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-confetti)
}

.ico-colored-confetti-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-confetti);
    mask-image: var(--path-solid-colored-confetti)
}

.ico-colored-coupon {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-coupon)
}

.ico-colored-coupon-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-coupon);
    mask-image: var(--path-solid-colored-coupon)
}

.ico-colored-cross {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-cross)
}

.ico-colored-cross-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-cross);
    mask-image: var(--path-solid-colored-cross)
}

.ico-colored-cvs {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-cvs)
}

.ico-colored-cvs-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-cvs);
    mask-image: var(--path-solid-colored-cvs)
}

.ico-colored-error {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-error)
}

.ico-colored-error-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-error);
    mask-image: var(--path-solid-colored-error)
}

.ico-colored-etc {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-etc)
}

.ico-colored-etc-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-etc);
    mask-image: var(--path-solid-colored-etc)
}

.ico-colored-event {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-event)
}

.ico-colored-event-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-event);
    mask-image: var(--path-solid-colored-event)
}

.ico-colored-exclamation-circle-ico-pri-active {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-exclamation_circle_ico-pri-active)
}

.ico-colored-exclamation-circle-ico-pri-active-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-exclamation_circle_ico-pri-active);
    mask-image: var(--path-solid-colored-exclamation_circle_ico-pri-active)
}

.ico-colored-exclamation-circle-ico-pri-error {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-exclamation_circle_ico-pri-error)
}

.ico-colored-exclamation-circle-ico-pri-error-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-exclamation_circle_ico-pri-error);
    mask-image: var(--path-solid-colored-exclamation_circle_ico-pri-error)
}

.ico-colored-exclamation-circle-ico-pri-invert {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-exclamation_circle_ico-pri-invert)
}

.ico-colored-exclamation-circle-ico-pri-invert-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-exclamation_circle_ico-pri-invert);
    mask-image: var(--path-solid-colored-exclamation_circle_ico-pri-invert)
}

.ico-colored-exclamation-circle-ico-pri-like {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-exclamation_circle_ico-pri-like)
}

.ico-colored-exclamation-circle-ico-pri-like-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-exclamation_circle_ico-pri-like);
    mask-image: var(--path-solid-colored-exclamation_circle_ico-pri-like)
}

.ico-colored-exclamation-circle-ico-pri-success {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-exclamation_circle_ico-pri-success)
}

.ico-colored-exclamation-circle-ico-pri-success-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-exclamation_circle_ico-pri-success);
    mask-image: var(--path-solid-colored-exclamation_circle_ico-pri-success)
}

.ico-colored-exclamation-circle-ico-sec-active {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-exclamation_circle_ico-sec-active)
}

.ico-colored-exclamation-circle-ico-sec-active-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-exclamation_circle_ico-sec-active);
    mask-image: var(--path-solid-colored-exclamation_circle_ico-sec-active)
}

.ico-colored-exclamation-circle-ico-ter {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-exclamation_circle_ico-ter)
}

.ico-colored-exclamation-circle-ico-ter-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-exclamation_circle_ico-ter);
    mask-image: var(--path-solid-colored-exclamation_circle_ico-ter)
}

.ico-colored-exclamation-circle-ico-ter-active {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-exclamation_circle_ico-ter-active)
}

.ico-colored-exclamation-circle-ico-ter-active-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-exclamation_circle_ico-ter-active);
    mask-image: var(--path-solid-colored-exclamation_circle_ico-ter-active)
}

.ico-colored-fee-waiver {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-fee_waiver)
}

.ico-colored-fee-waiver-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-fee_waiver);
    mask-image: var(--path-solid-colored-fee_waiver)
}

.ico-colored-finance {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-finance)
}

.ico-colored-finance-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-finance);
    mask-image: var(--path-solid-colored-finance)
}

.ico-colored-flag {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-flag)
}

.ico-colored-flag-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-flag);
    mask-image: var(--path-solid-colored-flag)
}

.ico-colored-food {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-food)
}

.ico-colored-food-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-food);
    mask-image: var(--path-solid-colored-food)
}

.ico-colored-gas {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-gas)
}

.ico-colored-gas-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-gas);
    mask-image: var(--path-solid-colored-gas)
}

.ico-colored-gift {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-gift)
}

.ico-colored-gift-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-gift);
    mask-image: var(--path-solid-colored-gift)
}

.ico-colored-glob {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-glob)
}

.ico-colored-glob-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-glob);
    mask-image: var(--path-solid-colored-glob)
}

.ico-colored-graduation {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-graduation)
}

.ico-colored-graduation-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-graduation);
    mask-image: var(--path-solid-colored-graduation)
}

.ico-colored-guaranteed-loan {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-guaranteed_loan)
}

.ico-colored-guaranteed-loan-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-guaranteed_loan);
    mask-image: var(--path-solid-colored-guaranteed_loan)
}

.ico-colored-guaranteed-loan-vo {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-guaranteed_loan_vo)
}

.ico-colored-guaranteed-loan-vo-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-guaranteed_loan_vo);
    mask-image: var(--path-solid-colored-guaranteed_loan_vo)
}

.ico-colored-heart-ico-pri-active {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-heart_ico-pri-active)
}

.ico-colored-heart-ico-pri-active-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-heart_ico-pri-active);
    mask-image: var(--path-solid-colored-heart_ico-pri-active)
}

.ico-colored-heart-ico-pri-error {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-heart_ico-pri-error)
}

.ico-colored-heart-ico-pri-error-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-heart_ico-pri-error);
    mask-image: var(--path-solid-colored-heart_ico-pri-error)
}

.ico-colored-heart-ico-pri-invert {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-heart_ico-pri-invert)
}

.ico-colored-heart-ico-pri-invert-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-heart_ico-pri-invert);
    mask-image: var(--path-solid-colored-heart_ico-pri-invert)
}

.ico-colored-heart-ico-pri-like {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-heart_ico-pri-like)
}

.ico-colored-heart-ico-pri-like-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-heart_ico-pri-like);
    mask-image: var(--path-solid-colored-heart_ico-pri-like)
}

.ico-colored-heart-ico-pri-success {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-heart_ico-pri-success)
}

.ico-colored-heart-ico-pri-success-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-heart_ico-pri-success);
    mask-image: var(--path-solid-colored-heart_ico-pri-success)
}

.ico-colored-heart-ico-sec-active {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-heart_ico-sec-active)
}

.ico-colored-heart-ico-sec-active-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-heart_ico-sec-active);
    mask-image: var(--path-solid-colored-heart_ico-sec-active)
}

.ico-colored-heart-ico-ter {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-heart_ico-ter)
}

.ico-colored-heart-ico-ter-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-heart_ico-ter);
    mask-image: var(--path-solid-colored-heart_ico-ter)
}

.ico-colored-heart-ico-ter-active {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-heart_ico-ter-active)
}

.ico-colored-heart-ico-ter-active-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-heart_ico-ter-active);
    mask-image: var(--path-solid-colored-heart_ico-ter-active)
}

.ico-colored-home {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-home)
}

.ico-colored-home-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-home);
    mask-image: var(--path-solid-colored-home)
}

.ico-colored-home-ceo {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-home_ceo)
}

.ico-colored-home-ceo-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-home_ceo);
    mask-image: var(--path-solid-colored-home_ceo)
}

.ico-colored-home-loan {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-home_loan)
}

.ico-colored-home-loan-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-home_loan);
    mask-image: var(--path-solid-colored-home_loan)
}

.ico-colored-home-loan-vo {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-home_loan_vo)
}

.ico-colored-home-loan-vo-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-home_loan_vo);
    mask-image: var(--path-solid-colored-home_loan_vo)
}

.ico-colored-housing {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-housing)
}

.ico-colored-housing-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-housing);
    mask-image: var(--path-solid-colored-housing)
}

.ico-colored-income {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-income)
}

.ico-colored-income-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-income);
    mask-image: var(--path-solid-colored-income)
}

.ico-colored-institution {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-institution)
}

.ico-colored-institution-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-institution);
    mask-image: var(--path-solid-colored-institution)
}

.ico-colored-interest {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-interest)
}

.ico-colored-interest-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-interest);
    mask-image: var(--path-solid-colored-interest)
}

.ico-colored-investment {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-investment)
}

.ico-colored-investment-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-investment);
    mask-image: var(--path-solid-colored-investment)
}

.ico-colored-letter {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-letter)
}

.ico-colored-letter-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-letter);
    mask-image: var(--path-solid-colored-letter)
}

.ico-colored-life {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-life)
}

.ico-colored-life-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-life);
    mask-image: var(--path-solid-colored-life)
}

.ico-colored-like {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-like)
}

.ico-colored-like-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-like);
    mask-image: var(--path-solid-colored-like)
}

.ico-colored-loan {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-loan)
}

.ico-colored-loan-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-loan);
    mask-image: var(--path-solid-colored-loan)
}

.ico-colored-lock {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-lock)
}

.ico-colored-lock-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-lock);
    mask-image: var(--path-solid-colored-lock)
}

.ico-colored-lock-add {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-lock_add)
}

.ico-colored-lock-add-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-lock_add);
    mask-image: var(--path-solid-colored-lock_add)
}

.ico-colored-lock-error {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-lock_error)
}

.ico-colored-lock-error-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-lock_error);
    mask-image: var(--path-solid-colored-lock_error)
}

.ico-colored-lock-success {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-lock_success)
}

.ico-colored-lock-success-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-lock_success);
    mask-image: var(--path-solid-colored-lock_success)
}

.ico-colored-lock-switch {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-lock_switch)
}

.ico-colored-lock-switch-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-lock_switch);
    mask-image: var(--path-solid-colored-lock_switch)
}

.ico-colored-lock-warning {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-lock_warning)
}

.ico-colored-lock-warning-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-lock_warning);
    mask-image: var(--path-solid-colored-lock_warning)
}

.ico-colored-lugage {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-lugage)
}

.ico-colored-lugage-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-lugage);
    mask-image: var(--path-solid-colored-lugage)
}

.ico-colored-luggage {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-luggage)
}

.ico-colored-luggage-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-luggage);
    mask-image: var(--path-solid-colored-luggage)
}

.ico-colored-message {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-message)
}

.ico-colored-message-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-message);
    mask-image: var(--path-solid-colored-message)
}

.ico-colored-message-add {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-message_add)
}

.ico-colored-message-add-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-message_add);
    mask-image: var(--path-solid-colored-message_add)
}

.ico-colored-message-check {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-message_check)
}

.ico-colored-message-check-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-message_check);
    mask-image: var(--path-solid-colored-message_check)
}

.ico-colored-message-error {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-message_error)
}

.ico-colored-message-error-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-message_error);
    mask-image: var(--path-solid-colored-message_error)
}

.ico-colored-message-switch {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-message_switch)
}

.ico-colored-message-switch-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-message_switch);
    mask-image: var(--path-solid-colored-message_switch)
}

.ico-colored-message-warning {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-message_warning)
}

.ico-colored-message-warning-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-message_warning);
    mask-image: var(--path-solid-colored-message_warning)
}

.ico-colored-mirror {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-mirror)
}

.ico-colored-mirror-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-mirror);
    mask-image: var(--path-solid-colored-mirror)
}

.ico-colored-moneybag-loan {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-moneybag_loan)
}

.ico-colored-moneybag-loan-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-moneybag_loan);
    mask-image: var(--path-solid-colored-moneybag_loan)
}

.ico-colored-moneybag-loan-vo {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-moneybag_loan_vo)
}

.ico-colored-moneybag-loan-vo-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-moneybag_loan_vo);
    mask-image: var(--path-solid-colored-moneybag_loan_vo)
}

.ico-colored-movie {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-movie)
}

.ico-colored-movie-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-movie);
    mask-image: var(--path-solid-colored-movie)
}

.ico-colored-none {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-none)
}

.ico-colored-none-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-none);
    mask-image: var(--path-solid-colored-none)
}

.ico-colored-notice {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-notice)
}

.ico-colored-notice-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-notice);
    mask-image: var(--path-solid-colored-notice)
}

.ico-colored-null-account-krw {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-null_account_krw)
}

.ico-colored-null-account-krw-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-null_account_krw);
    mask-image: var(--path-solid-colored-null_account_krw)
}

.ico-colored-null-bag-krw {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-null_bag_krw)
}

.ico-colored-null-bag-krw-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-null_bag_krw);
    mask-image: var(--path-solid-colored-null_bag_krw)
}

.ico-colored-null-card {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-null_card)
}

.ico-colored-null-card-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-null_card);
    mask-image: var(--path-solid-colored-null_card)
}

.ico-colored-null-coupon {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-null_coupon)
}

.ico-colored-null-coupon-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-null_coupon);
    mask-image: var(--path-solid-colored-null_coupon)
}

.ico-colored-null-exclamation-circle {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-null_exclamation_circle)
}

.ico-colored-null-exclamation-circle-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-null_exclamation_circle);
    mask-image: var(--path-solid-colored-null_exclamation_circle)
}

.ico-colored-null-paper {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-null_paper)
}

.ico-colored-null-paper-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-null_paper);
    mask-image: var(--path-solid-colored-null_paper)
}

.ico-colored-pencil {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-pencil)
}

.ico-colored-pencil-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-pencil);
    mask-image: var(--path-solid-colored-pencil)
}

.ico-colored-phone {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-phone)
}

.ico-colored-phone-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-phone);
    mask-image: var(--path-solid-colored-phone)
}

.ico-colored-phone-add {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-phone_add)
}

.ico-colored-phone-add-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-phone_add);
    mask-image: var(--path-solid-colored-phone_add)
}

.ico-colored-phone-check {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-phone_check)
}

.ico-colored-phone-check-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-phone_check);
    mask-image: var(--path-solid-colored-phone_check)
}

.ico-colored-phone-error {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-phone_error)
}

.ico-colored-phone-error-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-phone_error);
    mask-image: var(--path-solid-colored-phone_error)
}

.ico-colored-phone-money {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-phone_money)
}

.ico-colored-phone-money-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-phone_money);
    mask-image: var(--path-solid-colored-phone_money)
}

.ico-colored-phone-switch {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-phone_switch)
}

.ico-colored-phone-switch-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-phone_switch);
    mask-image: var(--path-solid-colored-phone_switch)
}

.ico-colored-phone-warning {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-phone_warning)
}

.ico-colored-phone-warning-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-phone_warning);
    mask-image: var(--path-solid-colored-phone_warning)
}

.ico-colored-phone-wifi {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-phone_wifi)
}

.ico-colored-phone-wifi-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-phone_wifi);
    mask-image: var(--path-solid-colored-phone_wifi)
}

.ico-colored-pill {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-pill)
}

.ico-colored-pill-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-pill);
    mask-image: var(--path-solid-colored-pill)
}

.ico-colored-point {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-point)
}

.ico-colored-point-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-point);
    mask-image: var(--path-solid-colored-point)
}

.ico-colored-popcorn {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-popcorn)
}

.ico-colored-popcorn-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-popcorn);
    mask-image: var(--path-solid-colored-popcorn)
}

.ico-colored-review {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-review)
}

.ico-colored-review-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-review);
    mask-image: var(--path-solid-colored-review)
}

.ico-colored-reward {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-reward)
}

.ico-colored-reward-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-reward);
    mask-image: var(--path-solid-colored-reward)
}

.ico-colored-ring {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-ring)
}

.ico-colored-ring-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-ring);
    mask-image: var(--path-solid-colored-ring)
}

.ico-colored-rocket {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-rocket)
}

.ico-colored-rocket-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-rocket);
    mask-image: var(--path-solid-colored-rocket)
}

.ico-colored-search {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-search)
}

.ico-colored-search-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-search);
    mask-image: var(--path-solid-colored-search)
}

.ico-colored-shield {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-shield)
}

.ico-colored-shield-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-shield);
    mask-image: var(--path-solid-colored-shield)
}

.ico-colored-shopping {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-shopping)
}

.ico-colored-shopping-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-shopping);
    mask-image: var(--path-solid-colored-shopping)
}

.ico-colored-shopping-travel {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-shopping_travel)
}

.ico-colored-shopping-travel-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-shopping_travel);
    mask-image: var(--path-solid-colored-shopping_travel)
}

.ico-colored-star-ico-pri-active {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-star_ico-pri-active)
}

.ico-colored-star-ico-pri-active-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-star_ico-pri-active);
    mask-image: var(--path-solid-colored-star_ico-pri-active)
}

.ico-colored-star-ico-pri-error {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-star_ico-pri-error)
}

.ico-colored-star-ico-pri-error-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-star_ico-pri-error);
    mask-image: var(--path-solid-colored-star_ico-pri-error)
}

.ico-colored-star-ico-pri-invert {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-star_ico-pri-invert)
}

.ico-colored-star-ico-pri-invert-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-star_ico-pri-invert);
    mask-image: var(--path-solid-colored-star_ico-pri-invert)
}

.ico-colored-star-ico-pri-like {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-star_ico-pri-like)
}

.ico-colored-star-ico-pri-like-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-star_ico-pri-like);
    mask-image: var(--path-solid-colored-star_ico-pri-like)
}

.ico-colored-star-ico-pri-success {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-star_ico-pri-success)
}

.ico-colored-star-ico-pri-success-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-star_ico-pri-success);
    mask-image: var(--path-solid-colored-star_ico-pri-success)
}

.ico-colored-star-ico-sec-active {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-star_ico-sec-active)
}

.ico-colored-star-ico-sec-active-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-star_ico-sec-active);
    mask-image: var(--path-solid-colored-star_ico-sec-active)
}

.ico-colored-star-ico-ter {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-star_ico-ter)
}

.ico-colored-star-ico-ter-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-star_ico-ter);
    mask-image: var(--path-solid-colored-star_ico-ter)
}

.ico-colored-star-ico-ter-active {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-star_ico-ter-active)
}

.ico-colored-star-ico-ter-active-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-star_ico-ter-active);
    mask-image: var(--path-solid-colored-star_ico-ter-active)
}

.ico-colored-stroller {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-stroller)
}

.ico-colored-stroller-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-stroller);
    mask-image: var(--path-solid-colored-stroller)
}

.ico-colored-success {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-success)
}

.ico-colored-success-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-success);
    mask-image: var(--path-solid-colored-success)
}

.ico-colored-switch {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-switch)
}

.ico-colored-switch-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-switch);
    mask-image: var(--path-solid-colored-switch)
}

.ico-colored-switch-bu {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-switch_bu)
}

.ico-colored-switch-bu-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-switch_bu);
    mask-image: var(--path-solid-colored-switch_bu)
}

.ico-colored-taxi {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-taxi)
}

.ico-colored-taxi-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-taxi);
    mask-image: var(--path-solid-colored-taxi)
}

.ico-colored-tennis-ball {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-tennis_ball)
}

.ico-colored-tennis-ball-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-tennis_ball);
    mask-image: var(--path-solid-colored-tennis_ball)
}

.ico-colored-train {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-train)
}

.ico-colored-train-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-train);
    mask-image: var(--path-solid-colored-train)
}

.ico-colored-transfer {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-transfer)
}

.ico-colored-transfer-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-transfer);
    mask-image: var(--path-solid-colored-transfer)
}

.ico-colored-umbrella {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-umbrella)
}

.ico-colored-umbrella-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-umbrella);
    mask-image: var(--path-solid-colored-umbrella)
}

.ico-colored-user {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-user)
}

.ico-colored-user-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-user);
    mask-image: var(--path-solid-colored-user)
}

.ico-colored-users {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-users)
}

.ico-colored-users-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-users);
    mask-image: var(--path-solid-colored-users)
}

.ico-colored-warning {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-warning)
}

.ico-colored-warning-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-warning);
    mask-image: var(--path-solid-colored-warning)
}

.ico-colored-warning-yl {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-warning_yl)
}

.ico-colored-warning-yl-mask {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-mask-image: var(--path-solid-colored-warning_yl);
    mask-image: var(--path-solid-colored-warning_yl)
}

[class^='ico-colored-'] {
    background-size: contain
}

[class^='ico-colored-'].w20 {
    width: 2rem !important;
    height: 2rem !important;
    -webkit-box-flex: 0 !important;
    -ms-flex: 0 0 2rem !important;
    flex: 0 0 2rem !important
}

[class^='ico-colored-'].w24 {
    width: 2.4rem !important;
    height: 2.4rem !important;
    -webkit-box-flex: 0 !important;
    -ms-flex: 0 0 2.4rem !important;
    flex: 0 0 2.4rem !important
}

[class^='ico-colored-'].w28 {
    width: 2.8rem !important;
    height: 2.8rem !important;
    -webkit-box-flex: 0 !important;
    -ms-flex: 0 0 2.8rem !important;
    flex: 0 0 2.8rem !important
}

[class^='ico-colored-'].w32 {
    width: 3.2rem !important;
    height: 3.2rem !important;
    -webkit-box-flex: 0 !important;
    -ms-flex: 0 0 3.2rem !important;
    flex: 0 0 3.2rem !important
}

[class^='ico-colored-'].w34 {
    width: 3.4rem !important;
    height: 3.4rem !important;
    -webkit-box-flex: 0 !important;
    -ms-flex: 0 0 3.4rem !important;
    flex: 0 0 3.4rem !important
}

[class^='ico-colored-'].w36 {
    width: 3.6rem !important;
    height: 3.6rem !important;
    -webkit-box-flex: 0 !important;
    -ms-flex: 0 0 3.6rem !important;
    flex: 0 0 3.6rem !important
}

[class^='ico-colored-'].w40 {
    width: 4rem !important;
    height: 4rem !important;
    -webkit-box-flex: 0 !important;
    -ms-flex: 0 0 4rem !important;
    flex: 0 0 4rem !important
}

[class^='ico-colored-'].w44 {
    width: 4.4rem !important;
    height: 4.4rem !important;
    -webkit-box-flex: 0 !important;
    -ms-flex: 0 0 4.4rem !important;
    flex: 0 0 4.4rem !important
}

[class^='ico-colored-'].w46 {
    width: 4.6rem !important;
    height: 4.6rem !important;
    -webkit-box-flex: 0 !important;
    -ms-flex: 0 0 4.6rem !important;
    flex: 0 0 4.6rem !important
}

[class^='ico-colored-'].w48 {
    width: 4.8rem !important;
    height: 4.8rem !important;
    -webkit-box-flex: 0 !important;
    -ms-flex: 0 0 4.8rem !important;
    flex: 0 0 4.8rem !important
}

[class^='ico-colored-'].w50 {
    width: 5rem !important;
    height: 5rem !important;
    -webkit-box-flex: 0 !important;
    -ms-flex: 0 0 5rem !important;
    flex: 0 0 5rem !important
}

[class^='ico-colored-'].w62 {
    width: 6.2rem !important;
    height: 6.2rem !important;
    -webkit-box-flex: 0 !important;
    -ms-flex: 0 0 6.2rem !important;
    flex: 0 0 6.2rem !important
}

[class^='ico-colored-'].w64 {
    width: 6.4rem !important;
    height: 6.4rem !important;
    -webkit-box-flex: 0 !important;
    -ms-flex: 0 0 6.4rem !important;
    flex: 0 0 6.4rem !important
}

[class^='ico-colored-'].w70 {
    width: 7rem !important;
    height: 7rem !important;
    -webkit-box-flex: 0 !important;
    -ms-flex: 0 0 7rem !important;
    flex: 0 0 7rem !important
}

[class^='ico-colored-'].w72 {
    width: 7.2rem !important;
    height: 7.2rem !important;
    -webkit-box-flex: 0 !important;
    -ms-flex: 0 0 7.2rem !important;
    flex: 0 0 7.2rem !important
}

.kds-3d-emoji-positive-happy-oragne {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-emoji-positive_happy_yellow)
}

.kds-3d-emoji-positive-happy-oragne-12x {
    width: 12rem;
    height: 12rem;
    background-image: var(--path-3d-emoji-positive_happy_yellow_12x)
}

.kds-3d-emoji-positive-smile3-oragne {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-emoji-positive_smile3_yellow)
}

.kds-3d-emoji-positive-smile3-oragne-12x {
    width: 12rem;
    height: 12rem;
    background-image: var(--path-3d-emoji-positive_smile3_yellow_12x)
}

.kds-3d-achieve-medal-star-silver {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-achieve-medal_star_silver)
}

.kds-3d-arrow-exchange-glass-navy-leftup {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-arrow-exchange_glass_navy_leftup)
}

.kds-3d-arrow-exchange-navy-leftup {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-arrow-exchange_navy_leftup)
}

.kds-3d-arrow-rotate-glass-navy-leftup {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-arrow-rotate_glass_navy_leftup)
}

.kds-3d-bank-account-close-navy {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-bank-account_close_navy)
}

.kds-3d-bank-account-close-navy-left {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-bank-account_close_navy_left)
}

.kds-3d-bank-account-close-navy-rightup {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-bank-account_close_navy_rightup)
}

.kds-3d-bank-creditcard-blank-navy-left {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-bank-creditcard_blank_navy_left)
}

.kds-3d-bank-creditcard-blank-navy-up {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-bank-creditcard_blank_navy_up)
}

.kds-3d-bank-envelope-horizontal-open-1000-navy {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-bank-envelope_horizontal_open_1000_navy)
}

.kds-3d-bank-envelope-horizontal-open-10000-navy {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-bank-envelope_horizontal_open_10000_navy)
}

.kds-3d-bank-envelope-horizontal-open-50000-navy {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-bank-envelope_horizontal_open_50000_navy)
}

.kds-3d-bank-envelope-vertical-white {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-bank-envelope_vertical_white)
}

.kds-3d-bank-gold-ticket-combi {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-bank-gold_ticket_combi)
}

.kds-3d-bank-vault-open-navy-left {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-bank-vault_open_navy_left)
}

.kds-3d-bank-account-close-navy-right {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-bank-account_close_navy_right)
}

.kds-3d-bill-10000-bundle-iso-white {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-bill-10000_bundle_iso_white)
}

.kds-3d-bill-10000-portrait-bundle-iso-white {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-bill-10000_portrait_bundle_iso_white)
}

.kds-3d-bill-50000-bundle-iso-white {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-bill-50000_bundle_iso_white)
}

.kds-3d-building-house-navy-iso {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-building-house_navy_iso)
}

.kds-3d-celeb-confetti-navy-rightup {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-celeb-confetti_navy_rightup)
}

.kds-3d-coin-bitcoin-orange-rightup {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-coin-bitcoin_orange_rightup)
}

.kds-3d-coin-krw-navy {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-coin-krw_navy)
}

.kds-3d-document-file-navy-iso {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-document-file_navy_iso)
}

.kds-3d-document-folder-silver-left {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-document-folder_silver_left)
}

.kds-3d-document-graduationcap {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-document-graduationcap)
}

.kds-3d-emoji-negative-angry2-red {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-emoji-negative_angry2_red)
}

.kds-3d-emoji-negative-blue {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-emoji-negative_blue)
}

.kds-3d-emoji-negative-blue-typing {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-emoji-negative_blue_typing)
}

.kds-3d-emoji-negative-devil-red {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-emoji-negative_devil_red)
}

.kds-3d-emoji-negative-dislike-blue {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-emoji-negative_dislike_blue)
}

.kds-3d-emoji-negative-dislike-red {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-emoji-negative_dislike_red)
}

.kds-3d-emoji-negative-embarrass-blue {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-emoji-negative_embarrass_blue)
}

.kds-3d-emoji-negative-sad-blue {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-emoji-negative_sad_blue)
}

.kds-3d-emoji-positive-happy-yellow {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-emoji-positive_happy_yellow)
}

.kds-3d-emoji-positive-heart-yellow {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-emoji-positive_heart_yellow)
}

.kds-3d-emoji-positive-smile1-yellow-heart {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-emoji-positive_smile1_yellow_heart)
}

.kds-3d-emoji-positive-smile3-yellow {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-emoji-positive_smile3_yellow)
}

.kds-3d-emoji-positive-yellow {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-emoji-positive_yellow)
}

.kds-3d-emoji-positive-yellow-question {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-emoji-positive_yellow_question)
}

.kds-3d-emoji-positive-yellow-typing {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-emoji-positive_yellow_typing)
}

.kds-3d-etc-heart-red {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-etc-heart_red)
}

.kds-3d-etc-joystick-navy {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-etc-joystick_navy)
}

.kds-3d-etc-lucky-clover-green-left {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-etc-lucky_clover_green_left)
}

.kds-3d-etc-star-left-blue {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-etc-star_left_blue)
}

.kds-3d-gift-navy-left {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-gift-navy_left)
}

.kds-3d-gift-navy-left-tiltup2 {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-gift-navy_left_tiltup2)
}

.kds-3d-gift-navy-left-2 {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-gift-navy_left_2)
}

.kds-3d-glob-earth-green-airplane {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-glob-earth_green_airplane)
}

.kds-3d-graph-bar-navy {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-graph-bar_navy)
}

.kds-3d-graph-circle-leftup {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-graph-circle_leftup)
}

.kds-3d-graph-stock-down {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-graph-stock_down)
}

.kds-3d-graph-stock-up {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-graph-stock_up)
}

.kds-3d-hand-clap-point {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-hand-clap_point)
}

.kds-3d-hand-give-coin-krw-gold {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-hand-give_coin_krw_gold)
}

.kds-3d-hand-give-heart-navy {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-hand-give_heart_navy)
}

.kds-3d-hand-give-heart-red {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-hand-give_heart_red)
}

.kds-3d-hand-give-moneybag-navy {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-hand-give_moneybag_navy)
}

.kds-3d-hand-give-wallet-full {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-hand-give_wallet_full)
}

.kds-3d-hand-grasp-credit-card-navy-left {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-hand-grasp_credit_card_navy_left)
}

.kds-3d-industry-chemystry {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-industry-chemystry)
}

.kds-3d-industry-cloud {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-industry-cloud)
}

.kds-3d-industry-ironpipe {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-industry-ironpipe)
}

.kds-3d-industry-microchip {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-industry-microchip)
}

.kds-3d-industry-robot-blue {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-industry-robot_blue)
}

.kds-3d-industry-safety-helmet-yellow {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-industry-safety_helmet_yellow)
}

.kds-3d-life-basket-navy-leftup {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-life-basket_navy_leftup)
}

.kds-3d-life-dumbbell {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-life-dumbbell)
}

.kds-3d-life-fashion-white {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-life-fashion_white)
}

.kds-3d-life-juice-navy-tiltright {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-life-juice_navy_tiltright)
}

.kds-3d-life-lipstick {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-life-lipstick)
}

.kds-3d-life-movie-black {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-life-movie_black)
}

.kds-3d-life-plant {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-life-plant)
}

.kds-3d-life-rice {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-life-rice)
}

.kds-3d-life-trip-palmtree {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-life-trip_palmtree)
}

.kds-3d-life-washingmachine {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-life-washingmachine)
}

.kds-3d-medical-drug-combination-light-blue {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-medical-drug_combination_light_blue)
}

.kds-3d-mobile-kbank-navy-leftup2 {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-mobile-kbank_navy_leftup2)
}

.kds-3d-moneybag-krw-navy {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-moneybag-krw_navy)
}

.kds-3d-moneybag-krw-navy-left {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-moneybag-krw_navy_left)
}

.kds-3d-moneybag-krw-navy-rightup {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-moneybag-krw_navy_rightup)
}

.kds-3d-moneybag-krw-white {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-moneybag-krw_white)
}

.kds-3d-moneybag-krw-white-left {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-moneybag-krw_white_left)
}

.kds-3d-notice-bell-off-navy {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-notice-bell_off_navy)
}

.kds-3d-notice-bell-off-silver {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-notice-bell_off_silver)
}

.kds-3d-notice-bulb-on-white {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-notice-bulb_on_white)
}

.kds-3d-notice-calendar-blank-white-left {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-notice-calendar_blank_white_left)
}

.kds-3d-notice-calendar-paper-check-left {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-notice-calendar_paper_check_left)
}

.kds-3d-notice-hourglass {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-notice-hourglass)
}

.kds-3d-notice-megaphone-off-navy-right {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-notice-megaphone_off_navy_right)
}

.kds-3d-notice-megaphone-off-white-right {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-notice-megaphone_off_white_right)
}

.kds-3d-notice-mic-front {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-notice-mic_front)
}

.kds-3d-notice-timer-white {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-notice-timer_white)
}

.kds-3d-notice-timer-white-left-tiltright {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-notice-timer_white_left_tiltright)
}

.kds-3d-setting-chain-connect-off-navy {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-setting-chain_connect_off_navy)
}

.kds-3d-setting-chain-connect-on-navy {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-setting-chain_connect_on_navy)
}

.kds-3d-setting-loading-circle-navy {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-setting-loading_circle_navy)
}

.kds-3d-setting-lock-navy-leftup {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-setting-lock_navy_leftup)
}

.kds-3d-setting-shield-check-navy-leftuup {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-setting-shield_check_navy_leftuup)
}

.kds-3d-setting-shield-check-white-leftup {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-setting-shield_check_white_leftup)
}

.kds-3d-setting-warningsign-red {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-setting-warningsign_red)
}

.kds-3d-shop-shop-B-navy-iso {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-shop-shop_B_navy_iso)
}

.kds-3d-store-diamond-left-tiltright {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-store-diamond_left_tiltright)
}

.kds-3d-store-percent-plate-navy-leftup {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-store-percent_plate_navy_leftup)
}

.kds-3d-store-shop-A-navy-down {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-store-shop_A_navy_down)
}

.kds-3d-store-shop-A-navy-iso {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-store-shop_A_navy_iso)
}

.kds-3d-store-sunglass-navy-left {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-store-sunglass_navy_left)
}

.kds-3d-talk-circle-exclamation-navy {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-talk-circle_exclamation_navy)
}

.kds-3d-talk-circle-exclamation-white {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-talk-circle_exclamation_white)
}

.kds-3d-talk-cloud-question-navy {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-talk-cloud_question_navy)
}

.kds-3d-traffic-car-navy-iso {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-traffic-car_navy_iso)
}

.kds-3d-traffic-ev-white-iso {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-traffic-ev_white_iso)
}

.kds-3d-traffic-rocket-navy {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-traffic-rocket_navy)
}

.kds-3d-traffic-ship-navy {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-traffic-ship_navy)
}

.kds-3d-traffic-tank-green {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-traffic-tank_green)
}

.kds-3d-traffic-truck-navy-right {
    width: 7.2rem;
    height: 7.2rem;
    background-image: var(--path-3d-traffic-truck_navy_right)
}

.kds-3d-achieve-medal-star-silver-12x {
    width: 12rem;
    height: 12rem;
    background-image: var(--path-3d-achieve-medal_star_silver_12x)
}

.kds-3d-achieve-trophy-star-silver-12x {
    width: 12rem;
    height: 12rem;
    background-image: var(--path-3d-achieve-trophy_star_silver_12x)
}

.kds-3d-arrow-exchange-navy-leftup-12x {
    width: 12rem;
    height: 12rem;
    background-image: var(--path-3d-arrow-exchange_navy_leftup_12x)
}

.kds-3d-celeb-confetti-navy-rightup-12x {
    width: 12rem;
    height: 12rem;
    background-image: var(--path-3d-celeb-confetti_navy_rightup_12x)
}

.kds-3d-document-file-navy-iso-12x {
    width: 12rem;
    height: 12rem;
    background-image: var(--path-3d-document-file_navy_iso_12x)
}

.kds-3d-emoji-negative-embarrass-blue-12x {
    width: 12rem;
    height: 12rem;
    background-image: var(--path-3d-emoji-negative_embarrass_blue_12x)
}

.kds-3d-emoji-negative-sad-blue-12x {
    width: 12rem;
    height: 12rem;
    background-image: var(--path-3d-emoji-negative_sad_blue_12x)
}

.kds-3d-emoji-positive-bigeye-yellow-12x {
    width: 12rem;
    height: 12rem;
    background-image: var(--path-3d-emoji-positive_bigeye_yellow_12x)
}

.kds-3d-emoji-positive-happy-yellow-12x {
    width: 12rem;
    height: 12rem;
    background-image: var(--path-3d-emoji-positive_happy_yellow_12x)
}

.kds-3d-emoji-positive-happy-yellow-heart-navy-12x {
    width: 12rem;
    height: 12rem;
    background-image: var(--path-3d-emoji-positive_happy_yellow_heart_navy_12x)
}

.kds-3d-emoji-positive-smile3-yellow-12x {
    width: 12rem;
    height: 12rem;
    background-image: var(--path-3d-emoji-positive_smile3_yellow_12x)
}

.kds-3d-emoji-positive-yellow-typing-12x {
    width: 12rem;
    height: 12rem;
    background-image: var(--path-3d-emoji-positive_yellow_typing_12x)
}

.kds-3d-etc-lucky-clover-green-left-12x {
    width: 12rem;
    height: 12rem;
    background-image: var(--path-3d-etc-lucky_clover_green_left_12x)
}

.kds-3d-gift-navy-left-tiltup2-12x {
    width: 12rem;
    height: 12rem;
    background-image: var(--path-3d-gift-navy_left_tiltup2_12x)
}

.kds-3d-hand-give-heart-red-12x {
    width: 12rem;
    height: 12rem;
    background-image: var(--path-3d-hand-give_heart_red_12x)
}

.kds-3d-hand-grasp-search-blank-right-12x {
    width: 12rem;
    height: 12rem;
    background-image: var(--path-3d-hand-grasp_search_blank_right_12x)
}

.kds-3d-medical-heart-beat-navy-12x {
    width: 12rem;
    height: 12rem;
    background-image: var(--path-3d-medical-heart_beat_navy_12x)
}

.kds-3d-moneybag-krw-navy-leftup-12x {
    width: 12rem;
    height: 12rem;
    background-image: var(--path-3d-moneybag-krw_navy_leftup_12x)
}

.kds-3d-notice-megaphone-on-white-right-12x {
    width: 12rem;
    height: 12rem;
    background-image: var(--path-3d-notice-megaphone_on_white_right_12x)
}

.kds-3d-notice-timer-white-12x {
    width: 12rem;
    height: 12rem;
    background-image: var(--path-3d-notice-timer_white_12x)
}

.kds-3d-setting-circle-check-white-12x {
    width: 12rem;
    height: 12rem;
    background-image: var(--path-3d-setting-circle_check_white_12x)
}

.kds-3d-setting-loading-circle-navy-12x {
    width: 12rem;
    height: 12rem;
    background-image: var(--path-3d-setting-loading_circle_navy_12x)
}

.kds-3d-setting-lock-navy-leftup-12x {
    width: 12rem;
    height: 12rem;
    background-image: var(--path-3d-setting-lock_navy_leftup_12x)
}

.kds-3d-setting-shield-check-navy-left-12x {
    width: 12rem;
    height: 12rem;
    background-image: var(--path-3d-setting-shield_check_navy_left_12x)
}

.kds-3d-store-shop-A-navy-down-12x {
    width: 12rem;
    height: 12rem;
    background-image: var(--path-3d-store-shop_A_navy_down_12x)
}

.kds-3d-talk-cloud-question-white-12x {
    width: 12rem;
    height: 12rem;
    background-image: var(--path-3d-talk-cloud_question_white_12x)
}

.kds-3d-talk-square-exclamation-white-12x {
    width: 12rem;
    height: 12rem;
    background-image: var(--path-3d-talk-square_exclamation_white_12x)
}

[class^='kds-3d-'].w24 {
    width: 2.4rem;
    height: 2.4rem
}

[class^='kds-3d-'].w28 {
    width: 2.8rem;
    height: 2.8rem
}

[class^='kds-3d-'].w32 {
    width: 3.2rem;
    height: 3.2rem
}

[class^='kds-3d-'].w34 {
    width: 3.4rem;
    height: 3.4rem
}

[class^='kds-3d-'].w36 {
    width: 3.6rem;
    height: 3.6rem
}

[class^='kds-3d-'].w40 {
    width: 4rem;
    height: 4rem
}

[class^='kds-3d-'].w44 {
    width: 4.4rem;
    height: 4.4rem
}

[class^='kds-3d-'].w48 {
    width: 4.8rem;
    height: 4.8rem
}

[class^='kds-3d-'].w50 {
    width: 5rem;
    height: 5rem
}

[class^='kds-3d-'].w62 {
    width: 6.2rem;
    height: 6.2rem
}

[class^='kds-3d-'].w64 {
    width: 6.4rem;
    height: 6.4rem
}

[class^='kds-3d-'].w72 {
    width: 7.2rem;
    height: 7.2rem
}

[class^='kds-3d-'].w80 {
    width: 8rem;
    height: 8rem
}

[class^='kds-3d-'].w90 {
    width: 9rem;
    height: 9rem
}

[class^='kds-3d-'].w92 {
    width: 9.2rem;
    height: 9.2rem
}

[class^='kds-3d-'].w100 {
    width: 10rem;
    height: 10rem
}

[class^='kds-3d-'].w104 {
    width: 10.4rem;
    height: 10.4rem
}

[class^='kds-3d-'].w120 {
    width: 12rem;
    height: 12rem
}

[class^='kds-3d-'].w135 {
    width: 13.5rem;
    height: 13.5rem
}

[class^='kds-3d-'].w160 {
    width: 16rem;
    height: 16rem
}

[class^='kds-3d-'].w170 {
    width: 17rem;
    height: 17rem
}

[class^='kds-3d-'].w172 {
    width: 17.2rem;
    height: 17.2rem
}

[class^='kds-3d-'].w176 {
    width: 17.6rem;
    height: 17.6rem
}

[class^='kds-3d-'].w180 {
    width: 18rem;
    height: 18rem
}

[class^='kds-3d-'] {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    background-size: contain
}

[class^='logo-etc-'] {
    display: inline-block;
    overflow: hidden;
    position: relative;
    border-radius: 50%;
    background-image: url("../../img/mmk/sprite_logo/logo_banknone.png");
    background-size: contain
}

[class^='logo-etc-']::after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 3;
    border-radius: 99rem;
    border: 0.5px solid rgba(0, 55, 138, 0.2)
}

.logo-etc-hf {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-square-logo_etc_hf)
}

.logo-etc-gcgf {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-square-logo_etc_gcgf)
}

[class^='logo-etc-'].w20 {
    width: 2rem;
    height: 2rem;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 2rem;
    flex: 0 0 2rem
}

[class^='logo-etc-'].w24 {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 2.4rem;
    flex: 0 0 2.4rem
}

[class^='logo-etc-'].w28 {
    width: 2.8rem;
    height: 2.8rem;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 2.8rem;
    flex: 0 0 2.8rem
}

[class^='logo-etc-'].w32 {
    width: 3.2rem;
    height: 3.2rem;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 3.2rem;
    flex: 0 0 3.2rem
}

[class^='logo-etc-'].w34 {
    width: 3.4rem;
    height: 3.4rem;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 3.4rem;
    flex: 0 0 3.4rem
}

[class^='logo-etc-'].w36 {
    width: 3.6rem;
    height: 3.6rem;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 3.6rem;
    flex: 0 0 3.6rem
}

[class^='logo-etc-'].w40 {
    width: 4rem;
    height: 4rem;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 4rem;
    flex: 0 0 4rem
}

[class^='logo-etc-'].w44 {
    width: 4.4rem;
    height: 4.4rem;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 4.4rem;
    flex: 0 0 4.4rem
}

[class^='logo-etc-'].w46 {
    width: 4.6rem;
    height: 4.6rem;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 4.6rem;
    flex: 0 0 4.6rem
}

[class^='logo-etc-'].w48 {
    width: 4.8rem;
    height: 4.8rem;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 4.8rem;
    flex: 0 0 4.8rem
}

[class^='logo-etc-'].w50 {
    width: 5rem;
    height: 5rem;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 5rem;
    flex: 0 0 5rem
}

[class^='logo-etc-'].w62 {
    width: 6.2rem;
    height: 6.2rem;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 6.2rem;
    flex: 0 0 6.2rem
}

[class^='logo-etc-'].w64 {
    width: 6.4rem;
    height: 6.4rem;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 6.4rem;
    flex: 0 0 6.4rem
}

[class^='logo-etc-'].w70 {
    width: 7rem;
    height: 7rem;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 7rem;
    flex: 0 0 7rem
}

[class^='logo-etc-'].w72 {
    width: 7.2rem;
    height: 7.2rem;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 7.2rem;
    flex: 0 0 7.2rem
}

.ico-colored-moenybag-loan {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-moneybag_loan)
}

/*!
* component element
* kds asset
* CHPFMTASK-1332 : [KDS] 3.56496 Asset
*/

.ico-solid-graph-area-up {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-graph-area-up)
}

.ico-solid-graph-area-down {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-graph-area-down)
}

/*!
* component element
* IRP연금계좌
* CHPFMTASK-1435
*/

.ico-one-dot {
    width: .6rem;
    height: .6rem;
    background: var(--ico-pri-up);
    border-radius: 100%
}

/*!
*  component element
*  icon
*  CHPFMTASK-1464 PBKMAN0000003401S 한번에 이자받기 프로세스 개선
*/

.ico-cash-coin2 {
    width: 2.4rem;
    height: 2.4rem;
    background-image: url("/resource/img/mmk/home/coin_home.svg")
}

/*!
*  component element
*  icon
*  CHPFMTASK-1499(대출 공통)
*/

.ico-shield {
    width: 3.2rem;
    height: 3.2rem;
    background-image: url("/resource/img/mmk/common/ico_shield.svg")
}

/*!
*  component element
*  icon
*  CHPFMTASK-1534 PBKMAN2001000000S_M01 사장님 홈 UX/UI 개선
*/

.ico-credit-report {
    width: 4rem;
    height: 4rem;
    background-image: url("/resource/img/mmk/home/ceo/icon_credit_report.png")
}

.ico-month-transfer {
    width: 4rem;
    height: 4rem;
    background-image: url("/resource/img/mmk/home/ceo/icon_transfer.png")
}

.ico-withdrawal {
    width: 2.4rem;
    height: 2.4rem;
    background-image: url("/resource/img/mmk/common/ico_withdrawal.svg")
}

.ico-ai-card-save {
    width: 6.4rem;
    height: 6.4rem;
    background: url("/resource/img/mmk/common/ico_talkbnn_check.png") no-repeat center;
    background-size: 6.4rem
}

.ico-crypto {
    width: 6.4rem;
    height: 6.4rem;
    background-image: url("/resource/img/mmk/common/ailive/crypto.png")
}

.ico-mo-cert-id {
    margin-right: 1.2rem;
    width: 3.2rem;
    background-image: url("/resource/img/mmk/common/ico_mo_cert_id.svg")
}

.ico-mo-driver-license {
    margin-right: 1.2rem;
    width: 3.2rem;
    background-image: url("/resource/img/mmk/common/ico_mo_driver_license.svg")
}

/*!
*  component element
*  icon
*  CHPFMTASK-1883 PBKOFR010000A100S_M01 오늘의 쿠폰
*/

.ico-all {
    width: 2.4rem;
    height: 2.4rem;
    background-image: url(/resource/img/mmk/common/logo/coupon/all.svg)
}

.ico-logo-badge {
    width: 1.6rem;
    height: 1.6rem;
    background-image: url(/resource/img/mmk/common/today_coupon/badge.svg)
}

.ico-empty-heart {
    width: 3.6rem;
    height: 3.6rem;
    background-image: url(/resource/img/mmk/common/today_coupon/empty_heart.svg)
}

/*!
*  component element
*  icon
*  CHPFMTASK-1857 PBKMAN2001000000S_M01 사장님홈
*/

.ico-chat-increase {
    width: 2rem;
    height: 2rem;
    background-image: url(/resource/img/mmk/common/ico_chat_increase.png)
}

.ico-chat-stable {
    width: 2rem;
    height: 2rem;
    background-image: url(/resource/img/mmk/common/ico_chat_stable.png)
}

.ico-chat-decrease {
    width: 2rem;
    height: 2rem;
    background-image: url(/resource/img/mmk/common/ico_chat_decrease.png)
}

/*!
* component element
* icon
*  CHPFMTASK-1828 PBKINQ040112A100S_M01 별 모으기
*/

.ico-colored-lock.dark {
    background-image: url("/resource/img/mmk/svg_common/lock_dark.svg")
}

/*!
* component element
* icon
*  CHPFMTASK-1931 오픈뱅킹 안심차단 서비스
*/

.ico-safe-block {
    width: 8rem;
    height: 8rem;
    background-image: url("/resource/img/mmk/common/ico_safe_block.png")
}

/*!
* component element
* icon
*  CHPFMTASK-1742 머니미션
*/

.ico-mission-1 {
    width: 4.2rem;
    height: 4.2rem;
    background-image: url(/resource/img/mmk/common/moneymission/moneymission_1.png);
    background-size: 4.2rem 7.8rem;
    background-position: center 0
}

.ico-mission-2 {
    width: 4.2rem;
    height: 4.2rem;
    background-image: url(/resource/img/mmk/common/moneymission/moneymission_2.png);
    background-size: 4.2rem 7.8rem;
    background-position: center 0
}

.ico-mission-3 {
    width: 4.2rem;
    height: 4.2rem;
    background-image: url(/resource/img/mmk/common/moneymission/moneymission_3.png);
    background-size: 4.2rem 7.8rem;
    background-position: center 0
}

.ico-mission-4 {
    width: 4.2rem;
    height: 4.2rem;
    background-image: url(/resource/img/mmk/common/moneymission/moneymission_4.png);
    background-size: 4.2rem 7.8rem;
    background-position: center 0
}

.ico-mission-5 {
    width: 4.2rem;
    height: 4.2rem;
    background-image: url(/resource/img/mmk/common/moneymission/moneymission_5.png);
    background-size: 4.2rem 7.8rem;
    background-position: center 0
}

.ico-mission-6 {
    width: 4.2rem;
    height: 4.2rem;
    background-image: url(/resource/img/mmk/common/moneymission/moneymission_6.png);
    background-size: 4.2rem 7.8rem;
    background-position: center 0
}

.ico-mission-7 {
    width: 4.2rem;
    height: 4.2rem;
    background-image: url(/resource/img/mmk/common/moneymission/moneymission_7.png);
    background-size: 4.2rem 7.8rem;
    background-position: center 0
}

.ico-mission-8 {
    width: 4.2rem;
    height: 4.2rem;
    background-image: url(/resource/img/mmk/common/moneymission/moneymission_8.png);
    background-size: 4.2rem 7.8rem;
    background-position: center 0
}

.ico-mission-9 {
    width: 4.2rem;
    height: 4.2rem;
    background-image: url(/resource/img/mmk/common/moneymission/moneymission_9.png);
    background-size: 4.2rem 7.8rem;
    background-position: center 0
}

.ico-mission-10 {
    width: 4.2rem;
    height: 4.2rem;
    background-image: url(/resource/img/mmk/common/moneymission/moneymission_10.png);
    background-size: 4.2rem 7.8rem;
    background-position: center 0
}

.ico-mission-11 {
    width: 4.2rem;
    height: 4.2rem;
    background-image: url(/resource/img/mmk/common/moneymission/moneymission_3.png);
    background-size: 4.2rem 7.8rem;
    background-position: center 0
}

.ico-mission-12 {
    width: 4.2rem;
    height: 4.2rem;
    background-image: url(/resource/img/mmk/common/moneymission/moneymission_4.png);
    background-size: 4.2rem 7.8rem;
    background-position: center 0
}

.ico-mission-13 {
    width: 4.2rem;
    height: 4.2rem;
    background-image: url(/resource/img/mmk/common/moneymission/moneymission_11.png);
    background-size: 4.2rem 7.8rem;
    background-position: center 0
}

.ico-mission-14 {
    width: 4.2rem;
    height: 4.2rem;
    background-image: url(/resource/img/mmk/common/moneymission/moneymission_6.png);
    background-size: 4.2rem 7.8rem;
    background-position: center 0
}

.ico-mission-15 {
    width: 4.2rem;
    height: 4.2rem;
    background-image: url(/resource/img/mmk/common/moneymission/moneymission_12.png);
    background-size: 4.2rem 7.8rem;
    background-position: center 0
}

.ico-mission-16 {
    width: 4.2rem;
    height: 4.2rem;
    background-image: url(/resource/img/mmk/common/moneymission/moneymission_13.png);
    background-size: 4.2rem 7.8rem;
    background-position: center 0
}

.ico-mission-17 {
    width: 4.2rem;
    height: 4.2rem;
    background-image: url(/resource/img/mmk/common/moneymission/moneymission_3.png);
    background-size: 4.2rem 7.8rem;
    background-position: center 0
}

.ico-mission-18 {
    width: 4.2rem;
    height: 4.2rem;
    background-image: url(/resource/img/mmk/common/moneymission/moneymission_4.png);
    background-size: 4.2rem 7.8rem;
    background-position: center 0
}

.ico-mission-19 {
    width: 4.2rem;
    height: 4.2rem;
    background-image: url(/resource/img/mmk/common/moneymission/moneymission_15.png);
    background-size: 4.2rem 7.8rem;
    background-position: center 0
}

.ico-mission-20 {
    width: 4.2rem;
    height: 4.2rem;
    background-image: url(/resource/img/mmk/common/moneymission/moneymission_14.png);
    background-size: 4.2rem 7.8rem;
    background-position: center 0
}

.ico-mission-21 {
    width: 4.2rem;
    height: 4.2rem;
    background-image: url(/resource/img/mmk/common/moneymission/moneymission_16.png);
    background-size: 4.2rem 7.8rem;
    background-position: center 0
}

/*!
* component element
* icon
* CHPFMTASK-2030 대출
*/

.ico-naver-percent {
    width: 2.4rem;
    height: 2.4rem;
    background: url(/resource/img/mmk/common/ico_naver_percent.png) no-repeat;
    background-size: 100%
}

/*!
*  component element
*  icon
*  CHPFMTASK-2037
*/

.ico-circle-wrap.circle-bg-gray02 {
    width: 6.4rem;
    height: 6.4rem;
    background-color: var(--bg-qua);
    border: 0.5px solid var(--border-quin)
}

.ico-circle-wrap {
    border-radius: 50%
}

.ico-circle-wrap.circle-bg-gray03 {
    width: 4.4rem;
    height: 4.4rem;
    border: 0.05rem solid var(--color-pb5);
    background: var(--bg-ter)
}

.ico-utillity-bill {
    width: 6.4rem;
    height: 6.4rem;
    background-image: url("/resource/img/mmk/common/ico_utillity_bill.svg")
}

.ico-utillity-life {
    width: 6.4rem;
    height: 6.4rem;
    background-image: url("/resource/img/mmk/common/ico_utillity_life.svg")
}

.ico-utillity-search {
    width: 6.4rem;
    height: 6.4rem;
    background-image: url("/resource/img/mmk/common/ico_utillity_search.svg")
}

.ico-logo-hanhwa {
    width: 11.1rem;
    height: 3.2rem;
    background-image: url("/resource/img/mmk/common/ico_logo_hanhwa.svg")
}

.ico-btn-check {
    width: 1.6rem;
    height: 1.6rem;
    background-image: url("/resource/img/mmk/common/moneymission/call.png")
}

.ico-card-cert-01 {
    display: block;
    height: 19.2rem;
    margin-inline: -2rem;
    background-image: url("/resource/img/mmk/common/ico_card_cert_01.png")
}

.ico-card-cert-02 {
    display: block;
    height: 19.2rem;
    margin-inline: -2rem;
    background-image: url("/resource/img/mmk/common/ico_card_cert_02.png")
}

.ico-card-cert-03 {
    display: block;
    height: 19.2rem;
    margin-inline: -2rem;
    background-image: url("/resource/img/mmk/common/ico_card_cert_03.png")
}

.ico-card-cert-04 {
    display: block;
    height: 19.2rem;
    margin-inline: -2rem;
    background-image: url("/resource/img/mmk/common/ico_card_cert_04.png")
}

.ico-card-cert-05 {
    display: block;
    height: 12.8rem;
    margin-inline: -2rem;
    background-image: url("/resource/img/mmk/common/ico_card_cert_05.png")
}

.ico-logo-kbank-cert {
    width: 100%;
    height: 7.2rem;
    background: url("/resource/img/mmk/common/ico_logo_kbank_cert.png") center center/contain no-repeat
}

.interaction-fadein-ascent {
    -webkit-animation: interactionFade 0.6s 0.1s backwards var(--kds-easing-smooth), interactionAscent 0.6s 0.1s backwards var(--kds-easing-decelerate);
    animation: interactionFade 0.6s 0.1s backwards var(--kds-easing-smooth), interactionAscent 0.6s 0.1s backwards var(--kds-easing-decelerate);
    will-change: opacity, transform
}

@-webkit-keyframes interactionFade {
    0% {
        opacity: 0
    }
    100% {
        opacity: 1
    }
}

@keyframes interactionFade {
    0% {
        opacity: 0
    }
    100% {
        opacity: 1
    }
}

@-webkit-keyframes interactionAscent {
    0% {
        -webkit-transform: translateY(30%);
        transform: translateY(30%)
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

@keyframes interactionAscent {
    0% {
        -webkit-transform: translateY(30%);
        transform: translateY(30%)
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

.ico-loan-comparison-01 {
    width: 100%;
    height: 7.2rem;
    background-image: url("/resource/img/mmk/common/ico_loan_comparison_1.png")
}

.ico-loan-comparison-02 {
    width: 100%;
    height: 7.2rem;
    background-image: url("/resource/img/mmk/common/ico_loan_comparison_2.png")
}

.ico-account-other {
    width: 4.4rem;
    height: 4.4rem;
    background-image: url("/resource/img/mmk/common/ico_44_account_other.png")
}

.ico-kbank-logo {
    width: 13.7rem;
    height: 4rem;
    background-image: url("/resource/img/mmk/common/ico_kbank_logo.svg")
}

.ico-calendar-notice {
    width: 8rem;
    height: 8rem;
    background-image: url("/resource/img/mmk/common/auto_charge/ico_calendar_notice.png")
}

.ico-quick-reward-card {
    width: 2.4rem;
    height: 2.4rem;
    background-image: url("/resource/img/mmk/common/ico_quick_reward_card.png")
}

.ico-quick-card {
    width: 2.4rem;
    height: 2.4rem;
    background-image: url("/resource/img/mmk/common/ico_quick_card.png")
}

.ico-quick-bag-krw {
    width: 2.4rem;
    height: 2.4rem;
    background-image: url("/resource/img/mmk/common/ico_quick_bag_krw.png")
}

.ico-quick-bolt {
    width: 2.4rem;
    height: 2.4rem;
    background-image: url("/resource/img/mmk/common/ico_quick_bolt.png")
}

.ico-null-bag-krw-in {
    width: 2.8rem;
    height: 2.8rem;
    background-image: url("/resource/img/mmk/home/ceo/ico_null_bag_krw_in.svg")
}

.ico-null-card-in {
    width: 2.8rem;
    height: 2.8rem;
    background-image: url("/resource/img/mmk/home/ceo/ico_null_card_in.svg")
}

.ico-ai-bot {
    width: 3.6rem;
    height: 3.6rem;
    background-image: url("/resource/img/mmk/common/custom_policy/ico_ai_bot.png")
}

.ico-sleeping-loading {
    width: 12rem;
    height: 12rem;
    background-image: url("/resource/img/mmk/common/img_sleeping_money_loading.png")
}

.ico-sleeping-basic {
    width: 12rem;
    height: 12rem;
    background-image: url("/resource/img/mmk/common/img_kv_basic_sleeping_money_360x360.png")
}

.ico-sleeping-zzz {
    width: 20rem;
    height: 9.4rem;
    background-image: url("/resource/img/mmk/common/img_kv_Zzz_sleeping_money.png")
}

.ico-couponbook-in500 {
    width: 3.2rem;
    height: 4.2rem;
    background-image: url("/resource/img/mmk/common/ico_couponbook_in500.svg")
}

.ico-list-check {
    width: 1.8rem;
    height: 1.8rem;
    background-image: url("/resource/img/mmk/common/ico_list_check.png")
}

.ico-farm-savings-deposit {
    width: 2.4rem;
    height: 2.4rem;
    background-image: url("/resource/img/mmk/common/farm-savings/deposit_2d.png")
}

.ico-farm-savings-character {
    width: 2.4rem;
    height: 2.4rem;
    background-image: url("/resource/img/mmk/common/farm-savings/character_2d.png")
}

.ico-farm-savings-farm {
    width: 6.4rem;
    height: 6.4rem;
    background-image: url("/resource/img/mmk/common/farm-savings/farm_2d.png")
}

.ico-farm-savings-delivery-truck {
    width: 2rem;
    height: 2rem;
    background-image: url("/resource/img/mmk/common/farm-savings/delivery_truck_2d.png")
}

.ico-farm-savings-farm-3d {
    width: 10rem;
    height: 10rem;
    background-image: url("/resource/img/mmk/common/farm-savings/farm_3d.png")
}

.ico-farm-savings-farm-interest-3d {
    width: 10rem;
    height: 10rem;
    background-image: url("/resource/img/mmk/common/farm-savings/farm_interest_3d.png")
}

.ico-cash-reward {
    width: 2.2rem;
    height: 2.2rem;
    background-image: url(/resource/img/mmk/common/ico_cash_reward.svg)
}

.tag.mycredit-kcb,
.tag.mycredit-nice {
    background-color: var(--bg-base);
    border-radius: 99rem
}

.tag.mycredit-kcb .txt,
.tag.mycredit-nice .txt {
    font-size: 1.1rem;
    font-weight: 400;
    line-height: 1.4rem
}

.tag.mycredit-kcb {
    border: 1px solid var(--border-accent-sec)
}

.tag.mycredit-kcb .txt {
    color: var(--txt-accent-sec)
}

.tag.mycredit-nice {
    border: 1px solid var(--ico-pri-success)
}

.tag.mycredit-nice .txt {
    color: var(--txt-pri-success)
}

.ico-mycredit-weather {
    width: 100%;
    height: 20rem
}

.ico-mycredit-weather.step1 {
    background-image: url("/resource/img/mmk/common/mycredit/mycredit_weather_step1.png");
    background-size: 20rem;
    background-repeat: no-repeat;
    background-position: center
}

.ico-mycredit-weather.step2 {
    background-image: url("/resource/img/mmk/common/mycredit/mycredit_weather_step2.png");
    background-size: 20rem;
    background-repeat: no-repeat;
    background-position: center
}

.ico-mycredit-weather.step3 {
    background-image: url("/resource/img/mmk/common/mycredit/mycredit_weather_step3.png");
    background-size: 20rem;
    background-repeat: no-repeat;
    background-position: center
}

.ico-mycredit-weather.step4 {
    background-image: url("/resource/img/mmk/common/mycredit/mycredit_weather_step4.png");
    background-size: 20rem;
    background-repeat: no-repeat;
    background-position: center
}

.ico-mycredit-weather.step5 {
    background-image: url("/resource/img/mmk/common/mycredit/mycredit_weather_step5.png");
    background-size: 20rem;
    background-repeat: no-repeat;
    background-position: center
}

.ico-mycredit-weather-static {
    width: 4rem;
    height: 4rem
}

.ico-mycredit-weather-static.step1 {
    background-image: url("/resource/img/mmk/common/mycredit/mycredit_weather_ico_step1.png");
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: center
}

.ico-mycredit-weather-static.step2 {
    background-image: url("/resource/img/mmk/common/mycredit/mycredit_weather_ico_step2.png");
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: center
}

.ico-mycredit-weather-static.step3 {
    background-image: url("/resource/img/mmk/common/mycredit/mycredit_weather_ico_step3.png");
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: center
}

.ico-mycredit-weather-static.step4 {
    background-image: url("/resource/img/mmk/common/mycredit/mycredit_weather_ico_step4.png");
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: center
}

.ico-mycredit-weather-static.step5 {
    background-image: url("/resource/img/mmk/common/mycredit/mycredit_weather_ico_step5.png");
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: center
}

.tag.mycredit-weather-step1,
.tag.mycredit-weather-step2,
.tag.mycredit-weather-step3,
.tag.mycredit-weather-step4,
.tag.mycredit-weather-step5 {
    font-size: 1.1rem;
    font-weight: 700;
    line-height: 1.5rem;
    border-radius: .4rem;
    padding: .3rem .6rem;
    height: auto;
    margin-bottom: .4rem
}

.tag.mycredit-weather-step1 {
    color: var(--color-bu700);
    background-color: var(--color-bu50)
}

.tag.mycredit-weather-step2 {
    color: var(--color-gn700);
    background-color: var(--color-gn50)
}

.tag.mycredit-weather-step3 {
    color: var(--color-yl700);
    background-color: var(--color-yl50)
}

.tag.mycredit-weather-step4 {
    color: var(--color-og700);
    background-color: var(--color-og100)
}

.tag.mycredit-weather-step5 {
    color: var(--color-re700);
    background-color: var(--color-re50)
}

.ico-card-master {
    width: 2.4rem;
    height: 2.4rem;
    background-image: url("/resource/img/mmk/common/mycredit/ico_card_master.png")
}

.ico-mycredit-up {
    width: 2.4rem;
    height: 2.4rem;
    background-image: url("/resource/img/mmk/common/mycredit/ico_mycredit_up.png")
}

.ico-alarm-active {
    width: 9rem;
    height: 9rem;
    background-image: url("/resource/img/mmk/common/img_alarm_active.png")
}

.ico-ai {
    width: 1.4rem !important;
    height: 1.4rem !important;
    background-image: url("/resource/img/mmk/common/ico_ai.png")
}

.ico-rising {
    width: 2rem;
    height: 2rem;
    background-image: url("/resource/img/mmk/common/ico_rising.svg")
}

.ico-degradation {
    width: 2rem;
    height: 2rem;
    background-image: url("/resource/img/mmk/common/ico_degradation.svg")
}

.ico-ai.solid.gradient {
    width: 2rem !important;
    height: 2rem !important;
    background-image: url(/resource/img/mmk/common/ico_ai_gradient.svg)
}

.ico-safe-shield-sm {
    width: 1.8rem;
    height: 2rem;
    background-image: url(/resource/img/mmk/common/ico_safe_shield_sm.svg)
}

.tag.sec-loan {
    height: 2rem;
    padding: 0 0.8rem;
    background-color: var(--bg-sec);
    border-radius: 99.9rem
}

.tag.sec-loan .txt {
    color: var(--txt-ter)
}

.ico-more-arrow-right {
    width: 3.2rem;
    height: 3.2rem;
    background-image: url(/resource/img/mmk/common/ico_more_arrow_right.svg)
}

.ico-counsel {
    width: 3.2rem;
    height: 3.2rem;
    background-image: url(/resource/img/mmk/home/ceo/ico_counsel.svg)
}

.img-push-invest-01 {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    width: 37.5rem;
    height: 16rem;
    background-image: url(/resource/img/mmk/common/img_push_m_01.png);
    background-size: contain
}

.img-push-invest-02 {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    width: 37.5rem;
    height: 16rem;
    background-image: url(/resource/img/mmk/common/img_push_m_02.png);
    background-size: contain
}

.ico-government {
    width: 2.4rem;
    height: 2.4rem;
    background-image: url("/resource/img/mmk/svg_common/ico_government.svg")
}

.ico-ceo-bag-krw {
    width: 2.4rem;
    height: 2.4rem;
    background-image: url("/resource/img/mmk/common/ico_ceo_bag_krw.svg")
}

.ico-ceo-reward {
    width: 2.4rem;
    height: 2.4rem;
    background-image: url("/resource/img/mmk/common/ico_ceo_reward.svg")
}

.ico-support-fund {
    width: 2.8rem;
    height: 1.45rem;
    background-image: url("../../img/mmk/common/ico_support_fund_slogan.svg");
    background-size: contain
}

.tag.safe {
    background-color: var(--bg-pri-success)
}

.tag.safe .txt {
    color: var(--color-w100)
}

.tag.error {
    background-color: var(--bg-pri-error)
}

.tag.error .txt {
    color: var(--color-w100)
}

.ico-hand-prevention {
    width: 4.4rem;
    height: 4.4rem;
    background-image: url("/resource/img/mmk/common/ico_hand_prevention.png")
}

.ico-safe-labo-banner {
    width: 3.3rem;
    height: 3.9rem;
    background-image: url("/resource/img/mmk/common/ico_safe_labo_banner.png")
}

.ico-safe-labo-banner.small {
    width: 1.2rem;
    height: 1.4rem
}

.tag.state {
    height: 3rem;
    padding: 0 1rem;
    border-radius: 999rem
}

.tag.state .txt {
    font-size: 1.3rem;
    font-weight: 700;
    line-height: 1.4rem
}

.tag.state.up {
    background-color: var(--color-re50)
}

.tag.state.down {
    background-color: var(--bg-sec-solid)
}

.tag.state.up .txt {
    color: var(--txt-pri-error)
}

.tag.state.down .txt {
    color: var(--txt-pri-down)
}

.tag.bg-sec-error {
    background-color: var(--bg-sec-error)
}

.tag.bg-sec-error .txt {
    color: var(--txt-pri-up)
}

.tag.bg-sec-neutral {
    background-color: var(--bg-sec-neutral)
}

.tag.bg-sec-neutral .txt {
    color: var(--txt-pri-neutral)
}

.ico-solid-ai {
    width: 2rem;
    height: 2rem;
    background-image: url("../../img/mmk/common/ico_solid_ai.svg")
}

.ico-ars {
    width: 4.4rem;
    height: 4.4rem;
    background-image: url("../../img/mmk/common/ico_ars.png")
}

.ico-home-pin-off,
.ico-home-pin-on {
    width: 2.4rem;
    height: 2.4rem
}

.ico-home-pin-on {
    background-image: url("../../img/mmk/common/ico_home_pin_on.svg")
}

.ico-home-pin-off {
    background-image: url("../../img/mmk/common/ico_home_pin_off.svg")
}

.ico-haptic-pin {
    width: 1.4rem;
    height: 1.4rem;
    background-image: url("../../img/mmk/common/ico_haptic_pin.svg");
    background-size: cover
}

.ico-arrow-loading-mask {
    width: 1rem;
    height: 1.6rem;
    -webkit-mask-image: url("../../img/mmk/common/ico_arrow_loading.svg");
    mask-image: url("../../img/mmk/common/ico_arrow_loading.svg")
}

.logo-market-index {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 3.4rem;
    height: 3.4rem;
    overflow: hidden;
    border-radius: 50%
}

.logo-market-index:after {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    border-radius: 99rem;
    border: 1px solid rgba(0, 0, 0, 0.05);
    z-index: 3
}

.logo-market-index img {
    width: 100%
}

.logo-market-index.w80 {
    width: 8rem;
    height: 8rem
}

.logo-market-index .global-invest {
    width: 80%
}

.logo-market-index .noimg-invest {
    width: 100%
}

.logo-asset-management {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 8rem;
    height: 8rem;
    overflow: hidden;
    border-radius: 50%;
    font-style: normal
}

.logo-asset-management.logo-bershire {
    background-color: var(--color-in1100);
    color: var(--txt-pri-invert)
}

.logo-asset-management.logo-ark {
    background-color: var(--color-g200);
    color: var(--txt-pri)
}

.logo-asset-management.logo-vangard {
    background-color: var(--color-re900);
    color: var(--txt-pri-invert)
}

.logo-asset-management.logo-blackrock {
    background-color: var(--color-pb100);
    color: var(--txt-pri-invert)
}

.logo-asset-management.logo-state {
    background-color: var(--color-bu1100);
    color: var(--txt-pri-invert)
}

.logo-asset-management.logo-fidelity {
    background-color: var(--color-ce600);
    color: var(--txt-pri-invert)
}

.logo-asset-management.logo-fisher {
    background-color: var(--color-ce1000);
    color: var(--txt-pri-invert)
}

.logo-asset-management.logo-millennium {
    background-color: var(--color-bu800);
    color: var(--txt-pri-invert)
}

.logo-asset-management .txt-lv05 {
    margin-top: 2px
}

.logo-asset__modify_01 .logo-asset-management {
    padding: 1.7rem 0.7rem 1.9rem 0.9rem;
    color: var(--color-white-w100-op80)
}

.logo-asset__modify_01 .logo-asset-management .txt-lv05 {
    font-size: 4.8rem !important;
    line-height: 4.4rem;
    color: inherit
}

.logo-asset__modify_01 .logo-asset-management.logo-ark {
    background-color: var(--color-g300);
    color: var(--txt-sec)
}

.logo-asset__modify_01 .logo-asset-management.logo-vangard {
    padding: 1.7rem 0.8rem 1.9rem 0.8rem
}

.ico-friend-ant {
    background-image: url("../../img/mmk/common/weekly_invest/ico_friend_ant.svg")
}

.ico-friend-ant2 {
    background-image: url("../../img/mmk/common/weekly_invest/ico_friend_ant2.svg")
}

.ico-friend-item {
    background-image: url("../../img/mmk/common/weekly_invest/ico_friend_item.svg")
}

.ico-lotto-draw-disabled {
    background-image: url("../../img/mmk/common/weekly_invest/img_weekly_draw_item_disabled.svg")
}

.ico-extra-cash {
    background-image: url("../../img/mmk/common/weekly_invest/ico_extra_cash.svg")
}

.ico-inandout-blue-type2,
.ico-inandout-gold-type2 {
    width: 1.3rem;
    height: 1.7rem;
    margin-right: .6rem
}

.ico-inandout-blue-type2.default,
.ico-inandout-gold-type2.default {
    background-image: url("../../img/mmk/common/inandout/ico_blue_gold_default.png")
}

.ico-inandout-blue-type2.special {
    background-image: url("../../img/mmk/common/inandout/ico_blue_sp.png")
}

.ico-inandout-gold-type2.special {
    background-image: url("../../img/mmk/common/inandout/ico_gold_sp.png")
}

.ico-inandout-right-arrow {
    width: 1.6rem;
    height: 1.6rem;
    background-image: url("../../img/mmk/common/inandout/ico_inandout_arrow.png")
}

.ico-inandout-check {
    margin-right: .6rem;
    width: 1.3rem;
    height: 1.3rem;
    background-image: url("../../img/mmk/common/inandout/ico_inandout_check.png")
}

.ico-inandout-coin2 {
    width: 1.6rem;
    height: 1.6rem;
    background-image: url("../../img/mmk/common/inandout/ico_inandout_coin.png")
}

.ico-inandout-coupon2 {
    width: 1.6rem;
    height: 1.6rem;
    background-image: url("../../img/mmk/common/inandout/ico_inandout_coupon.png")
}

.ico-add.type02 {
    width: 2.4rem;
    height: 2.4rem;
    background-color: var(--bg-ter);
    margin-right: 1.2rem
}

.ico-add.type02:after {
    -webkit-filter: var(--filter-ico-ter);
    filter: var(--filter-ico-ter);
    width: 1.4rem;
    height: 1.4rem
}

/*!
* component element
* layout
* 초기화면/로그인 to-be ver. 2023-08-11 FETASK-1291
* 구버전 진입 사용자용 : .m_old
*/

.intro-login {
    padding: 0 !important;
    background: var(--color-w100, #fff) url("/resource/img/mmk/common/img_splash_appicon_navy.svg") no-repeat 50% 68px;
    background-size: 100px 100px
}

.container-component.intro-login-shield {
    height: 100%;
    padding-bottom: 0
}

.intro-login-shield>.shield {
    display: block;
    height: 100%
}

.login-message {
    margin-bottom: 3rem;
    text-align: center;
    color: var(--color-g700, #7d7d7d);
    font-size: 1.4rem;
    line-height: 2rem
}

.intro-login .component-btn.fixed-bottom {
    padding-bottom: 3.2rem
}

.intro-login .component-btn.fixed-bottom:before {
    content: none
}

.m_old .intro-login {
    background: #0f0060 url("/resource/img/mmk/common/img_splash_appicon_white.svg") no-repeat 50% 68px;
    background-size: 100px 100px
}

.m_old .component-header {
    background-color: #0f0060
}

.m_old .login-message {
    margin-bottom: 3rem;
    text-align: center;
    font-size: 1.4rem;
    line-height: 2rem;
    color: rgba(255, 255, 255, 0.7)
}

.m_old .component-btn.fixed-bottom {
    padding-bottom: 6rem
}

.m_old .btn-lv01.primary1 {
    padding: 0.8rem;
    height: initial;
    background: transparent
}

.m_old .btn-lv01.primary1 .txt {
    font-size: 1.6rem;
    font-weight: normal;
    border-bottom: 1px solid var(--color-w100, #fff)
}

html.ios.statusExpension .intro-login {
    background-position: 50% 112px
}

html.ios.statusExpension .m_old .component-btn.fixed-bottom {
    padding-bottom: 7.6rem
}

:root .component-icon.a11y {
    width: 150px;
    margin: 6.5rem auto 0;
    padding: 1.2rem
}

/*!
* component element
* header
* layout
*/

.component-header {
    position: relative;
    top: 0;
    top: constant(safe-area-inset-top);
    top: env(safe-area-inset-top);
    left: 0;
    width: 100%;
    z-index: 80;
    padding: 0;
    background-color: var(--color-w100, #fff)
}

.component-header.bg-gray {
    background-color: var(--color-g100)
}

.component-header.bg-primary1 {
    background-color: var(--color-pn, #17008c)
}

.component-header.bg-primary1>* {
    color: var(--color-w100, #fff)
}

.component-header.bg-primary2 {
    background-color: var(--color-pl, #b6f23d)
}

.component-header.bg-secondary2 {
    background-color: var(--color-sf200, #80d5d1)
}

.component-header.bg-coolgray2 {
    background-color: var(--color-cg500, #e6ebf5)
}

.component-header.bg-coolgray3 {
    background-color: #d7dfef
}

.component-header.bg-coolgray4 {
    background-color: var(--color-cg300, #f1f6fb)
}

.component-header.bg-insure {
    background-color: var(--color-cg500, #e6ebf5)
}

.component-header.bg-blue {
    background-color: var(--color-pn, #17008c)
}

.component-header.bg-blue>* {
    color: var(--color-w100, #fff)
}

.component-header.bg-blue .ico-back {
    -webkit-filter: var(--filter-w100);
    filter: var(--filter-w100)
}

.component-header.bg-blue2 {
    background-color: var(--color-bu50, #e0f2ff)
}

:root .component-header.bg-blue2 {
    background-color: #e0f2ff
}

.component-header.bg-trans {
    background-color: transparent
}

.component-header.bg-ter {
    background-color: var(--bg-ter)
}

.component-header.fixed-header,
.scrolling .component-header.fixed-header {
    position: fixed;
    left: 0;
    top: 0;
    padding-top: constant(safe-area-inset-top);
    padding-top: env(safe-area-inset-top);
    width: 100%
}

/*!
* component element
* header
* scroll 시 아이콘 color 변환
* FETASK-1905
*/

.component-header.header-offset {
    background-color: var(--color-w100, #fff)
}

.component-header.header-offset .header-content [class^="ico-"] {
    -webkit-filter: none;
    filter: none
}

.component-header[class*="bg-moneytalk-color"]>* {
    color: var(--color-w100, #fff)
}

.component-header[class*="bg-moneytalk-color"] .ico-back {
    -webkit-filter: var(--filter-w100);
    filter: var(--filter-w100)
}

.component-header.bg-moneytalk-color8>* {
    color: var(--txt-pri)
}

.component-header.bg-moneytalk-color8 .ico-back {
    -webkit-filter: var(--filter-g900);
    filter: var(--filter-g900)
}

.component-header.bg-moneytalk-color1 {
    background-color: var(--color-bu900, #003fc7)
}

.component-header.bg-moneytalk-color2 {
    background-color: var(--color-in800, #4946f7)
}

.component-header.bg-moneytalk-color3 {
    background-color: var(--color-pu800, #b346f7)
}

.component-header.bg-moneytalk-color4 {
    background-color: var(--color-fu800, #e742e4)
}

.component-header.bg-moneytalk-color5 {
    background-color: var(--color-bu500, #1c97ff)
}

.component-header.bg-moneytalk-color6 {
    background-color: var(--color-bu800, #0150ff)
}

.component-header.bg-moneytalk-color7 {
    background-color: #a451f7
}

.component-header.bg-moneytalk-color8 {
    background-color: var(--bg-sec)
}

.page-inner-scroll.scrolling .component-header[class*="bg-moneytalk-color"] {
    background-color: var(--color-w100, #fff) !important
}

.page-inner-scroll.scrolling .component-header[class*="bg-moneytalk-color"] .ico-back {
    -webkit-filter: var(--filter-g900) !important;
    filter: var(--filter-g900) !important
}

.page-inner-scroll.scrolling .component-header[class*="bg-moneytalk-color"] .header-content .tit-header span {
    color: var(--color-g900, #141414) !important
}

.component-header.bg-darkgray2 {
    background-color: var(--color-g700, #7d7d7d)
}

.component-header.bg-darkgray2>* {
    color: var(--color-w100, #fff)
}

.component-header.bg-blue .ico-back,
.component-header.bg-darkgray2 .ico-back,
.component-header.bg-primary1 .ico-back,
.component-header.bg-primary3 .ico-back {
    -webkit-filter: var(--filter-w100);
    filter: var(--filter-w100)
}

/*!
* component element
* header
* 기본
*/

.header-content {
    position: relative;
    height: 5rem
}

.header-content a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 5rem;
    height: 5rem;
    position: absolute;
    top: 0;
    z-index: 1
}

.header-content a.btn-back {
    left: 0
}

.header-content a.btn-home {
    right: 0
}

.header-content a.btn-home .ico-home {
    width: 2.4rem;
    height: 2.4rem
}

.header-content a.btn-control {
    right: 0;
    width: 6rem
}

.header-content a.btn-control.auto {
    width: auto;
    right: 2rem
}

.header-content a.btn-close {
    right: 0
}

.header-content a.btn-close .ico-line {
    width: 2rem;
    height: 2rem
}

.header-content a.btn-close .ico-line:after,
.header-content a.btn-close .ico-line:before {
    background-color: var(--color-g900, #141414)
}

.header-content a.btn-text {
    right: 1.8rem;
    width: auto
}

.header-content .btn-search {
    position: absolute;
    right: 5rem
}

.header-content .tit-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 5rem;
    padding: 0 5rem;
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: 400
}

.header-content .tit-header span {
    margin-top: 0.2rem;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap
}

.header-content.ui-animate .tit-header {
    opacity: 0;
    -webkit-transition: opacity .3s ease;
    -o-transition: opacity .3s ease;
    transition: opacity .3s ease
}

.header-content.ui-animate .tit-header.show {
    opacity: 1
}

.header-content.w85 {
    background-color: var(--color-w85, #fffFFFD8)
}

.header-content.w85.ui-animate .tit-header.show {
    -webkit-transition-delay: 0.4s;
    -o-transition-delay: 0.4s;
    transition-delay: 0.4s
}

.header-content .tit-header span.logo_moneytalk {
    margin-top: 0
}

.header-content .tit-header span.logo_moneytalk img {
    width: 9.6rem;
    vertical-align: middle
}

.logo-zeropay {
    display: inline-block;
    width: 13rem
}

.logo-zeropay img {
    width: 100%
}

.logo-kbankpay {
    display: inline-block;
    width: 10rem;
    height: 2.4rem
}

.logo-kbankpay img {
    width: 100%
}

.header-content .btn-set {
    position: absolute;
    right: 0
}

.header-content .btn-alarm {
    position: absolute;
    right: 5rem
}

.header-content .btn-alarm .new-alarm {
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -1.4rem 0 0 1rem;
    width: 0.5rem;
    height: 0.5rem;
    display: block;
    border-radius: 50%;
    background: var(--color-re700, #f02727)
}

.header-content .btn-clap {
    right: 5rem;
    width: 5rem;
    z-index: 2;
    cursor: default
}

.btn-clap .tooltip-focus-group .tooltip-area.align-right {
    right: 0
}

.btn-clap .tooltip-focus-group .tooltip-area.align-right:after {
    right: 4.3rem
}

.ico-clap.ui-lottie {
    width: 2.4rem;
    height: 2.4rem
}

.header-content a.btn-control.alarm .new-alarm {
    top: 1.1rem;
    right: 0.6rem;
    left: auto;
    width: 0.4rem;
    height: 0.4rem;
    margin: 0
}

/*!
* component element
* header
* util 영역
*/

.header-util {
    position: absolute;
    right: 0;
    top: 0;
    padding: 0 2rem 0 8rem;
    height: 5rem;
    padding-top: 1.3rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.header-util .tap-like {
    position: relative
}

.header-util .tap-like input {
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    opacity: 0
}

.header-util .tap-like input:disabled+.ico-benefit-heart {
    opacity: 0.5
}

.header-util .tipbox-area {
    position: absolute;
    top: 6rem;
    right: 2rem
}

.header-util .tipbox-area:before {
    content: "";
    position: absolute;
    right: 4rem;
    top: -1.6rem;
    width: 0;
    height: 0;
    border-bottom: 1.6rem solid var(--color-g300, #e0e0e0);
    border-left: 1.3rem solid transparent;
    border-right: 1.3rem solid transparent
}

.header-util .tipbox-area .tipbox-box {
    padding: 0.5rem 1rem;
    border-radius: 4rem;
    background-color: var(--color-g300, #e0e0e0);
    font-size: 1.2rem;
    line-height: 1.6rem;
    font-weight: 400;
    color: var(--color-g900, #141414);
    text-align: center
}

.header-util .tipbox-area .btn-tipbox-close {
    position: absolute;
    bottom: -2.6rem;
    right: 1rem;
    width: 2rem;
    height: 2rem;
    background-color: transparent;
    border-radius: 50%;
    background-image: var(--path-line-close);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center
}

.header-util .btn-share {
    position: relative;
    left: auto;
    margin-left: 1.2rem;
    width: 2.8rem;
    height: 2.5rem
}

.header-util .btn-quickMore {
    width: 4.8rem;
    height: 4.8rem
}

.header-util .input-checkbox.like.type2 {
    margin: -0.7rem -0.5rem 0 0
}

.header-util.type2 {
    padding: 0
}

.header-util.type2 a {
    position: relative
}

.header-util.alarm>a {
    z-index: 1
}

.header-util.alarm .alarm-cal-pop {
    position: absolute;
    width: 100%;
    height: 0;
    padding-top: 100%;
    overflow: hidden;
    display: block;
    border: 0;
    color: transparent;
    background: transparent;
    z-index: 2
}

.home-timeline-date {
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--txt-ter)
}

/*!
* component element
* layout
* 통합검색 PBKMAN0000003600S
*/

.component-header.search {
    padding: 1.2rem 1.2rem 0.8rem 2rem;
    height: 6.4rem
}

.component-header.search .header-content {
    height: 4.4rem
}

.component-header.search .header-content a {
    min-width: auto;
    padding: 0 0.8rem 0 0.8rem;
    color: var(--txt-quin)
}

.component-header.search+div>.component-list:first-child {
    margin-top: 2.4rem
}

.home-general-search {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%
}

.home-general-search .home-search-wrap {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.home-general-search .home-search-wrap .input-txt-group {
    height: 4.4rem;
    border: 0;
    background-color: var(--bg-qua);
    margin-right: 0.8rem
}

.home-general-search .home-search-wrap .input-txt-group>input {
    padding: 0 1.2rem 0 0;
    caret-color: var(--ico-cursor)
}

.home-general-search .home-search-wrap .input-txt-group>input::-webkit-input-placeholder,
.home-general-search .home-search-wrap .input-txt-group>input::-webkit-input-placeholder {
    color: var(--color-g600)
}

.home-general-search .home-search-wrap .input-txt-group>input:-ms-input-placeholder,
.home-general-search .home-search-wrap .input-txt-group>input::-moz-placeholder,
.home-general-search .home-search-wrap .input-txt-group>input::-ms-input-placeholder,
.home-general-search .home-search-wrap .input-txt-group>input::-webkit-input-placeholder,
.home-general-search .home-search-wrap .input-txt-group>input::placeholder,
.home-general-search .home-search-wrap .input-txt-group>input::placeholder {
    color: var(--color-g600)
}

.home-general-search .home-search-wrap .input-txt-group .btn-delete-txt .ico-delete-input {
    -webkit-filter: var(--filter-g500);
    filter: var(--filter-g500)
}

.home-general-search .home-search-wrap .input-txt-group .btn-delete-txt {
    padding: 0 1.2rem 0 0.8rem
}

.home-general-search .home-search-wrap .input-txt-group .btn-search-input.left {
    margin-left: 0;
    margin-right: 0;
    padding: 0 0.8rem 0 1.2rem
}

.home-general-search .home-search-wrap .input-txt-group .ico-search-input {
    -webkit-filter: var(--filter-color-grey-g600);
    filter: var(--filter-color-grey-g600)
}

.home-general-search .home-search-btn {
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.home-general-search .home-search-btn a {
    color: var(--txt-ter)
}

.component-header.search.search-result {
    height: 10.5rem;
    border-bottom: 0.1rem solid var(--border-qua)
}

.component-header.search-result+div {
    margin-top: 2.4rem
}

.home-general-filter .ui-dropdown .selectbox-arrow-group {
    margin-top: 1rem;
    padding-right: 2rem
}

.component-header.search .home-general-search .home-search-btn .btn-popup-close {
    width: 4.4rem
}

/*!
* component element
* layout
* 이체
*/

.section-flex-colume {
    height: calc(100vh - 5rem);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.section-flex-colume .flex-colume-top {
    -webkit-box-flex: 0;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto
}

.section-flex-colume .flex-colume-bottom {
    padding-top: 2rem;
    padding-bottom: 9rem
}

.section-flex-colume .flex-colume-bottom-inner {
    padding-bottom: 2.6rem
}

.section-flex-colume.type2 .flex-colume-bottom {
    padding-bottom: 13rem
}

.section-flex-colume.type3 {
    height: calc(100vh - 11rem)
}

.section-flex-colume.type3 .flex-colume-bottom-inner {
    padding-bottom: 4.8rem
}

.section-flex-colume.type3 .flex-colume-bottom-inner.pb124 {
    padding-bottom: 12.4rem
}

.section-flex-colume.type4 {
    height: calc(100vh - 19.4rem)
}

.section-flex-colume.type4 .flex-colume-bottom-inner {
    padding-bottom: 4.8rem
}

.component-text .text-icon-group+.component-form-msg {
    margin-top: 3.2rem;
    padding: 0 0 13rem
}

.fixed-msg-card {
    position: fixed;
    height: calc(100vh - 5rem);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.fixed-msg-card .text-icon-group {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto
}

.fixed-msg-card .component-form-msg {
    -webkit-box-flex: 0;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    overflow-y: scroll
}

/*!
* component element
* layout
* 이체 완료페이지
*/

.popup-dialog.ui-bottom [data-show-type="full"] {
    display: none
}

[data-ani-motion="down"] {
    opacity: 0;
    -webkit-transform: translateY(-7%);
    -ms-transform: translateY(-7%);
    transform: translateY(-7%)
}

.activeSlide [data-ani-motion="down"] {
    -webkit-animation: ani-down .3s linear forwards;
    animation: ani-down .3s linear forwards
}

@-webkit-keyframes ani-down {
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1
    }
    80% {
        opacity: .6
    }
    50% {
        -webkit-transform: translateY(-3%);
        transform: translateY(-3%);
        opacity: .4
    }
    0% {
        -webkit-transform: translateY(-7%);
        transform: translateY(-7%);
        opacity: 0
    }
}

@keyframes ani-down {
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1
    }
    80% {
        opacity: .6
    }
    50% {
        -webkit-transform: translateY(-3%);
        transform: translateY(-3%);
        opacity: .4
    }
    0% {
        -webkit-transform: translateY(-7%);
        transform: translateY(-7%);
        opacity: 0
    }
}

.header-util {
    padding: 0;
    right: 0.8rem;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.header-util .like-group {
    width: 4.8rem;
    height: 5rem
}

.header-util .like-group .tap-like {
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.header-content a,
.header-content a[class^="btn-"] {
    position: relative;
    width: auto;
    min-width: 4.8rem;
    margin-left: 0;
    font-size: 1.6rem;
    line-height: 2.1rem;
    padding: 0 1.2rem
}

.header-content a [class^="ico-"],
.header-content a[class^="btn-"] [class^="ico-"] {
    width: 2.4rem;
    height: 2.4rem
}

.header-content a .new-alarm,
.header-content a[class^="btn-"] .new-alarm {
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -1.4rem 0 0 1rem;
    width: 0.5rem;
    height: 0.5rem;
    display: block;
    border-radius: 50%;
    background: var(--color-re700, #f02727)
}

.header-content a.btn-back,
.header-content a[class^="btn-"].btn-back {
    position: absolute
}

.header-content a.btn-back+.btn-alarm,
.header-content a[class^="btn-"].btn-back+.btn-alarm {
    position: absolute;
    right: 5.6rem
}

.header-content a.btn-alarm,
.header-content a[class^="btn-"].btn-alarm {
    right: 0
}

.header-content a.btn-control:only-child,
.header-content a.btn-set,
.header-content a[class^="btn-"].btn-control:only-child,
.header-content a[class^="btn-"].btn-set {
    position: absolute;
    right: 0.8rem
}

.header-content a.btn-back+.btn-control,
.header-content a[class^="btn-"].btn-back+.btn-control {
    position: absolute;
    right: 0.8rem
}

.header-content .tit-header span {
    margin-top: 0
}

.header-content .tit-header+a {
    position: absolute;
    right: 0
}

.header-content .tit-header+a.btn-alarm {
    right: 5rem
}

.header-content .tit-header+a.auto,
.header-content .tit-header+a.btn-control,
.header-content .tit-header+a.btn-home {
    right: 0.8rem;
    width: auto
}

.header-content .tit-header+.btn-search {
    position: absolute;
    right: 5.6rem
}

.header-content .tit-header+.input-checkbox.like {
    position: absolute;
    right: 0.8rem;
    top: 0
}

.header-content .tit-header+.input-checkbox.like input:not(:checked)+.checkbox-shape-like.type2 {
    -webkit-filter: var(--filter-g1000);
    filter: var(--filter-g1000)
}

.header-content .tit-header.tit-market-index span {
    max-width: 12em
}

/*! component element section-component : component용 wrapper 공통스타일 */

.section-component.bg-white {
    background-color: var(--color-w100, #fff)
}

.section-component.bg-gray {
    background-color: var(--color-grey-g100)
}

.section-component.over-x-h {
    overflow-x: hidden
}

.section-component.bg-qua {
    background-color: var(--bg-qua)
}

/*! component element tab 공통스타일 */

.tab-group+.form-group {
    margin-top: 2.4rem;
    padding: 0 2.0rem 3.2rem
}

.tab-list-col {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.tab-item {
    height: 4.4rem;
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 700;
    color: var(--color-g600, #9b9b9b);
    text-align: center
}

:root .tab-item {
    color: var(--txt-quin)
}

.tab-link {
    display: block;
    height: 100%;
    padding: 1rem
}

.tab-link:first-of-type {
    padding-left: 0
}

.tab-content .tab-item {
    font-size: 1.4rem
}

.tab-content {
    display: none
}

.tab-content.active {
    display: block
}

.tab-content.space {
    padding: 2.4rem 2.0rem
}

.tab-content.bg-gray {
    background-color: var(--color-g100, #f8f8f8)
}

.tab-content.bg-white {
    background-color: var(--color-w100, #fff)
}

.tab-list-col.flex-break {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-left: -1.6rem
}

.component-img-card .tab-list-type04 .flex-break .tab-item {
    margin-left: 1.6rem
}

.tab-content .tab-item.type01 {
    font-weight: 500
}

.tab-content .tab-item.type01.active {
    font-weight: 700
}

.tab-content-block {
    display: block
}

/*! component element tab 공통스타일 - active */

.tab-item.active {
    color: var(--color-g900, #141414)
}

:root .tab-item.active {
    color: var(--txt-sec-active)
}

/*! component element tab 공통스타일 - sticky component_tab.html > chip타입(btn-open type2)에서 확인 가능 */

.sticky-tab {
    position: -webkit-sticky;
    position: sticky;
    top: 5.6rem
}

.sticky-tab.move-up {
    top: 4.3rem;
    background-color: var(--bg-base) !important;
    z-index: 100
}

/*! component element tab 기본타입 */

.tab-list:not(.tab-content.tab-list) {
    position: relative
}

.tab-list .tab-list-col {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.tab-list .tab-item {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1 1 7.2rem;
    border-bottom: 1px solid var(--color-g600, #9b9b9b)
}

:root .tab-list .tab-item {
    border-bottom: 1px solid var(--border-qua)
}

.tab-list .tab-link {
    padding: 1.3rem 0 1.2rem
}

.tab-list .tab-link.is-ellipsis .txt {
    display: inline-block;
    width: 100%;
    max-width: 17rem;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap
}

.tab-list.sticky {
    position: -webkit-sticky;
    position: sticky;
    top: 5rem;
    left: 0;
    z-index: 70;
    background: var(--color-w100, #fff)
}

.tab-list.sticky:before {
    content: "";
    display: block;
    position: absolute;
    bottom: 100%;
    height: 10px;
    width: 100%;
    background: var(--color-w100, #fff)
}

.component-tab.sticky {
    position: -webkit-sticky;
    position: sticky;
    top: 5rem;
    left: 0;
    z-index: 70;
    width: 100%;
    margin-top: 0;
    padding-top: 1.6rem;
    background-color: var(--color-w100, #fff)
}

.component-tab.sticky.my-act-tab {
    padding-top: 0
}

.tab-list .tab-link .num {
    font-weight: bold
}

.tab-list .tab-item.active .tab-link .num {
    color: var(--txt-accent-sec)
}

.component-tab.sticky-logotab {
    position: -webkit-sticky;
    position: sticky;
    top: 5rem;
    right: 0;
    left: 0;
    margin-top: 0 !important;
    padding-top: 2.4rem;
    padding-bottom: 2.4rem;
    background-color: var(--color-w100);
    z-index: 100
}

/*! component element tab 기본타입 - active */

.tab-list .tab-item.active {
    border-bottom: 0.2rem solid var(--color-g900, #141414)
}

:root .tab-list .tab-item.active {
    border-bottom: 0.2rem solid var(--border-sec-active)
}

.tab-list .tab-item.active .tab-link {
    padding-bottom: 1.2rem
}

/*! component element tab 토글타입 */

.tab-list-type01 .toggle-list-col {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    background-color: var(--color-g200, #eee);
    border-radius: 1.2rem;
    height: 4.8rem
}

.tab-list-type01 .toggle-list-col .toggle-item .toggle-link {
    border: 0.4rem solid var(--color-g200, #eee);
    border-radius: 1.2rem;
    font-size: 1.5rem;
    font-weight: 400;
    color: var(--color-g800, #414141);
    text-align: center;
    word-break: keep-all
}

.tab-list-type01 .toggle-list-col .toggle-item.active .toggle-link {
    background-color: var(--color-w100, #fff);
    font-weight: 700;
    color: var(--color-g900, #141414)
}

.tab-list-type01 .toggle-link .new-info::before {
    position: absolute;
    display: block;
    content: '';
    top: 1.4rem;
    left: 50%;
    -webkit-transform: translateX(1.3rem);
    -ms-transform: translateX(1.3rem);
    transform: translateX(1.3rem);
    width: 0.4rem;
    height: 0.4rem;
    border-radius: 50%;
    background: var(--color-re700) no-repeat center
}

.tab-list-type01.type01 .toggle-list-col {
    height: 3.2rem
}

.tab-list-type01.type01 .toggle-list-col .toggle-item .toggle-link {
    font-size: 1.2rem;
    border-radius: .8rem;
    border-width: .2rem
}

.tab-list-type01.type01 .toggle-list-col .toggle-item .toggle-link .txt {
    padding: 0 1.2rem;
    line-height: 1.6rem;
    color: var(--txt-sec)
}

.tab-list-type01.type01 .toggle-item.active .toggle-link .txt {
    color: var(--txt-pri)
}

.tab-list-type01.main-invest-tab-list {
    margin: 0 8rem
}

/*! component element tab 라인타입 */

.tab-list-type02 {
    overflow: hidden
}

.tab-list-type02 .tab-list-col {
    overflow-x: auto
}

.tab-list-type02 .tab-item+.tab-item {
    margin-left: 1.2rem
}

.tab-list-type02 .tab-link {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    padding: 0 0 0.3rem 0;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end
}

/*! component element tab 라인타입 - active */

.tab-list-type02 .tab-item.active {
    border-bottom: 0.2rem solid var(--color-g900, #141414)
}

.tab-list-type02 .tab-item.active .tab-link {
    padding-bottom: 0.1rem
}

/*! component element tab 텍스트타입 */

.tab-list-type03 {
    overflow: hidden
}

.tab-list-type03 .tab-list-col {
    overflow-x: auto
}

.tab-list-type03 .tab-item+.tab-item {
    margin-left: 1rem
}

.tab-list-type03 .tab-link {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    padding: 0;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    font-size: 2.1rem;
    line-height: 2.7rem;
    font-weight: bold
}

/*! component element tab 아이콘타입 */

.tab-list-type05 .tab-link {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 0
}

.tab-list-type05 .tab-item {
    font-size: 1.6rem;
    color: var(--color-g700, #7d7d7d);
    font-weight: normal;
    height: auto
}

.tab-list-type05 .tab-item.active {
    color: var(--color-bu800, #0150ff)
}

:root .tab-list-type05 .tab-item.active {
    color: var(--txt-sec-active)
}

.tab-list-type05 .tab-item+.tab-item {
    margin-left: 1.6rem
}

.tab-list-type05 .tab-item .txt:before {
    content: '';
    display: inline-block;
    vertical-align: middle;
    margin: -0.2rem 0.8rem 0 0;
    width: 1.6rem;
    height: 1.6rem;
    background-position: center center;
    background-repeat: no-repeat;
    background-image: var(--path-solid-colored-check-ico-ter-active);
    background-size: contain
}

:root .tab-list-type05 .tab-item .txt {
    color: var(--txt-sec)
}

:root .tab-list-type05 .tab-item.active .txt {
    color: var(--txt-sec-active)
}

:root .tab-list-type05 .tab-item .txt:before {
    background-image: var(--path-checkbox-line-2depth)
}

.tab-list-type05 .tab-item.active .txt:before {
    background-image: url("../../img/mmk/kds3/ico/solid/check_bu800.svg")
}

:root .tab-list-type05 .tab-item.active .txt:before {
    background-image: var(--path-checkbox-line-2depth-active)
}

/*! component element tab chip타입 */

.tab-list-type06 .tab-link {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    min-width: 5rem;
    height: 3.4rem;
    border-radius: 99rem;
    padding: 0 1.4rem;
    margin: 0 0.8rem 0.8rem 0;
    background-color: var(--color-g200, #eee)
}

.tab-list-type06 .tab-link .txt {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g800, #414141)
}

.tab-list-type06.color1 .tab-link {
    background-color: var(--color-w100, #fff);
    border: 1px solid var(--color-g200, #eee)
}

.tab-list-type06 .tab-item.active .tab-link {
    background-color: var(--color-g900, #141414);
    border: 1px solid var(--color-g900, #141414)
}

.tab-list-type06 .tab-item.active .tab-link .txt {
    color: var(--color-w100, #fff);
    font-weight: 700
}

:root .tab-list-type06 .tab-link .txt {
    color: var(--txt-pri, #020616)
}

:root .tab-list-type06.color1 .tab-link {
    background-color: var(--bg-ter, #edf1f7);
    border: 1px solid var(--bg-ter, #edf1f7)
}

:root .tab-list-type06 .tab-item.active .tab-link {
    background-color: var(--bg-sec-active, #020616);
    border: 1px solid var(--bg-sec-active, #020616)
}

:root .tab-list-type06 .tab-item.active .tab-link .txt {
    color: var(--txt-pri-invert, #fff)
}

/*! component element tab chip타입 */

.tab-list-type07 {
    padding: 2.4rem 2rem 0
}

.tab-list-type07 .tab-link {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    min-width: 5rem;
    height: 4.8rem;
    border-radius: 1.2rem;
    background: var(--color-w100, #fff);
    border: 1px solid var(--color-pb10, #00000019);
    width: 100%;
    padding: 0
}

.tab-list-type07 .tab-link .txt {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 500;
    color: var(--color-g900)
}

.tab-list-type07 .tab-item {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.tab-list-type07 .tab-item+.tab-item {
    margin-left: 1rem
}

.tab-list-type07 .tab-item.active .tab-link {
    background: var(--bg-qua-active);
    border: 1px solid var(--border-pri-active)
}

.tab-list-type07 .tab-item.active .tab-link .txt {
    color: var(--txt-pri-active);
    font-weight: 700
}

/*! component element tab 순서변경 버튼 타입 */

.tab-list-type08 {
    padding: 3.6rem 2rem 3rem
}

.tab-list-type08 .tab-list-col {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.tab-list-type08 .tab-link {
    padding: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.tab-list-type08 .tab-item {
    height: 3.6rem
}

.tab-list-type08 .tab-item+.tab-item {
    margin-left: 0.4rem
}

.tab-list-type08 .tab-item.active .btn-shift,
.tab-list-type08 .tab-item.active .btn-shift:focus {
    border-color: var(--ico-pri-active);
    background-color: var(--bg-qua-active)
}

.tab-list-type08 .tab-item.active .btn-shift.active [class^="ico"],
.tab-list-type08 .tab-item.active .btn-shift:focus [class^="ico"] {
    -webkit-filter: var(--filter-pn);
    filter: var(--filter-pn)
}

/*! component element tab 전세안심 CHPFMTASK-1370  PBKINQ0313000100S.html?page=3 */

.tab-list-type09 .tab-item {
    padding-left: 1rem;
    font-weight: 400
}

.tab-list-type09 .tab-item.active {
    font-weight: 700
}

.tab-list-type09 .tab-item:first-child {
    padding-left: 0
}

/*! component element tab 라운드 타입 - 보험 홈 */

.tab-round-group {
    height: 3.4rem;
    overflow: hidden
}

.tab-round-group .tab-list-type {
    padding-left: 2rem;
    height: 4.2rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.tab-round-group .tab-list-col {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.tab-round-group .tab-list-col .tab-item {
    padding-right: 0.8rem;
    text-align: center;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.tab-round-group .tab-list-col .tab-item:last-child {
    padding-right: 2rem
}

.tab-round-group .tab-list-col .tab-link {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -ms-flex: auto;
    flex: auto;
    width: 100%;
    height: 100%;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 0 1.4rem;
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g900, #141414);
    background-color: var(--color-g200, #eee);
    border-radius: 3.4rem;
    height: 3.4rem
}

.tab-round-group .tab-list-col .tab-item.active .tab-link {
    background-color: var(--color-pb100, #000);
    color: var(--color-w100, #fff);
    font-weight: 700
}

.tab-round-group+.tab-content-group {
    padding: 1.6rem 0
}

.type-line .tab-list-col .tab-item .tab-link {
    background-color: var(--bg-base);
    color: var(--txt-pri);
    border: 1px solid var(--border-qua)
}

.type-line .tab-list-col .tab-item.active .tab-link {
    background-color: var(--bg-pri, #0114a7);
    color: var(--color-w100);
    border: none
}

.type-line .tab-list-col .tab-item .tab-link.disabled {
    pointer-events: none;
    color: var(--txt-disabled, #c8d2e4);
    border-color: var(--border-qua);
    font-weight: 400
}

.type-line.border-sec .tab-list-col .tab-item.active .tab-link {
    background-color: var(--color-w100);
    color: var(--txt-sec);
    border: 1px solid var(--border-sec-active)
}

.type-line.border-sec .tab-list-col .tab-item.active .tab-link .txt {
    color: var(--txt-sec-active)
}

.tab-group.ty01 .relative {
    min-height: 5.6rem
}

.tab-group.ty01 .tab-round-group {
    height: auto
}

.tab-group.ty01 .tab-list-type {
    position: relative;
    overflow: hidden;
    height: auto;
    padding-left: 0
}

.tab-group.ty01 .tab-list-type .tab-list-col {
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    overflow-x: auto;
    padding: 1.1rem .1rem 0 2rem
}

.tab-group.ty01 .tab-list-type .tab-list-col::-webkit-scrollbar {
    display: none
}

.tab-group.ty01 .tab-list-type .tab-list-type06 {
    width: 100vw
}

.tab-group.ty01 .tab-list-type.color1 .tab-link {
    background-color: var(--color-w100, #fff);
    border: 1px solid var(--color-g200, #eee)
}

.tab-group.ty01 .tab-list-col .tab-item {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex
}

.tab-group.ty01 .tab-list-col .tab-item:last-child {
    padding-right: 4.4rem
}

.tab-group.ty01 .tab-list-col .tab-item.active .tab-link {
    background-color: var(--color-g900, #141414);
    border: 1px solid var(--color-g900, #141414);
    color: var(--color-w100, #fff);
    font-weight: 700
}

.tab-group.ty01 .open .tab-round-group .tab-list-type .tab-list-col {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding-right: 4.4rem;
    overflow-x: unset
}

.tab-group.ty01 .btn-open {
    position: absolute;
    top: 1.1rem;
    right: 0;
    z-index: 2
}

.tab-group.ty01 .btn-open:before {
    content: "";
    position: absolute;
    right: -2rem;
    top: -5px;
    display: block;
    height: 5rem;
    width: 8.6rem;
    background: -webkit-gradient(linear, right top, left top, color-stop(70%, var(--color-w100, #fff)), to(rgba(255, 255, 255, 0)));
    background: -o-linear-gradient(right, var(--color-w100, #fff) 70%, rgba(255, 255, 255, 0) 100%);
    background: linear-gradient(270deg, var(--color-w100, #fff) 70%, rgba(255, 255, 255, 0) 100%);
    z-index: 1
}

.tab-group.ty01 .btn-open .ico-arrow-open {
    width: 3.4rem;
    height: 3.4rem;
    position: relative;
    border: 1px solid var(--color-g300, #e0e0e0);
    border-radius: 99rem;
    background-image: var(--path-line-chevron-down);
    background-size: 1.6rem 1.6rem;
    background-color: var(--color-g200, #eee);
    z-index: 2
}

.tab-group.ty01 .btn-open.type2 .ico-arrow-open {
    background-color: var(--color-g100, #f8f8f8)
}

.tab-group.ty01 .btn-open.type2:before {
    background: -webkit-gradient(linear, right top, left top, color-stop(70%, var(--color-g100, #f8f8f8)), to(rgba(255, 255, 255, 0)));
    background: -o-linear-gradient(right, var(--color-g100, #f8f8f8) 70%, rgba(255, 255, 255, 0) 100%);
    background: linear-gradient(270deg, var(--color-g100, #f8f8f8) 70%, rgba(255, 255, 255, 0) 100%)
}

.tab-group.ty01.pr-20 .tab-list-col .tab-item:last-child {
    padding-right: 2rem
}

.tab-list-group .tab-round-group .tab-list-type .tab-list-type06 .tab-list-col .tab-item {
    padding-right: 0
}

.tab-group.ty01 .btn-open.white .ico-arrow-open {
    background-color: var(--color-w100, #fff)
}

.tab-group.ty01.main-invest-tab {
    background-color: var(--bg-base)
}

.tab-group.ty01.main-invest-tab .relative {
    min-height: unset
}

.tab-group.ty01.main-invest-tab .tab-item {
    height: 4.2rem
}

.tab-group.ty01.main-invest-tab .tab-list-type .tab-list-col {
    padding: 1.1rem 0 0 2rem
}

.tab-group.ty01.main-invest-tab .btn-open::before {
    height: 4.2rem;
    right: -1.8rem
}

.tab-group.ty01.main-invest-tab .open .tab-list-col .tab-item:last-child {
    padding-right: 0
}

.tab-group.ty01.insight .tab-list-group {
    margin: 0 -2rem 0 -2rem
}

.tab-group.ty01.insight .tab-list-type .tab-list-col {
    padding-top: 0
}

.tab-group.type2 .tab-round-group .tab-list-col .tab-link {
    background-color: var(--color-w100);
    border: 1px solid var(--border-qua)
}

.tab-group.type2 .tab-round-group .tab-list-col .tab-item.active .tab-link {
    color: var(--txt-accent-sec);
    border: 1px solid var(--txt-accent-sec)
}

/*! component element tab 로고 타입 - 슈퍼쇼핑 (CHPFMTASK-806) */

.tab-logo-type .tab-link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding: 0;
    width: 7.6rem;
    height: 10.3rem
}

.tab-logo-type .tab-item+.tab-item {
    margin-left: 1rem
}

.tab-logo-type .tab-link .logo-area {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 0.2rem;
    position: relative
}

.tab-logo-type .tab-link .txt {
    margin-top: 0.8rem;
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 2rem;
    white-space: nowrap;
    color: var(--color-g900, #141414);
    max-width: 100%;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis
}

.tab-logo-type .tab-item {
    height: auto;
    color: var(--color-g900, #141414)
}

.tab-logo-type .tab-item.active .logo-area {
    padding: 0.2rem
}

.tab-logo-type .tab-item.active .logo-area::after {
    width: 7.6rem;
    height: 7.6rem;
    position: absolute;
    content: '';
    border: solid 2px var(--border-pri-active);
    border-radius: 99rem
}

.tab-logo-type .tab-item.active .txt {
    color: var(--txt-pri-active);
    font-weight: 700
}

.tab-logo-type .tab-list-col {
    overflow-x: auto;
    padding-top: 0.2rem
}

/*! component element tab 로고 타입 - 오늘의 쿠폰 (CHPFMTASK-1883) */

.tab-group .tab-round-group.logo-type {
    height: auto
}

.tab-group .tab-round-group.logo-type .tab-list-col .tab-item .tab-link .ico-logo-badge {
    position: absolute;
    top: 0;
    left: 0.8rem;
    z-index: 4
}

.tab-group .tab-round-group.logo-type .tab-round-group {
    height: auto
}

.tab-group .tab-round-group.logo-type .tab-list-type {
    position: relative;
    overflow: hidden;
    height: auto;
    padding-left: 0
}

.tab-group .tab-round-group.logo-type .tab-list-type .tab-list-col {
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    overflow-x: auto;
    padding: 0 1.2rem
}

.tab-group .tab-round-group.logo-type .tab-list-type .tab-list-col::-webkit-scrollbar {
    display: none
}

.tab-group .tab-round-group.logo-type .tab-link .img {
    overflow: hidden;
    width: 6.4rem;
    border-radius: 2.4rem
}

.tab-group .tab-round-group.logo-type .tab-list-col .tab-item {
    height: auto;
    margin-right: 0.8rem;
    padding-right: 0
}

.tab-group .tab-round-group.logo-type .tab-list-col .tab-item:last-child {
    margin-right: 0
}

.tab-group .tab-round-group.logo-type .tab-list-col .tab-item .tab-link {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    position: relative;
    height: auto;
    padding: 0 0.8rem;
    border: 0;
    border-radius: 0;
    background-color: var(--color-w100)
}

.tab-group .tab-round-group.logo-type .tab-list-col .tab-item .tab-link>.txt {
    display: block;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 6.4rem;
    margin-top: 0.8rem;
    font-weight: 400;
    color: var(--txt-ter)
}

.tab-group .tab-round-group.logo-type .tab-list-col .tab-item.active .img {
    position: relative
}

.tab-group .tab-round-group.logo-type .tab-list-col .tab-item.active .tab-link {
    background-color: var(--color-w100);
    border: 0
}

.tab-group .tab-round-group.logo-type .tab-list-col .tab-item.active .tab-link>.txt {
    font-weight: 700;
    color: var(--txt-accent-sec)
}

.tab-group .tab-round-group.logo-type .tab-list-col .tab-item.active .logo-wrap::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 2.4rem;
    border: 2px solid var(--border-accent-sec);
    z-index: 2
}

.tab-group .tab-round-group.logo-type .logo-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: relative;
    width: 6.4rem;
    height: 6.4rem;
    border-radius: 2.4rem;
    background-color: var(--color-g100)
}

/*! component element tab 가로 스크롤되는 타입 CHPFMTASK-2345 주식 둘러보기 */

.tab-list.type-scroll-x {
    padding-left: 2rem
}

.tab-list.type-scroll-x .tab-link {
    padding: 1.3rem 1.2rem 1.2rem;
    white-space: nowrap
}

.tab-list.type-scroll-x::before {
    content: '';
    position: absolute;
    width: 100%;
    height: 1px;
    left: 0;
    bottom: 0;
    background-color: var(--border-qua);
    z-index: -1
}

/*! component element tab hug 유형 생성 CHPFMTASK-2629: [KDS] 3.612 신규 */

.tab-list.tab-list__type-hug .tab-list-col {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    padding-right: 2rem;
    padding-left: 2rem;
    border-bottom: 1px solid var(--border-qua)
}

.tab-list.tab-list__type-hug .tab-list-col .tab-item {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    padding-left: 0.8rem;
    border-bottom: 0
}

.tab-list.tab-list__type-hug .tab-list-col .tab-item.active {
    border-bottom: 0.2rem solid var(--border-sec-active)
}

.tab-list.tab-list__type-hug .tab-list-col .tab-item:first-child {
    padding-left: 0
}

.tab-list.tab-list__type-hug .tab-list-col .tab-item .tab-link {
    padding-right: 4px;
    padding-left: 4px
}

/*! component element tab 가로 스크롤되는 라인 타입 CHPFMTASK-2692 제휴카드 FPMCRD0400000000S */

.tab-round-group.line-type {
    height: 4.4rem
}

.tab-round-group.line-type .tab-list-type {
    position: relative;
    height: 4.4rem;
    background: -o-linear-gradient(top, transparent calc(100% - 1px), var(--bg-qua) calc(100% - 1px));
    background: linear-gradient(to bottom, transparent calc(100% - 1px), var(--bg-qua) calc(100% - 1px))
}

.tab-round-group.line-type .tab-list-type::-webkit-scrollbar {
    display: none
}

.tab-round-group.line-type .tab-list-col .tab-item {
    padding-right: 1.6rem
}

.tab-round-group.line-type .tab-list-col .tab-item:last-child {
    padding-right: 2rem
}

.tab-round-group.line-type .tab-list-col .tab-link {
    height: 100% !important;
    padding: 0 0.4rem;
    background-color: transparent;
    border-radius: 0;
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 2rem;
    color: var(--txt-quin)
}

.tab-round-group.line-type .tab-list-col .tab-item.active .tab-link {
    background-color: transparent;
    color: var(--txt-sec-active)
}

.tab-round-group.line-type .tab-list-col .tab-item.active .tab-link::after {
    content: "";
    display: block;
    position: absolute;
    bottom: 0;
    right: 0;
    left: 0;
    height: 0.2rem;
    background-color: var(--border-sec-active)
}

.tab-round-group.line-type .tab-link .ico-loan-ai {
    width: 2rem;
    height: 2rem;
    margin-left: 0.2rem;
    -webkit-filter: var(--filter-ico-qua);
    filter: var(--filter-ico-qua)
}

.tab-round-group.line-type .tab-item.active .ico-loan-ai {
    background-image: url(/resource/img/mmk/common/ico_ai_gradient.svg);
    -webkit-filter: none;
    filter: none
}

/*! component element tab 가로 스크롤되는 카드 로고 타입 CHPFMTASK-2692 제휴카드 FPMCRD0400000000S */

.tab-group .tab-round-group.logo-type.type1 {
    margin-top: -0.3rem
}

.tab-group .tab-round-group.logo-type.type1 .tab-list-type .tab-list-col {
    padding: 0 2rem
}

.tab-group .tab-round-group.logo-type.type1 .tab-list-col .tab-item {
    margin-right: 2.4rem;
    padding-top: 0.3rem
}

.tab-group .tab-round-group.logo-type.type1 .tab-list-col .tab-item:last-child {
    margin-right: 0;
    padding-top: 0.3rem
}

.tab-group .tab-round-group.logo-type.type1 .tab-list-col .tab-item .tab-link {
    display: block;
    padding: 0
}

.tab-group .tab-round-group.logo-type.type1 .logo-wrap {
    width: 4.4rem;
    height: 4.4rem;
    margin: 0 auto;
    border-radius: 99rem
}

.tab-group .tab-round-group.logo-type.type1 .logo-wrap img {
    width: 100%;
    border-radius: 999rem
}

.tab-group .tab-round-group.logo-type.type1 .tab-list-col .tab-item .tab-link>.txt {
    width: 4.8rem;
    margin-top: 0.6rem;
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 2rem;
    color: var(--txt-quin);
    -o-text-overflow: unset;
    text-overflow: unset;
    overflow: visible
}

.tab-group .tab-round-group.logo-type.type1 .tab-list-col .tab-item.active .tab-link>.txt {
    font-weight: 700;
    color: var(--txt-sec-active)
}

.tab-group .tab-round-group.logo-type.type1 .tab-list-col .tab-item.active .logo-wrap::before {
    top: -0.3rem;
    right: -0.3rem;
    bottom: -0.3rem;
    left: -0.3rem;
    width: auto;
    height: auto;
    border: 3px solid var(--border-sec-active);
    border-radius: 99rem
}

.tab-group .tab-round-group.logo-type.type1 .tab-list-col .tab-item.active .logo-wrap::after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 999rem;
    border: 2px solid var(--color-w100)
}

/*! component element no data basic type 계좌없음 */

.nodata-account-group {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center;
    height: 30rem
}

.nodata-account-group.h150 {
    height: 15rem
}

.nodata-account-group.h106 {
    height: 10.6rem
}

.nodata-account-group.h264 {
    height: 26.4rem
}

.nodata-account-group.h268 {
    height: 26.8rem
}

.nodata-account-group.h286 {
    height: 28.6rem
}

.nodata-account-group.h492 {
    height: 49.2rem
}

.nodata-account-group.h-auto {
    height: auto
}

.nodata-account-group.h-flexible {
    height: calc(100vh - 20.4rem)
}

.nodata-account-group.ty01 {
    height: auto;
    padding-top: 4.6rem;
    padding-bottom: 1.6rem
}

.nodata-account-group.ty02 {
    height: auto;
    padding-top: 15.4rem
}

.nodata-account-group.ty03 {
    height: auto;
    padding-top: 14.4rem;
    padding-bottom: 7.2rem
}

.nodata-account-group .nodata-guide {
    margin-top: 1.2rem;
    font-size: 0
}

.nodata-account-group .nodata-guide .guide-row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.nodata-account-group .nodata-guide .guide-row+.guide-row {
    margin-top: 0.4rem
}

.nodata-account-group .txt-lv01 {
    color: var(--color-g600, #9b9b9b);
    margin-top: 0.8rem
}

:root .nodata-account-group .txt-lv01 {
    color: var(--txt-sec, #3b4659)
}

.nodata-account-group [class^="btn-"] {
    margin-top: 1.6rem
}

.nodata-account-group .txt-lv03 {
    color: var(--color-g900, #141414)
}

.nodata-account-group .txt-lv03+.txt-lv03 {
    color: var(--color-g700, #7d7d7d);
    margin-left: 0.4rem
}

.nodata-account-group .txt-lv03.type01 {
    color: var(--color-g700, #7d7d7d)
}

.nodata-account-group .txt-lv03.gray1 {
    color: var(--color-g600, #9b9b9b)
}

.nodata-account-group .black {
    color: var(--color-g900, #141414)
}

.nodata-account-group .darkgray {
    color: var(--color-g800, #414141);
    margin-top: 0.8rem
}

.nodata-account-group .ico-arrow-link {
    margin-left: 0.2rem
}

.nodata-account-group .apt-img {
    width: 5rem;
    height: 5rem
}

.nodata-account-group.column {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

/*! component element no data basic type 거래내역없음 */

.nodata-statement-group {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center;
    height: 30rem
}

.nodata-statement-group .ico-warning {
    margin-right: 0.4rem;
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

:root .nodata-statement-group .ico-warning {
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

.nodata-statement-group .txt-lv01 {
    color: var(--color-g600, #9b9b9b)
}

.nodata-statement-group .txt-lv03 {
    padding-left: 0.4rem
}

.nodata-statement-group .txt-lv03.darkgray-2 {
    color: var(--color-g700, #7d7d7d)
}

.nodata-statement-group.line {
    border-bottom: 1px solid var(--color-g300, #e0e0e0)
}

.nodata-statement-group.mt-16 {
    margin-top: -1.6rem
}

.nodata-statement-group.h100 {
    height: 10rem
}

.nodata-statement-group.h130 {
    height: 13rem
}

.nodata-statement-group.h133 {
    height: 13.3rem
}

.nodata-statement-group.h16 {
    height: 16rem
}

.nodata-statement-group.h180 {
    max-height: 18rem
}

.nodata-statement-group+.btn-group.center {
    position: relative;
    bottom: 7rem
}

.nodata-statement-group.h20 {
    height: 20rem
}

.nodata-statement-group.h224 {
    height: 22.4rem
}

.nodata-statement-group.h26 {
    height: 26rem
}

.nodata-statement-group.h24 {
    height: 24rem
}

.nodata-statement-group.coupon {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    height: auto;
    margin-top: 15.4rem
}

.nodata-statement-group.coupon [class^="ico-"] {
    margin-bottom: 1.6rem
}

.nodata-statement-group.coupon.type2 {
    margin-top: 20.8rem
}

.nodata-statement-group.coupon.type3 {
    margin-top: 0;
    padding: 6rem 0
}

.nodata-statement-group.column {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.nodata-statement-group.column [class^="ico-"] {
    margin: 0 0 1.5rem
}

.nodata-statement-group.column [class^="ico-"]+.txt-lv03 {
    padding-left: 0
}

.nodata-statement-group.column .img {
    width: 6rem;
    height: auto
}

.nodata-statement-group.column.type2 .ico-warning {
    width: 4rem;
    height: 4rem;
    -webkit-filter: var(--filter-g400);
    filter: var(--filter-g400);
    margin: 0 0 1rem
}

:root .nodata-statement-group.column.type2 .ico-warning {
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

:root .component-nodata .nodata-statement-group.column.type2 .ico-warning {
    -webkit-filter: var(--filter-g400);
    filter: var(--filter-g400)
}

.component-nodata.full {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-top: -5rem
}

.nodata-statement-group.column.type3 [class^="ico-"] {
    width: 3.6rem;
    height: 3.6rem;
    margin-bottom: 1.2rem
}

.nodata-statement-group.column.type4 .ico-warning {
    width: 4rem;
    height: 4rem;
    -webkit-filter: var(--filter-g400);
    filter: var(--filter-g400);
    margin: 0 0 1rem
}

.section-component.nodata-center {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    height: calc(100vh - 5rem)
}

.section-component.nodata-center .component-nodata.no-space {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.nodata-statement-group.column-left {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.nodata-statement-group.column [class^="txt-lv"] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.nodata-statement-group.column [class^="txt-lv"] [class^="ico-"] {
    margin: 0 0.4rem 0 0
}

.nodata-statement-group.column [class^="txt-lv"]+[class^="btn-lv"] {
    margin-top: 1.6rem
}

.nodata-statement-group.column [class^="txt-lv"]+[class^="btn-lv"] .txt {
    font-weight: 300
}

.nodata-statement-group.column [class^="ico-"] {
    margin: 0 0 1.6rem
}

.container-component.container-flex .component-nodata {
    margin-top: auto;
    margin-bottom: auto
}

/*! component element no data basic type 거래내역없음 */

.nodata-card-group {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center;
    height: 18rem;
    border-radius: 1.2rem;
    border: 1px solid var(--color-g200, #eee);
    background-color: var(--color-w100, #fff)
}

.nodata-card-group .txt-lv01 {
    color: var(--color-g600, #9b9b9b)
}

.nodata-card-group .txt-lv03 {
    padding-left: 0.4rem
}

.nodata-card-group .txt-lv03.darkgray-2 {
    color: var(--color-g700, #7d7d7d)
}

/*! component element CHPFMTASK-861 내 자산(PBKINQ1000003400S) > no data */

.nodata-account-group.column {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.nodata-account-group .my-act-fail [class*="ico"] {
    width: 3.6rem;
    height: 3.6rem
}

.nodata-account-group .my-act-fail .ico-warning {
    -webkit-filter: var(--filter-ico-qua);
    filter: var(--filter-ico-qua)
}

.nodata-account-group .my-act-fail .txt-lv01 {
    color: var(--txt-ter)
}

.nodata-account-group .my-act-fail .btn-lv03.h36 {
    height: 3.6rem;
    padding: 0 1.6rem
}

.nodata-card-group .txt-lv03.darkgray-2 {
    color: var(--color-g700, #7d7d7d)
}

/*! component element CHPFMTASK-1883 쿠폰없음 PBKOFR010000A100S_M02 */

.nodata-account-group.coupon {
    height: 22.5rem;
    margin-bottom: 1.6rem
}

.nodata-account-group.coupon .img {
    width: 6rem;
    height: 6rem;
    margin-bottom: 1.6rem
}

.nodata-account-group.coupon .btn-under-link {
    margin-top: 0.8rem
}

/*! component element search keyword-search-group 검색 공통 - 검색공통화 수정:.fixed, .fixed-addr 통일, .fixed-addr-etc 클래스 삭제 hhw 2022-12-23 */

.component-search {
    background-color: var(--color-w100, #fff)
}

.component-search.bg-gray {
    background-color: var(--color-g100, #f8f8f8)
}

.component-search[class*="fixed"] {
    position: -webkit-sticky;
    position: sticky;
    z-index: 79;
    top: 5rem;
    left: 0;
    margin-top: 0 !important;
    padding-top: 2.4rem;
    width: 100%
}

.component-search .keyword-search-group {
    position: relative
}

.component-search .keyword-search-group:before {
    content: "";
    position: absolute;
    left: 0;
    top: 100%;
    width: 100%;
    height: 2rem;
    background: -webkit-gradient(linear, left top, left bottom, from(var(--color-w100, #fff)), color-stop(40%, #ffffffd9), to(#ffffff00));
    background: -o-linear-gradient(top, var(--color-w100, #fff) 0, #ffffffd9 40%, #ffffff00 100%);
    background: linear-gradient(180deg, var(--color-w100, #fff) 0, #ffffffd9 40%, #ffffff00 100%)
}

.component-search.type2[class*="fixed"] {
    padding-top: 0
}

.component-tab.sticky+.article-component .component-search[class*="fixed"] {
    top: 11rem
}

.component-search.type2 .account-search-group {
    padding: 1.6rem 2rem 1.6rem;
    background-color: var(--color-g100, #f8f8f8) !important
}

.component-search.type2 .account-search-group.bg-white {
    background-color: var(--color-w100, #fff) !important
}

.component-search.type2 .sticky-inner-group {
    border-bottom: 1px solid var(--color-g200, #eee)
}

.component-search.type2 .sticky-inner-group .selectbox-group {
    padding: 2.4rem 2rem 0 2rem
}

.component-search.type2 .sticky-inner-group .keyword-filter-chips {
    padding: 1.6rem 2rem 0 2rem
}

.component-search.type-bg-base {
    padding-top: 0.2rem;
    z-index: 78
}

.component-search.type-bg-base.on {
    padding-top: 0.4rem
}

.component-search.type-bg-base .account-search-group {
    background: var(--bg-pri-base)
}

.component-search.type-bg-base .account-search-group .btn-keyword,
.component-search.type-bg-base .account-search-group .btn-search {
    border: 1px solid var(--color-g300)
}

.component-search.stick .account-search-group {
    border-bottom: 1px solid var(--color-g300)
}

.component-search.type-bg-qua {
    padding-top: 0;
    z-index: 78
}

.component-search.type-bg-qua .account-search-group {
    background: var(--bg-qua)
}

.component-search.type-bg-qua.stick .account-search-group {
    border: none
}

.component-search.type3 .account-search-group {
    padding: 1.2rem 2rem 1.2rem
}

.component-search.type3.show-padding-off .account-search-group {
    padding: .6rem 2rem .6rem;
    height: auto
}

.component-search.type3.show-padding-off.bg-off .account-search-group {
    background-color: transparent
}

.component-search.type3.show-padding-off .account-search-group .btn-select {
    height: auto
}

.component-search.type3.align-left .account-search-group .btn-select {
    margin-left: unset
}

.component-search.type3.align-left.bg-off .account-search-group {
    background-color: transparent
}

.component-search.type3.align-left.show-padding-off .account-search-group {
    padding: .6rem 2rem .6rem;
    height: auto
}

.component-search.type3.align-left.show-padding-off.bg-off .account-search-group {
    background-color: transparent
}

:root .component-search.type4 .account-search-group {
    padding: 1.2rem 2rem 1.2rem;
    background-color: transparent
}

/*! component element search 아파트검색 */

.component-search.fixed-apt~.component-addr-list,
.component-search.fixed-apt~.component-card {
    margin-top: 3.6rem
}

.component-addr-list .nodata-account-group {
    height: auto;
    margin-bottom: 2.4rem
}

/*! component element search 연락처검색 */

.component-search.fixed-addr02+.component-list {
    margin-top: 1.6rem
}

/*! ios(노치) 대응 => device.scss */

/*! component element search 계좌없음 */

.btn-select {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    color: var(--color-g800, #414141)
}

.btn-select.ty01 {
    background: none;
    padding: .6rem 1.2rem;
    border: 1px solid var(--border-quin);
    border-radius: 99.9rem;
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--txt-ter)
}

:root .btn-select {
    color: var(--txt-ter)
}

.btn-select .ico-arrow-open {
    margin-left: 0.4rem;
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

.account-search-group {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    height: 5.6rem;
    padding: 0 2rem;
    background-color: var(--color-g100, #f8f8f8)
}

:root .account-search-group {
    background-color: transparent
}

.account-search-group.pd0 {
    padding: 0 2rem !important
}

.account-search-group .btn-search {
    position: relative;
    width: 3.2rem;
    height: 3.2rem;
    background-color: var(--color-w100, #fff);
    border-radius: 99rem;
    display: inline-block;
    vertical-align: middle
}

.account-search-group .btn-search .ico-search-list {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 1.6rem;
    height: 1.6rem
}

.account-search-group .btn-select {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    text-align: right;
    padding: 0 2rem 0 1rem;
    height: 100%
}

.account-search-group .selectbox-arrow-group {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    text-align: right;
    height: 100%;
    margin-left: auto;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.account-search-group .selectbox-arrow-group .btn-selectbox {
    padding: 0;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    height: 3.2rem;
    border-radius: 99rem;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.account-search-group .selectbox-arrow-group .select-txt {
    color: var(--color-g800, #414141)
}

.account-search-group .input-arrow-group input {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    width: 100%;
    height: 100%;
    background-color: transparent
}

.account-search-group .btn-search+.btn-keyword-area {
    margin-left: 0.4rem
}

.account-search-group .btn-keyword {
    border: 0;
    padding: 0 1.2rem;
    border-radius: 99rem;
    background-color: var(--color-w100, #fff)
}

.account-search-group .btn-keyword>span {
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 9rem;
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--color-g900, #141414);
    font-weight: 500
}

.account-search-group .btn-keyword>span.char10 {
    max-width: 12.6rem
}

.account-search-group .btn-keyword-area {
    font-size: 1.2rem;
    line-height: 1.6rem;
    font-weight: 400;
    color: var(--color-g900, #141414)
}

.account-search-group .btn-keyword-area .ico-delete {
    margin-left: 0.4rem;
    -webkit-filter: none;
    filter: none
}

.account-search-group .btn-keyword-area+.btn-select,
.account-search-group .btn-select {
    padding: 0;
    height: 3.2rem;
    border-radius: 99rem;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    margin-left: auto;
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none
}

.account-search-group .btn-select.fill-type {
    background-color: var(--color-g100, #f8f8f8);
    padding: 0 1.2rem
}

.account-search-group .btn-select.stroke-type {
    border: 1px solid var(--color-g200, #eee);
    background-color: var(--color-w100, #fff);
    padding: 0 1.2rem
}

.account-search-group .btn-keyword-area+.selectbox-arrow-group {
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.account-search-group.noline {
    border: none
}

.account-search-group.bg-g100 {
    background-color: var(--color-g100, #f8f8f8);
    border: none
}

.account-search-group .btn-select>span,
.account-search-group .selectbox-arrow-group .btn-selectbox .txt-name {
    font-size: 1.4rem;
    line-height: 2rem
}

.account-search-group .btn-select.done>span,
.account-search-group .selectbox-arrow-group .btn-selectbox.done .txt-name {
    color: var(--color-bu800, #0150ff)
}

.btn-select-default,
.btn-select-line,
.btn-select-solid {
    height: 3.2rem;
    padding: 0.6rem 1.2rem;
    border-radius: 1.6rem
}

.btn-select-solid {
    background-color: var(--bg-qua)
}

.btn-select-line {
    background-color: var(--bg-pri-base);
    border: 1px solid var(--border-quin)
}

.btn-select-default .txt,
.btn-select-line .txt,
.btn-select-solid .txt {
    color: var(--txt-ter)
}

.btn-select-default .txt+.txt::before,
.btn-select-line .txt+.txt::before,
.btn-select-solid .txt+.txt::before {
    content: '\00B7';
    margin-right: 0.4rem
}

.btn-select-default.type01 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: .6rem 0
}

.btn-select-default.type01 .ico-arrow-open {
    margin-left: .4rem
}

.btn-select-default.type01 .txt::before {
    margin: 0 .2rem
}

/*! component element search 카테고리 목록검색 */

.component-text+.component-list-linebox {
    margin-top: 3.6rem
}

.list-search-group {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding-bottom: 1.2rem;
    font-size: 1.4rem
}

.list-search-group .total_amount {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.list-search-group .total_amount .txt {
    color: var(--color-g700, #7d7d7d)
}

.list-search-group .selectbox-arrow-group .btn-selectbox {
    padding: .6rem 1.2rem;
    height: 3.2rem;
    border-radius: 9rem;
    background: rgba(0, 0, 0, 0.04)
}

:root .list-search-group .selectbox-arrow-group .btn-selectbox {
    background: var(--bg-qua)
}

.list-search-group .selectbox-arrow-group .ico-arrow-open {
    margin-left: 0.4rem;
    width: 1.4rem;
    height: 1.4rem
}

:root .list-search-group .selectbox-arrow-group .ico-arrow-open {
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

.list-search-group.type2 .total_amount .txt {
    color: var(--color-g900, #141414)
}

:root .list-search-group.type2 .total_amount .txt {
    color: var(--color-g700, #4d596f)
}

.list-search-group.type2 .selectbox-arrow-group .btn-selectbox {
    border: 1px solid var(--color-g200, #eee);
    background: var(--color-w100, #fff)
}

:root .list-search-group.type2 .selectbox-arrow-group .btn-selectbox {
    background: var(--bg-base)
}

.list-search-group.type3 .selectbox-arrow-group .btn-selectbox {
    color: var(--color-g700, #7d7d7d);
    padding: .6rem 0;
    border-radius: 0;
    background: transparent
}

:root .list-search-group.type3 .selectbox-arrow-group .btn-selectbox {
    background: transparent
}

.list-search-group.type3 .selectbox-arrow-group .ico-arrow-open {
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

:root .list-search-group .selectbox-arrow-group .btn-selectbox .txt-name {
    color: var(--txt-ter)
}

.list-search-group.type4 {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.list-search-group.type4 .total_amount {
    -webkit-box-flex: inherit;
    -ms-flex: inherit;
    flex: inherit
}

/*! component element search 키워드 + 검색어 */

.keyword-search-group .keyword-search-chips {
    margin: 2.4rem 0
}

/*! component element search sorting 소팅 그룹 */

.sorting-group {
    text-align: right;
    margin-bottom: 1.6rem;
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400
}

.sorting-group [class*="btn-"] {
    margin-left: 0.8rem
}

/*! component element agreement agreement style */

.txt-agreement {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    margin-top: 0.8rem;
    color: var(--color-g700, #7d7d7d)
}

.txt-agreement .bl-txt-group {
    color: var(--color-g500)
}

.agreement-group2 {
    margin-top: 1.6rem;
    padding: 0;
    border: 1px solid var(--color-g300, #e0e0e0);
    border-radius: 1.2rem;
    overflow: hidden
}

.agreement-group2:first-child {
    margin-top: 0
}

.agreement-group2+.text-simple-group {
    margin-top: 3.2rem
}

.agreement-group2+.text-simple-group .tooltip-group {
    margin-left: 0.4rem
}

.agreement-group2 .card-group {
    border: none
}

.agreement-group2.noline {
    border-radius: 1.2rem 1.2rem 0 0
}

.agreement-group2.noline .input-checkbox-group {
    padding-bottom: 1.2rem
}

.agreement-group2.noline .agreement-content {
    padding-top: 0;
    border-top: none
}

.agreement-group2.noline .right {
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: bold
}

.agreement-group2.noline+.noline {
    margin-top: 0;
    border-radius: 0 0 1rem 1rem;
    border-top: none
}

.agreement-group2.txt-ter>.agreement-checkbox .checkbox-txt-field.style01 {
    font-size: 1.8rem;
    line-height: 2.4rem
}

.agreement-group2.txt-ter .agreement-content .input-checkbox-group .checkbox-txt-field {
    color: var(--txt-ter)
}

.agreement-group2.txt-ter .agreement-content .input-checkbox-group .checkbox-txt-field.style01 {
    color: var(--txt-pri)
}

.agreement-define-box+.agreement-group2 {
    margin-top: 2.4rem
}

.agreement-checkbox {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.agreement-checkbox .input-checkbox-group {
    width: 100%;
    padding: 1.9rem 2rem 1.9rem 2rem
}

.agreement-checkbox .input-checkbox-group.left {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.agreement-checkbox .input-checkbox-group.bg-qua {
    background: var(--bg-qua)
}

:root .agreement-checkbox .input-checkbox-group.left:has(input[readonly]) .ico-arrow-link {
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

.agreement-checkbox .input-checkbox-group.left .checkbox-txt-field.style01,
.agreement-group2.noline .agreement-checkbox .input-checkbox-group.left .right {
    margin-top: 0.2rem;
    line-height: 2.1rem
}

.agreement-checkbox .input-checkbox-group.left .ico-arrow-link {
    margin-top: 0.4rem
}

:root .agreement-group2 .checkbox-shape-circle::after {
    width: 1.6333rem;
    height: 1.6333rem
}

:root .agreement-group2 .input-checkbox-group.left .input-checkbox {
    margin-top: .2rem
}

:root .agreement-group2 .input-checkbox-group.left .input-checkbox.w28 {
    width: 2.8rem;
    height: 2.8rem;
    margin-top: 0
}

.agreement-checkbox .input-checkbox-group.left .checkbox-txt-field.a11y-clickable {
    margin-right: -2.4rem;
    padding-right: 2.4rem
}

.agreement-content .input-checkbox-group .checkbox-txt-field.a11y-clickable {
    margin-right: -3rem;
    padding-right: 3rem
}

.input-checkbox-group .a11y-clickable+[class*=ico][aria-hidden=true] {
    position: relative;
    z-index: -1
}

.agreement-checkbox .ico-arrow-link {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: 1.6rem;
    height: 1.6rem;
    -webkit-filter: var(--filter-g500);
    filter: var(--filter-g500)
}

.agreement-tit {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.agreement-tit .tit {
    padding: 2rem;
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: bold
}

.agreement-check-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 2rem
}

.agreement-check-group .agreement-check-tit {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.agreement-check-group>.agreement-check-tit {
    font-weight: 500
}

.agreement-check-group .agreement-check-tit [class^="logo-card"] {
    margin-right: 0.8rem
}

.agreement-check-group .agreement-check-num {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.agreement-check-group .agreement-check-num .input-checkbox.circle {
    margin-left: 1.5rem
}

.agreement-content {
    padding: 2rem;
    border-top: 1px solid var(--color-g300, #e0e0e0)
}

.agreement-content:only-of-type {
    border-top: 0
}

.agreement-content.space01 {
    padding: 0
}

.agreement-content.noline {
    border-top: none
}

.agreement-content .tit {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: bold
}

.agreement-content>.txt {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400
}

.agreement-content .bl-txt-group .txt {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400
}

.agreement-content>.input-checkbox-group {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    line-height: 20px;
    margin-top: 0.6rem
}

.agreement-content>.input-checkbox-group:first-child {
    margin-top: 0
}

.agreement-content .checkbox-txt-field {
    display: block;
    -o-text-overflow: initial;
    text-overflow: initial;
    white-space: initial;
    padding-right: 0.5rem
}

:root .agreement-content .checkbox-txt-field {
    color: var(--txt-pri, #020616)
}

.agreement-content .checkbox-txt-field .tag {
    margin-left: 0.4rem;
    margin-top: -1px
}

.agreement-content .checkbox-txt-field .txt-add {
    display: block;
    padding-top: 4px;
    font-size: 1.2rem;
    line-height: 1.6rem;
    font-weight: 400;
    color: var(--color-g700, #7d7d7d)
}

.agreement-content .ico-arrow-link {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    padding-right: 1.4rem;
    -webkit-filter: var(--filter-g500);
    filter: var(--filter-g500)
}

.agreement-content .input-checkbox-group .ico-arrow-link {
    margin-top: 4px
}

.agreement-content .agreement-checkbox .input-checkbox-group .ico-arrow-link {
    margin-top: 0
}

.agreement-content .checkbox-txt-field.link {
    padding-right: 1rem
}

.agreement-content .checkbox-txt-field.link .ico-arrow-link {
    position: absolute;
    top: 0;
    right: 0
}

.agreement-inbox-gray {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    background-color: var(--color-g100, #f8f8f8);
    border-radius: 1.2rem;
    padding: 0 1.6rem 1.6rem;
    margin-top: 1.2rem
}

.agreement-inbox-gray .input-checkbox-group {
    width: 33.33%;
    margin-top: 1.6rem
}

.agreement-inbox-gray.w50 .input-checkbox-group {
    width: 50%
}

.agreement-inbox-gray .bl-txt-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    width: 100%;
    margin-top: 1.2rem
}

.agreement-inbox-gray .bl-txt-group li {
    width: 50%
}

.agreement-inbox-gray .bl-txt-group .txt {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    margin-top: 0.4rem;
    color: var(--color-g700, #7d7d7d)
}

.agreement-inbox-gray .bl-txt-group .txt+.txt {
    margin-top: 0.4rem
}

.agreement-define-box {
    padding: 2rem
}

.agreement-define-box .define-tit {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400
}

.agreement-define-box .define-flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding-top: 1.2rem
}

.agreement-define-box .define-flex>.form-group {
    width: 100%
}

.agreement-define-box .define-flex .input-radio-group {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.agreement-define-box .define-flex .ico-warning+.btn-under-link {
    margin-left: 0.6rem
}

.agreement-define-box .define-form {
    width: 100%;
    margin-top: 1.6rem
}

.agreement-define-box .card-name {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400
}

.agreement-define-box .card-num {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    padding-top: 0.2rem;
    color: var(--color-g600, #9b9b9b)
}

.agreement-define-box .define-row {
    display: block
}

.agreement-define-box .define-row .input-radio-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-top: 1.2rem
}

.agreement-define-box+.agreement-define-box.disabled {
    margin-top: 0;
    background-color: var(--color-g100, #f8f8f8)
}

.agreement-define-box+.agreement-define-box.disabled .disabled-card-name {
    color: var(--color-g500, #b8b8b8)
}

.agreement-define-box+.agreement-define-box.disabled .disabled-card-name .tag.color06 {
    background-color: var(--color-g200, #eee)
}

.agreement-define-box+.agreement-define-box.disabled .card-num {
    color: var(--color-g500, #b8b8b8)
}

.agreement-define-box+.agreement-define-box {
    margin-top: 2rem;
    border-top: 1px solid var(--color-g300, #e0e0e0)
}

/*! component element agreement 특약사항안내 - 아파트 담보대출 */

.agreement-content .graybox-group {
    background-color: var(--color-g100, #f8f8f8);
    border-radius: 1.2rem;
    padding: 2rem
}

.agreement-content .graybox-group .btn-arrow {
    height: 3rem;
    margin-bottom: -2rem;
    text-align: center;
    width: 100%;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.agreement-content .graybox-group .btn-arrow .ico-arrow-open {
    margin-left: 0
}

.agreement-content .flex-tit {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-bottom: 1.6rem;
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: bold
}

.agreement-content .flex-tit .status {
    color: var(--color-g700, #7d7d7d);
    font-size: 1.2rem;
    line-height: 1.6rem;
    font-weight: bold
}

.agreement-content .flex-tit .txt {
    margin-left: 0.4rem
}

.agreement-content .folding-area .nodata-statement-group {
    height: 6rem
}

.agreement-content .folding-area .nodata-statement-group .txt-lv01 {
    font-size: 1.2rem;
    line-height: 1.6rem;
    font-weight: 400
}

.agreement-content .arrange-group .txt {
    margin-top: 1.6rem;
    color: var(--color-g800, #414141)
}

/*! component element agreement 리스트+박스라디오 or 무빙라디오 */

.agreement-group3 {
    margin-top: 4.8rem
}

.agreement-group3.devide {
    /*! 간격구분이 다를때 사용*/
    margin-top: 4.8rem
}

.agreement-group3 .agreement-define-box {
    padding: 0;
    border: none
}

.agreement-group3 .agreement-define-box+.agreement-define-box {
    margin-top: 2.4rem
}

.agreement-group3 .define-tit {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400
}

.agreement-group3 .define-tit .txt-lv03 {
    padding-left: 0.8rem;
    color: var(--color-g700, #7d7d7d)
}

.agreement-group3 .define-tit .tooltip-group .btn-tooltip {
    top: -1px
}

.agreement-group3 .define-tit.flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.agreement-group3 .define-flex {
    padding-top: 1.2rem
}

.agreement-group3+.graybox-text-group {
    margin-top: 3.2rem
}

/*! component element agreement agreement + form 간격 */

[class^="agreement-group"]+.form-group {
    margin-top: 1.6rem
}

/*! component element agreement FETASK-1428 3뎁스 추가 2023-09-04 */

.agreement-content .tit {
    padding: 0 2.8rem
}

.agreement-checkbox .input-checkbox-group.left .ico-arrow-link {
    width: 1.6rem;
    height: 2.4rem;
    margin-top: 0;
    margin-left: .8rem;
    padding-right: 0;
    background-size: 1.6rem 1.6rem;
    -webkit-filter: none;
    filter: none
}

:root .agreement-checkbox .input-checkbox-group.left .input-checkbox.circle {
    margin-top: -2px;
    width: 2.8rem;
    height: 2.8rem
}

.agreement-content>.input-checkbox-group {
    margin-top: .4rem
}

.agreement-content>.tit+.input-checkbox-group {
    margin-top: 1.2rem
}

.agreement-content .input-checkbox {
    width: 2.4rem;
    height: 2.4rem
}

:root .agreement-content .input-checkbox {
    width: 2rem;
    height: 2rem
}

.agreement-content .checkbox-txt-field {
    padding-top: .2rem;
    padding-right: 0
}

.agreement-content .input-checkbox-group .ico-arrow-link {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    width: 2.4rem;
    height: 2.4rem;
    margin-top: 0;
    margin-left: .6rem;
    padding-right: 0;
    background-size: 1.4rem 1.4rem;
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

:root .agreement-content .input-checkbox-group .ico-arrow-link {
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

.agreement-content .agreement-checkbox>.input-checkbox-group {
    line-height: 2rem
}

.agreement-content .agreement-checkbox .input-checkbox-group.left .ico-arrow-link {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    background-size: 1.4rem 1.4rem;
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

.agreement-content .ico-arrow-open {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    width: 2.4rem;
    height: 2.4rem;
    margin-left: .6rem;
    background-size: 1.4rem 1.4rem;
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

.agreement-content .input-checkbox-depth3 {
    padding-left: 2.8rem;
    margin-top: 0.4rem
}

.agreement-content .input-checkbox-depth3 .input-checkbox-group {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    line-height: 20px
}

.agreement-content .input-checkbox-depth3 .input-checkbox-group:first-child {
    margin-top: 0
}

.agreement-content .input-checkbox-depth3 .input-checkbox-group .input-checkbox {
    width: 2rem;
    height: 2rem;
    margin-top: .2rem;
    margin-right: .4rem
}

.agreement-content .input-checkbox-depth3 .checkbox-txt-field {
    max-width: calc(100% - 5.6rem);
    padding: .4rem 0;
    font-size: 1.2rem;
    line-height: 1.6rem;
    color: var(--txt-ter)
}

.agreement-content .input-checkbox-depth3 .checkbox-shape-line:after {
    width: 1.4rem;
    height: 1.4rem
}

.agreement-content .input-checkbox-depth3 .ico-arrow-link {
    width: 2rem;
    height: 2rem;
    margin: .2rem .2rem .2rem 1rem;
    background-size: 1.2rem 1.2rem
}

.agreement-content .btn-lv04 .ico-arrow-open {
    width: 1.6rem;
    height: 1.6rem;
    background-size: 1.6rem 1.6rem
}

/*! component element agreement as-is 약관.html 스타일 적용 약관은 as-is html로 만든 것을 관리자에 등록해서 불러옴 to-be에 약관페이지를 불러올때 깨지지 않도록 아래에 as-is css 를 추가 해줌 */

.component-agreement-include {
    padding: 0
}

.component-agreement-include .law_wrap {
    padding: 0;
    background: var(--color-w100, #fff) !important;
    overflow-y: auto
}

.component-agreement-include .law_wrap iframe {
    width: 100%;
    height: 100%
}

.component-agreement-include .law_wrap .law table {
    margin-bottom: 5px
}

.component-agreement-include .law {
    padding: 20px;
    background: var(--color-w100, #fff)
}

.component-agreement-include .law h1 {
    font-size: 20px;
    text-align: center;
    margin-bottom: 10px
}

.component-agreement-include .law h2 {
    margin: 20px 0 20px 0
}

.component-agreement-include .law h3 {
    margin-top: 10px
}

.component-agreement-include .law .law_info {
    margin: 10px 0
}

.component-agreement-include .law>p {
    background: #f3f3f3;
    padding: 10px;
    margin-bottom: 10px
}

.component-agreement-include .law p:first-child {
    margin-top: 0;
    margin-bottom: 30px
}

.component-agreement-include .law dt:first-child {
    margin-top: 0
}

.component-agreement-include .law dt {
    margin-top: 30px;
    font-size: 16px;
    font-weight: bold;
    color: var(--color-g900, #141414)
}

.component-agreement-include .inbox .law dt:first-child {
    margin-top: 0
}

.component-agreement-include .law dd {
    margin-top: 10px
}

.component-agreement-include .law dd strong {
    display: block;
    color: var(--color-g900, #141414);
    margin: 10px 0;
    padding-left: 18px
}

.component-agreement-include .law dd .list_type_dot li>strong {
    margin: 0;
    padding-left: 0
}

.component-agreement-include .law dd li {
    margin-top: 5px;
    padding-left: 18px;
    text-indent: -18px
}

.component-agreement-include .law .list_type_dash li {
    padding-left: 8px;
    text-indent: 0
}

.component-agreement-include .law dd li li {
    padding-left: 16px;
    text-indent: -16px
}

.component-agreement-include .law dd li a {
    text-indent: 0
}

.component-agreement-include .law>ul {
    padding: 0 20px
}

.component-agreement-include .law>ul li {
    margin-top: 5px
}

.component-agreement-include .law table {
    margin-top: 20px
}

.component-agreement-include .law td table {
    margin-top: 5px
}

.component-agreement-include .law table td,
.component-agreement-include .law table th {
    padding: 5px;
    border: 1px solid #c8c8c8;
    text-indent: 0;
    word-break: break-all
}

.component-agreement-include .law table table.intable tr th {
    border-top: 0;
    border-right: 0;
    border-bottom: 0
}

.component-agreement-include .law table table.intable tr th:first-child {
    border-left: 0
}

.component-agreement-include .law .btn_linetxt {
    text-indent: 0
}

.component-agreement-include .law dd .list_type_dot li,
.component-agreement-include .law dd li .list_normal li {
    padding-left: 0;
    text-indent: 0
}

.component-agreement-include .law dd li .list_normal li:last-child {
    margin-bottom: 20px
}

.component-agreement-include .law dd li .list_normal li table {
    margin-top: 5px
}

.component-agreement-include .law dd table tr td .list_type_dash li .list_normal li,
.component-agreement-include .law dd table tr td .list_type_dot li .list_normal li {
    background: none
}

.component-agreement-include .law .kdic_date {
    display: block;
    text-align: right;
    font-size: 12px;
    margin-top: 10px
}

.component-agreement-include .law .kdic {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 10px;
    margin-bottom: 10px;
    border: 1px solid #c8c8c8;
    margin-top: 5px
}

.component-agreement-include .law .kdic:after {
    content: "";
    display: block;
    clear: both
}

.component-agreement-include .law .kdic img {
    float: left;
    width: 50px
}

.component-agreement-include .law .kdic .txt {
    display: block;
    margin-left: 60px
}

.component-agreement-include .law_right {
    margin: 20px 0
}

.component-agreement-include .law_right li {
    text-align: right;
    line-height: 22px
}

.component-agreement-include .law .tbl_tit {
    margin: 10px 0 0 0;
    padding: 0;
    font-weight: normal
}

.component-agreement-include .law .tbl_tit+table {
    margin-top: 10px
}

.component-agreement-include .law .table_law {
    margin-bottom: 5px;
    text-align: left
}

.component-agreement-include .law dl dd ul li .table_law {
    margin-left: -18px
}

.component-agreement-include .law dl dd .list_type_dot li .list_type_dash {
    margin-top: 5px
}

.component-agreement-include .law dl+p,
.component-agreement-include .law ul+p {
    margin-top: 10px
}

.component-agreement-include .law .product_img_set li {
    padding: 20px !important;
    text-indent: 0;
    background: none;
    text-align: center
}

.component-agreement-include .law .list_type_star {
    padding: 0
}

.component-agreement-include .law .list_type_star li {
    padding-left: 10px;
    text-indent: 0
}

.component-agreement-include .law .product_img_set {
    width: 100%;
    text-align: center
}

.component-agreement-include .law .product_img_set li {
    width: auto
}

.component-agreement-include .law .exBox {
    margin: 5px 0;
    padding: 10px;
    background: #f3f3f3;
    text-indent: 0
}

.component-agreement-include .law .agreeBox {
    margin: 10px 0;
    text-align: right
}

.component-agreement-include .law .agreeBox .agree,
.component-agreement-include .law .agreeBox .allagree,
.component-agreement-include .law .agreeBox .disagree {
    display: inline-block;
    width: 130px;
    padding: 3px 7px 3px 3px;
    color: var(--color-w100, #fff);
    text-align: center
}

.component-agreement-include .law .agreeBox .agree:before,
.component-agreement-include .law .agreeBox .allagree:before,
.component-agreement-include .law .agreeBox .disagree:before {
    content: '';
    display: inline-block;
    width: 20px;
    height: 20px;
    margin-right: 7px;
    background: var(--color-w100, #fff)
}

.component-agreement-include .law .agreeBox .agree {
    background: var(--color-pn, #17008c);
    margin-left: 15px
}

.component-agreement-include .law .agreeBox .disagree {
    background: #333e48
}

.component-agreement-include .law .agreeBox .allagree {
    width: 180px;
    background: var(--color-pn, #17008c);
    font-weight: bold
}

.component-agreement-include .law .agreeBox .agree.on:before,
.component-agreement-include .law .agreeBox .allagree.on:before,
.component-agreement-include .law .agreeBox .disagree.on:before {
    content: 'V ';
    color: var(--color-pb100, #000)
}

.component-agreement-include .law .border {
    margin-top: 10px;
    padding: 10px;
    border: 1px solid #c8c8c8
}

.component-agreement-include .law .signup {
    overflow: hidden
}

.component-agreement-include .law .signup .left {
    float: left
}

.component-agreement-include .law .signup .right {
    float: right;
    margin-top: 10px
}

.component-agreement-include .law .block_item {
    padding: 0;
    margin: 0
}

.component-agreement-include .law .block_item>li {
    border: 1px solid #c8c8c8
}

.component-agreement-include .law .block_item>li+li {
    margin-top: 10px
}

.component-agreement-include .law .block_item li .tit {
    display: block;
    padding: 10px;
    text-align: center
}

.component-agreement-include .law .block_item li .cont {
    padding: 18px;
    background-color: #f7f6f6
}

.component-agreement-include .law {
    padding-top: 0
}

.component-agreement-include .law h1 {
    font-size: 2.1rem;
    line-height: 2.7rem;
    font-weight: 400;
    text-align: center;
    margin-bottom: 1rem
}

.component-agreement-include .law dl {
    margin-top: 2rem
}

.component-agreement-include .law dt {
    margin-top: 3rem;
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: bold;
    color: var(--color-g900, #141414)
}

.component-agreement-include .law dt:first-child {
    margin-top: 0
}

.component-agreement-include .law dd {
    margin-top: 1rem;
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g900, #141414)
}

.component-agreement-include .law dd li {
    margin-top: 0.5rem;
    padding-left: 1.8rem;
    text-indent: -1.8rem
}

.component-agreement-include .terms-cont-wrap {
    position: relative;
    max-width: 940px;
    margin: 0 auto;
    padding: 30px;
    letter-spacing: -0.2px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.component-agreement-include .terms-cont-wrap+.terms-cont-wrap {
    padding-top: 64px
}

.component-agreement-include .terms-cont-wrap+.terms-cont-wrap::before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 12px;
    background: var(--color-g100, #f8f8f8)
}

.component-agreement-include .terms-cont-wrap .terms-top {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 20px
}

.component-agreement-include .terms-cont-wrap .terms-top h1 {
    -webkit-box-flex: 0;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    font-size: 21px;
    font-weight: bold;
    line-height: 29px;
    color: var(--color-g900, #141414)
}

.component-agreement-include .terms-cont-wrap .terms-top .terms-img {
    -webkit-box-flex: 1;
    -ms-flex: 1 0 64px;
    flex: 1 0 64px;
    text-align: right
}

.component-agreement-include .terms-cont-wrap .terms-top .terms-img img {
    width: auto;
    max-width: 100%
}

.component-agreement-include .terms-cont-wrap .tit-type-bg {
    display: inline-block;
    padding: 4px 12px 4px 4px;
    background: #12406e;
    border-radius: 21px;
    font-size: 13px;
    color: var(--color-w100, #fff);
    line-height: 20px
}

.component-agreement-include .terms-cont-wrap .tit-type-bg em {
    display: inline-block;
    width: 18px;
    height: 18px;
    margin-right: 6px;
    background: var(--color-w100, #fff);
    border-radius: 50%;
    font-size: 14px;
    font-weight: bold;
    color: #11406e;
    line-height: 17px;
    text-align: center
}

.component-agreement-include .terms-cont-wrap .tit-type-bg+.tbl-tit {
    margin-top: 20px
}

.component-agreement-include .terms-cont-wrap .line-box {
    padding: 12px;
    border: 1px solid #d9d9d9
}

.component-agreement-include .terms-cont-wrap .line-box .check-box .r2input_check+.r2input_check {
    margin-left: 10px
}

.component-agreement-include .terms-cont-wrap .check-box {
    text-align: right
}

.component-agreement-include .terms-cont-wrap .check-box .txt {
    margin-bottom: 8px;
    font-size: 14px;
    color: var(--color-g900, #141414);
    line-height: 20px;
    text-align: left
}

.component-agreement-include .terms-cont-wrap .check-box .r2input_check .check_text {
    font-size: 14px;
    color: var(--color-g900, #141414);
    letter-spacing: -1px
}

.component-agreement-include .terms-cont-wrap .check-box .r2input_check+.r2input_check {
    margin-left: 5px
}

.component-agreement-include .terms-cont-wrap .check-box .check-txt {
    display: inline-block
}

.component-agreement-include .terms-cont-wrap .check-box .check-txt span {
    display: inline-block;
    font-size: 14px;
    color: var(--color-g900, #141414);
    line-height: 19px;
    letter-spacing: -1px;
    vertical-align: middle
}

.component-agreement-include .terms-cont-wrap .check-box .check-txt span+span {
    margin-left: 15px
}

.component-agreement-include .terms-cont-wrap .check-box .check-txt>a {
    display: inline-block;
    margin-right: 15px
}

.component-agreement-include .terms-cont-wrap .grade-box {
    background: #fafafa;
    margin-top: 30px;
    padding: 20px 12px
}

@media screen and (max-width: 320px) {
    .component-agreement-include .terms-cont-wrap .grade-box {
        padding: 20px 8px
    }
}

.component-agreement-include .terms-cont-wrap .grade-box .tit-type-bg {
    margin-bottom: 22px
}

.component-agreement-include .terms-cont-wrap .grade-box .grade-bar {
    position: relative;
    font-size: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    background: transparent
}

.component-agreement-include .terms-cont-wrap .grade-box .grade-bar::after {
    content: '';
    position: absolute;
    left: -3px;
    right: -3px;
    bottom: -3px;
    height: 24px;
    border: 3px solid var(--color-w100, #fff);
    border-radius: 16px;
    -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.04);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.04);
    -webkit-box-sizing: content-box;
    box-sizing: content-box
}

.component-agreement-include .terms-cont-wrap .grade-box .grade-bar>span {
    position: relative;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    font-size: 12px;
    font-weight: bold;
    line-height: 20px;
    text-align: center
}

@media screen and (max-width: 320px) {
    .component-agreement-include .terms-cont-wrap .grade-box .grade-bar>span {
        font-size: 11px
    }
}

.component-agreement-include .terms-cont-wrap .grade-box .grade-bar>span::after {
    content: '';
    display: block;
    height: 24px;
    margin-top: 3px
}

.component-agreement-include .terms-cont-wrap .grade-box .grade-bar>span::before {
    content: '';
    position: absolute;
    left: 50%;
    bottom: -4px;
    width: 17px;
    height: 22px;
    background: url("../../img/mmk/agreement/ico_check.svg") no-repeat 0 0;
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    display: none;
    z-index: 1
}

.component-agreement-include .terms-cont-wrap .grade-box .grade-bar .grade01 {
    color: #23a6d2
}

.component-agreement-include .terms-cont-wrap .grade-box .grade-bar .grade01::after {
    background: #23a6d2;
    border-radius: 21px 0 0 21px
}

.component-agreement-include .terms-cont-wrap .grade-box .grade-bar .grade02 {
    color: #64bc54
}

.component-agreement-include .terms-cont-wrap .grade-box .grade-bar .grade02::after {
    background: #64bc54
}

.component-agreement-include .terms-cont-wrap .grade-box .grade-bar .grade03 {
    color: #ecc01b
}

.component-agreement-include .terms-cont-wrap .grade-box .grade-bar .grade03::after {
    background: #ecc01b
}

.component-agreement-include .terms-cont-wrap .grade-box .grade-bar .grade04 {
    color: #ef812d
}

.component-agreement-include .terms-cont-wrap .grade-box .grade-bar .grade04::after {
    background: #ef812d
}

.component-agreement-include .terms-cont-wrap .grade-box .grade-bar .grade05 {
    color: var(--color-re700, #f02727)
}

.component-agreement-include .terms-cont-wrap .grade-box .grade-bar .grade05::after {
    background: var(--color-re700, #f02727);
    border-radius: 0 21px 21px 0
}

.component-agreement-include .terms-cont-wrap .grade-box .txt {
    margin-top: 25px;
    padding: 0 8px;
    font-size: 14px;
    color: var(--color-g900, #141414);
    line-height: 20px
}

.component-agreement-include .terms-cont-wrap .grade-box .txt span {
    font-weight: bold
}

.component-agreement-include .terms-cont-wrap .grade-txt {
    display: inline-block;
    min-width: 41px;
    height: 19px;
    padding: 0 5px;
    border-radius: 9px;
    font-size: 12px;
    font-weight: bold;
    color: var(--color-w100, #fff);
    line-height: 19px;
    text-align: center;
    vertical-align: middle;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.component-agreement-include .terms-cont-wrap .grade-txt+.check-txt span+span {
    margin-left: 10px
}

.component-agreement-include .terms-cont-wrap .current-grade01 {
    background: #23a6d2
}

.component-agreement-include .terms-cont-wrap .current-grade01>span.grade01::before {
    display: block
}

.component-agreement-include .terms-cont-wrap .current-grade02 {
    background: #64bc54
}

.component-agreement-include .terms-cont-wrap .current-grade02>span.grade02::before {
    display: block
}

.component-agreement-include .terms-cont-wrap .current-grade03 {
    background: #ecc01b
}

.component-agreement-include .terms-cont-wrap .current-grade03>span.grade03::before {
    display: block
}

.component-agreement-include .terms-cont-wrap .current-grade04 {
    background: #ef812d
}

.component-agreement-include .terms-cont-wrap .current-grade04>span.grade04::before {
    display: block
}

.component-agreement-include .terms-cont-wrap .current-grade05 {
    background: var(--color-re700, #f02727)
}

.component-agreement-include .terms-cont-wrap .current-grade05>span.grade05::before {
    display: block
}

.component-agreement-include .terms-cont-wrap .terms-tbl .tbl-type-01 {
    width: 100%;
    margin-top: 30px;
    border-top: 1px solid #666;
    border-bottom: 1px solid #666;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.component-agreement-include .terms-cont-wrap .terms-tbl .tbl-type-01.no-line tbody tr th {
    border-top: 0
}

.component-agreement-include .terms-cont-wrap .terms-tbl .tbl-type-01.no-line tbody tr td {
    border: 0
}

.component-agreement-include .terms-cont-wrap .terms-tbl .tbl-type-01.no-line tbody tr td.check-box {
    border-top: 1px solid var(--color-g200, #eee)
}

.component-agreement-include .terms-cont-wrap .terms-tbl .tbl-type-01 tbody tr th {
    padding: 11px 8px;
    background: #fafafa;
    font-size: 13px;
    font-weight: normal;
    color: var(--color-g900, #141414);
    line-height: 20px;
    text-align: left;
    border-right: 1px solid var(--color-g200, #eee);
    border-top: 1px solid var(--color-g200, #eee)
}

.component-agreement-include .terms-cont-wrap .terms-tbl .tbl-type-01 tbody tr td.td-pd0 {
    padding: 0
}

.component-agreement-include .terms-cont-wrap .terms-tbl .tbl-type-01 tbody tr td.td-pd0 .td-tit {
    padding: 11px 8px 8px
}

.component-agreement-include .terms-cont-wrap .terms-tbl .tbl-type-01 tbody tr td .td-tit {
    font-size: 15px;
    font-weight: bold;
    color: var(--color-g900, #141414);
    line-height: 21px
}

.component-agreement-include .terms-cont-wrap .terms-tbl .tbl-type-01 tbody tr td .td-tit.tit-s {
    font-size: 14px;
    line-height: 20px
}

.component-agreement-include .terms-cont-wrap .terms-tbl .tbl-type-01 tbody tr td .td-tit+.td-txt {
    margin-top: 6px
}

.component-agreement-include .terms-cont-wrap .terms-tbl .tbl-type-01 tbody tr:first-child>* {
    border-top: 0
}

.component-agreement-include .terms-cont-wrap .terms-tbl .tbl-type-01 tbody tr.line_top td,
.component-agreement-include .terms-cont-wrap .terms-tbl .tbl-type-01 tbody tr.line_top th {
    border-top: 1px solid var(--color-g200, #eee)
}

.component-agreement-include .terms-cont-wrap .terms-tbl .tbl-type-01 .tbl-inner {
    padding: 11px 0 11px 10px
}

.component-agreement-include .terms-cont-wrap .terms-tbl .tbl-type-01 .tbl-inner .tbl-type-01 {
    margin: 0;
    border: 0
}

.component-agreement-include .terms-cont-wrap .terms-tbl .tbl-type-01 .tbl-inner .tbl-type-01 tbody tr th {
    background: #f7fbfc;
    word-break: break-all
}

.component-agreement-include .terms-cont-wrap .terms-tbl .tbl-type-01 .bg-box {
    padding: 8px;
    background: #f7fbfc
}

.component-agreement-include .terms-cont-wrap .terms-tbl .tbl-type-03 {
    border-top: 1px solid #666;
    border-bottom: 1px solid #666;
    border-right: 1px solid #e9e9e9;
    font-size: 14px;
    color: #141414;
    text-align: center
}

.component-agreement-include .terms-cont-wrap .terms-tbl .tbl-type-03 thead th {
    padding: 8px 0;
    background: #fafafa;
    border-left: 1px solid #e9e9e9
}

.component-agreement-include .terms-cont-wrap .terms-tbl .tbl-type-03 tbody th {
    border-top: 1px solid #e9e9e9;
    border-left: 1px solid #e9e9e9
}

.component-agreement-include .terms-cont-wrap .terms-tbl .tbl-type-03 td {
    padding: 8px 10px;
    border-top: 1px solid #e9e9e9;
    border-left: 1px solid #e9e9e9
}

.component-agreement-include .terms-cont-wrap .terms-tbl .tbl-type-03 td.bg {
    background-color: #f7fbfc
}

.component-agreement-include .terms-cont-wrap .terms-tbl .tbl-type-03 td.tal {
    text-align: left
}

.component-agreement-include .terms-cont-wrap .listDot li {
    margin-top: 12px;
    padding-left: 9px;
    color: #333e48;
    font-size: 14px;
    line-height: 18px;
    background: url("/resource/img/reform/bul/dot.png") no-repeat 0 8px;
    background-size: 2px 2px
}

.component-agreement-include .terms-cont-wrap .listDot li:first-child {
    margin-top: 0
}

.component-agreement-include .terms-cont-wrap .listDot.typeGray li {
    color: #5f7289;
    background: url("/resource/img/reform/bul/dot03.png") no-repeat 0 8px;
    background-size: 2px 2px
}

.component-agreement-include .terms-cont-wrap .terms-tbl .tbl-tit {
    margin-top: 40px;
    font-size: 14px;
    font-weight: bold;
    line-height: 18px;
    color: var(--color-pb100, #000)
}

.component-agreement-include .terms-cont-wrap .terms-tbl .tbl-tit+.tbl-type-01 {
    margin-top: 16px
}

.component-agreement-include .terms-cont-wrap .terms-tbl .tit-type-bg {
    margin-top: 30px
}

.component-agreement-include .terms-cont-wrap .terms-tbl .tit-type-bg+.tbl-type-01 {
    margin-top: 20px
}

.component-agreement-include .terms-cont-wrap .terms-tbl .tit-type-bg+.tbl-tit {
    margin-top: 20px
}

.component-agreement-include .terms-cont-wrap .terms-bottom {
    position: relative;
    padding: 60px 0 40px
}

.component-agreement-include .terms-cont-wrap .terms-bottom .terms-img {
    position: absolute;
    left: 5px;
    bottom: 52px
}

.component-agreement-include .terms-cont-wrap .terms-bottom .terms-img img {
    height: 21px
}

@media screen and (max-width: 320px) {
    .component-agreement-include .terms-cont-wrap .terms-bottom .terms-img img {
        height: 18px
    }
}

.component-agreement-include .terms-cont-wrap .terms-bottom .terms-txt-box {
    text-align: right;
    font-size: 14px;
    color: var(--color-g900, #141414)
}

.component-agreement-include .terms-cont-wrap .terms-bottom .terms-txt-box .terms-date span {
    display: inline-block;
    min-width: 70px
}

.component-agreement-include .terms-cont-wrap .terms-bottom .terms-txt-box .terms-name {
    padding-top: 18px
}

.component-agreement-include .terms-cont-wrap .terms-bottom .terms-txt-box .terms-name li {
    margin-top: 12px
}

.component-agreement-include .terms-cont-wrap .terms-bottom .terms-txt-box .terms-name li p {
    display: inline-block
}

.component-agreement-include .terms-cont-wrap .terms-bottom .terms-txt-box .terms-name li p span {
    display: inline-block;
    min-width: 75px
}

@media screen and (max-width: 320px) {
    .component-agreement-include .terms-cont-wrap .terms-bottom .terms-txt-box .terms-name li p span {
        min-width: 55px
    }
}

.component-agreement-include .terms-cont-wrap .terms-bottom .terms-txt-box .terms-name li>span {
    display: inline-block;
    margin-left: 5px;
    color: #878787
}

.component-agreement-include .terms-cont-wrap .f-large {
    font-size: 15px
}

.component-agreement-include .terms-cont-wrap .f-bold {
    font-weight: bold
}

.component-agreement-include .iframewrap {
    padding: 20px;
    background-color: var(--color-w100, #fff)
}

.component-agreement-include .iframewrap h3 {
    font-size: 20px;
    text-align: center;
    margin-bottom: 10px
}

.component-agreement-include .iframewrap h3+h4 {
    margin-top: 0
}

.component-agreement-include .iframewrap h4 {
    margin-top: 30px;
    font-size: 16px;
    font-weight: bold;
    color: #141823
}

.component-agreement-include .iframewrap h4+p {
    margin-top: 10px
}

.component-agreement-include .iframewrap h4+ul {
    margin-top: 10px
}

.component-agreement-include .iframewrap>ul>li {
    margin-top: 5px;
    padding-left: 18px;
    text-indent: -18px
}

.component-agreement-include .iframewrap>ul>li dl dt {
    margin-top: 5px;
    padding-left: 16px;
    text-indent: -16px
}

.component-agreement-include .iframewrap h5 {
    font-size: 21px;
    font-weight: 700;
    margin: 20px 0 20px 0
}

.component-agreement-include .iframewrap p {
    margin-top: 10px
}

.component-agreement-include .iframewrap table th {
    padding: 5px;
    border: 1px solid #c8c8c8;
    text-indent: 0;
    word-break: break-all
}

.component-agreement-include .iframewrap table td {
    padding: 5px;
    border: 1px solid #c8c8c8;
    text-indent: 0;
    word-break: break-all
}

/*! CHPFMTASK-1861 */

.component-agreement-include .reInfoBox {
    margin: 3.2rem 2rem 0;
    padding: 1.6rem 2rem;
    background-color: var(--color-g100, #f8f8f8);
    font-size: 1.6rem;
    color: var(--color-g800, #414141);
    line-height: 2.2rem
}

.component-agreement-include .ico_tel {
    font-style: normal
}

.component-agreement-include .font_b {
    font-weight: 700
}

.component-agreement-include .law.reLaw span.num {
    display: inline-block;
    width: 1.8rem;
    text-indent: 0
}

.component-agreement-include .law.reLaw dd p {
    margin-bottom: 1rem
}

.component-agreement-include .law.reLaw dd li p {
    text-indent: 0
}

.component-agreement-include .law.reLaw table {
    margin-top: 2rem
}

.component-agreement-include .law.reLaw td table {
    margin-top: .5rem
}

.component-agreement-include .law.reLaw table td,
.component-agreement-include .law.reLaw table th {
    padding: .5rem;
    border: 1px solid var(--color-g300);
    text-indent: 0;
    word-break: break-all
}

/*! component element agreement darkmode CHPFMTASK-2727 업비트 라운지 2025-10-22 */

.component-agreement.darkmode .agreement-group2 {
    border-color: var(--color-g800)
}

.component-agreement.darkmode .agreement-checkbox .input-checkbox-group.left .checkbox-txt-field {
    color: var(--txt-pri-invert) !important
}

.component-agreement.darkmode .agreement-checkbox .input-checkbox-group.left .ico-line-chevron-right-mask {
    width: 1.6rem;
    height: 2.4rem;
    background-color: rgba(255, 255, 255, 0.7)
}

.component-agreement.darkmode .checkbox-shape-circle:before {
    border-color: var(--color-g700)
}

.component-agreement.darkmode .agreement-content {
    border-color: var(--color-g800)
}

.component-agreement.darkmode .agreement-content .checkbox-txt-field {
    color: var(--txt-pri-invert)
}

/*! CHPFMTASK-2665 */

.terms-list {
    margin-top: 3rem
}

.terms-list ul li {
    font-weight: 400;
    font-size: 1.6rem;
    line-height: 2.1rem;
    color: var(--color-g800, #414141)
}

.terms-list ul li+li {
    margin-top: 1.2rem
}

.terms-list .tit {
    margin: 3.2rem 0 1.6rem;
    font-weight: 700;
    font-size: 1.6rem;
    line-height: 2.1rem
}

.terms-cont-wrap .terms-tbl .tbl-type-01 tbody tr td {
    padding: 1rem 0.5rem;
    border-top: 1px solid var(--color-g200, #eee);
    font-size: 1.5rem;
    color: var(--color-g900, #141414);
    line-height: 2.3rem
}

.terms-cont-wrap .terms-tbl .tbl-type-01 tbody tr td .td-txt {
    font-size: 1.4rem;
    color: #878787;
    line-height: 2.1rem
}

/*! component element carousel basic type */

.swiper-pagination {
    position: static;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-top: 0.8rem
}

.swiper-pagination-bullet {
    width: 0.6rem;
    height: 0.6rem
}

.swiper-pagination-bullet {
    background: var(--color-g400, #c7c7c7);
    opacity: 1
}

.swiper-pagination-bullet+.swiper-pagination-bullet {
    margin-left: 0.5rem
}

.swiper-pagination-bullet-active {
    background: var(--color-pn, #17008c)
}

.carousel-select-group.trn-carousel [class^="logo-bank"] {
    vertical-align: middle
}

.carousel-select-group.trn-carousel .btn-option i {
    margin-right: 1.2rem
}

.a11y-show-test {
    display: none
}

:root .a11y-show-test {
    display: block
}

:root .swiper-pagination-bullet {
    width: 0.8rem;
    height: 0.8rem;
    border: 1.4px solid var(--border-sec, #4d596f);
    background: var(--color-w100, #fff)
}

:root .swiper-pagination-bullet+.swiper-pagination-bullet {
    margin-left: 0.8rem
}

:root .swiper-pagination-bullet-active {
    background: var(--ico-qua-active, #4d596f)
}

:root .swiper-pagination-bullet.play {
    width: 1.2rem;
    height: 1.2rem;
    border: none;
    margin-top: -0.2rem;
    background: var(--path-solid-play) center center no-repeat;
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700);
    background-size: 7.2rem 1rem
}

:root .swiper-pagination-bullet.stop {
    width: 1.2rem;
    height: 1.2rem;
    border: none;
    margin-top: -0.2rem;
    background: var(--path-solid-pause) center center no-repeat;
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700);
    background-size: 7.2rem 1rem
}

.carousel-select-group.trn-carousel li {
    padding: 1.6rem 0
}

.carousel-select-group.trn-carousel li:first-child {
    padding-top: 0
}

.carousel-select-group.trn-carousel li+li {
    border-top: 1px solid var(--color-g200, #eee)
}

.ui-accordion-list.open .ui-accordion-cont {
    display: block
}

.ui-accordion-cont {
    display: none
}

.ui-accordion-cont .txt-group .txt:not(:first-child) {
    margin-top: 1.6rem
}

.ui-accordion-list.open .ui-accordion-cont.type2 {
    display: block;
    border-radius: 1.2rem
}

/*! component element carousel page-animation-slide, bullet(.swiper-pagination-bullet width:100%/page개수) */

.component-banner-page {
    position: relative;
    margin: 0 !important;
    padding: 0
}

.component-banner-page .swiper-slide {
    overflow-x: hidden
}

.component-banner-page .swiper-pagination {
    position: absolute;
    top: 0;
    left: 2.0rem;
    right: 2.0rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.component-banner-page .swiper-pagination .swiper-pagination-bullet {
    width: calc(20% - 4px);
    height: 4px;
    border-radius: 2px;
    overflow: hidden;
    background: var(--color-g200, #eee);
    z-index: 1;
    border: 0;
    margin-left: 0.5rem
}

.component-banner-page .swiper-pagination .swiper-pagination-bullet-active {
    background: var(--color-g200, #eee)
}

.component-banner-page .swiper-pagination .swiper-pagination-bullet .fill-item {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 2px;
    -webkit-transform: translateX(-100%);
    -ms-transform: translateX(-100%);
    transform: translateX(-100%)
}

.component-banner-page .swiper-pagination .swiper-pagination-bullet-active .fill-item {
    background: var(--color-g900, #141414);
    -webkit-animation: indicatorFill 5.0s linear forwards;
    animation: indicatorFill 5.0s linear forwards
}

.component-banner-page .swiper-pagination .swiper-pagination-bullet.filled .fill-item {
    background: var(--color-g900, #141414);
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0)
}

.component-banner-page .swiper-pagination .swiper-pagination-bullet.play {
    width: 1.2rem;
    height: 1.2rem;
    border: none;
    margin-top: -0.2rem;
    background: var(--path-solid-play) center center no-repeat;
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700);
    background-size: 7.2rem 1rem
}

.component-banner-page .swiper-pagination .swiper-pagination-bullet.stop {
    width: 1.2rem;
    height: 1.2rem;
    border: none;
    margin-top: -0.2rem;
    background: var(--path-solid-pause) center center no-repeat;
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700);
    background-size: 7.2rem 1rem
}

.component-banner-page .carousel-group .swiper-slide {
    height: auto
}

@-webkit-keyframes indicatorFill {
    0% {
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%)
    }
    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}

@keyframes indicatorFill {
    0% {
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%)
    }
    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}

.banner-page-group {
    padding-top: 4rem
}

.banner-page-group .component-text-simple {
    margin-top: 0 !important
}

.banner-page-group .title-field-page {
    font-size: 2.8rem
}

.banner-page-group .txt-guide {
    position: relative;
    height: 5rem;
    font-size: 1.8rem;
    overflow: hidden
}

.banner-page-group .txt-guide span {
    display: block;
    width: 100%;
    position: absolute;
    left: 0
}

.banner-page-group .txt-guide .active01 {
    top: 0;
    opacity: 1
}

.banner-page-group .txt-guide .active02 {
    top: -2rem;
    opacity: 0
}

.swiper-slide-active .banner-page-group .txt-guide .active01 {
    top: 0;
    -webkit-animation: ani-textDown1 0.3s ease forwards;
    animation: ani-textDown1 0.3s ease forwards;
    -webkit-animation-delay: 2.5s;
    animation-delay: 2.5s
}

.swiper-slide-active .banner-page-group .txt-guide .active02 {
    top: -2rem;
    opacity: 0;
    -webkit-animation: ani-textDown2 0.3s ease forwards;
    animation: ani-textDown2 0.3s ease forwards;
    -webkit-animation-delay: 2.5s;
    animation-delay: 2.5s
}

@-webkit-keyframes ani-textDown1 {
    0% {
        top: 0;
        opacity: 1
    }
    100% {
        top: 2rem;
        opacity: 0
    }
}

@keyframes ani-textDown1 {
    0% {
        top: 0;
        opacity: 1
    }
    100% {
        top: 2rem;
        opacity: 0
    }
}

@-webkit-keyframes ani-textDown2 {
    0% {
        top: -2rem;
        opacity: 0
    }
    100% {
        top: 0;
        opacity: 1
    }
}

@keyframes ani-textDown2 {
    0% {
        top: -2rem;
        opacity: 0
    }
    100% {
        top: 0;
        opacity: 1
    }
}

[class*="-animation-box"] {
    position: relative
}

[class*="-animation-box"] img {
    display: inline-block
}

/*! component element accordion basic type */

.accordion-group .section-tap {
    text-align: left;
    width: 100%;
    display: block;
    border-bottom: 1px solid gray;
    padding: 1rem 0;
    background: coral
}

.accordion-group .accordion-content {
    background: #a9a9a9;
    padding: 1rem
}

/*! component element accordion type01 */

.accordion-type01-group .list-item {
    text-align: left;
    width: 100%;
    display: block;
    border-bottom: 1px solid gray
}

.accordion-type01-group .accordion-content {
    background: #a9a9a9;
    padding: 1rem
}

.accordion-type01-group .accordion-tit {
    padding: 1rem 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.accordion-type01-group .section-tap {
    padding: 1rem;
    background: coral
}

/*! component element expand basic type */

.ui-expand .ui-expand-cont {
    display: none
}

.ui-expand.open .ui-expand-cont {
    display: block
}

/*! component element expand code detail type */

.folding-wrap {
    margin-top: 2.4rem;
    text-align: center
}

.folding-wrap .txt-detail {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g700, #7d7d7d);
    margin-right: 0.4rem
}

.folding-wrap .folding-box {
    margin-top: 1.6rem;
    padding: 1rem;
    border-radius: 0.8rem;
    background: var(--color-g100, #f8f8f8)
}

.folding-wrap .folding-box .txt-code {
    font-size: 1.2rem;
    line-height: 1.6rem;
    font-weight: 400;
    color: var(--color-g700, #7d7d7d)
}

.folding-wrap .folding-box .txt-code+.txt-code {
    margin-top: 0.4rem
}

.folding-wrap .btn-arrow .ico-arrow-open {
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700);
    width: 1.6rem;
    height: 1.6rem
}

.component-expand.bg-gray {
    background-color: var(--color-g100, #f8f8f8);
    padding: 1.2rem 2rem
}

.component-expand.bg-gray .folding-wrap {
    margin-top: 0
}

.component-expand.bg-gray .folding-wrap .folding-box {
    margin-top: 0;
    padding: 0.8rem 0 0
}

.component-face-wrap+.component-expand.bg-gray {
    margin-top: 1.6rem
}

/*! component element tooltip basic type */

.tooltip-group {
    display: inline-block
}

.tooltip-group .btn-tooltip {
    display: inline-block;
    position: relative;
    line-height: 1
}

:root .tooltip-group .btn-tooltip {
    top: -1px
}

.tooltip-group .btn-tooltip.open+.tooltip-area {
    display: block
}

.tooltip-group .ico-help {
    width: 1.8rem;
    height: 1.8rem
}

.tooltip-group .ico-help.w24 {
    width: 2.4rem;
    height: 2.4rem
}

.tooltip-group .tooltip-area {
    display: none;
    position: absolute;
    z-index: 2;
    left: 3.2rem;
    right: 3.2rem;
    margin-top: 0.5rem;
    white-space: normal
}

.tooltip-group .tooltip-area {
    z-index: 3
}

.tooltip-group .tooltip-area.index-ty01 {
    z-index: 83
}

.tooltip-group .tooltip-area.wide {
    left: 0.8rem;
    right: 0.8rem
}

.tooltip-group .tooltip-area .btn-tooltip-close {
    position: absolute;
    top: 0;
    right: 0;
    margin: 0
}

.tooltip-group .tooltip-box {
    position: relative;
    padding: 1.2rem 4rem 1.2rem 1.6rem;
    border-radius: 1.0rem;
    text-align: left;
    background: var(--color-pb85, #000000D8)
}

.tooltip-group .tooltip-box.white .btn-tooltip-close {
    -webkit-filter: var(--filter-g500);
    filter: var(--filter-g500)
}

:root .tooltip-group .tooltip-box.white .btn-tooltip-close {
    -webkit-filter: var(--filter-g500);
    filter: var(--filter-g500)
}

.tooltip-group .tooltip-box:not(.white) .txt:before {
    color: var(--color-w70)
}

.tooltip-group .tooltip-box.white {
    background-color: var(--color-w100, #fff);
    opacity: 1;
    -webkit-box-shadow: var(--color-comp200);
    box-shadow: var(--color-comp200)
}

.tooltip-group .tooltip-box.white .tooltip-sub-title {
    color: var(--color-g900, #141414)
}

.tooltip-group .tooltip-box.white .tooltip-sub-title .interest-tip {
    display: block;
    padding-top: 0.8rem;
    margin-top: 0.8rem;
    border-top: 1px solid var(--color-g300, #e0e0e0);
    font-size: 1.4rem;
    color: var(--color-bu700, #006aff)
}

.tooltip-group .tooltip-box.white .txt {
    color: var(--color-g600, #9b9b9b);
    font-size: 1.2rem
}

.tooltip-group .tooltip-box.white .txt:before {
    color: var(--color-g600, #9b9b9b)
}

.tooltip-group .tooltip-sub-title {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-w100, #fff)
}

.tooltip-group .tooltip-sub-title+.bl-txt-group,
.tooltip-group .tooltip-sub-title+.txt {
    margin-top: 0.8rem
}

.tooltip-group .tooltip-sub-title+.txt {
    font-size: 1.2rem;
    line-height: 1.6rem
}

.tooltip-group .tooltip-box .txt,
.tooltip-group .txt {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-w70, #fffFFFB2);
    word-break: keep-all
}

.tooltip-group .bl-txt-group>.txt+.txt,
.tooltip-group .txt+.txt {
    margin-top: 0.4rem
}

.tooltip-group .txt strong {
    font-weight: bold
}

.tooltip-group .bl-txt-group>.txt {
    font-size: 1.2rem
}

.tooltip-group .bl-txt-group>.txt.txt-lv04 {
    font-size: 1.2rem;
    line-height: 1.6rem !important
}

.input-checkbox-group+.tooltip-group,
.input-radio-group+.tooltip-group {
    margin-left: 0.6rem
}

.tooltip-area.wide.type2 {
    left: 0;
    right: 0
}

.tooltip-area.wide.type2 .tooltip-box {
    border-radius: .4rem
}

.tooltip-area.wide.type2 .tooltip-box.white .btn-tooltip-close {
    -webkit-filter: var(--filter-g900);
    filter: var(--filter-g900)
}

.tooltip-group.ty01 {
    margin-left: .2rem !important
}

.tooltip-group.ty01 .tooltip-area {
    left: 2rem
}

.tooltip-group.ty01 .tooltip-box {
    display: inline-block
}

.tooltip-group.ty01 .ico-help {
    -webkit-filter: var(--filter-ico-sec);
    filter: var(--filter-ico-sec)
}

.tooltip-group.ty01 .ico-help {
    -webkit-filter: var(--filter-ico-sec);
    filter: var(--filter-ico-sec)
}

.tooltip-group.ty02 .btn-tooltip {
    margin-left: .2rem
}

.tooltip-group.ty02 .tooltip-area {
    right: 2rem;
    text-align: right
}

.tooltip-group.ty02 .tooltip-box {
    display: inline-block;
    width: 72%;
    text-align: left
}

.tooltip-group .tooltip-area.align-top {
    -webkit-transform: translateY(calc(-100% - 2.5rem));
    -ms-transform: translateY(calc(-100% - 2.5rem));
    transform: translateY(calc(-100% - 2.5rem))
}

/*! component element tooltip point type */

.tooltip-point-group {
    position: relative
}

.tooltip-point-group.inline {
    display: inline-block
}

.tooltip-point-group .tooltip-area {
    position: absolute;
    z-index: 2;
    left: 0;
    right: 0;
    bottom: calc(100% + 1.5rem);
    background: var(--color-lm500, #69b405);
    border-radius: 1.0rem;
    padding-left: 1.6rem;
    padding-right: 1.6rem
}

.tooltip-point-group .tooltip-area:after {
    content: "";
    position: absolute;
    bottom: -0.8rem;
    left: 3.2rem;
    width: 1.8rem;
    height: 1.8rem;
    border-radius: 0.3rem;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    background: var(--color-lm500, #69b405)
}

:root .tooltip-point-group .tooltip-area {
    background: var(--bg-accent-pri)
}

:root .tooltip-point-group .tooltip-area:after {
    background: var(--bg-accent-pri);
    border-radius: 0
}

:root .tooltip-point-group .tooltip-area:after {
    background: var(--bg-accent-pri)
}

.tooltip-point-group .tooltip-area.r-auto {
    right: auto
}

.tooltip-point-group .tooltip-area.align-bottom {
    bottom: auto;
    top: calc(100% + 1.5rem)
}

.tooltip-point-group .tooltip-area.align-bottom.ty01 {
    top: calc(100% + 1.2rem);
    left: 7.8rem;
    margin-right: -1.5rem
}

.tooltip-point-group .tooltip-area.align-bottom:after {
    bottom: auto;
    top: -0.8rem
}

:root .tooltip-point-group .tooltip-area.align-bottom {
    bottom: auto;
    top: calc(100% + 1.5rem)
}

:root .tooltip-point-group .tooltip-area.align-bottom:after {
    bottom: auto;
    top: -0.8rem
}

:root .tooltip-point-group .tooltip-area.align-bottom:after {
    bottom: auto;
    top: -0.6rem
}

.tooltip-point-group .tooltip-area.align-right:after {
    left: auto;
    right: 3.2rem
}

.tooltip-point-group .tooltip-area.align-center:after {
    left: 50%;
    margin-left: -0.9rem
}

:root .tooltip-point-group .tooltip-area.align-right:after {
    left: auto;
    right: 3.2rem
}

:root .tooltip-point-group .tooltip-area.align-center:after {
    left: 50%;
    margin-left: -0.9rem
}

.tooltip-point-group .tooltip-point {
    position: relative
}

.tooltip-point-group .tooltip-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: left
}

.tooltip-point-group .tooltip-content {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    word-break: keep-all;
    padding-top: 1.2rem;
    padding-bottom: 1.2rem
}

.tooltip-point-group .tooltip-content .txt {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: bold;
    color: var(--color-w100, #fff)
}

.tooltip-point-group .tooltip-icon {
    padding: 1.2rem 1rem 1.2rem 0
}

.tooltip-point-group.bg-white .tooltip-area {
    background: var(--color-w100, #fff);
    -webkit-box-shadow: 0 5px 5px -5px var(--color-pb20, #00000033);
    box-shadow: 0 5px 5px -5px var(--color-pb20, #00000033)
}

:root .tooltip-point-group[class*="bg-"] {
    background-color: transparent !important
}

:root .tooltip-point-group.bg-white .tooltip-area {
    background: var(--color-w100, #fff);
    -webkit-box-shadow: 0 5px 5px -5px var(--color-pb20, #00000033);
    box-shadow: 0 5px 5px -5px var(--color-pb20, #00000033)
}

.tooltip-point-group.bg-white .tooltip-area:after {
    background: var(--color-w100, #fff);
    -webkit-box-shadow: 2px 2px 5px -2px var(--color-pb20, #00000033);
    box-shadow: 2px 2px 5px -2px var(--color-pb20, #00000033)
}

:root .tooltip-point-group.bg-white .tooltip-area:after {
    background: var(--color-w100, #fff);
    -webkit-box-shadow: 2px 2px 5px -2px var(--color-pb20, #00000033);
    box-shadow: 2px 2px 5px -2px var(--color-pb20, #00000033)
}

.tooltip-point-group.bg-white .tooltip-content .txt {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g900, #141414)
}

:root .tooltip-point-group.bg-white .tooltip-box {
    position: relative;
    background-color: var(--color-w100, #fff);
    z-index: 1
}

[class^="tooltip-"] .btn-tooltip-close {
    width: 4rem;
    height: 4rem;
    background-image: var(--path-line-close);
    background-size: 1.6rem;
    background-repeat: no-repeat;
    background-position: center;
    -webkit-filter: var(--filter-w100);
    filter: var(--filter-w100);
    margin-right: -1.5rem
}

[class^="tooltip-"].bg-white .btn-tooltip-close {
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

:root [class^="tooltip-"].bg-white .btn-tooltip-close {
    -webkit-filter: var(--filter-g500);
    filter: var(--filter-g500)
}

.tooltip-point-group.bg-white.bg-white-ty1 .tooltip-area {
    position: relative;
    margin-bottom: 2.4rem;
    -webkit-box-shadow: 0 2px 6px -2px var(--color-pb20, #00000033);
    box-shadow: 0 2px 6px -2px var(--color-pb20, #00000033)
}

.tooltip-point-group.bg-white.bg-white-ty1 .tooltip-box {
    position: relative;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.tooltip-point-group.bg-white.bg-white-ty1 .tooltip-box .tooltip-icon {
    position: absolute;
    left: 0;
    top: 0;
    padding: 0
}

.tooltip-point-group.bg-white.bg-white-ty1 .tooltip-box .btn-tooltip-close {
    position: absolute;
    right: 0;
    top: .5rem
}

.tooltip-point-group.bg-white.bg-white-ty1 .tooltip-sub-title {
    padding: .4rem 2.6rem .4rem 3.6rem;
    font-size: 1.4rem;
    font-weight: 700;
    line-height: 2rem
}

.tooltip-point-group.bg-white.bg-white-ty1 [class*="txt"] {
    margin-top: 1rem;
    font-size: 1.2rem;
    line-height: 1.6rem;
    word-break: break-all
}

.tooltip-point-group.bg-white.bg-white-ty1 .txt2 {
    margin-top: .4rem;
    color: var(--color-g600, #9b9b9b)
}

.tooltip-point-group .tooltip-content .txt-list-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.tooltip-point-group .tooltip-content .txt-list-wrap .txt-list {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.tooltip-point-group .tooltip-content .txt-list-wrap .txt-list .row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.tooltip-point-group .tooltip-content .txt-list-wrap .txt-list .row+.row {
    margin-top: .2rem
}

.tooltip-point-group .tooltip-content .txt-list-wrap .txt-list .area-term {
    padding-right: 1rem;
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400
}

.tooltip-point-group .tooltip-content .txt-list-wrap .txt-list .area-desc {
    font-size: 1.5rem;
    line-height: 2rem
}

.tooltip-point-group .tooltip-area .tooltip-content .txt-list-wrap .btn-arrow .txt-lv03 {
    margin-top: 0;
    opacity: .8
}

.tooltip-point-group .tooltip-area .tooltip-content .txt-list-wrap .btn-arrow .ico-arrow-link {
    margin-left: .4rem;
    -webkit-filter: var(--filter-w100);
    filter: var(--filter-w100)
}

:root .tooltip-focus-group.bg-white.type-loan {
    padding-bottom: .5rem
}

:root .tooltip-focus-group.bg-white.type-loan.align-start {
    text-align: left
}

:root .tooltip-focus-group.bg-white.type-loan.align-end {
    text-align: right
}

:root .tooltip-focus-group.bg-white.type-loan .tooltip-area {
    display: inline-block;
    -webkit-transform: translate(0);
    -ms-transform: translate(0);
    transform: translate(0);
    left: initial;
    right: initial
}

.tooltip-point-group .tooltip-area.type2.align-right:after {
    right: 1.2rem
}

.tooltip-point-group .tooltip-content .txt-list-wrap.type2 .txt-list .area-term {
    font-weight: 500
}

.tooltip-point-group .tooltip-content .txt-list-wrap.type2 .btn-arrow .txt-lv03 {
    opacity: 1
}

.tooltip-focus-group .tooltip-area.type3.align-right {
    right: 2rem !important;
    bottom: calc(100% + 3.5rem) !important
}

.tooltip-focus-group .tooltip-area.type4 {
    -webkit-transform: translateY(-1rem);
    -ms-transform: translateY(-1rem);
    transform: translateY(-1rem);
    opacity: 0;
    padding: 0 1.2rem 0;
    background: var(--color-in1000, #1728c4) !important;
    -webkit-animation: shopping-tooltip-ani 0.4s 1000ms ease-out forwards;
    animation: shopping-tooltip-ani 0.4s 1000ms ease-out forwards
}

.tooltip-focus-group .tooltip-area.type4::after {
    -webkit-filter: brightness(0) saturate(100%) invert(15%) sepia(82%) saturate(3292%) hue-rotate(234deg) brightness(95%) contrast(116%);
    filter: brightness(0) saturate(100%) invert(15%) sepia(82%) saturate(3292%) hue-rotate(234deg) brightness(95%) contrast(116%)
}

.tooltip-focus-group .tooltip-area.type4 .tooltip-icon {
    margin-right: 0.4rem
}

.tooltip-focus-group .tooltip-area.type4 .tooltip-content {
    padding: 0
}

.tooltip-focus-group .tooltip-area.type4 .tooltip-content .txt {
    font-size: 1.2rem;
    font-weight: bold;
    line-height: 1.6rem
}

@-webkit-keyframes shopping-tooltip-ani {
    0% {
        opacity: 0;
        -webkit-transform: translate(-50%, -1rem);
        transform: translate(-50%, -1rem)
    }
    10% {
        opacity: 100%
    }
    70% {
        opacity: 100%;
        -webkit-transform: translate(-50%, 0.3rem);
        transform: translate(-50%, 0.3rem)
    }
    100% {
        opacity: 100%;
        -webkit-transform: translate(-50%, 0);
        transform: translate(-50%, 0)
    }
}

@keyframes shopping-tooltip-ani {
    0% {
        opacity: 0;
        -webkit-transform: translate(-50%, -1rem);
        transform: translate(-50%, -1rem)
    }
    10% {
        opacity: 100%
    }
    70% {
        opacity: 100%;
        -webkit-transform: translate(-50%, 0.3rem);
        transform: translate(-50%, 0.3rem)
    }
    100% {
        opacity: 100%;
        -webkit-transform: translate(-50%, 0);
        transform: translate(-50%, 0)
    }
}

/*! component element tooltip point small type */

.tooltip-focus-group .tooltip-point.small .tooltip-area.align-right {
    padding: 0.1rem 0.8rem;
    background-color: var(--color-bu800, #0150ff);
    border-radius: 99rem;
    bottom: 3.4rem;
    -webkit-transform: translateX(3.2rem);
    -ms-transform: translateX(3.2rem);
    transform: translateX(3.2rem)
}

.tooltip-focus-group .tooltip-point.small .tooltip-area.align-right:after {
    width: 0.8rem;
    height: 0.4rem;
    bottom: -0.4rem;
    right: 0.8rem;
    left: inherit;
    border-radius: 0;
    z-index: -1
}

.tooltip-focus-group .tooltip-point.small .tooltip-content {
    padding: 0
}

.tooltip-focus-group .tooltip-point.small .tooltip-content .txt {
    font-size: 1.1rem;
    line-height: 1.5rem
}

/*! component element tooltip hiteen img type */

.tooltip-focus-group.btn-group.hiteen-img .hiteen-img-group {
    position: absolute;
    bottom: 0;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    padding-bottom: 12rem
}

.tooltip-focus-group.btn-group.hiteen-img .hiteen-img-group img {
    width: 15rem
}

.tooltip-focus-group.btn-group.hiteen-img .btn-lv01 {
    width: 100%
}

/*! component element tooltip focus type */

.tooltip-focus-group {
    display: inline-block;
    position: relative
}

.tooltip-focus-group .tooltip-area {
    position: absolute;
    z-index: 2;
    left: 50%;
    -webkit-transform: translateX(-4.3rem);
    -ms-transform: translateX(-4.3rem);
    transform: translateX(-4.3rem);
    bottom: calc(100% + 1.5rem);
    background: var(--color-lm500, #69b405);
    border-radius: 1.0rem;
    padding-left: 1.6rem;
    padding-right: 1.6rem
}

:root .tooltip-focus-group .tooltip-area {
    background: var(--bg-accent-pri)
}

:root .tooltip-focus-group .tooltip-area.bg-sec {
    background: var(--bg-sec-solid)
}

.tooltip-focus-group .tooltip-area:after {
    content: "";
    position: absolute;
    bottom: -0.8rem;
    left: 3.2rem;
    width: 1.8rem;
    height: 1.8rem;
    border-radius: 0.3rem;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    background: var(--color-lm500, #69b405)
}

:root .tooltip-focus-group .tooltip-area:after {
    background: var(--bg-accent-pri);
    border-radius: 0
}

:root .tooltip-focus-group .tooltip-area.bg-sec:after {
    background: var(--bg-sec-solid)
}

.tooltip-focus-group .tooltip-area.align-bottom {
    bottom: auto;
    top: calc(100% + 1.5rem)
}

.tooltip-focus-group .tooltip-area.align-bottom:after {
    bottom: auto;
    top: -0.6rem
}

.tooltip-focus-group .tooltip-area.align-center.small .tooltip-content {
    padding: 0
}

.tooltip-focus-group .tooltip-area.align-center.small .btn-tooltip-close {
    width: 1.6rem;
    height: 1.6rem;
    margin-left: .6rem;
    margin-right: auto
}

.tooltip-focus-group .tooltip-area.align-center.small::after {
    bottom: -5px;
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    width: 10px;
    height: 5px;
    border: unset
}

.tooltip-focus-group .tooltip-area.align-center.small .tooltip-content .txt {
    font-size: 1.2rem;
    line-height: 1.6rem
}

.tooltip-focus-group .tooltip-area.align-center.small.black {
    left: 51%;
    -webkit-transform: translateX(-51%);
    -ms-transform: translateX(-51%);
    transform: translateX(-51%);
    background-color: var(--color-black-pb100-op70)
}

.tooltip-focus-group .tooltip-area.align-center.small.black {
    padding: .8rem 1.2rem .8rem 1.2rem
}

.tooltip-focus-group .tooltip-area.align-center.small.black .tooltip-content {
    padding: 0
}

.tooltip-focus-group .tooltip-area.align-center.small.black .btn-tooltip-close {
    width: 1.6rem;
    height: 1.6rem;
    margin-left: .6rem;
    margin-right: auto
}

.tooltip-focus-group .tooltip-area.align-center.small.black::after {
    bottom: -5px;
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    width: 10px;
    height: 5px;
    border: unset
}

.tooltip-focus-group .tooltip-area.align-bottom.black {
    top: calc(100% + 2.8rem);
    background-color: var(--color-black-pb100-op70)
}

.tooltip-focus-group .tooltip-area.align-bottom.black {
    padding: 1.2rem 1.6rem
}

.tooltip-focus-group .tooltip-area.align-bottom.black .tooltip-content {
    padding: 0
}

.tooltip-focus-group .tooltip-area.align-bottom.black .btn-tooltip-close {
    width: 1.6rem;
    height: 1.6rem;
    margin-left: .6rem;
    margin-right: auto
}

.tooltip-focus-group .tooltip-area.align-bottom.black::after {
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
    top: -10px;
    left: 20px;
    width: 20px;
    height: 10px;
    border: unset
}

.tooltip-focus-group .tooltip-area.align-bottom.align-center.small.black {
    top: calc(100% + 1rem);
    bottom: auto;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    background-color: var(--color-black-pb100-op70);
    padding: .8rem 1.2rem .8rem 1.2rem
}

.tooltip-focus-group .tooltip-area.align-bottom.align-center.small.black .tooltip-content {
    padding: 0
}

.tooltip-focus-group .tooltip-area.align-bottom.align-center.small.black .tooltip-content .txt {
    font-size: 1.2rem;
    line-height: 1.6rem
}

.tooltip-focus-group .tooltip-area.align-bottom.align-center.small.black .btn-tooltip-close {
    width: 1.6rem;
    height: 1.6rem;
    margin-left: .6rem;
    margin-right: auto
}

.tooltip-focus-group .tooltip-area.align-bottom.align-center.small.black::after {
    top: -.5rem;
    bottom: auto;
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
    width: 10px;
    height: 5px;
    border: unset
}

.tooltip-focus-group .tooltip-area.align-bottom.align-right.small.black {
    top: calc(100% + 1rem);
    padding: .8rem 1.2rem .8rem 1.2rem;
    -webkit-transform: translateX(2.5rem);
    -ms-transform: translateX(2.5rem);
    transform: translateX(2.5rem)
}

.tooltip-focus-group .tooltip-area.align-bottom.align-right.small.black .tooltip-content .txt {
    font-size: 1.2rem;
    line-height: 1.6rem
}

.tooltip-focus-group .tooltip-area.align-bottom.align-right.small.black::after {
    top: -.5rem;
    right: 2rem;
    bottom: auto;
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
    width: 10px;
    height: 5px;
    border: unset
}

.tooltip-focus-group .tooltip-area.x-small {
    border-radius: 0.6rem
}

.tooltip-focus-group.apt-tooltip {
    position: absolute;
    left: 50%;
    top: 1.5rem
}

.tooltip-focus-group.invest-tooltip {
    position: absolute;
    left: 0;
    margin-top: 1.4rem
}

.tooltip-focus-group.invest-tooltip .tooltip-area {
    left: 0;
    -webkit-transform: unset;
    -ms-transform: unset;
    transform: unset
}

.component-list .health-care-group.type01 .health-care-list .tooltip-focus-group.invest-tooltip,
.invest-temperature-list-group.type01 .invest-temperature-list .tooltip-focus-group.invest-tooltip {
    top: 4.5rem;
    margin-top: 0
}

.tooltip-focus-group.waiting-rank {
    margin-top: 4rem
}

.tooltip-focus-group.waiting-rank .tooltip-point__img {
    width: 15.2rem;
    height: 13.9rem;
    margin: 0 auto
}

.tooltip-focus-group.waiting-rank .tooltip-area.align-center {
    -webkit-transform: unset !important;
    -ms-transform: unset !important;
    transform: unset !important
}

.tooltip-focus-group.waiting-rank .tooltip-area.small {
    display: inline-block;
    position: unset;
    bottom: unset !important;
    margin-bottom: .5rem
}

.tooltip-focus-group .tooltip-area.align-center.black {
    background-color: var(--color-black-pb100-op70)
}

.tooltip-focus-group .tooltip-area.align-center.black:after {
    background-color: var(--color-black-pb100-op70)
}

.tooltip-focus-group .tooltip-area.align-right {
    left: auto;
    right: 50%;
    -webkit-transform: translateX(4.3rem);
    -ms-transform: translateX(4.3rem);
    transform: translateX(4.3rem)
}

.tooltip-focus-group .tooltip-area.align-right:after {
    left: auto;
    right: 3.2rem
}

.tooltip-focus-group .tooltip-area.align-right.ty01:after {
    right: 2rem
}

.tooltip-focus-group .tooltip-area.align-center {
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%)
}

.tooltip-focus-group .tooltip-area.align-center:after {
    left: 50%;
    margin-left: -0.9rem
}

:root .tooltip-focus-group .tooltip-area.align-right {
    left: auto;
    right: 50%;
    -webkit-transform: translateX(4.3rem);
    -ms-transform: translateX(4.3rem);
    transform: translateX(4.3rem)
}

:root .tooltip-focus-group .tooltip-area.align-right:after {
    left: auto;
    right: 3.2rem
}

:root .tooltip-focus-group .tooltip-area.align-right.ty01:after {
    right: 2rem
}

:root .tooltip-focus-group .tooltip-area.align-center {
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%)
}

:root .tooltip-focus-group .tooltip-area.small.align-center:after {
    left: 50%;
    margin-left: -0.5rem
}

.tooltip-focus-group.btn-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.tooltip-focus-group .tooltip-point {
    position: relative
}

.tooltip-focus-group .tooltip-point .tooltip-point__img img {
    display: none;
    width: 100%
}

.tooltip-focus-group .tooltip-point .tooltip-point__img img.active {
    display: block
}

.tooltip-focus-group .tooltip-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: left
}

.tooltip-focus-group .tooltip-box.center {
    text-align: center
}

.tooltip-focus-group .tooltip-content {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    word-break: keep-all;
    padding-top: 1.2rem;
    padding-bottom: 1.2rem
}

.tooltip-focus-group .tooltip-content .txt {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: bold;
    color: var(--color-w100, #fff);
    white-space: nowrap
}

:root .tooltip-focus-group .tooltip-content .txt {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: bold;
    color: var(--color-w100, #fff);
    white-space: nowrap
}

.tooltip-focus-group .tooltip-icon {
    padding: 1.2rem 1rem 1.2rem 0
}

.tooltip-focus-group.bg-white .tooltip-area {
    background: var(--color-w100, #fff);
    -webkit-box-shadow: 0 5px 5px -5px var(--color-pb20, #00000033);
    box-shadow: 0 5px 5px -5px var(--color-pb20, #00000033)
}

:root .tooltip-focus-group[class*="bg-"] {
    background-color: transparent !important
}

:root .tooltip-focus-group.bg-white .tooltip-area {
    border-radius: 1rem;
    background: var(--color-w100, #fff);
    -webkit-box-shadow: 0 5px 5px -5px var(--color-pb20, #00000033);
    box-shadow: 0 5px 5px -5px var(--color-pb20, #00000033)
}

.tooltip-focus-group.bg-white .tooltip-area:after {
    background: var(--color-w100, #fff);
    -webkit-box-shadow: 2px 2px 5px -2px var(--color-pb20, #00000033);
    box-shadow: 2px 2px 5px -2px var(--color-pb20, #00000033)
}

:root .tooltip-focus-group.bg-white .tooltip-area:after {
    background: var(--color-w100, #fff);
    -webkit-box-shadow: 2px 2px 5px -2px var(--color-pb20, #00000033);
    box-shadow: 2px 2px 5px -2px var(--color-pb20, #00000033)
}

.tooltip-focus-group.bg-white .tooltip-content .txt {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g900, #141414)
}

.tooltip-focus-group.bg-white .tooltip-box {
    position: relative;
    background-color: var(--color-w100, #fff);
    z-index: 1
}

:root .tooltip-focus-group.bg-white .tooltip-content .txt {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g900, #141414)
}

:root .tooltip-focus-group.bg-white .tooltip-box {
    position: relative;
    background-color: var(--color-w100, #fff);
    z-index: 1
}

.btn-lv01.primary1:disabled .tooltip-area .tooltip-content .txt {
    color: var(--color-w100, #fff)
}

.tooltip-focus-group.tooltip-quiz {
    position: absolute;
    top: 4.8rem;
    right: 4.8rem
}

.tooltip-focus-group.tooltip-quiz .tooltip-area.align-bottom {
    top: calc(100% + 0.5rem);
    right: 2.6rem
}

.page-inner-scroll.ishidechild .tooltip-focus-group.tooltip-quiz {
    display: none
}

:root .tooltip-focus-group .tooltip-area,
:root .tooltip-point-group .tooltip-area {
    padding: 1.2rem 1.6rem;
    bottom: calc(100% + 1.4rem)
}

:root .tooltip-focus-group .tooltip-area.align-bottom,
:root .tooltip-point-group .tooltip-area.align-bottom {
    bottom: auto;
    top: calc(100% + 1.4rem)
}

:root .tooltip-focus-group .tooltip-area.small,
:root .tooltip-point-group .tooltip-area.small {
    padding: 0.8rem 1.6rem;
    bottom: calc(100% + 0.9rem)
}

:root .tooltip-focus-group .tooltip-area.x-small {
    padding: 0.5rem 1rem
}

:root .tooltip-focus-group .tooltip-area.small.align-bottom,
:root .tooltip-focus-group .tooltip-area.x-small.align-bottom,
:root .tooltip-point-group .tooltip-area.small.align-bottom {
    bottom: auto;
    top: calc(100% + 0.9rem)
}

:root .tooltip-focus-group .tooltip-area .tooltip-box,
:root .tooltip-focus-group .tooltip-area .tooltip-content,
:root .tooltip-focus-group .tooltip-area .tooltip-icon,
:root .tooltip-point-group .tooltip-area .tooltip-box,
:root .tooltip-point-group .tooltip-area .tooltip-content,
:root .tooltip-point-group .tooltip-area .tooltip-icon {
    padding: 0
}

:root .tooltip-focus-group.bg-white .tooltip-area,
:root .tooltip-point-group.bg-white .tooltip-area {
    -webkit-filter: drop-shadow(0 2px 6px rgba(0, 0, 0, 0.12));
    filter: drop-shadow(0 2px 6px rgba(0, 0, 0, 0.12));
    -webkit-box-shadow: none;
    box-shadow: none
}

:root .tooltip-focus-group.bg-black .tooltip-area,
:root .tooltip-point-group.bg-black .tooltip-area {
    background-color: var(--color-black-pb100-op70)
}

:root .tooltip-focus-group .tooltip-area::after,
:root .tooltip-point-group .tooltip-area::after {
    border: unset;
    background-repeat: no-repeat;
    background-position: 0 0;
    bottom: -10px;
    width: 20px;
    height: 10px;
    -webkit-transform: rotate(0) translateZ(0);
    transform: rotate(0) translateZ(0);
    -webkit-mask-image: var(--path-component-tooltip-anchor_default_default);
    mask-image: var(--path-component-tooltip-anchor_default_default);
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: contain;
    mask-size: contain
}

:root .tooltip-focus-group .tooltip-area.align-bottom::after,
:root .tooltip-point-group .tooltip-area.align-bottom::after {
    bottom: auto;
    top: -10px;
    -webkit-transform: rotate(180deg) translateZ(0);
    transform: rotate(180deg) translateZ(0)
}

:root .tooltip-focus-group.bg-white .tooltip-area::after,
:root .tooltip-point-group.bg-white .tooltip-area::after {
    background-color: var(--color-w100);
    -webkit-box-shadow: none;
    box-shadow: none
}

:root .tooltip-focus-group.bg-black .tooltip-area::after,
:root .tooltip-point-group.bg-black .tooltip-area::after {
    background-color: var(--color-black-pb100-op70)
}

:root .tooltip-focus-group .tooltip-area.small::after,
:root .tooltip-focus-group .tooltip-area.x-small::after,
:root .tooltip-point-group .tooltip-area.small::after {
    bottom: -5px;
    width: 10px;
    height: 5px;
    margin-left: -0.5rem;
    -webkit-mask-image: var(--path-component-tooltip-anchor_small_default);
    mask-image: var(--path-component-tooltip-anchor_small_default);
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: contain;
    mask-size: contain
}

:root .tooltip-focus-group.bg-white .tooltip-area.small::after,
:root .tooltip-point-group.bg-white .tooltip-area.small::after {
    background-color: var(--color-w100)
}

:root .tooltip-focus-group.bg-black .tooltip-area.small::after,
:root .tooltip-point-group.bg-black .tooltip-area.small::after {
    background-color: var(--color-black-pb100-op70)
}

:root .tooltip-focus-group .tooltip-area.align-bottom.small::after,
:root .tooltip-focus-group .tooltip-area.align-bottom.x-small::after,
:root .tooltip-point-group .tooltip-area.align-bottom.small::after {
    top: -5px
}

:root .tooltip-focus-group .tooltip-area .tooltip-icon,
:root .tooltip-point-group .tooltip-area .tooltip-icon {
    margin-right: 1rem
}

:root .tooltip-focus-group .tooltip-area.small .tooltip-icon,
:root .tooltip-point-group .tooltip-area.small .tooltip-icon {
    margin-right: 0.8rem
}

:root .tooltip-focus-group .btn-tooltip-close,
:root .tooltip-point-group .btn-tooltip-close {
    width: 1.6rem;
    height: 1.6rem;
    margin-left: 1rem;
    margin-right: auto
}

:root .tooltip-focus-group.bg-black .btn-tooltip-close,
:root .tooltip-point-group.bg-black .btn-tooltip-close {
    opacity: 0.7
}

:root .tooltip-focus-group .tooltip-area.small .btn-tooltip-close,
:root .tooltip-point-group .tooltip-area.small .btn-tooltip-close {
    margin-left: 0.8rem
}

:root .tooltip-focus-group .tooltip-area.small .tooltip-content .txt,
:root .tooltip-focus-group .tooltip-area.x-small .tooltip-content .txt,
:root .tooltip-point-group .tooltip-area.small .tooltip-content .txt {
    font-size: 1.2rem;
    line-height: 1.6rem
}

:root .tooltip-focus-group .tooltip-area.x-small .tooltip-content .txt {
    font-size: 1.2rem;
    line-height: 1.6rem;
    padding: 0;
    font-weight: 500;
    color: var(--txt-accent-sec)
}

/*! component element tooltip 닫기버튼 있는 버튼 중앙정렬 작은 툴팁 CHPFMTASK-1363 FPMLON1000000700S_M03 */

.tooltip-point.type01 {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    margin-bottom: -2.4rem
}

/*! component element tooltip 미션배너 ios/and 문구 분기 */

.android .tooltip-focus-group .tooltip-content .ios {
    display: none
}

.ios .tooltip-focus-group .tooltip-content .and {
    display: none
}

/*! component element tooltip focus type - 홈_혜택 */

.tooltip-focus-group.tooltip-benefit {
    display: block
}

.tooltip-focus-group.tooltip-benefit .tooltip-area.align-bottom {
    bottom: auto;
    top: 1.6rem
}

.tooltip-focus-group.tooltip-benefit .tooltip-area.align-bottom:after {
    bottom: auto;
    top: -0.8rem
}

.tooltip-focus-group.tooltip-benefit .tooltip-area.align-right {
    left: auto;
    right: 50%;
    -webkit-transform: translateX(4.1rem);
    -ms-transform: translateX(4.1rem);
    transform: translateX(4.1rem)
}

.tooltip-focus-group.tooltip-benefit .tooltip-area.align-right:after {
    left: auto;
    right: 3.2rem
}

.tooltip-focus-group.tooltip-benefit .tooltip-content {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    word-break: keep-all
}

.tooltip-focus-group.tooltip-benefit .tooltip-content .txt {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: bold;
    color: var(--color-w100, #fff);
    width: 21rem;
    white-space: normal
}

:root .tooltip-focus-group.tooltip-benefit .tooltip-content .txt {
    position: relative
}

.scroll-tooltip .tooltip-area {
    display: none
}

.scroll-tooltip.scrollAni .tooltip-area {
    display: block;
    -webkit-animation: tooltip-fadeShow 0.3s linear forwards;
    animation: tooltip-fadeShow 0.3s linear forwards
}

@-webkit-keyframes tooltip-fadeShow {
    0% {
        opacity: 0;
        -webkit-transform: translate(-50%, 10px);
        transform: translate(-50%, 10px)
    }
    100% {
        opacity: 1;
        -webkit-transform: translate(-50%, 0);
        transform: translate(-50%, 0)
    }
}

@keyframes tooltip-fadeShow {
    0% {
        opacity: 0;
        -webkit-transform: translate(-50%, 10px);
        transform: translate(-50%, 10px)
    }
    100% {
        opacity: 1;
        -webkit-transform: translate(-50%, 0);
        transform: translate(-50%, 0)
    }
}

.tooltip-focus-group.type01 .tooltip-area.align-right-end {
    left: auto;
    right: 0;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none
}

.tooltip-focus-group.type01 .tooltip-area:after {
    width: 12px;
    height: 6px;
    bottom: -6px;
    left: initial;
    right: 2rem;
    background-size: 100% auto
}

.tooltip-focus-group.type01 .tooltip-content .txt {
    font-size: 1.2rem;
    line-height: 1.6rem;
    padding: .2rem 0
}

.tooltip-focus-group.type01 .tooltip-area {
    padding: 0.7rem 1.2rem;
    bottom: calc(100% + .7rem)
}

.tooltip-focus-group.type01 .tooltip-content {
    padding: .7rem 0
}

.tooltip-focus-group .tooltip-area.align-left-end {
    left: 0;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0)
}

.tooltip-focus-group.static-right-type .tooltip-area {
    position: relative;
    left: auto;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none
}

.card-row-txt .row-txt-info+.tooltip-focus-group.static-right-type {
    margin-top: 0.6rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    -webkit-box-pack: right;
    -ms-flex-pack: right;
    justify-content: right
}

.tooltip-point-group.bg-sky .tooltip-area {
    background: #edf0fc;
    padding: 2rem
}

.tooltip-point-group.bg-sky .tooltip-area::after {
    left: 2.2rem;
    background-image: url("../../img/mmk/common/anchor_small_sky.png");
    background-color: transparent
}

.tooltip-point-group.bg-sky .tooltip-content .txt {
    font-weight: 400
}

/*!  component element tooltip tipbox basic type */

.tipbox-group {
    width: 100%
}

.tipbox-group .tooltip-area {
    background: var(--color-cg500, #e6ebf5);
    border-radius: 1.2rem;
    padding-left: 1.6rem;
    padding-right: 1.6rem
}

.tipbox-group .tooltip-icon {
    padding: 1.2rem 1rem 1.2rem 0
}

.tipbox-group .tooltip-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.tipbox-group .tooltip-content {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    padding-top: 1.2rem;
    padding-bottom: 1.2rem
}

.tipbox-group .tooltip-content .txt-sub {
    font-size: 1.2rem;
    line-height: 1.6rem;
    font-weight: 400;
    color: var(--color-g900, #141414)
}

.tipbox-group .tooltip-content .txt {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: bold;
    color: var(--color-g900, #141414)
}

.tipbox-group .btn-tooltip-close {
    -webkit-filter: var(--filter-g800);
    filter: var(--filter-g800)
}

.tipbox-group .tooltip-area.blue {
    position: relative;
    background: #5473fc;
    border-radius: 1.6rem;
    padding-left: 2rem;
    padding-right: 2rem
}

.tipbox-group .tooltip-area.blue * {
    color: var(--color-w100, #fff) !important
}

.tipbox-group .tooltip-area.blue .tooltip-box {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.tipbox-group .tooltip-area.blue .tooltip-content {
    padding-top: 1.6rem;
    padding-bottom: 1.6rem
}

.tipbox-group .tooltip-area.blue .tooltip-content .txt {
    margin-top: .4rem;
    font-size: 1.5rem;
    font-weight: normal;
    opacity: 0.8
}

.tipbox-group .tooltip-area.blue .btn-tooltip-close {
    -webkit-filter: var(--filter-w100);
    filter: var(--filter-w100);
    margin-top: 0.4rem
}

.tipbox-group .tooltip-area.type2 {
    background: var(--bg-qua)
}

.tipbox-group .tooltip-area.type2 .tooltip-icon {
    padding-right: 0.6rem
}

.tipbox-group .tooltip-area.type2 .tooltip-icon .ico-loan2 {
    -webkit-filter: var(--filter-in700);
    filter: var(--filter-in700)
}

.tipbox-group .tooltip-area.type2 .tooltip-content .txt {
    font-size: 1.5rem;
    font-weight: 500;
    color: var(--txt-sec)
}

.tipbox-group .tooltip-area.type5 {
    background: var(--bg-sec)
}

.tipbox-group .tooltip-area.type5 .tit {
    font-size: 1.4rem;
    font-weight: 700;
    line-height: 2rem;
    color: var(--txt-pri);
    text-align: center
}

.tipbox-group .tooltip-area.type5 .tit+.txt {
    margin-top: .2rem
}

.tipbox-group .tooltip-area.type5 .txt {
    font-size: 1.2rem;
    font-weight: 400;
    line-height: 1.6rem;
    color: var(--txt-pri);
    text-align: center
}

.tipbox-group .tooltip-area.type6 {
    background: var(--bg-ter);
    width: 27.6rem;
    margin-left: auto;
    margin-right: auto
}

.tipbox-group .tooltip-area.type6 .txt {
    font-size: 1.4rem;
    font-weight: 500;
    line-height: 2rem;
    color: var(--txt-qua);
    text-align: center
}

/*! component element chatbot */

.btn-chatbot {
    position: fixed;
    z-index: 150;
    right: 2.4rem;
    bottom: 9.2rem;
    width: 6rem;
    height: 6rem;
    background-color: var(--color-pl, #b6f23d);
    border-radius: 99rem;
    border-bottom-right-radius: 0;
    -webkit-box-shadow: var(--color-comp200);
    box-shadow: var(--color-comp200);
    -webkit-animation: wiggle 2.5s infinite linear;
    animation: wiggle 2.5s infinite linear;
    -webkit-animation-delay: 2s;
    animation-delay: 2s;
    -webkit-animation-iteration-count: 2;
    animation-iteration-count: 2
}

:root .btn-chatbot {
    background-color: var(--bg-highlight, #b6f23d)
}

.btn-chatbot .ico-chatbot {
    position: relative;
    border-radius: 0;
    width: 5rem;
    height: 2rem;
    -webkit-box-shadow: none;
    box-shadow: none;
    background-color: transparent;
    -webkit-animation: none;
    animation: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='60'%3E%3Cpath fill='%2317008c' d='M26.167 31.167c0-2.167-1.467-3.734-3.5-3.734-.734 0-1.434.267-1.934.734l-.166.166v-3.7h-2v6.4c0 2.4 1.433 3.867 3.733 3.867 2.233 0 3.867-1.567 3.867-3.733zm-3.834 1.9c-1.033 0-1.9-.867-1.9-1.9 0-1.034.867-1.9 1.9-1.9 1.034 0 1.9.866 1.9 1.9 0 1.066-.833 1.9-1.9 1.9zM17.8 24.633h-2.567L11.3 29.2v-4.567h-2v10.034h2v-4.534l4.033 4.534H17.9l-4.433-5.034zM50.933 27.7h-2.2l-2.566 3v-6.067h-2v10.034h2v-3.034l2.566 3.034h2.2L48 31.167zm-10.666-.233c-1.234 0-2 .566-2.334.966V27.7H36v6.967h2v-3.8c0-.934.667-1.6 1.5-1.6s1.5.666 1.5 1.6v3.8h2v-4.4c-.033-1.634-1.233-2.8-2.733-2.8zM30.633 34.9c1.467 0 2.234-1.067 2.234-1.067l.1-.166v1h1.8v-3.5c0-2.167-1.634-3.734-3.867-3.734S27.067 29 27.067 31.167c.033 2.166 1.5 3.733 3.566 3.733zM31 29.267c1.033 0 1.9.866 1.9 1.9 0 1.033-.867 1.9-1.9 1.9s-1.9-.867-1.9-1.9c0-1.034.833-1.9 1.9-1.9z'/%3E%3C/svg%3E");
    background-size: inherit;
    background-position: center center
}

.btn-chatbot .chatbot-reply {
    display: none;
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    font-weight: 700;
    color: var(--color-g900, #141414);
    padding: 0 2rem;
    max-width: 30rem;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap
}

.btn-chatbot .chatbot-start {
    display: none;
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g900, #141414);
    padding: 0 2rem;
    max-width: 30rem;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap
}

.btn-chatbot.on .ico-chatbot {
    left: 1px;
    left: -9999px;
    width: 0.6rem;
    height: 0.6rem;
    border-radius: 50%;
    background-color: var(--color-pn, #17008c);
    color: var(--color-pn, #17008c);
    -webkit-box-shadow: 9987px 0 0 0 var(--color-pn, #17008c), 10000px 0 0 0 var(--color-pn, #17008c), 10013px 0 0 0 var(--color-pn, #17008c);
    box-shadow: 9987px 0 0 0 var(--color-pn, #17008c), 10000px 0 0 0 var(--color-pn, #17008c), 10013px 0 0 0 var(--color-pn, #17008c);
    -webkit-animation: dotTyping 1.5s infinite ease-out;
    animation: dotTyping 1.5s infinite ease-out;
    -webkit-animation-delay: 1s;
    animation-delay: 1s
}

.btn-chatbot.on .chatbot-start {
    display: none
}

.btn-chatbot.ing {
    width: auto;
    border-top-left-radius: 4rem;
    border-top-right-radius: 4rem;
    border-bottom-left-radius: 4rem;
    -webkit-animation: reply-animation 0.7s 1 cubic-bezier(0.25, 0.46, 0.45, 0.94);
    animation: reply-animation 0.7s 1 cubic-bezier(0.25, 0.46, 0.45, 0.94);
    -webkit-animation-delay: 0;
    animation-delay: 0
}

.btn-chatbot.ing .ico-chatbot {
    display: none
}

.btn-chatbot.ing .chatbot-reply {
    display: block
}

@-webkit-keyframes reply-animation {
    0% {
        min-width: 6rem;
        max-width: 0
    }
    100% {
        max-width: 30rem
    }
}

@keyframes reply-animation {
    0% {
        min-width: 6rem;
        max-width: 0
    }
    100% {
        max-width: 30rem
    }
}

@-webkit-keyframes wiggle {
    0%,
    7% {
        -webkit-transform: rotateZ(0);
        transform: rotateZ(0)
    }
    15% {
        -webkit-transform: rotateZ(-15deg);
        transform: rotateZ(-15deg)
    }
    20% {
        -webkit-transform: rotateZ(10deg);
        transform: rotateZ(10deg)
    }
    25% {
        -webkit-transform: rotateZ(-10deg);
        transform: rotateZ(-10deg)
    }
    30% {
        -webkit-transform: rotateZ(6deg);
        transform: rotateZ(6deg)
    }
    35% {
        -webkit-transform: rotateZ(-4deg);
        transform: rotateZ(-4deg)
    }
    100%,
    40% {
        -webkit-transform: rotateZ(0);
        transform: rotateZ(0)
    }
}

@keyframes wiggle {
    0%,
    7% {
        -webkit-transform: rotateZ(0);
        transform: rotateZ(0)
    }
    15% {
        -webkit-transform: rotateZ(-15deg);
        transform: rotateZ(-15deg)
    }
    20% {
        -webkit-transform: rotateZ(10deg);
        transform: rotateZ(10deg)
    }
    25% {
        -webkit-transform: rotateZ(-10deg);
        transform: rotateZ(-10deg)
    }
    30% {
        -webkit-transform: rotateZ(6deg);
        transform: rotateZ(6deg)
    }
    35% {
        -webkit-transform: rotateZ(-4deg);
        transform: rotateZ(-4deg)
    }
    100%,
    40% {
        -webkit-transform: rotateZ(0);
        transform: rotateZ(0)
    }
}

@-webkit-keyframes dotTyping {
    0% {
        -webkit-box-shadow: 9987px 0 0 0 var(--color-pn, #17008c), 10000px 0 0 0 var(--color-pn, #17008c), 10013px 0 0 0 var(--color-pn, #17008c);
        box-shadow: 9987px 0 0 0 var(--color-pn, #17008c), 10000px 0 0 0 var(--color-pn, #17008c), 10013px 0 0 0 var(--color-pn, #17008c)
    }
    16.667% {
        -webkit-box-shadow: 9987px -7px 0 0 var(--color-pn, #17008c), 10000px 0 0 0 var(--color-pn, #17008c), 10013px 0 0 0 var(--color-pn, #17008c);
        box-shadow: 9987px -7px 0 0 var(--color-pn, #17008c), 10000px 0 0 0 var(--color-pn, #17008c), 10013px 0 0 0 var(--color-pn, #17008c)
    }
    33.333% {
        -webkit-box-shadow: 9987px 0 0 0 var(--color-pn, #17008c), 10000px 0 0 0 var(--color-pn, #17008c), 10013px 0 0 0 var(--color-pn, #17008c);
        box-shadow: 9987px 0 0 0 var(--color-pn, #17008c), 10000px 0 0 0 var(--color-pn, #17008c), 10013px 0 0 0 var(--color-pn, #17008c)
    }
    50% {
        -webkit-box-shadow: 9987px 0 0 0 var(--color-pn, #17008c), 10000px -7px 0 0 var(--color-pn, #17008c), 10013px 0 0 0 var(--color-pn, #17008c);
        box-shadow: 9987px 0 0 0 var(--color-pn, #17008c), 10000px -7px 0 0 var(--color-pn, #17008c), 10013px 0 0 0 var(--color-pn, #17008c)
    }
    66.667% {
        -webkit-box-shadow: 9987px 0 0 0 var(--color-pn, #17008c), 10000px 0 0 0 var(--color-pn, #17008c), 10013px 0 0 0 var(--color-pn, #17008c);
        box-shadow: 9987px 0 0 0 var(--color-pn, #17008c), 10000px 0 0 0 var(--color-pn, #17008c), 10013px 0 0 0 var(--color-pn, #17008c)
    }
    83.333% {
        -webkit-box-shadow: 9987px 0 0 0 var(--color-pn, #17008c), 10000px 0 0 0 var(--color-pn, #17008c), 10013px -7px 0 0 var(--color-pn, #17008c);
        box-shadow: 9987px 0 0 0 var(--color-pn, #17008c), 10000px 0 0 0 var(--color-pn, #17008c), 10013px -7px 0 0 var(--color-pn, #17008c)
    }
    100% {
        -webkit-box-shadow: 9987px 0 0 0 var(--color-pn, #17008c), 10000px 0 0 0 var(--color-pn, #17008c), 10013px 0 0 0 var(--color-pn, #17008c);
        box-shadow: 9987px 0 0 0 var(--color-pn, #17008c), 10000px 0 0 0 var(--color-pn, #17008c), 10013px 0 0 0 var(--color-pn, #17008c)
    }
}

@keyframes dotTyping {
    0% {
        -webkit-box-shadow: 9987px 0 0 0 var(--color-pn, #17008c), 10000px 0 0 0 var(--color-pn, #17008c), 10013px 0 0 0 var(--color-pn, #17008c);
        box-shadow: 9987px 0 0 0 var(--color-pn, #17008c), 10000px 0 0 0 var(--color-pn, #17008c), 10013px 0 0 0 var(--color-pn, #17008c)
    }
    16.667% {
        -webkit-box-shadow: 9987px -7px 0 0 var(--color-pn, #17008c), 10000px 0 0 0 var(--color-pn, #17008c), 10013px 0 0 0 var(--color-pn, #17008c);
        box-shadow: 9987px -7px 0 0 var(--color-pn, #17008c), 10000px 0 0 0 var(--color-pn, #17008c), 10013px 0 0 0 var(--color-pn, #17008c)
    }
    33.333% {
        -webkit-box-shadow: 9987px 0 0 0 var(--color-pn, #17008c), 10000px 0 0 0 var(--color-pn, #17008c), 10013px 0 0 0 var(--color-pn, #17008c);
        box-shadow: 9987px 0 0 0 var(--color-pn, #17008c), 10000px 0 0 0 var(--color-pn, #17008c), 10013px 0 0 0 var(--color-pn, #17008c)
    }
    50% {
        -webkit-box-shadow: 9987px 0 0 0 var(--color-pn, #17008c), 10000px -7px 0 0 var(--color-pn, #17008c), 10013px 0 0 0 var(--color-pn, #17008c);
        box-shadow: 9987px 0 0 0 var(--color-pn, #17008c), 10000px -7px 0 0 var(--color-pn, #17008c), 10013px 0 0 0 var(--color-pn, #17008c)
    }
    66.667% {
        -webkit-box-shadow: 9987px 0 0 0 var(--color-pn, #17008c), 10000px 0 0 0 var(--color-pn, #17008c), 10013px 0 0 0 var(--color-pn, #17008c);
        box-shadow: 9987px 0 0 0 var(--color-pn, #17008c), 10000px 0 0 0 var(--color-pn, #17008c), 10013px 0 0 0 var(--color-pn, #17008c)
    }
    83.333% {
        -webkit-box-shadow: 9987px 0 0 0 var(--color-pn, #17008c), 10000px 0 0 0 var(--color-pn, #17008c), 10013px -7px 0 0 var(--color-pn, #17008c);
        box-shadow: 9987px 0 0 0 var(--color-pn, #17008c), 10000px 0 0 0 var(--color-pn, #17008c), 10013px -7px 0 0 var(--color-pn, #17008c)
    }
    100% {
        -webkit-box-shadow: 9987px 0 0 0 var(--color-pn, #17008c), 10000px 0 0 0 var(--color-pn, #17008c), 10013px 0 0 0 var(--color-pn, #17008c);
        box-shadow: 9987px 0 0 0 var(--color-pn, #17008c), 10000px 0 0 0 var(--color-pn, #17008c), 10013px 0 0 0 var(--color-pn, #17008c)
    }
}

@-webkit-keyframes dotCarousel {
    0% {
        -webkit-box-shadow: 9987px 0 0 -1px var(--color-pn, #17008c), 10000px 0 0 1px var(--color-pn, #17008c), 10013px 0 0 -1px var(--color-pn, #17008c);
        box-shadow: 9987px 0 0 -1px var(--color-pn, #17008c), 10000px 0 0 1px var(--color-pn, #17008c), 10013px 0 0 -1px var(--color-pn, #17008c)
    }
    50% {
        -webkit-box-shadow: 10013px 0 0 -1px var(--color-pn, #17008c), 9987px 0 0 -1px var(--color-pn, #17008c), 10000px 0 0 1px var(--color-pn, #17008c);
        box-shadow: 10013px 0 0 -1px var(--color-pn, #17008c), 9987px 0 0 -1px var(--color-pn, #17008c), 10000px 0 0 1px var(--color-pn, #17008c)
    }
    100% {
        -webkit-box-shadow: 10000px 0 0 1px var(--color-pn, #17008c), 10013px 0 0 -1px var(--color-pn, #17008c), 9987px 0 0 -1px var(--color-pn, #17008c);
        box-shadow: 10000px 0 0 1px var(--color-pn, #17008c), 10013px 0 0 -1px var(--color-pn, #17008c), 9987px 0 0 -1px var(--color-pn, #17008c)
    }
}

@keyframes dotCarousel {
    0% {
        -webkit-box-shadow: 9987px 0 0 -1px var(--color-pn, #17008c), 10000px 0 0 1px var(--color-pn, #17008c), 10013px 0 0 -1px var(--color-pn, #17008c);
        box-shadow: 9987px 0 0 -1px var(--color-pn, #17008c), 10000px 0 0 1px var(--color-pn, #17008c), 10013px 0 0 -1px var(--color-pn, #17008c)
    }
    50% {
        -webkit-box-shadow: 10013px 0 0 -1px var(--color-pn, #17008c), 9987px 0 0 -1px var(--color-pn, #17008c), 10000px 0 0 1px var(--color-pn, #17008c);
        box-shadow: 10013px 0 0 -1px var(--color-pn, #17008c), 9987px 0 0 -1px var(--color-pn, #17008c), 10000px 0 0 1px var(--color-pn, #17008c)
    }
    100% {
        -webkit-box-shadow: 10000px 0 0 1px var(--color-pn, #17008c), 10013px 0 0 -1px var(--color-pn, #17008c), 9987px 0 0 -1px var(--color-pn, #17008c);
        box-shadow: 10000px 0 0 1px var(--color-pn, #17008c), 10013px 0 0 -1px var(--color-pn, #17008c), 9987px 0 0 -1px var(--color-pn, #17008c)
    }
}

.popup-content .row-survey-group {
    margin-top: 0;
    padding: 1.4rem
}

.popup-content .row-survey-group .survey-input {
    margin-bottom: 0.4rem
}

.popup-content .row-survey-group .survey-input label {
    margin: 0 1rem
}

.chatbot-intro {
    display: none
}

.btn-chatbot.type2 {
    -webkit-animation: none;
    animation: none
}

.btn-chatbot.intro,
.btn-chatbot.intro2 {
    width: auto;
    border-top-left-radius: 4rem;
    border-top-right-radius: 4rem;
    border-bottom-left-radius: 4rem;
    -webkit-animation: reply-animation 0.7s 1 cubic-bezier(0.25, 0.46, 0.45, 0.94);
    animation: reply-animation 0.7s 1 cubic-bezier(0.25, 0.46, 0.45, 0.94);
    -webkit-animation-delay: 0;
    animation-delay: 0
}

.btn-chatbot.intro .ico-chatbot,
.btn-chatbot.intro2 .ico-chatbot {
    display: none
}

.btn-chatbot.intro .chatbot-intro,
.btn-chatbot.intro2 .chatbot-reply {
    display: block
}

.btn-chatbot .chatbot-intro {
    display: none;
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    font-weight: 700;
    color: var(--color-g900, #141414);
    padding: 0 2rem;
    max-width: 30rem;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap
}

.btn-chatbot.on-dot .ico-chatbot {
    left: 1px;
    left: -9999px;
    width: 0.6rem;
    height: 0.6rem;
    border-radius: 50%;
    background-color: var(--color-pn, #17008c);
    color: var(--color-pn, #17008c);
    -webkit-box-shadow: 9987px 0 0 0 var(--color-pn, #17008c), 10000px 0 0 0 var(--color-pn, #17008c), 10013px 0 0 0 var(--color-pn, #17008c);
    box-shadow: 9987px 0 0 0 var(--color-pn, #17008c), 10000px 0 0 0 var(--color-pn, #17008c), 10013px 0 0 0 var(--color-pn, #17008c);
    -webkit-animation: dotTyping 1.5s infinite ease-out;
    animation: dotTyping 1.5s infinite ease-out;
    -webkit-animation-delay: 1s;
    animation-delay: 1s
}

.btn-chatbot.on-dot .chatbot-start {
    display: none
}

.chatbot-wrap {
    position: fixed;
    right: 2rem;
    bottom: 7.6rem;
    z-index: 83;
    -webkit-transition: all ease-out .5s;
    -o-transition: all ease-out .5s;
    transition: all ease-out .5s
}

.chatbot-wrap .chatbot-robot-default {
    position: relative;
    display: block;
    width: 4.8rem;
    height: 4.8rem;
    border-radius: 99rem;
    background-color: var(--color-grey-g1000);
    overflow: hidden
}

.chatbot-wrap .chatbot-robot-default .chatbot_wink {
    position: absolute;
    top: 0;
    left: 0;
    width: 4.8rem;
    height: 4.8rem;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0)
}

.chatbot-wrap .chatbot-robot-default .txt {
    position: absolute;
    top: 0;
    left: 0;
    width: 4.8rem;
    text-align: center;
    line-height: 4.8rem;
    font-size: 2rem;
    line-height: 4.8rem;
    font-weight: 500;
    color: var(--txt-pri-invert);
    -webkit-transform: translateX(4.8rem);
    -ms-transform: translateX(4.8rem);
    transform: translateX(4.8rem)
}

.chatbot-wrap .chatbot-robot-default.active .chatbot_wink {
    -webkit-animation: ani-bot 7s linear infinite;
    animation: ani-bot 7s linear infinite
}

.chatbot-wrap .chatbot-robot-default.active .txt {
    -webkit-animation: ani-txt 7s linear infinite;
    animation: ani-txt 7s linear infinite
}

@-webkit-keyframes ani-txt {
    0% {
        -webkit-transform: translateX(48px);
        transform: translateX(48px)
    }
    47.15% {
        -webkit-transform: translateX(48px);
        transform: translateX(48px)
    }
    50% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    97.15% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    100% {
        -webkit-transform: translateX(-48px);
        transform: translateX(-48px)
    }
}

@keyframes ani-txt {
    0% {
        -webkit-transform: translateX(48px);
        transform: translateX(48px)
    }
    47.15% {
        -webkit-transform: translateX(48px);
        transform: translateX(48px)
    }
    50% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    97.15% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    100% {
        -webkit-transform: translateX(-48px);
        transform: translateX(-48px)
    }
}

@-webkit-keyframes ani-bot {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    47.15% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    50% {
        -webkit-transform: translateX(-48px);
        transform: translateX(-48px);
        opacity: 1
    }
    50.1% {
        -webkit-transform: translateX(48px);
        transform: translateX(48px);
        opacity: 0
    }
    97.15% {
        -webkit-transform: translateX(48px);
        transform: translateX(48px);
        opacity: 1
    }
    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}

@keyframes ani-bot {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    47.15% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    50% {
        -webkit-transform: translateX(-48px);
        transform: translateX(-48px);
        opacity: 1
    }
    50.1% {
        -webkit-transform: translateX(48px);
        transform: translateX(48px);
        opacity: 0
    }
    97.15% {
        -webkit-transform: translateX(48px);
        transform: translateX(48px);
        opacity: 1
    }
    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}

.chatbot-wrap .chatbot-close {
    position: absolute;
    right: -1rem;
    top: -1.1rem;
    z-index: 1;
    display: none
}

.chatbot-wrap .chatbot-close .ico-delete-input {
    position: relative;
    width: 2.4rem;
    height: 2.4rem;
    border-radius: 99rem;
    overflow: hidden
}

.chatbot-wrap.up {
    bottom: 15.5rem
}

.chatbot-wrap.up2 {
    bottom: 14rem
}

.chatbot-wrap.no-animation {
    -webkit-transition: none !important;
    -o-transition: none !important;
    transition: none !important
}

.chatbot-wrap .chatbot-robot-default .dot-flashing-new {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    height: 1rem;
    margin-top: -0.3rem
}

.chatbot-wrap .chatbot-robot-default .dot-flashing-new .dot {
    background-color: var(--color-w50)
}

.chatbot-wrap .chatbot-robot-home {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    height: 4.8rem;
    border-radius: 99rem;
    background-color: var(--color-grey-g1000)
}

.chatbot-wrap .chatbot-robot-home .chatbot_wink {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    width: 4.8rem;
    height: 4.8rem
}

.chatbot-wrap .chatbot-robot-home .txt {
    position: relative;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 0;
    font-size: 1.5rem;
    line-height: 4.8rem;
    font-weight: 700;
    color: var(--color-w100);
    -webkit-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s
}

.chatbot-wrap .chatbot-robot-home.chatbot-robot.active {
    width: auto;
    padding-left: 0.4rem
}

.chatbot-wrap.chatbot-home .chatbot-close {
    display: block
}

.chatbot-wrap .chatbot-robot-counsel {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    width: 4.8rem;
    height: 4.8rem;
    border-radius: 99rem;
    background-color: var(--color-grey-g1000);
    overflow: hidden
}

.chatbot-wrap .chatbot-robot-counsel .dot-flashing-new {
    height: 1rem;
    margin: 0 auto
}

.chatbot-wrap .chatbot-robot-counsel .dot-flashing-new .dot {
    background-color: var(--color-w50)
}

.chatbot-wrap .chatbot-robot-counsel .chatbot_wink {
    display: none
}

.chatbot-wrap .chatbot-robot-counsel .txt {
    position: relative;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 0;
    font-size: 1.5rem;
    line-height: 4.8rem;
    font-weight: 700;
    color: var(--color-w100);
    -webkit-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s
}

.chatbot-robot.chatbot-robot-counsel .chatbot_wink {
    opacity: 0
}

.chatbot-robot.chatbot-robot-counsel.active .chatbot_wink {
    opacity: 1
}

.chatbot-robot.chatbot-robot-counsel.finish .chatbot_wink {
    opacity: 1
}

.chatbot-wrap .chatbot-robot-counsel.active {
    width: auto;
    padding-left: 0.4rem
}

.chatbot-wrap .chatbot-robot-counsel.active .txt {
    width: auto
}

.chatbot-wrap .chatbot-robot-counsel.active .dot-flashing-new {
    margin: 0 0.9rem
}

.chatbot-wrap .chatbot-robot-counsel.active .chatbot_wink,
.chatbot-wrap .chatbot-robot-counsel.finish .chatbot_wink {
    display: block;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    width: 4.8rem;
    height: 4.8rem
}

.ocr-page .component-text,
.ocr-page .component-text-simple {
    position: relative;
    z-index: 2
}

.ocr-page .component-id-card {
    position: relative;
    z-index: 1
}

.component-id-card {
    position: relative;
    margin: 5.6rem auto 0;
    padding: 0;
    max-width: 32.3rem;
    width: 100%;
    height: 22rem
}

.component-id-card .id-card {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    display: block;
    width: 27rem;
    height: 17rem;
    background-color: transparent;
    z-index: 10
}

.component-id-card .id-card:before {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 92%;
    height: 100%;
    background-color: var(--color-g800, #414141);
    border-radius: 2rem
}

.component-id-card .id-card.type2:before {
    display: none
}

.component-id-card .id-card-open {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    display: block;
    border-radius: 1.2rem;
    opacity: 0;
    z-index: 8
}

.component-id-card .id-card-open.active {
    -webkit-animation-delay: 0.5s;
    animation-delay: 0.5s;
    -webkit-animation: frame-open 1s linear forwards;
    animation: frame-open 1s linear forwards
}

@-webkit-keyframes frame-open {
    0% {
        width: 25.9rem;
        height: 17rem;
        border: 0.6rem solid var(--color-w100, #fff);
        opacity: 0
    }
    10% {
        opacity: 1
    }
    100% {
        width: 32.3rem;
        height: 22rem;
        border: 0
    }
}

@keyframes frame-open {
    0% {
        width: 25.9rem;
        height: 17rem;
        border: 0.6rem solid var(--color-w100, #fff);
        opacity: 0
    }
    10% {
        opacity: 1
    }
    100% {
        width: 32.3rem;
        height: 22rem;
        border: 0
    }
}

.component-id-card .id-card-open .id-card-open-scale {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 50%;
    height: 50%;
    border-radius: 1.2rem
}

.component-id-card .id-card-open .id-card-open-scale.green {
    border-color: var(--color-pl, #b6f23d)
}

.component-id-card .id-card-open.active .id-card-open-scale {
    width: 100%;
    height: 100%;
    border: 0;
    -webkit-transition: 0.7s;
    -o-transition: 0.7s;
    transition: 0.7s
}

.id-card-frame {
    position: absolute;
    display: block;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 100vw;
    height: 100vh;
    z-index: 6
}

.component-id-card .id-card-open.active+.id-card-frame {
    -webkit-transition: 0.7s;
    -o-transition: 0.7s;
    transition: 0.7s
}

.component-id-card .id-card-tip {
    position: absolute;
    bottom: 11%;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    width: 100%;
    z-index: 10
}

.component-id-card .id-card-tip.show3 {
    color: var(--color-pl, #b6f23d) !important;
    text-shadow: 0 0 1px #00000033
}

.id-card-tip {
    font-size: 1.4rem;
    text-align: center;
    padding-top: 1.6rem
}

.id-card-tip .id-card-whitebalance {
    height: 1rem;
    vertical-align: inherit
}

.id-card-tip ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    padding: 0 2rem
}

.id-card-tip ul>li {
    text-align: center;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.id-card-tip ul>li span {
    font-size: 1.2rem;
    line-height: 1.6rem
}

.id-card-tip ul>li:before {
    content: '';
    display: block;
    width: 5.4rem;
    height: 5.4rem;
    margin: 0 auto
}

.id-card-tip ul>li:nth-child(1):before {
    background-image: url("../../img/mmk/common/cert_cam_guide.png");
    background-size: contain
}

.id-card-tip ul>li:nth-child(2):before {
    background-image: url("../../img/mmk/common/cert_cam_reflect.png");
    background-size: contain
}

.id-card-tip ul>li:nth-child(3):before {
    background-image: url("../../img/mmk/common/cert_cam_stabilization.png");
    background-size: contain
}

.loader-cta .loader-img {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    width: 2rem;
    position: relative;
    margin-right: 0.6rem
}

.loader-cta .loader-img .skeleton-loader {
    width: 2rem;
    height: 2rem;
    margin: -1rem 0 0 -1rem
}

.loader-cta .loader-img .skeleton-loader:before {
    background-color: var(--color-g200, #eee)
}

.loader-cta .loader-img .skeleton-loader .loader-item {
    position: relative
}

.loader-cta .loader-img .skeleton-loader .loader-item:after,
.loader-cta .loader-img .skeleton-loader .loader-item:before {
    width: 0.4rem;
    height: 0.2rem;
    background: var(--color-g300, #e0e0e0)
}

:root .loader-cta .loader-img .skeleton-loader .loader-item:after,
:root .loader-cta .loader-img .skeleton-loader .loader-item:before {
    background: var(--color-g400, #c8d2e4)
}

.toast-tip {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: fixed;
    left: 0;
    bottom: -4rem;
    padding: 0 2rem;
    z-index: 999
}

.toast-tip.active {
    bottom: -4rem;
    -webkit-animation: id-card-toast 0.5s forwards linear;
    animation: id-card-toast 0.5s forwards linear
}

.toast-tip .toast-group {
    padding: 0.8rem 1.6rem;
    background: rgba(255, 255, 255, 0.2);
    text-align: center;
    border-radius: 2rem
}

.toast-tip .toast-txt {
    color: var(--color-w100, #fff);
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400
}

@-webkit-keyframes id-card-toast {
    0% {
        bottom: -4rem
    }
    60% {
        bottom: 5rem
    }
    80% {
        bottom: 3.5rem
    }
    100% {
        bottom: 4.7rem
    }
}

@keyframes id-card-toast {
    0% {
        bottom: -4rem
    }
    60% {
        bottom: 5rem
    }
    80% {
        bottom: 3.5rem
    }
    100% {
        bottom: 4.7rem
    }
}

.component-id-card-img {
    margin-top: 2.4rem
}

.component-id-card-img+.component-form {
    margin-top: 1.6rem
}

.component-id-card-img .img-license-group {
    padding: 0.4rem 1.8rem;
    background-color: var(--color-g100, #f8f8f8);
    border-radius: 1.2rem;
    width: auto;
    height: auto
}

.component-id-card-img .img-license-group img {
    width: 30rem
}

.component-id-card-img .img-license-group.error {
    border: 1px solid var(--border-pri-error)
}

/*! 오늘의 쿠폰 */

.component-coupon {
    position: relative;
    padding-top: 2.8rem;
    padding-bottom: 3.6rem;
    background: var(--color-w100, #fff)
}

.component-coupon.bg-gray {
    background: var(--color-g100, #f8f8f8)
}

.component-coupon.bg-gray:after {
    content: '';
    background: var(--color-g100, #f8f8f8);
    position: fixed;
    z-index: -1;
    bottom: 0;
    left: 0;
    right: 0;
    height: 100%
}

.tab-content .component-coupon {
    margin-top: 0 !important;
    padding-top: 4rem
}

.component-coupon .tit-01 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.component-coupon .tit-01 .tag {
    margin-right: 0.6rem;
    padding: 0.1rem 0.6rem 0;
    background: #ffecec
}

.component-coupon .tit-01 .tag .txt {
    font-weight: bold;
    color: #ff1515
}

.component-coupon .tit-01 .tooltip-group {
    line-height: 1
}

.component-coupon .tit-01 .tooltip-group .ico-help {
    width: 2rem;
    height: 2rem;
    -webkit-filter: var(--filter-g900);
    filter: var(--filter-g900);
    margin-left: 4px
}

.component-coupon .tit-simple-group .sub-txt {
    margin-top: 0;
    color: var(--color-g600, #9b9b9b);
    line-height: 2rem;
    font-weight: 500;
    font-size: 1.4rem
}

.component-coupon .tit-simple-group.center {
    text-align: center
}

.component-coupon .tit-simple-group .txt-coin {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-top: 0.8rem;
    margin-bottom: 2rem;
    font-size: 3.2rem;
    font-weight: 700
}

.component-coupon .tit-simple-group .txt-coin .ico-coin {
    margin-right: 0.4rem;
    width: 3.2rem;
    height: 3.2rem
}

.component-coupon .emoji,
.text-icon-group .emoji {
    margin-left: 2px
}

.component-coupon .txt-count-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-top: 0.8rem;
    margin-bottom: 3.6rem
}

.component-coupon .txt-count-wrap .ico-coin {
    margin-right: 0.4rem;
    width: 3.2rem;
    height: 3.2rem
}

.title-field-popup .emoji {
    margin-left: 2px
}

.tit-simple-group+.tit-simple-group {
    margin-top: 1.6rem
}

.tit-simple-group+.coupon-list-group {
    margin-top: 1.6rem
}

.coupon-group+.coupon-group {
    margin-top: 1.6rem
}

.coupon-group+.progress-group {
    padding-bottom: 0
}

.coupon-group+.progress-group .progress-bar {
    margin-top: 2rem
}

.btn-lv01.bg-blue .ico-download {
    margin-right: 0.6rem
}

.coupon-group {
    position: relative;
    height: 11.2rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    overflow: hidden
}

.coupon-group:after,
.coupon-group:before {
    content: '';
    position: absolute;
    z-index: 2;
    width: 16px;
    height: 16px;
    display: block;
    border: 1px solid var(--color-pb10, #00000019);
    border-radius: 50%;
    background: var(--color-w100, #fff);
    top: 0;
    right: 77px;
    -webkit-transform: translate(50%, -50%);
    -ms-transform: translate(50%, -50%);
    transform: translate(50%, -50%)
}

.bg-gray .coupon-group:after,
.bg-gray .coupon-group:before {
    background: var(--color-g100, #f8f8f8)
}

.bg-white .coupon-group:after,
.bg-white .coupon-group:before {
    background: var(--color-w100, #fff)
}

.coupon-group:after {
    top: 100%
}

[class^="coupon-group-"] {
    position: relative;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-width: 1px;
    border-style: solid;
    border-color: var(--color-pb10, #00000019);
    overflow: hidden
}

.coupon-group-left {
    position: relative;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    -webkit-box-pack: left;
    -ms-flex-pack: left;
    justify-content: left;
    padding: 1.1rem 1.8rem 1.1rem 2rem;
    background: var(--color-w100, #fff);
    border-right: 0 !important;
    border-radius: 1.2rem 0 0 1.2rem
}

.coupon-group-left .item-img {
    margin-right: 2rem
}

.coupon-group .item-img i,
.title-field-popup .item-img {
    display: block;
    width: 6rem;
    height: 6rem;
    border: 0.5px solid var(--color-pb5, #0000000C);
    border-radius: 99rem;
    overflow: hidden
}

.coupon-group .item-img i {
    position: relative;
    border: 0
}

.coupon-group .item-img i::before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border: 1px solid var(--color-pb5, #0000000C);
    border-radius: 99rem
}

.coupon-group-left .item-img i img,
.title-field-popup .item-img img {
    width: 100%;
    height: 100%
}

.coupon-group-left .item-subject {
    width: 100%;
    overflow: hidden
}

.coupon-group-left .item-subject>span {
    display: block;
    font-size: 1.2rem;
    white-space: nowrap;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    overflow: hidden
}

.coupon-group-left .item-subject .txt-discount {
    font-size: 2.6rem;
    margin-bottom: 0.2rem;
    font-weight: 700;
    line-height: 1.4;
    letter-spacing: 0.02em
}

.coupon-group-left .item-subject .txt-condition {
    color: var(--color-g700, #7d7d7d)
}

.coupon-group-left .item-subject .txt-sangho {
    font-weight: 500
}

.coupon-group-right {
    position: relative;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 77px;
    flex: 0 0 77px;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    background: var(--color-g200);
    text-align: center;
    border-left: 0 !important;
    border-radius: 0 1.2rem 1.2rem 0
}

.coupon-group-right:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    border-left: 1px dashed var(--color-pb10, #00000019)
}

.coupon-group-right .item-box {
    color: var(--color-g600, #9b9b9b);
    font-size: 1.5rem;
    line-height: 2rem;
    padding-left: 1px
}

.coupon-group-right .item-box>div {
    color: inherit
}

.coupon-group-right .item-box i {
    margin-bottom: .4rem;
    width: 2.4rem;
    height: 2.4rem;
    -webkit-filter: var(--filter-g600);
    filter: var(--filter-g600)
}

.coupon-group-right .item-box .txt>span {
    display: block;
    font-size: 1.2rem;
    font-weight: 400
}

.coupon-group.on .coupon-group-right:before {
    border-color: var(--color-w100, #fff)
}

.coupon-group.on .item-subject {
    color: var(--color-bu700, #006aff)
}

.coupon-group.on .coupon-group-right {
    background: var(--color-bu700, #006aff)
}

.coupon-group.on .item-box {
    color: var(--color-w100, #fff);
    font-weight: 700;
    font-size: 1.2rem
}

.coupon-group.on .item-box i {
    -webkit-filter: var(--filter-w100);
    filter: var(--filter-w100)
}

.coupon-group.use .coupon-group-right {
    background: var(--color-w100, #fff)
}

.coupon-group.use .item-box {
    color: var(--color-bu700, #006aff);
    font-weight: 700;
    font-size: 1.4rem;
    line-height: 2rem
}

.coupon-group.done .item-box {
    font-weight: 700;
    font-size: 1.2rem
}

.coupon-group.off [class^="coupon-group-"] {
    border-style: solid
}

.coupon-group.off:after,
.coupon-group.off:before {
    border: 1px solid var(--color-pb10, #00000019)
}

.coupon-group.off .coupon-group-right .item-box {
    font-size: 1.4rem
}

.coupon-group.past .item-img i {
    opacity: 0.5
}

.coupon-group.past .item-subject * {
    color: var(--color-g500, #b8b8b8)
}

.coupon-group.past .item-box {
    line-height: 2rem
}

.coupon-group.open-dimmed [class^="coupon-group-"],
.coupon-group.open-dimmed:after,
.coupon-group.open-dimmed:before {
    border-width: 0
}

.coupon-group.open-dimmed [class^="coupon-group-"]:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--color-pb70, #000000B2)
}

.coupon-group.open-dimmed .open-txt {
    position: absolute;
    font-size: 2.8rem;
    font-weight: 700;
    color: var(--color-w100, #fff)
}

.coupon-group.open-dimmed .coupon-group-right .item-box {
    font-size: 1.4rem
}

.coupon-group.evt {
    height: 13.4rem
}

.coupon-group .item-tag {
    margin-bottom: 0.4rem
}

.coupon-group .item-tag .tag.coupon+.tag.coupon {
    margin-left: 0.4rem
}

.coupon-group .item-tag>img {
    height: 100%
}

.tit-simple-group.coupon+.coupon-list-group {
    margin-top: 1rem
}

.title-field-popup.coupon .item-img {
    width: 6rem;
    height: 6rem;
    background: none
}

.title-field-popup.coupon .item-img.color01 {
    background: var(--color-sf100, #a7e6e2)
}

.title-field-popup.coupon .item-img.color02 {
    background: var(--color-yl100, #f8e750)
}

.title-field-popup.coupon .item-img.color03 {
    background: var(--color-lm200, #b0e132)
}

.title-field-popup.coupon .item-img.color04 {
    background: var(--color-og200, #fdd291)
}

.title-field-popup.coupon .item-img.color05 {
    background: var(--color-cy400, #33c5e8)
}

.title-field-popup.coupon .item-img.color06 {
    background: var(--color-ce200, #96ee85)
}

.title-field-popup.coupon .item-img.color07 {
    background: var(--color-fu400, #f9aaf7)
}

.title-field-popup.coupon .item-img.color08 {
    background: var(--color-bu300, #71beff)
}

.title-field-popup.coupon .item-img.color09 {
    background: var(--color-re400, #fa9885)
}

.title-field-popup.coupon .item-img.color10 {
    background: var(--color-bu100, #bae2ff)
}

.title-field-popup.coupon .item-img.color11 {
    background: var(--color-yl300, #e8c600)
}

.title-field-popup.coupon .item-img.color12 {
    background: var(--color-lm300, #98d225)
}

.title-field-popup.coupon .item-img.color13 {
    background: var(--color-g300, #e0e0e0)
}

.title-field-popup.coupon .item-img.color14 {
    background: var(--color-g100, #f8f8f8)
}

.title-field-popup.coupon .item-img.type1 {
    width: 6.4rem;
    height: 6.4rem;
    margin-left: 2rem !important;
    border-radius: 2.4rem;
    background: var(--bg-qua);
    border: 0
}

.component-banner.coupon.active {
    -webkit-transform: translateY(-11rem);
    -ms-transform: translateY(-11rem);
    transform: translateY(-11rem);
    -webkit-animation: couponDown 0.6s ease forwards;
    animation: couponDown 0.6s ease forwards
}

@-webkit-keyframes couponDown {
    0% {
        -webkit-transform: translateY(-11rem);
        transform: translateY(-11rem)
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

@keyframes couponDown {
    0% {
        -webkit-transform: translateY(-11rem);
        transform: translateY(-11rem)
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

.section-component.ui-tab .article-component.coupon {
    background: var(--color-w100, #fff)
}

.coupon-group.special01 [class^="coupon-group-"] {
    border-color: var(--color-yl600, #b08c00)
}

.coupon-group.special01:after,
.coupon-group.special01:before {
    border: 1px solid var(--color-yl600, #b08c00)
}

.coupon-group.special01 .coupon-group-right {
    background: var(--color-w100, #fff)
}

.coupon-group.special01 .coupon-group-right:before {
    border-left: 1px dashed var(--color-yl600, #b08c00)
}

.coupon-group.special01 .item-box {
    color: var(--color-yl600, #b08c00)
}

.coupon-group.special01 .item-box i {
    -webkit-filter: var(--filter-yl600);
    filter: var(--filter-yl600)
}

.coupon-group.special02 [class^="coupon-group-"] {
    border-color: var(--color-in600, #7673fb)
}

.coupon-group.special02:after,
.coupon-group.special02:before {
    border: 1px solid var(--color-in600, #7673fb)
}

.coupon-group.special02 .coupon-group-right {
    background: var(--color-w100, #fff)
}

.coupon-group.special02 .coupon-group-right:before {
    border-left: 1px dashed var(--color-in600, #7673fb)
}

.coupon-group.special02 .item-box {
    color: var(--color-in600, #7673fb)
}

.coupon-group.special02 .item-box i {
    -webkit-filter: var(--filter-in600);
    filter: var(--filter-in600)
}

.coupon-group-left .item-img>i.color15 {
    background: var(--color-yl50, #fbf198)
}

.coupon-group-left .item-img>i.color16 {
    background: var(--color-in100, #e1e1fe)
}

.title-field-popup.coupon .item-img.color15 {
    background: var(--color-yl50, #fbf198)
}

.title-field-popup.coupon .item-img.color16 {
    background: var(--color-in100, #e1e1fe)
}

.title-field-popup.coupon .coupon-tit {
    max-width: calc(100% - 8.4rem)
}

html.font-large .coupon-group-left {
    padding: 1.5rem
}

.title-field-popup .item-img,
html.font-large .coupon-group-left .item-img i {
    width: 5.4rem;
    height: 5.4rem
}

html.font-large .coupon-group-left .item-subject .txt-discount {
    letter-spacing: 0
}

.nodata-coupon-group {
    position: relative;
    padding-top: 4rem
}

.nodata-coupon-group.full-h {
    padding: 12rem 0 1rem;
    text-align: center
}

.nodata-coupon-group.full-h:after {
    content: "";
    position: fixed;
    top: 50rem;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--color-w100, #fff);
    z-index: -1
}

.nodata-coupon-group .txt-lv01 {
    color: var(--color-g600, #9b9b9b)
}

.nodata-coupon-group [class^="btn-"] {
    margin: 1.6rem 0 0
}

.ico-coupon-null {
    width: 12.8rem;
    height: 12.8rem;
    background: url("../../img/mmk/common/img_coupon_null.svg") no-repeat center/contain
}

.component-coupon.bg-gray.type2 {
    background-color: var(--bg-qua, #f7f9fd)
}

.container-component.coupon {
    background-color: var(--bg-qua, #f7f9fd)
}

.container-component.coupon .component-coupon .ico-warning {
    width: 7.2rem;
    height: 7.2rem;
    -webkit-filter: var(--filter-ico-qua);
    filter: var(--filter-ico-qua)
}

.container-component.coupon .component-coupon .nodata-coupon-group .txt-lv01 {
    margin-top: 1rem
}

.survey-img-group {
    background-color: #ccf2ff
}

.survey-img-group img {
    width: 100%;
    vertical-align: top
}

.survey-txt-group {
    padding: 2rem;
    background-color: #ccf2ff
}

.survey-txt-group .survey-tit {
    text-align: center;
    font-size: 1.5rem;
    color: var(--color-g800, #414141);
    line-height: 2rem;
    padding-bottom: 1.4rem
}

.survey-txt-group>ol {
    padding: 2.8rem 2rem;
    background-color: var(--color-w100, #fff);
    counter-reset: number 0;
    border-radius: 0.8rem
}

.survey-txt-group>ol>li+li {
    padding-top: 1.8rem
}

.survey-txt-group>ol>li:before {
    content: "0" counter(number);
    counter-increment: number 1;
    display: block;
    margin: 0 auto 1rem;
    font-size: 1.4rem;
    color: var(--color-w100, #fff);
    font-weight: bold;
    color: var(--color-w100, #fff);
    width: 4.36rem;
    height: 2.18rem;
    border-radius: 2rem;
    text-align: center;
    background-color: var(--color-pn, #17008c);
    line-height: 2.1rem
}

.component-img-poll {
    padding: 0
}

.component-img-poll.type01 {
    margin-top: 2.8rem;
    padding: 0 2rem
}

.component-img-poll.type01 .img-poll-header {
    max-width: 80rem;
    margin: 0 auto;
    overflow: hidden;
    border-radius: 1.6rem
}

.component-form-poll .input-radio-group .radio-txt-field {
    white-space: inherit;
    -o-text-overflow: initial;
    text-overflow: initial
}

.img-poll-header img {
    width: 100%
}

.img-poll-header img.w218 {
    width: 28.1rem
}

.component-form-poll .input-img {
    margin-top: 0.8rem;
    margin-left: 3.2rem;
    border: 1px solid var(--color-g300, #e0e0e0);
    border-radius: 0 1.2rem 1.2rem 1.2rem;
    overflow: hidden;
    height: 16rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.component-form-poll .input-img.pb100-op7 {
    border: none;
    height: auto
}

.component-form-poll .input-img.pb100-op7 {
    position: relative
}

.component-form-poll .input-img.pb100-op7::after {
    position: absolute;
    inset: 0;
    pointer-events: none;
    content: '';
    display: block;
    border: 1px solid var(--color-black-pb100-op7);
    border-radius: 0 1.2rem 1.2rem 1.2rem;
    background-color: transparent
}

.component-form-poll .input-img.pb100-op7 img {
    width: 100%;
    height: auto;
    border: none
}

.component-form-poll .form-group .form-row:first-child {
    margin-top: 0
}

.component-form-poll .form-group .form-row {
    margin-top: 2rem
}

.component-form-poll .input-img>img {
    height: 100%
}

.component-form-poll .sub-row {
    margin-top: 0.8rem
}

.component-form-poll.type01 .sub-row {
    margin: .8rem 0 0 2.8rem
}

.poll-progress {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    padding-bottom: 4rem
}

.poll-progress:after {
    content: "";
    position: absolute;
    z-index: -1;
    top: 1.1rem;
    left: 1px;
    right: 1px;
    border-top: 1px dashed var(--color-g300, #e0e0e0)
}

.poll-progress .radio-shape:before {
    background: var(--color-w100, #fff)
}

.poll-progress .input-radio-group {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.poll-progress .input-radio-group:first-child {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.poll-progress .input-radio-group:last-child {
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end
}

.poll-progress .input-radio-group:last-child .radio-txt-field {
    top: 0;
    right: 0
}

.poll-progress .input-radio-group .radio-txt-field {
    position: absolute;
    margin-top: 3.2rem;
    font-size: 1.6rem
}

.poll-progress.type01 {
    -webkit-column-gap: .6rem;
    -moz-column-gap: .6rem;
    column-gap: .6rem
}

.poll-progress.type01 .input-radio-group {
    width: 100%
}

.poll-progress.type01 .input-radio-group .input-radio {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
    height: 100%
}

.poll-progress.type01 .input-radio-group .input-radio .txt {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 100%;
    height: 4rem;
    border: 1.2px solid var(--border-qua);
    border-radius: .8rem;
    padding: 1rem 1.2rem;
    font-size: 1.8rem;
    font-weight: 500;
    line-height: 2rem;
    color: var(--txt-quin)
}

.poll-progress.type01 .input-radio-group .input-radio input:checked+.txt {
    font-weight: 700;
    color: var(--txt-pri-invert);
    border-color: var(--bg-ter-active);
    background-color: var(--bg-ter-active)
}

.poll-progress.type01 .input-radio-group .radio-txt-field {
    margin-top: 5.2rem;
    font-size: 1.4rem;
    font-weight: 500;
    line-height: 2rem;
    color: var(--txt-ter)
}

.poll-progress.type01::after {
    display: none
}

.component-text-icon+.component-img-poll {
    margin-top: 4.8rem
}

.component-img-poll+.component-text-simple {
    margin-top: 3.2rem
}

.component-img-poll+.component-form-poll {
    margin-top: 2.4rem
}

.popup-header+.popup-content>.component-img-poll,
.popup-header+.popup-content>.popup-inner .component-form-poll {
    margin-top: 0.8rem
}

.popup-header+.popup-content>.component-img-poll+.popup-inner .component-form-poll {
    margin-top: 2.4rem
}

.main-event-2023-11 {
    background-color: var(--color-w100, #fff)
}

.main-event-2023-11 .count-coin {
    padding: 2.1rem 0 1.4rem;
    text-align: center
}

.main-event-2023-11 .count-coin img {
    width: 23.6rem
}

.main-event-2023-11 .count-bar-wrap {
    position: relative;
    padding: 5.2rem 3rem 0.8rem
}

.main-event-2023-11 .count-bar-wrap .count-bar {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    height: 2.2rem;
    border-radius: 10rem;
    background: -webkit-gradient(linear, right top, left top, color-stop(10%, #ed31b7), color-stop(52.15%, #466ce2), color-stop(99.83%, #6fbaff));
    background: -o-linear-gradient(right, #ed31b7 10%, #466ce2 52.15%, #6fbaff 99.83%);
    background: linear-gradient(270deg, #ed31b7 10%, #466ce2 52.15%, #6fbaff 99.83%);
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.main-event-2023-11 .count-bar-wrap .count-bar>div {
    position: relative;
    width: calc(100%/20);
    text-align: center
}

.main-event-2023-11 .count-bar-wrap .count-bar>div:first-child {
    margin-left: 0.8rem
}

.main-event-2023-11 .count-bar-wrap .count-bar>div:nth-last-child(2) {
    margin-right: 0.5rem
}

.main-event-2023-11 .count-bar-wrap .count-bar>div:last-child {
    -ms-flex-preferred-size: 3.7rem;
    flex-basis: 3.7rem
}

.main-event-2023-11 .count-bar-wrap .count-bar>div:after {
    content: '';
    display: block;
    width: 0.6rem;
    height: 0.6rem;
    border-radius: 99rem;
    background-color: var(--color-w100, #fff);
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    opacity: 0.4
}

.main-event-2023-11 .count-bar-wrap .count-bar>div.on:after {
    opacity: 1
}

.main-event-2023-11 .count-bar-wrap .count-bar>div>.number {
    position: absolute;
    bottom: 3.6rem;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    font-size: 1.5rem;
    color: var(--color-g900, #141414);
    width: 5.3rem;
    height: 3rem;
    border-radius: 0.7rem;
    text-align: center;
    background-color: #bef54f
}

.main-event-2023-11 .count-bar-wrap .count-bar>div>.number:after {
    content: "";
    width: 0;
    height: 0;
    border-right: 1rem solid #bef54f;
    border-top: 0.5rem solid transparent;
    border-bottom: 0.5rem solid transparent;
    position: absolute;
    bottom: -0.7rem;
    left: 2.25rem;
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg)
}

.main-event-2023-11 .count-bar-wrap .count-bar>div:last-child .number:after {
    border-right-color: #f500af
}

.main-event-2023-11 .count-bar-wrap .count-bar>div:last-child .number {
    background-color: #f500af
}

.main-event-2023-11 .count-bar-wrap .count-bar>div:last-child .number span {
    color: var(--color-w100, #fff)
}

.main-event-2023-11 .count-bar-wrap .count-bar>div>.number span {
    font-size: 1.5rem;
    line-height: 3rem;
    font-weight: 700;
    color: var(--color-g900, #141414)
}

.main-event-2023-11 .count-bar-wrap .count-pocket {
    position: absolute;
    top: 4.4rem;
    right: 3rem;
    width: 3.8rem;
    height: 3.8rem;
    border-radius: 99rem;
    background-color: #ed31b7
}

.main-event-2023-11 .count-bar-wrap .count-pocket img {
    width: 3.1rem;
    height: 3.1rem;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.main-event-2023-11 .count-bar-wrap .txt {
    padding-top: 0.8rem;
    font-size: 1.1rem;
    color: var(--color-g700, #7d7d7d)
}

.main-event-2023-11.event-202402 .bg {
    position: relative
}

.main-event-2023-11.event-202402 .bg img {
    width: 100%
}

.main-event-2023-11.event-202402 .count-bar-wrap {
    position: absolute;
    bottom: 2rem;
    left: 2.1rem;
    right: 2.1rem;
    padding: 0
}

.main-event-2023-11.event-202402 .count-bar-wrap .txt {
    font-size: 1.4rem;
    line-height: 1.7rem;
    color: var(--color-w100, #fff);
    padding-top: 2rem;
    text-align: center
}

.main-event-2023-11.event-202402 .count-bar-wrap .count-bar,
.main-event-2023-11.event-202402 .count-bar-wrap .count-pocket {
    background: #ececec
}

.main-event-2023-11.event-202402 .count-bar-wrap .count-bar {
    position: relative
}

.main-event-2023-11.event-202402 .count-bar-wrap .count-bar>div>.number {
    background-color: #b2dfff
}

.main-event-2023-11.event-202402 .count-bar-wrap .count-bar>div>.number:after {
    border-right-color: #b2dfff
}

.main-event-2023-11.event-202402 .count-bar-wrap .count-bar>div:after {
    display: none
}

.main-event-2023-11.event-202402 .count-bar-wrap .count-bar>div:first-child {
    margin-left: 1rem
}

.main-event-2023-11.event-202402 .count-bar-wrap .count-bar>div:last-child {
    -ms-flex-preferred-size: 4.4rem;
    flex-basis: 4.4rem
}

.main-event-2023-11.event-202402 .count-bar-wrap .count-bar>div:last-child .number {
    background-color: #f500af
}

.main-event-2023-11.event-202402 .count-bar-wrap .count-bar>div:last-child .number:after {
    border-right-color: #f500af
}

.main-event-2023-11.event-202402 .count-bar-wrap .bar-gage {
    position: absolute;
    top: 0;
    left: 0;
    height: 2.2rem;
    margin-left: 0;
    border-radius: 10rem 0 0 10rem;
    background-color: #2391ff;
    max-width: 90%;
    z-index: 1
}

.main-event-2023-11.event-202402 .count-bar-wrap .count-pocket {
    top: -0.8rem;
    right: 0
}

.main-event-2023-11.event-202402 .count-bar-wrap .count-pocket.half {
    background: -webkit-gradient(linear, left top, right top, color-stop(10%, #2391ff), color-stop(50%, #ececec));
    background: -o-linear-gradient(left, #2391ff 10%, #ececec 50%);
    background: linear-gradient(to right, #2391ff 10%, #ececec 50%)
}

.main-event-2023-11.event-202402 .count-bar-wrap .count-pocket.on {
    background: #2391ff
}

.main-event-2023-11.event-202402 .count-bar-wrap .count-pocket img {
    width: 3.1349rem;
    height: 3.1349rem
}

.component-face-wrap {
    margin: 5rem auto 0;
    text-align: center
}

/*! component element 금액 롤링 */

.txt-count-wrap {
    position: relative;
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 700;
    color: var(--color-pb100, #000)
}

.txt-count-wrap [data-interest-num] {
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 0;
    overflow: hidden
}

:root .txt-count-wrap [data-interest-num] {
    line-height: 0;
    white-space: nowrap;
    margin: -1px;
    padding: 0;
    border: 0;
    width: 1px;
    height: 1px;
    left: 0;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none
}

.txt-count-wrap [data-interest-num="0"]+.number-rolling:after,
.txt-count-wrap [data-interest-num="0"]+.number-rolling:before {
    display: none
}

.txt-count-wrap [data-interest-num="0"]+.number-rolling .num0 {
    top: 1px
}

.number-rolling {
    position: relative;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    vertical-align: bottom
}

.number-rolling:before {
    content: '';
    display: block;
    position: absolute;
    top: -0.2rem;
    left: 0;
    width: 100%;
    height: 19%;
    background: -webkit-gradient(linear, left bottom, left top, from(var(--color-w0, #fffFFF00)), color-stop(80.21%, var(--color-w100, #fff)), to(var(--color-w0, #fffFFF00)));
    background: -o-linear-gradient(bottom, var(--color-w0, #fffFFF00) 0, var(--color-w100, #fff) 80.21%, var(--color-w0, #fffFFF00) 100%);
    background: linear-gradient(0deg, var(--color-w0, #fffFFF00) 0, var(--color-w100, #fff) 80.21%, var(--color-w0, #fffFFF00) 100%);
    z-index: 1
}

.number-rolling:after {
    content: '';
    display: block;
    position: absolute;
    bottom: -0.2rem;
    left: 0;
    width: 100%;
    height: 19%;
    background: -webkit-gradient(linear, left top, left bottom, from(var(--color-w0, #fffFFF00)), color-stop(80.21%, var(--color-w100, #fff)), to(var(--color-w0, #fffFFF00)));
    background: -o-linear-gradient(top, var(--color-w0, #fffFFF00) 0, var(--color-w100, #fff) 80.21%, var(--color-w0, #fffFFF00) 100%);
    background: linear-gradient(180deg, var(--color-w0, #fffFFF00) 0, var(--color-w100, #fff) 80.21%, var(--color-w0, #fffFFF00) 100%);
    z-index: 1
}

.number-rolling.completed:after,
.number-rolling.completed:before {
    opacity: 0;
    -webkit-transition: opacity 0.4s;
    -o-transition: opacity 0.4s;
    transition: opacity 0.4s
}

.number-rolling>div {
    font-size: 1.6rem;
    font-weight: 700;
    color: var(--color-pb100, #000);
    position: relative;
    overflow: hidden
}

.number-rolling .num {
    width: 1rem
}

.number-rolling .num:before {
    content: '012345678901234567890';
    display: block;
    position: absolute;
    top: -1.2rem;
    left: 0;
    width: 100%
}

.number-rolling .num+.num {
    margin-left: -0.03rem
}

.roll-count-text {
    font-weight: 700;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    vertical-align: bottom;
    letter-spacing: 0.2px;
    margin-right: 3px
}

.number-rolling+.roll-count-text {
    display: none
}

.txt-count-wrap.type2 {
    display: inline-block
}

.txt-count-wrap.white .number-rolling>div {
    color: var(--color-w100, #fff)
}

.txt-count-wrap.txt-accent-sec .number-rolling>div {
    color: var(--txt-accent-sec)
}

.txt-count-wrap.bg1 .number-rolling:before {
    background: -webkit-gradient(linear, left bottom, left top, from(var(--color-w0, #fffFFF00)), color-stop(80.21%, var(--color-pn, #17008c)), to(var(--color-w0, #fffFFF00)));
    background: -o-linear-gradient(bottom, var(--color-w0, #fffFFF00) 0, var(--color-pn, #17008c) 80.21%, var(--color-w0, #fffFFF00) 100%);
    background: linear-gradient(0deg, var(--color-w0, #fffFFF00) 0, var(--color-pn, #17008c) 80.21%, var(--color-w0, #fffFFF00) 100%)
}

.txt-count-wrap.bg1 .number-rolling:after {
    background: -webkit-gradient(linear, left top, left bottom, from(var(--color-w0, #fffFFF00)), color-stop(80.21%, var(--color-pn, #17008c)), to(var(--color-w0, #fffFFF00)));
    background: -o-linear-gradient(top, var(--color-w0, #fffFFF00) 0, var(--color-pn, #17008c) 80.21%, var(--color-w0, #fffFFF00) 100%);
    background: linear-gradient(180deg, var(--color-w0, #fffFFF00) 0, var(--color-pn, #17008c) 80.21%, var(--color-w0, #fffFFF00) 100%)
}

.txt-count-wrap.f-14,
.txt-count-wrap.f-14 .number-rolling>div {
    font-size: 1.4rem;
    line-height: 1.4rem
}

.txt-count-wrap.f-14 .number-rolling .num {
    width: 0.85rem
}

.txt-count-wrap.f-14 .number-rolling .num:before {
    top: 0
}

.txt-count-wrap.f-14 .number-rolling.active .num:before {
    -webkit-animation: numRolling-f14 1.5s .2s ease forwards;
    animation: numRolling-f14 1.5s .2s ease forwards
}

.txt-count-wrap.f-14 .number-rolling.active .num+.num:before {
    -webkit-animation-delay: .3s;
    animation-delay: .3s
}

@-webkit-keyframes numRolling-f14 {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
    100% {
        -webkit-transform: translateY(calc(-100% + 1.4rem));
        transform: translateY(calc(-100% + 1.4rem))
    }
}

@keyframes numRolling-f14 {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
    100% {
        -webkit-transform: translateY(calc(-100% + 1.4rem));
        transform: translateY(calc(-100% + 1.4rem))
    }
}

.txt-count-wrap.f-18,
.txt-count-wrap.f-18 .number-rolling>div {
    font-size: 1.8rem
}

.txt-count-wrap.f-18 .number-rolling .num {
    width: 1.1rem
}

.txt-count-wrap.f-20,
.txt-count-wrap.f-20 .number-rolling>div {
    font-size: 2rem;
    line-height: 3.2rem
}

.txt-count-wrap.f-20 .number-rolling .num {
    width: 1.3rem
}

.txt-count-wrap.f-20 .number-rolling .num:before {
    top: 0
}

.txt-count-wrap.f-20 .number-rolling .normal-num0 {
    top: 1px
}

.txt-count-wrap.f-21,
.txt-count-wrap.f-21 .number-rolling>div {
    font-size: 2.1rem;
    line-height: 3.2rem
}

.txt-count-wrap.f-21 .number-rolling .num {
    width: 1.3rem
}

.txt-count-wrap.f-21 .number-rolling .num:before {
    top: 0
}

.txt-count-wrap.f-21 .number-rolling .normal-num0 {
    top: 1px
}

.txt-count-wrap.f-24,
.txt-count-wrap.f-24 .number-rolling>div {
    font-size: 2.4rem;
    line-height: 3.1rem
}

.txt-count-wrap.f-24 .number-rolling .num {
    width: 1.45rem
}

.txt-count-wrap.f-24 .number-rolling .num:before {
    top: 0
}

.txt-count-wrap.f-26,
.txt-count-wrap.f-26 .number-rolling>div {
    font-size: 2.6rem;
    line-height: 1
}

.txt-count-wrap.f-26 .number-rolling .num {
    width: 1.6rem
}

.txt-count-wrap.f-26 .number-rolling .num:before {
    top: -0.7rem
}

.txt-count-wrap.f-28,
.txt-count-wrap.f-28 .number-rolling>div {
    font-size: 2.8rem;
    line-height: 1
}

.txt-count-wrap.f-28 .number-rolling .num {
    width: 1.7rem
}

.txt-count-wrap.f-28 .number-rolling .num:before {
    top: -0.7rem
}

.txt-count-wrap.f-32,
.txt-count-wrap.f-32 .number-rolling>div {
    font-size: 3.2rem;
    line-height: 1
}

.txt-count-wrap.f-32 .number-rolling .num {
    width: 1.98rem
}

.txt-count-wrap.f-32 .number-rolling .num:before {
    top: 0
}

.txt-count-wrap.f-36,
.txt-count-wrap.f-36 .number-rolling>div {
    font-size: 3.6rem;
    line-height: 1
}

.txt-count-wrap.f-36 .number-rolling .num {
    width: 2.1rem
}

.txt-count-wrap.f-36 .number-rolling .num:before {
    top: 0
}

.txt-count-wrap.f-56,
.txt-count-wrap.f-56 .number-rolling>div {
    font-size: 5.6rem;
    line-height: 1
}

.txt-count-wrap.f-56 .number-rolling .num {
    width: 3.35rem
}

.txt-count-wrap.f-56 .number-rolling .num:before {
    top: 2.5rem
}

.benefit-num-rolling {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin: 0 .4rem 0 .8rem;
    font-size: 2.4rem;
    line-height: 3.3rem;
    font-weight: bold;
    text-align: center
}

.benefit-num-rolling .num {
    position: relative;
    overflow: hidden;
    width: 2.4rem;
    height: 3.3rem;
    color: var(--color-bu700, #006aff);
    background: url("/resource/img/mmk/common/img_num_box.png") no-repeat center/contain
}

.benefit-num-rolling .num+.num {
    margin-left: .4rem
}

.benefit-num-rolling .num:before {
    content: '012345678901234567890';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%
}

.benefit-num-rolling.active .num:before,
.number-rolling.active .num:before {
    -webkit-animation: numRolling 1.5s .2s ease forwards;
    animation: numRolling 1.5s .2s ease forwards
}

.benefit-num-rolling.active .num+.num:before,
.number-rolling.active .num+.num:before {
    -webkit-animation-delay: .3s;
    animation-delay: .3s
}

.benefit-num-rolling .num.n1:before,
.number-rolling .num.n1:before {
    content: '0123456789012345678901'
}

.benefit-num-rolling .num.n2:before,
.number-rolling .num.n2:before {
    content: '01234567890123456789012'
}

.benefit-num-rolling .num.n3:before,
.number-rolling .num.n3:before {
    content: '012345678901234567890123'
}

.benefit-num-rolling .num.n4:before,
.number-rolling .num.n4:before {
    content: '0123456789012345678901234'
}

.benefit-num-rolling .num.n5:before,
.number-rolling .num.n5:before {
    content: '01234567890123456789012345'
}

.benefit-num-rolling .num.n6:before,
.number-rolling .num.n6:before {
    content: '012345678901234567890123456'
}

.benefit-num-rolling .num.n7:before,
.number-rolling .num.n7:before {
    content: '0123456789012345678901234567'
}

.benefit-num-rolling .num.n8:before,
.number-rolling .num.n8:before {
    content: '01234567890123456789012345678'
}

.benefit-num-rolling .num.n9:before,
.number-rolling .num.n9:before {
    content: '012345678901234567890123456789'
}

.benefit-num-rolling .num:after {
    display: block;
    content: '';
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    height: .1rem;
    background: var(--color-w100, #fff);
    opacity: .4
}

@-webkit-keyframes numRolling {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
    100% {
        -webkit-transform: translateY(calc(-100% + 3.3rem));
        transform: translateY(calc(-100% + 3.3rem))
    }
}

@keyframes numRolling {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
    100% {
        -webkit-transform: translateY(calc(-100% + 3.3rem));
        transform: translateY(calc(-100% + 3.3rem))
    }
}

.incresing-percent {
    font-size: 3.2rem;
    font-weight: bold;
    color: var(--txt-accent-sec)
}

.number-rolling.short .num.n1:before {
    content: '01'
}

.number-rolling.short .num.n2:before {
    content: '012'
}

.number-rolling.short .num.n3:before {
    content: '0123'
}

.number-rolling.short .num.n4:before {
    content: '01234'
}

.number-rolling.short .num.n5:before {
    content: '012345'
}

.number-rolling.short .num.n6:before {
    content: '0123456'
}

.number-rolling.short .num.n7:before {
    content: '01234567'
}

.number-rolling.short .num.n8:before {
    content: '012345678'
}

.number-rolling.short .num.n9:before {
    content: '0123456789'
}

.txt-count-wrap.no-animation .number-rolling .num:before,
:root .txt-count-wrap.no-animation .number-rolling .num:before {
    -webkit-transform: translateY(calc(-100% + 3.3rem)) !important;
    -ms-transform: translateY(calc(-100% + 3.3rem)) !important;
    transform: translateY(calc(-100% + 3.3rem)) !important;
    -webkit-animation: none !important;
    animation: none !important
}

.txt-count-wrap.no-animation .number-rolling:after,
.txt-count-wrap.no-animation .number-rolling:before,
:root .txt-count-wrap.no-animation .number-rolling:after,
:root .txt-count-wrap.no-animation .number-rolling:before {
    display: none !important
}

.ui-amount .count-item [data-interest-num] {
    position: relative;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex
}

.ui-amount .number-rolling {
    overflow: hidden !important
}

.ui-amount .count-item .number-rolling {
    position: absolute;
    left: 0
}

.number-rolling.type2::after,
.number-rolling.type2::before {
    display: none
}

.number-rolling.type2 .num:before {
    content: '01234567890'
}

.benefit-num-rolling.type2 .num.n1:before,
.number-rolling.type2 .num.n1:before {
    content: '012345678901'
}

.benefit-num-rolling.type2 .num.n2:before,
.number-rolling.type2 .num.n2:before {
    content: '0123456789012'
}

.benefit-num-rolling.type2 .num.n3:before,
.number-rolling.type2 .num.n3:before {
    content: '01234567890123'
}

.benefit-num-rolling.type2 .num.n4:before,
.number-rolling.type2 .num.n4:before {
    content: '012345678901234'
}

.benefit-num-rolling.type2 .num.n5:before,
.number-rolling.type2 .num.n5:before {
    content: '0123456789012345'
}

.benefit-num-rolling.type2 .num.n6:before,
.number-rolling.type2 .num.n6:before {
    content: '01234567890123456'
}

.benefit-num-rolling.type2 .num.n7:before,
.number-rolling.type2 .num.n7:before {
    content: '012345678901234567'
}

.benefit-num-rolling.type2 .num.n8:before,
.number-rolling.type2 .num.n8:before {
    content: '0123456789012345678'
}

.benefit-num-rolling.type2 .num.n9:before,
.number-rolling.type2 .num.n9:before {
    content: '01234567890123456789'
}

.benefit-num-rolling.active.slow .num:before,
.number-rolling.active.slow .num:before {
    -webkit-animation: numRolling 1s .2s ease forwards;
    animation: numRolling 1s .2s ease forwards
}

.benefit-num-rolling.active.slow .num+.num:before,
.number-rolling.active.slow .num+.num:before {
    -webkit-animation-delay: .3s;
    animation-delay: .3s
}

/*! component element layout FETASK-1647 미션배너 */

.popup-row-wrap {
    position: relative;
    height: 100%
}

.popup-row-wrap .popup-row-content {
    position: relative;
    top: 8rem
}

.popup-row-wrap .popup-row-content:first-child {
    position: absolute;
    left: 0;
    width: 100%;
    -webkit-transform: translateY(-40%);
    -ms-transform: translateY(-40%);
    transform: translateY(-40%);
    top: 33.2rem
}

.puzzle-group {
    width: 206px;
    height: 206px;
    margin: 0 auto 9.8rem;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.puzzle-group.second {
    background: #85b6ff url(../../img/mmk/common/img_copang_example.png) center center no-repeat;
    background-size: contain;
    border-radius: 2rem
}

.puzzle-group.second.coffee {
    background: #f1f6fb;
    margin-bottom: 4.8rem
}

.puzzle-group.second .coffee {
    background: url(../../img/mmk/common/upbit/img_onboarding_coffee.png) center center no-repeat;
    background-size: cover;
    width: 100%;
    -webkit-transform: rotate(-15.489deg);
    -ms-transform: rotate(-15.489deg);
    transform: rotate(-15.489deg);
    position: relative;
    left: 0.75rem
}

.puzzle-group [class^="box"] {
    position: absolute
}

.puzzle-group [class^="box"] span {
    width: 100%;
    height: 100%;
    position: absolute;
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    -webkit-transition: all 0.4s;
    -o-transition: all 0.4s;
    transition: all 0.4s;
    -webkit-filter: drop-shadow(0 2px 2px rgba(0, 0, 0, 0.06));
    filter: drop-shadow(0 2px 2px rgba(0, 0, 0, 0.06))
}

.puzzle-group[puzzle-step="3"] [class^="box"] span {
    -webkit-filter: none;
    filter: none
}

.puzzle-group .box1 {
    top: 0;
    left: 0
}

.puzzle-group .box2 {
    top: 0;
    right: 0
}

.puzzle-group .box3 {
    bottom: 0;
    left: 0
}

.puzzle-group .box4 {
    bottom: 0;
    right: 0
}

.puzzle-group .box1 {
    width: 10.3rem;
    height: 12.3rem
}

.puzzle-group .box1 span {
    top: 0;
    left: 0;
    background: url(../../img/mmk/svg_common/puzzle/puzzle_piece01.svg) center center no-repeat;
    background-size: contain
}

.puzzle-group .box2 {
    width: 12.2rem;
    height: 10.3rem
}

.puzzle-group .box2 span {
    top: 0;
    left: 0;
    background: url(../../img/mmk/svg_common/puzzle/puzzle_piece02.svg) center center no-repeat;
    background-size: contain
}

.puzzle-group .box3 {
    width: 12.3rem;
    height: 10.3rem
}

.puzzle-group .box3 span {
    top: 0;
    left: 0;
    background: url(../../img/mmk/svg_common/puzzle/puzzle_piece03.svg) center center no-repeat;
    background-size: contain
}

.puzzle-group .box4 {
    width: 10.3rem;
    height: 12.2rem
}

.puzzle-group .box4 span {
    top: 0;
    left: 0;
    background: url(../../img/mmk/svg_common/puzzle/puzzle_piece04.svg) center center no-repeat;
    background-size: contain
}

.puzzle-group+.title-group {
    text-align: center
}

.puzzle-group+.title-group .title-field-page {
    font-size: 2.2rem;
    line-height: 3.1rem
}

.puzzle-group+.title-group .txt-guide {
    font-size: 1.5rem;
    margin-top: 0.8rem
}

.puzzle-group>.tooltip-focus-group {
    width: 100%;
    top: -5.5rem;
    left: 50%;
    -webkit-transform-origin: 50% top;
    -ms-transform-origin: 50% top;
    transform-origin: 50% top;
    -webkit-transform: translateX(-50%) rotate(-1deg);
    -ms-transform: translateX(-50%) rotate(-1deg);
    transform: translateX(-50%) rotate(-1deg);
    -webkit-animation: tooltip-shake 0.1s linear infinite;
    animation: tooltip-shake 0.1s linear infinite
}

@-webkit-keyframes tooltip-shake {
    0% {
        -webkit-transform: translateX(-50%) rotate(-1deg);
        transform: translateX(-50%) rotate(-1deg)
    }
    100% {
        -webkit-transform: translateX(-50%) rotate(1deg);
        transform: translateX(-50%) rotate(1deg)
    }
}

@keyframes tooltip-shake {
    0% {
        -webkit-transform: translateX(-50%) rotate(-1deg);
        transform: translateX(-50%) rotate(-1deg)
    }
    100% {
        -webkit-transform: translateX(-50%) rotate(1deg);
        transform: translateX(-50%) rotate(1deg)
    }
}

[fade-active-index="0"] .popup-row-content2-show {
    opacity: 0
}

[fade-active-index="1"] .popup-row-content2-show {
    opacity: 1;
    -webkit-transition: 0.8s;
    -o-transition: 0.8s;
    transition: 0.8s
}

[data-fade-wrap] [data-fade-item].fadeOn {
    display: block
}

[data-fade-wrap] [data-fade-item] {
    display: none;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s
}

.popup-dialog.prevent-event .popup-section {
    width: 100%;
    padding: 2rem;
    margin: auto
}

.popup-dialog.prevent-event .popup-section .popup-group {
    padding: 4.2rem 2rem 2rem;
    overflow-x: hidden;
    overflow-y: auto;
    max-height: 100%;
    border-radius: 1.2rem
}

.popup-dialog.prevent-event .popup-section .popup-group.bg-green-gradient {
    background: -webkit-gradient(linear, left top, left bottom, from(#e1fca8), color-stop(55.76%, #c8f866), to(#a2dd2b));
    background: -o-linear-gradient(top, #e1fca8 0, #c8f866 55.76%, #a2dd2b 100%);
    background: linear-gradient(180deg, #e1fca8 0, #c8f866 55.76%, #a2dd2b 100%)
}

.popup-dialog.prevent-event .popup-section .popup-group.bg-sky-solid {
    background: var(--color-bu50, #e0f2ff)
}

.popup-dialog.prevent-event .title-group .title-field-popup {
    font-size: 2rem;
    line-height: 2.5rem;
    font-weight: 500
}

.popup-dialog.prevent-event .title-group .title-field-popup.pn {
    color: var(--color-pn, #17008c);
    font-weight: 700
}

.popup-dialog.prevent-event .title-group .title-field-popup>strong {
    font-weight: bold;
    color: var(--color-bu700, #006aff)
}

.popup-dialog.prevent-event [class^="btn-lv"].divider-gray {
    background-color: var(--color-g300, #e0e0e0)
}

.popup-dialog.prevent-event .btn-group .darkgray1+.ico-arrow-link {
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

.popup-dialog.prevent-event .btn-group .primary1 .ico-arrow-link {
    -webkit-filter: var(--filter-w100);
    filter: var(--filter-w100)
}

.component-img-prevent {
    width: 11.8rem;
    margin: 1.2rem auto
}

.component-img-prevent img {
    width: 100%
}

.component-icon-slide-prd.prevent {
    margin-bottom: 2rem
}

.component-icon-slide-prd.prevent .bridgeCashback-list-wrapper .logo-slide-box .logo-img-box img {
    height: calc(189px/3);
    width: auto;
    margin: 0
}

.bl-txt-group.prevent>.txt {
    font-size: 0.6rem;
    line-height: 1.4rem;
    color: var(--color-g700, #7d7d7d)
}

.bl-txt-group.prevent>.txt+.txt {
    margin-top: 0.4rem
}

.component-text-icon .ico-edd-check {
    width: 12rem;
    height: 12rem;
    background: url("../../img/mmk/main/ico_my_unlock03.png") no-repeat;
    background-size: 12rem auto
}

.component-text-icon .ico-edd-lock {
    width: 12rem;
    height: 12rem;
    background: url("../../img/mmk/main/ico_my_unlock07.png") no-repeat;
    background-size: 12rem auto
}

.component-event-fest {
    margin-top: 0 !important;
    background-color: var(--color-w100, #fff)
}

.bingo-group .img-wrap img,
.component-event-fest .img-group img {
    width: 100%
}

.bingo-wrap {
    padding: 5rem 2rem;
    margin: 0 0.7rem;
    border-radius: 0 0 2.4rem 2.4rem;
    position: relative;
    background: #0b0046
}

.bingo-wrap [bingo-line] {
    position: absolute;
    top: 5rem;
    left: 2rem;
    right: 2rem;
    bottom: 6rem
}

.bingo-wrap .bingo-step-dim {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.88);
    z-index: 79;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border-radius: 0 0 2.4rem 2.4rem
}

.bingo-wrap .bingo-step-dim img {
    width: auto
}

.bingo-box {
    position: relative;
    display: grid;
    grid-gap: 1rem;
    grid-template-columns: 1fr 1fr 1fr;
    z-index: 2
}

.bingo-item {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    border-radius: 1rem;
    overflow: hidden
}

.bingo-item:after {
    content: '';
    display: block;
    padding-bottom: 100%
}

.bingo-btn {
    position: absolute;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    height: 100%;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.bingo-btn span {
    text-indent: -999em
}

:root .bingo-btn span {
    text-indent: 0
}

.bingo-btn.active:before {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1
}

.bingo-0to2:before {
    content: '';
    position: absolute;
    top: calc(33%/2 - 0.8rem);
    left: 0;
    display: block;
    width: 100%;
    height: 1rem;
    background: #c0fa4d
}

.bingo-0to6:before {
    content: '';
    position: absolute;
    top: 0;
    left: calc(33%/2 - 0.7rem);
    display: block;
    width: 1rem;
    height: 100%;
    background: #c0fa4d
}

.bingo-2to8:before {
    content: '';
    position: absolute;
    top: 0;
    right: calc(33%/2 - 0.8rem);
    display: block;
    width: 1rem;
    height: 100%;
    background: #c0fa4d
}

.bingo-1to7:before {
    content: '';
    position: absolute;
    top: 0;
    left: calc(50% - 0.5rem);
    display: block;
    width: 1rem;
    height: 100%;
    background: #c0fa4d
}

.bingo-3to5:before {
    content: '';
    position: absolute;
    top: 50%;
    left: 0;
    display: block;
    width: 100%;
    height: 1rem;
    background: #c0fa4d
}

.bingo-6to8:before {
    content: '';
    position: absolute;
    bottom: calc(33%/2 - 1.7rem);
    left: 0;
    display: block;
    width: 100%;
    height: 1rem;
    background: #c0fa4d
}

.bingo-0to8:before {
    content: '';
    position: absolute;
    top: 0;
    left: calc(50% - 1rem);
    display: block;
    width: 1rem;
    height: 100%;
    background: #c0fa4d;
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg)
}

.bingo-6to2:before {
    content: '';
    position: absolute;
    top: 0;
    right: calc(50% - 0.7rem);
    display: block;
    width: 1rem;
    height: 100%;
    background: #c0fa4d;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg)
}

.bingo-count-wrap {
    padding: 0 2rem
}

.bingo-count-wrap .title {
    background: #e2f3ff;
    border-radius: 0.8rem;
    padding: 1rem 0;
    width: 100%;
    font-size: 1.6rem;
    color: var(--color-pb100, #000);
    text-align: center;
    font-weight: 700;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: distribute;
    justify-content: space-around
}

.bingo-count-wrap .title strong {
    font-weight: bold;
    color: #085efe
}

.bingo-count-box {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.bingo-count-box .txt {
    font-size: 1.6rem;
    line-height: 2.1rem;
    text-align: center;
    -ms-flex-preferred-size: 50%;
    flex-basis: 50%;
    padding: 2rem 0 6rem;
    color: var(--color-pb100, #000)
}

.bingo-count-box .txt span {
    font-size: 3.2rem;
    font-weight: bold;
    display: block;
    padding-top: 0.5rem;
    color: #085efe
}

.btn-scroll-top {
    display: none;
    position: fixed;
    bottom: -4rem;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    width: 4.4rem;
    height: 4.4rem;
    border-radius: 99rem;
    background-color: var(--color-w100, #fff);
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-shadow: 0 0.2rem 0.8rem 0 rgba(0, 0, 0, 0.16);
    box-shadow: 0 0.2rem 0.8rem 0 rgba(0, 0, 0, 0.16);
    z-index: 1;
    opacity: 0;
    margin-bottom: -4rem;
    -webkit-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s
}

.btn-scroll-top.active {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    opacity: 1;
    bottom: 2.4rem;
    margin-bottom: 0;
    -webkit-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s
}

.btn-scroll-top [class*="ico"] {
    width: 2.4rem;
    height: 2.4rem
}

.component-btn.fixed-bottom:not([style*=none])~.btn-scroll-top {
    margin-bottom: 9rem;
    z-index: 2
}

.gold-logo-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    margin-bottom: 2.4rem
}

.gold-logo-box .ico-close-popup {
    width: 1.6rem;
    height: 1.6rem;
    -webkit-filter: var(--filter-g500);
    filter: var(--filter-g500);
    margin: 0 0.4rem 0 0.8rem
}

.trip-logo-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    margin-bottom: 2.4rem
}

.component-coupon.trip {
    padding-top: 4.8rem;
    padding-bottom: 0
}

.component-coupon.trip .item-subject span {
    color: var(--color-g900, #141414);
    -o-text-overflow: initial;
    text-overflow: initial
}

.component-coupon.trip .coupon-group+.coupon-group {
    margin-top: 2.6rem
}

/*! component element component-banner */

.component-banner.bg-gray {
    background: var(--color-g100, #f8f8f8)
}

.general-seach-title {
    padding: 0.4rem 0 0.8rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.no-space .general-seach-title {
    padding: 0 2rem 0.8rem
}

.general-seach-title .title {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 1.5rem;
    color: var(--txt-quin);
    line-height: 2rem;
    font-weight: 500;
    margin-top: .4rem
}

.general-seach-title .title>p {
    display: inline;
    font-weight: 500;
    margin-right: -0.3rem
}

.general-seach-title .input-checkbox-group .input-checkbox {
    width: auto;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-right: 0 !important
}

.general-seach-title .input-checkbox-group .checkbox-txt-field {
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.general-seach-title .input-checkbox-group .txt-lv04 {
    color: var(--txt-sec)
}

.general-seach-title .checkbox-shape-line {
    width: 2rem;
    margin: -0.3rem 0.4re 0 0
}

.general-seach-title .checkbox-shape-line:after {
    left: 0;
    width: 1.4rem;
    height: 1.4rem;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%)
}

.general-seach-title .input-checkbox input:checked+.checkbox-shape-line+.checkbox-txt-field .txt-lv04 {
    color: var(--color-grey-g1000)
}

.general-seach-title .title+div.on .input-checkbox-group .txt-lv04 {
    color: var(--txt-sec-active)
}

.general-seach-title .title+div.on .checkbox-shape-line:after {
    background-image: var(--path-checkbox-line-active)
}

.general-seach-title .input-checkbox input:checked+.checkbox-shape-line+.checkbox-txt-field .txt-lv04 {
    color: var(--txt-sec)
}

.general-seach-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.general-seach-item .general-seach-keyword {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    padding: 0.8rem 2rem 0.8rem 2rem;
    height: 5.3rem;
    line-height: 3.7rem
}

.general-seach-item .general-seach-keyword .txt {
    font-size: 1.6rem;
    line-height: 2.1rem;
    color: var(--txt-pri);
    font-weight: 400
}

.general-seach-item .general-seach-keyword .icon {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-right: 0.9rem;
    width: 3.2rem;
    height: 3.2rem;
    vertical-align: middle;
    border-radius: 99rem;
    background-color: var(--bg-ter)
}

.general-seach-item .general-seach-keyword .icon [class^="ico"] {
    width: 1.6rem;
    height: 1.6rem;
    -webkit-filter: var(--filter-ico-ter);
    filter: var(--filter-ico-ter)
}

.general-seach-item .general-seach-keyword .txt .key-w {
    color: var(--txt-accent-sec);
    font-weight: 700
}

.general-seach-item.recent .general-seach-keyword .txt {
    font-weight: 500
}

.general-seach-item .btn-delete {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding: 0 2rem;
    height: 5.3rem
}

.general-seach-item .btn-delete .ico-delete {
    width: 1.6rem;
    height: 1.6rem;
    -webkit-filter: var(--filter-ico-ter);
    filter: var(--filter-ico-ter)
}

.list-menu-title {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.list-menu-title .title {
    font-size: 1.5rem;
    color: var(--txt-pri);
    font-weight: 700;
    line-height: 2rem
}

.evt-challengebox .card-group .tag.w100 {
    width: auto !important
}

.evt-challengebox-visual {
    position: relative;
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    min-height: calc(100vh - 5rem);
    text-align: center;
    background: -o-linear-gradient(282deg, #9bf9ff 0, #e2f0fd 22.42%, #d4f1ff 78.18%);
    background: linear-gradient(168deg, #9bf9ff 0, #e2f0fd 22.42%, #d4f1ff 78.18%)
}

.evt-challengebox-visual:before {
    content: '';
    display: block;
    position: absolute;
    top: 6.6rem;
    left: 2rem;
    width: calc(100% - 4rem);
    height: 100vh;
    background: url("/resource/img/mmk/common/evt/main_img.png") center 0 no-repeat;
    background-size: 100% auto
}

.evt-challengebox-visual>* {
    position: relative
}

.evt-challengebox-visual img {
    width: 100%
}

.evt-challengebox-visual .logo01 {
    margin-top: 2.2rem;
    width: 19rem;
    height: 2.4rem
}

.evt-challengebox-visual .txt01 {
    margin-top: 7.2rem;
    width: 12rem;
    height: 6rem
}

.evt-challengebox-visual .txt02 {
    line-height: 5rem;
    font-size: 4.2rem;
    font-weight: 700;
    letter-spacing: -0.084rem;
    color: #000
}

.evt-challengebox-visual .txt02 span {
    color: #4262ff
}

.evt-challengebox-visual .txt03 {
    margin-top: 1.8rem;
    line-height: 2.2rem;
    font-size: 1.4rem;
    font-weight: 500;
    letter-spacing: -0.028rem;
    color: #000
}

.evt-challengebox-visual .txt03 span {
    font-weight: 700
}

.evt-challengebox-visual .sticker01 {
    position: absolute;
    right: -2.8rem;
    bottom: 1.4rem;
    width: 11.7rem;
    height: 10rem;
    z-index: 2
}

.evt-challengebox-visual .sticker02 {
    position: absolute;
    left: -1.3rem;
    top: -1.6rem;
    width: 10.7rem;
    height: 11.2rem
}

.evt-challengebox-visual .virtual-asset-wrap {
    position: relative;
    overflow: hidden;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -ms-flex: 1 0 auto;
    flex: 1 0 auto;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding-top: .5rem;
    padding-bottom: 3.7rem
}

.evt-challengebox-visual .virtual-asset {
    position: relative;
    overflow: hidden;
    width: 100%;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 27.6rem
}

.evt-challengebox-visual .virtual-asset .img-slide-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: relative;
    z-index: 1
}

.evt-challengebox-visual .virtual-asset .img-slide-box .img-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: relative;
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    transform: translate(0, 0);
    -webkit-animation: evt-left0to-50 60s linear infinite both;
    animation: evt-left0to-50 60s linear infinite both
}

.evt-challengebox-visual .virtual-asset.ani-none .img-slide-box .img-box {
    -webkit-animation: none;
    animation: none
}

.evt-challengebox-visual .virtual-asset .img-slide-box .img-box .img {
    display: inline-block;
    width: 21rem;
    height: 27.6rem;
    margin: 0 0.5rem
}

.evt-challengebox-visual img {
    width: 100%
}

@-webkit-keyframes evt-left0to-50 {
    0% {
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0)
    }
    100% {
        -webkit-transform: translate(-100%, 0);
        transform: translate(-100%, 0)
    }
}

@keyframes evt-left0to-50 {
    0% {
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0)
    }
    100% {
        -webkit-transform: translate(-100%, 0);
        transform: translate(-100%, 0)
    }
}

.evt-challengebox-visual.v2 {
    padding-bottom: 9rem;
    background: -o-linear-gradient(282deg, #befbff 0, #d5ffdc 22.42%, #e2fffd 78.18%);
    background: linear-gradient(168deg, #befbff 0, #d5ffdc 22.42%, #e2fffd 78.18%)
}

.evt-challengebox-visual.v2:before {
    background-image: url("/resource/img/mmk/common/evt/main_img2.svg")
}

.evt-challengebox-visual.v2 .virtual-asset {
    position: static
}

.evt-challengebox {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 8rem 0 8rem
}

.evt-challengebox .evt-swiper-tit {
    font-size: 3.2rem;
    line-height: 4.2rem;
    color: var(--color-grey-g1000);
    text-align: center;
    font-weight: 800
}

.evt-challengebox .evt-swiper-txt {
    margin-top: 4rem;
    font-size: 2rem;
    line-height: 2.8rem;
    color: var(--color-grey-g1000);
    text-align: center;
    font-weight: 500;
    letter-spacing: -0.04rem
}

.evt-challengebox .evt-swiper-txt span {
    color: #4262ff;
    font-weight: 700
}

.evt-challengebox .evt-swiper-group01 {
    margin-top: 4rem
}

.evt-challengebox .swiper-slide {
    width: 100%;
    max-width: 21rem
}

.evt-challengebox .card-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 3.5rem 1.6rem;
    width: 21rem;
    height: 24.2rem;
    border: 0;
    border-radius: 2rem;
    background: #49cc93
}

.evt-challengebox .card-group .row .emoji {
    font-size: 2.4rem;
    line-height: 4rem
}

.evt-challengebox .card-group .row .tit {
    font-size: 2.4rem;
    font-weight: 700;
    line-height: 3rem;
    color: var(--color-w100)
}

.evt-challengebox .card-group .row .txt {
    margin-top: .6rem;
    font-size: 1.6rem;
    font-weight: 400;
    letter-spacing: 0.016rem;
    line-height: 2.2rem;
    color: var(--color-w100);
    opacity: .6
}

.evt-challengebox .card-group .tag-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.evt-challengebox .card-group .tag {
    height: 2.2rem
}

.evt-challengebox .card-group .tag+.tag {
    margin-left: .6rem
}

.evt-challengebox .card-group .tag .txt {
    font-size: 1.2rem;
    font-weight: 700;
    color: #49cc93
}

.evt-challengebox .swiper-slide.n01 .card-group {
    background: #00a88c
}

.evt-challengebox .swiper-slide.n01 .card-group .tag .txt {
    color: #00a88c
}

.evt-challengebox .swiper-slide.n02 .card-group {
    background: #6c87fe
}

.evt-challengebox .swiper-slide.n02 .card-group .tag .txt {
    color: #6c87fe
}

.evt-challengebox .swiper-slide.n03 .card-group {
    background: #3e9ae6
}

.evt-challengebox .swiper-slide.n03 .card-group .tag .txt {
    color: #3e9ae6
}

.evt-challengebox .swiper-slide.n04 .card-group {
    background: #4262ff
}

.evt-challengebox .swiper-slide.n04 .card-group .tag .txt {
    color: #4262ff
}

.evt-challengebox .swiper-slide.n05 .card-group {
    background: #ef5897
}

.evt-challengebox .swiper-slide.n05 .card-group .tag .txt {
    color: #ef5897
}

.evt-challengebox .swiper-slide.last-ty .card-group {
    border: 2px solid #4262ff;
    background: #fff;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.evt-challengebox .swiper-slide.last-ty .card-group .row .tit {
    color: #4262ff
}

.evt-challengebox .swiper-slide.last-ty .card-group .row .txt {
    color: #000;
    opacity: 1
}

.evt-challengebox .swiper-pagination {
    margin-top: 2rem
}

.evt-challengebox .btn-lv03 {
    margin-top: 2rem;
    padding: 0 1.5rem;
    height: 3.4rem
}

.evt-challengebox .btn-lv03 .ico-arrow-sbr {
    -webkit-filter: var(--filter-w100);
    filter: var(--filter-w100)
}

.evt-challengebox02 {
    padding: 8rem 1.6rem;
    background: #4262ff
}

.evt-challengebox02 img {
    width: 100%
}

.evt-challengebox02 .evt-tit {
    font-size: 3.2rem;
    line-height: 4.2rem;
    font-weight: 700;
    text-align: center;
    color: #fff
}

.evt-challengebox02 .evt-tit div {
    margin-bottom: 1.4rem;
    font-size: 2rem;
    line-height: 2.2rem;
    font-weight: 500
}

.evt-challengebox02 .evt-box {
    margin-top: 4rem;
    padding: 2.8rem 2rem;
    border-radius: 2rem;
    background: #fff
}

.evt-challengebox02 .evt-box+.evt-box {
    margin-top: 1.6rem
}

.evt-challengebox02 .evt-box .txt01 {
    display: inline-block;
    padding: 0 1rem;
    height: 3rem;
    line-height: 3rem;
    color: var(--color-g900);
    font-size: 1.5rem;
    font-weight: 500;
    border-radius: 2rem;
    background: #b6f23d
}

.evt-challengebox02 .evt-box .txt02 {
    margin-top: 1.4rem;
    font-size: 2.6rem;
    font-weight: 700;
    line-height: 3.2rem;
    color: var(--color-grey-g1000)
}

.evt-challengebox02 .evt-box .txt02 span {
    color: #4262ff
}

.evt-challengebox02 .evt-box .txt03 {
    margin-top: 1rem;
    font-size: 1.6rem;
    font-weight: 400;
    line-height: 2.2rem;
    color: var(--color-grey-g1000)
}

.evt-challengebox02 .evt-box .img01 {
    margin: 2rem auto 0;
    width: 30rem
}

.evt-challengebox02 .evt-box .txt04 {
    padding-bottom: 1rem;
    font-size: 1.2rem;
    font-weight: 400;
    line-height: 1.8rem;
    color: var(--color-grey-g1000);
    text-align: center
}

.evt-challengebox02 .evt-box .swiper-container {
    padding: 0
}

.evt-challengebox02 .evt-box .swiper-slide .img {
    margin: 2rem auto 0;
    width: 28.4rem
}

.evt-challengebox02 .evt-box .swiper-slide p {
    color: var(--color-grey-g1000);
    text-align: center
}

.evt-challengebox02 .evt-box .swiper-slide .tit {
    margin-top: 2rem;
    font-size: 1.8rem;
    font-weight: 700;
    line-height: 2.4rem;
    letter-spacing: -0.036rem
}

.evt-challengebox02 .evt-box .swiper-slide .txt {
    margin-top: 1rem;
    font-size: 1.2rem;
    font-weight: 400;
    line-height: 1.8rem
}

.evt-challengebox02 .evt-box .swiper-pagination {
    margin-top: 4rem
}

.evt-challengebox03 {
    padding: 8rem 1.6rem
}

.evt-challengebox03 img {
    width: 100%
}

.evt-challengebox03 .evt-tit {
    font-size: 3.2rem;
    line-height: 4.2rem;
    font-weight: 700;
    text-align: center;
    color: var(--color-grey-g1000)
}

.evt-challengebox03 .evt-tit div {
    margin-bottom: 1.4rem;
    font-size: 2rem;
    line-height: 2.2rem;
    font-weight: 500
}

.evt-challengebox03 .evt-box {
    position: relative
}

.evt-challengebox03 .evt-box .img01 {
    margin: 4rem auto 0;
    width: 22.4rem;
    height: 20rem
}

.evt-challengebox03 .evt-box .txt01 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: absolute;
    top: 1rem;
    left: calc(50% + 3.5rem);
    width: 7rem;
    height: 7rem
}

.evt-challengebox03 .evt-box .txt02 {
    margin-top: 2rem;
    font-size: 1.6rem;
    font-weight: 400;
    line-height: 2.2rem;
    letter-spacing: -0.032rem;
    text-align: center
}

.evt-challengebox03 .evt-box .txt02 span {
    font-weight: 700
}

.evt-challengebox04 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 2.6rem 2rem 2.6rem 2.6rem;
    height: 16.9rem;
    background: #dbf7ff
}

.evt-challengebox04.v2 {
    background: #d5ffdc
}

.evt-challengebox04 img {
    width: 100%
}

.evt-challengebox04 .t01 {
    margin-top: .9rem;
    padding: 0 1rem;
    height: 3rem;
    line-height: 3rem;
    background: #2055f6;
    border-radius: 2rem;
    font-size: 1.4rem;
    font-weight: 500;
    color: #fff
}

.evt-challengebox04 .t02 {
    margin-top: 1rem;
    padding-left: .6rem;
    font-size: 2.4rem;
    font-weight: 700;
    line-height: 3rem;
    color: #000
}

.evt-challengebox04 .t02 span {
    color: #2055f6
}

.evt-challengebox04 .img01 {
    width: 15rem;
    height: 12.8rem
}

.component-evt-soldout {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.9);
    z-index: 79
}

.component-evt-soldout .cont {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.component-evt-soldout .cont>div {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.component-evt-soldout .cont img {
    width: 23.5rem
}

.component-evt-soldout p {
    margin-top: 1rem;
    color: #fff;
    text-align: center
}

.component-evt-soldout .t1 {
    font-size: 2.2rem;
    font-weight: 700;
    line-height: 2.6rem;
    letter-spacing: -0.044rem
}

.component-evt-soldout .t2 {
    font-size: 2rem;
    font-weight: 500;
    line-height: 2.6rem
}

.component-evt-soldout .t2 span {
    color: #b6f23d
}

.component-evt-soldout .t3 {
    font-size: 1.8rem;
    font-weight: 500;
    line-height: 2.6rem
}

.component-evt-soldout .t3 span {
    color: #b6f23d;
    font-weight: 700
}

.component-folding-banner {
    margin: 0 0 2.4rem !important;
    background-color: var(--bg-qua)
}

.folding-wrap.type02 {
    margin-top: 0;
    text-align: left;
    padding: 1.8rem 0
}

.folding-wrap.type02 .btn-arrow {
    width: 100%
}

.folding-wrap.type02 .ico-arrow-open {
    margin-left: auto
}

.folding-wrap.type02 .txt-detail {
    padding-left: .6rem;
    font-size: 1.5rem;
    font-weight: 500;
    line-height: 2rem;
    color: var(--txt-sec)
}

.folding-wrap.type02 .ico-arrow-open {
    -webkit-filter: var(--filter-color-grey-g700);
    filter: var(--filter-color-grey-g700)
}

.folding-wrap.type02 .folding-box {
    padding: 0;
    border-radius: unset;
    margin-top: 0
}

.folding-wrap.type02 .folding-info-txt {
    padding-left: 2.6rem;
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--txt-qua)
}

.text-btn-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 2.4rem 2rem;
    background-color: var(--bg-qua);
    border-radius: 1.2rem;
    text-align: center
}

.text-btn-box .text {
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--txt-ter)
}

.text-btn-box .btn-group {
    margin-top: 1.6rem
}

.text-btn-box .btn-group [class^="btn-"] {
    -webkit-box-flex: 0;
    -ms-flex: 0;
    flex: 0
}

.text-btn-box.type1 {
    padding: 3.2rem 2rem;
    border-radius: 1.6rem
}

.component-plusbox-recommend {
    position: relative;
    margin-top: 8rem
}

.component-plusbox-recommend:after {
    content: '';
    display: block;
    width: 4.2rem;
    height: 100%;
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: 1;
    background: -webkit-gradient(linear, right top, left top, color-stop(48.41%, #fff), to(rgba(255, 255, 255, 0)));
    background: -o-linear-gradient(right, #fff 48.41%, rgba(255, 255, 255, 0) 100%);
    background: linear-gradient(270deg, #fff 48.41%, rgba(255, 255, 255, 0) 100%)
}

.component-plusbox-recommend .txt-lv02 {
    padding-bottom: 1.6rem
}

.plusbox-swiper-group .swiper-slide {
    width: auto
}

.plusbox-swiper-group .swiper-container {
    padding-right: 2.2rem
}

.plusbox-swiper-group+.plusbox-swiper-group {
    padding-top: 1.2rem
}

.plusbox-recommend-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: .4rem;
    padding: 0.6rem 1.2rem;
    border-radius: 99rem;
    background-color: var(--color-grey-g200)
}

.plusbox-recommend-item .txt {
    font-size: 1.4rem;
    color: var(--txt-qua);
    line-height: 2rem;
    font-weight: 500
}

.col4-list-group {
    width: 100%
}

.col4-list-group ul {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 1rem
}

.col4-list-group ul li {
    width: calc(calc(100%/4 - 0.8rem))
}

.plus-box-document {
    padding-top: 2.4rem
}

.plus-box-document .title {
    background-color: var(--bg-qua);
    border-radius: 1.6rem;
    padding: 1.6rem 2rem;
    text-align: center;
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 700
}

.plus-box-document-box {
    position: relative;
    background-color: var(--bg-qua);
    border-radius: 1.6rem;
    padding: 2.4rem 2rem;
    margin-top: 0.8rem
}

.plus-box-document-box:after {
    content: '';
    display: block;
    position: absolute;
    top: -1.6rem;
    left: 50%;
    margin-left: -1.6rem;
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
    width: 3.2rem;
    height: 3.2rem;
    background: #fff var(--path-line-arrow-left) center center no-repeat;
    background-size: 1.8rem 1.8rem;
    border-radius: 99rem
}

.plus-box-document-box li+li {
    padding-top: 1.6rem
}

.plus-box-document-box dl {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.plus-box-document-box dl dt {
    font-size: 1.4rem;
    color: var(--txt-qua);
    line-height: 2rem;
    font-weight: 400
}

.plus-box-document-box dl dt span {
    display: block;
    font-size: 1.6rem;
    font-weight: 700;
    color: var(--txt-sec)
}

.text-pb-interest-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    padding: 0.6rem 0 2rem
}

.text-pb-interest-group .text-column [class^="text-column-item"] {
    display: block
}

.text-pb-interest-group .text-column .text-column-item01 {
    font-size: 2.8rem;
    color: var(--txt-pri);
    line-height: 3.6rem;
    font-weight: 700
}

.text-pb-interest-group .text-column .text-column-item02 {
    font-size: 1.4rem;
    color: var(--txt-ter);
    line-height: 2rem;
    font-weight: 400;
    margin-top: 0.4rem
}

.text-pb-interest-info {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 100%;
    height: 4.4rem;
    background-color: var(--bg-qua);
    border-radius: 1rem;
    margin: -0.4rem 0 2.4rem
}

.text-pb-interest-info .txt {
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--txt-ter);
    font-weight: 500
}

.text-pb-interest-info .txt .ico-coin {
    margin: -0.3rem 0.4rem 0 0;
    width: 2rem;
    height: 2rem;
    -webkit-filter: var(--filter-ico-ter);
    filter: var(--filter-ico-ter)
}

.text-group-f28 {
    margin-top: 0.4rem
}

.text-group-f28 .txt {
    font-size: 2.8rem;
    color: var(--txt-pri);
    font-weight: bold;
    line-height: 3.6rem
}

.component-accordion.pb-type .list-linebox-group .col-state .ico-arrow-open {
    width: 1.6rem;
    height: 1.6rem;
    -webkit-filter: var(--filter-ico-sec);
    filter: var(--filter-ico-sec)
}

.text-icon-group .pb-icon-wrap {
    width: 12rem;
    height: 12rem;
    margin: 0 auto
}

.text-icon-group .pb-icon-wrap.type2 {
    width: 6.4rem
}

.text-icon-group .pb-icon-wrap img {
    width: 100%
}

.graph-loan-repay-group {
    margin-top: 1.6rem
}

.graph-loan-repay-group .repay-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.graph-loan-repay-group .repay-box .repay-item {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    height: 3.6rem;
    line-height: 3.6rem;
    font-size: 1.4rem;
    color: var(--txt-pri-invert);
    font-weight: 500;
    text-align: center
}

.graph-loan-repay-group .repay-box .repay-item01 {
    background-color: var(--bg-accent-pri);
    border-radius: 0.4rem 0 0 0.4rem
}

.graph-loan-repay-group .repay-box .repay-item02 {
    background-color: var(--bg-sec);
    border-radius: 0 0.4rem 0.4rem 0
}

.graph-loan-repay-arrow {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.graph-loan-repay-arrow span {
    padding: 1.6rem 0 1.65rem
}

.graph-loan-repay-arrow span:before {
    content: '';
    display: block;
    width: 1.5rem;
    height: 1.5rem;
    border-bottom: 2px solid #0a5bcd;
    border-right: 2px solid #0a5bcd;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    opacity: 0.3
}

.graph-loan-repay-arrow span:after {
    content: '';
    display: block;
    width: 1.5rem;
    height: 1.5rem;
    border-bottom: 2px solid #0a5bcd;
    border-right: 2px solid #0a5bcd;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    margin-top: -4px
}

.graph-repay-label-group {
    padding-top: 1.2rem
}

.graph-repay-label-group ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.graph-repay-label-group ul li+li {
    padding-left: 1.6rem
}

.graph-repay-label-group span {
    font-size: 1.2rem;
    font-weight: 400;
    color: var(--txt-qua);
    line-height: 1.6rem
}

.graph-repay-label-group span::before {
    content: '';
    display: inline-block;
    vertical-align: middle;
    margin-right: 0.4rem;
    width: 1.2rem;
    height: 1.2rem;
    border-radius: 99rem
}

.graph-repay-label-group ul li.label1 span::before {
    background-color: var(--bg-accent-pri)
}

.graph-repay-label-group ul li.label2 span::before {
    background-color: var(--bg-sec);
    border: 1px solid var(--color-pb5)
}

.component-obpage01 {
    position: relative;
    margin-top: 0 !important;
    padding: 5.7rem 2rem 11.4rem;
    height: calc(100vh - 5rem);
    background: var(--color-pb100)
}

.component-obpage01 img {
    width: 100%
}

.component-obpage01 .bg-group {
    height: 100%
}

.component-obpage01 .bg-group>div {
    overflow: hidden;
    width: 100%;
    height: 100%
}

.component-obpage01 .bg-group>div>img {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 222vw;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.component-obpage01 .bg-back {
    position: absolute;
    top: 0;
    left: 0
}

.component-obpage01 .bg-back>img {
    -webkit-filter: blur(20px);
    filter: blur(20px)
}

.component-obpage01 .bg-back:after {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.7)
}

.component-obpage01 .bg-front {
    position: relative;
    border-radius: 1.2rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.component-obpage01 .bg-front:after {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.26)
}

.component-obpage01 .bg-front>img {
    -webkit-transition: all .6s ease-in;
    -o-transition: all .6s ease-in;
    transition: all .6s ease-in
}

.component-obpage01 .bg-front p {
    position: absolute;
    top: 1rem;
    left: 1.4rem;
    font-size: 1.2rem;
    line-height: 1.6rem;
    color: var(--color-w100);
    z-index: 1
}

.component-obpage01 .bg-front .inner {
    position: relative;
    z-index: 1
}

.component-obpage01 .top-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    position: absolute;
    top: 2rem;
    left: 2rem;
    width: calc(100% - 4rem)
}

.component-obpage01 .top-group:before {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    left: 7rem;
    width: calc(100% - 14rem);
    height: .1rem;
    background: var(--color-w50)
}

.component-obpage01 .top-group .logo {
    width: 5rem
}

.component-obpage01 .top-group .txt {
    display: block;
    line-height: 1.7rem;
    font-size: 1.4rem;
    color: var(--color-w50)
}

.component-obpage01 .bottom-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: absolute;
    bottom: 4.5rem;
    left: 2rem;
    width: calc(100% - 4rem);
    z-index: 1
}

.component-obpage01 .bottom-group:after {
    content: '';
    display: block;
    margin-top: 2rem;
    width: 1.8rem;
    height: .6rem;
    background: url(/resource/img/mmk/common/onboarding/kv_arrow.svg) 0 0 no-repeat;
    background-size: contain
}

.component-obpage01 .bottom-group .txt {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-item-align: center;
    align-self: center;
    font-size: 1.4rem;
    line-height: 1.7rem;
    color: var(--color-w100)
}

.component-obpage01 .bottom-group .txt img {
    width: 1rem;
    height: 1.4rem
}

.component-obpage01 .bottom-group .txt span {
    padding: 0 .7rem
}

.obpage.component-btn.fixed-bottom {
    opacity: 0;
    -webkit-transition: opacity .2s ease-in;
    -o-transition: opacity .2s ease-in;
    transition: opacity .2s ease-in;
    display: none
}

.page-inner-scroll.scrolling .component-obpage01 .bg-front>img {
    -webkit-transform: translate(-50%, -50%) scale(120%);
    -ms-transform: translate(-50%, -50%) scale(120%);
    transform: translate(-50%, -50%) scale(120%)
}

.page-inner-scroll.scrolling .obpage.component-btn.fixed-bottom {
    opacity: 1;
    display: block
}

.component-obpage02 {
    position: relative;
    padding: 12rem 2rem
}

.component-obpage02 .txt-group {
    position: relative;
    display: block;
    padding-right: 4.7rem
}

.component-obpage02 .txt1 {
    font-size: 2.2rem;
    line-height: 2.6rem;
    margin-bottom: 1rem
}

.component-obpage02 .txt2 {
    font-size: 3.4rem;
    line-height: 4.1rem;
    font-weight: 700
}

.component-obpage02 .txt3 {
    font-size: 3.4rem;
    line-height: 4.1rem;
    color: var(--txt-pri-down);
    font-weight: 700
}

.component-obpage02 p {
    position: relative;
    font-size: 1.8rem;
    line-height: 2.6rem
}

.component-obpage02 .img-group {
    overflow: hidden;
    position: relative;
    width: 100%;
    height: 64vw;
    margin: 4rem 0;
    border-radius: 1.2rem
}

.component-obpage02 .img-group>img {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 117vw;
    -webkit-transform: translate(-50%, -50%) scale(120%);
    -ms-transform: translate(-50%, -50%) scale(120%);
    transform: translate(-50%, -50%) scale(120%);
    -webkit-transition: all .6s ease-out;
    -o-transition: all .6s ease-out;
    transition: all .6s ease-out
}

.component-obpage02 .inScroll.img-group>img {
    -webkit-transform: translate(-50%, -50%) scale(100%);
    -ms-transform: translate(-50%, -50%) scale(100%);
    transform: translate(-50%, -50%) scale(100%);
    -webkit-transition: all .6s .2s ease-out;
    -o-transition: all .6s .2s ease-out;
    transition: all .6s .2s ease-out
}

.component-obpage02.ty02 {
    padding-top: 6rem
}

.component-obpage02.ty02 .img-group>img {
    width: 176vw
}

.component-obpage02.ty02:before {
    content: '';
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 32.3rem;
    background: var(--bg-pri-base-invert)
}

.component-obpage02.ty02 p {
    color: var(--color-w100)
}

.component-obpage02.ty03 .img-group>img {
    width: 113vw
}

.component-obpage02.ty04 {
    padding-top: 6rem
}

.component-obpage02.ty04 .txt1 {
    margin-bottom: 0;
    font-size: 3.8rem;
    line-height: 4.5rem;
    font-weight: 700
}

.component-obpage02.ty04 .txt4 {
    font-size: 2.4rem;
    line-height: 2.6rem;
    letter-spacing: -0.048rem;
    font-weight: 700
}

.component-obpage02.ty04 p {
    margin-top: 2rem
}

.component-obpage02.ty04 .img-group {
    margin-top: 2rem
}

.component-obpage02.ty04 .img-group>img {
    width: 140vw
}

.component-obpage03 {
    padding: 0;
    position: relative
}

.component-obpage03 .txt-group {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 58.8rem;
    text-align: center
}

.component-obpage03 .txt-group .txt1 {
    display: inline-block;
    padding: 0 1.2rem;
    height: 3.4rem;
    line-height: 3.4rem;
    font-size: 1.6rem;
    font-weight: 700;
    color: var(--color-pb100);
    background: var(--color-w100);
    border-radius: 2rem
}

.component-obpage03 .txt-group .txt2 {
    display: inline-block;
    margin-top: 2rem;
    line-height: 4.8rem;
    font-size: 3.8rem;
    font-weight: 700;
    color: var(--color-w100)
}

.component-obpage03 .bg-group {
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 58.8rem
}

.component-obpage03 .bg-group>img {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 208vw;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    -webkit-transition: all .6s ease-in;
    -o-transition: all .6s ease-in;
    transition: all .6s ease-in
}

.component-obpage03 .inScroll.bg-group>img {
    width: 180vw;
    -webkit-transition: all .6s .2s ease-in;
    -o-transition: all .6s .2s ease-in;
    transition: all .6s .2s ease-in
}

.component-obpage03 .bg-group:after {
    content: '';
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: var(--color-pb50)
}

.component-obpage03 p {
    padding: 2rem;
    font-size: 1.2rem;
    line-height: 1.4rem;
    text-align: center
}

.btn-obpage-move {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 2.2rem;
    height: 7.4rem;
    background: url(/resource/img/mmk/common/onboarding/arrow_icon.svg) right calc(100% - .8rem) no-repeat;
    background-size: 1.2rem auto
}

.component-obpage02.ty04 .btn-obpage-move {
    height: 3.7rem
}

.component-progress-mission {
    margin-top: 7.8rem
}

.progress-mission-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%
}

.progress-mission-group .progress-txt-top {
    font-size: 1.2rem;
    line-height: 1.6rem;
    font-weight: 400;
    text-align: right;
    color: var(--txt-pri-down)
}

.progress-mission-group .progress-bar {
    overflow: hidden;
    position: relative;
    width: 100%;
    border-radius: 99rem;
    margin-top: 0.8rem;
    height: 1rem;
    background-color: var(--color-g300)
}

.progress-mission-group .progress-bar .progress-value {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    background-color: var(--ico-cursor)
}

.progress-mission-group .progress-txt-btm {
    margin-top: 0.8rem;
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    text-align: center;
    color: var(--txt-qua)
}

.section-component.ceo-recommend {
    margin-top: 3.2rem;
    padding: 4rem 0 4.4rem;
    background-color: var(--bg-qua);
    overflow: hidden
}

.section-component.ceo-recommend .component-card {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.section-component.ceo-recommend .card-group {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    padding: 1.6rem 1.6rem 2rem;
    border-radius: 1.6rem;
    border: none;
    -webkit-box-shadow: 0 0.4rem 2rem 0 rgba(0, 0, 0, 0.05);
    box-shadow: 0 0.4rem 2rem 0 rgba(0, 0, 0, 0.05)
}

.section-component.ceo-recommend .card-group+.card-group {
    margin-left: 1rem;
    margin-top: 0
}

.section-component.ceo-recommend .card-header {
    margin-bottom: 1.2rem;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.section-component.ceo-recommend .card-header .card-tit {
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--txt-sec)
}

.section-component.ceo-recommend .card-txt {
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 700
}

.section-component.ceo-recommend .card-txt>i {
    -webkit-filter: var(--filter-ico-ter);
    filter: var(--filter-ico-ter)
}

.section-component.ceo-recommend .kds-banner-card {
    -webkit-box-shadow: 0 0.4rem 2rem 0 var(--color-black-pb100-op5);
    box-shadow: 0 0.4rem 2rem 0 var(--color-black-pb100-op5)
}

.title-group.custom-policy {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.title-group.custom-policy .new-alarm {
    margin-left: 0.4rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 1.6rem;
    height: 1.6rem;
    border-radius: 99rem;
    background-color: var(--bg-pri-mark)
}

.title-group.custom-policy .new-alarm .txt {
    font-size: 0.9rem;
    font-weight: 700;
    line-height: 0.8rem;
    color: var(--txt-pri-invert);
    word-break: break-all
}

.custom-policy-nodata {
    padding: 3.2rem 0 1.2rem 0;
    text-align: center
}

.custom-policy-nodata.type2 {
    padding: 4rem 0 2rem 0;
    text-align: center
}

.custom-policy-nodata p {
    margin-top: 1.2rem
}

.component-nodata.custom-policy .nodata-account-group {
    height: 19.7rem
}

.carousel-group.custom-policy .swiper-container {
    padding: 0 2rem
}

.carousel-group.custom-policy .swiper-slide {
    width: 27.5rem
}

.carousel-group.custom-policy .swiper-slide:last-child {
    width: 25.5rem
}

.carousel-group.custom-policy .swiper-slide:last-child .list-item {
    padding-right: 0
}

.carousel-group.custom-policy .list-deal-group .list-item {
    padding: 2rem 2rem 2rem 0
}

.btn-policy-refresh {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 8.9rem;
    height: 2.8rem
}

.component-img.business-type {
    margin-top: 6.2rem;
    text-align: center
}

.component-img.business-type img {
    width: 17.6rem;
    height: auto
}

.component-header+.component-bridge {
    margin-top: 15.6rem;
    text-align: center
}

.component-bridge img {
    width: 12rem;
    height: auto
}

.tag-area.policy-detail {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-top: 1.6rem
}

.tag-area.policy-detail .tag {
    height: 2.2rem;
    margin-right: 0.6rem;
    margin-bottom: 0.6rem;
    padding: 0.4rem 0.6rem 0.4rem;
    border-radius: 0.4rem;
    background-color: var(--color-in25)
}

.tag-area.policy-detail .tag [class^="ico"] {
    width: 1.2rem;
    height: 1.2rem;
    margin-right: 0.4rem;
    -webkit-filter: var(--filter-pl);
    filter: var(--filter-pl)
}

.tag-area.policy-detail .tag .txt {
    font-size: 1.2rem;
    font-weight: 500
}

.component-text-simple.policy-detail {
    position: relative
}

.component-text-simple.policy-detail .input-checkbox.like {
    position: absolute;
    top: -2.4rem;
    right: 2rem;
    width: 4.4rem;
    height: 4.4rem;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.component-text-list.policy-detail {
    position: relative
}

.component-text-list.policy-detail {
    height: 30rem;
    overflow: hidden
}

.component-text-list.policy-detail.open {
    height: auto
}

.component-text-list.policy-detail .text-list-group {
    padding-bottom: 9.6rem
}

.component-text-list.policy-detail .bl-txt-group .txt.indent {
    text-indent: -1.2rem
}

.component-text-list.policy-detail .bl-txt-group .txt.indent::before {
    display: none
}

.component-text-list.policy-detail .btn-group-wrap {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 3.2rem 2rem 0.8rem
}

.component-text-list.policy-detail .btn-group-wrap::before {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    bottom: 0;
    left: 0;
    background: -webkit-gradient(linear, left bottom, left top, from(#fff), color-stop(32.24%, #fff), color-stop(70.31%, rgba(255, 255, 255, 0.85)), to(rgba(255, 255, 255, 0)));
    background: -o-linear-gradient(bottom, #fff 0, #fff 32.24%, rgba(255, 255, 255, 0.85) 70.31%, rgba(255, 255, 255, 0) 100%);
    background: linear-gradient(0deg, #fff 0, #fff 32.24%, rgba(255, 255, 255, 0.85) 70.31%, rgba(255, 255, 255, 0) 100%)
}

.component-text-list.policy-detail.open .btn-group-wrap::before {
    display: none
}

.component-text-list.policy-detail .btn-group-wrap button {
    z-index: 1
}

.component-text-list.policy-detail.open .ico-arrow-open {
    margin-left: 0.8rem;
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg)
}

.component-text-list.policy-detail .ico-arrow-open {
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0)
}

.section-component.custom-policy .component-tab.sticky-chip {
    position: -webkit-sticky;
    position: sticky;
    top: 11rem;
    left: 0;
    background-color: var(--color-w100);
    overflow: visible;
    z-index: 1
}

.component-nodata-search {
    margin-top: 0;
    padding: 7.6rem 0 2.8rem;
    text-align: center
}

.component-header+.component-logo-icon {
    margin-top: 24.9rem
}

.component-logo-icon .icon-group {
    text-align: center
}

.component-logo-icon .icon-group .ico-kbank-navy {
    width: 13.36rem;
    height: 3.2rem
}

.component-coupon-chip {
    margin-bottom: 2.4rem
}

.component-coupon-chip .keyword-filter-chips .filter-chips label {
    height: 3.6rem;
    margin-bottom: 0;
    border: none;
    background-color: var(--bg-ter)
}

.component-coupon-chip .keyword-filter-chips .filter-chips input {
    height: 3.6rem
}

.component-coupon-chip .keyword-filter-chips .filter-chips input+label {
    line-height: 2rem;
    color: var(--txt-qua)
}

.component-coupon-chip .keyword-filter-chips .filter-chips input:checked+label {
    padding-left: 1.4rem;
    background-color: var(--bg-accent-pri)
}

.component-coupon-chip .keyword-filter-chips .filter-chips input:checked+label:before {
    display: none
}

.component-coupon-chip .keyword-filter-chips .filter-chips .new-alarm {
    position: absolute;
    top: -0.2rem;
    right: 0.4rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 1.6rem;
    height: 1.6rem;
    border-radius: 99rem;
    background-color: var(--bg-pri-mark)
}

.component-coupon-chip .keyword-filter-chips .filter-chips .new-alarm .txt {
    font-size: 1.1rem;
    font-weight: 700;
    line-height: 1.5rem;
    color: var(--txt-pri-invert);
    word-break: break-all
}

.component-coupon-chip .keyword-filter-chips .filter-chips:last-child input {
    width: 100%
}

.component-coupon-chip .keyword-filter-chips .filter-chips:last-child .new-alarm {
    right: -0.4rem
}

.component-coupon-period {
    margin-bottom: 1.8rem
}

.component-img.barcode {
    margin: 2.8rem 0 4rem;
    text-align: center
}

.component-img.barcode img {
    width: 100%;
    height: auto;
    max-height: 10rem;
    -o-object-fit: contain;
    object-fit: contain
}

.component-img.qr {
    margin: 2.8rem 0 4rem;
    text-align: center
}

.component-img.qr img {
    width: 14rem;
    height: 14rem
}

.img-box.loan-type1 {
    margin: 3.2rem auto;
    max-width: 28rem
}

.img-box.loan-type1 img {
    width: 100%
}

/*! component element container-component-coach 코치마크 공통 */

.section-component[data-tab-content="investTab01"] {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    z-index: 110;
    background-color: var(--bg-base)
}

/*! KDS(04_system) component-space : <hr>태그로 사용하고 section과 section사이 구분용으로 사용하고 페이지내 정보 분리가 필요한 경우는 divider 사용 또는 헬퍼 클래스(base.scss > pt10,mt10~~~) 이용 section 상/하 간격 class options 필수 클래스 : .component-space 좌우 여백(제거) : .space-no-space 라인 상/하(정렬) : 기본 라이인은 상단에 위치함 / .space-line-middle(중간) / .space-line-bottom(하단) / .space-no-line(라인 제거) 라인 좌/우(정렬) 라인 가로가 100%가 아닌 경우 사용 : 기본 좌/우 100% / .space-line-left(좌측) / .space-line-center(중간) / .space-line-right(우측) 여백(높이) : .space-h48 / .space-h56 */

.component-space {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 0;
    margin: 0;
    border: 0;
    width: 100%;
    padding: 0 2rem
}

.component-space::after {
    content: '';
    display: block;
    width: 100%;
    height: 0.1rem;
    background-color: var(--bg-qua)
}

.component-space.space-no-space {
    padding: 0
}

.component-space.space-no-line::after {
    height: 0;
    background-color: unset
}

.component-space.space-line-middle::after {
    -ms-flex-item-align: center;
    align-self: center
}

.component-space.space-line-bottom::after {
    -ms-flex-item-align: end;
    align-self: end
}

.component-space.space-line-left {
    -webkit-box-pack: left;
    -ms-flex-pack: left;
    justify-content: left
}

.component-space.space-line-center {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.component-space.space-line-right {
    -webkit-box-pack: right;
    -ms-flex-pack: right;
    justify-content: right
}

.component-space.space-h4 {
    height: 0.4rem
}

.component-space.space-h8 {
    height: 0.8rem
}

.component-space.space-h12 {
    height: 1.2rem
}

.component-space.space-h16 {
    height: 1.6rem
}

.component-space.space-h20 {
    height: 2rem
}

.component-space.space-h24 {
    height: 2.4rem
}

.component-space.space-h28 {
    height: 2.8rem
}

.component-space.space-h32 {
    height: 3.2rem
}

.component-space.space-h36 {
    height: 3.6rem
}

.component-space.space-h40 {
    height: 4rem
}

.component-space.space-h48 {
    height: 4.8rem
}

.component-space.space-h56 {
    height: 5.6rem
}

.component-space.space-h64 {
    height: 6.4rem
}

.component-space.space-h72 {
    height: 7.2rem
}

.component-space.space-h80 {
    height: 8rem
}

.component-space.space-h88 {
    height: 8.8rem
}

.component-space.space-h96 {
    height: 9.6rem
}

.component-space.space-h104 {
    height: 10.4rem
}

.component-space.space-h120 {
    height: 12rem
}

.component-space.space-h154 {
    height: 15.4rem
}

.component-text-icon.apt .text-icon-group {
    margin-top: 1.6rem;
    padding: 2rem 0 3rem 0;
    border-radius: 1.6rem;
    background-color: var(--bg-qua-active)
}

.component-img.perfect-safe img {
    width: auto;
    height: 12rem
}

.component-img.ceo-loan {
    margin-top: 11.2rem;
    text-align: center
}

.component-img.ceo-loan img {
    width: 20.6rem;
    height: auto
}

.component-img.ceo-loan .title-group {
    margin-top: 4.8rem
}

.section-component.send-money {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 100vh;
    position: relative;
    overflow: hidden
}

.section-component.send-money .section-component .component-form-h32 .form-row .form-util,
.section-component.send-money .section-component .component-form-h32 .form-row .input-txt-group,
.section-component.send-money .section-component .component-form-h32 .form-row .selectbox-trn {
    margin: 0 2rem
}

.section-component.send-money .section-component .component-form-h32 .form-row .form-util .txt-pri-sell {
    font-weight: 500
}

.section-component.recommend {
    height: 100%;
    overflow-y: auto;
    padding-bottom: 15.4rem;
    opacity: 1
}

.section-component.recommend.show {
    -webkit-animation: recommendHiddenAni-fadeUp .2s ease-out both;
    animation: recommendHiddenAni-fadeUp .2s ease-out both
}

.section-component.recommend:not(.show) {
    -webkit-animation: recommendHiddenAni-fadeDown .2s ease-out both;
    animation: recommendHiddenAni-fadeDown .2s ease-out both
}

@-webkit-keyframes recommendHiddenAni-fadeUp {
    0% {
        -webkit-transform: translateY(10rem);
        transform: translateY(10rem);
        opacity: 0
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1
    }
}

@keyframes recommendHiddenAni-fadeUp {
    0% {
        -webkit-transform: translateY(10rem);
        transform: translateY(10rem);
        opacity: 0
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1
    }
}

@-webkit-keyframes recommendHiddenAni-fadeDown {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1
    }
    100% {
        -webkit-transform: translateY(10rem);
        transform: translateY(10rem);
        opacity: 0
    }
}

@keyframes recommendHiddenAni-fadeDown {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1
    }
    100% {
        -webkit-transform: translateY(10rem);
        transform: translateY(10rem);
        opacity: 0
    }
}

.section-component.send-money .section-component .component-form-h32 .form-row .selectbox-trn {
    display: none
}

.section-component.send-money .section-component .component-form-h32 .form-row .selectbox-trn.show {
    display: block;
    -webkit-animation: selectTrnAni .3s ease-out both;
    animation: selectTrnAni .3s ease-out both
}

@-webkit-keyframes selectTrnAni {
    0% {
        -webkit-transform: translateY(4rem);
        transform: translateY(4rem);
        opacity: 0
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1
    }
}

@keyframes selectTrnAni {
    0% {
        -webkit-transform: translateY(4rem);
        transform: translateY(4rem);
        opacity: 0
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1
    }
}

.component-text-list.sticky {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    margin-top: 0;
    z-index: 5;
    padding-bottom: 1.6rem;
    background-color: var(--bg-base)
}

.component-text-list.sticky .title-group .title-flex-area {
    margin-bottom: 0
}

.component-text-list.sticky+.component-list .rec-list-group .rec-list-title {
    top: 4.8rem;
    z-index: 4
}

.component-text-list.sticky+.component-list .rec-list-group .rec-list [class*="logo-bank"]:after {
    z-index: 0
}

.popup-section-poll-type2 .title-group .title-field-21 {
    display: block;
    display: -webkit-box;
    max-height: 3rem;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    line-height: 1.5;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    word-wrap: break-word;
    overflow: hidden;
    white-space: normal;
    max-height: 7rem !important
}

.popup-section-poll-type2 .title-group .txt-guide {
    display: block;
    display: -webkit-box;
    max-height: 3rem;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    line-height: 1.5;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    word-wrap: break-word;
    overflow: hidden;
    white-space: normal;
    max-height: 4.6rem !important
}

.section-component.progress-group {
    padding-bottom: 0;
    position: relative
}

.section-component.progress-group .title-field-21 {
    margin-right: 8rem
}

.section-component.progress-group .component-progress {
    position: absolute;
    top: 0;
    right: 0
}

.component-progress .step-box {
    display: inline-block;
    border-radius: 1rem;
    background-color: var(--bg-ter);
    padding: .4rem 1rem;
    min-width: 4.8rem
}

.component-progress .step-box .txt {
    font-size: 1.5rem;
    font-weight: 500;
    line-height: 2.1rem;
    color: var(--txt-qua)
}

.ico-ai-bubble-left-bottom {
    width: 4.8rem !important;
    height: 4.8rem !important;
    border-radius: 0;
    background-image: url("/resource/img/mmk/common/ai_bubble_left_bottom.png")
}

.ico-big-tech-building {
    width: 4.8rem !important;
    height: 4.8rem !important;
    border-radius: 0;
    background-image: url("/resource/img/mmk/common/big_tech_building.png")
}

.ico-cake-candlelight {
    width: 4.8rem !important;
    height: 4.8rem !important;
    border-radius: 0;
    background-image: url("/resource/img/mmk/common/cake_candlelight.png")
}

.ico-hand-globe {
    width: 4.8rem !important;
    height: 4.8rem !important;
    border-radius: 0;
    background-image: url("/resource/img/mmk/common/hand_globe.png")
}

.ico-monitor-left {
    width: 4.8rem !important;
    height: 4.8rem !important;
    border-radius: 0;
    background-image: url("/resource/img/mmk/common/monitor_left.png")
}

.ico-playmark-blue {
    width: 4.8rem !important;
    height: 4.8rem !important;
    border-radius: 0;
    background-image: url("/resource/img/mmk/common/playmark_blue.png")
}

.ico-rechargeable-battery-half {
    width: 4.8rem !important;
    height: 4.8rem !important;
    border-radius: 0;
    background-image: url("/resource/img/mmk/common/rechargeable_battery_half.png")
}

.ico-smart-factory-building {
    width: 4.8rem !important;
    height: 4.8rem !important;
    border-radius: 0;
    background-image: url("/resource/img/mmk/common/smart_factory_building.png")
}

.ico-symbol-atomic-energy {
    width: 4.8rem !important;
    height: 4.8rem !important;
    border-radius: 0;
    background-image: url("/resource/img/mmk/common/symbol_atomic_energy.png")
}

.ico-vr-google-left {
    width: 4.8rem !important;
    height: 4.8rem !important;
    border-radius: 0;
    background-image: url("/resource/img/mmk/common/vr_google_left.png")
}

.section-component-poll-header .component-text-simple {
    margin: 2.4rem 0 2.8rem 0 !important
}

.section-component-poll-header .component-text-icon {
    margin-bottom: 2.8rem !important
}

.container-component.container-component-poll .poll-space-24 {
    margin-top: 2.4rem !important
}

.container-component.container-component-poll .poll-space-24:first-child {
    margin-top: 0 !important
}

.container-component.container-component-poll .poll-space-28 {
    margin-top: 2.8rem !important
}

.container-component.container-component-poll .poll-space-28:first-child {
    margin-top: 0 !important
}

.container-component.container-component-poll .poll-space-48 {
    margin-top: 4.8rem !important
}

.container-component.container-component-poll .poll-space-48:first-child {
    margin-top: 2rem !important
}

.container-component.container-component-poll .poll-card-warp.poll-space-28:first-child {
    margin-top: 0 !important
}

.container-component.container-component-poll .poll-card-warp.poll-space-28+.poll-card-warp.poll-space-28 {
    margin-top: 1rem !important
}

.section-component-poll-header .component-text-simple .title-group .title-field-24 {
    display: block;
    display: -webkit-box;
    max-height: 3rem;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    line-height: 1.5;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    word-wrap: break-word;
    overflow: hidden;
    white-space: normal;
    max-height: 7rem !important
}

.section-component-poll-header .component-text-simple .title-group .txt-guide {
    display: block;
    display: -webkit-box;
    max-height: 3rem;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    line-height: 1.5;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    word-wrap: break-word;
    overflow: hidden;
    white-space: normal;
    max-height: 4.6rem !important
}

.section-component-poll-header .component-text-icon .title-group .title-field-24 {
    display: block;
    display: -webkit-box;
    max-height: 3rem;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    line-height: 1.5;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    word-wrap: break-word;
    overflow: hidden;
    white-space: normal;
    max-height: 7rem !important
}

.section-component-poll-header .component-text-icon .title-group .txt-guide {
    display: block;
    display: -webkit-box;
    max-height: 3rem;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    line-height: 1.5;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    word-wrap: break-word;
    overflow: hidden;
    white-space: normal;
    max-height: 4.6rem !important
}

.section-component-poll-header+.section-component-poll-content .kds-landing-share.type2 {
    padding-top: .4rem
}

.component-img.special-coupon {
    margin: 3.2rem 0;
    text-align: center
}

.component-img.special-coupon img {
    width: 17.5rem;
    height: auto
}

.component-header+.component-digit-signature {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-top: 11.2rem
}

.component-digit-signature .icon-area {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.component-digit-signature .arrow-group {
    margin: 0 0.8rem
}

.component-digit-signature .arrow-group .first {
    -webkit-animation: arrow-loading1 1600ms linear infinite;
    animation: arrow-loading1 1600ms linear infinite
}

.component-digit-signature .arrow-group .second {
    -webkit-animation: arrow-loading2 1600ms linear infinite;
    animation: arrow-loading2 1600ms linear infinite
}

@-webkit-keyframes arrow-loading1 {
    0% {
        background-color: var(--ico-accent-ter)
    }
    49% {
        background-color: var(--ico-accent-ter)
    }
    50% {
        background-color: var(--ico-qua)
    }
    99% {
        background-color: var(--ico-qua)
    }
    100% {
        background-color: var(--ico-accent-ter)
    }
}

@keyframes arrow-loading1 {
    0% {
        background-color: var(--ico-accent-ter)
    }
    49% {
        background-color: var(--ico-accent-ter)
    }
    50% {
        background-color: var(--ico-qua)
    }
    99% {
        background-color: var(--ico-qua)
    }
    100% {
        background-color: var(--ico-accent-ter)
    }
}

@-webkit-keyframes arrow-loading2 {
    0% {
        background-color: var(--ico-qua)
    }
    49% {
        background-color: var(--ico-qua)
    }
    50% {
        background-color: var(--ico-accent-ter)
    }
    99% {
        background-color: var(--ico-accent-ter)
    }
    100% {
        background-color: var(--ico-qua)
    }
}

@keyframes arrow-loading2 {
    0% {
        background-color: var(--ico-qua)
    }
    49% {
        background-color: var(--ico-qua)
    }
    50% {
        background-color: var(--ico-accent-ter)
    }
    99% {
        background-color: var(--ico-accent-ter)
    }
    100% {
        background-color: var(--ico-qua)
    }
}

.component-digit-signature .arrow-group.reverse .first,
.component-digit-signature .arrow-group.reverse .second {
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg)
}

.tooltip-focus-group .tooltip-area.align-bottom.digit-signature {
    top: 2.2rem;
    left: 2rem;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
    -webkit-animation: tooltip-up-down 1600ms linear infinite;
    animation: tooltip-up-down 1600ms linear infinite
}

@-webkit-keyframes tooltip-up-down {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
    50% {
        -webkit-transform: translateY(0.5rem);
        transform: translateY(0.5rem)
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

@keyframes tooltip-up-down {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
    50% {
        -webkit-transform: translateY(0.5rem);
        transform: translateY(0.5rem)
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

.title-group div.tooltip-group-wrap,
.tooltip-group-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.tooltip-group-wrap .tooltip-group {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin-left: 0.4rem
}

.tooltip-group-wrap .tooltip-group .btn-tooltip {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    top: 0
}

.component-tab-invest .tab-list-type06 .tab-link {
    margin-bottom: 1.1rem
}

.agreement-group4 {
    margin-top: 2.4rem
}

.agreement-group4 .agreement-info {
    padding: 2rem;
    border: 1px solid var(--color-g300);
    border-radius: 1.2rem 1.2rem 0 0;
    background-color: var(--bg-qua)
}

.agreement-group4 .agreement-info .tit {
    font-size: 1.8rem;
    font-weight: 700;
    line-height: 2.4rem;
    color: var(--txt-pri)
}

.agreement-group4 .agreement-info .desc {
    margin-top: .6rem;
    font-size: 1.4rem;
    font-weight: 500;
    line-height: 2rem;
    color: var(--txt-sec)
}

.agreement-group4 .agreement-checkbox {
    border-right: 1px solid var(--color-g300);
    border-bottom: none;
    border-left: 1px solid var(--color-g300);
    border-top: none
}

.agreement-group4 .agreement-checkbox .input-checkbox-group {
    padding: 2rem 2rem 1.6rem 2rem
}

.agreement-group4 .agreement-content {
    padding-top: 0;
    border-radius: 0 0 1.2rem 1.2rem;
    border-right: 1px solid var(--color-g300);
    border-bottom: 1px solid var(--color-g300);
    border-left: 1px solid var(--color-g300);
    border-top: none;
    background-color: var(--bg-base)
}

.agreement-group4 .agreement-content>.input-checkbox-group:first-child {
    margin-top: 0
}

.agreement-group4 .agreement-content>.input-checkbox-group {
    margin-top: .6rem
}

.kds-shadow__close--weak {
    -webkit-box-shadow: 0 2px var(--effect-blur-b2, 2px) 0 var(--color-pb100-op5, rgba(0, 0, 0, 0.05));
    box-shadow: 0 2px var(--effect-blur-b2, 2px) 0 var(--color-pb100-op5, rgba(0, 0, 0, 0.05))
}

.kds-shadow__close--normal {
    -webkit-box-shadow: 0 2px var(--effect-blur-b4, 4px) 0 var(--color-pb100-op7, rgba(0, 0, 0, 0.07));
    box-shadow: 0 2px var(--effect-blur-b4, 4px) 0 var(--color-pb100-op7, rgba(0, 0, 0, 0.07))
}

.kds-shadow__close--strong {
    -webkit-box-shadow: 0 2px var(--effect-blur-b8, 8px) 0 var(--color-pb100-op10, rgba(0, 0, 0, 0.1));
    box-shadow: 0 2px var(--effect-blur-b8, 8px) 0 var(--color-pb100-op10, rgba(0, 0, 0, 0.1))
}

.kds-shadow__mid--weak {
    -webkit-box-shadow: 0 4px var(--effect-blur-b10, 10px) 0 var(--color-pb100-op7, rgba(0, 0, 0, 0.07));
    box-shadow: 0 4px var(--effect-blur-b10, 10px) 0 var(--color-pb100-op7, rgba(0, 0, 0, 0.07))
}

.kds-shadow__mid--normal {
    -webkit-box-shadow: 0 4px var(--effect-blur-b16, 16px) 0 var(--color-pb100-op10, rgba(0, 0, 0, 0.1));
    box-shadow: 0 4px var(--effect-blur-b16, 16px) 0 var(--color-pb100-op10, rgba(0, 0, 0, 0.1))
}

.kds-shadow__mid--strong {
    -webkit-box-shadow: 0 4px var(--effect-blur-b24, 24px) 0 var(--color-pb100-op12, rgba(0, 0, 0, 0.12));
    box-shadow: 0 4px var(--effect-blur-b24, 24px) 0 var(--color-pb100-op12, rgba(0, 0, 0, 0.12))
}

.kds-shadow__far--weak {
    -webkit-box-shadow: 0 8px var(--effect-blur-b20, 20px) 0 var(--color-pb100-op7, rgba(0, 0, 0, 0.07));
    box-shadow: 0 8px var(--effect-blur-b20, 20px) 0 var(--color-pb100-op7, rgba(0, 0, 0, 0.07))
}

.kds-shadow__far--normal {
    -webkit-box-shadow: 0 8px var(--effect-blur-b36, 36px) 0 var(--color-pb100-op10, rgba(0, 0, 0, 0.1));
    box-shadow: 0 8px var(--effect-blur-b36, 36px) 0 var(--color-pb100-op10, rgba(0, 0, 0, 0.1))
}

.kds-shadow__far--strong {
    -webkit-box-shadow: 0 8px var(--effect-blur-b52, 52px) 0 var(--color-pb100-op15, rgba(0, 0, 0, 0.15));
    box-shadow: 0 8px var(--effect-blur-b52, 52px) 0 var(--color-pb100-op15, rgba(0, 0, 0, 0.15))
}

input:-webkit-autofill,
input:-webkit-autofill:focus {
    -webkit-transition: background-color 600000s 0s, color 60000s 0s;
    transition: background-color 600000s 0s, color 60000s 0s
}

/*! component element input range 기본 */

.input-range-group input[type="range"] {
    display: block;
    -webkit-appearance: none;
    width: 100%;
    height: 0.6rem;
    border-radius: 99rem;
    background: var(--color-g200, #eee)
}

.input-range-group input[type="range"]:focus {
    outline: none
}

.input-range-group input[type="range"]::-webkit-slider-thumb {
    position: relative;
    z-index: 5;
    -webkit-appearance: none;
    width: 2.8rem;
    height: 2.8rem;
    background: var(--color-w100, #fff);
    border: 1px solid var(--color-pb10, #00000019);
    border-radius: 99rem;
    -webkit-box-shadow: var(--color-comp200);
    box-shadow: var(--color-comp200)
}

.input-range-group input[type="range"].arrow-slide {
    margin-bottom: 1.5rem
}

.input-range-group.type-arrow input[type="range"]::-webkit-slider-thumb {
    width: 2.4rem;
    height: 2.4rem;
    background: var(--color-w100, #fff) var(--path-input-range-chevron-left-right) 50% 50% no-repeat;
    background-size: 1.2rem
}

.input-range-group.type-arrow input[type="range"]:disabled::-webkit-slider-thumb {
    background: var(--bg-pri-disabled) var(--path-input-range-chevron-left-right-disabled) 50% 50% no-repeat;
    background-size: 1.2rem;
    border-width: 0.02rem;
    border-color: var(--border-handle);
    -webkit-box-shadow: none;
    box-shadow: none
}

input:is([type="checkbox"],
[type="radio"]):disabled {
    background-color: transparent !important
}

/*! component element input range의 thumb 연동 기본 + 상하 텍스트 */

.input-range-pointer-group {
    width: 100%
}

.input-range-pointer-group .pointer-row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.input-range-pointer-group .pointer-row.top {
    padding-bottom: 2rem
}

.input-range-pointer-group .pointer-row.top .item-index .txt {
    font-size: 1.2rem;
    color: var(--color-g700);
    font-weight: 700
}

.input-range-pointer-group .pointer-row.bottom {
    padding-top: 2rem
}

.input-range-pointer-group .pointer-row.bottom .item-index .txt {
    font-size: 1.2rem;
    color: var(--color-g700)
}

.input-range-pointer-group .input-range-group .range-value-group {
    margin: 0 auto;
    width: 99%
}

.input-range-pointer-group .input-range-group .range-value-group .rvalue {
    width: 1.6rem;
    height: 1.6rem;
    background-color: var(--color-g200, #eee);
    border: 0
}

:root .input-range-pointer-group .input-range-group .range-value-group .rvalue {
    border: 1px solid var(--ico-ter, #8694b1)
}

:root .input-range-pointer-group .input-range-group .range-value-group .rvalue.on {
    border: 1px solid var(--bg-accent-pri, #4262ff)
}

.input-range-pointer-group .input-range-group .range-value-group .rvalue.on {
    background-color: var(--color-bu300, #71beff)
}

.input-range-pointer-group .input-range-group .range-step-wrap {
    position: relative
}

.input-range-pointer-group .input-range-group input[type="range"] {
    margin: 0 auto;
    position: relative
}

/*! component element input range의 thumb 연동 월 상환금액 줄이기: PBKINQ0302010002S.html */

.component-range {
    margin: 2.4rem 0 2.4rem;
    padding-top: 4.8rem;
    position: relative;
    overflow: hidden
}

.component-range.no-space-horizon {
    margin-left: -2rem;
    margin-right: -2rem;
    padding-left: 2rem;
    padding-right: 2rem
}

.input-range-wrap {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 6px;
    border-radius: 99rem;
    background: var(--color-g300, #e0e0e0)
}

.input-range-wrap .input-range-group {
    position: absolute;
    z-index: 2;
    width: 85%;
    right: 0
}

.input-range-wrap .input-range-group::after,
.input-range-wrap .input-range-group::before,
.input-range-wrap::before {
    content: '';
    display: block;
    width: 10px;
    height: 10px;
    border-radius: 99rem;
    border: 1px solid var(--color-w100, #fff);
    background: var(--color-g300, #e0e0e0);
    position: absolute;
    top: -2px;
    z-index: 1
}

.input-range-wrap::before {
    left: 9px
}

.input-range-wrap .input-range-group::before {
    left: 9px;
    background-color: var(--color-lm100, #c0f03e)
}

.input-range-wrap .input-range-group::after {
    right: 9px
}

.range-value-group {
    position: absolute;
    z-index: 2;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: 0 9px;
    width: calc(100% - 18px);
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.range-value-group .rvalue {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 99rem;
    border: 1px solid var(--color-w100, #fff);
    background: var(--color-g300, #e0e0e0);
    color: transparent
}

.range-value-group .rvalue.on {
    background: var(--color-lm100, #c0f03e)
}

.thumb-index {
    position: absolute;
    z-index: 10;
    bottom: 2.8rem;
    left: 0;
    height: 2.4rem;
    min-width: 4.5rem;
    padding: .2rem .8rem;
    border-radius: 99rem;
    background: var(--color-lm100, #c0f03e);
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center
}

.thumb-index::after {
    content: "";
    display: inline-block;
    position: absolute;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    bottom: -6px;
    border-top: 8px solid var(--color-lm100, #c0f03e);
    border-left: 6px solid transparent;
    border-right: 6px solid transparent
}

.thumb-index.pos-left {
    left: 0 !important
}

.thumb-index.pos-left::after {
    left: 1.5rem
}

.thumb-index .first-txt,
.thumb-index .txt {
    color: var(--color-pn, #17008c);
    font-size: 1.4rem;
    font-weight: 700;
    white-space: nowrap;
    margin: 0 auto
}

.range-txt-wrap {
    margin-top: 2rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    width: 100%
}

.range-txt-wrap [class^="item-index"] {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-flow: column;
    flex-flow: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: var(--color-g700)
}

.range-txt-wrap [class^="item-index"] .tag {
    margin-top: 2px;
    padding: 0 0.7rem;
    height: 1.6rem
}

.range-txt-wrap [class^="item-index"] .tag .txt {
    font-size: .9rem;
    font-weight: normal
}

.range-txt-wrap [class^="item-index"] .tag.light-gray {
    background: var(--color-cg300, #f1f6fb)
}

.range-txt-wrap [class^="item-index"] .tag.light-gray .txt {
    color: var(--color-g700)
}

.range-txt-wrap [class^="item-index"] .tag.bg-light {
    background: var(--color-bu700, #006aff)
}

.range-txt-wrap .item-index2 {
    position: absolute;
    left: 15%;
    -webkit-transform: translateX(30%);
    -ms-transform: translateX(30%);
    transform: translateX(30%)
}

.range-txt-wrap .item-index2,
.range-txt-wrap .item-index3 {
    color: var(--color-bu700, #006aff)
}

/*! component element input text 기본 */

.input-txt-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative;
    background-color: var(--color-w100, #fff);
    border: 1px solid var(--color-g300, #e0e0e0);
    border-radius: 1.2rem;
    height: 7.2rem;
    -webkit-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out
}

.input-txt-group.h-92 {
    height: 9.2rem
}

:root .input-txt-group {
    background-color: var(--bg-base);
    border: 1px solid var(--border-qua)
}

.input-txt-group.txt-pw-type>input {
    padding-right: 0;
    position: absolute
}

.input-txt-group.txt-pw-type .input-pw-mask {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    opacity: 0;
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
    font-size: 0;
    position: relative;
    top: 1.3rem;
    padding-left: 3rem
}

.input-txt-group.txt-pw-type .input-pw-mask .mask {
    display: inline-block;
    width: 1rem;
    height: 1rem;
    border-radius: 50%;
    background-color: var(--color-pb100, #000);
    margin-left: 0.2rem
}

:root .input-txt-group.txt-pw-type .input-pw-mask .mask {
    width: 1.2rem;
    height: 1.2rem
}

.input-txt-group.disabled.txt-pw-type .input-pw-mask .mask {
    background-color: var(--color-g500, #b8b8b8)
}

.input-txt-group.disabled.txt-pw-type .input-pw-mask .number {
    font-size: 1.6rem;
    color: var(--color-g500, #b8b8b8)
}

:root .input-txt-group.disabled.txt-pw-type .input-pw-mask .number {
    color: var(--txt-pri)
}

:root .input-txt-group.readonly.txt-pw-type .input-pw-mask .number {
    font-size: 1.6rem;
    color: var(--color-g500, #b8b8b8)
}

.input-txt-group.no-space>input {
    padding: 2.6rem 2rem 2.6rem 0
}

.input-txt-group.no-space>input.done {
    -webkit-box-shadow: none;
    box-shadow: none
}

.input-txt-group.no-border {
    border: none;
    border-radius: 0
}

:root .input-txt-group.no-border {
    border: none;
    border-radius: 0
}

.input-txt-group.no-border.done {
    -webkit-box-shadow: none;
    box-shadow: none
}

.input-txt-group.reset-layout {
    border: none;
    border-radius: 0;
    height: 100%;
    width: 100%;
    margin: 0;
    background-color: transparent
}

:root .input-txt-group.reset-layout {
    background-color: transparent
}

:root .input-txt-group.reset-layout {
    border: none;
    border-radius: 0;
    height: 100%;
    width: 100%;
    margin: 0
}

.input-txt-group.reset-layout input {
    padding: 0
}

.input-txt-group.reset-layout .txt-field {
    margin-top: 0
}

.input-txt-group.reset-layout .txt-field.left {
    margin-left: 0;
    margin-right: 1.2rem
}

.input-txt-group.reset-layout .txt-field.right {
    margin-right: 0;
    margin-left: 1.2rem
}

.input-txt-group.reset-layout .btn-delete-txt {
    padding: 0
}

.input-txt-group.reset-layout.done {
    -webkit-box-shadow: none;
    box-shadow: none
}

.dev-reset-layout .input-txt-group {
    border: none;
    border-radius: 0;
    height: 100%;
    width: 100%;
    margin: 0
}

:root .dev-reset-layout .input-txt-group {
    border: none
}

.dev-reset-layout .input-txt-group input {
    padding: 0
}

.dev-reset-layout .input-txt-group .txt-field {
    margin-top: 0
}

.dev-reset-layout .input-txt-group .txt-field.left {
    margin-left: 0;
    margin-right: 1.2rem
}

.dev-reset-layout .input-txt-group .txt-field.right {
    margin-right: 0;
    margin-left: 1.2rem
}

.dev-reset-layout .input-txt-group.done {
    -webkit-box-shadow: none;
    box-shadow: none
}

.input-txt-group.flex {
    padding: 0.9rem 0 0.9rem;
    min-height: 7.2rem;
    height: auto
}

.input-txt-group.flex.active {
    -webkit-box-shadow: none;
    box-shadow: none;
    border: 1px solid var(--color-g300, #e0e0e0)
}

.input-txt-group.flex.active .label-field.static {
    -webkit-transform: none;
    -ms-transform: none;
    transform: none
}

.input-txt-group.active>input {
    padding-right: 0.8rem !important
}

.input-txt-group>input {
    position: relative;
    z-index: 1;
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
    width: 100%;
    height: 100%;
    padding: 2.6rem 2rem 0 2rem;
    font-size: 1.6rem;
    color: var(--color-g900, #141414);
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    outline: 0;
    border: none;
    background-color: transparent
}

:root .input-txt-group>input {
    color: var(--txt-pri)
}

.input-txt-group>input::-ms-clear {
    display: none
}

.input-txt-group>input::-webkit-search-cancel-button,
.input-txt-group>input::-webkit-search-decoration,
.input-txt-group>input::-webkit-search-results-button,
.input-txt-group>input::-webkit-search-results-decoration {
    display: none
}

.input-txt-group>input::-webkit-input-placeholder {
    color: var(--color-g500, #b8b8b8)
}

.input-txt-group>input::-moz-placeholder {
    color: var(--color-g500, #b8b8b8)
}

.input-txt-group>input:-ms-input-placeholder {
    color: var(--color-g500, #b8b8b8)
}

.input-txt-group>input::-ms-input-placeholder {
    color: var(--color-g500, #b8b8b8)
}

.input-txt-group>input::placeholder {
    color: var(--color-g500, #b8b8b8)
}

.input-txt-group>textarea {
    position: relative;
    z-index: 1;
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
    width: 100%;
    height: 100%;
    padding: 2rem 2rem 0 2rem;
    font-size: 1.6rem;
    line-height: 2.1rem;
    color: var(--color-g900, #141414);
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    outline: 0;
    border: none;
    background-color: transparent;
    resize: none;
    overflow: auto
}

:root .input-txt-group>textarea:disabled {
    color: var(--txt-disabled, #c8d2e4)
}

.input-txt-group>textarea::-ms-clear {
    display: none
}

.input-txt-group>textarea::-webkit-search-cancel-button,
.input-txt-group>textarea::-webkit-search-decoration,
.input-txt-group>textarea::-webkit-search-results-button,
.input-txt-group>textarea::-webkit-search-results-decoration {
    display: none
}

.input-txt-group>input::-webkit-input-placeholder {
    color: var(--txt-placeholder)
}

.input-txt-group>input::-moz-placeholder {
    color: var(--txt-placeholder)
}

.input-txt-group>input:-ms-input-placeholder {
    color: var(--txt-placeholder)
}

.input-txt-group>input::-ms-input-placeholder {
    color: var(--txt-placeholder)
}

.input-txt-group>input::placeholder {
    color: var(--txt-placeholder)
}

:root .input-txt-group>textarea:disabled::-webkit-input-placeholder {
    color: var(--txt-disabled, #c8d2e4)
}

:root .input-txt-group>textarea:disabled:-ms-input-placeholder,
:root .input-txt-group>textarea:disabled::-moz-placeholder,
:root .input-txt-group>textarea:disabled::-ms-input-placeholder,
:root .input-txt-group>textarea:disabled::-webkit-input-placeholder,
:root .input-txt-group>textarea:disabled::placeholder {
    color: var(--txt-disabled, #c8d2e4)
}

:root .input-txt-group>textarea::-webkit-input-placeholder {
    color: var(--txt-placeholder)
}

:root .input-txt-group>textarea::-moz-placeholder {
    color: var(--txt-placeholder)
}

:root .input-txt-group>textarea:-ms-input-placeholder {
    color: var(--txt-placeholder)
}

:root .input-txt-group>textarea::-ms-input-placeholder {
    color: var(--txt-placeholder)
}

:root .input-txt-group>textarea::placeholder {
    color: var(--txt-placeholder)
}

.input-txt-group>textarea::-webkit-scrollbar {
    display: none
}

.input-txt-group .input-data {
    position: relative;
    z-index: 1;
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
    width: calc(100% - 2.5rem);
    height: 100%;
    padding: 2.9rem 2rem 0 2rem;
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400;
    color: var(--color-g900, #141414)
}

.input-txt-group .label-field {
    position: absolute;
    padding: 0 2rem 0 2rem;
    max-width: 100%;
    left: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-transform-origin: 2rem top;
    -ms-transform-origin: 2rem top;
    transform-origin: 2rem top;
    white-space: nowrap;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    text-align: left;
    overflow: hidden;
    font-size: 1.6rem;
    -webkit-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out;
    color: var(--color-g700);
    z-index: 2
}

:root .input-txt-group .label-field {
    color: var(--txt-qua)
}

.input-txt-group .label-field.static {
    -webkit-transform: none;
    -ms-transform: none;
    transform: none;
    top: 1.6rem;
    font-size: 1.2rem
}

.input-txt-group .btn-delete-txt {
    -webkit-box-ordinal-group: 4;
    -ms-flex-order: 3;
    order: 3;
    height: 100%;
    padding: 2.6rem 2rem 0 0
}

.input-txt-group .btn-delete-txt .ico-delete-input {
    width: 1.8rem;
    height: 1.8rem;
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

:root .input-txt-group .btn-delete-txt .ico-delete-input {
    width: 2rem;
    height: 2rem;
    -webkit-filter: var(--filter-g500);
    filter: var(--filter-g500)
}

.input-txt-group .btn-delete-txt.hidden {
    visibility: hidden;
    width: 0;
    padding: 0
}

.form-box-item.col-2 .input-txt-group .ui-text-del+.btn-delete-txt {
    padding: 0
}

.txt-right.input-txt-group .btn-delete-txt {
    -webkit-box-ordinal-group: 4;
    -ms-flex-order: 3;
    order: 3
}

.input-txt-group .txt-field {
    display: none;
    margin-top: 2.6rem;
    font-size: 1.6rem;
    color: var(--color-g900, #141414);
    white-space: nowrap
}

.input-txt-group .txt-field.left {
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1;
    margin-left: 2rem;
    margin-right: -1.2rem
}

.input-txt-group .txt-field.right {
    -webkit-box-ordinal-group: 5;
    -ms-flex-order: 4;
    order: 4;
    margin-right: 2rem;
    margin-left: -1.2rem
}

.input-txt-group .txt-field.left.type01 {
    margin-top: 0;
    line-height: normal;
    padding: 2.6rem 0 0 0
}

.input-txt-group .input-checkbox-group {
    -webkit-box-ordinal-group: 5;
    -ms-flex-order: 4;
    order: 4;
    display: none;
    margin-right: 2rem
}

.input-txt-group:not(.line) .input-right-txt {
    margin-right: 2rem
}

.input-txt-group:not(.line) .btn-delete-txt+.input-right-txt {
    margin-left: -1.2rem
}

:root .input-txt-group .input-checkbox-group.disabled .checkbox-txt-field,
:root .input-txt-group .input-checkbox-group.readonly .checkbox-txt-field {
    color: var(--txt-disabled)
}

.input-txt-group .btn-search-input {
    position: relative;
    z-index: 1;
    padding: 1rem
}

.input-txt-group .btn-search-input.left {
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1;
    margin-left: 1rem;
    margin-right: -2rem
}

.input-txt-group .btn-search-input.right {
    -webkit-box-ordinal-group: 5;
    -ms-flex-order: 4;
    order: 4;
    margin-right: 1rem;
    margin-left: -1rem
}

.input-txt-group .btn-lv03 {
    -webkit-box-ordinal-group: 5;
    -ms-flex-order: 4;
    order: 4;
    margin-right: 2rem;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.input-txt-group .input-checkbox {
    -webkit-box-ordinal-group: 5;
    -ms-flex-order: 4;
    order: 4
}

.input-txt-group.button {
    padding: 1rem 0 1rem 0
}

.input-txt-group.button .input-data {
    display: none;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.input-txt-group.button .right {
    position: absolute;
    right: 0
}

.input-txt-group.button.active {
    height: auto;
    border-color: var(--color-g300, #e0e0e0);
    -webkit-box-shadow: none;
    box-shadow: none
}

.input-txt-group.button.active .input-data {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex
}

.input-txt-group.button.active .label-field {
    -webkit-transform: none;
    -ms-transform: none;
    transform: none;
    top: 1.6rem;
    font-size: 1.2rem
}

.input-txt-group.ui-placeholder>input {
    -webkit-filter: opacity(0);
    filter: opacity(0)
}

.input-txt-group.button.type2 .btn-search-input {
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    margin-right: 0;
    z-index: 2
}

.input-txt-group.button.type2 .btn-search-input .ico-search-input {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    right: 2rem
}

.input-txt-group.button.type3 {
    height: 6.4rem
}

.input-txt-group.button.type3 .input-data {
    font-weight: 700;
    padding: 0 2rem 0.2rem
}

.input-txt-group.button.type3 .ico-edit {
    -webkit-filter: var(--filter-pn);
    filter: var(--filter-pn)
}

.input-txt-group.button.type4 {
    width: 100%;
    height: auto;
    margin-right: 0.6rem
}

.input-txt-group.button.type4 .label-field {
    color: var(--txt-disabled)
}

.input-txt-group.button.type4 .input-data {
    padding: 0 2rem 0;
    color: var(--color-in700, #4262ff);
    font-weight: bold
}

.fake_cursor {
    position: absolute;
    top: 50%;
    left: 0;
    color: transparent;
    font-variant-numeric: normal;
    border-right: 1px solid var(--color-pb100, #000);
    opacity: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    -ms-touch-action: none;
    touch-action: none
}

[data-hidden-cursor].active .fake_cursor {
    -webkit-animation: fakeCursor 1s infinite;
    animation: fakeCursor 1s infinite
}

@-webkit-keyframes fakeCursor {
    0%,
    100%,
    49.9% {
        opacity: 0
    }
    50%,
    99.9% {
        opacity: 1
    }
}

@keyframes fakeCursor {
    0%,
    100%,
    49.9% {
        opacity: 0
    }
    50%,
    99.9% {
        opacity: 1
    }
}

/*! component element input text ui-input 기능없는 단순 텍스트 영역 FETASK-1256 */

button.input-txt-group {
    width: 100%
}

.input-txt-group.text-field {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    height: auto;
    min-height: 7.2rem
}

.input-txt-group.text-field .label-field {
    top: 1.6rem;
    -webkit-transform: translateY(0) scale(0.75);
    -ms-transform: translateY(0) scale(0.75);
    transform: translateY(0) scale(0.75)
}

.input-txt-group.text-field .text-field-area {
    padding: 4rem 2rem 1.6rem;
    width: 100%;
    text-align: left;
    font-size: 1.6rem;
    line-height: 2.1rem;
    color: var(--color-g900, #141414)
}

/*! component element input text 기본 - h-small */

.input-txt-group.h-small,
.input-txt-group.no-input-label {
    height: 5.6rem
}

.input-txt-group.h-medium>input,
.input-txt-group.h-medium3>input,
.input-txt-group.h-small>input,
.input-txt-group.h-small2>input,
.input-txt-group.no-input-label>input {
    padding-top: 0
}

.input-txt-group.h-small.ui-placeholder>input {
    -webkit-filter: opacity(1);
    filter: opacity(1)
}

.input-txt-group.h-small2 {
    height: 6.4rem
}

.input-txt-group.h-small3 {
    height: 4.8rem
}

.input-txt-group.h-medium {
    height: 20rem
}

.input-txt-group.h-medium2 {
    height: 18rem
}

.input-txt-group.h-medium3 {
    height: 7.2rem
}

.input-txt-group.h-xsmall {
    height: 10.3rem
}

.input-txt-group.h-medium .btn-delete-txt,
.input-txt-group.h-medium3 .btn-delete-txt,
.input-txt-group.h-small .btn-delete-txt,
.input-txt-group.no-input-label .btn-delete-txt {
    padding-top: 0;
    padding-bottom: 0
}

.input-txt-group.h-small2 .btn-delete-txt {
    padding-top: 0;
    padding-bottom: 0
}

.input-txt-group.h-small:not(.line) .input-left-txt {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1;
    margin-left: 2rem
}

:root .input-txt-group:not(.line):not(.disabled) .input-left-txt~input {
    padding-left: 0.8rem
}

.input-txt-group .input-left-txt,
.input-txt-group .input-right-txt {
    font-size: 1.6rem;
    line-height: normal
}

/*! component element input text 기본 - general-search CHPFMTASK-2471 */

.input-txt-group.general-search {
    background: var(--bg-qua);
    border: 0;
    height: 4.4rem
}

.input-txt-group.general-search>input {
    padding: 0 1.2rem 0 0.8rem
}

.input-txt-group.general-search>input::-webkit-input-placeholder {
    color: var(--txt-pri-placeholder)
}

.input-txt-group.general-search>input::-moz-placeholder {
    color: var(--txt-pri-placeholder)
}

.input-txt-group.general-search>input:-ms-input-placeholder {
    color: var(--txt-pri-placeholder)
}

.input-txt-group.general-search>input::-ms-input-placeholder {
    color: var(--txt-pri-placeholder)
}

.input-txt-group.general-search>input::placeholder {
    color: var(--txt-pri-placeholder)
}

.input-txt-group.general-search .btn-search-input {
    padding-left: 0.8rem;
    padding-right: 0.8rem;
    -webkit-filter: var(--filter-g600);
    filter: var(--filter-g600)
}

.input-txt-group.general-search .btn-search-input.left {
    margin-left: 0.4rem;
    margin-right: -0.8rem
}

.input-txt-group.general-search .btn-delete-txt {
    padding: 0 1.2rem 0 0.8rem
}

.input-txt-group.general-search .btn-delete-txt.hidden {
    visibility: hidden;
    width: 0;
    padding: 0
}

/*! component element input text 라인타입 */

.input-txt-group.line {
    margin: 0;
    padding: 0 4px;
    height: 5.6rem;
    border: 0;
    border-radius: 0;
    border-bottom: 0.2rem solid var(--color-g300, #e0e0e0);
    -webkit-transition: none;
    -o-transition: none;
    transition: none
}

:root .input-txt-group.line {
    border: none;
    border-bottom: 0.2rem solid var(--border-qua);
    background-color: transparent !important
}

.input-txt-group.line>input {
    padding: 0
}

.input-txt-group.line>input::-webkit-input-placeholder {
    color: var(--color-g500, #b8b8b8)
}

.input-txt-group.line>input::-moz-placeholder {
    color: var(--color-g500, #b8b8b8)
}

.input-txt-group.line>input:-ms-input-placeholder {
    color: var(--color-g500, #b8b8b8)
}

.input-txt-group.line>input::-ms-input-placeholder {
    color: var(--color-g500, #b8b8b8)
}

.input-txt-group.line>input::placeholder {
    color: var(--color-g500, #b8b8b8)
}

:root .input-txt-group.line>input::-webkit-input-placeholder {
    color: var(--txt-placeholder)
}

:root .input-txt-group.line>input::-moz-placeholder {
    color: var(--txt-placeholder)
}

:root .input-txt-group.line>input:-ms-input-placeholder {
    color: var(--txt-placeholder)
}

:root .input-txt-group.line>input::-ms-input-placeholder {
    color: var(--txt-placeholder)
}

:root .input-txt-group.line>input::placeholder {
    color: var(--txt-placeholder)
}

.input-txt-group.line:after {
    content: '';
    display: block;
    width: 100%;
    height: 0.2rem;
    position: absolute;
    bottom: -0.2rem;
    left: 0;
    background-color: var(--color-g300, #e0e0e0);
    -webkit-transform: scaleX(0);
    -ms-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: left bottom;
    -ms-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out
}

.input-txt-group.line.active {
    border-color: var(--color-g300, #e0e0e0)
}

:root .input-txt-group.line.active {
    border-color: var(--border-qua)
}

.input-txt-group.line.active:after {
    background-color: var(--color-lm100, #c0f03e)
}

:root .input-txt-group.line.active:after {
    background-color: var(--border-pri-active)
}

.input-txt-group.line.active:after,
.input-txt-group.line.done:after {
    -webkit-transform: scaleX(1);
    -ms-transform: scaleX(1);
    transform: scaleX(1)
}

.input-txt-group.error,
.input-txt-group.line.error {
    border-color: var(--color-re700, #f02727)
}

:root .input-txt-group.error,
:root .input-txt-group.line.error {
    border-color: var(--border-pri-error)
}

.input-txt-group.line.success,
.input-txt-group.success {
    border-color: var(--color-lm500, #69b405)
}

:root .input-txt-group.line.success,
:root .input-txt-group.success {
    border-color: var(--border-pri-success, #039115)
}

.input-txt-group.line.error:after {
    background-color: var(--color-re700, #f02727)
}

:root .input-txt-group.line.error:after {
    background-color: var(--border-pri-error)
}

.input-txt-group.line.success:after {
    background-color: var(--color-lm500, #69b405)
}

:root .input-txt-group.line.success:after {
    background-color: var(--bg-pri-success, #039115)
}

.input-txt-group.line.disabled {
    background: none !important
}

.input-txt-group.line.disabled:after,
.input-txt-group.line.readonly.active:after {
    background-color: var(--color-g300, #e0e0e0)
}

:root .input-txt-group.line.readonly.active:after {
    background-color: var(--border-qua)
}

.input-txt-group.line.disabled *,
.input-txt-group.line.readonly * {
    color: var(--color-g500, #b8b8b8)
}

:root .input-txt-group.line.disabled * {
    color: var(--txt-disabled, #c8d2e4)
}

:root .input-txt-group.line.readonly * {
    color: var(--txt-readonly, #67748e)
}

.input-txt-group.line.disabled .bl-selectbox {
    -webkit-filter: var(--filter-g500);
    filter: var(--filter-g500)
}

.input-txt-group.line .btn-delete-txt {
    padding: 0
}

.input-right-txt,
.input-txt-group.line .input-left-txt {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    -webkit-box-ordinal-group: 5;
    -ms-flex-order: 4;
    order: 4
}

.input-txt-group.line .input-left-txt {
    margin-right: .8rem;
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1
}

.input-txt-group.line .input-right-txt {
    margin-left: .8rem
}

.input-txt-group.line.none::after {
    background-color: var(--border-accent-sec)
}

/*! component element input text 상태 - done, active */

.input-txt-group.done {
    border-color: var(--color-g300, #e0e0e0)
}

.input-txt-group.active .label-field,
.input-txt-group.done .label-field {
    -webkit-transform: translateY(-106%) scale(0.75);
    -ms-transform: translateY(-106%) scale(0.75);
    transform: translateY(-106%) scale(0.75)
}

.input-txt-group.done .input-checkbox-group {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex
}

.input-txt-group.done .txt-field {
    display: block;
    line-height: normal
}

.input-txt-group.done.ui-placeholder>input {
    -webkit-filter: opacity(1);
    filter: opacity(1)
}

.input-txt-group.done input+.input-pw-mask {
    opacity: 1;
    -webkit-transition: opacity .3s ease-in-out;
    -o-transition: opacity .3s ease-in-out;
    transition: opacity .3s ease-in-out
}

.input-txt-group.active {
    border-color: var(--color-g800, #414141)
}

:root .input-txt-group.active {
    border-color: var(--border-sec-active)
}

:root .input-txt-group.button.active {
    border-color: var(--border-qua)
}

:root .input-txt-group.success {
    border-color: var(--border-pri-success)
}

.input-txt-group.active .input-checkbox-group {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex
}

.input-txt-group.active .txt-field {
    display: block
}

.input-txt-group.active.ui-placeholder>input {
    -webkit-filter: opacity(1);
    filter: opacity(1)
}

.input-txt-group.active input+.input-pw-mask {
    opacity: 1;
    -webkit-transition: opacity .3s ease-in-out;
    -o-transition: opacity .3s ease-in-out;
    transition: opacity .3s ease-in-out
}

/*! component element input text data-type="dateSpinner" data-date="YYMMDDH1" 상태 - done, active */

.input-close-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.input-close-group input {
    display: none;
    text-align: right;
    border: 0;
    background-color: transparent
}

.input-close-group .ico-delete-input {
    display: none
}

.input-close-group .label-field {
    display: inline-block;
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g900, #141414)
}

.input-close-group .ico-arrow-sbr {
    margin: 0 0 0 0.4rem;
    width: 1.6rem;
    height: 1.6rem
}

.input-close-group .ico-edit {
    margin: 0 0 0 0.4rem
}

.input-close-group.done .label-field {
    -webkit-transition: none;
    -o-transition: none;
    transition: none;
    display: none
}

.input-close-group.done input {
    display: block
}

.input-close-group.done .ico-delete-input {
    display: block
}

.input-close-group .ico-x,
.input-close-group.done .ico-arrow-sbr {
    display: none
}

.input-close-group.done .ico-x {
    display: block
}

/*! component element input text data-type="dateSpinner" data-date="YYMMDD" 상태 - done, active */

.input-line-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.input-line-group input {
    display: none;
    text-align: right;
    border: 0;
    background-color: transparent
}

.input-line-group .ico-delete-input {
    display: none
}

.input-line-group .label-field {
    display: inline-block;
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g900, #141414);
    border-bottom: 1px solid var(--color-g900, #141414)
}

.input-line-group .ico-arrow-sbr {
    margin: -0.1rem 0.3rem 0 0.5rem
}

.input-line-group .ico-edit {
    margin: -0.1rem 0.3rem 0 0.6rem
}

.input-line-group.done .label-field {
    -webkit-transition: none;
    -o-transition: none;
    transition: none;
    display: none
}

.input-line-group.done input {
    display: block
}

.input-line-group.done .ico-delete-input {
    display: block
}

/*! component element input text 상태 - done, active - 라인타입 */

/*! component element input text 상태 - disabled, error, readonly */

.input-txt-group.error,
.input-txt-group.line.error {
    border-color: var(--color-re700, #f02727)
}

:root .input-txt-group.error,
:root .input-txt-group.line.error {
    border-color: var(--border-pri-error)
}

.input-txt-group.disabled,
.input-txt-group.line.disabled {
    border-color: var(--color-g300, #e0e0e0);
    background-color: var(--color-g100, #f8f8f8)
}

:root .input-txt-group.disabled,
:root .input-txt-group.line.disabled {
    border-color: var(--border-disabled);
    background-color: var(--bg-sec-disabled)
}

:root .input-txt-group.disabled [class^="ico-"],
:root .input-txt-group.line.disabled [class^="ico-"] {
    -webkit-filter: var(--filter-g400);
    filter: var(--filter-g400)
}

.input-txt-group.disabled input::-webkit-input-placeholder,
.input-txt-group.line.disabled input::-webkit-input-placeholder {
    color: var(--color-g500, #b8b8b8)
}

.input-txt-group.disabled input::-moz-placeholder,
.input-txt-group.line.disabled input::-moz-placeholder {
    color: var(--color-g500, #b8b8b8)
}

.input-txt-group.disabled input:-ms-input-placeholder,
.input-txt-group.line.disabled input:-ms-input-placeholder {
    color: var(--color-g500, #b8b8b8)
}

.input-txt-group.disabled input::-ms-input-placeholder,
.input-txt-group.line.disabled input::-ms-input-placeholder {
    color: var(--color-g500, #b8b8b8)
}

.input-txt-group.disabled .input-data,
.input-txt-group.disabled .label-field,
.input-txt-group.disabled .txt-field,
.input-txt-group.disabled>input,
.input-txt-group.disabled input::placeholder,
.input-txt-group.line.disabled .input-data,
.input-txt-group.line.disabled .label-field,
.input-txt-group.line.disabled>input,
.input-txt-group.line.disabled input::placeholder {
    color: var(--color-g500, #b8b8b8)
}

:root .input-txt-group.disabled input::-webkit-input-placeholder,
:root .input-txt-group.line.disabled input::-webkit-input-placeholder {
    color: var(--txt-disabled)
}

:root .input-txt-group.disabled input::-moz-placeholder,
:root .input-txt-group.line.disabled input::-moz-placeholder {
    color: var(--txt-disabled)
}

:root .input-txt-group.disabled input:-ms-input-placeholder,
:root .input-txt-group.line.disabled input:-ms-input-placeholder {
    color: var(--txt-disabled)
}

:root .input-txt-group.disabled input::-ms-input-placeholder,
:root .input-txt-group.line.disabled input::-ms-input-placeholder {
    color: var(--txt-disabled)
}

:root .input-txt-group.disabled .input-data,
:root .input-txt-group.disabled .label-field,
:root .input-txt-group.disabled .txt-field,
:root .input-txt-group.disabled>input,
:root .input-txt-group.disabled input::placeholder,
:root .input-txt-group.line.disabled .input-data,
:root .input-txt-group.line.disabled .label-field,
:root .input-txt-group.line.disabled>input,
:root .input-txt-group.line.disabled input::placeholder {
    color: var(--txt-disabled)
}

:root .input-txt-group.disabled .input-left-txt,
:root .input-txt-group.disabled .input-right-txt {
    display: none
}

:root .input-txt-group.disabled input[placeholder]:disabled {
    padding-top: 0
}

:root .input-txt-group.disabled input[placeholder]:disabled+.label-field {
    display: none
}

.input-txt-group.disabled+.count-txt,
.input-txt-group.disabled+.form-util .helper-msg,
.input-txt-group.line.disabled+.count-txt,
.input-txt-group.line.disabled+.form-util .helper-msg {
    color: var(--color-g500, #b8b8b8)
}

.input-txt-group.readonly {
    border-color: var(--color-g300, #e0e0e0);
    -webkit-box-shadow: none;
    box-shadow: none
}

:root .input-txt-group.readonly {
    border-color: var(--border-disabled);
    background-color: var(--bg-qua)
}

:root .input-txt-group.readonly * {
    color: var(--txt-readonly)
}

:root .input-txt-group.readonly [class^="ico-"] {
    -webkit-filter: var(--filter-ico-readonly);
    filter: var(--filter-ico-readonly)
}

:root .input-txt-group.readonly .bl-selectbox {
    -webkit-filter: var(--filter-g600);
    filter: var(--filter-g600)
}

:root .input-txt-group.readonly .label-field {
    color: var(--txt-readonly)
}

:root .input-txt-group.readonly.txt-pw-type.id-card .input-pw-mask .dash {
    background-color: var(--txt-readonly)
}

:root .input-txt-group.readonly.txt-pw-type.id-card .input-pw-mask .mask {
    background-color: var(--txt-readonly)
}

:root .input-txt-group.readonly .txt-field.right {
    color: var(--txt-readonly)
}

:root .input-txt-group.readonly[data-type="dateSpinner"] {
    border-color: var(--color-g300, #e0e0e0);
    -webkit-box-shadow: none;
    box-shadow: none;
    background-color: var(--color-w100, #fff)
}

:root .input-txt-group.readonly[data-type="dateSpinner"] input {
    color: var(--txt-pri)
}

:root .input-txt-group.readonly[data-type="dateSpinner"] .label-field {
    color: var(--txt-qua)
}

:root .input-txt-group.readonly.readonly-reset-style {
    border-color: var(--color-g300, #e0e0e0);
    background-color: var(--color-w100, #fff)
}

:root .input-txt-group.readonly.readonly-reset-style .label-field {
    color: var(--txt-qua)
}

:root .input-txt-group.readonly.readonly-reset-style input {
    color: var(--txt-pri)
}

:root .input-txt-group.disabled.txt-pw-type.id-card .input-pw-mask .dash {
    background-color: var(--txt-disabled)
}

:root .input-txt-group.disabled.txt-pw-type.id-card .input-pw-mask .mask {
    background: var(--txt-disabled)
}

:root .input-txt-group.disabled.txt-pw-type.id-card .input-pw-mask .number {
    color: var(--txt-disabled)
}

.input-txt-group.readonly .btn-delete-txt {
    display: none
}

.input-txt-group.disabled .bl-selectbox {
    -webkit-filter: var(--filter-g500);
    filter: var(--filter-g500)
}

:root .input-txt-group.disabled .bl-selectbox {
    -webkit-filter: var(--filter-g400);
    filter: var(--filter-g400)
}

:root .input-txt-group.readonly input+.input-pw-mask .mask {
    background-color: var(--txt-readonly, #67748e)
}

:root .input-txt-group.readonly.readonly-reset-style {
    border-color: var(--color-g300, #e0e0e0);
    background-color: var(--color-w100, #fff)
}

:root .input-txt-group.readonly.readonly-reset-style .label-field {
    color: var(--txt-qua)
}

:root .input-txt-group.readonly.readonly-reset-style input {
    color: var(--txt-pri)
}

.input-txt-group[done-readonly] {
    border-color: var(--border-disabled);
    background-color: var(--bg-sec-disabled);
    -webkit-box-shadow: none;
    box-shadow: none
}

.input-txt-group[done-readonly] .label-field {
    color: var(--txt-qua)
}

.input-txt-group[done-readonly] input[readonly] {
    color: var(--txt-readonly)
}

.input-txt-group[done-readonly] .bl-selectbox {
    -webkit-filter: var(--filter-ico-readonly);
    filter: var(--filter-ico-readonly)
}

/*! component element input-masknum 신규추가 2024-04-09 : CHPFMTASK-841 */

.input-masknum-group {
    overflow: hidden;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 3.65rem 2rem 1.45rem;
    border: 1px solid var(--color-g300);
    border-radius: 1.2rem;
    width: 100%;
    -webkit-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out
}

.input-masknum-group.active {
    border-color: var(--border-sec-active)
}

.input-masknum-group.error {
    border-color: var(--color-re700)
}

.input-masknum-group .input-masknum-label {
    overflow: hidden;
    position: absolute;
    left: 0;
    top: 1.45rem;
    padding: 0 2rem 0 2rem;
    max-width: 100%;
    white-space: nowrap;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    text-align: left;
    font-size: 1.2rem;
    color: var(--color-g700)
}

.input-masknum-group .input-masknum-num {
    border: none;
    width: 2.8rem;
    height: 2.1rem;
    font-size: 1.6rem;
    font-weight: 400;
    line-height: 2.1rem;
    color: var(--txt-pri)
}

.input-masknum-group .input-masknum-num::-webkit-input-placeholder {
    font-weight: 400;
    color: var(--txt-pri)
}

.input-masknum-group .input-masknum-num::-moz-placeholder {
    font-weight: 400;
    color: var(--txt-pri)
}

.input-masknum-group .input-masknum-num:-ms-input-placeholder {
    font-weight: 400;
    color: var(--txt-pri)
}

.input-masknum-group .input-masknum-num::-ms-input-placeholder {
    font-weight: 400;
    color: var(--txt-pri)
}

.input-masknum-group .input-masknum-num::placeholder {
    font-weight: 400;
    color: var(--txt-pri)
}

.input-masknum-group .btn-delete-txt {
    display: none;
    margin-left: auto
}

.input-masknum-group .btn-delete-txt.active {
    display: block
}

.input-masknum-group .input-masknum-dash {
    display: inline-block;
    width: 0.6rem;
    height: 0.1rem;
    background-color: var(--ico-ter);
    margin: 0 0.8rem
}

.input-masknum-group .input-masknum-first,
.input-masknum-group .input-masknum-last,
.input-masknum-group .input-masknum-middle {
    font-size: 0
}

.input-masknum-group .input-masknum-first input[type="password"],
.input-masknum-group .input-masknum-last input[type="password"],
.input-masknum-group .input-masknum-middle input[type="password"] {
    position: absolute;
    left: -30rem
}

.input-masknum-group .mask:after {
    display: inline-block;
    content: '\25CB';
    font-size: 1.6rem;
    font-weight: 400;
    content: '\25CF';
    color: var(--txt-pri)
}

.input-masknum-group.white .mask:after {
    display: inline-block;
    content: '\25CB';
    font-size: 1.6rem;
    font-weight: 400;
    color: var(--txt-qua)
}

.input-masknum-group.white .input-masknum-num::-webkit-input-placeholder {
    font-weight: 400;
    color: var(--txt-qua)
}

.input-masknum-group.white .input-masknum-num::-moz-placeholder {
    font-weight: 400;
    color: var(--txt-qua)
}

.input-masknum-group.white .input-masknum-num:-ms-input-placeholder {
    font-weight: 400;
    color: var(--txt-qua)
}

.input-masknum-group.white .input-masknum-num::-ms-input-placeholder {
    font-weight: 400;
    color: var(--txt-qua)
}

.input-masknum-group.white .input-masknum-num::placeholder {
    font-weight: 400;
    color: var(--txt-qua)
}

/*! component element input text 간격 */

.input-txt-group+.selectbox-group {
    margin-top: 1.6rem
}

.selectbox-group+.txt-lv03 {
    padding: 0.8rem 0 0 0.2rem
}

/*! component element select 기본 */

.bl-selectbox {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    right: 2rem;
    width: 1.4rem;
    height: 1.4rem;
    background-image: var(--path-solid-triangle-down);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    z-index: 1
}

.selectbox-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative;
    background-color: var(--color-w100, #fff);
    border: 1px solid var(--border-qua);
    border-radius: 1.2rem;
    height: 7.2rem;
    -webkit-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out
}

.selectbox-group[data-select-popup].done .btn-selectbox .select-txt-wrap .txt-name {
    color: var(--txt-pri)
}

.selectbox-group.reset-layout {
    border: none;
    border-radius: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    background: transparent
}

.selectbox-group.reset-layout .btn-selectbox {
    padding: 0
}

.selectbox-group.reset-layout .btn-selectbox .bl-selectbox {
    right: 0
}

.selectbox-group.reset-layout.done {
    -webkit-box-shadow: none;
    box-shadow: none
}

.dev-reset-layout .selectbox-group {
    border: none;
    border-radius: 0;
    width: 100%;
    height: 100%;
    margin: 0
}

.dev-reset-layout .selectbox-group .btn-selectbox {
    padding: 0
}

.dev-reset-layout .selectbox-group .btn-selectbox .bl-selectbox {
    right: 0
}

.dev-reset-layout .selectbox-group.done {
    -webkit-box-shadow: none;
    box-shadow: none
}

.selectbox-group.no-border {
    border: 0;
    border-radius: 0
}

:root .selectbox-group.no-border {
    border: 0;
    border-radius: 0
}

.selectbox-group.bank-style {
    border: none;
    border-radius: 0;
    width: 100%;
    height: 100%
}

:root .selectbox-group.bank-style {
    border: none;
    border-radius: 0;
    width: 100%;
    height: 100%
}

.selectbox-group.bank-style .btn-selectbox {
    padding: 0
}

.selectbox-group.bank-style .btn-selectbox .bl-selectbox {
    right: 0
}

.selectbox-group.bank-style.done {
    -webkit-box-shadow: none;
    box-shadow: none
}

.selectbox-group>select.system-ui {
    position: relative;
    z-index: 1;
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
    width: 100%;
    height: 100%;
    padding: 0 2rem 0 2rem;
    font-size: 1.6rem;
    color: var(--color-g900, #141414);
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    outline: 0;
    border: none;
    background-color: transparent
}

.selectbox-group>select.custom-ui {
    position: absolute !important;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(1px 1px 1px 1px);
    clip: rect(1px, 1px, 1px, 1px)
}

.selectbox-group .selectbox-label-field {
    position: absolute;
    padding: 0 2rem 0 2rem;
    max-width: 100%;
    left: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-transform-origin: 2rem top;
    -ms-transform-origin: 2rem top;
    transform-origin: 2rem top;
    white-space: nowrap;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    text-align: left;
    overflow: hidden;
    font-size: 1.6rem;
    -webkit-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out;
    color: var(--color-g700)
}

:root .selectbox-group .selectbox-label-field {
    color: var(--txt-qua)
}

.selectbox-group .selectbox-label-field sup.required {
    color: var(--color-re700)
}

.selectbox-group .btn-selectbox {
    position: relative;
    width: 100%;
    height: 100%;
    text-align: left;
    padding: 2.6rem 2rem 0 2rem
}

.selectbox-group .btn-selectbox:disabled .bl-selectbox {
    display: none
}

:root .selectbox-group .btn-selectbox:disabled .bl-selectbox {
    display: block
}

.selectbox-group .select-txt,
.selectbox-group .select-txt-wrap {
    display: block;
    overflow: hidden;
    white-space: nowrap;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    color: var(--color-g700);
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400;
    opacity: 0;
    -webkit-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out;
    padding-right: 2rem
}

:root .selectbox-group .select-txt,
:root .selectbox-group .select-txt-wrap {
    color: var(--txt-pri)
}

.selectbox-group .select-txt [class^="logo-bank"],
.selectbox-group .select-txt-wrap [class^="logo-bank"] {
    display: none;
    margin-right: 0.4rem;
    vertical-align: middle
}

.selectbox-group .select-txt [class^="logo-bank"]+.txt-name,
.selectbox-group .select-txt-wrap [class^="logo-bank"]+.txt-name {
    vertical-align: middle;
    color: var(--txt-qua)
}

:root .selectbox-group.selectbox-trn.ui-input .txt-name {
    color: var(--txt-qua, #67748e)
}

:root .selectbox-group.selectbox-trn.ui-input.done .txt-name {
    color: var(--txt-pri, #020616);
    opacity: 1
}

.selectbox-group .btn-selectbox.no-label {
    padding-top: 0
}

.selectbox-group .btn-selectbox.no-label .select-txt-wrap {
    opacity: 1
}

.selectbox-group .btn-selectbox.bank-type {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center
}

.selectbox-group .btn-selectbox.bank-type [class*="logo-bank"] {
    margin-right: 0.7rem
}

.selectbox-group .btn-selectbox.bank-type .bank-box {
    position: relative;
    padding-top: 0.2rem;
    padding-right: 2rem
}

.selectbox-group .btn-selectbox.bank-type .bank-box .select-txt-wrap {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g900, #141414)
}

.selectbox-group .btn-selectbox.bank-type .bank-box .txt-value02 {
    margin-top: 0.6rem;
    font-size: 1.2rem;
    line-height: 1.6rem;
    font-weight: 400;
    color: var(--color-g800, #414141)
}

.selectbox-group .btn-selectbox.bank-type .bl-selectbox {
    top: 0.3rem;
    right: 0;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none
}

.selectbox-group .btn-selectbox.bank-type02 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.selectbox-group .btn-selectbox.bank-type02 [class*="logo-bank"] {
    margin-right: 0.4rem
}

.selectbox-group .btn-selectbox.bank-type02 .bank-box {
    position: relative;
    padding-right: 1.4rem
}

.selectbox-group .btn-selectbox.bank-type02 .bank-box .select-txt-wrap {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: bold;
    color: var(--color-g900, #141414);
    padding-right: 0
}

.selectbox-group .btn-selectbox.bank-type02 .bank-box .txt-value02 {
    margin-top: 0.6rem;
    font-size: 1.2rem;
    line-height: 1.6rem;
    font-weight: 400;
    color: var(--color-g800, #414141)
}

.selectbox-group .btn-selectbox.bank-type02 .bl-selectbox {
    top: 0.4rem;
    right: 0;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none
}

.selectbox-group .btn-selectbox .select-txt-wrap .tag {
    position: relative;
    top: -0.1rem;
    margin-left: .4rem
}

.selectbox-group.readonly .btn-selectbox[readonly] .select-txt-wrap .tag {
    background-color: var(--bg-ter)
}

.selectbox-group.readonly .btn-selectbox[readonly] .select-txt-wrap .tag .txt {
    color: var(--txt-ter)
}

.selectbox-group .txt-wrap-inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.selectbox-group .txt-wrap-inner i {
    margin-right: .4rem
}

.selectbox-group.noline {
    height: auto;
    border: none;
    background: transparent
}

:root .selectbox-group.noline {
    height: auto;
    border: none;
    background: transparent
}

.selectbox-group.noline .btn-selectbox {
    padding: 0
}

.selectbox-group.noline .select-txt-wrap {
    display: inline-block;
    white-space: normal;
    padding-right: 2.0rem;
    position: relative
}

.selectbox-group.noline .select-txt-wrap .txt-name,
.selectbox-group.noline .select-txt-wrap .txt-value01 {
    display: inline
}

.selectbox-group.noline .select-txt-wrap .bl-selectbox {
    top: 1.5rem
}

.selectbox-group.noline .select-txt-wrap .txt-wrap-inner {
    display: unset;
    -webkit-box-align: unset;
    -ms-flex-align: unset;
    align-items: unset
}

.selectbox-group.noline .select-txt-wrap .txt-wrap-inner i {
    vertical-align: top
}

.selectbox-group.noline .select-txt-wrap.line-clamp-1 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.selectbox-group.noline .select-txt-wrap.line-clamp-1 .bl-selectbox {
    display: block;
    position: unset;
    -webkit-transform: unset;
    -ms-transform: unset;
    transform: unset;
    margin-left: 0.4rem
}

.selectbox-group.noline .select-txt-wrap.line-clamp-1 .txt-wrap-inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    min-width: 0
}

.selectbox-group.noline .select-txt-wrap .txt-wrap-inner i {
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.selectbox-group.noline .select-txt-wrap.line-clamp-1 .txt-name {
    overflow: hidden;
    white-space: nowrap;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    margin-right: 0.4rem
}

.selectbox-group.noline .select-txt-wrap.line-clamp-1 .txt-value01 {
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.selectbox-group.noline .btn-selectbox .select-txt-wrap.line-clamp-1 .tag {
    position: unset;
    top: unset
}

.selectbox-group.noline.disabled .select-txt-wrap.line-clamp-1 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.selectbox-group.noline .select-txt-wrap.line-clamp-1 .bl-selectbox {
    display: block;
    position: unset;
    -webkit-transform: unset;
    -ms-transform: unset;
    transform: unset;
    margin-left: 0.4rem;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.selectbox-group.noline.disabled .select-txt-wrap.line-clamp-1 .txt-wrap-inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.selectbox-group.noline.disabled .select-txt-wrap .txt-wrap-inner i {
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.selectbox-group.noline.disabled .select-txt-wrap.line-clamp-1 .txt-name {
    overflow: hidden;
    white-space: nowrap;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    margin-right: 0.4rem
}

.selectbox-group.noline.disabled .select-txt-wrap.line-clamp-1 .txt-value01 {
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.selectbox-group.noline .bl-selectbox {
    position: absolute;
    right: 0
}

.selectbox-group.noline .txt-name {
    display: inline-block;
    font-size: 2.4rem;
    line-height: 3.3rem;
    font-weight: bold
}

.selectbox-group.noline.ellipsis .txt-name {
    max-width: 23rem;
    white-space: nowrap;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    overflow: hidden
}

.selectbox-group.noline .txt-value01 {
    display: inline-block;
    margin-top: 0;
    color: var(--color-g800, #414141);
    font-size: 2.4rem;
    line-height: 3.3rem;
    font-weight: bold
}

.selectbox-group.noline [class*=txt-lv] .txt-value01 {
    font-size: inherit
}

.selectbox-group.noline .txt-value02 {
    display: block;
    margin-top: 0.8rem;
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g700)
}

.selectbox-group.noline.noSelected .select-txt-wrap {
    color: var(--color-g800, #414141);
    opacity: 1
}

.selectbox-group.noline.noSelected.disabled {
    background-color: transparent;
    border: none
}

.selectbox-group.noline.noSelected.disabled .txt-name {
    color: var(--color-g500, #b8b8b8)
}

.selectbox-group.noline .txt-wrap-inner i {
    margin-right: .8rem
}

.selectbox-group.type3 {
    height: 9.6rem
}

.selectbox-group.type3.done .selectbox-label-field {
    -webkit-transform: translateY(-170%) scale(0.75);
    -ms-transform: translateY(-170%) scale(0.75);
    transform: translateY(-170%) scale(0.75)
}

.selectbox-group.type3 .txt-value02 {
    display: block;
    margin-top: 0.4rem;
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--txt-qua)
}

[select-type="direct"] .input-txt-group {
    display: none
}

[select-type="direct"].active .selectbox-group {
    display: none
}

[select-type="direct"].active {
    border: 0
}

[select-type="direct"].active .ui-select-btn {
    display: none
}

[select-type="direct"].active .input-txt-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%
}

/*! component element select 상태 - done */

.selectbox-group.done .selectbox-label-field {
    -webkit-transform: translateY(-110%) scale(0.75);
    -ms-transform: translateY(-110%) scale(0.75);
    transform: translateY(-110%) scale(0.75)
}

.selectbox-group.done .select-txt,
.selectbox-group.done .select-txt-wrap {
    color: var(--txt-pri);
    opacity: 1
}

.selectbox-group.done .select-txt [class^="logo-bank"],
.selectbox-group.done .select-txt-wrap [class^="logo-bank"] {
    display: inline-block
}

.selectbox-group.done .btn-delete-select {
    position: absolute;
    right: 0;
    width: 5.0rem;
    height: 100%
}

.selectbox-group.done .btn-delete-select .ico-delete-input {
    position: absolute;
    right: 2rem;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    z-index: 1
}

.selectbox-group.error {
    border-color: var(--color-re700, #f02727)
}

:root .selectbox-group.error {
    border-color: var(--border-pri-error)
}

.selectbox-group.success {
    border-color: var(--color-lm500, #69b405)
}

:root .selectbox-group.success {
    border-color: var(--border-pri-success, #039115)
}

.selectbox-group.disabled {
    border-color: var(--color-g300, #e0e0e0);
    background-color: var(--color-g100, #f8f8f8)
}

:root .selectbox-group.disabled {
    border-color: var(--border-disabled);
    background-color: var(--bg-sec-disabled)
}

.selectbox-group.disabled .btn-selectbox {
    pointer-events: none
}

:root .form-box-group.disabled .form-box-label .bl-selectbox,
:root .selectbox-group.disabled .bl-selectbox,
:root .selectbox-group.disabled .select-txt,
:root .selectbox-group.disabled .select-txt-wrap,
:root .selectbox-group.disabled .selectbox-label-field {
    color: var(--color-g400, #c8d2e4);
    border-top-color: var(--color-g400, #c8d2e4);
    -webkit-filter: var(--filter-ico-disabled);
    filter: var(--filter-ico-disabled)
}

:root .selectbox-group.disabled .select-txt-wrap .txt-name {
    color: var(--txt-disabled)
}

:root .selectbox-group.disabled .selectbox-label-field {
    color: var(--txt-disabled)
}

.selectbox-group.disabled .bl-selectbox [class^="logo-bank"],
.selectbox-group.disabled .select-txt [class^="logo-bank"],
.selectbox-group.disabled .select-txt-wrap [class^="logo-bank"],
.selectbox-group.disabled .selectbox-label-field [class^="logo-bank"] {
    display: inline-block;
    -webkit-filter: grayscale(1);
    filter: grayscale(1)
}

.selectbox-group.noline.disabled {
    background-color: transparent
}

.selectbox-group.disabled .select-txt-wrap {
    -webkit-filter: none;
    filter: none
}

.selectbox-group.disabled .select-txt-wrap * {
    -webkit-filter: var(--filter-g500);
    filter: var(--filter-g500)
}

.selectbox-group.disabled .select-txt-wrap .txt-wrap-inner {
    -webkit-filter: none;
    filter: none
}

.selectbox-group.disabled .bl-selectbox [class*="logo-bank"],
.selectbox-group.disabled .select-txt [class*="logo-bank"],
.selectbox-group.disabled .select-txt-wrap .txt-wrap-inner [class*="logo-bank"],
.selectbox-group.disabled .select-txt-wrap [class*="logo-bank"],
.selectbox-group.disabled .selectbox-label-field [class*="logo-bank"] {
    filter: none;
    -webkit-filter: none;
    opacity: .3
}

/*! component element select 상태 - nodata */

.selectbox-group.nodata {
    border-color: var(--color-g300, #e0e0e0);
    height: 7.2rem
}

.selectbox-group.nodata.type3 {
    height: 7.2rem
}

.selectbox-group.nodata .selectbox-label-field {
    color: var(--color-g500, #b8b8b8)
}

.selectbox-group.nodata .bl-selectbox {
    -webkit-filter: var(--filter-g500);
    filter: var(--filter-g500)
}

/*! component element select 상태 - readonly : 2024-03-21 접근성(KDS 추가) */

.selectbox-group.readonly .btn-selectbox[readonly] .select-txt-wrap {
    color: var(--txt-readonly)
}

.selectbox-group.readonly .btn-selectbox[readonly] .selectbox-label-field {
    color: var(--txt-readonly)
}

.selectbox-group.readonly .btn-selectbox[readonly] .bl-selectbox {
    -webkit-filter: var(--filter-g400);
    filter: var(--filter-g400)
}

/*! component element select 상태 - disabled */

/*! component element select arrow type */

.selectbox-arrow-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.selectbox-arrow-group>select.custom-ui {
    position: absolute !important;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(1px 1px 1px 1px);
    clip: rect(1px, 1px, 1px, 1px)
}

.selectbox-arrow-group .btn-selectbox {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding-right: 4rem
}

.selectbox-arrow-group .select-txt {
    font-size: 1.4rem
}

.selectbox-arrow-group .ico-arrow-open {
    margin-left: 0.4rem
}

.selectbox-arrow-group.h-56 .btn-selectbox {
    padding-right: 2rem
}

/*! component element select arrow radius type - 사용안함 */

/*! component element select bl radius type */

.selectbox-bl-radius-group {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    position: relative;
    display: inline-flex;
    border-radius: 99rem;
    padding: 0.8rem 3.4rem 0.8rem 1.6rem;
    border: 1px solid var(--color-bu900, #003fc7)
}

:root .selectbox-bl-radius-group {
    border: 1px solid var(--indigo-in1100, #0114a7)
}

.selectbox-bl-radius-group>select.custom-ui {
    position: absolute !important;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(1px 1px 1px 1px);
    clip: rect(1px, 1px, 1px, 1px)
}

.selectbox-bl-radius-group .btn-selectbox {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.selectbox-bl-radius-group .btn-selectbox .txt-name {
    font-size: 2.1rem;
    line-height: 1.2;
    font-weight: 700;
    color: var(--color-bu900, #003fc7)
}

:root .selectbox-bl-radius-group .btn-selectbox .txt-name {
    color: var(--txt-accent-pri)
}

.selectbox-bl-radius-group .select-txt {
    font-size: 1.4rem
}

.selectbox-bl-radius-group .bl-selectbox {
    -webkit-filter: var(--filter-bu900);
    filter: var(--filter-bu900);
    right: 1.3rem
}

:root .selectbox-bl-radius-group .bl-selectbox {
    -webkit-filter: var(--filter-pn);
    filter: var(--filter-pn)
}

.selectbox-bl-radius-group+[class^="txt"] {
    margin-left: 0.2rem
}

.selectbox-bl-radius-group.reverse {
    background: var(--color-bu900, #003fc7)
}

:root .selectbox-bl-radius-group.reverse {
    background: var(--bg-pri);
    border-color: var(--bg-pri)
}

.selectbox-bl-radius-group.reverse .bl-selectbox {
    -webkit-filter: var(--filter-w100);
    filter: var(--filter-w100)
}

:root .selectbox-bl-radius-group.reverse .bl-selectbox {
    -webkit-filter: var(--filter-w100);
    filter: var(--filter-w100)
}

.selectbox-bl-radius-group.reverse .btn-selectbox .txt-name {
    color: var(--color-w100, #fff)
}

:root .selectbox-bl-radius-group.reverse .btn-selectbox .txt-name {
    color: var(--txt-pri-invert)
}

.selectbox-bl-radius-group.color2 {
    border-color: var(--color-bu800, #0150ff)
}

:root .selectbox-bl-radius-group.color2 {
    border-color: var(--border-accent-pri)
}

.selectbox-bl-radius-group.color2 .bl-selectbox {
    -webkit-filter: var(--filter-bu900);
    filter: var(--filter-bu900)
}

:root .selectbox-bl-radius-group.color2 .bl-selectbox {
    -webkit-filter: var(--filter-pn);
    filter: var(--filter-pn)
}

.selectbox-bl-radius-group.color2 .btn-selectbox .txt-name {
    color: var(--color-bu800, #0150ff)
}

.selectbox-bl-radius-group.color3 {
    border-color: var(--color-g300, #e0e0e0)
}

:root .selectbox-bl-radius-group.color3 {
    border-color: var(--border-qua)
}

.selectbox-bl-radius-group.color3 .bl-selectbox {
    -webkit-filter: var(--filter-g900);
    filter: var(--filter-g900)
}

.selectbox-bl-radius-group.color3 .btn-selectbox .txt-name {
    color: var(--color-g900, #141414)
}

:root .selectbox-bl-radius-group.color3 .bl-selectbox {
    -webkit-filter: var(--filter-g900);
    filter: var(--filter-g900)
}

:root .selectbox-bl-radius-group.color3 .btn-selectbox .txt-name {
    color: var(--txt-pri)
}

.selectbox-bl-radius-group.color4 {
    padding: 0 3.4rem 0 0;
    border: 0
}

.selectbox-bl-radius-group.color4 .btn-selectbox .select-txt-wrap {
    text-align: left
}

.selectbox-bl-radius-group.color4 .btn-selectbox .txt-name {
    font-size: 2.4rem;
    font-weight: 700;
    color: var(--color-g900, #141414)
}

.selectbox-bl-radius-group.color4 .btn-selectbox .txt-name.line-clamp-2 {
    word-break: keep-all
}

.selectbox-bl-radius-group.color4 .bl-selectbox {
    -webkit-filter: var(--filter-g900);
    filter: var(--filter-g900)
}

:root .selectbox-bl-radius-group.color4 {
    padding: 0 3.4rem 0 0;
    border: 0
}

:root .selectbox-bl-radius-group.color4 .btn-selectbox .txt-name {
    color: var(--txt-pri, #020616)
}

:root .selectbox-bl-radius-group.color4 .bl-selectbox {
    -webkit-filter: var(--filter-g900);
    filter: var(--filter-g900)
}

.selectbox-bl-radius-group.bu900 {
    border-color: var(--color-bu900)
}

.selectbox-bl-radius-group.bu900 .btn-selectbox .txt-name {
    color: var(--color-bu900)
}

.selectbox-bl-radius-group.bu900 .bl-selectbox {
    -webkit-filter: var(--filter-bu900);
    filter: var(--filter-bu900)
}

.selectbox-bl-radius-group.dimmed {
    border-color: var(--color-g300, #e0e0e0);
    background-color: var(--color-g100, #f8f8f8)
}

.selectbox-bl-radius-group.dimmed .bl-selectbox {
    -webkit-filter: var(--filter-g500);
    filter: var(--filter-g500)
}

.selectbox-bl-radius-group.dimmed .btn-selectbox .txt-name {
    color: var(--color-g500, #b8b8b8)
}

.selectbox-bl-radius-group.dimmed .btn-selectbox .bl-selectbox {
    -webkit-filter: var(--filter-g500);
    filter: var(--filter-g500)
}

:root .selectbox-bl-radius-group.dimmed {
    border-color: var(--border-disabled, #e0e6f1);
    background-color: var(--bg-sec-disabled, #f7f9fd)
}

:root .selectbox-bl-radius-group.dimmed .bl-selectbox {
    -webkit-filter: var(--filter-g400);
    filter: var(--filter-g400)
}

:root .selectbox-bl-radius-group.dimmed .btn-selectbox .txt-name {
    color: var(--txt-disabled, #c8d2e4)
}

:root .selectbox-bl-radius-group.dimmed .btn-selectbox .bl-selectbox {
    -webkit-filter: var(--filter-g400);
    filter: var(--filter-g400)
}

.selectbox-bl-radius-group.medium .btn-selectbox .txt-name {
    font-size: 1.8rem
}

.selectbox-bl-radius-group.small .btn-selectbox .txt-name {
    font-size: 1.6rem;
    font-weight: 400
}

.selectbox-bl-radius-group.no-radius {
    border-radius: 0;
    border: 0;
    padding: 0
}

.selectbox-bl-radius-group.no-radius .btn-selectbox .txt-name {
    color: var(--color-pb100, #000)
}

.selectbox-bl-radius-group.no-radius .bl-selectbox {
    -webkit-filter: var(--filter-pb100);
    filter: var(--filter-pb100)
}

.selectbox-bl-radius-group.reverse.type2 {
    background: var(--bg-accent-pri);
    padding: 0.8rem 3.8rem 0.8rem 1.6rem;
    border: 1px solid var(--border-accent-sec)
}

.selectbox-bl-radius-group.reverse.type2 .btn-selectbox .txt-name {
    font-size: 1.8rem;
    font-weight: 700;
    line-height: 2.5rem
}

.selectbox-bl-radius-group.reverse.type7 {
    background-color: var(--color-bu900);
    border-color: var(--color-bu900)
}

.selectbox-bl-radius-group.type7 {
    background-color: var(--bg-base);
    border-color: var(--color-bu900)
}

.selectbox-bl-radius-group.type7 .bl-selectbox {
    -webkit-filter: var(--filter-bu900);
    filter: var(--filter-bu900)
}

.selectbox-bl-radius-group.type7 .btn-selectbox .select-txt-wrap .txt-name {
    color: var(--color-bu900)
}

.selectbox-bl-radius-group.reverse.type7 .btn-selectbox .select-txt-wrap .txt-name {
    color: var(--txt-pri-invert)
}

.graybox-text-group.ty03 .box-inner-group.disabled .selectbox-bl-radius-group.type8 {
    border-color: var(--txt-accent-sec)
}

.selectbox-bl-radius-group.type8 {
    background-color: var(--bg-base)
}

.selectbox-bl-radius-group.type8 .select-txt-wrap .txt-name {
    color: var(--txt-accent-sec)
}

.selectbox-bl-radius-group.type8 .bl-selectbox {
    -webkit-filter: var(--filter-in700);
    filter: var(--filter-in700)
}

.graybox-text-group.ty03 .box-inner-group.disabled .selectbox-bl-radius-group.type8.dimmed {
    border-color: var(--border-disabled);
    background-color: var(--bg-sec-disabled)
}

.selectbox-bl-radius-group.type8.dimmed .bl-selectbox {
    -webkit-filter: var(--filter-ico-disabled);
    filter: var(--filter-ico-disabled)
}

.selectbox-bl-radius-group.type8.dimmed .txt-name {
    color: var(--txt-readonly)
}

/*! component element selectbox-bl-radius-group 상태 - disabled, readonly */

:root .selectbox-bl-radius-group.disabled {
    border-color: var(--border-disabled);
    background-color: var(--bg-sec-disabled)
}

:root .selectbox-bl-radius-group.disabled>.btn-selectbox:disabled .select-txt-wrap .txt-name {
    color: var(--txt-disabled)
}

:root .selectbox-bl-radius-group.disabled>.btn-selectbox:disabled .select-txt-wrap+.bl-selectbox {
    -webkit-filter: var(--filter-g400);
    filter: var(--filter-g400)
}

:root .selectbox-bl-radius-group.disabled {
    border-color: var(--border-disabled);
    background-color: var(--bg-sec-disabled)
}

:root .selectbox-bl-radius-group.disabled>.btn-selectbox:disabled .select-txt-wrap .txt-name {
    color: var(--txt-disabled)
}

:root .selectbox-bl-radius-group.disabled>.btn-selectbox:disabled .select-txt-wrap+.bl-selectbox {
    -webkit-filter: var(--filter-g400);
    filter: var(--filter-g400)
}

:root .selectbox-bl-radius-group.readonly {
    border-color: var(--border-disabled);
    background-color: var(--bg-sec-disabled)
}

:root .selectbox-bl-radius-group.readonly>.btn-selectbox[readonly] .select-txt-wrap .txt-name {
    color: var(--txt-disabled)
}

:root .selectbox-bl-radius-group.readonly>.btn-selectbox[readonly] .select-txt-wrap+.bl-selectbox {
    -webkit-filter: var(--filter-g400);
    filter: var(--filter-g400)
}

:root .selectbox-bl-radius-group.readonly {
    border-color: var(--border-disabled);
    background-color: var(--bg-sec-disabled)
}

:root .selectbox-bl-radius-group.readonly>.btn-selectbox[readonly] .select-txt-wrap .txt-name {
    color: var(--txt-readonly)
}

:root .selectbox-bl-radius-group.readonly>.btn-selectbox[readonly] .select-txt-wrap+.bl-selectbox {
    -webkit-filter: var(--filter-g400);
    filter: var(--filter-g400)
}

button.selectbox-bl-radius-group.readonly[readonly]>.btn-selectbox .select-txt-wrap+.bl-selectbox {
    -webkit-filter: var(--filter-g400);
    filter: var(--filter-g400)
}

button.selectbox-bl-radius-group.readonly[readonly]>.btn-selectbox .select-txt-wrap .txt-name {
    color: var(--txt-readonly)
}

/*! component element 이체하기 상단고정 */

.section-component-sticky {
    position: -webkit-sticky;
    position: sticky;
    z-index: 79;
    top: 5.0rem;
    background: var(--color-w100, #fff);
    overflow: hidden;
    -ms-touch-action: none;
    touch-action: none
}

.section-component-sticky:before {
    content: '';
    display: block;
    width: 100%;
    height: 25px;
    background: var(--color-w100, #fff);
    position: absolute;
    left: 0;
    bottom: 100%
}

.section-component-sticky .component-text-simple {
    padding-top: 2.4rem
}

.section-component-sticky .title-group .title-field-page {
    line-height: 1
}

.section-component-sticky .component-text-list {
    margin-top: 7rem
}

.section-component-sticky .component-text-list .tooltip-area.align-right {
    -webkit-transform: translateX(6rem);
    -ms-transform: translateX(6rem);
    transform: translateX(6rem)
}

.section-component-sticky .component-text-list .tooltip-area.align-right:after {
    right: 35%
}

/*! 이체 - 금액 키패드 */

/*! component element select, input 이체하기 */

.input-txt-group.input-txt-trn {
    height: 7.2rem
}

.input-txt-group.input-txt-trn>input,
.selectbox-group.selectbox-trn .txt-name {
    font-size: 1.9rem;
    line-height: 2.6rem
}

.tooltip-focus-group.paste-tooltip {
    left: 8rem;
    top: 0
}

.tooltip-focus-group.paste-tooltip .tooltip-area:after {
    left: 16px;
    bottom: -6px
}

/*! component element checkbox 기본속성 */

.input-checkbox {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    position: relative;
    width: 2rem;
    height: 2rem
}

.input-checkbox.circle {
    width: 2.4rem;
    height: 2.4rem
}

.input-checkbox.toggle {
    width: 4.4rem;
    height: 2.4rem
}

:root .input-checkbox.toggle {
    width: 5.4rem;
    height: 2.8rem
}

.input-checkbox.like {
    width: 2rem;
    height: 2rem
}

:root .input-checkbox.like {
    width: 2.4rem;
    height: 2.4rem
}

.input-checkbox.like.w44 {
    width: 4.4rem !important;
    height: 4.4rem !important;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.input-checkbox.like.type2 {
    width: 4.8rem;
    height: 4.8rem;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.input-checkbox input {
    position: absolute;
    z-index: 2;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    opacity: 0
}

:root .input-checkbox input:disabled+.checkbox-shape-line::after {
    -webkit-filter: var(--filter-g400);
    filter: var(--filter-g400)
}

.input-checkbox.pin {
    width: 2.4rem;
    height: 2.4rem
}

.input-checkbox.pin .ico-pin {
    -webkit-filter: var(--filter-g500);
    filter: var(--filter-g500)
}

/*! component element checkbox 관심토픽 */

.component-form.topic {
    margin-top: 3.6rem
}

.input-checkbox.topic {
    width: 100%;
    height: auto;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.input-checkbox.topic .topic-pic {
    width: 100%;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    width: 100%;
    height: 10.5rem;
    border-radius: 1.6rem;
    background-color: var(--color-g100, #f8f8f8);
    position: relative;
    border: 1px solid var(--color-g100, #f8f8f8)
}

.input-checkbox.topic .topic-pic [class^="ico-topic"] {
    position: absolute;
    top: 1.9rem;
    left: 50%;
    width: 4.4rem;
    height: 4.4rem;
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0)
}

.input-checkbox.topic input:checked+.topic-pic {
    border-color: var(--color-pn, #17008c)
}

.input-checkbox.topic input:checked+.topic-pic:before {
    content: '';
    display: block;
    position: absolute;
    top: .8rem;
    right: .8rem;
    width: 2.4rem;
    height: 2.4rem;
    border-radius: 99rem;
    background-color: var(--color-pn, #17008c);
    background-position: center center;
    background-repeat: no-repeat;
    background-image: var(--path-solid-colored-check-ico-pri-invert);
    background-size: 1.4rem 1.4rem;
    z-index: 1
}

.input-checkbox.topic label {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    text-align: center;
    padding-top: 6.7rem;
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--color-g600, #9b9b9b);
    z-index: 2
}

.input-checkbox.topic input:checked+.topic-pic+label {
    font-weight: bold;
    color: var(--color-pn, #17008c)
}

.component-form.poll-card-warp {
    margin-top: 2.8rem
}

.component-form.poll-card-warp .poll-card-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-column-gap: 1rem;
    -moz-column-gap: 1rem;
    column-gap: 1rem
}

.component-form.poll-card-warp .poll-card-group .poll-card-items {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.component-form.poll-card-warp.columns-2n .poll-card-group {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    gap: 1rem;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.component-form.poll-card-warp.columns-2n .poll-card-group .poll-card-items {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 calc(50% - 0.5rem);
    flex: 0 0 calc(50% - 0.5rem)
}

.component-form.poll-card-warp.columns-3n .poll-card-group {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    gap: 1rem;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.component-form.poll-card-warp.columns-3n .poll-card-group .poll-card-items {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 calc(33.33333333% - 0.67rem);
    flex: 0 0 calc(33.33333333% - 0.67rem)
}

.component-form.poll-card-warp.columns-4n .poll-card-group {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    gap: 1rem;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.component-form.poll-card-warp.columns-4n .poll-card-group .poll-card-items {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 calc(25% - 0.75rem);
    flex: 0 0 calc(25% - 0.75rem)
}

.input-checkbox.poll-card {
    width: 100%;
    height: auto;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.input-checkbox.poll-card .txt {
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 2rem;
    color: var(--txt-qua);
    padding-left: 1.4rem;
    padding-right: 1.4rem;
    overflow: hidden;
    white-space: nowrap;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis
}

.input-checkbox.poll-card .poll-card-img {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding-top: 1.9rem;
    position: relative;
    width: 100%;
    height: 10.5rem;
    border-radius: 1.6rem;
    background-color: var(--bg-qua);
    border: 0.1rem solid var(--border-quin)
}

.input-checkbox.poll-card .poll-card-img .img {
    width: 4.4rem;
    height: 4.4rem;
    padding: .2rem
}

.input-checkbox.poll-card input:checked+.poll-card-img {
    border-color: var(--border-pri-active)
}

.input-checkbox.poll-card input:checked+.poll-card-img:before {
    content: '';
    display: block;
    position: absolute;
    top: .8rem;
    right: .8rem;
    width: 2.4rem;
    height: 2.4rem;
    border-radius: 99rem;
    background-color: var(--color-pn, #17008c);
    background-position: center center;
    background-repeat: no-repeat;
    background-image: var(--path-solid-colored-check-ico-pri-invert);
    background-size: 1.4rem 1.4rem;
    z-index: 1
}

.input-checkbox.poll-card label {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    text-align: center;
    padding-top: 6.7rem;
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--color-g600, #9b9b9b);
    z-index: 1
}

.input-checkbox.poll-card input:checked+.poll-card-img+label {
    font-weight: bold;
    color: var(--color-pn, #17008c)
}

/*! component element checkbox 텍스트 */

.checkbox-txt-field {
    position: relative;
    font-size: 1.4rem;
    font-weight: 500;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap
}

:root .checkbox-txt-field {
    color: var(--txt-sec)
}

.checkbox-txt-field.fs16 {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400
}

.checkbox-txt-field.style01 {
    font-size: 1.6rem;
    font-weight: bold;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    white-space: normal
}

:root .checkbox-txt-field.style01 {
    color: var(--txt-pri, #020616)
}

/*! component element checkbox 모양 - 기본 */

.checkbox-shape {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    width: 100%
}

.checkbox-shape:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    text-align: center;
    -webkit-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out;
    border: 0.14rem solid var(--color-g300, #e0e0e0);
    border-radius: 0.2rem;
    background-color: var(--color-w100, #fff)
}

.checkbox-shape:after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 1.6rem;
    height: 1.6rem;
    background-position: 0 0;
    background-repeat: no-repeat;
    background-image: var(--path-solid-colored-check-ico-ter);
    background-size: contain
}

:root .checkbox-shape:after {
    background-image: var(--path-checkbox-square)
}

/*! component element checkbox 모양 - circle */

.checkbox-shape-circle {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    width: 100%
}

.checkbox-shape-circle:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    text-align: center;
    -webkit-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out;
    border: 0.2rem solid var(--color-g300, #e0e0e0);
    border-radius: 50%;
    background-color: transparent
}

:root .checkbox-shape-circle:before {
    border: 0.2rem solid var(--border-qua)
}

.checkbox-shape-circle:after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 1.6rem;
    height: 1.6rem;
    background-position: 0 0;
    background-repeat: no-repeat;
    background-image: var(--path-solid-colored-check-ico-ter);
    background-size: contain
}

:root .checkbox-shape-circle:before {
    border-color: var(--border-qua, #e0e6f1)
}

:root .checkbox-shape-circle:after {
    width: 1.4rem;
    height: 1.4rem;
    background-image: var(--path-checkbox-circle)
}

/*! component element checkbox 모양 - line */

.checkbox-shape-line {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    width: 100%
}

.checkbox-shape-line:before {}

.checkbox-shape-line:after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 1.6rem;
    height: 1.6rem;
    background-position: 0 0;
    background-repeat: no-repeat;
    background-image: var(--path-solid-colored-check-ico-ter);
    background-size: contain
}

:root .checkbox-shape-line:after {
    background-image: var(--path-checkbox-line-2depth)
}

.checkbox-shape-line.type2:after {
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-checkbox-line)
}

/*! component element checkbox 모양 - star */

.checkbox-shape-like {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-star-ico-ter);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat
}

:root .checkbox-shape-like {
    background-image: var(--path-checkbox-star)
}

.checkbox-shape-like.type2 {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-colored-heart-ico-ter);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat
}

:root .checkbox-shape-like.type2 {
    background-image: var(--path-checkbox-heart)
}

/*! component element checkbox 모양 - toggle */

.checkbox-shape-toggle {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    width: 100%
}

.checkbox-shape-toggle:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    background-color: var(--color-g300, #e0e0e0);
    width: 100%;
    height: 100%;
    text-align: center;
    border-radius: 2.3rem
}

:root .checkbox-shape-toggle:before {
    background-color: var(--bg-sec)
}

.checkbox-shape-toggle:after {
    content: '';
    display: block;
    position: absolute;
    background-color: var(--color-w100, #fff);
    width: 2rem;
    height: 2rem;
    border: 0.04rem solid var(--color-pb5, #0000000C);
    border-radius: 50%;
    top: 50%;
    left: 0.2rem;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out;
    -webkit-box-shadow: 0 0.2rem 0.2rem rgba(0, 0, 0, 0.06);
    box-shadow: 0 0.2rem 0.2rem rgba(0, 0, 0, 0.06)
}

:root .checkbox-shape-toggle:after {
    width: 2.2rem;
    height: 2.2rem;
    left: 0.3rem
}

:root .checkbox-shape-toggle:after,
:root .checkbox-shape-toggle:before {
    line-height: 2.7;
    font-size: 1.1rem;
    font-weight: 500;
    font-style: normal
}

:root .checkbox-shape-toggle:before {
    content: 'OFF';
    padding-left: 2.3rem;
    color: var(--txt-sec, #3b4659);
    background-color: var(--bg-sec, #e0e6f1)
}

:root .checkbox-shape-toggle:after {
    left: 0.3rem;
    width: 2.2rem;
    height: 2.2rem;
    background-color: var(--bg-base, #fff);
    border: none;
    outline: 0;
    -webkit-box-shadow: 0 0.2rem 0.2rem 0 rgba(0, 0, 0, 0.06);
    box-shadow: 0 0.2rem 0.2rem 0 rgba(0, 0, 0, 0.06)
}

/*! component element checkbox 모양 - pin */

.checkbox-shape-pin {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-checkbox-pin);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat
}

/*! component element checkbox 상태 */

.input-checkbox input.checked+.checkbox-shape-circle:before,
.input-checkbox input.checked+.checkbox-shape:before,
.input-checkbox input:checked+.checkbox-shape-circle:before,
.input-checkbox input:checked+.checkbox-shape:before {
    background-color: var(--color-pl, #b6f23d);
    border-color: var(--color-pl, #b6f23d)
}

:root .input-checkbox input.checked+.checkbox-shape-circle:before,
:root .input-checkbox input.checked+.checkbox-shape:before,
:root .input-checkbox input:checked+.checkbox-shape-circle:before,
:root .input-checkbox input:checked+.checkbox-shape:before {
    background-color: var(--bg-pri-active, #0114a7);
    border-color: var(--bg-pri-active, #0114a7)
}

.input-checkbox input.checked+.checkbox-shape-circle.pn:before,
.input-checkbox input:checked+.checkbox-shape-circle.pn:before {
    background-color: var(--color-pn, #17008c);
    border-color: var(--color-pn, #17008c)
}

.input-checkbox input.checked+.checkbox-shape-circle:after,
.input-checkbox input.checked+.checkbox-shape:after,
.input-checkbox input:checked+.checkbox-shape-circle:after,
.input-checkbox input:checked+.checkbox-shape:after {
    background-position: 0 0;
    background-repeat: no-repeat;
    background-image: var(--path-solid-colored-check-ico-pri-invert);
    background-size: contain
}

:root .input-checkbox.circle input.checked+.checkbox-shape-circle:after,
:root .input-checkbox.circle input:checked+.checkbox-shape-circle:after {
    background-image: var(--path-checkbox-circle-active)
}

:root .input-checkbox input.checked+.checkbox-shape:after,
:root .input-checkbox input:checked+.checkbox-shape:after {
    background-image: var(--path-checkbox-square-active)
}

.input-checkbox input.checked+.checkbox-shape-line:before,
.input-checkbox input:checked+.checkbox-shape-line:before {
    background-color: transparent;
    border-color: transparent
}

.input-checkbox input.checked+.checkbox-shape-line:after,
.input-checkbox input:checked+.checkbox-shape-line:after {
    background-image: var(--path-solid-check);
    background-position: 0 0;
    background-repeat: no-repeat;
    background-size: contain
}

:root .input-checkbox input.checked+.checkbox-shape-line:after,
:root .input-checkbox input:checked+.checkbox-shape-line:after {
    background-image: var(--path-checkbox-line-2depth)
}

:root .input-checkbox input.checked+.checkbox-shape-line:after,
:root .input-checkbox input:checked+.checkbox-shape-line:after {
    background-image: var(--path-checkbox-line-active)
}

.input-checkbox input.checked+.checkbox-shape-toggle:before,
.input-checkbox input:checked+.checkbox-shape-toggle:before {
    background-color: var(--color-pl, #b6f23d)
}

:root .input-checkbox input.checked+.checkbox-shape-toggle:before,
:root .input-checkbox input:checked+.checkbox-shape-toggle:before {
    background-color: var(--bg-pri-active)
}

.input-checkbox input.checked+.checkbox-shape-toggle:after,
.input-checkbox input:checked+.checkbox-shape-toggle:after {
    left: 2.2rem;
    border: 0.04rem solid var(--color-pl, #b6f23d)
}

:root .input-checkbox input.checked+.checkbox-shape-toggle:before,
:root .input-checkbox input:checked+.checkbox-shape-toggle:before {
    content: 'ON';
    text-align: left;
    padding-left: 0.7rem;
    color: var(--txt-pri-invert, #fff);
    background-color: var(--bg-pri-active, #0114a7)
}

:root .input-checkbox input.checked+.checkbox-shape-toggle:after,
:root .input-checkbox input:checked+.checkbox-shape-toggle:after {
    left: 2.8rem;
    color: var(--txt-pri-invert, #fff);
    background-color: var(--bg-base, #fff);
    border: 0.04rem solid var(--border-handle, rgba(0, 0, 0, 0.05))
}

.input-checkbox input.checked+.checkbox-shape-like,
.input-checkbox input:checked+.checkbox-shape-like {
    background-image: var(--path-solid-colored-star-ico-sec-active)
}

:root .input-checkbox input.checked+.checkbox-shape-like,
:root .input-checkbox input:checked+.checkbox-shape-like {
    background-image: var(--path-checkbox-star-active)
}

:root .input-checkbox input.checked+.checkbox-shape-like.type2,
:root .input-checkbox input:checked+.checkbox-shape-like.type2 {
    background-image: var(--path-checkbox-heart-active)
}

.input-checkbox input.checked+.checkbox-shape-like.type2,
.input-checkbox input:checked+.checkbox-shape-like.type2 {
    background-image: var(--path-solid-colored-heart-ico-pri-like)
}

.input-checkbox input.checked+.checkbox-shape-line.type2:after .input-checkbox input:checked+.checkbox-shape-line.type2:after {
    background-image: var(--path-checkbox-line-active)
}

.input-checkbox input.checked+.checkbox-shape-pin,
.input-checkbox input:checked+.checkbox-shape-pin {
    background-image: var(--path-checkbox-pin-active)
}

:root .input-checkbox.darkmode input:checked+.checkbox-shape-toggle:before {
    background-color: var(--color-in700)
}

.input-checkbox.my-menu-pin {
    width: 2.4rem;
    height: 2.4rem
}

.input-checkbox.my-menu-pin .checkbox-home-pin {
    width: 2.4rem;
    height: 2.4rem;
    background-image: url("../../img/mmk/common/ico_home_pin_off.svg")
}

.input-checkbox input.checked+.checkbox-home-pin,
.input-checkbox input:checked+.checkbox-home-pin {
    background-image: url("../../img/mmk/common/ico_home_pin_on.svg")
}

.input-checkbox input.disabled+.checkbox-shape-circle.pn:before,
.input-checkbox input.disabled+.checkbox-shape-circle:before,
.input-checkbox input.disabled+.checkbox-shape:before,
.input-checkbox input:disabled+.checkbox-shape-circle.pn:before,
.input-checkbox input:disabled+.checkbox-shape-circle:before,
.input-checkbox input:disabled+.checkbox-shape:before {
    background-color: var(--color-g200, #eee);
    border-color: var(--color-g300, #e0e0e0)
}

:root .input-checkbox input.disabled+.checkbox-shape-circle.pn:before,
:root .input-checkbox input.disabled+.checkbox-shape-circle:before,
:root .input-checkbox input.disabled+.checkbox-shape:before,
:root .input-checkbox input:disabled+.checkbox-shape-circle.pn:before,
:root .input-checkbox input:disabled+.checkbox-shape-circle:before,
:root .input-checkbox input:disabled+.checkbox-shape:before {
    background-color: var(--bg-pri-disabled);
    border-color: var(--border-disabled)
}

.input-checkbox input.disabled+.checkbox-shape-circle:after,
.input-checkbox input.disabled+.checkbox-shape:after,
.input-checkbox input:disabled+.checkbox-shape-circle:after,
.input-checkbox input:disabled+.checkbox-shape:after {
    background-position: 0 0;
    background-repeat: no-repeat;
    background-image: var(--path-solid-colored-check-ico-ter);
    background-size: contain
}

:root .input-checkbox input.disabled+.checkbox-shape:after,
:root .input-checkbox input:disabled+.checkbox-shape:after {
    background-image: var(--path-checkbox-square-disabled)
}

:root .input-checkbox.circle input.disabled+.checkbox-shape-circle:after,
:root .input-checkbox.circle input:disabled+.checkbox-shape-circle:after {
    background-image: var(--path-checkbox-circle-disabled)
}

.input-checkbox input.disabled+.checkbox-shape-line:before,
.input-checkbox input:disabled+.checkbox-shape-line:before {
    background-color: transparent;
    border-color: transparent
}

:root .input-checkbox input.disabled+.checkbox-shape-line:after,
:root .input-checkbox input:disabled+.checkbox-shape-line:after {
    background-image: var(--path-checkbox-line-2depth-disabled)
}

:root .input-checkbox.like input:disabled+.checkbox-shape-like {
    background-image: var(--path-checkbox-star-disabled)
}

.input-checkbox input.disabled+.checkbox-shape-line.type2:after .input-checkbox input:disabled+.checkbox-shape-line.type2:after {
    background-image: var(--path-checkbox-line-disabled)
}

:root .input-checkbox.like input:disabled+.checkbox-shape-like.type2 {
    background-image: var(--path-checkbox-heart-disabled)
}

:root .input-checkbox.pin input.disabled+.checkbox-shape-pin,
:root .input-checkbox.pin input:disabled+.checkbox-shape-pin {
    background-image: var(--path-checkbox-pin-disabled)
}

.input-checkbox input.checked-disabled+.checkbox-shape-circle.pn:before,
.input-checkbox input.checked-disabled+.checkbox-shape-circle:before,
.input-checkbox input.checked-disabled+.checkbox-shape:before,
.input-checkbox input:checked:disabled+.checkbox-shape-circle.pn:before,
.input-checkbox input:checked:disabled+.checkbox-shape-circle:before,
.input-checkbox input:checked:disabled+.checkbox-shape:before {
    background-color: var(--color-g300, #e0e0e0);
    border-color: var(--color-g300, #e0e0e0)
}

.input-checkbox input.checked-disabled+.checkbox-shape-circle:after,
.input-checkbox input.checked-disabled+.checkbox-shape:after,
.input-checkbox input:checked:disabled+.checkbox-shape-circle:after,
.input-checkbox input:checked:disabled+.checkbox-shape:after {
    background-position: 0 0;
    background-repeat: no-repeat;
    background-image: var(--path-solid-colored-check-ico-ter-active);
    background-size: contain
}

.input-checkbox input.checked-disabled+.checkbox-shape-line:before,
.input-checkbox input:checked:disabled+.checkbox-shape-line:before {
    background-color: transparent;
    border-color: transparent
}

.input-checkbox input.checked-disabled+.checkbox-shape-line:after,
.input-checkbox input:checked:disabled+.checkbox-shape-line:after {
    background-position: 0 0;
    background-repeat: no-repeat;
    background-image: var(--path-solid-colored-check-ico-ter-active);
    background-size: contain
}

:root .input-checkbox input:disabled+.checkbox-shape-toggle:before {
    color: var(--txt-disabled, #c8d2e4);
    background-color: var(--bg-ter, #edf1f7)
}

:root .input-checkbox input:disabled+.checkbox-shape-toggle:after {
    background-color: var(--bg-pri-disabled, #edf1f7)
}

.input-checkbox input.readonly+.checkbox-shape-circle.pn:before,
.input-checkbox input.readonly+.checkbox-shape-circle.pn:before,
.input-checkbox input.readonly+.checkbox-shape-circle:before,
.input-checkbox input.readonly+.checkbox-shape:before,
.input-checkbox input[readonly]+.checkbox-shape-circle.pn:before,
.input-checkbox input[readonly]+.checkbox-shape-circle.pn:before,
.input-checkbox input[readonly]+.checkbox-shape-circle:before,
.input-checkbox input[readonly]+.checkbox-shape:before {
    background-color: var(--color-g200, #eee);
    border-color: var(--color-g300, #e0e0e0)
}

:root .input-checkbox input.readonly+.checkbox-shape-circle.pn:before,
:root .input-checkbox input.readonly+.checkbox-shape-circle.pn:before,
:root .input-checkbox input.readonly+.checkbox-shape-circle:before,
:root .input-checkbox input.readonly+.checkbox-shape:before,
:root .input-checkbox input[readonly]+.checkbox-shape-circle.pn:before,
:root .input-checkbox input[readonly]+.checkbox-shape-circle.pn:before,
:root .input-checkbox input[readonly]+.checkbox-shape-circle:before,
:root .input-checkbox input[readonly]+.checkbox-shape:before {
    background-color: var(--bg-pri-disabled);
    border-color: var(--bg-pri-disabled)
}

.input-checkbox input.readonly+.checkbox-shape-circle:after,
.input-checkbox input.readonly+.checkbox-shape:after,
.input-checkbox input[readonly]+.checkbox-shape-circle:after,
.input-checkbox input[readonly]+.checkbox-shape:after {
    background-position: 0 0;
    background-repeat: no-repeat;
    background-image: var(--path-solid-colored-check-ico-ter);
    background-size: contain
}

:root .input-checkbox.circle input.readonly+.checkbox-shape-circle:after,
:root .input-checkbox.circle input[readonly]+.checkbox-shape-circle:after {
    background-image: var(--path-checkbox-circle-readonly)
}

:root .input-checkbox input.readonly+.checkbox-shape:after,
:root .input-checkbox input[readonly]+.checkbox-shape:after {
    background-image: var(--path-checkbox-square-readonly)
}

.input-checkbox input.readonly+.checkbox-shape-line:before,
.input-checkbox input[readonly]+.checkbox-shape-line:before {
    background-color: transparent;
    border-color: transparent
}

.input-checkbox input.readonly+.checkbox-shape-line:after,
.input-checkbox input[readonly]+.checkbox-shape-line:after {
    background-position: 0 0;
    background-repeat: no-repeat;
    background-image: var(--path-solid-colored-check-ico-ter);
    background-size: contain
}

:root .input-checkbox input.readonly+.checkbox-shape-line:after,
:root .input-checkbox input[readonly]+.checkbox-shape-line:after {
    background-image: var(--path-checkbox-line-2depth-readonly)
}

:root .input-checkbox input[readonly]+.checkbox-shape-toggle:before {
    color: var(--txt-readonly, #67748e);
    background-color: var(--bg-ter, #edf1f7)
}

:root .input-checkbox input[readonly]+.checkbox-shape-toggle:after {
    background-color: var(--bg-pri-disabled, #edf1f7);
    border: 0.04rem solid var(--border-handle, rgba(0, 0, 0, 0.05))
}

:root .input-checkbox.like input[readonly]+.checkbox-shape-like {
    background-image: var(--path-checkbox-star-readonly)
}

:root .input-checkbox input.readonly+.checkbox-shape-like.type2,
:root .input-checkbox input[readonly]+.checkbox-shape-like.type2 {
    background-image: var(--path-checkbox-heart-readonly)
}

.agreement-group2 .input-checkbox input[readonly].checked+.checkbox-shape-circle:before,
.agreement-group2 .input-checkbox input[readonly].checked+.checkbox-shape:before {
    background-color: var(--color-pl, #b6f23d);
    border-color: var(--color-pl, #b6f23d)
}

:root .agreement-group2 .input-checkbox input[readonly].checked+.checkbox-shape-circle:before,
:root .agreement-group2 .input-checkbox input[readonly].checked+.checkbox-shape:before {
    background-color: var(--bg-pri-disabled);
    border-color: var(--bg-pri-disabled)
}

.agreement-group2 .input-checkbox input[readonly].checked+.checkbox-shape-circle.pn:before {
    background-color: var(--color-pn, #17008c);
    border-color: var(--color-pn, #17008c)
}

.agreement-group2 .input-checkbox input[readonly].checked+.checkbox-shape-circle:after,
.agreement-group2 .input-checkbox input[readonly].checked+.checkbox-shape:after {
    background-position: 0 0;
    background-repeat: no-repeat;
    background-image: var(--path-solid-colored-check-ico-pri-invert);
    background-size: contain
}

:root .agreement-group2 .input-checkbox input[readonly].checked+.checkbox-shape-circle:after,
:root .agreement-group2 .input-checkbox input[readonly].checked+.checkbox-shape:after {
    -webkit-filter: unset;
    filter: unset;
    background-image: var(--path-checkbox-circle-readonly)
}

.agreement-group2 .input-checkbox input[readonly].checked+.checkbox-shape-line:after {
    background-image: var(--path-solid-check);
    background-position: 0 0;
    background-repeat: no-repeat;
    background-size: contain
}

:root .agreement-group2 .input-checkbox input[readonly].checked+.checkbox-shape-line:after {
    background-image: var(--path-solid-check);
    background-position: 0 0;
    background-repeat: no-repeat;
    background-size: contain
}

:root .input-checkbox input.readonly+.checkbox-shape-line.type2:after,
:root .input-checkbox input[readonly]+.checkbox-shape-line.type2:after {
    background-image: var(--path-checkbox-line-readonly)
}

.input-checkbox input.readonly+.checkbox-shape-pin,
.input-checkbox input[readonly]+.checkbox-shape-pin {
    background-image: var(--path-checkbox-pin-readonly)
}

/*! component element checkbox 그룹 레이아웃 */

.input-checkbox-group {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    max-width: 100%
}

.input-checkbox-group.left .input-checkbox {
    margin-right: 0.8rem
}

.input-checkbox-group.right {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse
}

.input-checkbox-group.right .input-checkbox {
    margin-left: 0.8rem
}

.input-checkbox-group.top {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.input-checkbox-group.bottom {
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse
}

.form-util.right .input-checkbox-group.left {
    margin-left: auto
}

.input-txt-group .input-checkbox-group.left .input-checkbox {
    margin: 0 0 0 0.6rem
}

.input-txt-group .input-checkbox-group.right .input-checkbox {
    margin: 0 0.6rem 0 0
}

.input-txt-group .input-checkbox-group.btn-fix {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex
}

.form-group .form-util.left .input-checkbox-group.left .input-checkbox {
    margin: 0 0.6rem 0 0
}

.form-group .form-util.left .input-checkbox-group.left {
    padding: 0.8rem 0.8rem 0 0;
    color: var(--color-g700)
}

.form-group.order .form-row {
    font-size: 0
}

.form-group.order .input-radio-group input:checked+.radio-shape {
    border-color: var(--bg-pri);
    background-color: var(--bg-pri)
}

.form-group.order .input-radio-group input:checked+.radio-shape .order-number {
    display: block;
    font-size: 1.6rem;
    font-weight: 700;
    line-height: normal;
    font-style: normal;
    color: var(--txt-pri-invert)
}

.form-group.order .input-radio-group .radio-shape {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 2.4rem;
    height: 2.4rem;
    border-radius: 99rem;
    border: 2px solid var(--ico-ter)
}

.form-group.order .input-radio-group .radio-shape::after,
.form-group.order .input-radio-group .radio-shape::before {
    display: none
}

.form-group.order .input-radio-group .radio-shape .order-number {
    display: none
}

/*! component element checkbox 그룹 레이아웃 상태 2024-02-29 신규 추가 */

:root .input-checkbox-group.active .checkbox-txt-field,
:root .input-checkbox-group:has(input:checked) .checkbox-txt-field {
    color: var(--txt-sec-active)
}

:root .input-checkbox-group.disabled .checkbox-txt-field,
:root .input-checkbox-group:has(input:disabled) .checkbox-txt-field {
    color: var(--txt-disabled)
}

:root .input-checkbox-group.readonly .checkbox-txt-field,
:root .input-checkbox-group:has(input[readonly]) .checkbox-txt-field {
    color: var(--txt-readonly)
}

/*! component element checkbox 버튼타입 체크박스 - 대출가입 */

.input-checkbox-group.btn-line {
    margin-bottom: 0.8rem
}

.input-checkbox-group.btn-line .input-checkbox {
    width: auto;
    height: auto
}

.input-checkbox-group.btn-line .checkbox-txt-field {
    padding: 0.7rem 1.4rem;
    border: 1px solid var(--color-g300, #e0e0e0);
    border-radius: 99rem;
    line-height: 1.3
}

.input-checkbox-group.btn-line input:checked+.checkbox-txt-field {
    border-color: var(--color-pn, #17008c);
    background-color: var(--color-pn, #17008c);
    color: var(--color-w100, #fff);
    font-weight: 700
}

/*! component element radio 기본속성 */

.input-radio {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    position: relative;
    width: 2.4rem;
    height: 2.4rem
}

.input-radio input {
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    opacity: 0
}

/*! component element radio 텍스트 */

.radio-txt-field {
    display: block;
    position: relative;
    font-size: 1.4rem;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto
}

:root .radio-txt-field {
    color: var(--txt-sec)
}

.radio-txt-field.fs16 {
    font-size: 1.6rem;
    font-weight: 400
}

.radio-txt-field.type2 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: var(--txt-pri)
}

.radio-txt-field.type2 .tag {
    margin-left: 0.4rem
}

/*! component element radio 모양 - 기본 */

.radio-shape:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0.2rem solid var(--color-g300, #e0e0e0);
    text-align: center;
    border-radius: 50%;
    -webkit-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out
}

:root .radio-shape:before {
    border: 0.2rem solid var(--ico-ter)
}

.radio-shape:after {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    background-color: var(--color-w100, #fff);
    width: 1.2rem;
    height: 1.2rem;
    border-radius: 50%;
    -webkit-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out
}

/*! component element radio 상태 */

.input-radio input.checked+.radio-shape:before,
.input-radio input:checked+.radio-shape:before {
    background-color: var(--color-w100, #fff);
    border-color: var(--color-pl, #b6f23d)
}

.input-radio input.checked+.radio-shape:after,
.input-radio input:checked+.radio-shape:after {
    background-color: var(--color-pl, #b6f23d)
}

:root .input-radio input.checked+.radio-shape:before,
:root .input-radio input.checked+.radio-shape:before,
:root .input-radio input:checked+.radio-shape:before,
:root .input-radio input:checked+.radio-shape:before {
    background-color: var(--bg-base);
    border-color: var(--ico-pri-active)
}

:root .input-radio input.checked+.radio-shape:after,
:root .input-radio input:checked+.radio-shape:after {
    background-color: var(--ico-pri-active)
}

:root .input-radio:has(input:checked) .radio-txt-field {
    color: var(--txt-sec-active)
}

:root .input-radio input.checked+.checkbox-shape-circle:before,
:root .input-radio input.checked+.checkbox-shape:before,
:root .input-radio input:checked+.checkbox-shape-circle:before,
:root .input-radio input:checked+.checkbox-shape:before {
    background-color: var(--bg-pri-active, #0114a7);
    border-color: var(--bg-pri-active, #0114a7)
}

:root .input-radio input.checked+.checkbox-shape-circle:after,
:root .input-radio input:checked+.checkbox-shape-circle:after {
    background-image: var(--path-checkbox-circle-active)
}

.input-radio input.disabled+.radio-shape:before,
.input-radio input:disabled+.radio-shape:before {
    background-color: var(--color-g200, #eee);
    border-color: var(--color-g300, #e0e0e0)
}

.input-radio input.disabled+.radio-shape:after,
.input-radio input:disabled+.radio-shape:after {
    background-color: var(--color-g200, #eee)
}

:root .input-radio input.disabled+.radio-shape:before,
:root .input-radio input:disabled+.radio-shape:before {
    background-color: var(--bg-pri-disabled);
    border-color: var(--ico-disabled)
}

:root .input-radio input.disabled+.radio-shape:after,
:root .input-radio input:disabled+.radio-shape:after {
    background-color: var(--bg-pri-disabled)
}

.input-radio input.checked-disabled+.radio-shape:before,
.input-radio input:checked:disabled+.radio-shape:before {
    background-color: var(--color-g200, #eee);
    border-color: var(--ico-disabled)
}

.input-radio input.checked-disabled+.radio-shape:after,
.input-radio input:checked:disabled+.radio-shape:after {
    background-color: var(--color-g300, #e0e0e0)
}

.input-radio input.readonly+.radio-shape:before,
.input-radio input[readonly]+.radio-shape:before {
    background-color: var(--color-g200, #eee);
    border-color: var(--color-g300, #e0e0e0)
}

.input-radio input.readonly+.radio-shape:after,
.input-radio input[readonly]+.radio-shape:after {
    background-color: var(--color-g200, #eee)
}

:root .input-radio input.checked-readonly+.radio-shape:before,
:root .input-radio input[readonly]+.radio-shape:before {
    background-color: var(--bg-pri-disabled);
    border-color: var(--ico-disabled)
}

:root .input-radio input.checked-readonly+.radio-shape:after,
:root .input-radio input[readonly]+.radio-shape:after {
    background-color: var(--ico-readonly)
}

/*!

/* CHPFMTASK-730 카드 라디오 체크타입 추가 2024-03-12 */

.input-radio-card-group {
    width: 100%
}

.input-radio-card-group .input-radio-card {
    position: relative
}

.input-radio-card-group .input-radio-card+.input-radio-card {
    margin-top: 1.6rem
}

.input-radio-card-group .input-radio-card input {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    opacity: 0
}

.input-radio-card-group .input-radio-card input+label {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: relative
}

.input-radio-card-group .input-radio-card input+label .card-group {
    width: 100%
}

.input-radio-card-group .input-radio-card input+label::before {
    content: '';
    display: block;
    position: absolute;
    top: 2rem;
    right: 2rem;
    width: 2.4rem;
    height: 2.4rem;
    border-radius: 99rem;
    background-color: transparent;
    background-position: center center;
    background-repeat: no-repeat;
    background-image: var(--path-solid-colored-check-ico-ter);
    background-size: 1.4rem 1.4rem;
    z-index: 1;
    border: 0.2rem solid var(--color-g300, #e0e0e0);
    -webkit-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out
}

.input-radio-card-group .input-radio-card input:checked+label::before {
    background-color: var(--indigo-in1100, #0114a7);
    border-color: var(--indigo-in1100, #0114a7);
    background-position: center center;
    background-repeat: no-repeat;
    background-image: var(--path-solid-colored-check-ico-pri-invert);
    background-size: 1.4rem 1.4rem;
    z-index: 1
}

.input-radio-card-group .input-radio-card input:checked+label .card-group {
    background-color: var(--color-g100, #f8f8f8);
    border-color: var(--indigo-in1100, #0114a7)
}

.input-radio-card-group .input-radio-card .card-group [class^="card-row"]+.card-row {
    margin-top: 0.4rem
}

.input-radio-card-group .input-radio-card .card-group .card-valid-msg {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    margin-top: .4rem
}

.input-radio-card-group .input-radio-card .card-group .card-valid-msg.error .ico-warning {
    width: 1.5rem;
    margin-right: .4rem
}

.input-radio-card-group .input-radio-card .card-group .card-valid-msg.error .txt {
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 2rem;
    color: var(--txt-pri-error)
}

.input-radio-card-group .input-radio-card input[disabled="disabled"]+label::before {
    content: '';
    display: block;
    position: absolute;
    top: 2rem;
    right: 2rem;
    width: 2.4rem;
    height: 2.4rem;
    border-radius: 99rem;
    background-color: transparent;
    background-position: center center;
    background-repeat: no-repeat;
    background-image: var(--path-checkbox-circle-disabled);
    background-size: 1.4rem 1.4rem;
    z-index: 1;
    border: 0.2rem solid var(--color-g300, #e0e0e0);
    -webkit-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out;
    background-color: var(--bg-pri-disabled)
}

.input-radio-card-group .card-group.active {
    border-color: var(--border-pri-active) !important;
    background-color: var(--bg-qua-active) !important
}

.input-radio-card-group .input-checkbox.circle .checkbox-shape-circle:after,
.input-radio-card-group .input-checkbox.circle .checkbox-shape-circle:before {
    -webkit-transition: all ease-out .1s;
    -o-transition: all ease-out .1s;
    transition: all ease-out .1s
}

.input-radio-card-group.ty01 .card-group {
    padding: 1.6rem;
    border-color: var(--color-g300, #e0e0e0)
}

.input-radio-card-group.ty01 .card-group .card-header .card-img-figure [class^="ico-"] {
    margin-right: 1rem
}

.input-radio-card-group.ty01 .card-group .card-header .card-info {
    padding-right: 3.6rem
}

.input-radio-card-group.ty01 .card-group .card-header .card-info span {
    display: block
}

.input-radio-card-group.ty01 .card-group .card-header .card-account-sum {
    margin: 0;
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 500
}

.input-radio-card-group.ty01 .card-group .card-header .card-account-loan {
    margin-top: .2rem;
    color: var(--txt-qua)
}

.input-radio-card-group.ty01 .input-checkbox.circle {
    position: absolute;
    top: calc(50% - 1.2rem);
    right: 1.6rem
}

.input-radio-card-group.ty01 .card-group.active {
    border-color: var(--border-pri-active)
}

.input-radio-card-group.ty02 .card-group .card-header .card-info .card-account-tit {
    font-weight: bold
}

.input-radio-card-group.ty02 .card-group .card-header .card-info .card-account-num {
    margin-top: 0.4rem;
    display: inline-block
}

.input-radio-card-group.ty03 .card-group {
    padding: 0
}

.input-radio-card-group.ty03 .card-group+.card-group {
    margin-top: 2rem
}

.input-radio-card-group.ty03 .input-radio-card {
    padding: 2.4rem 2rem
}

.input-radio-card-group.ty03 .input-radio-card input+label {
    display: block
}

.input-radio-card-group.ty03 .input-radio-card input+label::before {
    top: 0;
    right: 0
}

.input-radio-card-group.ty03 .card-group:has(input:checked) {
    background-color: var(--color-g100, #f8f8f8);
    border-color: var(--indigo-in1100, #0114a7)
}

.input-radio-card-group.ty03 .card-group input:disabled+label::before {
    background-color: var(--bg-pri-disabled, #f8f8f8);
    background-image: var(--path-checkbox-circle-disabled);
    border-color: var(--border-disabled)
}

.input-radio-card-group.ty03 .card-group .card-header {
    padding-bottom: 1.4rem;
    border-bottom: 1px solid var(--color-g300)
}

.input-radio-card-group.ty03 .card-account-state {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 0.2rem 0;
    font-size: 1.4rem;
    font-weight: bold;
    color: var(--txt-pri-active)
}

.input-radio-card-group.ty03 .card-account-state .time {
    margin-left: 0.2rem;
    font-weight: normal
}

.input-radio-card-group.ty03 .card-account-state .txt.warning {
    margin-left: 0.6rem;
    line-height: 2rem
}

.input-radio-card-group.ty03 .card-account-state .tag {
    margin-left: 0.6rem
}

.input-radio-card-group.ty03 .card-account-wrap {
    margin-top: 1.6rem
}

.input-radio-card-group.ty03 .card-account-wrap .card-img-figure [class*="logo-bank"] {
    margin-right: 0.6rem
}

.input-radio-card-group.ty03 .card-account-wrap .card-header {
    margin-bottom: 1.2rem;
    padding-bottom: 0;
    border: none
}

.input-radio-card-group.ty03 .card-group .card-header .card-img-figure+.card-info .card-account-tit>span {
    font-weight: bold
}

.input-radio-card-group.ty03 .list-deal-group {
    margin-left: 4rem
}

.input-radio-card-group.ty03 .list-deal-group .row-head {
    margin-bottom: 0.2rem
}

.input-radio-card-group.ty03 .list-deal-group .txt-amount {
    margin-left: 0;
    font-size: 1.8rem
}

.input-radio-card-group.ty03 .list-deal-group .area-date .txt-date {
    color: var(--txt-qua)
}

.input-radio-card-group.ty03 .list-deal-group .area-date .txt-time {
    color: var(--txt-qua)
}

.input-radio-card-group.ty03 .list-deal-group .list-item {
    padding: 2rem 0
}

.input-radio-card-group.ty03 .list-deal-group .list-item:first-child {
    padding-top: 0
}

.input-radio-card-group.ty03 .list-deal-group .list-item:last-child {
    padding-bottom: 0;
    border: none
}

.input-radio-card-group.ty03 .card-group .btn-group {
    padding: 0.6rem 2rem 2.4rem 2rem
}

.input-radio-card-group.ty04 .card-group {
    padding: 1.6rem
}

.input-radio-card-group.ty04 .card-group+.card-group {
    margin-top: 2.4rem
}

.input-radio-card-group.ty04 .input-radio-card input+label {
    display: block
}

.input-radio-card-group.ty04 .input-radio-card input+label::before {
    top: 0;
    right: 0
}

.input-radio-card-group.ty04 .card-group:has(input:checked) {
    background-color: var(--color-g100, #f8f8f8);
    border-color: var(--indigo-in1100, #0114a7)
}

.input-radio-card-group.ty04 .card-group input:disabled+label::before {
    background-color: var(--bg-pri-disabled, #f8f8f8);
    background-image: var(--path-checkbox-circle-disabled);
    border-color: var(--border-disabled)
}

.input-radio-card-group.ty04 .card-group:has(input:checked) .txt-date {
    color: var(--txt-pri)
}

.input-radio-card-group.ty04 .card-group .card-row {
    margin-left: .4rem;
    margin-right: .4rem;
    width: calc(100% - .8rem)
}

.input-radio-card-group.ty04 .card-group .card-header+.card-row {
    margin-top: 1.5rem;
    padding-top: 1.6rem;
    line-height: 2.1rem;
    border-top: 1px solid var(--color-g300, #e0e0e0)
}

.input-radio-card-group.ty04 .card-group .card-header .card-info .card-account-sum {
    margin-top: 0;
    font-size: 1.6rem;
    line-height: 2.1rem
}

.input-radio-card-group.ty04 .card-group .card-header .card-account-loan {
    margin-top: .2rem
}

.input-radio-card-group.ty04 .card-group [class^="card-row"] .tit-info {
    color: var(--txt-ter)
}

.input-radio-card-group.ty04 .input-checkbox.circle.align-center {
    position: absolute;
    top: 0.95rem;
    right: 0;
    z-index: 3
}

.input-radio-card-group.ty04 .card-group.active .txt-date {
    color: var(--txt-pri)
}

.input-radio-card-group.ty05 .card-group {
    padding: 3rem 2rem 2rem
}

.input-radio-card-group.ty05 .card-group+.card-group {
    margin-top: 2.4rem
}

.input-radio-card-group.ty05 .input-radio-card input+label {
    display: block
}

.input-radio-card-group.ty05 .input-radio-card input+label::before {
    top: 0;
    right: 0
}

.input-radio-card-group.ty05 .card-group.active {
    background-color: var(--color-g100, #f8f8f8);
    border-color: var(--indigo-in1100, #0114a7)
}

.input-radio-card-group.ty05 .card-group input:disabled+label::before {
    background-color: var(--bg-pri-disabled, #f8f8f8);
    background-image: var(--path-checkbox-circle-disabled);
    border-color: var(--border-disabled)
}

.input-radio-card-group.ty05 .card-group:has(input:checked) .txt-date {
    color: var(--txt-pri)
}

.input-radio-card-group.ty05 .card-group .card-header+.card-row {
    margin-top: 1.5rem;
    padding-top: 1.6rem;
    line-height: 2.1rem;
    border-top: 1px solid var(--color-g300, #e0e0e0)
}

.input-radio-card-group.ty05 .card-group .card-header .card-info .card-tit {
    margin-top: 0;
    font-size: 2.1rem;
    line-height: 2.6rem;
    padding-right: 3rem
}

.input-radio-card-group.ty05 .card-group .card-header .card-info .card-desc {
    margin-top: .2rem;
    font-size: 1.5rem;
    line-height: 2rem
}

.input-radio-card-group.ty05 .card-group .card-header .card-account-loan {
    margin-top: .2rem
}

.input-radio-card-group.ty05 .card-group [class^="card-row"] .tit-info {
    color: var(--txt-ter)
}

.input-radio-card-group.ty05 .card-header+.card-box-sub {
    margin-top: 2.3rem
}

.input-radio-card-group.ty05 .card-box-sub+.card-row,
.input-radio-card-group.ty05 .card-row+.card-row {
    margin-top: 1.5rem
}

.input-radio-card-group.ty05 .card-box-sub {
    display: block;
    padding: 2rem;
    background: var(--bg-qua)
}

.input-radio-card-group.ty05 .card-group.active .card-box-sub {
    display: block;
    background: var(--color-w100, #fff);
    border-radius: 1.2rem;
    padding: 2rem
}

.input-radio-card-group.ty05 .card-box-sub .rate {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.input-radio-card-group.ty05 .card-box-sub .rate .tag {
    margin-left: .3rem
}

.input-radio-card-group.ty05 .input-checkbox.circle.align-center {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 3
}

.input-radio-card-group.ty05 .card-row .card-col-tit {
    font-size: 1.4rem;
    color: var(--txt-qua)
}

.input-radio-card-group.ty05 .card-row .card-col-content {
    font-size: 1.6rem;
    color: var(--txt-sec)
}

.input-radio-card-group.ty05 .card-row .card-col-group .sum.strong strong {
    font-size: 1.8rem;
    line-height: 2.4rem
}

.input-radio-card-group.sum-accent-pri .card-group.loan-type1 [class^="card-row"] .card-col-group .sum {
    color: var(--txt-accent-pri)
}

.list-deal-group [aria-readonly="true"],
.list-deal-group [aria-readonly="true"] .area-date .txt-time,
.list-deal-group [aria-readonly="true"] .txt-memo,
.list-deal-group [aria-readonly="true"] .txt-sum {
    color: var(--txt-readonly)
}

.list-deal-group [aria-disabled="true"],
.list-deal-group [aria-disabled="true"] .area-date .txt-time,
.list-deal-group [aria-disabled="true"] .txt-memo,
.list-deal-group [aria-disabled="true"] .txt-sum {
    color: var(--txt-disabled)
}

/*! component element radio 그룹 레이아웃 */

.input-radio-group {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    max-width: 100%
}

.input-radio-group.left .input-radio {
    margin-right: 0.8rem
}

.input-radio-group.right {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse
}

.input-radio-group.right .input-radio {
    margin-left: 0.8rem
}

.input-radio-group.top {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.input-radio-group.bottom {
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse
}

/*! component element radio 그룹 레이아웃 : 2024-02-27 추가 상태 - disabled(_page.scss에 있음), active(신규), readonly(신규) */

.input-radio-group.active .radio-txt-field {
    color: var(--txt-sec-active)
}

.input-radio-group.readonly .radio-txt-field {
    color: var(--txt-readonly)
}

/*! component element radio 버튼타입 */

.input-radio-btn-group {
    width: 100%
}

.input-radio-btn-group+.form-box-group {
    margin-top: 1.2rem
}

.input-radio-btn-group+.form-info-tit {
    margin-top: 3.2rem
}

.input-radio-btn-area {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.input-radio-btn {
    position: relative;
    -webkit-box-flex: 0;
    -ms-flex: 0 1 100%;
    flex: 0 1 100%
}

.input-radio-btn+.input-radio-btn {
    margin-left: 1rem
}

.input-radio-btn input {
    position: absolute;
    opacity: 0
}

:root .input-radio-btn input {
    position: absolute;
    opacity: 0;
    width: 100%;
    height: 100%
}

.input-radio-btn input+label {
    color: var(--color-g800, #414141);
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 400;
    position: relative;
    padding: 0 0.5rem;
    height: 4.8rem;
    border: 1px solid var(--color-g300, #e0e0e0);
    border-radius: 1rem;
    background-color: var(--color-w100, #fff);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.input-radio-btn input+label .txt {
    line-height: 1
}

.input-radio-btn input:checked+label {
    color: var(--color-lm500, #69b405);
    font-weight: 700;
    background-color: var(--color-w100, #fff);
    border-color: var(--color-lm500, #69b405);
    z-index: 2
}

:root .input-radio-btn input:checked+label {
    color: var(--txt-pri-success, #039115);
    background-color: var(--bg-base, #fff);
    border-color: var(--border-qua, #e0e6f1)
}

:root .input-radio-btn input.error+label {
    color: var(--color-re700);
    border-color: var(--color-re700);
    font-weight: 700
}

:root .input-radio-btn input:checked.error+label {
    background-color: var(--bg-base, #fff)
}

:root .type-customer .input-radio-btn input+label {
    font-size: 1.6rem;
    font-weight: 500;
    line-height: 2.1rem;
    color: var(--txt-pri, #020616);
    border: 1px solid var(--border-qua, #e0e6f1) !important;
    background-color: var(--bg-base, #fff) !important
}

:root .type-customer .input-radio-btn input+label::after {
    content: '';
    display: block;
    width: 2.4rem;
    height: 2.4rem;
    position: absolute;
    top: 2.4rem;
    right: 2rem;
    border-radius: 99rem;
    color: var(--txt-pri, #020616);
    background-image: var(--path-line-check);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 1.4rem 1.4rem;
    border: 2px solid var(--border-qua, #e0e6f1);
    z-index: 1
}

:root .type-customer .input-radio-btn input:checked+label {
    color: var(--txt-pri, #020616) !important;
    border: 1px solid var(--border-pri-active, #1728c4) !important;
    background-color: var(--bg-qua-active, #1728c4) !important
}

:root .type-customer .input-radio-btn input:checked+label::after {
    color: var(--txt-pri, #020616);
    background-color: var(--bg-pri-active, #0114a7);
    background-image: var(--path-solid-colored-check-ico-pri-invert);
    border: 1px solid var(--border-pri-active, #1728c4)
}

.input-radio-btn.error input:checked+label {
    border-color: var(--border-pri-error) !important;
    background-color: var(--bg-base) !important;
    color: var(--border-pri-error) !important
}

:root .input-radio-btn input:checked+label {
    color: var(--txt-pri-active);
    background-color: var(--bg-qua-active);
    border-color: var(--border-pri-active)
}

.input-radio-btn input:disabled+label {
    color: var(--color-g500, #b8b8b8);
    background-color: var(--color-g100, #f8f8f8);
    border-color: var(--color-g300, #e0e0e0)
}

:root .input-radio-btn input:disabled+label {
    color: var(--txt-disabled)
}

:root .input-radio-btn input[readonly]+label {
    color: var(--txt-readonly);
    background-color: var(--bg-sec-disabled);
    border: 1px solid var(--border-readonly)
}

:root .input-radio-btn input[readonly]+label .txt {
    font-weight: 700
}

.input-radio-btn-group.row .input-radio-btn-area {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.input-radio-btn-group.row .input-radio-btn-area .input-radio-btn {
    width: 100%
}

.input-radio-btn-group.row .input-radio-btn-area .input-radio-btn+.input-radio-btn {
    margin-left: 0;
    margin-top: 0.8rem
}

.input-radio-btn-group.row.type1 .input-radio-btn input+label {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    min-height: 7.9rem;
    padding-right: 2rem;
    padding-left: 2rem;
    word-break: keep-all
}

.input-radio-btn-group.row.type1 .input-radio-btn input+label span.line-clamp-2 {
    padding-right: 0.2rem
}

.input-radio-btn-group.row.type2 .input-radio-btn input+label {
    overflow: hidden;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    position: relative;
    z-index: 1;
    height: 7.2rem;
    padding: 1.4rem 9.8rem 1.4rem 5.5rem;
    border-color: var(--border-quin)
}

.input-radio-btn-group.row.type2 .input-radio-btn input+label [class^="txt-"] {
    color: var(--txt-sec)
}

.input-radio-btn-group.row.type2 .input-radio-btn-area.type1 .input-radio-btn input+label {
    padding-right: 2rem
}

.input-radio-btn-group.row.type2 .input-radio-btn input:checked+label {
    border-color: var(--border-accent-sec);
    background-color: transparent
}

.input-radio-btn-group.row.type2 .input-radio-btn input:checked+label::before {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    left: 2rem;
    width: 2.4rem;
    height: 2.4rem;
    margin-top: -1.2rem;
    border-radius: 99rem;
    background-image: var(--path-solid-colored-check-ico-pri-invert);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 1.6rem 1.6rem;
    background-color: var(--bg-accent-pri);
    z-index: 2
}

.input-radio-btn-group.row.type2 .input-radio-btn input:checked+label [class^="txt-"] {
    color: var(--txt-accent-sec)
}

.input-radio-btn-group.row.type2 .input-radio-btn input:disabled+label {
    background-color: transparent
}

.input-radio-btn-group.row.type2 .input-radio-btn .num {
    position: absolute;
    top: 50%;
    left: 2rem;
    z-index: 1;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 2.4rem;
    height: 2.4rem;
    margin-top: -1.2rem;
    border-radius: 100%;
    border: 1px solid var(--border-sec);
    font-size: 1.4rem;
    font-weight: 700;
    color: var(--txt-sec)
}

.input-radio-btn-group.row.type2 .input-radio-btn .txt-lv02 {
    display: -webkit-box;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2
}

.input-radio-btn-group.row.type2 .input-radio-btn .txt-info {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 0.4rem;
    position: absolute;
    right: 2rem;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    text-align: right
}

.input-radio-btn-group.row.type2 .input-radio-btn-area.incorrect .input-radio-btn input:checked+label {
    border-color: var(--border-pri-error)
}

.input-radio-btn-group.row.type2 .input-radio-btn-area.incorrect .input-radio-btn input:checked+label::before {
    background-image: none;
    background-color: var(--bg-pri-error)
}

.input-radio-btn-group.row.type2 .input-radio-btn-area.incorrect .input-radio-btn input:checked+label [class^="txt-"] {
    color: var(--txt-pri-error)
}

.input-radio-btn-group.row.type2 .input-radio-btn-area.incorrect .input-radio-btn input:checked+label::after {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    left: 2rem;
    width: 2.4rem;
    height: 2.4rem;
    margin-top: -1.2rem;
    border-radius: 99rem;
    background-image: var(--path-line-close);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 1.6rem 1.6rem;
    -webkit-filter: brightness(0) invert(1);
    filter: brightness(0) invert(1);
    z-index: 3
}

.input-radio-btn-group.row.type2 .input-radio-btn-area.no-answer .input-radio-btn input:checked+label {
    border-color: var(--border-quin);
    background-color: var(--bg-qua)
}

.input-radio-btn-group.row.type2 .input-radio-btn-area.no-answer .input-radio-btn input:checked+label [class^="txt-"] {
    color: var(--txt-qua)
}

.input-radio-btn-group.row.type2 .input-radio-btn-area.no-answer .input-radio-btn input:checked+label::before {
    background-image: none;
    background-color: var(--bg-sec)
}

.input-radio-btn-group.row.type2 .input-radio-btn-area.no-answer .input-radio-btn input:checked+label::after {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    left: 2rem;
    width: 2.4rem;
    height: 2.4rem;
    margin-top: -1.2rem;
    border-radius: 99rem;
    background-image: var(--path-line-close);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 1.6rem 1.6rem;
    -webkit-filter: var(--filter-color-grey-g500);
    filter: var(--filter-color-grey-g500);
    z-index: 3
}

.input-radio-btn-group.row.type2 .progress-value {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    z-index: -1;
    width: 0;
    background-color: var(--bg-ter)
}

.input-radio-btn-group.row.type2 .input-radio-btn-area.correct .input-radio-btn input:checked+label .progress-value {
    background-color: var(--color-in50)
}

.input-radio-btn-group.row.type2 .input-radio-btn-area.incorrect .input-radio-btn input:checked+label .progress-value {
    background-color: var(--color-re50)
}

.input-radio-btn-group.row.type3 .input-radio-btn input+label {
    overflow: hidden;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    position: relative;
    z-index: 1;
    height: auto;
    padding: 2.1rem 1.9rem 2.1rem 5.5rem;
    border-color: var(--border-qua)
}

.input-radio-btn-group.row.type3 .input-radio-btn input+label [class^="txt-"] {
    color: var(--txt-sec)
}

.input-radio-btn-group.row.type3 .input-radio-btn input:checked+label {
    border-color: var(--border-pri-active);
    background-color: var(--bg-ter)
}

.input-radio-btn-group.row.type3 .input-radio-btn input:checked+label::before {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    left: 2rem;
    width: 2.4rem;
    height: 2.4rem;
    margin-top: -1.2rem;
    border-radius: 99rem;
    background-image: var(--path-solid-colored-check-ico-pri-invert);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 1.6rem 1.6rem;
    background-color: var(--border-pri-active);
    z-index: 2
}

.input-radio-btn-group.row.type3 .input-radio-btn input:checked+label [class^="txt-"] {
    font-weight: 700;
    color: var(--txt-pri-active)
}

.input-radio-btn-group.row.type3 .input-radio-btn input:disabled+label {
    background-color: transparent
}

.input-radio-btn-group.row.type3 .input-radio-btn .num {
    position: absolute;
    top: 50%;
    left: 2rem;
    z-index: 1;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 2.4rem;
    height: 2.4rem;
    margin-top: -1.2rem;
    border-radius: 100%;
    border: 1px solid var(--border-sec);
    font-size: 1.4rem;
    font-weight: 700;
    color: var(--txt-sec)
}

.input-radio-btn-group.row.type3 .input-radio-btn .txt-lv02 {
    display: -webkit-box;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2
}

.input-radio-btn-group.row.type3 .input-radio-btn .txt-info {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 0.4rem;
    position: absolute;
    right: 2rem;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    text-align: right
}

/*! component element radio 토글타입 */

.toggle-radio-area {
    width: 100%
}

.toggle-radio-area.ty01 {
    padding-bottom: 15.4rem
}

.toggle-radio-area+.toggle-radio-area {
    margin-top: 1.2rem
}

.toggle-radio-area+.form-group {
    margin-top: 1.6rem
}

.toggle-list-col {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    background-color: var(--color-g200, #eee);
    border-radius: 1.2rem;
    height: 4.8rem
}

.toggle-list-col .move-item {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    opacity: 0;
    background-color: var(--color-w100, #fff);
    border: 0.4rem solid var(--color-g200, #eee);
    border-radius: 1.2rem
}

.toggle-list-col .toggle-item {
    position: relative;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.toggle-list-col .toggle-item .toggle-link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 100%;
    font-size: 1.5rem;
    font-weight: 400;
    color: var(--color-g800, #414141)
}

.toggle-list-col .toggle-item input:disabled+.toggle-link {
    color: var(--color-g500, #b8b8b8)
}

.toggle-list-col .toggle-item.active .toggle-link {
    font-weight: 700;
    color: var(--color-g900, #141414)
}

.toggle-list-col .toggle-item input {
    position: absolute;
    opacity: 0;
    width: 100%;
    height: 100%;
    z-index: 1
}

.toggle-list-col .toggle-item.disabled .toggle-link {
    color: var(--txt-disabled);
    pointer-events: none
}

/*! component element radio 대표이미지 col 타입 */

.bg-radio-btn-group .bg-radio-btn-area {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.bg-radio-btn-group .bg-radio-btn {
    position: relative;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 20%;
    flex: 1 1 20%;
    height: 20.27vw;
    margin-right: 1rem;
    margin-top: 1.2rem
}

.bg-radio-btn-group .bg-radio-btn:nth-child(-n+4) {
    margin-top: 0
}

.bg-radio-btn-group .bg-radio-btn:nth-child(4n) {
    margin-right: 0
}

.bg-radio-btn-group input {
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    opacity: 0
}

.bg-radio-btn-group input+label {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    border-radius: 1.6rem;
    background-color: var(--color-g100, #f8f8f8);
    border: 1px solid var(--color-g100, #f8f8f8)
}

.bg-radio-btn-group input:checked+label {
    border-color: var(--color-pn, #17008c)
}

.bg-radio-btn-group input:checked+label:before {
    content: '';
    display: block;
    position: absolute;
    top: .8rem;
    right: .8rem;
    width: 2.4rem;
    height: 2.4rem;
    border-radius: 99rem;
    background-color: var(--color-pn, #17008c);
    background-position: center center;
    background-repeat: no-repeat;
    background-image: var(--path-solid-colored-check-ico-pri-invert);
    background-size: 1.4rem 1.4rem;
    z-index: 1
}

/*! component element radio 대표이미지+ 텍스트 row 타입 */

.bg-radio-btn-row-group .bg-radio-btn {
    position: relative;
    margin-top: 0.8rem
}

.bg-radio-btn-row-group .bg-radio-btn input {
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    opacity: 0
}

.bg-radio-btn-row-group .bg-radio-btn input+label {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 7rem;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.bg-radio-btn-row-group .bg-radio-btn input+label i {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 5rem;
    height: 5rem
}

.bg-radio-btn-row-group .bg-radio-btn input+label .txt {
    margin-left: 1rem
}

.bg-radio-btn-row-group .bg-radio-btn input:checked+label {
    background-image: var(--path-solid-colored-check-ico-pri-success);
    background-size: 1.8rem 1.8rem;
    background-repeat: no-repeat;
    background-position: right center
}

:root .bg-radio-btn-row-group .bg-radio-btn input:checked+label {
    background-image: var(--path-checkbox-line-active)
}

.bg-radio-btn-row-group .bg-radio-btn input:checked+label .txt {
    color: var(--color-pn, #17008c)
}

.radio-btn-row-group.border-type .radio-btn-area {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.radio-btn-row-group.border-type .radio-btn {
    position: relative;
    padding: 0 0 1.2rem;
    width: calc(50% - 0.6rem)
}

.radio-btn-row-group.border-type .radio-btn input {
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    opacity: 0
}

.radio-btn-row-group.border-type .radio-btn input+label {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 1.6rem 0
}

.radio-btn-row-group.border-type .radio-btn input+label:before {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border: 1px solid var(--color-g200, #eee);
    border-radius: 1.6rem
}

.radio-btn-row-group.border-type .radio-btn input:checked+label:before {
    border: 2px solid var(--color-bu800, #0150ff)
}

.radio-btn-row-group.border-type .radio-btn input:checked+label .txt {
    font-weight: bold;
    color: var(--color-pb100, #000)
}

.radio-btn-row-group.border-type2 .radio-btn-area {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-column-gap: 1rem;
    -moz-column-gap: 1rem;
    column-gap: 1rem
}

.radio-btn-row-group.border-type2 .radio-btn {
    overflow: hidden;
    position: relative;
    height: 24rem;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.radio-btn-row-group.border-type2 .radio-btn.h-180 {
    height: 18rem
}

.radio-btn-row-group.border-type2 .radio-btn input:checked+label {
    border-color: transparent;
    background-color: rgba(66, 98, 255, 0.2)
}

.radio-btn-row-group.border-type2 .radio-btn input:checked+label .txt {
    font-weight: 700;
    color: var(--txt-accent-pri)
}

.radio-btn-row-group.border-type2 .radio-btn label {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 100%;
    border: 0.05rem solid var(--border-quin);
    border-radius: 2rem;
    background-color: var(--bg-qua)
}

.radio-btn-row-group.border-type2 .radio-btn label img {
    width: 6.4rem;
    height: 6.4rem
}

.radio-btn-row-group.border-type2 .radio-btn label .txt {
    overflow: hidden;
    white-space: nowrap;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    text-align: center;
    width: 16rem;
    padding: 0 1.8rem;
    margin-top: 1.2rem;
    font-size: 1.6rem;
    font-weight: 400;
    line-height: 2rem;
    color: var(--txt-qua)
}

.radio-btn-row-group.border-type2 .radio-btn input {
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    opacity: 0
}

/*! component element radio 이체하기 - 최종확인 */

.trn-msg-area {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    margin-left: -0.8rem;
    margin-top: -0.8rem
}

.trn-msg-item {
    position: relative;
    -webkit-box-flex: 0;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    text-align: center;
    width: calc(100% / 3 - 0.8rem);
    margin-left: 0.8rem;
    margin-top: 0.8rem
}

.trn-msg-item input {
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    opacity: 0
}

.trn-msg-item input+label {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    overflow: hidden;
    height: 10.5rem;
    border-radius: 1.6rem;
    background-color: var(--color-g100, #f8f8f8);
    border: 1px solid var(--color-g100, #f8f8f8)
}

.trn-msg-item input:checked+label {
    border-color: var(--color-pn, #17008c)
}

:root .trn-msg-item input:checked+label {
    border-color: var(--border-pri-active, #1728c4)
}

.trn-msg-item input:checked+label:before {
    content: '';
    display: block;
    position: absolute;
    top: .8rem;
    right: .8rem;
    width: 2.4rem;
    height: 2.4rem;
    border-radius: 50%;
    border-radius: 99rem;
    background-color: var(--color-pn, #17008c);
    background-position: center center;
    background-repeat: no-repeat;
    background-image: var(--path-solid-colored-check-ico-pri-invert);
    background-size: 1.4rem 1.4rem;
    z-index: 1
}

:root .trn-msg-item input:checked+label:before {
    background-color: var(--bg-pri-active, #0224a7);
    background-image: var(--path-checkbox-circle-active)
}

.trn-msg-item input:checked+label .txt-trn {
    font-weight: bold;
    color: var(--color-pn, #17008c)
}

.trn-msg-item .ico-msg-trn {
    display: block;
    width: 4.4rem;
    height: 4.4rem
}

.trn-msg-item .txt-trn {
    display: block;
    width: 100%;
    margin-top: 0.4rem;
    font-size: 1.4rem;
    color: var(--color-g600, #9b9b9b);
    word-break: keep-all
}

.trn-msg-item input+label.message-000 .ico-msg-trn {
    background: url("/resource/img/mmk/common/message0000_sel.png") center center no-repeat;
    background-size: 4.4rem 4.4rem
}

.trn-msg-item input+label.message-001 .ico-msg-trn {
    background: url("/resource/img/mmk/common/message0001_sel.png") center center no-repeat;
    background-size: 4.4rem 4.4rem
}

.trn-msg-item input+label.message-002 .ico-msg-trn {
    background: url("/resource/img/mmk/common/message0002_sel.png") center center no-repeat;
    background-size: 4.4rem 4.4rem
}

.trn-msg-item input+label.message-003 .ico-msg-trn {
    background: url("/resource/img/mmk/common/message0003_sel.png") center center no-repeat;
    background-size: 4.4rem 4.4rem
}

.trn-msg-item input+label.message-004 .ico-msg-trn {
    background: url("/resource/img/mmk/common/message0004_sel.png") center center no-repeat;
    background-size: 4.4rem 4.4rem
}

.trn-msg-item input+label.message-005 .ico-msg-trn {
    background: url("/resource/img/mmk/common/message0005_sel.png") center center no-repeat;
    background-size: 4.4rem 4.4rem
}

.trn-msg-item input+label.message-006 .ico-msg-trn {
    background: url("/resource/img/mmk/common/message0007_sel.png") center center no-repeat;
    background-size: 4.4rem 4.4rem
}

.trn-msg-item input+label.message-007 .ico-msg-trn {
    background: url("/resource/img/mmk/common/message0008_sel.png") center center no-repeat;
    background-size: 4.4rem 4.4rem
}

.trn-msg-item input+label.message-008 .ico-msg-trn {
    background: url("/resource/img/mmk/common/message0009_sel.png") center center no-repeat;
    background-size: 4.4rem 4.4rem
}

.trn-msg-item input+label.message-009 .ico-msg-trn {
    background: url("/resource/img/mmk/common/message0010_sel.png") center center no-repeat;
    background-size: 4.4rem 4.4rem
}

.trn-msg-item input+label.message-010 .ico-msg-trn {
    background: url("/resource/img/mmk/common/message0011_sel.png") center center no-repeat;
    background-size: 4.4rem 4.4rem
}

.trn-msg-item input+label.message-011 .ico-msg-trn {
    background: url("/resource/img/mmk/common/message0006_sel.png") center center no-repeat;
    background-size: 4.4rem 4.4rem;
    -webkit-filter: invert(1);
    filter: invert(1)
}

.check-false .trn-msg-item input:checked+label:before {
    display: none
}

/*! component element form 폼 - 박스타입 */

.form-box-group {
    position: relative;
    background-color: var(--color-w100, #fff);
    border: 1px solid var(--color-g300, #e0e0e0);
    border-radius: 1rem;
    padding: 3rem 2rem 0 2rem;
    min-height: 7.2rem;
    -webkit-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out
}

.form-box-group .form-box-label {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400;
    position: absolute;
    top: 50%;
    left: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-transform-origin: 2rem top;
    -ms-transform-origin: 2rem top;
    transform-origin: 2rem top;
    z-index: 2;
    max-width: 100%;
    padding: 0 2rem 0 2rem;
    -webkit-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out
}

.form-box-group .form-box-label.add-arrow {
    width: 100%
}

.form-box-group .form-box-align {
    display: none
}

.form-box-group.active {
    border: 1px solid var(--color-g900, #141414)
}

.form-box-group.active .form-box-label {
    -webkit-transform: translateY(-99%) scale(0.75);
    -ms-transform: translateY(-99%) scale(0.75);
    transform: translateY(-99%) scale(0.75)
}

.form-box-group.active .form-box-label.add-arrow .bl-selectbox {
    display: none
}

.form-box-group.active .form-box-align {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.form-box-group.done .form-box-label {
    -webkit-transform: translateY(-99%) scale(0.75);
    -ms-transform: translateY(-99%) scale(0.75);
    transform: translateY(-99%) scale(0.75)
}

.form-box-group.done .form-box-label.large {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400
}

.form-box-group.done .form-box-label.add-arrow .bl-selectbox {
    display: none
}

.form-box-group.done .form-box-align {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.form-box-group.no-border {
    border: 0;
    border-radius: 0
}

.form-box-group.error {
    border-color: var(--color-re700, #f02727)
}

.form-box-group.success {
    border-color: var(--color-lm500, #69b405)
}

:root .form-box-group.success {
    border-color: var(--border-pri-success)
}

.form-box-group.disabled {
    background: var(--color-g100, #f8f8f8);
    border: 1px solid var(--color-g300, #e0e0e0)
}

:root .form-box-group .selectbox-group {
    border: none
}

:root .form-box-group.disabled .selectbox-group.disabled {
    border-color: var(--bg-sec-disabled)
}

.form-box-group.disabled .form-box-label {
    color: var(--color-g500, #b8b8b8)
}

:root .form-box-group.disabled .form-box-label {
    color: var(--txt-disabled, #c8d2e4)
}

.form-box-label {
    font-size: 1.2rem;
    line-height: 1.6rem;
    font-weight: 400;
    color: var(--color-g700)
}

:root .form-box-label {
    color: var(--txt-qua, #67748e)
}

.form-box-group.readonly {
    background: var(--color-g100, #f8f8f8);
    border: 1px solid var(--color-g300, #e0e0e0)
}

.form-box-group.readonly .form-box-label {
    color: var(--color-g500, #b8b8b8)
}

.input-txt-group.readonly,
.selectbox-group.readonly {
    background: var(--color-g100, #f8f8f8)
}

.input-txt-group.readonly>input,
.selectbox-group.readonly .select-txt-wrap [class^="logo-bank"]+.txt-name {
    color: var(--color-g600, #9b9b9b)
}

.selectbox-group.readonly .select-txt-wrap [class^="logo-bank"] {
    opacity: 0.2
}

.selectbox-group.readonly .btn-selectbox {
    pointer-events: none
}

.dev-reset-layout .selectbox-group.readonly .btn-selectbox .bl-selectbox {
    -webkit-filter: var(--filter-ico-disabled);
    filter: var(--filter-ico-disabled)
}

:root .form-box-group.readonly {
    background: var(--bg-sec-disabled);
    border-color: var(--border-disabled)
}

:root .form-box-group.readonly .form-box-label {
    color: var(--txt-qua)
}

:root .input-txt-group.readonly,
:root .selectbox-group.readonly {
    background: var(--bg-sec-disabled)
}

:root .selectbox-group.readonly .select-txt-wrap [class^="logo-bank"]+.txt-name {
    color: var(--txt-readonly)
}

.form-box-label.large {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400
}

.form-box-align {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: relative;
    top: 0.5rem;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.form-box-item {
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    -webkit-box-flex: 0;
    -ms-flex: 0 1 100%;
    flex: 0 1 100%
}

.form-box-item+.form-box-item {
    margin-left: 1rem
}

.form-box-item.col-1 {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 0px;
    flex: 1 1 0
}

.form-box-item.col-1-auto {
    -webkit-box-flex: 0;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto
}

.form-box-item.col-1-5 {
    -webkit-box-flex: 1.5;
    -ms-flex: 1.5 1 0px;
    flex: 1.5 1 0
}

.form-box-item.col-2 {
    -webkit-box-flex: 2;
    -ms-flex: 2 1 0px;
    flex: 2 1 0
}

/*! component element form 폼 toggle 타입 */

.form-toggle-group {
    border: 1px solid var(--color-g300, #e0e0e0);
    border-radius: 1.2rem;
    padding: 2rem
}

.form-toggle-group.no-border {
    border: 0;
    border-radius: 0
}

.form-toggle-group.border-bottom {
    border-width: 0 0 1px;
    border-color: var(--border-qua);
    border-radius: 0
}

.form-toggle-group.small {
    padding-top: 0.8rem;
    padding-bottom: 0.8rem
}

.form-toggle-group .form-toggle-label {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g900, #141414);
    word-break: keep-all
}

.form-toggle-group .form-toggle-label.txt-lv01 {
    line-height: 2.1rem
}

.form-toggle-group .form-toggle-label+.input-checkbox.toggle {
    margin-left: 2.4rem
}

.form-toggle-group .form-toggle-label>span {
    display: block;
    margin-bottom: 0.4rem
}

.form-toggle-group .form-toggle-label>span.tit {
    color: var(--color-g900)
}

.form-toggle-group .form-toggle-align {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.btn-group+.form-toggle-group {
    margin-top: 4.8rem
}

.form-toggle-group .clickable-full {
    position: relativ;
    min-height: 4.8rem
}

.form-toggle-group .clickable-full .form-toggle-label {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    padding: 2rem
}

.form-toggle-group .clickable-full .form-toggle-label+.input-checkbox.toggle {
    margin-left: auto
}

.form-toggle-group .clickable-full~.card-row {
    position: relative
}

.form-toggle-group.bg-cg300 {
    border: 0;
    background: var(--color-cg300, #f1f6fb)
}

.form-toggle-group.bg-cg300 * {
    color: var(--color-pn, #17008c);
    font-size: 1.5rem;
    font-weight: 500
}

.form-toggle-group.bg-cg300 .form-toggle-label>span {
    font-size: 1.6rem;
    font-weight: 700;
    margin: 0.4rem 0 0
}

.form-toggle-group.bg-pri-invert {
    padding: 1.6rem;
    border: 0;
    background: var(--bg-pri-invert)
}

.form-toggle-group.bg-pri-invert .form-toggle-label {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 0.8rem;
    color: var(--txt-pri-invert)
}

.form-toggle-group.bg-pri-invert .form-toggle-label [class^="ico-"] {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 3.6rem;
    flex: 0 0 3.6rem
}

.form-toggle-group.bg-qua {
    padding: 1.6rem;
    border: 0;
    background: var(--bg-qua)
}

.form-toggle-group.bg-qua .form-toggle-label {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: var(--txt-sec)
}

.form-toggle-group.bg-qua .form-toggle-label [class^="ico-"] {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 3.6rem;
    flex: 0 0 3.6rem;
    margin-right: 0.8rem
}

.form-toggle-group.bg-qua .ico-circle-alarm {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 3.6rem;
    height: 3.6rem;
    border-radius: 99rem;
    background-color: var(--bg-accent-sec)
}

.form-toggle-group.bg-qua .ico-circle-alarm::before {
    content: "";
    display: block;
    width: 2rem;
    height: 2rem;
    background: var(--path-solid-alarm) no-repeat 0 0/100%;
    -webkit-filter: brightness(0) invert(1);
    filter: brightness(0) invert(1)
}

.form-toggle-group.bg-qua.type1 {
    padding: 2rem 1.6rem
}

.form-toggle-group.bg-qua.type1 .form-toggle-label {
    font-size: 1.4rem;
    font-weight: 500;
    line-height: 2rem;
    color: var(--txt-sec)
}

.form-toggle-group.bg-qua.type1 .ico-circle-alarm {
    background-color: var(--bg-base)
}

.form-toggle-group.bg-qua.type1 .ico-circle-alarm::before {
    -webkit-filter: var(--filter-g500);
    filter: var(--filter-g500)
}

.form-toggle-group.bg-ter {
    border: 1px solid var(--border-ter);
    background-color: var(--bg-ter)
}

.form-toggle-group.bg-ter .ico-circle-alarm {
    background-color: var(--bg-base)
}

.form-toggle-group.bg-ter .ico-circle-alarm::before {
    -webkit-filter: var(--filter-bu700);
    filter: var(--filter-bu700)
}

.form-toggle-group.bg-ter .form-toggle-label {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.form-toggle-group.bg-ter .form-toggle-label [class^="ico-"] {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 3.6rem;
    flex: 0 0 3.6rem;
    margin-right: 0.8rem
}

.form-toggle-group.bd-quin {
    border-color: var(--border-quin)
}

.list-linebox-group .form-toggle-group .form-toggle-label>span.txt {
    color: var(--txt-ter)
}

.section-component.fortune-pouch-bg2 .form-toggle-group {
    border-color: var(--color-cg300);
    background-color: var(--color-cg300)
}

.section-component.fortune-pouch-bg2 .form-toggle-group .txt {
    font-size: 1.6rem;
    font-weight: 500
}

/*! component element form 폼 check/radio 타입 */

.form-check-group .form-check-label {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400;
    color: var(--color-g900, #141414);
    margin-bottom: 1.2rem
}

.form-check-group .form-check-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 0.6rem 0
}

.form-check-group .form-check-item.flex .input-checkbox-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%
}

.form-check-group .form-check-item.flex .checkbox-txt-field {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.form-check-group .form-check-item.flex .checkbox-txt-field [class^="ico-"] {
    width: 4.8rem;
    height: 2rem;
    margin-right: 0.2rem
}

.form-check-group .form-check-item.flex .checkbox-txt-field .ico-pay01 {
    width: 7.3rem;
    background-image: url("/resource/img/mmk/common/pay_samsung.png");
    background-size: auto 2rem
}

.form-check-group .form-check-item.flex .checkbox-txt-field .ico-pay02 {
    width: 4.8rem;
    background-image: url("/resource/img/mmk/common/pay_kakao.png");
    background-size: 4.8rem
}

.form-check-group .form-check-item.flex .checkbox-txt-field .ico-pay03 {
    width: 4.8rem;
    background-image: url("/resource/img/mmk/common/pay_paybooc.png");
    background-size: 4.8rem
}

.form-check-group .form-check-item.flex .checkbox-txt-field .ico-pay05 {
    background-image: url("/resource/img/mmk/common/pay_toss.png");
    background-size: 4.8rem
}

.form-check-group .form-check-item.flex .checkbox-txt-field .ico-pay06 {
    background-image: url("/resource/img/mmk/common/pay_payco.png");
    background-size: 4.8rem
}

.form-check-group .form-check-item.flex .checkbox-txt-field .ico-pay07 {
    background-image: url("/resource/img/mmk/common/pay_naverpay.png");
    background-size: 4.8rem
}

.form-check-group .form-check-box {
    position: relative;
    border: 1px solid var(--color-g300, #e0e0e0);
    border-radius: 1rem;
    padding: 1rem 2rem
}

.form-check-group .form-check-box.col2 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.form-check-group .form-check-box.col2 .form-check-item {
    -ms-flex-preferred-size: 50%;
    flex-basis: 50%
}

.form-check-group .form-check-box.col3 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.form-check-group .form-check-box.col3 .form-check-item {
    -ms-flex-preferred-size: 33.33%;
    flex-basis: 33.33%
}

.form-check-group.type01 .form-check-box {
    padding: 0
}

.form-check-group.type01 .form-check-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    border-bottom: 1px solid var(--color-g300, #e0e0e0);
    padding: 2rem
}

.form-check-group.type01 .form-check-header .tit-box {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400;
    color: var(--color-g900, #141414)
}

.form-check-group.type01 .form-check-header .btn-setting {
    display: block;
    width: 2rem;
    width: 2rem;
    background: red
}

.form-check-group.type01 .form-check-content {
    position: relative;
    padding: 2rem;
    padding-right: 8rem
}

.form-check-group.type01 .form-check-content .btn-under-link {
    position: absolute;
    right: 2rem;
    bottom: 2rem;
    color: var(--color-g700);
    font-size: 1.2rem;
    line-height: 1.6rem;
    font-weight: 400
}

.form-check-group.type01 .form-check-item {
    padding: 0
}

.form-check-group.type01 .form-check-item+.form-check-item {
    margin-top: 1.2rem
}

.form-check-box.apt-survey {
    border: 0;
    margin: 2.4rem 0;
    padding: 0
}

.form-check-box.apt-survey .input-checkbox+.checkbox-txt-field {
    top: inherit;
    font-size: 1.6rem
}

.form-check-group .form-check-box.apt-survey .form-check-item {
    padding: 0.8rem 0
}

/*! component element form 폼 애니메이션 - 공통인증, 회원가입 사용중 */

.form-group-animation {
    position: relative
}

.form-group-animation .form-row {
    position: absolute;
    opacity: 0;
    margin-top: 0;
    top: 0
}

.form-group-animation .form-row.form-animation {
    opacity: 1;
    position: relative;
    -webkit-transition: opacity .4s ease-in-out, margin-top .3s ease-in-out;
    -o-transition: opacity .4s ease-in-out, margin-top .3s ease-in-out;
    transition: opacity .4s ease-in-out, margin-top .3s ease-in-out
}

.form-group-animation .form-row.form-animation+.form-animation.form-row {
    margin-top: 1.6rem
}

/*! component element form 폼 정렬 */

.form-group.border-style01 .form-row {
    width: auto;
    margin: 0;
    border: 1px solid var(--color-g300, #e0e0e0);
    border-bottom: 0
}

.form-group.border-style01 .form-row:first-child {
    overflow: hidden;
    border-top-left-radius: 1rem;
    border-top-right-radius: 1rem
}

.form-group.border-style01 .form-row:last-child {
    overflow: hidden;
    border-bottom: 1px solid var(--color-g300, #e0e0e0);
    border-bottom-left-radius: 1rem;
    border-bottom-right-radius: 1rem
}

.form-group.border-style01 .form-box-group,
.form-group.border-style01 .form-toggle-group,
.form-group.border-style01 .input-txt-group,
.form-group.border-style01 .selectbox-group {
    margin: 0
}

.form-group+.text-list-group2 {
    margin-top: 4.8rem
}

.form-group+.form-group {
    margin-top: 2.4rem
}

.form-group+.account-search-group {
    margin-top: -3.2rem
}

.form-group+.btn-group {
    margin-top: 2.4rem
}

.form-group.num-group+.btn-group {
    margin-top: 2.4rem
}

.form-group.num-group .form-col-group .col1 {
    -webkit-box-flex: 1;
    -ms-flex: 1 0 12rem;
    flex: 1 0 12rem
}

.form-row {
    position: relative;
    width: 100%;
    margin-top: 1.6rem
}

.form-row.space01 {
    margin-top: 1.6rem
}

.form-row.space02 {
    margin-top: 3.2rem
}

.form-row.space03 {
    margin-top: 4.8rem
}

.form-row:first-child {
    margin-top: 0
}

.form-row .img-figure-card img {
    width: 100%
}

.form-row .ico-ca_ra {
    position: absolute;
    top: -9.4rem;
    right: 0
}

.form-tit-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 2.4rem 0 1.2rem
}

.form-tit-group .form-link-add {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 2.2rem;
    height: 2.2rem
}

.form-tit-group .form-tit.tit-small {
    margin: 0
}

.form-tit-group+.form-row {
    margin-top: 1.2rem
}

.form-tit {
    display: block;
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: bold;
    color: var(--color-g900, #141414);
    margin-bottom: 1.6rem
}

.form-tit.tit-small {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400;
    color: var(--color-g900, #141414);
    margin: 2.4rem 0 1.2rem
}

.form-tit.tit-small.h32 {
    margin-top: 3.2rem
}

.form-tit.type2 {
    font-size: 1.8rem
}

.form-tit.tit-small.apt {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.form-tit.tit-small.apt .tag {
    margin-left: 0.5rem
}

.form-tit.tit-small.apt .status {
    margin-left: auto;
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400
}

.form-tit.tit-small.apt .status.red {
    color: var(--color-re700, #f02727)
}

.form-tit.tit-small.apt .status.blue {
    color: var(--color-bu800, #0150ff)
}

.form-info-tit {
    display: block;
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: bold;
    color: var(--color-g900, #141414);
    margin-bottom: 1.6rem
}

.form-info-tit .txt-guide {
    color: var(--color-g900, #141414);
    font-size: 1.6rem;
    line-height: 2rem;
    font-weight: 400;
    margin-top: 1.6rem;
    margin-bottom: 1.2rem
}

.form-info-tit .txt-desc {
    color: var(--txt-ter);
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400
}

.form-col-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end
}

.form-col-group.center {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.form-col-group.flex-start {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.form-col-group .bl {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: 2.4rem;
    text-align: center;
    -ms-flex-item-align: center;
    align-self: center
}

.form-col {
    position: relative;
    overflow: hidden;
    -webkit-box-flex: 0;
    -ms-flex: 0 1 100%;
    flex: 0 1 100%
}

.form-col+.form-col {
    margin-left: 1rem
}

.form-mix-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border: 1px solid var(--color-g300, #e0e0e0);
    border-radius: 1rem;
    height: 6.8rem
}

.form-mix-group.error {
    border-color: var(--color-re700, #f02727)
}

.form-mix {
    overflow: hidden
}

.form-mix:first-child {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.form-mix .input-txt-group {
    border: 0;
    background-color: transparent
}

:root .form-mix .input-txt-group {
    border: 0;
    background-color: transparent
}

.form-mix .input-checkbox-group {
    margin-right: 2rem
}

.form-col-group .form-col .input-txt-group,
.form-col-group .form-col .selectbox-group {
    margin: 0
}

/*! component element form 운전면허번호 입력 */

.form-col-group .form-col.w50 {
    -webkit-box-flex: 50%;
    -ms-flex: 50%;
    flex: 50%
}

.form-col-group .form-col.w40 {
    -webkit-box-flex: 40%;
    -ms-flex: 40%;
    flex: 40%
}

.input-txt-group.txt-pw-type.id-card .input-pw-mask {
    padding-left: 4rem;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.input-txt-group.txt-pw-type .input-pw-mask .dash {
    display: inline-block;
    width: 0.6rem;
    height: 0.1rem;
    background-color: var(--color-g400, #c7c7c7);
    margin: 0 0.8rem
}

:root .input-txt-group.txt-pw-type .input-pw-mask .dash {
    background-color: var(--ico-ter)
}

/*! component element form 간편인증 선택 */

.form-col-group.col3 {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    margin-left: -1rem
}

.form-col-group.col3 .form-col {
    width: calc(100%/3 - 1rem);
    -webkit-box-flex: inherit;
    -ms-flex: inherit;
    flex: inherit;
    margin-left: 1rem
}

.form-col-group.col3 .form-col:nth-child(n+4) {
    margin-top: 1rem
}

/*! component element form validation, message 폼 유틸, [KDS] 3.46507 반영 20231129 */

.form-util {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding-bottom: 0.1rem
}

.form-util .right,
.form-util.right * {
    text-align: right !important
}

.form-util .right.gray {
    color: var(--color-g700) !important
}

.form-util.right .input-checkbox-group {
    padding: 0.8rem 0.8rem 0 0;
    color: var(--color-g700)
}

.form-util .timer-msg {
    display: block;
    padding: 0.8rem 0.2rem 0;
    text-align: right;
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-re700, #f02727)
}

.count-txt,
.form-util .helper-msg,
.form-util>.success-msg {
    display: block;
    text-align: left;
    padding: 0.8rem 0.2rem 0;
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g600)
}

.form-util .helper-msg {
    color: var(--txt-qua)
}

.form-util .helper-msg.flex,
.form-util .valid-msg.flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.form-util .helper-msg.flex .right {
    margin-left: auto
}

.form-util .helper-msg.right .sum {
    margin-right: -0.2rem
}

.form-util .helper-msg.right .tooltip-group .ico-help {
    width: 2rem;
    height: 2rem;
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700);
    margin-top: -0.2rem
}

.form-util .helper-msg .right.gray {
    color: #7d7d7d !important
}

.form-util .helper-msg.center {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-top: 3.2rem;
    text-align: center
}

.form-util .helper-msg.center .btn-under-link,
.form-util .helper-msg.center .error {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400;
    color: var(--color-re700, #f02727)
}

.form-util .helper-msg.center .btn-under-link .txt,
.form-util .helper-msg.center .error .txt {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400
}

.form-util .helper-msg.center .btn-under-link {
    display: block;
    margin-top: 1.2rem
}

.form-util .helper-msg .txt {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400
}

.form-util .helper-msg .btn-under-link {
    margin-left: 1.2rem
}

.form-util .helper-link {
    display: block;
    -ms-flex-item-align: end;
    align-self: flex-end;
    text-align: right;
    padding: 0.8rem 0.2rem 0;
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g800, #414141);
    text-decoration: underline
}

.form-util .valid-msg {
    display: none;
    padding: 0.8rem 0.2rem 0;
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g700)
}

.form-util .helper-msg.flex,
.form-util .valid-msg,
.form-util>.success-msg {
    padding-left: 2.2rem;
    position: relative
}

.form-util .success-msg,
.form-util .valid-msg.success {
    color: var(--color-lm500, #69b405)
}

:root .form-util .success-msg,
:root .form-util .valid-msg.success {
    color: var(--txt-pri-success, #039115)
}

.form-util .helper-msg.red,
.form-util .valid-msg.error,
.form-util.error .helper-msg.flex>.left {
    color: var(--color-re700, #f02727)
}

.form-util .helper-msg.flex>*.left:before,
.form-util .valid-msg.error:before,
.form-util .valid-msg.success:before {
    content: '';
    display: block;
    position: absolute;
    top: 0.95rem;
    left: 0;
    width: 1.8rem;
    height: 1.8rem;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain
}

.ui-input.error+.form-util.error .valid-msg.error.flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: normal;
    -ms-flex-align: normal;
    align-items: normal
}

.form-util .valid-msg.error.flex .right {
    margin-left: auto
}

.form-util .helper-msg.flex>*.left {
    margin-left: -2.2rem
}

.form-util.error .helper-msg.flex>.left {
    margin-left: 0
}

.form-util .helper-msg.flex>*.left>.success-msg {
    margin-left: 2.2rem
}

.form-util .valid-msg.success:before {
    background-image: var(--path-solid-check-circle);
    -webkit-filter: var(--filter-lm500);
    filter: var(--filter-lm500)
}

:root .form-util .valid-msg.success:before {
    -webkit-filter: var(--filter-ce700);
    filter: var(--filter-ce700)
}

.form-util .valid-msg.error:before,
.form-util.error .helper-msg.flex>*.left:before {
    background-image: var(--path-solid-colored-exclamation-circle-ico-pri-error)
}

.ui-input+.form-util .valid-msg.error,
.ui-input+.form-util .valid-msg.success {
    display: none
}

.ui-input.error+.form-util.error .valid-msg.error,
.ui-input.success+.form-util.success .valid-msg.success {
    display: block
}

.form-util.error .valid-msg.error,
.form-util.success .valid-msg.success {
    display: block
}

.ui-input.error+.form-util.error .helper-msg,
.ui-input.success+.form-util.success .helper-msg {
    display: none
}

.ui-input.error+.form-util.error .helper-msg.error {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.ui-input+.form-util.error .helper-msg,
.ui-input+.form-util.success .helper-msg {
    display: block
}

.form-util.error .helper-msg.flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.form-util.error .helper-msg.flex.hide {
    display: none
}

.form-util.error .helper-msg.flex .right .sum {
    color: var(--txt-pri-error)
}

.form-util .success-msg:before {
    content: '';
    display: block;
    position: absolute;
    top: 0.8rem;
    left: 0;
    width: 1.8rem;
    height: 1.8rem;
    background: var(--path-solid-check-circle) center center no-repeat;
    background-size: contain;
    -webkit-filter: var(--filter-lm500);
    filter: var(--filter-lm500)
}

:root .form-util .success-msg:before {
    -webkit-filter: var(--filter-ce700);
    filter: var(--filter-ce700)
}

.form-util .btn-lv03.ty01 {
    padding: 0 1.6rem;
    background: var(--color-cg300, #f1f6fb)
}

.form-util .btn-lv03.ty01 .txt {
    color: var(--color-pn, #17008c)
}

.form-util.complex [data-complex-button] {
    display: none
}

.form-util.complex.reset [data-complex-text] {
    display: none
}

.form-util.complex.reset [data-complex-button] {
    display: block
}

.form-util.apply-success .apply-msg {
    display: block
}

.form-util .apply-msg {
    display: none;
    padding: 1.2rem 2rem;
    border-radius: 1.5rem;
    background: var(--bg-qua)
}

/*! component element form form password */

.form-password-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: relative
}

.form-password-tit {
    width: 100%;
    font-size: 2.4rem;
    line-height: 2.7rem;
    font-weight: bold;
    color: var(--color-g900, #141414)
}

.form-password-group.type01 .form-password-tit {
    font-size: 2.1rem;
    line-height: 2.7rem;
    text-align: center
}

.form-password-group.type01 .form-password-input {
    top: 11.2rem
}

.form-password-dec {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-bottom: 1rem
}

.popup-inner .form-password-tit {
    margin-top: 2.4rem
}

.popup-inner .component-form.h24 .form-password-tit {
    margin-top: 0
}

.form-password-input {
    position: absolute;
    top: 14.6rem;
    left: 0;
    width: 100%
}

.form-password-input {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.form-password-input .pw-item {
    cursor: pointer;
    width: 2rem;
    height: 2rem;
    margin: 0 0.7rem;
    border-radius: 50%;
    background-color: var(--color-cg500, #e6ebf5);
    -webkit-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out
}

:root .form-password-input .pw-item {
    width: 2.4rem;
    height: 2.4rem;
    margin: 0 0.6rem;
    background-color: unset
}

.form-password-input .pw-item.on {
    background-color: var(--color-pn, #17008c)
}

:root .form-password-input .pw-item.on {
    background-color: var(--bg-pri-active)
}

.form-password-txt,
.form-password-util {
    width: 100%;
    text-align: center;
    position: absolute;
    top: 20.9rem;
    left: 0
}

.form-password-txt {
    top: 26.6rem
}

.form-password-util .pw-link {
    font-size: 1.4rem;
    color: var(--color-g900, #141414);
    text-decoration: underline
}

.form-password-util .pw-msg {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g700)
}

.form-password-util.error .pw-msg {
    color: var(--color-re700, #f02727)
}

:root .form-password-input .pw-item {
    border: 1px solid var(--border-accent-pri)
}

:root .form-password-input .pw-item.on {
    background-color: var(--color-pn, #17008c)
}

.popup-dialog.ui-bottom .popup-content .form-password-group {
    padding: 2.4rem 0 1.2rem
}

.popup-dialog.ui-bottom .popup-content .form-password-group .form-password-input {
    position: initial;
    left: initial;
    top: initial
}

.popup-dialog.ui-bottom .popup-content .form-password-group .form-password-util {
    position: initial;
    left: initial;
    top: initial;
    margin-top: 2.4rem
}

/*! component element form 고객센터 사고신고 form 하단 링크 */

.form-group+.btn-group.center {
    margin-top: 2.4rem
}

.form-group+.btn-group.center .txt-lv02.darkgray2 {
    color: var(--color-g700)
}

.form-group+.btn-group.center .ico-arrow-link {
    position: relative;
    top: -0.1rem
}

/*! component element form FETASK-1132 AI LIVE 퀴즈쇼 회차 링크 PBKOFR7006000000S */

.form-group.prev-next {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: 2rem
}

.form-group.prev-next .ico-chevron_down.prev {
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg)
}

.form-group.prev-next .ico-chevron_down.next {
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg)
}

.form-group.prev-next [class^="btn-"]:disabled [class^="ico-"] {
    border-color: var(--border-disabled)
}

.form-group.prev-next [class^="btn-"]:disabled [class^="ico-"]::after {
    -webkit-filter: var(--filter-g400);
    filter: var(--filter-g400)
}

/*! component element progress d-day / barc type */

.progress-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%;
    padding-bottom: 1.6rem;
    position: relative
}

.progress-group .progress-bar {
    overflow: hidden;
    position: relative;
    width: 100%;
    margin-top: 3.2rem;
    height: 0.4rem;
    border-radius: 99rem;
    background-color: rgba(255, 255, 255, 0.12)
}

:root .progress-group .progress-bar {
    background-color: var(--bg-ter)
}

.progress-group .progress-bar .progress-value {
    position: absolute;
    top: 0;
    left: 0;
    width: 0 !important;
    height: 100%;
    border-radius: 0.2rem;
    background-color: var(--color-pl, #b6f23d)
}

:root .progress-group .progress-bar .progress-value {
    background-color: var(--bg-ter-active)
}

.progress-group .progress-content {
    position: absolute;
    top: 0;
    left: 0 !important;
    visibility: hidden
}

.progress-group.on .progress-bar .progress-value {
    -webkit-transition: width 1s;
    -o-transition: width 1s;
    transition: width 1s
}

.progress-group.on .progress-content {
    -webkit-transition: left 1s;
    -o-transition: left 1s;
    transition: left 1s
}

.progress-group .progress-content .progress-day {
    position: relative;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    height: 2.4rem;
    padding: 0 0.8rem;
    border-radius: 99rem;
    background-color: var(--color-pl, #b6f23d);
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

:root .progress-group .progress-content .progress-day {
    background-color: var(--bg-ter-active)
}

.progress-group .progress-content .progress-day .num,
.progress-group .progress-content .progress-day .txt {
    color: var(--color-pn, #17008c);
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 700;
    white-space: nowrap;
    margin: 0 auto
}

.progress-group .progress-content .progress-day::after {
    content: "";
    display: inline-block;
    clear: both;
    position: absolute;
    left: 1.2rem;
    bottom: -0.6rem;
    border-top: 0.8rem solid var(--color-pl, #b6f23d);
    border-left: 0.4rem solid transparent;
    border-right: 0.4rem solid transparent;
    margin-left: -0.4rem
}

:root .progress-group .progress-content .progress-day .num,
:root .progress-group .progress-content .progress-day .txt {
    color: var(--txt-pri-invert)
}

.progress-group .progress-bar-txt {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-top: 1.2rem
}

.progress-group .progress-bar-txt .item-txt {
    font-size: 1.4rem;
    color: var(--color-g700)
}

.progress-group .progress-bar-txt .item-txt .clock-txt {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-weight: 700;
    color: var(--color-bu800, #0150ff)
}

:root .progress-group .progress-bar-txt .item-txt .clock-txt {
    color: var(--color-in700, #4262ff)
}

.progress-group .progress-bar-txt .item-txt .circle-time {
    width: 1.8rem;
    height: 1.8rem;
    margin-right: 0.4rem
}

.progress-group .progress-bar-txt.right {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.progress-group.pos_left .progress-content {
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    transform: translate(0, 0);
    left: 0 !important;
    margin-left: -0.5rem
}

.progress-group.pos_right .progress-content {
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    transform: translate(0, 0)
}

.progress-group.pos_left .progress-content[style="left:0%"] {
    margin-right: -1.2rem
}

.progress-group.pos_right .progress-content[style="left:100%"] {
    margin-right: -1.2rem
}

.progress-group.pos_center .progress-content {
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0)
}

.progress-group.pos_center .progress-content .progress-day::after {
    left: 50%
}

.progress-group.pos_left .progress-content .progress-day::after {
    left: 1.2rem
}

.progress-group.pos_right .progress-content .progress-day::after {
    left: auto;
    right: 0.8rem
}

.bg-white .progress-group .progress-bar {
    background-color: var(--color-cg500, #e6ebf5)
}

.bg-white .progress-group .progress-bar .progress-value {
    background-color: var(--color-pn, #17008c)
}

.bg-white .progress-group .progress-content .progress-day {
    background-color: var(--color-pn, #17008c)
}

.bg-white .progress-group .progress-content .progress-day .num,
.bg-white .progress-group .progress-content .progress-day .txt {
    color: var(--color-w100, #fff)
}

.bg-white .progress-group .progress-content .progress-day::after {
    border-top: 0.8rem solid var(--color-pn, #17008c)
}

.progress-group.blue .progress-bar {
    background-color: var(--color-g200, #eee)
}

.progress-group.blue .progress-bar .progress-value {
    background-color: var(--color-bu800, #0150ff)
}

.progress-group.blue .progress-content .progress-day {
    background-color: var(--color-bu800, #0150ff)
}

.progress-group.blue .progress-content .progress-day .num,
.progress-group.blue .progress-content .progress-day .txt {
    color: var(--color-w100, #fff)
}

.progress-group.blue .progress-content .progress-day::after {
    border-top: 0.8rem solid var(--color-bu800, #0150ff)
}

.progress-group.bg-pri .progress-bar .progress-value {
    background-color: var(--bg-pri)
}

.progress-group.bg-pri .progress-bar {
    background-color: var(--color-g300)
}

.progress-group.size8 .progress-bar {
    height: 0.8rem;
    border-radius: 0.2rem
}

.progress-group.challenge {
    margin: 0 0.4rem;
    padding-bottom: 0;
    width: auto
}

.progress-group.challenge .progress-bar {
    height: 3.2rem;
    margin-top: 5.2rem;
    background-color: var(--color-g100, #f8f8f8);
    border-radius: 0.6rem;
    overflow: inherit
}

.progress-group.challenge .progress-bar .progress-value {
    background: -webkit-gradient(linear, left top, right top, from(#349cff), color-stop(83.39%, #9766ff));
    background: -o-linear-gradient(left, #349cff 0, #9766ff 83.39%);
    background: linear-gradient(90deg, #349cff 0, #9766ff 83.39%);
    border-radius: 0.6rem 0 0 0.6rem;
    -webkit-transition: width 1s;
    -o-transition: width 1s;
    transition: width 1s
}

.progress-group.challenge .progress-bar .progress-value:after {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    right: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 0.2rem;
    height: 4rem;
    border-right: 0.2rem dashed var(--color-g900, #141414)
}

.progress-group.challenge .progress-content .progress-day {
    background-color: var(--color-bu50, #e0f2ff);
    height: 3rem;
    border-radius: 1.4rem;
    padding: 0 1.2rem
}

.progress-group.challenge .progress-content .progress-day:after {
    border: 0;
    width: 1rem;
    height: 1rem;
    border-radius: 0.2rem;
    background: var(--color-bu50, #e0f2ff);
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    bottom: -0.3rem
}

:root .progress-group.challenge .progress-content .progress-day {
    background: var(--bg-ter-active, #4262ff)
}

:root .progress-group.challenge .progress-content .progress-day:after {
    background: var(--bg-ter-active, #4262ff)
}

.progress-group.challenge.pos_right .progress-content {
    margin-left: -81px !important
}

.progress-group.challenge .progress-content .progress-day .num,
.progress-group.challenge .progress-content .progress-day .txt {
    color: var(--color-bu600, #0082ff);
    font-size: 1.5rem;
    line-height: 2rem
}

:root .progress-group.challenge .progress-content .progress-day .num,
:root .progress-group.challenge .progress-content .progress-day .txt {
    color: var(--txt-pri-invert, #fff)
}

.progress-group.challenge.pos_right .progress-content .progress-day {
    background-color: var(--color-vo700, #9857fa)
}

.progress-group.challenge.pos_right .progress-content .progress-day:after {
    background: var(--color-vo700, #9857fa);
    right: 1.1rem
}

:root .progress-group.challenge.pos_right .progress-content .progress-day {
    background-color: var(--color-violet-vo700, #9857fa)
}

:root .progress-group.challenge.pos_right .progress-content .progress-day:after {
    background: var(--color-violet-vo700, #9857fa)
}

.progress-group.challenge.pos_right .progress-content .progress-day .num,
.progress-group.challenge.pos_right .progress-content .progress-day .txt {
    color: var(--color-w100, #fff)
}

.progress-group.challenge .progress-text {
    width: 100%;
    padding-top: 1.2rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.progress-group.challenge .progress-text>span {
    font-size: 1.4rem;
    color: var(--color-g600, #9b9b9b);
    font-weight: 500;
    line-height: 2rem;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    text-align: center
}

.progress-group.challenge .progress-text>span:first-child {
    text-align: left
}

.progress-group.challenge .progress-text>span:last-child {
    text-align: right
}

.progress-group.stock .progress-bar {
    height: 0.8rem;
    background-color: var(--color-g300, #e0e0e0);
    margin-top: 3.8rem
}

.progress-group.stock .progress-bar.no-data {
    background-color: var(--color-g200, #eee)
}

.progress-group.stock .progress-text {
    width: 100%;
    padding-top: 1.2rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.progress-group.stock .progress-text .txt-dt {
    font-size: 1.2rem;
    line-height: 1.6rem;
    color: var(--color-g600, #9b9b9b)
}

.progress-group.stock .progress-text .txt-dd {
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--color-g700, #7d7d7d);
    font-weight: 500
}

.progress-group.stock .progress-bar .progress-value {
    background-color: transparent !important
}

.progress-group.stock .progress-content .progress-day {
    background-color: var(--indigo-in1100, #0114a7) !important;
    padding: 0.4rem 1.2rem;
    height: auto
}

.progress-group.stock .progress-content .progress-day:before {
    content: '';
    display: block;
    width: 1.6rem;
    height: 1.6rem;
    border-radius: 99rem;
    background-color: var(--color-w100, #fff);
    border: 2px solid var(--indigo-in1100, #0114a7);
    -webkit-box-shadow: 0 0.2rem 0.6rem rgba(0, 0, 0, 0.12);
    box-shadow: 0 0.2rem 0.6rem rgba(0, 0, 0, 0.12);
    position: absolute;
    bottom: -2.6rem;
    left: 0.9rem
}

.progress-group.stock.pos_center .progress-content .progress-day:before {
    left: 52%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%)
}

.progress-group.stock.pos_right .progress-content .progress-day:before {
    left: inherit;
    right: 0.8rem
}

.progress-group.stock .progress-content .progress-day:after {
    left: 1.5rem;
    border: 0;
    width: 1.2rem;
    height: 1.2rem;
    background-color: var(--indigo-in1100, #0114a7);
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
    bottom: -0.4rem;
    z-index: -1
}

.progress-group.stock.pos_center .progress-content .progress-day::after {
    left: 50%
}

.progress-group.stock.pos_right .progress-content .progress-day::after {
    left: auto;
    right: 1rem
}

.progress-group.stock .progress-content .progress-day .txt {
    color: var(--color-w100, #fff);
    font-size: 1.2rem;
    line-height: 1.6rem
}

.progress-group.stock .progress-content .progress-day .txt .num {
    color: var(--color-w100, #fff);
    font-size: 1.2rem;
    line-height: 1.6rem;
    margin: 0 0 0 0.2rem
}

.progress-group.stock .progress-content .progress-day .txt .num.usd {
    margin: 0
}

.progress-group.type2 .progress-bar {
    background-color: rgba(255, 255, 255, 0.12)
}

.progress-group.type2 .progress-value {
    background-color: var(--color-w100, #fff)
}

.progress-group.type2 .progress-day {
    background-color: var(--color-w100, #fff)
}

.progress-group.type2 .progress-day:after {
    border-top: 0.8rem solid var(--color-w100, #fff)
}

.progress-group.type2 .progress-day .text {
    color: var(--color-pn, #17008c)
}

:root .progress-group.type2 .progress-bar {
    background-color: var(--bg-pri-invert)
}

:root .progress-group.type2 .progress-value {
    background-color: var(--ico-pri-invert)
}

:root .progress-group.type2 .progress-day {
    background-color: var(--ico-pri-invert)
}

:root .progress-group.type2 .progress-day:after {
    border-top: 0.8rem solid var(--ico-pri-invert)
}

:root .progress-group.type2 .progress-content .progress-day .txt {
    color: var(--txt-pri-active)
}

:root .progress-group.type2 .progress-content .progress-day .txt .num {
    color: var(--txt-pri-active)
}

:root .progress-group.stock .progress-bar {
    background-color: var(--bg-sec)
}

:root .progress-group.stock .progress-bar.no-data {
    background-color: var(--bg-pri-disabled)
}

:root .progress-group.stock .progress-text .txt-dt {
    color: var(--txt-qua)
}

:root .progress-group.stock .progress-text .txt-dd {
    color: var(--txt-ter)
}

.progress-circle-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.progress-circle-group.right {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.progress-circle-group .progress-chart {
    position: relative;
    width: 3.8rem;
    height: 3.8rem;
    border-radius: 50%;
    background: transparent
}

.progress-circle-group .progress-chart:after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 3.2rem;
    height: 3.2rem;
    border-radius: 50%;
    background: #dbe5f9
}

.progress-circle-group .progress-bar {
    width: inherit;
    height: inherit;
    border-radius: 50%;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.progress-circle-group .progress-chart .item-txt {
    color: var(--color-bu800, #0150ff);
    z-index: 1
}

.progress-circle-group .progress-chart .item-txt em {
    font-size: 1.4rem;
    font-weight: bold
}

.progress-circle-group .progress-chart .item-txt sub {
    font-size: 0.9rem;
    bottom: -0.1rem
}

.progress-circle-group .progress-chart[bar-color="blue"],
.progress-circle-group .progress-chart[bar-color="blue"]:after {
    background: #dbe5f9
}

.progress-circle-group .progress-chart[bar-color="blue"] .progress-bar {
    background: conic-gradient(var(--color-bu800, #0150ff) 270deg, transparent 270deg)
}

.progress-circle-group .progress-chart[bar-color="gray"] .item-txt {
    color: var(--color-bu800, #0150ff)
}

.progress-circle-group .progress-chart[bar-color="gray"],
.progress-circle-group .progress-chart[bar-color="gray"]:after {
    background: var(--color-g300, #e0e0e0)
}

.progress-circle-group .progress-chart[bar-color="gray"] .progress-bar {
    background: conic-gradient(var(--color-g700) 270deg, transparent 270deg)
}

.progress-circle-group .progress-chart[bar-color="gray"] .item-txt {
    color: var(--color-g700)
}

.progress-circle-group.kcb .progress-chart {
    width: 12rem;
    height: 12rem
}

.progress-circle-group.kcb .progress-chart:after {
    display: none
}

.progress-circle-group.kcb .progress-chart .item-txt.hide {
    width: 0;
    height: 0;
    display: block;
    overflow: hidden
}

.progress-circle-group.kcb .progress-chart .item-txt:not(.hide) {
    position: relative;
    z-index: 2
}

.progress-circle-group.kcb .progress-chart .item-txt {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.progress-circle-group.kcb .progress-chart .item-txt .tit {
    font-size: 2.6rem;
    line-height: 3.4rem;
    font-weight: 700;
    color: var(--txt-pri)
}

.progress-circle-group.kcb .progress-chart .item-txt .txt {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 700;
    color: var(--color-pb100)
}

.progress-circle-group.kcb .progress-chart .progress-bar {
    position: relative
}

.progress-circle-group.kcb .progress-chart .progress-bar:before {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 10rem;
    height: 10rem;
    background-color: var(--color-w100);
    border-radius: 99rem;
    z-index: 1
}

.progress-group.box {
    padding: 1.6rem 1.7rem;
    border-radius: 1.6rem;
    background-color: var(--bg-qua)
}

.progress-group.box .progress-bar {
    height: 0.8rem;
    margin-top: 1.2rem;
    border-radius: 0.2rem;
    background-color: var(--color-g300)
}

.progress-group.box .progress-bar .progress-value {
    background: -webkit-gradient(linear, left top, right top, from(#438eff), to(#8d70f7));
    background: -o-linear-gradient(left, #438eff 0, #8d70f7 100%);
    background: linear-gradient(90deg, #438eff 0, #8d70f7 100%)
}

/*! component element progress step */

.progress-step-group {
    width: 64%;
    margin: 0 auto;
    padding-bottom: 1.8rem
}

.progress-step-group .progress-row {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.progress-step-group .progress-row::after {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    right: 0;
    width: 100%;
    margin-top: -0.1rem;
    height: 0.2rem;
    background-color: var(--color-g300, #e0e0e0)
}

.progress-step-group .progress-circle {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 3.2rem;
    height: 3.2rem;
    border: 0.2rem solid var(--color-g300, #e0e0e0);
    border-radius: 99rem;
    background: var(--color-w100, #fff)
}

:root .progress-step-group .progress-circle {
    border: 0.2rem solid var(--border-qua);
    background: var(--bg-base)
}

.progress-step-group .progress-circle .txt {
    color: var(--color-g600, #9b9b9b);
    font-size: 1.6rem;
    font-weight: 700
}

:root .progress-step-group .progress-circle .txt {
    color: var(--txt-qua)
}

.progress-step-group .progress-circle .ico-complete01 {
    display: none;
    width: 2.13rem;
    height: 2.13rem
}

.progress-step-group .progress-tit {
    position: absolute;
    left: 50%;
    top: 3.6rem;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    white-space: nowrap;
    text-align: center;
    font-size: 1.1rem;
    line-height: 1.5rem;
    font-weight: 400;
    color: var(--color-g600, #9b9b9b)
}

:root .progress-step-group .progress-tit {
    color: var(--txt-qua)
}

.progress-step-group .progress-item {
    position: relative;
    z-index: 1
}

.progress-step-group .progress-item.current .progress-circle {
    border-color: var(--color-pl, #b6f23d);
    background-color: var(--color-pl, #b6f23d)
}

.progress-step-group .progress-item.current .txt {
    color: var(--color-pn, #17008c)
}

.progress-step-group .progress-item.current .progress-tit {
    color: var(--color-pn, #17008c)
}

:root .progress-step-group .progress-item.current .progress-circle {
    border-color: var(--bg-sec-active);
    background-color: var(--bg-sec-active)
}

:root .progress-step-group .progress-item.current .txt {
    color: var(--txt-pri-invert)
}

:root .progress-step-group .progress-item.current .progress-tit {
    color: var(--txt-sec-active)
}

.progress-step-group .progress-item.check .progress-circle {
    background-color: var(--color-g300, #e0e0e0)
}

.progress-step-group .progress-item.check .txt {
    display: none
}

.progress-step-group .progress-item.check .ico-complete01 {
    display: block;
    -webkit-filter: var(--filter-g500);
    filter: var(--filter-g500)
}

/*! component element progress step2 PBKOFR000600A100S_P06 */

.progress-step-group.type2 {
    width: 100%;
    padding: 0
}

.progress-step-group.type2 .progress-row::after {
    display: none
}

.progress-step-group.type2 .progress-item {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.progress-step-group.type2 .progress-item+.progress-item {
    margin-left: 2.4rem
}

.progress-step-group.type2 .progress-tit {
    position: relative;
    top: inherit;
    width: 100%;
    margin-top: 1rem;
    font-size: 1.6rem;
    font-weight: 700;
    color: var(--color-pb100, #000)
}

.progress-step-group.type2 .progress-square {
    padding: 2.1rem 1.2rem;
    background-color: var(--color-cg500, #e6ebf5);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    border-radius: 1.2rem
}

.progress-step-group.type2 .progress-square [class*="ico-"] {
    width: 3rem;
    height: 3rem;
    -webkit-filter: var(--filter-cg600);
    filter: var(--filter-cg600)
}

:root .progress-step-group.type2 .progress-square [class*="ico-"] {
    width: 3rem;
    height: 3rem;
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

.progress-step-group.type2 .progress-item.current .progress-square {
    background-color: var(--color-bu600, #0082ff)
}

.progress-step-group.type2 .progress-item.current .progress-tit {
    color: var(--color-w100, #fff)
}

.progress-step-group.type2 .progress-item.current .progress-square [class*="ico-"] {
    -webkit-filter: var(--filter-w100);
    filter: var(--filter-w100)
}

.progress-step-group.type2 .progress-item+.progress-item:before {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    left: -100%;
    width: 100%;
    height: 0.2rem;
    background-color: var(--color-cg500, #e6ebf5)
}

.progress-step-group.type2 .progress-item.current+.progress-item:before {
    background-color: var(--color-bu600, #0082ff)
}

.progress-step-group.type2 .progress-item.nutrition.current .ico-help.solid {
    background-image: url(../../img/mmk/common/moneytree/supplements.png);
    -webkit-filter: none;
    filter: none;
    width: 5rem;
    height: 5rem;
    margin-top: -2rem
}

:root .progress-step-group.type2 .progress-item.current .progress-tit {
    color: var(--txt-pri-invert)
}

/*! component element progress step_type3 CBRCSC1400000100S */

.progress-step-group.type3 {
    width: 100%
}

.progress-step-group.type3 .progress-circle .txt {
    color: var(--txt-quin)
}

/*! component element progress payment-step PBKINQ040112A100S */

.payment-step-group {
    width: 100%;
    margin-top: 1.6rem;
    padding-bottom: 0.4rem
}

.payment-step-group .progress-row {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.payment-step-group .progress-item {
    position: relative;
    z-index: 1;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    margin-right: 1.2rem
}

.payment-step-group .progress-item:last-child {
    margin-right: 0
}

.payment-step-group .progress-square {
    height: 0.8rem;
    background-color: var(--color-w10);
    border-radius: 0.2rem
}

.payment-step-group .progress-item.current .progress-square {
    background-color: var(--color-vo400)
}

/*! component element progress otp */

.component-otp {
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.progress-otp-group {
    position: relative
}

.progress-otp-group svg {
    width: 30rem;
    height: 30rem
}

.progress-otp-group .bar-bg {
    position: absolute;
    top: 35%;
    width: 100%;
    text-align: center;
    font-size: 4.6rem;
    font-weight: 700
}

.progress-otp-group .bar-bg .btn-refresh {
    font-size: 2.2rem
}

.progress-otp-group .progress-txt {
    width: 100%;
    text-align: center;
    margin-top: 2.6rem;
    color: var(--color-g700);
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400
}

.progress-otp-group .progress-txt .txt.secondary-1 {
    color: var(--color-bu800, #0150ff)
}

[data-time-fill] .fill-item {
    opacity: 0
}

[data-time-fill] circle.fill-item {
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
    -webkit-transform-origin: center;
    -ms-transform-origin: center;
    transform-origin: center
}

[data-time-fill] circle.fill-item.active {
    opacity: 1;
    -webkit-animation: fillRound 60s linear forwards;
    animation: fillRound 60s linear forwards
}

@-webkit-keyframes fillRound {
    100% {
        stroke-dashoffset: 0
    }
}

@keyframes fillRound {
    100% {
        stroke-dashoffset: 0
    }
}

@media screen and (max-width: 360px) {
    .progress-otp-group {
        zoom: 90%
    }
    .progress-otp-group svg {
        width: 300px;
        height: 300px
    }
}

/*! component element progress 조직도 */

.round-box-group li {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 5rem;
    border-radius: 2.5rem;
    margin-top: 2.4rem;
    text-align: center;
    background-color: var(--color-w100, #fff)
}

.round-box-group li.fill-box {
    background-color: var(--color-g900, #141414);
    color: var(--color-w100, #fff)
}

.round-box-group li.dotted-box {
    border: 1px dotted var(--color-cg600, #a6a6b3)
}

.round-box-group li:before {
    content: "";
    position: absolute;
    left: 50%;
    top: -2.4rem;
    width: 0.1rem;
    height: 2.4rem;
    background-color: var(--color-g200, #eee)
}

.round-box-group li:first-child {
    margin-top: 0
}

.round-box-group li:first-child:before {
    content: none
}

.round-box-group li .txt {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.round-box-group+.text-list-group2 {
    margin-top: 3.2rem
}

/*! component element text - title basic type - 타이틀 애니메이션 필요시 사용 */

.title-group.title-group-animation {
    position: relative;
    min-height: 3.1rem
}

.title-group.title-group-animation .title-field-page {
    opacity: 0;
    position: absolute;
    top: 0
}

.title-group.title-group-animation .title-field-page.title-animation {
    opacity: 1;
    position: relative;
    -webkit-transition: opacity .4s ease-in-out;
    -o-transition: opacity .4s ease-in-out;
    transition: opacity .4s ease-in-out
}

/*! component element text - title basic type line-height 가이드 반영 2023-09-05 ksy */

.title-group.space {
    padding: 0 2.0rem
}

.title-group.center {
    text-align: center
}

.title-group.center .ico-figure {
    margin: 0 0 2rem
}

.title-group+.graybox-group {
    margin-top: 1.6rem
}

.title-group.graybox {
    margin-bottom: 1.6rem;
    padding: 1.2rem 1.6rem;
    background-color: var(--color-g100, #f8f8f8);
    border-radius: 1rem
}

.title-group.graybox .title-flex-area {
    margin-bottom: 0
}

.title-group .title-flex-area {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    margin-bottom: 1.6rem
}

.title-group .title-flex-area.flex-center {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

:root .title-group .title-flex-area.flex-center .btn-lv03 {
    background-color: var(--bg-pri, #0114a7)
}

:root .title-group .title-flex-area.flex-center .btn-lv03.bg-coolgray2 {
    background-color: var(--bg-ter, #edf1f7)
}

:root .title-group .title-flex-area.flex-center .btn-lv03.bg-coolgray2 .txt {
    color: var(--txt-accent-pri, #0114a7)
}

:root .title-group .title-flex-area.flex-center .btn-lv03.divider-gray {
    background-color: var(--bg-ter)
}

:root .title-group .title-flex-area.flex-center .btn-lv03.divider-gray .txt {
    color: var(--txt-accent-pri)
}

:root .title-group .title-flex-area .txt-lv02 {
    color: var(--color-grey-g900, #252b37) !important
}

.title-group .title-flex-area.flex-end {
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end
}

.title-group .title-flex-area.flex-start {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.title-group .title-flex-area .title-field-01 {
    margin-bottom: 0
}

.title-group .title-flex-area02 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-top: 4.8rem;
    margin-bottom: 1.6rem
}

.title-group .title-flex-area02 .title-field-02 {
    color: var(--color-g900, #141414);
    font-size: 1.8rem;
    line-height: 2.4rem;
    font-weight: bold
}

.title-group .title-flex-area02 .basic-date,
.title-group .title-flex-area02 .sum {
    color: var(--color-g700);
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400
}

.title-group .title-flex-area02 .num {
    margin-right: -0.3rem
}

.title-group .title-flex-area03 {
    text-align: center
}

.title-group .title-flex-area03 .title-util-area {
    font-size: 0
}

.title-group .title-flex-area03 .title-util-txt {
    font-size: 2.4rem;
    line-height: 3.2rem;
    font-weight: bold;
    color: var(--color-g900, #141414)
}

.title-group .title-flex-area03 .txt-guide-popup {
    margin-top: 0.8rem
}

.title-group .title-flex-area [class*=title-field] {
    margin-right: auto
}

.title-group .title-flex-area>[class*=title-field]~* {
    margin-left: 1rem
}

.title-group .title-flex-area04 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.title-group .title-flex-area04 .btn-text {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.title-group .title-flex-area04 .btn-text .txt {
    margin: 0 0.2rem 0 0.2rem
}

.title-group .title-flex-area04 .btn-text .ico-arrow-link {
    width: 1.8rem;
    height: 1.8rem
}

.title-group+.agreement-group2 {
    margin-top: 0
}

.title-group+.table-layout-group {
    margin-top: 1.6rem
}

.title-group+.list-deal-group {
    margin-top: 1.6rem
}

.title-group+.bg-number-group {
    margin-top: 2.4rem
}

.title-group+.card-group {
    margin-top: 2.4rem
}

.title-group+.form-group {
    margin-top: 2.4rem
}

.title-group+.form-group.no-top-space {
    margin-top: 0
}

.title-group .title-field-page {
    color: var(--color-g900, #141414);
    font-size: 2.4rem;
    line-height: 3.2rem;
    font-weight: bold;
    word-break: keep-all
}

.title-group .title-field-page.dark-gray {
    color: var(--color-g700)
}

.title-group .title-field-page .secondary1-1 {
    color: var(--color-bu800, #0150ff)
}

.title-group .title-field-page .secondary1-2 {
    color: var(--txt-accent-sec, #4262ff)
}

.title-group .title-field-page .warning {
    color: var(--color-re700, #f02727)
}

.title-group .title-field-page .cy600 {
    color: var(--color-cy600, #019cc8)
}

.title-group .title-field-21 {
    color: var(--color-g900, #141414);
    font-size: 2.1rem;
    line-height: 2.6rem;
    font-weight: bold;
    word-break: keep-all
}

.title-group .title-field-21 .blue {
    color: var(--color-bu800, #0150ff)
}

.title-group .title-field-21 .tag.cashback {
    margin-left: 0.5rem
}

.title-group .title-field-24 {
    color: var(--txt-pri);
    font-size: 2.4rem;
    line-height: 3.4rem;
    font-weight: bold;
    word-break: keep-all
}

.title-group .title-field-26 {
    color: var(--txt-pri);
    font-size: 2.6rem;
    line-height: 3.4rem;
    font-weight: bold;
    word-break: keep-all
}

.title-group .title-field-28 {
    color: var(--txt-pri);
    font-size: 2.8rem;
    line-height: 3.6rem;
    font-weight: bold;
    word-break: keep-all
}

.title-group .title-field-32 {
    color: var(--txt-pri);
    font-size: 3.2rem;
    line-height: 4.2rem;
    font-weight: bold;
    word-break: keep-all
}

.title-group .title-field-popup-full {
    color: var(--color-g900, #141414);
    font-size: 2.4rem;
    line-height: 3.2rem;
    font-weight: bold;
    word-break: keep-all
}

.title-group .title-field-popup {
    color: var(--color-g900, #141414);
    font-size: 2.1rem;
    line-height: 2.6rem;
    font-weight: bold;
    word-break: keep-all
}

.title-group .title-field-popup.normal {
    font-weight: normal
}

.title-group .title-field-popup.title-flex-area {
    margin-bottom: 0;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.title-group .title-field-page .tooltip-group {
    margin-left: .2rem
}

.title-group .title-field-page .btn-tooltip {
    top: -2px
}

.title-group .title-field-page .ico-help {
    width: 2rem;
    height: 2rem
}

.title-group+.tab-group {
    margin-top: 2.4rem
}

.title-group.type2 {
    padding-top: 7.2rem;
    text-align: center
}

.title-group.type2 .title-field-page {
    font-size: 3.2rem;
    color: var(--txt-pri);
    font-weight: 700;
    line-height: 4.2rem
}

.title-group.type2 .title-field-eyebrow {
    display: inline-block;
    padding-bottom: 1.2rem;
    font-size: 2.1rem;
    color: var(--txt-pri-down);
    font-weight: 700;
    line-height: 2.7rem
}

.title-group.type3 {
    padding-top: 7.2rem;
    text-align: center
}

.title-group.type3 .txt-guide {
    margin-top: 2.4rem
}

.title-group.type3 .title-field-page {
    font-size: 2.8rem;
    color: var(--txt-pri);
    font-weight: 700;
    line-height: 3.6rem
}

.title-group.type3 .title-field-eyebrow {
    display: inline-block;
    padding-bottom: 1.2rem;
    font-size: 1.8rem;
    color: var(--txt-pri-down);
    font-weight: 700;
    line-height: 2.5rem
}

.title-group.type2 .txt-guide {
    font-size: 1.6rem;
    color: var(--txt-qua);
    font-weight: 500;
    line-height: 2.4rem;
    margin-top: 2.4rem
}

:root .title-group .title-field-popup.title-mixed-calendar::after {
    content: '';
    display: inline-block;
    vertical-align: middle;
    margin-top: -0.4rem;
    margin-left: 0.4rem;
    width: 1.6rem;
    height: 1.6rem;
    background-position: center center;
    background-repeat: no-repeat;
    background-image: var(--path-solid-triangle-up);
    background-size: 1.6rem
}

.title-group .title-field-00 {
    display: block;
    color: var(--txt-pri);
    font-size: 2.1rem;
    line-height: 2.6rem;
    font-weight: 700
}

.title-group .title-field-01 {
    display: block;
    color: var(--color-g900, #141414);
    font-size: 1.8rem;
    line-height: 2.4rem;
    font-weight: bold;
    margin-bottom: 1.6rem
}

.title-group .title-field-01.no-space-bottom {
    margin-bottom: 0
}

.title-group .title-field-02 {
    display: block;
    color: var(--color-g900, #141414);
    font-size: 1.6rem;
    line-height: 2rem;
    font-weight: bold
}

.title-group .title-field-02+.title-field-03 {
    margin-top: 1.6rem
}

.title-group .title-field-03 {
    color: var(--color-g900, #141414);
    font-size: 1.6rem;
    line-height: 2rem;
    font-weight: 400;
    margin-bottom: 1.2rem
}

.title-group .title-field-04 {
    display: block;
    color: var(--txt-ter);
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 700
}

.title-group .title-field-004 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.title-group .title-field-004>div {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-bottom: 0.2rem
}

.title-group .title-field-004>div .l-txt {
    display: block;
    color: var(--color-g900, #141414);
    font-size: 1.6rem;
    line-height: 2rem;
    font-weight: bold
}

.title-group .title-field-004>div .r-txt {
    color: var(--color-g700);
    font-size: 1.4rem;
    line-height: 2rem
}

.title-group .title-field-004 .b-txt {
    color: var(--color-g700);
    font-size: 1.1rem
}

.title-group .title-field-05 {
    display: block;
    color: var(--txt-quin);
    font-size: 1.6rem;
    line-height: 2rem;
    font-weight: 700
}

.title-group .title-field-06 {
    display: block;
    color: var(--txt-pri);
    font-size: 2.1rem;
    line-height: 2.6rem;
    font-weight: 700
}

.title-group .title-field-07 {
    display: block;
    color: var(--txt-pri);
    font-size: 2.4rem;
    line-height: 3.2rem;
    font-weight: 700
}

.title-group .title-field-08 {
    display: block;
    color: var(--txt-sec);
    font-size: 2.8rem;
    line-height: 3.6rem;
    font-weight: 700
}

.title-group .title-field-notice {
    color: var(--txt-pri);
    font-size: 1.6rem;
    line-height: 2rem;
    font-weight: bold;
    margin-bottom: 1.2rem
}

.title-group .title-field-01.flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.title-group .txt-guide {
    margin-top: 1.6rem;
    color: var(--color-g700);
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400
}

:root .title-group .txt-guide {
    color: var(--txt-qua, #67748e)
}

:root .title-group .txt-guide {
    color: var(--txt-ter)
}

.title-group .txt-guide.space1 {
    margin-top: 0.4rem
}

.title-group .txt-guide.mt32 {
    margin-top: 3.2rem
}

.title-group .txt-guide.mt8 {
    margin-top: .8rem
}

.title-group .txt-guide.flex-ty {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.title-group .txt-guide+.txt-guide {
    margin-top: 0.4rem
}

.title-group .txt-guide+.txt-guide.mt32 {
    margin-top: 3.2rem
}

.title-group .txt-guide .bl-txt-group>.txt {
    font-size: 1.6rem;
    margin-top: 0.4rem
}

.title-group .txt-guide [class^="logo-"] {
    vertical-align: middle;
    margin-right: -0.4rem
}

.title-group .txt-guide .tag {
    margin-right: 0.4rem
}

.title-group .txt-guide .tag+.tooltip-area.align-bottom {
    top: 170%
}

.title-group .txt-guide .black {
    color: var(--color-g900, #141414);
    margin: 0 0.4rem 0 0.8rem
}

.title-group .txt-guide.dark-gray {
    color: var(--color-g700)
}

.title-group .txt-guide.primary {
    color: var(--color-pn, #17008c)
}

.title-group .txt-guide.caption {
    margin-top: 2.4rem;
    margin-bottom: 0.4rem;
    font-size: 1.5rem;
    height: 2rem;
    color: var(--txt-accent-sec)
}

.title-group .txt-guide+.title-field-page {
    margin-top: 0.8rem
}

.title-group .dot-flashing+.title-field-page {
    margin-top: 2.4rem
}

.title-group .txt-guide02 {
    margin-top: 1.6rem;
    margin-bottom: 4.8rem;
    color: var(--color-pn, #17008c);
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400
}

.title-group .txt-guide-popup {
    margin-top: 1.6rem;
    color: var(--color-g700);
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400
}

:root .title-group .txt-guide-popup {
    color: var(--txt-ter)
}

.title-group .txt-guide-popup.type01 {
    line-height: 2rem
}

.title-group .txt-guide03 {
    position: relative;
    margin-top: .4rem;
    padding: 0.8rem 0.2rem 0 2.2rem;
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-bu900, #003fc7)
}

.title-group .txt-guide03:before {
    content: '';
    display: block;
    position: absolute;
    top: 0.8rem;
    left: 0;
    width: 1.8rem;
    height: 1.8rem;
    background-image: var(--path-solid-exclamation-circle);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
    -webkit-filter: var(--filter-bu900);
    filter: var(--filter-bu900)
}

.title-group .txt-guide04 {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 500;
    color: var(--color-g700, #7d7d7d)
}

.title-group .txt-guide05 {
    font-size: 1.5rem;
    line-height: 2rem;
    color: var(--txt-qua)
}

.title-group .txt-guide06 {
    font-size: 1.5rem;
    line-height: 2rem;
    color: var(--txt-ter)
}

.title-group .txt-guide07 {
    font-size: 1.6rem;
    font-weight: 400;
    line-height: 2.8rem;
    color: var(--txt-sec)
}

.title-group .txt-guide07+.txt-guide07 {
    margin-top: 2.4rem
}

.title-group+.btn-under-link {
    display: inline-block;
    margin-top: 2.4rem
}

.title-group+.btn-under-link.right {
    display: block;
    margin: 2.4rem auto 0 0
}

.title-group+.toggle-radio-area {
    margin-top: 1.2rem
}

.title-group+.agreement-group3 {
    margin-top: 0
}

.title-group+.input-radio-btn-group {
    margin-top: 1.2rem
}

.title-group.flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.title-group.flex .title-field-01+.qr-field {
    width: 10rem;
    text-align: right
}

.title-group+.table-layout-group .table-layout-header {
    margin-top: -3.6rem
}

.title-group02 {
    text-align: center;
    margin-top: 6.4rem
}

.title-group02 .title-field-page02 {
    color: var(--color-g900, #141414);
    font-size: 2.4rem;
    line-height: 3.2rem;
    font-weight: bold;
    word-break: keep-all
}

.title-group02 .txt-guide02 {
    margin-top: 1.6rem;
    color: var(--color-g700);
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400
}

.title-group.twin-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.title-group.twin-group .title-field-01 {
    margin-bottom: 0
}

.title-group.twin-group .btn-group .btn-lv01.divider-gray {
    padding: 0 0.8rem;
    height: 3.2rem;
    line-height: 3.2rem;
    border-radius: 0.8rem
}

.title-group.twin-group .btn-group .btn-lv01.divider-gray .txt {
    font-size: 1.4rem
}

.title-group.loan-event {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.title-group.loan-event [class*="ico-loan"] {
    margin-bottom: 2rem
}

.form-tit sup.required,
.title-group sup.required {
    color: var(--color-re700, #f02727);
    font-size: 100%;
    top: -0.2rem
}

.title-group .txt-eyebrow {
    font-size: 1.8rem;
    font-weight: 700;
    line-height: 2.5rem;
    color: var(--color-grey-g700);
    margin-bottom: 1.2rem
}

.title-group.dsr .title-field-page {
    font-size: 3.2rem;
    color: var(--grey-g900);
    line-height: 4.2rem
}

.title-group.dsr .title-field-page strong {
    display: block;
    color: var(--txt-pri-down);
    font-weight: 700;
    margin-bottom: 4rem
}

.title-group .ico-oxquiz-x {
    margin-top: 3
}

.title-group.dsr {
    padding-bottom: 3.2rem;
    border-bottom: 1px solid var(--border-qua)
}

.title-group.dsr.no-line {
    border-bottom: none
}

.title-group.ani-up .txt {
    -webkit-animation: title-ani-up 0.6s ease forwards;
    animation: title-ani-up 0.6s ease forwards;
    -webkit-transform: translateY(2rem);
    -ms-transform: translateY(2rem);
    transform: translateY(2rem);
    opacity: 0
}

@-webkit-keyframes title-ani-up {
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1
    }
    50% {
        opacity: .7
    }
    0% {
        -webkit-transform: translateY(3rem);
        transform: translateY(3rem);
        opacity: 0
    }
}

@keyframes title-ani-up {
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1
    }
    50% {
        opacity: .7
    }
    0% {
        -webkit-transform: translateY(3rem);
        transform: translateY(3rem);
        opacity: 0
    }
}

/*! component element text icon + title */

.ico-figure-group+.title-group {
    margin-top: 2.4rem
}

.ico-figure-group.ty01 {
    width: 8rem;
    height: 8rem
}

.ico-figure-group.ty01 img {
    width: 100%
}

.ico-figure-group.ty02 {
    display: block;
    margin: 4rem auto 0;
    width: 22.3rem;
    height: 22.3rem
}

.ico-figure-group.ty02 img {
    width: 100%
}

.ico-figure-group.ty03 {
    display: block;
    margin: 3.2rem auto;
    width: 22rem;
    height: 22rem
}

.ico-figure-group.ty03 img {
    width: 100%
}

.ico-figure-group.ty04 {
    display: block;
    margin: 0 auto 1.6rem;
    width: 30rem;
    height: 20rem
}

.ico-figure-group.ty04 img {
    width: 100%
}

.ico-figure-group .ico-connectiong {
    left: 0
}

.ico-figure-group.ty05 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.ico-figure-group.ty05 .compare-items-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.ico-figure-group.ty05 .compare-items-group .item {
    position: relative;
    margin-left: -2.8rem
}

.ico-figure-group.ty05 .compare-items-group .item:first-child {
    margin-left: 0;
    z-index: 1
}

.ico-figure-group.ty06 {
    width: 6.4rem;
    height: 6.4rem
}

.ico-figure-group.ty07 {
    width: 100%
}

/*! component element text title 아래 도움말 */

.help-group {
    text-align: right;
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    margin-top: 3.2rem;
    color: var(--color-g700)
}

.help-group.help-utype-01 {
    margin: 1.6rem 0 .6rem
}

/*! component element text 인증번호 */

.cert-group {
    width: 20rem;
    height: 20rem;
    border-radius: 50%;
    background-color: var(--color-g100, #f8f8f8);
    margin: 0 auto;
    text-align: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.cert-group .cert-txt {
    font-size: 5.8rem;
    font-weight: 700;
    color: var(--color-g900, #141414)
}

:root .cert-group {
    background-color: var(--bg-qua)
}

:root .cert-group .cert-txt {
    color: var(--txt-pri)
}

.txt-certinum {
    margin: 0 auto 2.8rem;
    text-align: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.txt-certinum .cert-txt {
    font-size: 2.8rem;
    font-weight: 700;
    color: var(--color-g900, #141414)
}

/*! component element text number type */

.bg-number-group {
    counter-reset: num
}

.bg-number-group .count {
    position: relative;
    padding-left: 3.4rem;
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400;
    counter-increment: num;
    padding-bottom: 3.6rem
}

.bg-number-group .count.disabled:before {
    background: var(--color-g500, #b8b8b8)
}

:root .bg-number-group .count.disabled:before {
    background: var(--bg-base);
    border: 2px solid var(--border-qua);
    color: var(--txt-quin);
    line-height: 2.1rem
}

.bg-number-group .count.disabled .num-tit {
    color: var(--color-g500, #b8b8b8)
}

:root .bg-number-group .count.disabled .num-tit {
    color: var(--txt-quin, #8694b1);
    padding-top: 0.3rem
}

.bg-number-group .count.disabled .num-tit+*,
.bg-number-group .count.past .num-tit+* {
    display: none
}

.bg-number-group .count.check {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    width: 100%;
    position: relative
}

.bg-number-group .count.check:before {
    content: '';
    text-align: center;
    -webkit-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out;
    border-radius: 50%;
    background-color: var(--color-pl, #b6f23d)
}

.bg-number-group .count.check .ico-complete02 {
    width: 1rem;
    height: 0.6rem;
    border-top: 0.2rem solid var(--color-w100, #fff);
    border-right: 0.2rem solid var(--color-w100, #fff);
    -webkit-transform: rotate(130deg);
    -ms-transform: rotate(130deg);
    transform: rotate(130deg);
    z-index: 10;
    position: absolute;
    top: 0.7rem;
    left: 0.7rem
}

.bg-number-group .count:after {
    position: absolute;
    left: 1.2rem;
    top: 0;
    content: "";
    width: 0.1rem;
    height: 100%;
    background: var(--color-g200, #eee);
    display: block
}

.bg-number-group .count:before {
    position: absolute;
    left: 0;
    top: 0;
    content: counter(num);
    width: 2.4rem;
    height: 2.4rem;
    background: var(--color-g900, #141414);
    border-radius: 50%;
    display: block;
    color: var(--color-w100, #fff);
    text-align: center;
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: bold;
    line-height: 2.4rem;
    z-index: 2
}

:root .bg-number-group .count:before {
    font-size: 1.6rem;
    font-weight: 700;
    background: var(--bg-sec-active, #020616)
}

.bg-number-group .count:last-child {
    padding-bottom: 0
}

.bg-number-group .count:last-child:after {
    content: none
}

.bg-number-group .count .num-tit {
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: bold
}

:root .bg-number-group .count .num-tit {
    font-size: 1.6rem;
    line-height: 2rem;
    font-weight: 700;
    color: var(--txt-sec-active, #020616);
    padding-top: 0.3rem
}

.bg-number-group .count .num-tit+.txt {
    margin-top: 1.6rem
}

:root .bg-number-group .count .num-tit+.txt {
    margin-top: 0.95rem
}

.bg-number-group .count .num-tit+.bl-txt-group {
    margin-top: 1.6rem
}

.bg-number-group .count .txt {
    font-size: 1.6rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g900, #141414)
}

:root .bg-number-group .count .txt {
    line-height: 2rem;
    padding-top: 0.2rem
}

.bg-number-group .count .txt.bold+.txt {
    margin-top: 1.2rem
}

.bg-number-group .count .txt.bold+.txt-lv02 {
    margin-top: 0.8rem
}

.bg-number-group .count .txt.bold+.text-list-group2 {
    margin-top: 1.2rem
}

.bg-number-group .count .bl-txt-group {
    margin-top: 1.2rem
}

.bg-number-group .count .bl-txt-group .small-txt-group {
    margin-top: 0.4rem
}

.bg-number-group .count .bl-txt-group .small-txt-group .txt {
    margin-top: 0.4rem
}

.bg-number-group .count .bl-txt-group .small-txt-group .bl-txt-group {
    margin-top: 0
}

.bg-number-group .count .bl-txt-group .dash-txt-group {
    margin-top: 1.2rem
}

.bg-number-group .count .bl-txt-group .dash-txt-group .txt {
    color: var(--color-g700)
}

.bg-number-group .small-txt-group {
    margin-top: 1.2rem
}

.bg-number-group .small-txt-group .txt {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400
}

.bg-number-group .small-txt-group .bl-txt-group {
    margin-top: 0.4rem
}

.bg-number-group .small-txt-group .bl-txt-group .txt {
    margin-top: 0.4rem
}

.bg-number-group .small-txt-group.darkgray2 .txt {
    color: var(--color-g700)
}

.bg-number-group.small .count {
    padding-bottom: 2rem
}

.bg-number-group.medium .count {
    padding-bottom: 3.2rem
}

.bg-number-group.large .count {
    padding-left: 4.2rem;
    padding-bottom: 2rem
}

.bg-number-group.large .count:last-child {
    padding-bottom: 0
}

.bg-number-group.large .count:before {
    font-size: 1.5rem;
    line-height: 3.2rem;
    color: var(--txt-ter);
    font-weight: 700;
    width: 3.2rem;
    height: 3.2rem;
    background-color: var(--bg-ter)
}

.bg-number-group.large .count:after {
    left: 1.6rem;
    background: var(--bg-ter)
}

.bg-number-group.large .count .txt {
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--txt-qua)
}

.bg-number-group.large .count .txt.bold {
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: 700;
    color: var(--color-grey-g900)
}

.bg-number-group.large .count .txt.bold+.txt {
    margin-top: 0.4rem
}

.graybox-group.type4 .bg-number-group.large .count:before {
    background-color: var(--bg-pri-invert);
    color: var(--txt-pri-invert)
}

.graybox-group.type4 .bg-number-group.ty04 .count:after {
    height: auto;
    bottom: 0.4rem;
    background: var(--bg-pri-invert)
}

.graybox-group.type4.bg-qua .bg-number-group.large .count:before {
    background-color: var(--bg-ter);
    color: var(--txt-ter)
}

.graybox-group.type4.bg-qua .bg-number-group.ty04 .count:after {
    background: var(--bg-ter)
}

.graybox-group.type4 .txt-img1 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative
}

.graybox-group.type4 .txt-img1 .img {
    width: 2.4rem;
    margin-left: 0.4rem
}

.graybox-group.type4 .txt-img2 {
    position: relative;
    padding-right: 4.3rem
}

.graybox-group.type4 .txt-img2 .img {
    position: absolute;
    top: 50%;
    right: 0;
    height: 3.9rem;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

.section-component.type3 .graybox-group.type4 {
    background-color: var(--bg-base)
}

.section-component.type3 .graybox-group.type4 .title {
    color: var(--txt-ter)
}

.section-component.type3 .graybox-group.type4 .bg-number-group.large .count:before {
    background-color: var(--bg-ter);
    color: var(--txt-ter)
}

.section-component.type3 .graybox-group.type4 .bg-number-group.ty04 .count:after {
    background: var(--bg-ter)
}

.bg-number-group .img-figure {
    margin-top: 1.6rem
}

.bg-number-group .img-figure img {
    width: 100%
}

.bg-number-group .count.past:before {
    content: '';
    background: var(--color-g300, #e0e0e0)
}

.bg-number-group .count.past .num-tit {
    position: relative;
    color: var(--color-g500, #b8b8b8)
}

.bg-number-group .count.past .num-tit:before {
    content: '';
    display: block;
    position: absolute;
    top: 0.5rem;
    left: -2.5rem;
    width: 0.7rem;
    height: 1.1rem;
    border-bottom: 0.15rem solid var(--color-g500, #b8b8b8);
    border-right: 0.15rem solid var(--color-g500, #b8b8b8);
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    z-index: 2
}

:root .bg-number-group .count.past:before {
    background: var(--bg-sec, #e0e6f1)
}

:root .bg-number-group .count.past .num-tit {
    color: var(--txt-quin, #8694b1);
    padding-top: 0.3rem
}

:root .bg-number-group .count.past .num-tit:before {
    border-bottom: 0.15rem solid var(--txt-readonly, #67748e);
    border-right: 0.15rem solid var(--txt-readonly, #67748e)
}

.bg-number-group .count.on:before {
    background: var(--color-bu600, #0082ff)
}

.bg-number-group .count.on .num-tit {
    color: var(--color-bu600, #0082ff)
}

.bg-number-group .count.on .txt {
    font-size: 1.5rem;
    margin-top: 0.95rem
}

:root .bg-number-group .count.on:before {
    background: var(--bg-accent-pri, #4262ff)
}

:root .bg-number-group .count.on .num-tit {
    color: var(--txt-accent-sec, #4262ff);
    padding-top: 0.3rem
}

.bg-number-group.color1 .count:before {
    background-color: var(--color-cg500, #e6ebf5);
    color: var(--color-g800, #414141)
}

.bg-number-group.ty01 .count {
    padding-bottom: 2.4rem
}

.bg-number-group.ty01 .count:last-child {
    padding-bottom: 0
}

.bg-number-group.ty01 .count:before {
    background: var(--color-w100, #fff);
    color: var(--color-g700);
    font-weight: 400;
    font-size: 1.6rem;
    border: 1px solid var(--color-g700);
    line-height: 2.2rem
}

.bg-number-group.ty01 .count:after {
    width: auto;
    border-left: 1px dotted var(--color-g700)
}

.bg-number-group.ty01 .count .tit-area {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.bg-number-group.ty01 .count .tag {
    display: none;
    margin-left: .4rem
}

.bg-number-group.ty01 .count .txt {
    padding-top: 0
}

.bg-number-group.ty01 .count .tag .txt {
    font-size: 1.1rem;
    color: var(--color-w100, #fff);
    font-weight: 700;
    line-height: 100%
}

.bg-number-group.ty01 .count.defalutOpen .tag {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex
}

.bg-number-group.ty01 .section-link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: .2rem 0
}

.bg-number-group.ty01 .section-link .col-tit {
    color: var(--color-g700)
}

.bg-number-group.ty01 .count.defalutOpen .ui-accordion-cont {
    display: block
}

.bg-number-group.ty01 .count.defalutOpen:before,
.bg-number-group.ty01 .count.open:before {
    background: var(--color-g300, #e0e0e0);
    color: var(--color-g800, #414141);
    font-weight: bold;
    border-color: var(--color-g300, #e0e0e0)
}

.bg-number-group.ty01 .count.defalutOpen:after,
.bg-number-group.ty01 .count.open:after {
    display: none
}

.bg-number-group.ty01 .count.defalutOpen .col-tit,
.bg-number-group.ty01 .count.open .col-tit {
    color: var(--color-g900, #141414);
    font-weight: bold
}

.bg-number-group.ty01 .count.defalutOpen .ico-arrow-open {
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
    -webkit-filter: var(--filter-g400);
    filter: var(--filter-g400)
}

.bg-number-group.ty01 .count.defalutOpen .accordion-cont,
.bg-number-group.ty01 .count.open .accordion-cont {
    width: calc(100% + 2.4rem);
    margin-left: -2.4rem
}

.bg-number-group.ty01 .bl-txt-group>.txt {
    font-size: 1.5rem;
    line-height: 2rem
}

.bg-number-group.ty01 .bl-txt-group .dash-txt-group {
    margin-top: .4rem
}

.bg-number-group.ty01 .bl-txt-group .dash-txt-group>.txt {
    font-size: 1.4rem;
    line-height: 2rem
}

.bg-number-group.ty01 .card-group {
    display: none
}

.bg-number-group.ty01 .card-group .txt {
    font-size: inherit
}

.bg-number-group.ty01 .card-group .btn-group .txt {
    color: inherit;
    font-weight: 500;
    font-size: 1.6rem
}

.bg-number-group.ty01 .count.defalutOpen .card-group {
    display: block
}

.bg-number-group.ty02 {
    margin-top: 2rem
}

.bg-number-group.ty02 .count {
    padding-left: 3.2rem;
    padding-bottom: 1.6rem
}

.bg-number-group.ty02 .count:before {
    background: var(--txt-ter) !important
}

.bg-number-group.ty02 .count .txt {
    padding-top: 0;
    line-height: 2.1rem;
    color: var(--txt-ter)
}

.bg-number-group.ty02 .count .txt span {
    color: var(--txt-accent-sec)
}

.bg-number-group.ty03 .count {
    padding-bottom: 2.4rem
}

.bg-number-group.ty03 .count:last-child {
    padding-bottom: 0
}

.bg-number-group.ty03 .count:before {
    background: var(--color-w100);
    color: var(--txt-ter);
    font-weight: 400;
    font-size: 1.6rem;
    border: 2px solid var(--border-qua);
    line-height: 2rem
}

.bg-number-group.ty03 .count:after {
    width: auto;
    border-left: 2px solid var(--bg-sec);
    left: 1.1rem
}

.bg-number-group.ty03 .count .tit-area {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.bg-number-group.ty03 .count .tag {
    display: none;
    margin-left: .4rem;
    background: var(--color-indigo-in50)
}

.bg-number-group.ty03 .count .txt {
    padding-top: 0
}

.bg-number-group.ty03 .count .tag .txt {
    font-size: 1.1rem;
    color: var(--txt-accent-sec);
    font-weight: 700;
    line-height: 100%
}

.bg-number-group.ty03 .count.defalutOpen .tag {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex
}

.bg-number-group.ty03 .section-link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: .2rem 0
}

.bg-number-group.ty03 .section-link .col-tit {
    color: var(--color-g700)
}

.bg-number-group.ty03 .section-link.disabled {
    cursor: default
}

.bg-number-group.ty03 .count.defalutOpen .ui-accordion-cont {
    display: block
}

.bg-number-group.ty03 .count.end:before {
    background: var(--bg-sec) url("/resource/img/mmk/common/ico_check_loan.png") center center no-repeat;
    background-size: 1.6rem 1.6rem;
    color: transparent;
    font-weight: bold;
    border-color: var(--bg-sec)
}

.bg-number-group.ty03 .count.defalutOpen:before {
    background: var(--bg-sec-active);
    color: var(--txt-pri-invert);
    font-weight: bold;
    border-color: var(--bg-sec-active)
}

.bg-number-group.ty03 .count.defalutOpen:after {
    border-left: 2px dotted var(--border-qua);
    background: transparent;
    width: 2rem
}

.bg-number-group.ty03 .count:last-child.defalutOpen:after {
    content: '';
    height: calc(100% - 9.5rem);
    border-bottom: 2px dotted var(--border-qua)
}

.bg-number-group.ty03 .count:last-child.no-border.defalutOpen:after {
    display: none
}

.bg-number-group.ty03 .count.open:after {
    border-left: 2px dotted var(--border-qua) !important;
    background: transparent
}

.bg-number-group.ty03 .count.defalutOpen .col-tit {
    color: var(--color-g900, #141414);
    font-weight: bold
}

.bg-number-group.ty03 .count.open .col-tit {
    font-weight: bold
}

.bg-number-group.ty03 .count.open .section-link.disabled .col-tit {
    font-weight: 400
}

.bg-number-group.ty03 .count.defalutOpen .ico-arrow-open {
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
    -webkit-filter: var(--filter-g400);
    filter: var(--filter-g400)
}

.bg-number-group.ty03 .count.defalutOpen .accordion-cont,
.bg-number-group.ty03 .count.open .accordion-cont {
    width: calc(100% + .4rem);
    margin-left: -0.4rem
}

.bg-number-group.ty03 .bl-txt-group>.txt {
    padding-right: 1rem;
    font-size: 1.5rem;
    line-height: 2rem
}

.bg-number-group.ty03 .bl-txt-group .dash-txt-group {
    margin-top: .4rem
}

.bg-number-group.ty03 .bl-txt-group .dash-txt-group>.txt {
    font-size: 1.4rem;
    line-height: 2rem
}

.bg-number-group.ty03 .bl-txt-group .dash-txt-group>.txt+.txt {
    margin-top: .4rem
}

.bg-number-group.ty03 .card-group {
    display: none
}

.bg-number-group.ty03 .card-group .txt {
    font-size: inherit
}

.bg-number-group.ty03 .card-group .btn-group .txt {
    color: inherit;
    font-weight: 500;
    font-size: 1.6rem
}

.bg-number-group.ty03 .count.defalutOpen .card-group {
    display: block
}

.bg-number-group.ty04 .count:after {
    width: 0.2rem;
    height: 44%;
    top: 3.6rem
}

.bg-number-group.ty05 .count:before {
    color: var(--txt-ter);
    font-weight: normal !important;
    line-height: 2.1rem;
    border: 0.2rem solid var(--border-qua);
    background-color: var(--bg-pri-base) !important
}

.bg-number-group.ty05 .count::after {
    width: .2rem
}

.bg-number-group.ty05.small .count {
    padding-bottom: 1.2rem
}

/*! component element text number type2 */

.number-group {
    counter-reset: num
}

.number-group .count {
    position: relative;
    padding-left: 3.4rem;
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400;
    counter-increment: num;
    padding-bottom: 2.4rem
}

.number-group .count:after {
    position: absolute;
    left: 1rem;
    top: 0;
    content: "";
    width: 0.1rem;
    height: 100%;
    display: block;
    border-left: 1px dashed var(--color-g900, #141414)
}

.number-group .count:before {
    position: absolute;
    left: 0;
    top: 0;
    content: counter(num);
    width: 2rem;
    height: 2rem;
    background: var(--color-w100, #fff);
    border-radius: 50%;
    display: block;
    color: var(--color-g900, #141414);
    text-align: center;
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    z-index: 2;
    border: 1px solid var(--color-g900, #141414)
}

:root .number-group .count:before {
    line-height: 1.8rem
}

.number-group .count:last-child {
    padding-bottom: 0
}

.number-group .count:last-child:after {
    content: none
}

.number-group .count .num-tit {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400
}

.number-group .count.active:before {
    background: var(--color-bu900, #003fc7);
    border-color: var(--color-bu900, #003fc7);
    color: var(--color-w100, #fff);
    font-weight: bold
}

.number-group .count.active:after {
    border-left: 1px dashed var(--color-bu900, #003fc7)
}

.number-group .count.active .num-tit {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: bold;
    color: var(--color-bu900, #003fc7)
}

:root .number-group .count.active:before {
    background: var(--bg-accent-pri, #4262ff);
    border-color: var(--color-in700, #4262ff);
    color: var(--color-w100, #fff)
}

:root .number-group .count.active:after {
    border-left: 1px dashed var(--color-bu900, #003fc7)
}

:root .number-group .count.active .num-tit {
    color: var(--txt-accent-sec, #4262ff)
}

/*! component element text number type3 */

.number-group2 {
    counter-reset: num;
    padding-bottom: 3.2rem
}

.number-group2 li {
    position: relative;
    counter-increment: num;
    border-top: 1px solid var(--color-g200, #eee)
}

.number-group2 .section-link {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 2.4rem 0 2.4rem 3.6rem;
    min-height: 11.8rem;
    width: 100%;
    -webkit-transition: linear .1s;
    -o-transition: linear .1s;
    transition: linear .1s
}

.number-group2 .section-link.active {
    -webkit-transform: scale(0.95);
    -ms-transform: scale(0.95);
    transform: scale(0.95)
}

.number-group2 .section-link .col-tit-area {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.number-group2 .section-link .col-tit {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.number-group2 .section-link .col-tit:before {
    display: block;
    position: absolute;
    top: calc(50% - 1.4rem);
    left: 0;
    content: counter(num);
    font-size: 2.4rem;
    color: var(--color-pb10, #00000019);
    font-weight: bold
}

:root .number-group2 .section-link .col-tit:before {
    color: var(--txt-quin, #8694b1)
}

:root .number-group2 .section-link .secondary1-1 {
    color: var(---txt-accent-sec, #4262ff) !important
}

.number-group2 .section-link .col-tit>.txt-lv03 {
    line-height: 2.5rem
}

.number-group2 .section-link .title-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -ms-flex-direction: column;
    flex-direction: column;
    margin-top: .4rem
}

.number-group2 .section-link .title-group .title-field-02 {
    line-height: 2.2rem;
    word-break: keep-all
}

.number-group2 .section-link .title-group .title-field-02 .tag {
    margin-left: .2rem;
    margin-bottom: .3rem
}

.number-group2 .section-link .title-group .txt-guide {
    margin-top: .4rem;
    line-height: 2rem;
    font-size: 1.4rem;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: normal;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    white-space: normal;
    -webkit-line-clamp: 1
}

.number-group2 .col-card-bnr {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-left: 1.6rem
}

.number-group2 .col-card-bnr .flip {
    position: relative;
    width: 4.5rem;
    height: 7rem;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-transition: ease-in-out .4s;
    -o-transition: ease-in-out .4s;
    transition: ease-in-out .4s
}

.number-group2 .col-card-bnr .flip .back,
.number-group2 .col-card-bnr .flip .front {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

.number-group2 .col-card-bnr .flip .back {
    -webkit-transform: rotateY(180deg);
    transform: rotateY(180deg)
}

.number-group2 .col-card-bnr .flip img {
    width: 100%
}

.number-group2 li:first-child {
    border: 0
}

.number-group2 li:first-child .section-link {
    min-height: 21.8rem;
    padding-left: 0
}

.number-group2 li:first-child .section-link .col-tit:before {
    position: static;
    margin-bottom: .8rem;
    font-size: 4rem
}

.number-group2 li:first-child .section-link .title-group .title-field-02 {
    font-size: 1.8rem;
    line-height: 2.5rem
}

.number-group2 li:first-child .section-link .title-group .txt-guide {
    -webkit-line-clamp: 2
}

.number-group2 li:first-child .col-card-bnr {
    margin-left: 2.7rem;
    margin-top: 1.1rem
}

.number-group2 li:first-child .col-card-bnr .flip {
    width: 10rem;
    height: 15.8rem;
    -webkit-transform: perspective(30rem) rotateY(15deg);
    transform: perspective(30rem) rotateY(15deg)
}

.number-group2 li:first-child .col-card-bnr .flip.active {
    -webkit-animation: cardFlipAffiliate 2.5s ease-in-out forwards;
    animation: cardFlipAffiliate 2.5s ease-in-out forwards
}

@-webkit-keyframes cardFlipAffiliate {
    0% {
        -webkit-transform: perspective(30rem) rotateY(15deg);
        transform: perspective(30rem) rotateY(15deg)
    }
    100% {
        -webkit-transform: perspective(30rem) rotateY(375deg);
        transform: perspective(30rem) rotateY(375deg)
    }
}

@keyframes cardFlipAffiliate {
    0% {
        -webkit-transform: perspective(30rem) rotateY(15deg);
        transform: perspective(30rem) rotateY(15deg)
    }
    100% {
        -webkit-transform: perspective(30rem) rotateY(375deg);
        transform: perspective(30rem) rotateY(375deg)
    }
}

/*! component element text number type4 */

.number-group3 {
    counter-reset: num
}

.number-group3 li {
    position: relative;
    counter-increment: num
}

.number-group3 li+li {
    border-top: 1px solid var(--color-g200, #eee)
}

.number-group3 .section-link {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 2rem 2rem 2rem 5.4rem;
    width: 100%
}

.number-group3 .section-link:before {
    content: "0" counter(num);
    position: absolute;
    top: 50%;
    left: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    font-size: 3.2rem;
    line-height: 4.2rem;
    color: var(--color-500, #8694b1);
    font-weight: 700
}

.number-group3 .section-link .col-tit-area .box-title {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.number-group3 .section-link .col-tit-area .box-title>span {
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: 700
}

.number-group3 .num+.section-link:before {
    display: none
}

.number-group3 .num {
    position: absolute;
    top: 50%;
    left: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    font-size: 3.2rem;
    line-height: 4.2rem;
    color: var(--color-500, #8694b1);
    font-weight: 700;
    z-index: 10
}

/*! component element text number type5 */

.number-group4 {
    counter-reset: num;
    margin-top: 1.6rem
}

.number-group4>li {
    position: relative;
    padding-left: 1.5rem;
    counter-increment: num;
    font-size: 1.5rem;
    line-height: 2rem;
    color: var(--color-g800, #414141)
}

.number-group4>li+li {
    margin-top: .8rem
}

.number-group4>li:before {
    content: counter(num) ".";
    position: absolute;
    top: 0;
    left: 0
}

.number-group4 .txt.txt-lv10 {
    line-height: 1.6rem
}

/*! component element text number type6 */

.number-group5 {
    counter-reset: num
}

.number-group5>li {
    position: relative;
    padding-left: 3.8rem;
    counter-increment: num
}

.number-group5>li:before {
    content: counter(num) "";
    position: absolute;
    top: 50%;
    left: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 2.6rem;
    text-align: center;
    font-size: 1.6rem;
    font-weight: 700;
    color: var(--color-g600, #9b9b9b)
}

:root .number-group5>li:before {
    color: var(--txt-ter, #4d596f)
}

.number-group5>li .section-link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 1.6rem 2rem
}

.list-linebox-group.fullline .number-group5>li:before {
    left: 2rem
}

.number-group5.type2>li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding-right: 2rem
}

.number-group5.type2>li:before {
    color: var(--color-g500);
    width: auto;
    min-width: 2.6rem
}

.number-group5.type2 .list-linebox-group.fullline .section-link {
    padding-right: 0.8rem
}

:root .number-group5.type2>li:before {
    color: var(--txt-quin)
}

.number-group5.add-num>li:before {
    display: none
}

.number-group5.add-num>li>.num {
    position: absolute;
    top: 50%;
    left: 2rem;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    width: auto;
    text-align: center;
    font-size: 1.6rem;
    font-weight: 700;
    color: var(--txt-quin)
}

.number-group5.type3>li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding-left: 2.4em
}

.number-group5.type3>li::before {
    font-size: 1.8rem;
    font-weight: 700;
    line-height: 2.5rem;
    color: var(--color-grey-g900) !important;
    top: 30%;
    width: initial
}

.number-group5.type3>li .txt {
    font-size: 1.6rem;
    font-weight: 500;
    line-height: 2.1rem
}

.number-group5.type3>li+li {
    margin-top: 2.4rem
}

.number-group5.type4>li {
    padding-left: 3.2rem
}

.number-group5.type4>li:before {
    width: 2rem;
    color: var(--txt-quin)
}

.number-group6 {
    counter-reset: num
}

.number-group6>.list-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: relative;
    counter-increment: num;
    background-color: var(--bg-qua);
    border-radius: 1.2rem;
    padding: 2rem 2rem 2rem 5.2rem;
    margin-bottom: 1.6rem
}

.number-group6>.list-item:last-child {
    margin-bottom: 0
}

.number-group6>.list-item:before {
    display: none
}

.number-group6>.list-item .list-text-box {
    margin-left: 1.6rem
}

.number-group6>.list-item .list-text-tit {
    font-size: 1.6rem;
    font-weight: 500;
    line-height: 2.5rem;
    color: var(--txt-pri);
    padding-bottom: .6rem
}

.number-group6>.list-item .list-text-dec {
    font-size: 1.5rem;
    font-weight: 500;
    line-height: 2rem;
    color: var(--txt-qua)
}

.number-group6 .list-num {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: absolute;
    top: 2rem;
    left: 2rem;
    width: 3.2rem;
    height: 3.2rem;
    text-align: center;
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 2.1rem;
    color: var(--txt-quin);
    border: 2px solid var(--border-quin);
    background-color: var(--bg-base);
    border-radius: 50%
}

.number-group6 :not(:has(.list-num)) .list-text-box::before {
    content: counter(num);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: absolute;
    top: 2rem;
    left: 2rem;
    width: 3.2rem;
    height: 3.2rem;
    text-align: center;
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 2.1rem;
    color: var(--txt-quin);
    border: 2px solid var(--border-quin);
    background-color: var(--bg-base);
    border-radius: 50%
}

/*! component element text step count type */

.step-count-group .count .num-tit {
    font-weight: 700
}

.step-count-group .count .txt {
    margin-top: 1.2rem
}

.step-count-group .count .img-figure {
    margin-top: 1.6rem;
    border-radius: 1rem
}

.step-count-group .count .img-figure img {
    width: 100%
}

.step-count-group .count+.count {
    margin-top: 4.8rem
}

/*! component element text bullet type line-height 가이드 반영 2023-09-05 ksy */

.bl-txt-group+.title-group {
    margin-top: 2.4rem
}

.bl-txt-group>.txt {
    position: relative;
    padding-left: 1rem;
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400
}

.bl-txt-group>.txt+.txt {
    margin-top: 1.2rem
}

.tab-content .title-group+.bl-txt-group>.txt {
    margin-top: 0.4rem
}

.bl-txt-group>.txt:before {
    position: absolute;
    left: 0;
    top: 0;
    content: '·';
    display: block;
    font-size: inherit;
    color: var(--color-grey-g1000)
}

.bl-txt-group>.txt.mid-dot {
    padding-left: 2rem
}

.bl-txt-group>.txt.mid-dot:before {
    content: '\2022';
    left: 0.5rem;
    line-height: 100%
}

.bl-txt-group>.txt>.dash-txt-group {
    margin-top: 0.8rem
}

.bl-txt-group>.txt>.dash-txt-group .txt+.txt {
    margin-top: 0.8rem
}

.bl-txt-group .txt.no-bullet {
    padding-left: 0
}

.bl-txt-group .txt.no-bullet:before {
    display: none
}

.bl-txt-group>.txt .secondary1-1 {
    color: var(--color-bu800, #0150ff)
}

:root .bl-txt-group>.txt .secondary1-1 {
    color: var(--txt-accent-sec, #4262ff)
}

.bl-txt-group>.txt .warning {
    color: var(--color-re700, #f02727)
}

.bl-txt-group>.txt.txt-lv03 {
    font-size: 1.4rem;
    line-height: 2rem
}

.bl-txt-group>.txt.txt-lv03+.txt {
    margin-top: 0.8rem
}

.card-group.bg-gray2 .bl-txt-group>.txt.txt-lv03+.txt {
    margin-top: 1.6rem
}

.bl-txt-group+.dash-txt-group {
    margin-top: 1.2rem;
    padding-left: 1rem
}

.bl-txt-group.darkgray1 .txt {
    color: var(--color-g800, #414141)
}

.bl-txt-group.darkgray2 .txt {
    color: var(--color-g700)
}

.bl-txt-group.txt-ter .txt {
    color: var(--txt-ter) !important
}

.bl-txt-group.red .txt {
    color: var(--color-re700, #f02727)
}

.bl-txt-group+.tit {
    margin-top: 2.4rem
}

.bl-txt-group+.txt {
    margin-top: 1.2rem
}

.bl-txt-group+.sub-txt {
    margin-top: 0.8rem
}

.bl-txt-group+.bg-number-group.small {
    margin-top: 2.4rem
}

.bl-txt-group>.txt br+.btn-under-link {
    margin-top: 0.4rem;
    display: inline-block
}

.bl-txt-group.txt-lv03 .txt {
    font-size: 1.4rem
}

.bl-txt-group.txt-lv03 .dash-txt-group .txt {
    font-size: 1.4rem
}

.text-list-group ul.bl-txt-group.bu-ty2 {
    margin-top: 1.2rem
}

.bl-txt-group.bu-ty2>.txt {
    color: var(--color-g700);
    font-size: 1.4rem;
    line-height: 2rem
}

.bl-txt-group.bu-ty2>.txt:before {
    content: '*'
}

.bl-txt-group.bu-ty2 .txt+.txt {
    margin-top: .4rem
}

.bl-txt-group.bu-ty3>.txt {
    margin-top: 0
}

.component-list .bg-number-group.bg-ter .count .num-tit {
    padding-top: 0
}

.component-list .bg-number-group.bg-ter .count:before {
    background-color: var(--bg-ter);
    color: var(--txt-accent-sec)
}

.component-list .bg-number-group.bg-ter .count:after {
    background: var(--border-quin)
}

.component-list .bg-number-group.bg-ter .count:last-of-type:after {
    position: absolute;
    left: 1.2rem;
    top: 0;
    content: "";
    width: 0.1rem;
    display: block;
    bottom: 0
}

.component-list .bg-number-group.bg-ter .count .txt {
    color: var(--txt-qua);
    font-size: 1.5rem;
    margin-top: 0.8rem;
    padding-top: 0
}

.bl-txt-group.bu-ty4>.txt {
    color: var(--color-g700);
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    padding-left: 1.3rem
}

.bl-txt-group.bu-ty4>.txt:before {
    content: '※'
}

.bl-txt-group.bu-ty5 {
    margin-top: 2.4rem
}

.bl-txt-group.bu-ty5 .txt {
    font-size: 1.6rem;
    line-height: 2.8rem;
    font-weight: 400;
    color: var(--txt-sec)
}

.bl-txt-group.gray3>.txt {
    color: var(--color-g400)
}

.bl-txt-group.gray3>.txt:before {
    color: var(--color-g400)
}

.dsr-txt-sub .bl-txt-group .txt {
    font-size: 1.6rem;
    line-height: 2.1rem;
    color: var(--color-grey-g900)
}

.bl-txt-group.fs14 .txt {
    font-size: 1.4rem
}

.bl-txt-group.fs14 .txt+.txt {
    margin-top: 0.8rem
}

.bl-txt-group.ai-card-bl-txt>.txt {
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 2.3rem;
    color: var(--txt-pri);
    margin-top: 0
}

.bl-txt-group.type01 {
    margin-top: 1.6rem;
    border-radius: 1.6rem;
    padding: 2rem;
    background: var(--bg-qua)
}

.bl-txt-group.pre-wrap>.txt {
    white-space: pre-wrap
}

.bl-txt-group.pre-wrap>.txt::before {
    display: none
}

.bl-txt-group.type02 .txt {
    color: var(--txt-ter)
}

.bl-txt-group.type02>.txt+.txt {
    margin-top: .8rem
}

.bl-txt-group.txt-lv01>.txt {
    line-height: 2rem
}

.bl-txt-group.txt-lv01>.txt:before {
    top: -0.15rem
}

/*! component element text dash type line-height 가이드 반영 2023-09-05 ksy */

.dash-txt-group .txt {
    position: relative;
    padding-left: 1.2rem;
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400
}

.dash-txt-group .txt:before {
    position: absolute;
    left: 0;
    top: 0;
    content: '-';
    display: block;
    font-size: inherit
}

.dash-txt-group+.bl-txt-group {
    margin-top: 1.2rem
}

.dash-txt-group.txt-lv03 .txt {
    font-size: 1.4rem;
    line-height: 2rem
}

.dash-txt-group.txt-lv03 .txt+.txt {
    margin-top: 0.8rem
}

.dash-txt-group.txt-lv04 {
    margin-top: 0.4rem !important
}

.dash-txt-group.txt-lv04 .txt {
    font-size: 1.2rem !important;
    line-height: 1.6rem !important;
    margin-top: 0.4rem !important;
    color: var(--txt-ter) !important
}

.dash-txt-group.txt-lv04 .txt+.txt {
    margin-top: 0.4rem !important
}

/*! component element text square type line-height 가이드 반영 2023-09-05 ksy */

.square-txt-group>.txt {
    position: relative;
    padding-left: 1.9rem;
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400
}

.square-txt-group>.txt:before {
    position: absolute;
    left: 0;
    top: 0;
    content: '■';
    display: block;
    font-size: inherit
}

.square-txt-group>.txt .dash-txt-group {
    margin-top: 0.8rem
}

.txt-group .txt>.square-txt-group {
    margin-top: 2.8rem
}

/*! component element text Single type */

.tit-simple-group .tit-01 {
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: bold
}

.tit-simple-group .tit-02 {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: bold
}

.tit-simple-group+.list-infobox-group {
    margin-top: 1.6rem
}

/*! component element text Single type */

.text-simple-group .tit {
    font-size: 2.4rem;
    line-height: 3.3rem;
    font-weight: bold
}

.text-simple-group .txt {
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 400
}

.text-simple-group .txt-caption {
    margin-top: 4.8rem;
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: bold
}

.text-simple-group .txt-lv03.center,
.text-simple-group .txt-lv04.center {
    text-align: center
}

.text-simple-group .txt-lv03 .ico-help,
.text-simple-group .txt-lv04 .ico-help {
    position: relative;
    top: -0.1rem
}

.text-simple-group .txt-lv03 .underline,
.text-simple-group .txt-lv04 .underline {
    margin-left: 0.4rem
}

.text-simple-group.align-box-center {
    text-align: center;
    padding: 8rem 0
}

.text-simple-group.align-box-center .txt-lv01+.btn-under-link {
    display: inline-block;
    margin-top: 1.6rem
}

.text-simple-group+.btn-under-link {
    display: inline-block;
    margin-top: 2.4rem
}

.text-simple-group+.center-btn-group {
    margin-top: 2.4rem
}

.text-simple-group.align-box-center.type1 {
    position: relative;
    margin: 2.4rem 0;
    padding: 0
}

.text-simple-group.align-box-center.type1::before {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 1px;
    background-color: var(--border-qua);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

.text-simple-group.align-box-center.type1 .txt-lv03 {
    display: inline-block;
    position: relative;
    z-index: 2;
    padding: 0 1.6rem;
    font-weight: 500;
    background-color: var(--bg-base);
    color: var(--txt-quin)
}

/*! component element text complex type */

.prodname-group+.text-list-group2 {
    margin-top: 4.8rem
}

.prodname-link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.prodname-link .prodname-logo+.prodname-area {
    margin: 0 1.6rem
}

.prodname-area.card-area {
    -ms-flex-preferred-size: calc(100% - 1.6rem);
    flex-basis: calc(100% - 1.6rem)
}

.prodname-link .ico-arrow-sbr {
    margin-left: auto;
    width: 1.6rem;
    height: 1.6rem
}

.prodname-tit {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.prodname-tit .prodname-tit-field {
    font-size: 2.4rem;
    line-height: 3.2rem;
    font-weight: bold
}

.prodname-tit .prodname-tit-field.type01 {
    line-height: 3.2rem
}

.prodname-tit .prodname-tit-field .highlight-txt {
    display: inline-block;
    line-height: inherit;
    -webkit-box-shadow: inset 0 -1.7rem 0 var(--color-bu50, #e0f2ff);
    box-shadow: inset 0 -1.7rem 0 var(--color-bu50, #e0f2ff)
}

.prodname-tit .tag {
    margin-left: 0.4rem
}

.prodname-tit-wide .prodname-tit-field {
    text-align: right;
    font-size: 2.4rem;
    line-height: 3.2rem;
    font-weight: bold;
    margin-top: 0.4rem
}

.prodname-tit .prodname-link-edit {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 3rem;
    height: 3rem
}

.prodname-tit .prodname-link-edit .ico-edit {
    width: 2rem;
    height: 2rem
}

.prodname-tit+.prodname-txt,
.prodname-tit+.prodtag-txt {
    margin-top: 0.4rem
}

.prodname-tit>.ico-circle-wrap {
    margin-right: 1.4rem
}

.prodname-tit>.ico-circle-wrap~.tag {
    margin-left: 1.2rem
}

.prodname-tit.column {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.prodname-tit.column>.ico-circle-wrap {
    margin-right: 0;
    margin-bottom: 1.2rem
}

.prodname-txt {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: var(--color-g700)
}

.prodname-txt .txt {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400
}

.prodname-txt .prodname-link-edit {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    padding-left: 0.4rem
}

.prodname-txt .prodname-link-edit .ico-edit {
    -webkit-filter: var(--filter-g800);
    filter: var(--filter-g800)
}

.prodtag-txt {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.prodtag-txt .tag+.tag {
    margin-left: 0.4rem
}

.prodname-info {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 0.8rem
}

.prodname-sum {
    margin-top: 0.4rem;
    font-size: 2.4rem;
    line-height: 3.2rem;
    font-weight: bold
}

.prodname-sum.cancel {
    text-decoration: line-through
}

/*! component element text - title icon type */

.text-icon-group {
    text-align: center
}

.text-icon-group.left {
    text-align: left
}

.text-icon-group .tit {
    margin-top: 3.2rem;
    font-size: 2.1rem;
    line-height: 2.7rem;
    font-weight: bold
}

:root .text-icon-group .tit {
    font-size: 2.1rem;
    color: var(--txt-pri)
}

.flex-colume-top .text-icon-group .tit {
    font-size: 2.2rem;
    line-height: 3.1rem
}

.text-icon-group .txt {
    margin-top: 1.6rem;
    font-size: 1.6rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--txt-ter)
}

.text-icon-group .txt+.btn-group.center {
    margin-top: 0.8rem
}

.text-icon-group .img {
    display: block;
    margin: 0 auto;
    width: 6.8rem;
    height: 6.8rem;
    background-color: var(--color-pb100, #000)
}

.text-icon-group .link {
    text-decoration: underline
}

.text-icon-group .btn-under-link {
    display: inline-block;
    margin-top: 1.6rem
}

.text-icon-group .btn-under-link.no-space {
    margin: 0
}

.text-icon-group.version .tit {
    font-size: 2.1rem;
    line-height: 2.7rem;
    margin-bottom: 1.6rem
}

.text-icon-group.version .txt {
    margin-top: 0;
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g700)
}

.text-icon-group.outlink .text-outlink-group {
    font-size: 0;
    text-align: center;
    margin-top: 3.6rem
}

.text-icon-group.outlink .text-outlink-group .outlink-item {
    display: inline-block;
    font-size: 1.2rem;
    line-height: 1.6rem;
    font-weight: 400;
    color: var(--color-g600, #9b9b9b)
}

.text-icon-group.outlink .text-outlink-group .outlink-item:before {
    display: inline-block;
    position: relative;
    top: 0.2rem;
    content: '';
    width: 1px;
    height: 1.2rem;
    margin: 0 0.4rem;
    background-color: var(--color-g600, #9b9b9b)
}

.text-icon-group.outlink .text-outlink-group .outlink-item:first-child:before {
    display: none
}

.text-icon-group.transfer .text-icon-area {
    margin-top: 1.6rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.address-profile {
    border-radius: 50%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.text-icon-group.transfer .text-icon-area .address-profile {
    width: 5.2rem;
    height: 5.2rem;
    background-color: var(--color-in50, #efefff);
    font-style: normal;
    line-height: 1.6rem
}

.text-icon-group.transfer .text-icon-area .ico-transfer {
    margin: 0 1rem
}

.text-icon-group.transfer .text-icon-area .card-img-group {
    width: 10rem;
    margin-left: 0;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.text-icon-group.transfer .text-icon-area .card-img-group+.ico-transfer-animation {
    width: 3rem
}

.text-icon-group.transfer .text-icon-area .ico-transfer-animation+.card-img-group {
    width: 8rem
}

.text-icon-group.transfer.ty01 {
    margin-top: 1.6rem
}

.text-icon-group.transfer.ty01 .text-icon-area .card-img-group {
    width: auto;
    padding: 0 .5rem
}

.text-icon-group.transfer.ty01 .text-icon-area .ico-transfer-animation+.card-img-group {
    width: auto
}

.text-icon-group.transfer .tit {
    font-size: 0
}

.text-icon-group.transfer .tit+.tit {
    margin-top: 0
}

.text-icon-group.transfer .tit .tooltip-focus-group {
    max-width: 80%;
    vertical-align: top
}

.text-icon-group.transfer .tit .tooltip-focus-group .txt {
    margin-top: 0
}

.text-icon-group.transfer .tit .name {
    font-size: 2.2rem;
    line-height: 3.1rem;
    font-weight: bold;
    width: 100%;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: inline-block;
    vertical-align: top
}

.text-icon-group.transfer .tit .price {
    font-size: 2.2rem;
    line-height: 3.1rem;
    font-weight: bold
}

.text-icon-group.transfer .tit .desc {
    font-size: 2.2rem;
    line-height: 3.1rem;
    font-weight: bold
}

.text-icon-group.transfer .txt {
    margin-top: 0.8rem;
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g700)
}

.text-icon-group.transfer .txt.error {
    color: var(--color-re700, #f02727)
}

.text-icon-group .box-info {
    margin-top: 1.6rem;
    background: var(--color-g100, #f8f8f8);
    border-radius: 1.2rem;
    padding: 1.2rem 2rem
}

.text-icon-group .box-info .txt-01 {
    font-size: 1.8rem
}

.text-icon-group .box-info .txt-lv01+.txt-01 {
    margin-top: 0.4rem
}

.text-icon-group .box-info .txt-lv03 {
    color: var(--color-g700)
}

.text-icon-group .box-info .txt-lv03.black {
    color: var(--color-g900, #141414)
}

.text-icon-group .box-info .tit-info {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g700);
    margin-bottom: 0.8rem
}

.text-icon-group .box-info .txt-info {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: bold;
    color: var(--color-pn, #17008c)
}

.text-icon-group .box-info .txt-info strong {
    font-weight: bold
}

.text-icon-group .box-info .ico-phone {
    width: 2rem;
    height: 2rem;
    margin-right: 0.4rem
}

.text-icon-group .ico-connectiong {
    left: 0
}

.text-icon-group .ico-group {
    height: 6.4rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.text-icon-group .ico-group .ico-connectiong,
.text-icon-group .ico-group .ico-connectiong:after,
.text-icon-group .ico-group .ico-connectiong:before {
    margin: 0;
    border-radius: 50%
}

.text-icon-group+.btn-group {
    margin-top: 3.2rem
}

.text-icon-group.loan-fail .box-info {
    margin-top: 6rem
}

.tab-content .text-icon-group {
    margin-top: 5.6rem
}

.text-icon-group.exchange {
    margin-top: 8rem
}

.text-icon-group.exchange>i {
    width: 5.6rem;
    height: 5.6rem
}

.text-icon-group.exchange .txt {
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: 500;
    color: var(--color-g700, #4d596f)
}

.text-icon-group.exchange .tit {
    margin-top: 1rem;
    font-size: 2.6rem;
    line-height: 3.4rem
}

.scourt-connectiong {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.scourt-connectiong .scourt-loading-wrap {
    position: relative;
    width: 12.4rem;
    height: 12rem;
    background: url("../../img/mmk/common/mjoin_sc_grey.png") bottom center no-repeat;
    background-size: contain;
    margin: -4.5rem 0 0.8rem
}

.scourt-connectiong .scourt-loading-wrap .scourt-loading-obj {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 12.4rem;
    height: 12rem;
    background: url("../../img/mmk/common/mjoin_sc_color.png") bottom center no-repeat;
    background-size: auto 12rem
}

.scourt-connectiong .img-title1 {
    width: 16rem
}

.scourt-connectiong .img-title2 {
    width: 6.4rem
}

.text-icon-group.boss-fail .tit {
    margin-top: 4rem
}

.text-icon-group.boss-fail .tit .secondary1-1 {
    color: var(--txt-accent-sec)
}

.text-icon-group.boss-fail .box-info {
    margin-top: 4rem
}

.text-icon-group.boss-fail .bl-txt-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.text-icon-group.boss-fail .bl-txt-group>.txt {
    margin-top: 1rem
}

.text-icon-group.boss-fail .bl-txt-group>.txt+.txt {
    margin-top: 0
}

.component-text-icon.loading-type {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.component-text-icon.loading-type .text-icon-group {
    margin-top: 0
}

.component-text-icon.loading-type .text-icon-group>i {
    margin-top: 0
}

.text-icon-group.shopping .tit {
    font-size: 2.4rem;
    line-height: 3.3rem
}

.text-icon-group.shopping .tit .secondary1-3 {
    color: var(--txt-accent-sec)
}

.text-icon-group.shopping .tit .ico-money-point {
    width: 2.6rem;
    height: 2.6rem;
    margin-top: -0.4rem;
    margin-right: 0.2rem
}

.text-icon-group.type01 .box-info {
    margin-top: 1.6rem;
    padding: 2rem
}

.text-icon-group.type01 .box-info .txt-info {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.text-icon-group.type01 .box-info .txt-info .txt {
    text-align: left;
    margin-left: .8rem;
    margin-top: 0;
    font-size: 1.5rem;
    font-weight: 500;
    line-height: 2rem;
    color: var(--txt-sec)
}

.text-icon-group.type01 .box-info .row+.row {
    margin-top: .8rem
}

.component-text-icon.loading-type.paybook .logo {
    width: 4.5rem
}

.component-text-icon.loading-type.paybook .logo>img {
    width: 100%
}

.component-text-icon.loading-type.paybook .text-icon-group .tit {
    font-size: 2.4rem;
    line-height: 3.3rem;
    margin-top: 1.2rem
}

.component-text-icon.loading-type.paybook .loading-box {
    width: 3.4rem;
    margin: 3.6rem auto
}

.cashback-content-group .text-icon-group .txt-state {
    margin-top: 1.6rem;
    padding-bottom: 0.8rem;
    font-size: 1.5rem;
    font-weight: 500;
    line-height: 2rem;
    color: var(--txt-accent-sec)
}

.cashback-content-group .text-icon-group {
    margin: 1.2rem 0 4rem
}

.cashback-content-group .text-icon-group [class^="ico-"] {
    width: 20rem;
    height: 20rem
}

.cashback-content-group .text-icon-group .txt {
    margin: 0;
    padding: 0.8rem 0 2.4rem
}

.cashback-content-group .text-icon-group .tag {
    display: none
}

.cashback-content-group .text-icon-group .tag.show {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex
}

.cashback-content-group .text-icon-group .tag.neutral {
    background: var(--bg-sec-neutral)
}

.cashback-content-group .text-icon-group .tag.neutral .txt {
    padding: 0;
    color: var(--txt-pri-neutral);
    font-size: 1.1rem;
    line-height: 100%
}

.cashback-content-group .cashback-rolling-img {
    overflow: hidden;
    position: relative;
    width: 20rem;
    height: 20rem;
    margin: 0 auto
}

.cashback-content-group .cashback-rolling-img .rolling-item img {
    width: 100%
}

.cashback-content-group .top-gradient {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 10;
    width: 100%;
    height: 2rem;
    background: -webkit-gradient(linear, left top, left bottom, from(var(--color-w100)), to(transparent));
    background: -o-linear-gradient(top, var(--color-w100), transparent);
    background: linear-gradient(to bottom, var(--color-w100), transparent)
}

.cashback-content-group .bottom-gradient {
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: 10;
    width: 100%;
    height: 2rem;
    background: -webkit-gradient(linear, left bottom, left top, from(var(--color-w100)), to(transparent));
    background: -o-linear-gradient(bottom, var(--color-w100), transparent);
    background: linear-gradient(to top, var(--color-w100), transparent)
}

.container-component.bg-gradient-sky2.show .bottom-gradient,
.container-component.bg-gradient-sky2.show .top-gradient {
    display: none
}

.cashback-content-group .rolling-txt-inner {
    overflow: hidden;
    position: relative;
    height: 3.3rem
}

.cashback-content-group .cashback-rolling-txt>li {
    font-size: 2.4rem;
    font-weight: 700;
    line-height: 3.3rem;
    text-align: center
}

.cashback-content-group .cashback-content .text-icon-group {
    margin-top: -4rem
}

.cashback-content-group .cashback-content {
    display: none
}

.cashback-content-group .cashback-content.show {
    display: block
}

.cashback-content-group .cashback-content.show .component-btn.fixed-bottom,
.cashback-content-group .cashback-content.show .component-list,
.cashback-content-group .cashback-content.show .component-text-list,
.container-component.bg-gradient-sky2.show::before {
    opacity: 0;
    -webkit-animation: cashback-cont-show .6s ease-out forwards;
    animation: cashback-cont-show .6s ease-out forwards;
    -webkit-animation-delay: .5s;
    animation-delay: .5s
}

@-webkit-keyframes cashback-cont-show {
    100% {
        opacity: 1
    }
    50% {
        opacity: .7
    }
    0% {
        opacity: 0
    }
}

@keyframes cashback-cont-show {
    100% {
        opacity: 1
    }
    50% {
        opacity: .7
    }
    0% {
        opacity: 0
    }
}

.component-text-icon.ai-live {
    display: none
}

.component-text-icon.ai-live .title-group.ani-up .txt {
    -webkit-animation: none;
    animation: none
}

.component-text-icon.ai-live+.component-text-icon.ai-live {
    margin-top: 2.4rem
}

.component-text-icon.ai-live .img {
    width: 14rem;
    margin: 22rem auto 0
}

.component-text-icon.ai-live .img img {
    width: 100%
}

.component-text-icon.ai-live.active {
    display: block;
    margin-top: 2.4rem
}

.component-text-icon.ai-live.active .title-group.ani-up .txt {
    -webkit-animation: title-ani-up 0.6s ease forwards;
    animation: title-ani-up 0.6s ease forwards
}

.component-text-icon.ai-live.active .img {
    opacity: 0;
    -webkit-animation: live-img-up 0.3s ease-in-out forwards;
    animation: live-img-up 0.3s ease-in-out forwards
}

.component-text-icon.ai-live.active .img.type1 {
    width: 22.1rem;
    margin-top: 21rem;
    opacity: 1;
    -webkit-animation: none;
    animation: none
}

.component-text-icon.quiz-result .img {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-top: 10.7rem;
    height: 18.6rem
}

.component-text-icon.quiz-result .img img {
    height: 16rem
}

.component-text-icon.quiz-result .img.type1 img {
    height: 16rem
}

.component-text-icon.quiz-result .result-confetti {
    position: absolute;
    top: 0;
    right: -.3rem;
    height: auto;
    z-index: 1
}

.component-text-icon.hv100 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    margin-top: 0
}

.component-text-icon.hv100 .loading-box {
    width: 3.4rem;
    margin: 3.6rem auto 0
}

.component-text-icon.hv100 .text-icon-group {
    margin-top: 0
}

.component-text-icon.hv100 .text-icon-group .txt-lv08 {
    line-height: 3.3rem
}

.component-text-icon.hv100 .text-icon-group .txt-lv05 {
    line-height: 2.5rem
}

.component-text-icon.hv100 .ico-group img {
    width: 6.4rem
}

.text-icon-group.ai-live-type1 {
    padding-bottom: 3.2rem
}

.text-icon-group.ai-live-type1>.txt {
    margin: 0;
    font-size: 1.5rem;
    color: var(--txt-sec-invert)
}

.text-icon-group.ai-live-type1>.tit {
    margin: 1.2rem 0;
    font-size: 2.8rem;
    line-height: 3.6rem;
    color: var(--color-w100)
}

.text-icon-group.ai-live-type1 .icon-area {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 9.5rem;
    height: 3.7rem;
    margin: 3.2rem auto 0;
    border-radius: 99rem;
    border: 1px solid transparent;
    background: var(--bg-dim);
    opacity: 0.38
}

.text-icon-group.ai-live-type1 .icon-area .txt {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 0.8rem;
    margin-top: 0;
    line-height: 2.1rem;
    color: var(--txt-pri-invert)
}

.text-icon-group.ai-live-type1 .icon-area .txt::before {
    content: "";
    display: block;
    width: 0.8rem;
    height: .8rem;
    border-radius: 100%;
    background-color: var(--ico-pri-invert)
}

.text-icon-group.ai-live-type1 .icon-area.on {
    background: -webkit-gradient(linear, left top, left bottom, from(var(--bg-base-invert)), to(var(--bg-base-invert))), -webkit-gradient(linear, left top, right top, from(#00e0ff), to(#ff773c));
    background: -o-linear-gradient(var(--bg-base-invert), var(--bg-base-invert)), -o-linear-gradient(left, #00e0ff, #ff773c);
    background: linear-gradient(var(--bg-base-invert), var(--bg-base-invert)), linear-gradient(to right, #00e0ff, #ff773c);
    background-origin: border-box;
    background-clip: content-box, border-box;
    opacity: 1
}

.text-icon-group.ai-live-type1 .icon-area.on .txt::before {
    background-color: var(--ico-pri-mark);
    -webkit-animation: onair-mark1 0.8s ease-in-out 1ms, onair-mark2 1.5s ease-in-out 1ms;
    animation: onair-mark1 0.8s ease-in-out 1ms, onair-mark2 1.5s ease-in-out 1ms;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite
}

.text-icon-group.ai-live-type2 .txt {
    margin-top: 0;
    color: var(--txt-pri-invert)
}

.text-icon-group.ai-live-type2 .tit {
    margin-top: 0;
    padding: 0.4rem 0;
    font-size: 3.2rem;
    line-height: 4.2rem;
    font-weight: 700;
    background: -webkit-gradient(linear, left top, right top, color-stop(20%, var(--bg-base)), color-stop(40%, #ffd436), color-stop(60%, #ffd436), color-stop(80%, var(--bg-base)));
    background: -o-linear-gradient(left, var(--bg-base) 20%, #ffd436 40%, #ffd436 60%, var(--bg-base) 80%);
    background: linear-gradient(to right, var(--bg-base) 20%, #ffd436 40%, #ffd436 60%, var(--bg-base) 80%);
    background-size: 200% auto;
    color: var(--color-pb100);
    background-clip: text;
    text-fill-color: transparent;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    -webkit-animation: shine-txt 3s linear infinite;
    animation: shine-txt 3s linear infinite
}

.text-icon-group.ai-live-type2 .img {
    width: 14rem;
    height: 14rem;
    margin: 1.4rem auto 0;
    background: transparent
}

.text-icon-group.ai-live-type2 .img img {
    width: 100%
}

.text-icon-group.ai-live-type3 {
    margin-top: 5.6rem
}

.text-icon-group.ai-live-type3>.tit {
    margin: 0.8rem 0;
    font-size: 2.6rem;
    line-height: 3.4rem;
    color: var(--txt-pri-invert)
}

.text-icon-group.ai-live-type3 .txt-lv01 {
    margin-top: 0;
    color: var(--txt-pri-down)
}

.text-icon-group.ai-live-type3 .txt {
    font-size: 1.6rem;
    line-height: 2.1rem;
    color: var(--txt-sec-invert)
}

.text-icon-group.ai-live-type3 .img {
    width: 24.5rem;
    height: 24.5rem;
    margin: 1rem auto -1.4rem;
    background: transparent
}

.text-icon-group.ai-live-type3 .img img {
    width: 100%
}

.text-icon-group.ai-live-type3 .btn-lv02 .txt {
    margin-top: 0;
    font-size: 1.6rem;
    font-weight: 500
}

@-webkit-keyframes live-img-up {
    0% {
        opacity: 0
    }
    100% {
        opacity: 1
    }
}

@keyframes live-img-up {
    0% {
        opacity: 0
    }
    100% {
        opacity: 1
    }
}

@-webkit-keyframes onair-mark1 {
    0% {
        opacity: 0
    }
    100% {
        opacity: 1
    }
}

@keyframes onair-mark1 {
    0% {
        opacity: 0
    }
    100% {
        opacity: 1
    }
}

@-webkit-keyframes onair-mark2 {
    0% {
        opacity: 1
    }
    100% {
        opacity: 0
    }
}

@keyframes onair-mark2 {
    0% {
        opacity: 1
    }
    100% {
        opacity: 0
    }
}

@-webkit-keyframes shine-txt {
    to {
        background-position: 200% center
    }
}

@keyframes shine-txt {
    to {
        background-position: 200% center
    }
}

.text-icon-group.ai-live-type4 {
    margin-top: 2.4rem;
    padding: 2rem;
    border: 1px solid var(--border-qua);
    border-radius: 2rem
}

.text-icon-group.ai-live-type4 .icon-area {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 9.6rem;
    height: 9.6rem;
    margin: 0 auto;
    border-radius: 100%;
    background-color: var(--ico-base)
}

.text-icon-group.ai-live-type4 .icon-area img {
    height: 6.4rem
}

.text-icon-group.ai-live-type4 .txt {
    margin-top: 0
}

.text-icon-group.ai-live-type4 .icon-area {
    margin: 1.2rem auto
}

.text-icon-group.ai-live-type4 .tit {
    margin-top: 0;
    font-size: 2.4rem;
    font-weight: 700;
    line-height: 3.2rem;
    color: var(--txt-accent-sec)
}

.text-icon-group.ai-live-type4.fail .tit {
    color: var(--txt-pri-error)
}

.text-icon-group.ai-live-type4.no-join .tit {
    color: var(--txt-quin)
}

.text-icon-group.ai-live-type5 {
    position: relative;
    z-index: 1;
    margin-top: 0;
    padding: 7.2rem 0 1.6rem
}

.text-icon-group.ai-live-type5 .img {
    width: 10.4rem;
    height: 10.4rem;
    background-color: transparent
}

.text-icon-group.ai-live-type5 .tit {
    margin-top: 1.6rem
}

.text-icon-group.ai-live-type6 {
    padding: 4rem 0 1.6rem
}

.text-icon-group.ai-live-type6 .img {
    width: 12rem;
    height: 12rem;
    background-color: transparent
}

.text-icon-group.ai-live-type7 {
    margin-top: 0
}

.section-component.type3 .text-icon-group.ai-live-type3>.tit {
    color: var(--color-g900)
}

.section-component.type3 .text-icon-group.ai-live-type3 .img {
    width: 18.2rem;
    height: 14.8rem;
    margin: 5.8rem auto 3.4rem
}

.text-icon-group.alert .alert-icon {
    width: 6.4rem;
    height: 6.4rem
}

.text-icon-group.life-bankbook {
    padding: 3.2rem 0
}

.text-icon-group.life-bankbook .tit {
    font-size: 2.4rem;
    font-weight: 700;
    line-height: 3.2rem;
    color: var(--txt-sec)
}

.text-icon-group.life-bankbook .txt01 {
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 2rem;
    color: var(--txt-accent-sec)
}

.text-icon-group.life-bankbook .txt02 {
    font-size: 1.4rem;
    font-weight: 500;
    line-height: 2rem;
    color: var(--txt-sec)
}

/*! component element text - title number type */

.text-num-group .number {
    color: var(--color-pl, #b6f23d);
    font-size: 6.6rem;
    line-height: 1;
    font-weight: 700
}

.text-num-group .tit {
    margin-top: 2.4rem;
    font-size: 2.4rem;
    line-height: 3.2rem;
    font-weight: bold
}

.text-num-group .tit.type2 {
    font-size: 2.1rem;
    line-height: 2.7rem
}

.text-num-group .txt {
    margin-top: 1.6rem;
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g700)
}

.text-num-group .txt.type2 {
    font-size: 1.6rem;
    line-height: 2.1rem
}

.text-num-group .time-area {
    margin-top: 4rem
}

.text-num-group .time-area+.time-area {
    margin-top: 2.4rem
}

.text-num-group .time-txt {
    font-size: 1.4rem;
    font-weight: 400;
    color: var(--color-g900, #141414)
}

.text-num-group .time-txt .ico-info {
    width: 1.8rem;
    height: 1.8rem
}

.text-num-group .time-number {
    margin-top: 0.4rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    font-size: 4rem;
    line-height: 1;
    color: var(--color-pl, #b6f23d);
    font-weight: 700
}

.text-num-group .time-number .time-num:nth-child(2) {
    margin-right: 0.8rem
}

.text-num-group.type01 .time-txt {
    color: var(--txt-sec)
}

.text-num-group.type01 .time-number {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-size: 4.4rem;
    line-height: 4.4rem
}

/*! component element text list type 확인해주세요 타입 */

.text-list-group .tit-icon {
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: bold
}

.text-list-group .tit-icon [class*="ico-"] {
    width: 2.4rem;
    height: 2.4rem;
    margin: -0.2rem 0.5rem 0 0
}

.text-list-group .title-group {
    margin-top: 2.4rem
}

.text-list-group .title-group:first-child {
    margin-top: 0
}

.text-list-group .txt {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g700)
}

.text-list-group .txt.secondary1-1 {
    color: var(--color-bu900, #003fc7)
}

.text-list-group .txt+.txt {
    margin-top: 0.8rem
}

.text-list-group .txt+.txt-link {
    margin-top: 0.4rem
}

.text-list-group .txt+.bl-txt-group {
    margin-top: 0.8rem
}

.text-list-group .txt .btn-under-link.block {
    margin-top: 0.4rem
}

.text-list-group .sub-depth {
    padding-left: 1.2rem
}

.text-list-group .sub-depth+.txt {
    margin-top: 0.8rem
}

.text-list-group .dash-txt-group {
    margin-top: 0.8rem
}

.text-list-group .txt-normal {
    margin-top: 0.8rem;
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g700)
}

.text-list-group .txt-normal+.txt-normal {
    margin-top: 0.8rem
}

.text-list-group .btn-arrow {
    margin-top: 0.8rem
}

.text-list-group .table-layout-group {
    margin-top: 2.4rem
}

.text-list-group .tit-icon+.bl-txt-group {
    margin-top: 1.2rem
}

.text-list-group .bl-txt-group .dash-txt-group .txt,
.text-list-group .bl-txt-group .dash-txt-group .txt:before {
    color: var(--txt-qua)
}

.text-list-group .sub-depth .txt {
    position: relative;
    margin-top: 0;
    padding-left: 1rem
}

.text-list-group .sub-depth .txt:before {
    position: absolute;
    left: 0;
    top: 0;
    content: '·';
    display: block;
    font-size: inherit
}

.text-list-group .sub-depth2 {
    margin-top: 0.8rem;
    padding-left: 0.4rem
}

.text-list-group .sub-depth2 .txt.no-bullet {
    padding-left: 0
}

.text-list-group .sub-depth2 .txt.no-bullet:before {
    display: none
}

/*! component element text list type2 본문컨텐츠 */

.text-list-group2 .tit {
    margin-bottom: 1.6rem;
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: bold
}

.text-list-group2 .tit+.small-tit {
    margin: 1.6rem 0
}

.text-list-group2 .tit-group+.small-tit {
    margin: 2.4rem 0 1.6rem
}

.text-list-group2 .tit-group+.list-infobox-group.noline {
    margin-top: 2.4rem
}

.text-list-group2 .small-tit {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    margin: 3.2rem 0 1.6rem;
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: bold
}

.text-list-group2 .small-tit+.small-tit {
    margin-top: 1.6rem
}

.text-list-group2 .small-tit .txt-caption {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g700)
}

.text-list-group2 .tit-group2 .tit-01 {
    font-size: 2.1rem;
    line-height: 2.6rem;
    font-weight: bold
}

.text-list-group2 .tit-group2 .tit-01+.txt {
    margin-top: 1.6rem
}

.text-list-group2 .tit-group2+.small-tit {
    margin-top: 6.8rem
}

.text-list-group2 .txt {
    color: var(--color-g800, #414141);
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400;
    word-break: keep-all
}

.text-list-group2 .txt+.txt {
    margin-top: 1.6rem
}

.text-list-group2 .card-group {
    margin-top: 1.6rem
}

.text-list-group2 .card-group+.tit {
    margin-top: 4.8rem
}

.text-list-group2 .btn-group {
    color: var(--color-g800, #414141);
    margin-top: 1.6rem
}

.text-list-group2 .txt-sub {
    margin-top: 0.8rem;
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g700)
}

.text-list-group2 .txt-sub+.tit {
    margin-top: 4.8rem
}

.text-list-group2 .bl-txt-group+.tit,
.text-list-group2 .txt+.tit {
    margin-top: 4.8rem
}

.text-list-group2 .txt+.bl-txt-group {
    margin-top: 1.6rem
}

.text-list-group2 .bl-txt-group+.txt {
    margin-top: 1.2rem
}

.text-list-group2 .bl-txt-group .txt+.txt {
    margin-top: 1.2rem
}

.text-list-group2 .bl-txt-group .sub-depth {
    margin-top: 0.8rem;
    padding-left: 1.2rem
}

.text-list-group2 .depth2 .txt {
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 400;
    margin-top: 0.8rem;
    position: relative;
    padding-left: 1.2rem
}

.text-list-group2 .depth2 .txt+.txt {
    margin-top: 0.8rem
}

.text-list-group2 .depth2 .txt::before,
.text-list-group3 .depth2 .txt::before {
    position: absolute;
    left: 0;
    top: 0;
    content: '-';
    display: block;
    font-size: inherit
}

.text-list-group2 .depth2.darkgray2 .txt {
    color: var(--color-g700)
}

.text-list-group2 .depth2.secondary1-1 .txt {
    color: var(--color-bu800, #0150ff)
}

.text-list-group2+.table-layout-group {
    margin-top: 1.6rem
}

.text-list-group2+.bg-number-group {
    margin-top: 2.4rem
}

.text-list-group2+.form-group {
    margin-top: 1.6rem
}

.text-list-group2+.form-group.no-top-space {
    margin-top: 0
}

.text-list-group2+.agreement-group3 {
    margin-top: 1.6rem
}

.text-list-group2+.text-list-group2 {
    margin-top: 4.8rem
}

.text-list-group2+.btn-group {
    margin-top: 2.4rem
}

.text-list-group2 .tit-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    margin-bottom: 1.6rem
}

.text-list-group2 .tit-group .tit {
    margin-bottom: 0
}

.text-list-group2 .txt-group {
    margin-top: 8rem
}

.text-list-group2 .txt-group .txt-lv03 {
    margin-bottom: 0.8rem;
    color: var(--color-g700)
}

.text-list-group2 .txt-group .btn-arrow .txt-lv03 {
    margin-bottom: 0
}

.text-list-group2 .txt-group .btn-arrow .txt-lv03+.txt-lv03 {
    margin-left: 0.8rem
}

.text-list-group2 .txt-group .primary1 {
    color: var(--color-g900, #141414)
}

.text-list-group2 .txt-group.align-center {
    text-align: center
}

.text-list-group2 .dash-txt-group .txt+.txt {
    margin-top: 1.2rem
}

.text-list-group2 .txt-guide {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    margin-top: 1.2rem;
    color: var(--color-g700)
}

.text-list-group2 .txt-guide .txt-sub {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    margin-top: 0;
    color: var(--color-g700)
}

.text-list-group2 .sub-box {
    margin-top: 0.8rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    background: var(--color-g100, #f8f8f8);
    border-radius: 1rem;
    padding: 1.6rem 2rem
}

.text-list-group2 .sub-box .tit-box {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g700);
    margin-bottom: 0.5rem
}

.text-list-group2 .sub-box .txt-box {
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 400
}

.text-list-group2 .sub-box .item-box-sub {
    display: block;
    width: 100%
}

.text-list-group2 .sub-box .item-box-sub .box-sub {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.text-list-group2 .sub-box .item-box-sub .area-term {
    color: var(--color-g700)
}

.text-list-group2 .sub-box .item-box-sub .area-desc {
    color: var(--color-g900, #141414)
}

.footer-txt-group {
    margin-top: 0.8rem
}

.footer-txt-group .txt {
    color: var(--color-g700);
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400
}

.footer-txt-group .txt+.txt {
    margin-top: 0.8rem
}

.footer-txt-group .txt+.bl-txt-group {
    margin-top: 0.8rem
}

.text-list-group3 .txt {
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 2rem;
    color: var(--txt-ter)
}

.text-list-group3 .depth2 {
    margin-top: .8rem
}

.text-list-group3 .depth2 .txt {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    margin-top: 0.4rem;
    position: relative;
    padding-left: 1.2rem
}

.text-list-group2.type1 .tit {
    font-size: 2.1rem;
    line-height: 2.7rem
}

.text-list-group2.type1 .bl-txt-group+.tit,
.text-list-group2.type1 .txt+.tit {
    margin-top: 3.2rem
}

.text-list-group2.type1 .tit .num {
    color: var(--color-bu900)
}

.text-list-group2.type1 .bl-txt-group>.txt {
    font-size: 1.6rem;
    line-height: 2.1rem;
    color: var(--txt-pri)
}

.text-list-group2.type1 .bl-txt-group>.txt+.txt {
    margin-top: 1.6rem
}

.text-list-group2.type1 .bl-txt-group+.txt {
    margin-top: 1.6rem;
    color: var(--txt-pri)
}

.text-list-group2.type1 .bl-txt-group .depth2>.txt {
    color: var(--color-grey-g900)
}

.text-list-group2.type1 .bl-txt-group .sub-depth {
    padding-left: 0
}

.text-list-group2.type1 .bl-txt-group .sub-depth .txt {
    font-size: 1.5rem;
    color: var(--txt-pri);
    line-height: 2rem
}

.text-list-group2.type1 .bl-txt-group.txt-lv03>.txt {
    font-size: 1.4rem
}

.text-list-group2.type1 .bl-txt-group .depth2 .bl-txt-group .txt::before {
    position: absolute;
    left: 0;
    top: 0;
    content: '·';
    display: block;
    font-size: inherit
}

.text-list-group4 .tit {
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 2.1rem;
    color: var(--txt-pri);
    margin-bottom: .8rem
}

.text-list-group4 .bl-txt-group .txt {
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 2rem;
    color: var(--color-grey-g900);
    margin-bottom: .8rem;
    margin-top: 0
}

.text-list-group4 .bl-txt-group .txt .btn-under-link {
    color: var(--color-grey-g900)
}

.text-list-group4.bl-txt-group+.tit {
    margin-top: 3.2rem
}

.text-list-group4.border-bottom {
    padding-bottom: 2.4rem
}

.text-list-group5 .text-list {
    margin-top: 2.4rem
}

.text-list-group5 .text-list .text-list-tit {
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 2rem;
    color: var(--txt-sec)
}

.text-list-group5 .text-list .text-list-dec {
    font-size: 1.6rem;
    font-weight: 400;
    line-height: 2.8rem;
    color: var(--txt-sec)
}

.text-list-group5 .text-list .text-list-img {
    margin-top: 2.4rem
}

.text-list-group5 .text-list .text-list-img img {
    max-width: 100%
}

/*! component element text 팝업 컨텐츠 */

.txt-hashtag-group .txt {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400;
    color: var(--color-pn, #17008c)
}

.txt-hashtag-group .txt+.txt {
    margin-top: 1rem
}

/*! component element text 금액 텍스트 */

.sum-group {
    width: 100%;
    position: relative
}

.sum-group.fs28b {
    height: 3.7rem
}

.sum-group.fs28b .sum,
.sum-group.fs28b .sum-check {
    font-size: 2.8rem;
    line-height: 3.6rem;
    font-weight: bold
}

.sum-group.fs21b {
    height: 2.6rem
}

.sum-group.fs21b .sum,
.sum-group.fs21b .sum-check {
    font-size: 2.1rem;
    line-height: 2.7rem;
    font-weight: bold
}

.sum-group.fs18b .sum,
.sum-group.fs18b .sum-check {
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: bold
}

.sum-group .sum-check {
    width: 100%;
    color: var(--color-g500, #b8b8b8);
    position: absolute;
    z-index: 2;
    top: 0;
    left: 0;
    background-color: var(--color-w100, #fff);
    text-align: left
}

.sum-group .sum-loading {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 2;
    background-color: var(--color-w100, #fff)
}

.sum-group .sum {
    position: relative;
    z-index: 1;
    background-color: var(--color-w100, #fff)
}

/*! component element text 텍스트 회원가입 완료타입 */

.dl-infobox-group {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g700)
}

.dl-infobox-group .tit {
    margin-top: 3.2rem
}

.dl-infobox-group .txt {
    margin-top: 0.4rem;
    font-size: 2.1rem;
    line-height: 2.7rem;
    font-weight: bold;
    color: var(--color-g900, #141414)
}

.dl-infobox-group .txt.ty01 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.dl-infobox-group .txt .btn-lv03 .txt {
    margin-top: 0;
    line-height: normal;
    font-size: 1.4rem;
    font-weight: 500;
    color: var(--color-pn, #17008c)
}

.dl-infobox-group .desc {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g700)
}

.txt-icon {
    position: relative;
    padding-left: 2.6rem
}

.txt-icon [class^="ico-"] {
    position: absolute;
    left: 0;
    top: 0
}

.txt-icon .ico-clock {
    -webkit-filter: var(--filter-g800);
    filter: var(--filter-g800)
}

.txt-icon.secondary1-4 * {
    color: var(--color-bu600, #0082ff)
}

.txt-icon.secondary1-4 [class^="ico-"] {
    -webkit-filter: var(--filter-bu600);
    filter: var(--filter-bu600)
}

li.txt-icon {
    padding-left: 3.2rem
}

li.txt-icon+li.txt-icon {
    margin-top: 1.2rem
}

li.txt-icon [class^="ico-"] {
    width: 2.4rem;
    height: 2.4rem
}

.txt-icon.type1 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 0.4rem;
    padding-left: 0
}

.txt-icon.type1 [class^="ico-"] {
    position: relative;
    width: 1.8rem;
    height: 1.8rem
}

.txt-icon.type1 [class^="txt-"] {
    font-weight: bold
}

.txt-icon.type1.correct [class^="txt-"] {
    color: var(--txt-accent-sec)
}

.txt-icon.type1.correct [class^="ico-"] {
    -webkit-filter: var(--filter-ico-accent-ter);
    filter: var(--filter-ico-accent-ter)
}

.txt-icon.type1.incorrect [class^="txt-"] {
    color: var(--txt-pri-error)
}

.txt-icon.type1.incorrect [class^="ico-"] {
    -webkit-filter: var(--filter-re700);
    filter: var(--filter-re700)
}

.txt-icon.type1.no-answer [class^="txt-"] {
    color: var(--txt-quin)
}

.txt-icon.type1.no-answer [class^="ico-"] {
    -webkit-filter: var(--filter-g500);
    filter: var(--filter-g500)
}

/*! component element text - graybox-text 그레이박스 텍스트그룹 */

.graybox-text-group {
    position: relative;
    background-color: var(--color-g100, #f8f8f8);
    border-radius: 1rem;
    padding: 2rem
}

.graybox-text-group.bg-qua {
    background-color: var(--bg-qua)
}

.graybox-text-group.a-center {
    text-align: center
}

.graybox-text-group.type2 {
    text-align: center;
    padding: 7.5rem 2rem 2.4rem;
    margin-bottom: 3.2rem
}

.graybox-text-group [class*="ico-"]+.txt-group {
    margin-top: 0.3rem
}

.graybox-text-group .right {
    text-align: right;
    color: var(--color-g500, #b8b8b8)
}

.graybox-text-group .txt-group .tit {
    font-size: 2.1rem;
    line-height: 2.7rem;
    font-weight: bold;
    color: var(--color-g900, #141414)
}

.graybox-text-group .txt-group .tit .secondary1-1 {
    color: var(--color-bu800, #0150ff)
}

.graybox-text-group .txt-group .tit .fs18 {
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: bold
}

.graybox-text-group .txt-group .txt-lv01 {
    color: var(--color-g900, #141414);
    margin-top: 0.8rem
}

.graybox-text-group .txt-group+.txt-group {
    margin-top: 2.4rem
}

.graybox-text-group .txt-group+.txt-lv04 {
    margin-top: 2.4rem
}

.graybox-text-group .txt-group .btn-under-link {
    display: inline-block;
    margin-top: 0.8rem
}

.graybox-text-group .txt-group-02 .tit {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: bold
}

.graybox-text-group .txt-group-02 .txt-lv03 {
    margin-top: 0.8rem
}

.graybox-text-group .txt-group-02 .txt-lv03+.tit {
    margin-top: 2.4rem
}

:root .graybox-text-group .ico-help3 {
    -webkit-filter: var(--filter-g600);
    filter: var(--filter-g600)
}

.graybox-text-group.ty03 .box-inner-group.disabled .selectbox-bl-radius-group {
    border-color: var(--border-disabled)
}

.graybox-text-group.ty03 .box-inner-group.disabled .btn-selectbox:disabled .txt-name {
    color: var(--txt-readonly)
}

.graybox-text-group.ty03 .box-inner-group.disabled .btn-selectbox:disabled .bl-selectbox {
    -webkit-filter: var(--filter-ico-disabled);
    filter: var(--filter-ico-disabled)
}

.graybox-text-group.ty03 .box-inner-group.disabled .tag-accent-sec {
    background-color: var(--bg-ter)
}

.graybox-text-group.ty03 .box-inner-group.disabled .tag-accent-sec .txt {
    color: var(--txt-ter)
}

.graybox-text-group.ty03 .box-inner-group.disabled .secondary1-2 {
    color: var(--txt-readonly) !important
}

.graybox-text-group.ty04 {
    padding: 1.2rem 3.8rem;
    background-color: var(--bg-ter)
}

.graybox-text-group.ty04 .txt {
    font-size: 1.4rem;
    font-weight: 700;
    line-height: 2rem;
    color: var(--txt-sec)
}

.graybox-text-group.ty05 {
    padding: 3rem 2rem
}

.graybox-text-group.ty05 .tit {
    font-size: 1.8rem;
    margin-bottom: 1.5rem;
    padding: 0 1.5rem;
    line-height: 2.5rem
}

.selectbox-bl-radius-group.read-only {
    border-color: var(--border-disabled)
}

.selectbox-bl-radius-group.medium.ui-input.read-only .txt-name {
    font-weight: 700;
    color: var(--txt-readonly);
    font-size: 1.8rem
}

.selectbox-bl-radius-group.medium.ui-input.read-only .bl-selectbox {
    -webkit-filter: var(--filter-g400);
    filter: var(--filter-g400)
}

.graybox-text-group.ty06 {
    padding: 2.4rem 2rem
}

.graybox-text-group.ty06 .txt-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.graybox-text-group.ty06 .txt-group .tit {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.graybox-text-group.ty06 .txt-group .tit .txt {
    margin-left: .8rem;
    font-size: 1.5rem;
    font-weight: 500;
    line-height: 2rem;
    color: var(--txt-sec)
}

.graybox-text-group.ty06 .txt-group .sum {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.graybox-text-group.ty06 .txt-group .sum .txt {
    margin-right: .8rem;
    font-size: 1.5rem;
    font-weight: 500;
    line-height: 2rem;
    color: var(--txt-sec)
}

.graybox-text-group.ty06 .txt-group .sum .link {
    padding: .6rem
}

.graybox-text-group.ty06 .txt-group+.txt-group {
    margin-top: .8rem
}

.graybox-text-group.ty07 .txt {
    font-size: 1.3rem;
    font-weight: 400;
    line-height: 2rem;
    color: var(--txt-ter)
}

.graybox-text-group.ty07 .dec {
    display: block;
    display: -webkit-box;
    max-height: 16rem;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    line-height: 2;
    -webkit-line-clamp: 8;
    -webkit-box-orient: vertical;
    word-wrap: break-word;
    overflow: hidden;
    white-space: normal;
    margin-top: 1rem;
    font-size: 1.2rem;
    font-weight: 400;
    line-height: 2rem;
    height: 16rem;
    color: var(--txt-quin)
}

.graybox-text-group.ty08 {
    padding: 2.4rem 2rem
}

.graybox-text-group.ty08 .txt-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 1.2rem
}

.graybox-text-group.ty08 .txt-group .tit {
    font-size: 1.4rem;
    font-weight: 700;
    line-height: 2rem;
    color: var(--txt-ter)
}

.graybox-text-group.ty08 .txt-list .txt-list-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 1.2rem
}

.graybox-text-group.ty08 .txt-list .txt-list-item .logo-kcis6340::after {
    border: none
}

.graybox-text-group.ty08 .txt-list .txt-list-item:last-child {
    margin-bottom: 0
}

.graybox-text-group.ty08 .txt-list .txt-list-item .dec {
    font-size: 1.4rem;
    font-weight: 500;
    line-height: 2rem;
    color: var(--txt-sec);
    margin-left: .8rem
}

.graybox-text-group.ty08+.txt {
    font-size: 1.1rem;
    font-weight: 400;
    line-height: 1.4rem;
    color: var(--txt-ter)
}

.page-FPMMAN .graybox-text-group .txt-group-02.type2 .tit {
    color: var(--color-lm500, #69b405)
}

.page-FPMMAN .graybox-text-group .txt-group-02.type2 .txt-lv02 {
    margin-top: 0.4rem
}

.page-FPMMAN .graybox-text-group .txt-group-02.type2 .txt-lv02+.tit,
.page-FPMMAN .graybox-text-group .txt-group-02.type2 .txt-lv02+.txt-lv02 {
    margin-top: 2.4rem
}

.page-FPMMAN .graybox-text-group .txt-group-02.type2 .list-infobox-group.noline {
    margin-top: 1.2rem
}

.page-FPMMAN .agreement-content .graybox-group.type2 .flex-tit {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: var(--color-lm500, #69b405);
    font-size: 1.5rem;
    margin-bottom: 1.2rem
}

:root .page-FPMMAN .agreement-content .graybox-group.type2 .flex-tit {
    color: var(--txt-pri-success, #039115)
}

.page-FPMMAN .agreement-content .graybox-group.type2 .flex-tit .tit-area [class^='ico-house-'] {
    -webkit-filter: var(--filter-lm500);
    filter: var(--filter-lm500)
}

.page-FPMMAN .agreement-content .graybox-group.type2 .flex-tit .txt {
    margin-left: 0.2rem;
    color: var(--color-lm500, #69b405)
}

:root .page-FPMMAN .agreement-content .graybox-group.type2 .flex-tit .txt {
    color: var(--txt-pri-success, #039115)
}

.page-FPMMAN .agreement-content .graybox-group.type2 .flex-tit .status {
    padding-left: 0.4rem;
    color: var(--color-lm500, #69b405);
    font-size: 1.5rem
}

:root .page-FPMMAN .agreement-content .graybox-group.type2 .flex-tit .status {
    color: var(--txt-pri-success, #039115)
}

.page-FPMMAN .agreement-content .arrange-group.type1 .ico-warning {
    -webkit-filter: var(--filter-re700);
    filter: var(--filter-re700)
}

.page-FPMMAN .agreement-content .arrange-group.type1 .txt .warning {
    color: var(--color-re700, #f02727)
}

/*! component element text 심의필 텍스트 */

.prd-rules-group {
    margin-top: 3.2rem;
    color: var(--color-g600, #9b9b9b)
}

.prd-rules-group.type2 {
    margin-top: 4rem;
    border-top: 1px solid var(--border-qua);
    padding-top: 2.4rem
}

/*! component element text bluebox-text 블루박스 텍스트그룹 */

.bluebox-text-group {
    background-color: var(--color-cg300, #f1f6fb);
    border-radius: 1rem;
    padding: 2rem
}

.bluebox-text-group.a-center {
    text-align: center
}

.bluebox-text-group .txt-group {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400
}

.bluebox-text-group .txt-group .tit {
    font-weight: 700
}

.bluebox-text-group .txt-group .tit [class*="ico-"] {
    margin-right: 0.4rem
}

.bluebox-text-group .txt-group .txt-box {
    margin-top: 0.8rem;
    color: var(--color-g800, #414141)
}

.bluebox-text-group .txt-group .txt-box .txt {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    margin-top: 0.8rem
}

/*! component element text graybox-group 보험가입 텍스트 그룹 */

.graybox-group {
    background-color: var(--color-g100, #f8f8f8);
    border-radius: 1rem;
    padding: 2rem
}

.graybox-group .txt {
    font-size: 1.5rem;
    line-height: 2rem;
    color: var(--color-g800, #414141)
}

.graybox-group .txt+.txt {
    margin-top: 1rem
}

/*! component element text graybox-group GLN 해외결제 텍스트 그룹 */

.graybox-group.type3 {
    background-color: var(--bg-qua);
    border-radius: 1.6rem;
    padding: 2.4rem 2rem
}

.graybox-group.type3 .title {
    padding: 0.4rem 0 1.6rem 0.4rem;
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--txt-ter);
    font-weight: 700
}

.graybox-group.type4 {
    background-color: var(--bg-pri-invert);
    border-radius: 1.6rem;
    padding: 2.4rem 2rem
}

.graybox-group.type4 .title {
    padding: 0.4rem 0 1.6rem 0.4rem;
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--txt-sec-invert);
    font-weight: 700
}

.graybox-group.type4.bg-qua {
    background-color: var(--bg-qua)
}

.graybox-group.type4.bg-qua .title {
    color: var(--txt-ter)
}

/*! component element BANNER 기본 */

.banner-group .banner-link {
    display: block;
    border-radius: 1rem;
    overflow: hidden;
    height: 9.7rem;
    width: 100%;
    background: var(--color-pl, #b6f23d)
}

.banner-group .banner-link img {
    width: 100%
}

.banner-group .banner-link.img-h {
    height: auto;
    background: none
}

.banner-group .banner-link.radius-unset {
    border-radius: unset
}

.banner-group.openbanking .banner-link {
    position: relative;
    padding: 2rem 2rem;
    background: var(--color-g200, #eee)
}

.banner-group.openbanking .txt-banner {
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: 400;
    color: var(--color-pn, #17008c)
}

.banner-group.openbanking .tit-banner {
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: bold;
    color: var(--color-pn, #17008c)
}

.banner-group.openbanking .openbanking-banner-icon {
    position: absolute;
    top: 50%;
    right: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 14rem;
    height: 14rem
}

.banner-group.openbanking.type02 .banner-link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    position: relative;
    background: initial
}

.banner-group.openbanking.type02 .txt-banner {
    margin-left: auto;
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: bold;
    margin-bottom: 0.4rem
}

.banner-group.openbanking.type02 .tit-banner {
    margin-left: auto;
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-pn, #17008c)
}

.banner-group.openbanking.type02 .openbanking-banner-icon {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    left: 2rem;
    width: 11.2rem;
    height: auto
}

/*! component element BANNER 범용배너(웹뱅킹 포함) update 2022-08-22 */

.normal-banner {
    margin-top: 3.2rem
}

.normal-banner .banner-link {
    display: block;
    width: 100%;
    height: auto;
    background: none
}

/*! component element BANNER 머니톡 배너 */

.group-moneytalk .moneytalk-link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 1rem;
    padding: 1.4rem 2rem;
    min-height: 5rem;
    background: var(--color-cg500, #e6ebf5)
}

.group-moneytalk .tit-banner {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: bold;
    color: var(--color-bu800, #0150ff);
    margin-right: 1.2rem;
    white-space: nowrap
}

.group-moneytalk .txt-banner {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400;
    color: var(--color-g800, #414141)
}

/*! component element BANNER 주민등록증 촬영 */

.camera-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 21.5rem
}

.camera-group .left-line {
    width: 4rem;
    background: url("../../img/mmk/common/camera_left.png") no-repeat;
    background-size: 4rem
}

.camera-group .camera-area {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.camera-group .right-line {
    width: 4rem;
    background: url("../../img/mmk/common/camera_right.png") no-repeat;
    background-size: 4rem
}

.camera-group.type2 {
    position: relative;
    background: var(--color-pb20, #00000033);
    padding: 1.2rem 1.7rem
}

.camera-group.type2 .left-line {
    position: absolute;
    left: 1.7rem;
    top: 50%;
    margin-top: -9.55rem;
    width: 3.8rem;
    height: 19.1rem;
    background: url("../../img/mmk/common/camguider_left.png") no-repeat;
    background-size: 3.8rem auto
}

.camera-group.type2 .right-line {
    position: absolute;
    right: 1.7rem;
    top: 50%;
    margin-top: -9.55rem;
    height: 19.1rem;
    width: 3.8rem;
    background: url("../../img/mmk/common/camguider_right.png") no-repeat;
    background-size: 3.8rem auto
}

/*! component element BANNER 회원가입 안내 배너 */

.box-guide-group {
    border: 1px solid var(--color-g200, #eee);
    background-color: var(--color-w100, #fff);
    border-radius: 1.2rem;
    padding: 2.2rem 2rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.box-guide-group .img {
    width: 5.8rem;
    height: 3.6rem;
    margin-right: 1.2rem;
    background-color: transparent
}

.box-guide-group .img img {
    width: auto;
    height: 100%
}

.box-guide-group .guide-txt .tit {
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: bold;
    color: var(--color-g900, #141414)
}

.box-guide-group .guide-txt .txt {
    font-size: 1.2rem;
    line-height: 1.6rem;
    font-weight: 400;
    color: var(--color-g700)
}

.component-hiteen .box-guide-group {
    padding: 1rem 1.5rem;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.component-hiteen .box-guide-group .img {
    width: 7rem;
    height: 7rem;
    background-color: transparent
}

.component-hiteen .box-guide-group .img.w44 {
    width: 4.4rem;
    height: 4.4rem;
    background-color: transparent
}

.img-license-group {
    margin: 0 auto;
    width: 21.3rem;
    height: 13.6rem
}

.img-license-group .img {
    width: 100%;
    height: 100%
}

.img-license-group .img img[src*=".svg"] {
    width: auto;
    height: 100%
}

.img-license-group .img img[src*=".png"] {
    width: 100%
}

.img-videotel-group {
    margin: 0 auto;
    text-align: center
}

.img-videotel-group .img {
    width: 100%;
    height: 21.2rem
}

.img-videotel-group .img img {
    height: 100%
}

.img-videotel-group .txt-link-area {
    margin-top: 2.4rem
}

.img-kt-group {
    margin: 0 auto;
    width: 23rem;
    height: 23rem
}

.img-kt-group .img {
    width: 100%;
    height: 100%
}

.img-kt-group .img img {
    width: 100%;
    height: 100%
}

/*! component element BANNER 카드 이미지 */

.img-card-group {
    margin: 0 auto;
    width: 100%
}

.img-card-group.vertical {
    max-width: 15rem
}

.img-card-group.horizontal {
    max-width: 23.7rem
}

.img-card-group img {
    display: block;
    width: 100%
}

.img-card-group+.card-group {
    margin-top: 2.4rem
}

.img-card-group .card-application.vertical .tooltip-focus-group {
    width: 100%
}

.img-card-group.type2 {
    margin-top: 4.8rem !important
}

.img-card-group.type2 img.vertical {
    max-width: 14.8rem
}

.img-card-group.type3 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 4.8rem 0;
    min-height: 33rem
}

/*! component element BANNER BANNER + @ - 카드 pick */

.card-pick-group {
    text-align: center;
    margin-top: 3.6rem
}

.component-img-card .tab-group .img-card-group {
    overflow: hidden
}

.component-img-card .tab-group .img-card-group.vertical {
    max-width: 20rem;
    height: 31.6rem
}

.component-img-card .tab-group .img-card-group.horizontal {
    max-width: 28.5rem;
    height: 18rem
}

.component-img-card .tab-list-type02 {
    margin-bottom: 4.8rem
}

.component-img-card .tab-list-type04 {
    margin-top: 3.6rem
}

.component-img-card .tab-list-type04 .tab-list-col {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.component-img-card .tab-list-type04 .tab-item {
    height: auto
}

.component-img-card .tab-list-type04 .tab-item+.tab-item {
    margin-left: 1.6rem
}

.component-img-card .tab-list-type04 .tab-item.active .tab-link {
    border: 0.4rem solid var(--color-pl, #b6f23d)
}

.component-img-card .tab-list-type04 .tab-link {
    display: block;
    width: 4rem;
    height: 4rem;
    border-radius: 50%;
    padding: 0;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    border: 0.4rem solid var(--color-w100, #fff)
}

.component-img-card .tab-list-type04 .tab-link.type1 {
    width: 3.6rem;
    height: 3.6rem;
    border-width: 0.2rem
}

.component-img-card .tab-list-type04 .tab-item.active .tab-link.type1 {
    border-width: 0.2rem
}

.img-card-group img.vertical {
    max-width: 15rem
}

.img-card-group img.horizontal {
    max-width: 23.7rem
}

.img-card-group img {
    display: block;
    width: 100%;
    margin: 0 auto
}

.component-img-card .tab-group .img-card-group img.vertical {
    max-width: 20rem;
    height: 31.6rem
}

.component-img-card .tab-group .img-card-group img.horizontal {
    max-width: 28.5rem;
    height: 18rem
}

.component-img-card.type-slide .img-card-group img.vertical {
    max-width: 20rem
}

.component-img-card.type-slide,
.component-img-card.type-slide .tab-list-type04 {
    margin-top: 0
}

.component-img-card.type-slide .section-link {
    display: block;
    width: 100%
}

.component-img-card.type-slide .img-card-group {
    padding: 4.8rem 0
}

.component-img-card.type-slide .img-card-group .front img.vertical {
    max-width: 20rem;
    height: 31.6rem
}

.component-img-card.type-slide .img-card-group .front img.horizontal {
    max-width: 28.5rem;
    height: 18rem
}

.component-img-card .tab-list-type04 .tab-link.white {
    position: relative
}

.component-img-card .tab-list-type04 .tab-link.white:after {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 4rem;
    height: 4rem;
    border-radius: 50%;
    border: 0.07rem solid var(--color-bu900, #003fc7)
}

.component-img-card .tab-list-type04 .tab-item.active .tab-link.white:after {
    display: none
}

.box-guide-group.loan-type1 {
    padding: 0 2rem;
    background-color: var(--color-pl, #b6f23d);
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.box-guide-group.loan-type1 * {
    color: var(--color-g900, #141414) !important
}

.box-guide-group.loan-type1 .img {
    width: 7rem;
    height: 7rem;
    margin: 0
}

/*! component element BANNER 반팝업 이미지 영역 */

.img-popup-group {
    text-align: center
}

.pop-img {
    padding: 2.4rem 0 0
}

.pop-img img {
    width: 100%
}

.popup-content .pop-img {
    padding: 0;
    text-align: center
}

.popup-content .pop-img img.w140 {
    width: 14rem;
    margin: 0 auto
}

.popup-content .pop-img img.w335 {
    max-width: 33.5rem;
    margin: 0 auto
}

.popup-content .pop-img img.w190 {
    width: 19rem;
    margin: 0 auto
}

.popup-content .pop-img img.w124 {
    width: 12.4rem;
    margin: 0 auto
}

.popup-content .pop-img img.w90 {
    width: 9rem;
    margin: 0 auto
}

.popup-content .pop-img img.w96 {
    width: 9.6rem;
    margin: 0 auto
}

.popup-content .pop-img img.w120 {
    width: 12rem;
    margin: 0 auto
}

/*! /*! component element BANNER 사장님 입출금 통장 - 반팝업 이미지 영역 */

.popup-content .boss-card-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-top: 1.6rem
}

.popup-content .boss-card-box .card-tit {
    font-size: 1.5rem;
    font-weight: 500;
    line-height: 2rem;
    color: var(--txt-sec);
    margin-bottom: 1rem
}

.popup-content .boss-card-box .card-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    padding: 1.6rem 2rem;
    background: var(--color-g200, #edf1f7);
    height: 17.5rem;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.popup-content .boss-card-box .card-group+.card-group {
    margin-top: 0
}

.popup-content .boss-card-box .card-img {
    width: 7rem
}

.popup-content .boss-card-box .card-img img {
    width: 100%
}

.popup-content .boss-card-box .card-txt {
    margin-top: 2rem;
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 2rem;
    color: var(--txt-sec)
}

.popup-content .boss-card-box .card-group.point {
    -webkit-box-flex: 2;
    -ms-flex: 2;
    flex: 2;
    margin-left: 1rem;
    border: 1px solid var(--border-pri-active);
    background: var(--color-in50)
}

.popup-content .boss-card-box .card-group.point .card-img {
    width: 13rem;
    height: 7rem
}

.popup-content .boss-card-box .card-group.point .card-tit {
    color: var(--txt-pri);
    font-weight: 700
}

.popup-content .boss-card-box .card-group.point .card-txt {
    margin-top: 1.6rem;
    color: var(--txt-pri-active);
    font-size: 2.1rem;
    line-height: 2.7rem;
    font-weight: 700
}

/*! component element BANNER 고객센터 서류 이미지 */

.img-document-group {
    background: var(--color-g100, #f8f8f8);
    border-radius: 1rem;
    padding: 1.6rem
}

.img-document-group img {
    display: block;
    width: 100%
}

/*! component element BANNER 고객센터 톡상담 배너 */

.talk-banner-group .talk-banner-link {
    position: relative;
    display: block;
    padding: 2rem 9rem 2rem 2rem;
    border-radius: 1rem;
    background: var(--color-pl, #b6f23d)
}

:root .talk-banner-group .talk-banner-link {
    background: var(--color-g200, #edf1f7)
}

.talk-banner-group .talk-banner-link .talk-banner-icon {
    position: absolute;
    top: -0.5rem;
    right: 0;
    width: 10rem;
    height: 10rem
}

.talk-banner-group .txt-banner {
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: 400;
    color: var(--color-pn, #17008c)
}

.talk-banner-group .tit-banner {
    font-size: 2.1rem;
    line-height: 2.7rem;
    font-weight: bold;
    color: var(--color-pn, #17008c);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.talk-banner-group .tit-banner .ico-arrow-sbr {
    margin-left: 0.4rem;
    width: 1.8rem;
    height: 1.8rem
}

/*! component element BANNER 공과금 홈 - 모바일고지서 배너 */

.bill-banner-group .bill-banner-link {
    display: block;
    position: relative;
    height: 10rem;
    padding: 2.3rem 2rem;
    border-radius: 1rem;
    background: var(--color-pn, #17008c);
    background-size: 9.4rem 9.4rem;
    background-position: center right;
    background-image: url("../../img/mmk/common/img_mobiletax.png");
    background-repeat: no-repeat
}

.bill-banner-group .tit-banner {
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: bold;
    color: var(--color-w100, #fff);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.bill-banner-group .tit-banner.center {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 100%
}

.bill-banner-group .txt-banner {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400;
    color: var(--color-w100, #fff);
    padding-top: 0.8rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.bill-banner-group .txt-banner .ico-arrow-sbr {
    margin-left: 0.2rem;
    width: 1.6rem;
    height: 1.6rem;
    -webkit-filter: var(--filter-w100);
    filter: var(--filter-w100);
    position: relative;
    top: -0.1rem
}

/*! component element BANNER 대출상환 이미지영역 */

.img-loan-group {
    text-align: center;
    margin-top: 1.6rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.img-loan-group .txt-lv03 {
    margin-top: 0.8rem
}

.img-loan-group .img-figure {
    max-width: 33.1rem
}

.img-loan-group .img-figure.arrow {
    margin: 2.4rem 0;
    max-width: 8rem
}

.img-loan-group .img-figure img {
    width: 100%
}

/*! component element BANNER 제휴사 대출 이미지영역 */

.img-corp-loan-group {
    text-align: center
}

.img-corp-loan-group .txt-eyebrow {
    margin-top: 3.2rem;
    color: var(--color-g700)
}

.img-corp-loan-group .txt-copy {
    margin-top: 0.8rem;
    font-size: 2.1rem;
    line-height: 2.7rem;
    font-weight: bold;
    color: var(--color-g900, #141414)
}

.img-corp-loan-group .img-figure.arrow {
    margin: 2.4rem 0
}

.img-corp-loan-group .img-figure.w182 {
    width: 18.2rem;
    margin: 0 auto
}

.img-corp-loan-group .img-figure img {
    width: 100%
}

/*! component element BANNER 아파트담보대출 배너 */

.loan-banner-group {
    border-radius: 1rem;
    background-color: var(--color-cg300, #f1f6fb);
    padding: 2rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.loan-banner-group .txt-group {
    margin-left: 1.2rem;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    color: var(--color-g900, #141414);
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400
}

.loan-banner-group .txt-group .tit-eyebrow {
    font-size: 1.2rem;
    line-height: 1.6rem;
    font-weight: 400;
    color: var(--color-g800, #414141);
    margin-bottom: 0.4rem
}

/*! component element BANNER 사장님담보대출 배너 */

.radius-banner-group {
    border-radius: 1.2rem;
    padding: 1.6rem;
    background: var(--bg-qua)
}

/*! component element BANNER 아파트담보대출 배너- 동의현황 */

.loan-alarm-group {
    border-radius: 1rem;
    background-color: var(--color-cg300, #f1f6fb);
    padding: 1.2rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.loan-alarm-group .txt-group {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    color: var(--color-g900, #141414);
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400
}

.loan-alarm-group .txt-group .tit-eyebrow {
    font-size: 1.2rem;
    line-height: 1.6rem;
    font-weight: 400;
    color: var(--color-g800, #414141)
}

.loan-alarm-group.refusal-history {
    padding: 1.3rem 1.2rem 2rem;
    display: block;
    text-align: center;
    background-color: var(--color-g100, #f8f8f8)
}

.page-FPMMAN .loan-alarm-group.refusal-history .ico-apt-notice {
    width: 7rem;
    height: 7rem;
    background-size: 7rem 7rem
}

.loan-alarm-group.refusal-history .txt-group {
    margin-top: -0.5rem
}

.loan-alarm-group.refusal-history .txt-group .tit-eyebrow {
    font-size: 1.8rem;
    color: var(--color-g900, #141414);
    font-weight: bold
}

.loan-alarm-group.refusal-history .txt-group .tit-banner {
    display: inline-block;
    margin-top: 0.8rem;
    font-size: 1.5rem;
    color: var(--color-g700);
    text-decoration: underline;
    text-underline-position: under
}

.event-banner-group {
    background-color: var(--color-cg300, #f1f6fb);
    border-radius: 1rem;
    margin-top: 3.2rem
}

:root .event-banner-group {
    background-color: var(--bg-ter, #edf1f7)
}

.event-banner-group .btn-event {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 1.5rem 2rem
}

.event-banner-group .btn-event.row-reverse {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse
}

.event-banner-group .txt-group {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    padding-left: 0.4rem
}

.event-banner-group .txt-group .txt {
    padding-left: 0.8rem
}

:root .event-banner-group.type2 .txt-group {
    background-color: var(--bg-ter, #edf1f7)
}

:root .event-banner-group.type2 .txt-group .txt-lv01 {
    color: var(--txt-pri, #020616) !important
}

:root .event-banner-group.type2 .ico-arrow-link {
    color: var(--ico-sec, #4d596f)
}

.event-banner-group.type2 {
    border-radius: 0;
    margin-top: 0
}

.event-banner-group.type2 .btn-event {
    padding: 2rem 1rem 2rem 2rem
}

.event-banner-group.type2 .txt-group {
    padding: 0 1.2rem
}

.event-banner-group.type2 .ico-arrow-link {
    margin-left: auto;
    width: 3.6rem;
    height: 3.6rem;
    background-size: 1.4rem 1.4rem
}

.event-banner-group.type2 .btn-event.type2 {
    padding: 1.2rem 1rem 1.2rem 2rem
}

.event-banner-group.type2 .btn-event.type2 .ico-arrow-link {
    background-size: 2rem 2rem
}

.event-banner-group.type3 {
    background-color: var(--color-w100);
    border-radius: 1.2rem;
    border: 1px solid var(--color-g200)
}

.event-banner-group.type3 .btn-event {
    padding: 2rem;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.event-banner-group.type3 .txt-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.event-banner-group.type3 .txt-group .txt {
    padding: 1.2rem 0 0;
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--color-g700)
}

.event-banner-group.type4 {
    border-radius: 0;
    margin-top: 4.8rem;
    background-color: var(--bg-qua)
}

.event-banner-group.type4 .btn-event {
    padding: 3.4rem 2rem;
    width: 100%
}

.event-banner-group.type4 .txt-group {
    -webkit-box-flex: unset;
    -ms-flex: unset;
    flex: unset
}

.event-banner-group.type5 {
    border-radius: 0;
    margin-top: 0
}

.event-banner-group.type5 .btn-event {
    padding: 2rem 2.4rem 2rem 3.3rem
}

.event-banner-group.type6 .btn-event {
    padding: 1rem 2.7rem 1rem 2.4rem
}

.event-banner-group.type7 {
    margin-top: 1.6rem;
    border-radius: 1.2rem;
    background-color: var(--bg-sec)
}

.event-banner-group.type7 .btn-event {
    padding: 1.2rem 1.6rem
}

.event-banner-group.type8 {
    margin-top: 0;
    border-radius: 2rem;
    background-color: var(--bg-qua)
}

.event-banner-group.type8 .btn-event {
    padding: 1.6rem 2rem
}

.event-banner-group.type8 .btn-event img {
    width: 4.4rem
}

.event-banner-group.type8 .txt-group {
    padding-left: 1.6rem
}

.event-banner-group.type8 .txt-group .txt-lv02 {
    color: var(--txt-sec);
    font-weight: 700
}

.event-banner-group.type8 .txt-group .txt-lv03 {
    margin-top: .2rem;
    color: var(--txt-qua)
}

.event-banner-group.type8 .ico-arrow-link {
    width: 1.4rem;
    height: 1.4rem;
    -webkit-filter: var(--filter-g500);
    filter: var(--filter-g500)
}

.event-banner-group.type6.coupon {
    background-color: var(--bg-sec, #e0e6f1)
}

.event-banner-group.type9 {
    border-radius: 1.2rem
}

.event-banner-group.type9 .btn-event {
    padding: 1.6rem 2rem
}

.event-banner-group.type10 {
    margin-top: 1.2rem;
    background-color: var(--bg-pri-invert);
    border-radius: 1.2rem
}

.event-banner-group.type10 .btn-event {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    gap: 1.2rem;
    padding: 1.6rem 2rem
}

.event-banner-group.type10 .btn-event .img {
    width: 4.4rem;
    height: 4.4rem
}

.event-banner-group.type10 .btn-event .img img {
    width: 100%
}

.event-banner-group.type10 .btn-event [class^="ico-"] {
    margin-left: auto
}

.event-banner-group.type11 {
    background: var(--bg-qua)
}

.event-banner-group.type11 .btn-event {
    padding: 1.2rem;
    text-align: center
}

.event-banner-group.type12 {
    margin-top: -1.2rem;
    background-color: var(--bg-ter)
}

.event-banner-group.type12 .btn-event {
    padding: 1rem 1.6rem
}

.event-banner-group.type12 .btn-event .txt {
    font-size: 1.3rem;
    color: var(--txt-sec)
}

.event-banner-group.type13 {
    margin-top: 1.2rem;
    background-color: var(--color-in25)
}

.event-banner-group.type13 .btn-event {
    padding: 1.2rem 0
}

.event-banner-group.type13 .btn-event .txt-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.event-banner-group.type13 .btn-event [class^="ico"] {
    margin-right: 0.4rem
}

.event-banner-group.type13 .btn-event .txt {
    padding-left: 0;
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--txt-accent-sec)
}

.event-banner-group.type14 {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    margin-top: 0
}

.event-banner-group.type14 .tit {
    font-size: 1.8rem;
    font-weight: 700;
    line-height: 2rem;
    color: var(--txt-sec)
}

.event-banner-group.type14 .txt {
    margin-top: 0.6rem;
    padding-left: 0;
    font-size: 1.3rem;
    line-height: 1.8rem;
    color: var(--txt-qua)
}

.event-banner-group.type14 .img {
    display: block;
    width: 7.6rem;
    height: 7.1rem;
    margin-left: 1.6rem
}

.event-banner-group.type14 .img img {
    width: 100%
}

.section-component.type3 .event-banner-group.type10 {
    background-color: var(--bg-base)
}

.banner-box-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 1.1rem 2.2rem 1.3rem 2.1rem;
    border-radius: 1.6rem;
    background: var(--color-bu700, #006aff)
}

.banner-box-group .tit {
    font-size: 1.8rem;
    font-weight: 700;
    line-height: 2.5rem;
    color: var(--color-w100, #fff)
}

.banner-box-group .txt {
    margin-top: .4rem;
    font-size: 1.5rem;
    line-height: 2rem;
    opacity: 0.8;
    color: var(--color-w100, #fff)
}

.banner-box-group .img {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    width: 6rem
}

.banner-box-group .img img {
    width: 100%
}

/*! component element BANNER 아파트담보대출 -띠배너 */

.document-notice {
    width: 100%;
    background: var(--color-cg300, #f1f6fb);
    padding: 1rem 2rem
}

.document-notice dl .ico-apt-notice.docu {
    content: "";
    clear: both;
    display: inline-block;
    width: 3.4rem;
    height: 3.2rem;
    background: url("/resource/img/mmk/common/ico_notice.png") left/contain no-repeat;
    background-size: 3.2rem 3.2rem
}

.document-notice dl dt {
    font-size: 1.4rem;
    font-weight: bold;
    color: var(--color-g900, #141414)
}

.document-notice dl dd {
    font-size: 1.4rem;
    color: var(--color-g700);
    line-height: 1.7rem
}

.document-notice+.component-text-simple {
    margin-top: 3.2rem
}

.document-notice.type01 {
    background: var(--color-g200);
    padding: 1.4rem 1.6rem;
    border-radius: 10px;
    text-align: center
}

.document-notice.type02 {
    padding: 2rem;
    border-radius: 0;
    text-align: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: left
}

.document-notice.type02 dt {
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 2rem;
    color: var(--txt-sec)
}

.document-notice.type02 dd {
    margin-top: .2rem;
    font-weight: 400;
    line-height: 2rem;
    color: var(--txt-qua)
}

.section-component-simsa {
    padding: 0.8rem 0 2.4rem 0
}

.section-component-simsa .card-group {
    background: var(--bg-qua)
}

/*! component element BANNER 아파트담보대출 -이미지영역 */

.img-family-group {
    margin: 2.4rem auto 4.8rem
}

.img-family-group img {
    width: 100%
}

.page-FPMMAN .keypad-group .keypad-value.type1 .amounttext {
    font-size: 1.4rem;
    margin-top: 0.8rem
}

.page-FPMMAN .selectbox-bl-radius-group.type5 {
    padding: 0.5rem 1.2rem 0.5rem 1.8rem;
    border-color: var(--color-bu900, #003fc7)
}

.page-FPMMAN .selectbox-bl-radius-group.type5 .btn-selectbox .txt-name {
    font-size: 1.8rem;
    color: var(--color-bu900, #003fc7)
}

/*! component element BANNER otp 신규발급 이미지여역 */

.img-otp-group {
    margin-top: 1.6rem;
    border-radius: 1rem;
    padding: 2rem;
    border: 0.1rem solid var(--color-g200, #eee);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.img-otp-group .img {
    width: 9rem;
    height: 9.4rem;
    background-color: var(--color-pb100, #000)
}

.img-otp-group .img img {
    width: 100%
}

.img-otp-group .txt-group {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.img-otp-group .bl-txt-group {
    margin-left: 1.2rem
}

.img-otp-group .bl-txt-group .txt {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400
}

.img-otp-group .bl-txt-group .txt+.txt {
    margin-top: 0.8rem
}

.img-otp-group.type2 .bl-txt-group {
    margin-left: 2rem;
    margin-right: 2rem
}

.img-otp-group.type2 .bl-txt-group .txt {
    color: var(--color-g700)
}

/*! component element BANNER 공통인증_비대면실명인증 이미지여역 */

.img-cert-group {
    margin: 0 0 3rem
}

.img-cert-group .img img {
    width: 100%
}

/*! component element BANNER 이체 */

.img-trn-group .img img {
    width: 100%
}

.flex-colume-bottom .banner-group {
    margin: 2rem 0 2.6rem;
    max-width: 100vw;
    overflow: hidden
}

.flex-colume-bottom .banner-group>.img-banner img {
    width: 100%
}

.activeSlide .flex-colume-bottom .banner-group>.img-banner {
    margin: 0 auto;
    width: 331px;
    height: 60px;
    background: var(--color-w100, #fff);
    -webkit-animation: slidein 0.8s cubic-bezier(0.55, 0.03, 0.34, 1) forwards;
    animation: slidein 0.8s cubic-bezier(0.55, 0.03, 0.34, 1) forwards;
    -webkit-animation-delay: 0.8s;
    animation-delay: 0.8s;
    opacity: 0
}

@-webkit-keyframes slidein {
    from {
        -webkit-transform: translateX(100%);
        transform: translateX(100%);
        opacity: 1
    }
    to {
        -webkit-transform: translateX(0);
        transform: translateX(0);
        opacity: 1
    }
}

@keyframes slidein {
    from {
        -webkit-transform: translateX(100%);
        transform: translateX(100%);
        opacity: 1
    }
    to {
        -webkit-transform: translateX(0);
        transform: translateX(0);
        opacity: 1
    }
}

/*! component element BANNER 혜택 - 금리쿠폰 */

.coupon-box-group {
    padding: 2.6rem 2rem;
    background-color: var(--color-g100, #f8f8f8);
    border-radius: 1rem
}

.coupon-txt {
    width: 100%;
    text-align: center;
    font-size: 2.4rem;
    line-height: 3.3rem;
    font-weight: bold;
    color: var(--color-g900, #141414)
}

.coupon-sub-txt {
    width: 100%;
    text-align: center;
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: 400;
    color: var(--color-g700);
    margin-top: 1.6rem
}

:root .coupon-sub-txt {
    color: var(--color-g600, #67748e)
}

.coupon-sub-txt2 {
    width: 100%;
    text-align: center;
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400;
    color: var(--color-g900, #141414)
}

.coupon-sub-txt2+.coupon-txt {
    margin-top: 0.4rem;
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: bold
}

/*! component element BANNER 케이뱅크페이 간편결제 홈 */

.pay01-group {
    text-align: center;
    margin-top: 4.5rem
}

.pay01-group .pay-icon img {
    width: 14rem;
    height: 14rem
}

.pay01-group .pay-img {
    margin: 4.8rem 0 9rem
}

.pay01-group .pay-img.right {
    text-align: right
}

.pay01-group .pay-img img {
    width: 100%
}

.pay01-group .pay-main-txt {
    font-size: 2.4rem;
    line-height: 3.3rem;
    font-weight: bold;
    margin-top: 0.4rem
}

.pay01-group .pay-sub-txt {
    color: var(--color-g700);
    margin-top: 1.2rem
}

.pay01-group .pay-sub-txt.blue {
    margin-top: 3.2rem;
    color: var(--color-bu800, #0150ff)
}

.pay01-group .btn-cashback {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-size: 2.8rem;
    line-height: 3.6rem;
    font-weight: bold;
    margin-top: 0.8rem
}

.pay01-group .cashback-icon {
    margin-top: 2.4rem
}

.pay01-group .cashback-icon img {
    width: 16rem;
    height: 16rem
}

.pay01-group+.pay01-group {
    margin-top: 7.5rem
}

.pay01-group.left .pay-main-txt,
.pay01-group.left .pay-sub-txt {
    text-align: left
}

.img-qrgroup {
    text-align: center;
    margin: 4.8rem 0
}

.img-qrgroup .img-pay-qr {
    margin: 0 auto;
    width: 16rem
}

.img-qrgroup .img-pay-qr img {
    width: 100%
}

/*! component element BANNER 케이뱅크페이 간편결제 * 제로페이 */

.paybanner-group {
    padding: 2.4rem 2rem 4rem;
    border-radius: 1rem;
    -webkit-box-shadow: 0 0.6rem 1.4rem 0 var(--color-pb7, #00000011);
    box-shadow: 0 0.6rem 1.4rem 0 var(--color-pb7, #00000011)
}

.paybanner-group .txt-eyebrow {
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: bold;
    color: var(--color-pn, #17008c)
}

.paybanner-group .txt-copy {
    font-size: 2.4rem;
    line-height: 3.3rem;
    font-weight: bold;
    color: var(--color-g900, #141414);
    margin-top: 1.2rem
}

.paybanner-group+.paybanner-group {
    margin-top: 4rem
}

.paybanner-group.hyundai-group {
    background: -o-linear-gradient(300deg, rgba(229, 241, 255, 0.2) 0, #e0eeff 100%);
    background: linear-gradient(150deg, rgba(229, 241, 255, 0.2) 0, #e0eeff 100%)
}

.paybanner-group.hyundai-group .img-car {
    width: 21.8rem;
    height: 19rem;
    margin: 0 auto
}

.paybanner-group.hyundai-group .img-car img {
    width: 100%
}

.paybanner-group.hyundai-group .bar-slide .bar-bg {
    position: relative;
    height: 0.4rem;
    border-radius: 0.4rem;
    background-color: var(--color-pb10, #00000019);
    width: calc(100% - 3.2rem);
    margin: 0 auto
}

.paybanner-group.hyundai-group .bar-slide .bar-bg .bar {
    border-radius: 0.4rem;
    position: absolute;
    left: 0;
    top: 0;
    height: 0.4rem;
    width: 40%;
    background: -o-linear-gradient(left, var(--color-pn, #17008c) 0, rgba(15, 0, 96, 0) 100%);
    background: -webkit-gradient(linear, left top, right top, color-stop(0, var(--color-pn, #17008c)), to(rgba(15, 0, 96, 0)));
    background: linear-gradient(90deg, var(--color-pn, #17008c) 0, rgba(15, 0, 96, 0) 100%)
}

.paybanner-group.hyundai-group .bar-slide .bar-bg .range-dot {
    position: absolute;
    left: 0;
    top: -0.6rem;
    margin-left: -0.8rem;
    width: 1.6rem;
    height: 1.6rem;
    border-radius: 50%;
    background-color: var(--color-w100, #fff);
    border: 0.4rem solid var(--color-pn, #17008c)
}

.paybanner-group.hyundai-group .bar-slide .txt-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    margin-top: 1.2rem
}

.paybanner-group.zeropay-group {
    background: -o-linear-gradient(300deg, rgba(232, 229, 255, 0.2) 0, #e8e6ff 100%);
    background: linear-gradient(150deg, rgba(232, 229, 255, 0.2) 0, #e8e6ff 100%)
}

.paybanner-group.zeropay-group .icon-slide {
    overflow: hidden;
    margin: 6rem -2.2rem 4rem
}

.paybanner-group.zeropay-group .icon-slide .img {
    position: relative;
    height: 7rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.paybanner-group.zeropay-group .icon-slide .img+.img {
    margin-top: 2rem
}

@-webkit-keyframes anim-icon-slide1 {
    from {
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0)
    }
    to {
        -webkit-transform: translate(-100%, 0);
        transform: translate(-100%, 0)
    }
}

@keyframes anim-icon-slide1 {
    from {
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0)
    }
    to {
        -webkit-transform: translate(-100%, 0);
        transform: translate(-100%, 0)
    }
}

@-webkit-keyframes anim-icon-slide2 {
    from {
        -webkit-transform: translate(-40px, 0);
        transform: translate(-40px, 0)
    }
    to {
        -webkit-transform: translate(calc(-100% - 40px), 0);
        transform: translate(calc(-100% - 40px), 0)
    }
}

@keyframes anim-icon-slide2 {
    from {
        -webkit-transform: translate(-40px, 0);
        transform: translate(-40px, 0)
    }
    to {
        -webkit-transform: translate(calc(-100% - 40px), 0);
        transform: translate(calc(-100% - 40px), 0)
    }
}

.paybanner-group.zeropay-group .icon-slide [class*="icon-"] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 7rem
}

.paybanner-group.zeropay-group .icon-slide [class*="icon-"] img {
    height: 100%;
    padding-left: 1.2rem
}

.paybanner-group.zeropay-group .icon-slide .icon-box1 {
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    transform: translate(0, 0);
    -webkit-animation: anim-icon-slide1 12s linear infinite both;
    animation: anim-icon-slide1 12s linear infinite both
}

.paybanner-group.zeropay-group .icon-slide .icon-box2 {
    -webkit-transform: translate(-40px, 0);
    -ms-transform: translate(-40px, 0);
    transform: translate(-40px, 0);
    -webkit-animation: anim-icon-slide2 12s linear infinite both;
    animation: anim-icon-slide2 12s linear infinite both
}

/*! component element BANNER BANNER carousel - 체크카드 조회 관리 */

/*! component element BANNER BANNER  - 오늘의 쿠폰 */

.component-banner.coupon {
    background: var(--color-w100, #fff);
    padding-top: 2.8rem;
    margin-top: 0 !important
}

.component-banner.coupon .coupon-banner-group .coupon-banner-link {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    background: var(--color-ce300, #72e06a) !important;
    border-radius: 1.4rem;
    border: 0.15rem solid var(--color-ce400, #4ecf50);
    padding: 2rem 2rem 2rem 2.4rem;
    height: 8.2rem
}

.component-banner.coupon .coupon-banner-group .coupon-banner-link .coupon-icon01 {
    background: url("../../img/mmk/common/ico_coupon01.png") no-repeat;
    background-size: contain;
    width: 2.8rem;
    height: 2.4rem;
    position: absolute;
    left: 0.7rem;
    top: 1.2rem
}

.component-banner.coupon .coupon-banner-group .coupon-banner-link .coupon-icon02 {
    background: url("../../img/mmk/common/ico_coupon02.png") no-repeat 0 0;
    background-size: contain;
    width: 3.8rem;
    height: 3.8rem
}

.component-banner.coupon .coupon-banner-group .coupon-banner-link .tit-banner {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    padding-left: 1.6rem;
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 2.1rem;
    color: var(--color-ce900, #00670f)
}

.component-banner.coupon .coupon-banner-group .coupon-banner-link .txt-banner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 0.6rem 0.8rem;
    border-radius: 0.8rem;
    background: var(--color-ce600, #07a721)
}

.component-banner.coupon .coupon-banner-group .coupon-banner-link .txt-banner>span {
    color: var(--color-w100, #fff);
    font-size: 1.4rem;
    font-weight: 700;
    line-height: 2rem
}

.component-banner .img img {
    width: 100%
}

/*! component element BANNER CHPFMTASK-1692 PBKOFR7006000000S_M02 - AI퀴즈챌린지 2024-11-27 */

.component-banner .quiz-challenge-group {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 3.2rem;
    padding-right: 1.2rem;
    padding-left: 1.2rem;
    background-color: var(--color-in100);
    border-radius: 0.8rem
}

.component-banner .quiz-challenge-group img {
    width: 2rem;
    height: 2rem;
    margin-right: 0.6rem
}

.component-banner .quiz-challenge-group .tit-banner {
    font-size: 1.4rem;
    font-weight: 700;
    line-height: 1.6rem;
    color: var(--txt-accent-sec)
}

/*! component element BANNER CHPFMTASK-2037 PBKMAN0000003420S_M01 - 전체탭 2depth 2025-03-11 */

.component-banner.type-list.gap12 .kds-banner-card+.kds-banner-card {
    margin-top: 1.2rem
}

.component-banner.type-list .kds-banner-card__image>i {
    background-position-x: 50% !important
}

/*! component element cms 영역 카드이용내역 - 이용실적조회 */

.cms-group {
    background-color: var(--color-g100, #f8f8f8);
    border-radius: 0.8rem;
    padding: 1.6rem 2rem;
    text-align: center;
    font-size: 1.2rem;
    line-height: 1.6rem;
    font-weight: 400;
    color: var(--color-g700)
}

/*! component element CHPFMTASK-1033 플러스박스 개편 플러스박스 > 가입 */

.plusbox-nickname-group .input-txt-group {
    margin-top: 3.2rem
}

.input-txt-group.f-28.noline {
    border: 0
}

.input-txt-group.f-28.noline>textarea {
    font-size: 2.8rem;
    line-height: 3.6rem;
    font-weight: 700;
    padding: 0
}

.input-txt-group.f-28.noline .btn-delete-txt {
    padding: 0 0 0 2rem
}

.input-txt-group textarea[line-break] {
    height: auto;
    resize: inherit
}

.input-txt-group.error textarea[line-break] {
    color: var(--txt-pri-error)
}

/*! component element BANNER 사장님 신용리포트 배너 */

.ceo-banner-group {
    display: block
}

.ceo-banner-group img {
    width: 100%
}

/*! component element CHPFMTASK-1135 국내채권 수익금 계산기 */

.input-txt-group.profits .btn-delete-txt {
    padding-right: 0.2rem
}

.input-txt-group:not(.line).profits .input-right-txt {
    margin-top: 2.6rem
}

/*! component element BANNER CHPFMTASK-1167 캐시백 더 받는 팁 */

.cashback-banner-group {
    margin: -4.8rem 0 3.2rem;
    background-color: var(--bg-qua, #f7f9fd);
    border-radius: 1.2rem
}

.cashback-banner-group .banner-link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 1.6rem 2rem
}

.cashback-banner-group .img {
    width: 3.4rem;
    height: 3.4rem
}

.cashback-banner-group .img img {
    width: 100%
}

.cashback-banner-group .tit-banner {
    margin-left: 1.2rem;
    font-size: 1.5rem;
    font-weight: 500;
    line-height: 2rem;
    color: var(--txt-sec, #3b4659)
}

/*! component element BANNER CHPFMTASK-1132 퀴즈쇼 우승 */

.quiz-banner-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-top: 1.6rem;
    background-color: var(--bg-qua, #f7f9fd);
    border-radius: 1.2rem;
    padding: 1.6rem 2rem
}

.quiz-banner-group [class^="ico-"] {
    width: 3.6rem;
    height: 3.6rem
}

.quiz-banner-group .txt-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 0.2rem
}

.quiz-banner-group .tit-eyebrow {
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--txt-qua)
}

.quiz-banner-group .tit-banner {
    font-size: 1.5rem;
    font-weight: bold;
    line-height: 2rem;
    color: var(--txt-sec)
}

.quiz-banner-group .tit-banner .txt {
    color: var(--txt-accent-sec)
}

.quiz-banner-group.type1 {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    gap: 1.2rem
}

.quiz-banner-group.type1 .img {
    width: 4.4rem;
    height: 4.4rem
}

.quiz-banner-group.type1 .ico-arrow-link {
    width: 1.6rem;
    height: 1.6rem;
    margin-left: auto
}

/*! component element BANNER CHPFMTASK-1692 퀴즈쇼 메인 배너 */

/*! component element CHPFMTASK-1286 종합소득세 돌려받기 */

.landing-banner-group a {
    display: block
}

.landing-banner-group img {
    width: auto;
    height: 6.6rem
}

/*! component element CHPFMTASK-870 */

.component-paging {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: var(--color-w100), var(--path-line-chevron-left-right)
}

.component-paging .btn-prev {
    margin-right: auto
}

.component-paging .btn-next {
    margin-left: auto
}

.component-paging .txt-paging {
    text-align: center
}

/*! component element CHPFMTASK-1398 플러스박스 */

.plusbox-banner-group .section-link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 1.2rem;
    margin: 1rem 0;
    padding: 0 2rem
}

.plusbox-banner-group .img {
    width: 10rem;
    height: 8.4rem
}

.plusbox-banner-group .tit-eyebrow {
    font-size: 1.4rem;
    font-weight: 500;
    line-height: 2rem
}

.plusbox-banner-group .tit-banner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    gap: 0.2rem;
    margin-top: 0.2rem;
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 2.1rem
}

.plusbox-banner-group .tit-banner .sup {
    font-size: 1.1rem;
    font-weight: 400;
    line-height: 1.5rem
}

/*! component element CHPFMTASK-870 홈탭 배너를 서브 페이지에 적용 (피드백 cs 등) */

.sub-bne-group {
    position: relative;
    padding: 1.6rem 4.6rem 1.6rem 2rem;
    background-color: var(--bg-qua);
    border-radius: 2rem
}

.sub-bne-row-info {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.sub-bne-row-item.img,
.sub-bne-row-item.logo {
    width: 4.4rem;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.sub-bne-row-item.img img,
.sub-bne-row-item.logo img {
    width: 100%
}

.sub-bne-row-item.text {
    padding-left: 1.6rem;
    max-width: calc(100% - 5rem)
}

.sub-bne-row-item.text>span {
    display: block
}

.sub-bne-row-item.text>span.title {
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 2rem;
    color: var(--txt-sec)
}

.sub-bne-row-item.text>span.text {
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 2rem;
    color: var(--txt-qua)
}

.sub-bne-row-item.text>span.text+span.title,
.sub-bne-row-item.text>span.title+span.text {
    margin-top: 0.4rem
}

.component-sub-banner.cs {
    margin-top: 2rem
}

.component-sub-banner.cs.container-flex-bottom {
    margin: auto 0 -4rem;
    padding-top: 3.2rem
}

.component-sub-banner.cs .sub-bne-group {
    display: block;
    background-color: var(--bg-qua);
    padding: 1.8rem 2rem
}

.component-sub-banner.cs .sub-bne-group.bg-ter {
    background-color: var(--bg-ter)
}

.component-sub-banner.cs .sub-bne-row-item.text {
    padding-left: 1.2rem
}

.component-sub-banner.cs .sub-bne-row-item.text>span.title {
    color: var(--txt-sec)
}

.component-sub-banner.cs .sub-bne-row-item.text>span.text+span.title {
    margin-top: 0.2rem
}

.component-sub-banner.cs .sub-bne-row-item.text>span.text {
    color: var(--txt-ter)
}

.component-sub-banner.cs .sub-bne-group .sub-bne-row-item:last-child {
    margin-left: auto
}

.component-sub-banner.cs .sub-bne-row-item.img,
.component-sub-banner.cs .sub-bne-row-item.img * {
    width: 1.8rem;
    -webkit-filter: var(--filter-color-grey-g600);
    filter: var(--filter-color-grey-g600)
}

.ui-dropdown {
    position: relative;
    display: inline-block
}

.ui-dropdown .ui-dropdown-menu {
    display: none
}

.select-container.type-menu .select-dimmed {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 100
}

.select-container.type-menu .select-wrap {
    position: absolute;
    width: 18rem;
    right: 2rem;
    top: calc(100% + 0.4rem);
    padding: 1.2rem 0;
    background-color: var(--bg-base);
    -webkit-box-shadow: 0 0.2rem 0.7rem rgba(0, 0, 0, 0.16);
    box-shadow: 0 0.2rem 0.7rem rgba(0, 0, 0, 0.16);
    border-radius: 1.6rem;
    z-index: 101
}

.select-container.type-menu .select-title {
    padding: 0.4rem 2rem 0.8rem;
    color: var(--txt-quin);
    font-size: 1.2rem;
    line-height: 1.6rem;
    font-weight: 500
}

.select-container.type-menu .select-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.select-container.type-menu .select-item {
    width: 100%
}

.select-container.type-menu .select-item .btn-option {
    position: relative;
    width: 100%;
    padding: 1rem 2rem;
    color: var(--txt-ter);
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 500;
    text-align: left
}

.select-container.type-menu .select-item .btn-option.selected {
    color: var(--txt-ter-active);
    font-weight: 700
}

.select-container.type-menu .select-item .btn-option.selected::after {
    content: '';
    display: block;
    width: 1.6rem;
    height: 1.6rem;
    position: absolute;
    top: 50%;
    right: 2rem;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    background-image: var(--path-checkbox-line-active);
    background-size: contain;
    background-repeat: no-repeat;
    -webkit-filter: var(--filter-in700);
    filter: var(--filter-in700)
}

.select-container.type-menu .select-item .btn-option.selected::after {
    -webkit-filter: var(--filter-in900);
    filter: var(--filter-in900)
}

.input-txt-group.ui-input .bl-selectbox {
    pointer-events: none
}

.custom-policy-filter .select-container.type-menu .select-wrap {
    right: 0;
    top: calc(100% + 1.4rem)
}

/*! 카드 체크타입 추가 */

.input-checkbox-card-group {
    width: 100%
}

.input-checkbox-card-group .input-checkbox-card {
    position: relative
}

.input-checkbox-card-group .input-checkbox-card+.input-checkbox-card {
    margin-top: 1.6rem
}

.input-checkbox-card-group .input-checkbox-card input {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    opacity: 0
}

.input-checkbox-card-group .input-checkbox-card input+label {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: relative
}

.input-checkbox-card-group .input-checkbox-card input+label .card-group {
    width: 100%
}

.input-checkbox-card-group .input-checkbox-card input+label::before {
    content: '';
    display: block;
    position: absolute;
    top: 2rem;
    right: 2rem;
    width: 2.4rem;
    height: 2.4rem;
    border-radius: 99rem;
    background-color: transparent;
    background-position: center center;
    background-repeat: no-repeat;
    background-image: var(--path-solid-colored-check-ico-ter);
    background-size: 1.4rem 1.4rem;
    z-index: 1;
    border: 0.2rem solid var(--color-g300, #e0e0e0);
    -webkit-transition: border-color .3s ease-out, background-color .3s ease-out;
    -o-transition: border-color .3s ease-out, background-color .3s ease-out;
    transition: border-color .3s ease-out, background-color .3s ease-out
}

.input-checkbox-card-group .input-checkbox-card input:checked+label::before {
    background-color: var(--indigo-in1100, #0114a7);
    border-color: var(--indigo-in1100, #0114a7);
    background-position: center center;
    background-repeat: no-repeat;
    background-image: var(--path-solid-colored-check-ico-pri-invert);
    background-size: 1.4rem 1.4rem;
    z-index: 1
}

.input-checkbox-card-group .input-checkbox-card input:checked+label .card-group {
    background-color: var(--color-g100, #f8f8f8);
    border-color: var(--indigo-in1100, #0114a7)
}

.input-checkbox-card-group .input-checkbox-card .card-group .card-info .card-account-tit {
    padding-right: 2.8rem
}

.input-checkbox-card-group .input-checkbox-card .card-group .card-valid-msg {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    margin-top: .4rem
}

.input-checkbox-card-group .input-checkbox-card .card-group .card-valid-msg.error .ico-warning {
    width: 1.5rem;
    margin-right: .4rem
}

.input-checkbox-card-group .input-checkbox-card .card-group .card-valid-msg.error .txt {
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 2rem;
    color: var(--txt-pri-error)
}

.input-checkbox-card-group .input-checkbox-card input[disabled="disabled"]+label::before {
    content: '';
    display: block;
    position: absolute;
    top: 2rem;
    right: 2rem;
    width: 2.4rem;
    height: 2.4rem;
    border-radius: 99rem;
    background-color: transparent;
    background-position: center center;
    background-repeat: no-repeat;
    background-image: var(--path-checkbox-circle-disabled);
    background-size: 1.4rem 1.4rem;
    z-index: 1;
    border: 0.2rem solid var(--color-g300, #e0e0e0);
    -webkit-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out;
    background-color: var(--bg-pri-disabled)
}

.input-range-pointer-group.type1 .pointer-row.bottom .item-index .txt {
    display: block;
    width: 2.7rem;
    white-space: nowrap
}

.input-range-pointer-group.type1 .pointer-row.bottom .item-index:nth-child(4) .txt {
    text-align: center
}

.input-range-pointer-group.type1 .pointer-row.bottom .item-index:nth-child(5) .txt {
    text-align: center
}

.input-range-pointer-group.type1 .pointer-row.bottom .item-index:nth-child(6) .txt {
    text-align: right
}

.input-range-pointer-group.type1 .pointer-row.bottom {
    padding-top: 1.6rem
}

.popup-dialog.ui-bottom[data-type^="select-double"] .select-container.add-link .select-item {
    position: relative;
    padding-bottom: 1.6rem
}

.popup-dialog.ui-bottom[data-type^="select-double"] .select-container.add-link .select-item::before {
    content: "";
    display: block;
    position: absolute;
    right: 2rem;
    top: 0;
    left: 2rem;
    height: 1px;
    background-color: var(--border-qua)
}

.popup-dialog.ui-bottom[data-type^="select-double"] .select-container.add-link .select-item:first-child::before {
    display: none
}

.popup-dialog.ui-bottom[data-type^="select-double"] .select-container.add-link .area-option {
    padding: 0;
    border-bottom: 0 !important
}

.popup-dialog.ui-bottom[data-type^="select-double"] .select-container.add-link .btn-option {
    padding: 1.6rem 5.6rem 0.8rem 2rem !important
}

.popup-dialog.ui-bottom[data-type^="select-double"] .select-container.add-link .btn-option.selected:after {
    top: 2.65rem;
    right: 2rem;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none;
    margin-top: 0
}

.popup-dialog.ui-bottom[data-type^="select-double"] .select-container.add-link .btn-under-link {
    display: inline-block;
    padding: 0.8rem 2rem 0
}

.popup-dialog.ui-bottom[data-type^="select-double"] .select-container.add-link .select-item:first-child {
    margin-top: 0 !important
}

.txt-number-group {
    counter-reset: num
}

.txt-number-group.card {
    padding: 2.4rem 2rem 2.4rem;
    background: var(--bg-qua);
    border-radius: 1.6rem
}

.txt-number-group.card.type01 .txt-number-group__item {
    margin-top: 1.6rem;
    overflow: hidden;
    position: relative;
    padding: 0 0 0 4.4rem
}

.txt-number-group.card.type01 .txt-number-group__item::after {
    content: '';
    display: block;
    position: absolute;
    top: 3.6rem;
    left: 1.5rem;
    width: .2rem;
    height: 100%;
    background-color: var(--border-quin)
}

.txt-number-group.card.type01 .txt-number-group__item:last-child::after {
    display: none
}

.txt-number-group.card.type01 .txt-number-group__number {
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 2rem;
    color: var(--txt-ter);
    width: 3.2rem;
    height: 3.2rem;
    background-color: var(--bg-ter)
}

.txt-number-group.card.type01 .txt-number-group__title {
    padding-top: .3rem;
    margin-bottom: .4rem;
    font-size: 1.4rem;
    font-weight: 700;
    line-height: 2.4rem;
    color: var(--txt-sec)
}

.txt-number-group.card.type01 .txt-number-group__subtitle {
    padding-top: 0;
    font-size: 1.2rem;
    font-weight: 400;
    line-height: 1.6rem;
    color: var(--txt-qua)
}

.txt-number-group__number {
    position: absolute;
    left: 0;
    top: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 2.4rem;
    height: 2.4rem;
    background: var(--bg-accent-pri);
    color: var(--txt-pri-invert);
    border-radius: 100%
}

.txt-number-group__item {
    position: relative;
    min-height: 2.4rem;
    padding: 0 0 0 3.2rem;
    counter-increment: num;
    text-align: left
}

.txt-number-group__item:last-of-type::after {
    content: normal
}

.txt-number-group__item>[class*=btn] {
    margin-top: 0.8rem
}

.txt-number-group__item~.txt-number-group__item {
    margin-top: 2rem
}

.txt-number-group__title {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 700;
    color: var(--txt-accent-sec)
}

.txt-number-group__title:first-of-type::before {
    content: counter(num);
    position: absolute;
    left: 0;
    top: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 2.4rem;
    height: 2.4rem;
    background: var(--bg-ter);
    color: var(--txt-ter);
    border-radius: 100%
}

.txt-number-group__subtitle {
    font-size: 1.6rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--txt-sec);
    padding-top: .8rem
}

.txt-number-group__btn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-top: 2rem
}

.txt-number-group__btn>* {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

/*! tip-banner-group component-XX 자식으로 사용가능 */

.tip-banner-group {
    padding: 2rem;
    border-radius: 1.2rem;
    background-color: var(--color-grey-g100)
}

.tip-banner-header-tit {
    font-size: 1.4rem;
    font-weight: 700;
    line-height: 2rem;
    color: var(--color-grey-g900)
}

.tip-banner-txt {
    margin-top: .4rem;
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 2rem;
    color: var(--color-grey-g900)
}

.input-txt-group.line.txt-right .txt-field.right {
    margin: 0 0 0 0.8rem
}

.graybox-text-group.type7 {
    padding: 3rem 2rem;
    border-radius: 1.4rem
}

.graybox-text-group.type7 .txt-group .tit {
    margin-bottom: 1.2rem;
    font-size: 1.8rem;
    font-weight: 700;
    line-height: 2.4rem;
    color: var(--txt-pri)
}

.graybox-text-group.type7 .txt-group .txt {
    margin-bottom: 4rem;
    font-size: 1.6rem;
    line-height: 2.4rem;
    color: var(--txt-ter)
}

.graybox-text-group.type7 .txt-group .txt:last-child {
    margin-bottom: 0
}

.input-txt-group.not-readonly.readonly {
    background-color: var(--bg-base)
}

.input-txt-group.not-readonly.readonly .label-field {
    color: var(--txt-qua)
}

.input-txt-group.not-readonly.readonly input {
    color: var(--txt-pri)
}

.component-banner.gov-banner {
    margin-top: 3.2rem
}

.component-banner.gov-banner .nodata-statement-group {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 20.8rem
}

.title-group.type4 {
    padding: 2.4rem 0 .8rem !important
}

.title-group .txt-guide.txt-guide-invest {
    color: var(--txt-quin)
}

.title-group .title-field-00+.txt-guide.txt-guide-invest {
    min-height: 2.1rem;
    margin-top: 0.4rem
}

.title-group .title-field-page+.txt-guide.txt-guide-invest {
    min-height: 4.2rem;
    margin-top: 0.8rem
}

.title-group .title-field-01.has-card-graph-unit {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.title-group .title-field-01.has-card-graph-unit .card-graph-unit {
    margin-left: auto;
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 2.1rem;
    color: var(--txt-quin)
}

.graybox-text-group.tooltip-case {
    padding-top: 6.6rem
}

.graybox-text-group.tooltip-case .tooltip-focus-group {
    border-radius: 99rem
}

.graybox-text-group.tooltip-case .tooltip-focus-group .tooltip-area.small {
    padding: 0.6rem 1.6rem;
    bottom: calc(100% + 1.6rem);
    -webkit-transform: translateX(-20%);
    -ms-transform: translateX(-20%);
    transform: translateX(-20%)
}

.graybox-text-group.tooltip-case .tooltip-focus-group .tooltip-area.small .tooltip-content .txt {
    font-size: 1.1rem;
    color: var(--txt-pri)
}

.component-banner.upbit-connect {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 2.8rem 2.4rem 0 2.4rem
}

.component-banner.upbit-connect .img {
    width: 8.4rem;
    height: 8.4rem;
    margin-right: 0.6rem
}

.component-banner.upbit-connect .img img {
    max-width: 100%
}

.component-banner.upbit-connect .btn-link {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-top: 2.2rem;
    font-size: 1.4rem;
    font-weight: 500;
    line-height: 2rem;
    color: var(--txt-accent-sec)
}

.banner-group.bitcoin-mine {
    display: block;
    position: relative;
    padding: 2.4rem 2rem;
    background-color: var(--bg-ter);
    border-radius: 2rem
}

.banner-group.bitcoin-mine .txt-state {
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--txt-qua)
}

.banner-group.bitcoin-mine .txt-tit {
    margin-top: 0.2rem;
    font-size: 1.8rem;
    font-weight: bold;
    line-height: 2.4rem;
    color: var(--txt-pri)
}

.banner-group.bitcoin-mine .btn-group {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin-top: 4rem
}

.banner-group.bitcoin-mine .img-group {
    position: absolute;
    right: 2rem;
    bottom: 2.4rem;
    width: 11.5rem;
    height: 9rem
}

.banner-group.bitcoin-mine .img-group img {
    max-width: 100%
}

.input-range-pointer-group.type2 .pointer-row.bottom .item-index .txt {
    display: block;
    width: 2.7rem;
    white-space: nowrap
}

.input-range-pointer-group.type2 .pointer-row.bottom .item-index.active .txt {
    font-weight: 700;
    color: var(--txt-accent-sec)
}

.input-range-pointer-group.type2 .pointer-row.bottom {
    padding-top: 1.6rem;
    margin: 0 1rem
}

.input-range-pointer-group.type2 .input-bx {
    position: relative
}

.input-range-pointer-group.type2 .input-bx input {
    position: relative;
    z-index: 10
}

.input-range-pointer-group.type2 .input-bx .range-gap {
    border-radius: 99rem;
    position: absolute;
    width: 50%;
    height: 6px;
    display: inline-block;
    background-color: #4262ff
}

.input-range-pointer-group.type2 .input-bx .range-gap.range-gap-before {
    left: 0;
    top: 0
}

.input-range-pointer-group.type2 .input-bx .range-gap.range-gap-after {
    right: 0;
    top: 0;
    background-color: #e0e6f1
}

.input-range-pointer-group.type2 .input-bx .range-gap.range-gap-after.active {
    background-color: #4262ff
}

/*! component layout component table 간격 */

/*! component element table 공통스타일 2024-03-05 : border(--color-g200) > --border-qua, bg(--color-pb5) > --bg-ter로 변경 */

[class^="table-group"] {
    border-top: 1px solid var(--color-g700, #7d7d7d);
    border-bottom: 1px solid var(--color-g700, #7d7d7d)
}

:root [class^="table-group"] {
    border-top: 1px solid var(--border-sec, #4d596f);
    border-bottom: 1px solid var(--border-sec, #4d596f)
}

[class^="table-group"].line-ty01 {
    border-bottom: 1px solid var(--border-qua) !important
}

[class^="table-group"] table {
    width: 100%
}

[class^="table-group"] th {
    background: var(--color-pb5, #0000000C);
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400
}

[class^="table-group"] th:first-child[rowspan] {
    border-right: 1px solid var(--color-g200, #eee)
}

[class^="table-group"] th.line {
    border-left: 1px solid var(--color-g200, #eee)
}

[class^="table-group"] td {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    border-left: 1px solid var(--color-g200, #eee);
    background-color: var(--color-w100, #fff)
}

:root [class^="table-group"] th {
    background: var(--bg-ter, #edf1f7)
}

:root [class^="table-group"] th:first-child[rowspan] {
    border-right: 1px solid var(--border-qua)
}

:root [class^="table-group"] th.line {
    border-left: 1px solid var(--border-qua)
}

:root [class^="table-group"] td {
    border-left: 1px solid var(--border-qua)
}

[class^="table-group"] td:first-child {
    border-left: none
}

[class^="table-group"] td:first-child[rowspan] {
    border-right: 1px solid var(--color-g200, #eee)
}

[class^="table-group"] td.line {
    border-left: 1px solid var(--color-g200, #eee)
}

:root [class^="table-group"] td:first-child {
    border-left: none
}

:root [class^="table-group"] td:first-child[rowspan] {
    border-right: 1px solid var(--border-qua)
}

:root [class^="table-group"] td.line {
    border-left: 1px solid var(--border-qua)
}

[class^="table-group"] tfoot td {
    font-weight: 700;
    background: var(--color-pb5, #0000000C);
    color: var(--color-g900, #141414)
}

:root [class^="table-group"] tfoot td {
    background: var(--bg-ter, #edf1f7);
    color: var(--color-g900, #252b37)
}

:root [class^="table-group"] tfoot td.bg01 {
    background: var(--color-in50);
    border-left-color: var(--color-in100)
}

[class^="table-group"] .a-left,
[class^="table-group"] .align-left {
    text-align: left
}

[class^="table-group"] .a-right,
[class^="table-group"] .align-right {
    text-align: right
}

[class^="table-group"] .secondary2 {
    color: var(--color-lm500, #69b405)
}

:root [class^="table-group"] .secondary2 {
    color: var(--txt-pri-success, #039115)
}

[class^="table-group"] .secondary3 {
    color: var(--color-in700, #5c59f9)
}

.table-layout-header {
    text-align: right;
    margin-bottom: 1rem
}

.table-layout-header .txt {
    font-size: 1.2rem;
    line-height: 1.6rem;
    font-weight: 400;
    color: var(--color-g700, #7d7d7d)
}

.table-layout-footer {
    margin-top: 0.8rem
}

.table-layout-footer+.table-layout-group {
    margin-top: 2.4rem
}

.table-layout-footer .txt-row+.txt-row {
    margin-top: 0.4rem
}

.table-layout-footer .txt {
    color: var(--color-g700, #7d7d7d);
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400
}

.table-layout-footer .txt+.txt {
    margin-top: 0.4rem
}

.table-layout-footer .bl-txt-group .dash-txt-group .txt {
    color: var(--txt-qua)
}

:root [class^="table-group"].type01 tr.topline td {
    border-top: 1px solid var(--border-sec)
}

:root [class^="table-group"].type01 .blueline {
    border-left: 3px solid var(--border-accent-sec);
    border-right: 3px solid var(--border-accent-sec);
    position: relative
}

:root [class^="table-group"].type01 thead tr:first-child .blueline::before {
    width: 100%;
    height: 3px;
    background-color: var(--border-accent-sec);
    content: '';
    display: block;
    position: absolute;
    left: 0;
    top: 0
}

:root [class^="table-group"].type01 tbody tr:last-child .blueline::before {
    width: 100%;
    height: 3px;
    background-color: var(--border-accent-sec);
    content: '';
    display: block;
    position: absolute;
    left: 0;
    bottom: 0
}

[class^="table-group"].type02 th {
    background: var(--bg-qua)
}

[class^="table-group"].type02 tfoot td {
    background: var(--bg-qua)
}

/*! component element table row 타입 */

.table-group-row.scroll {
    overflow-x: auto;
    width: 100%;
    white-space: nowrap
}

.table-group-row.scroll table {
    width: auto;
    min-width: 100%
}

.table-group-row td,
.table-group-row th {
    text-align: center
}

.table-group-row th {
    padding: 1rem 0.5rem
}

.table-group-row th+th {
    border-left: 1px solid var(--color-g200, #eee);
    border-bottom: 1px solid var(--color-g200, #eee)
}

.table-group-row td {
    padding: 1rem 0.5rem;
    border-top: 1px solid var(--color-g200, #eee)
}

:root .table-group-row th+th {
    border-left: 1px solid var(--border-qua);
    border-bottom: 1px solid var(--border-qua)
}

:root .table-group-row td {
    padding: 1rem 0.5rem;
    border-top: 1px solid var(--border-qua)
}

.table-group-row .desc {
    font-size: 1.2rem;
    line-height: 1.6rem;
    font-weight: 400;
    color: var(--color-g700, #7d7d7d);
    margin-top: 0.8rem
}

/*! component element table row 타입- 일련번호타입 */

.table-group-row-secret td,
.table-group-row-secret th {
    text-align: center;
    padding: 1rem 0;
    border-bottom: 1px solid var(--color-g200, #eee);
    font-size: 1.1rem;
    line-height: 1;
    font-weight: 400
}

:root .table-group-row-secret td,
:root .table-group-row-secret th {
    border-bottom: 1px solid var(--border-qua)
}

.table-group-row-secret th {
    background: none
}

.table-group-row-secret th+td {
    border-left: 1px solid var(--color-g200, #eee)
}

.table-group-row-secret td+th {
    border-left: 1px solid var(--color-g200, #eee)
}

:root .table-group-row-secret th {
    background: none
}

:root .table-group-row-secret th+td {
    border-left: 1px solid var(--border-qua)
}

:root .table-group-row-secret td+th {
    border-left: 1px solid var(--border-qua)
}

.table-group-row-secret .dot {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    width: 0.8rem;
    height: 0.8rem;
    border-radius: 50%;
    background-color: var(--color-pb5, #0000000C)
}

.table-group-row-secret .selected {
    color: var(--color-bu900, #003fc7)
}

.table-group-row-secret .selected .dot {
    background-color: var(--color-bu900, #003fc7)
}

/*! component element table row 타입 (공과금) th,td bg-color : var(--color-g200,#EEEEEE) / line-color : var(--color-g300,#E0E0E0) */

.table-group-rowinfo table {
    width: auto;
    min-width: 100%
}

.table-group-rowinfo tr:not(:first-child) td,
.table-group-rowinfo tr:not(:first-child) th {
    border-top: 1px solid var(--color-g300, #e0e0e0)
}

.table-group-rowinfo td,
.table-group-rowinfo th {
    text-align: center
}

.table-group-rowinfo td.a-right,
.table-group-rowinfo th.a-right {
    text-align: right
}

.table-group-rowinfo th {
    padding: 1rem;
    background: var(--color-pb5, #0000000C)
}

.table-group-rowinfo th:first-child[rowspan] {
    border-right: 1px solid var(--color-g300, #e0e0e0)
}

.table-group-rowinfo th+th {
    border-left: 1px solid var(--color-g300, #e0e0e0)
}

.table-group-rowinfo td {
    padding: 1rem;
    border-top: 1px solid var(--color-g300, #e0e0e0)
}

.table-group-rowinfo tbody tr:first-child td {
    border-top: 0
}

.table-group-rowinfo td:rowspan {
    border-right: 1px solid var(--color-g300, #e0e0e0)
}

.table-group-rowinfo.table-utype-01 tr:not(:first-child) td,
.table-group-rowinfo.table-utype-01 tr:not(:first-child) th {
    border-top: 1px solid var(--color-g700, #7d7d7d)
}

/*! component element table col 타입 */

.table-group-col {
    border-top: 1px solid var(--color-g700, #7d7d7d);
    border-bottom: 1px solid var(--color-g700, #7d7d7d)
}

.table-group-col td,
.table-group-col th {
    text-align: left
}

.table-group-col td.bold,
.table-group-col th.bold {
    font-weight: bold
}

.table-group-col tr:not(:first-child) td,
.table-group-col tr:not(:first-child) th {
    border-top: 1px solid var(--color-g300, #e0e0e0)
}

.table-group-col tbody+tbody {
    border-top: 1px solid var(--color-g700, #7d7d7d)
}

.table-group-col th {
    padding: 1rem 1.2rem
}

.table-group-col td {
    padding: 1rem 1.2rem
}

.table-group-col.a-center {
    text-align: center
}

.table-group-col.a-center td,
.table-group-col.a-center th {
    text-align: center
}

.table-group-col.a-center td.a-right,
.table-group-col.a-center th.a-right {
    text-align: right
}

/*! component element table 보드타입 상세 */

.board-group-top {
    background: var(--color-w100, #fff);
    padding: 2.4rem 2rem 0
}

.board-group-top .row-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-bottom: 1.2rem
}

.board-group-top .area-state {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.board-group-top .area-state span {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g600, #9b9b9b)
}

.board-group-top .area-state span+span {
    margin-left: 0.8rem
}

.board-group-top .area-state .txt-state {
    padding-left: 0.8rem;
    position: relative;
    color: var(--color-g900, #141414)
}

.board-group-top .area-state .txt-state:before {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    top: 0.4rem;
    width: 0.1rem;
    height: 1rem;
    background: var(--color-pb5, #0000000C)
}

.board-group-top .btn-delete-post {
    display: block;
    width: 4rem;
    text-align: right
}

.board-group-top .row-title {
    padding-bottom: 2.5rem;
    border-bottom: 1px solid var(--color-g200, #eee)
}

.board-group-top .row-title .tit-borad {
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: bold;
    color: var(--color-g900, #141414)
}

.board-group-top .row-content {
    padding: 2.4rem 0 8rem
}

.board-group-top .row-content .txt {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400;
    color: var(--color-g800, #414141)
}

.board-group-top .row-content .text-list-group2 .small-tit:first-child {
    margin-top: 0
}

.board-group-top .row-content .table-layout-group .dash-txt-group .txt {
    font-size: 1.4rem
}

.board-group-top .row-content .list_type_dash {
    margin-top: 0.8rem
}

.board-group-top .row-content .list_type_dash li {
    position: relative;
    padding-left: .8rem;
    font-size: 1.4rem
}

.board-group-top .row-content .list_type_dash li:before {
    position: absolute;
    left: 0;
    top: 0;
    content: '-';
    display: block;
    font-size: inherit
}

.board-group-bottom {
    padding: 2.4rem 2rem 0;
    background: var(--color-pb5, #0000000C)
}

.board-group-bottom .row-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-bottom: 1.2rem
}

.board-group-bottom .area-state {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.board-group-bottom .area-state span {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g600, #9b9b9b)
}

.board-group-bottom .area-state span+span {
    margin-left: 0.8rem
}

.board-group-bottom .row-content .txt {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400;
    color: var(--color-g800, #414141)
}

.board-group-bottom .row-content.flex {
    margin-top: 2rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.bg-gray .board-group-bottom .list-linebox-group.prdline {
    margin-top: 0;
    padding-top: 0;
    border: none
}

.container-component.no-space .component-board .board-group-bottom,
.popup-content .component-board .board-group-bottom {
    padding-bottom: 8rem
}

.table-group-row.invest {
    border: 0
}

.table-group-row.invest th {
    text-align: left
}

.table-group-row.invest th {
    padding-bottom: 1.2rem;
    background: var(--color-w100);
    border-bottom: 1px solid var(--border-quin);
    font-size: 1.4rem;
    font-weight: 700;
    line-height: 2rem;
    color: var(--txt-ter)
}

.table-group-row.invest th+th {
    border-left: 0
}

.table-group-row.invest td {
    padding: 1rem 0;
    border-top: 0;
    border-left: 0;
    font-size: 1.5rem;
    line-height: 2rem;
    color: var(--txt-ter);
    text-align: right
}

.table-group-row.invest tbody tr:first-child td {
    padding-top: 2rem
}

.table-group-row.daily-quotes {
    border: 0
}

.table-group-row.daily-quotes th {
    padding: 1.4rem 0;
    background: var(--color-w100);
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 2rem;
    color: var(--txt-qua);
    text-align: left
}

.table-group-row.daily-quotes td {
    padding: 1.4rem 0;
    border-top: 0;
    border-left: 0;
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--txt-pri);
    text-align: right
}

/*! component element card basic type 입출금 */

.card-group {
    position: relative;
    display: block;
    background: var(--color-w100, #fff);
    border-radius: 1.2rem;
    border: 1px solid var(--color-g200, #eee);
    padding: 2rem
}

:root .card-group {
    border: 1px solid var(--border-qua, #e0e6f1)
}

.card-group.shadow {
    -webkit-box-shadow: 0 0 3rem 0 var(--color-pb5, #0000000C);
    box-shadow: 0 0 3rem 0 var(--color-pb5, #0000000C)
}

.card-group.line {
    border: none;
    border-radius: 0;
    border-bottom: 1px solid var(--color-g200, #eee);
    margin: 0
}

.card-group.line+.card-group {
    margin-top: 0
}

.card-group.noline {
    border: none;
    padding: 0
}

.card-group.border-quin {
    border-color: var(--border-quin)
}

.card-group.active {
    background-color: var(--bg-qua-active);
    border-color: var(--border-pri-active)
}

.card-group .input-checkbox.align-top {
    margin-top: 0;
    margin-bottom: auto
}

:root .card-group.noline {
    border: none;
    padding: 0
}

:root .card-group.line {
    border: none;
    border-radius: 0;
    border-bottom: 1px solid var(--color-g200, #eee);
    margin: 0
}

.card-group.ty01 {
    padding: 2.6rem 2rem
}

.card-group.ty02+.card-group.ty02 {
    margin-top: 2rem
}

.card-group.ty03 {
    border-color: var(--color-g300, #e0e0e0);
    padding: 1.6rem
}

.card-group.ty03.active {
    border: 1px solid var(--color-in1000, #1728c4);
    background-color: var(--color-g100, #f8f8f8)
}

.card-group.ty03 .card-row {
    margin-left: .4rem;
    margin-right: .4rem;
    width: calc(100% - .8rem)
}

.card-group.ty03 .card-header+.card-row {
    padding-top: 1.6rem;
    line-height: 2.1rem;
    border-top: 1px solid var(--color-g300, #e0e0e0)
}

.card-group.ty03 .card-header .card-info .card-account-sum {
    margin-top: 0
}

.card-group.ty03 .card-header .card-account-loan {
    margin-top: .2rem
}

.card-group.ty03.active .card-box-sub {
    background: var(--bg-base)
}

.card-group.ty03.disabled {
    background: var(--bg-sec-disabled) !important;
    border-color: var(--border-disabled)
}

.card-group.ty03.disabled .card-header .card-info .card-account-sum {
    color: var(--txt-quin) !important
}

.card-group.ty03.disabled .card-header .card-account-loan {
    color: var(--txt-quin) !important
}

.card-group.ty03.disabled .card-header+.card-row {
    border-color: var(--border-qua) !important
}

.card-group.ty03.disabled [class^="card-row"] .txt-info {
    color: var(--txt-quin) !important
}

.card-group.ty03.disabled [class^="card-row"] .tit-info {
    color: var(--txt-quin) !important
}

.card-group.ty03.disabled .tag.red02 .txt {
    color: var(--txt-pri-error) !important
}

.card-group.ty03.disabled.disabled .card-img-figure {
    opacity: 0.3
}

.card-group.ty04 {
    background-color: var(--bg-qua-active);
    border-color: var(--bg-qua-active) !important;
    padding: 1.6rem
}

.card-group.ty04 .card-header .card-info .card-tit+.card-txt {
    margin-top: .2rem
}

.card-group.ty04 .card-img-figure {
    margin-right: 1.2rem
}

.card-group.ty04 .card-header .card-info .card-tit {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--txt-ter) !important
}

.card-group.ty04 .card-header .card-info .card-txt {
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 500;
    color: var(--txt-pri) !important
}

.card-group.ty05 {
    padding: 1.6rem 2rem;
    background-color: var(--bg-qua-active);
    border: 0 !important;
    text-align: center
}

.card-group.ty05 .card-header .card-info .card-txt {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-top: 0
}

.card-group.ty05 .card-header .card-info .card-txt [class^="ico-"] {
    margin-right: .4rem
}

.card-group.ty06 {
    border: 0 !important;
    text-align: center
}

.card-group.ty06 .card-account-tit {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.card-group.ty06 .r-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 2.4rem;
    height: 2.4rem;
    min-height: 2.4rem;
    margin-right: .8rem;
    background-color: var(--bg-ter);
    border-radius: 100%
}

.card-group.ty06 .r-box .ico-plus {
    display: block;
    width: 1.2rem;
    height: 1.2rem;
    background-size: contain;
    border-radius: 100%
}

.card-group.ty07 {
    padding-bottom: 1.6rem
}

.card-group.ty07 .card-header {
    margin-bottom: .4rem
}

.card-group.ty07 .card-header .card-loan .card-tit {
    font-size: 1.6rem;
    line-height: 2rem;
    font-weight: 500
}

.card-group.ty07 .card-row-info {
    border-top: 0.1rem solid var(--border-qua)
}

.card-group.ty07 .card-header+.card-row-info {
    margin-top: 2rem
}

.card-group.ty07 .card-row-info .txt {
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--txt-ter)
}

.card-group.ty07 .link-header {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.card-group.ty07 .card-row-info .tag .txt {
    font-size: 1.1rem;
    line-height: 100%
}

.card-group.ty07 .card-row-info .tag.negative .txt {
    color: var(--txt-pri-error)
}

.card-group.ty08 {
    padding: 1.6rem 1.4rem;
    background: var(--bg-qua);
    border-color: var(--border-quin)
}

.card-group.ty08+.card-group.ty08 {
    margin-top: 1.2rem
}

.card-group.ty08 .card-header {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.card-group.ty08 .card-header .ico-check-line {
    width: 1.9rem;
    height: 1.9rem;
    margin-right: 1.2rem;
    -webkit-filter: var(--filter-bu700);
    filter: var(--filter-bu700)
}

.card-group.ty08 .card-header .card-info .card-tit {
    font-size: 1.6rem;
    line-height: 2.1rem
}

.card-group.ty08 .card-header .card-info .card-tit span {
    color: var(--color-bu700)
}

.card-group.ty08 .card-header .card-info .card-txt {
    margin-top: .4rem;
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--color-g700)
}

.card-group.ty09 {
    padding: 2rem 2rem 2.4rem;
    background: var(--bg-qua);
    border: 0 !important
}

.card-group.ty09 .bl-txt-group .txt {
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--txt-ter);
    word-break: keep-all
}

.card-group.ty10 {
    padding: 2.4rem 2rem;
    background: var(--bg-qua);
    border: 0 !important;
    border-radius: 1.6rem
}

.card-group.ty10 .bl-txt-group .txt {
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--txt-ter);
    word-break: keep-all
}

.card-group.ty10>.txt-lv03 {
    margin-top: .4rem;
    color: var(--txt-ter);
    font-weight: bold
}

.card-group.ty10 .bg-number-group {
    margin-top: 1.6rem
}

.card-group.ty10 .bg-number-group.large .count {
    padding-left: 4.4rem;
    padding-bottom: 2.35rem
}

.card-group.ty10 .bg-number-group .txt-lv02 {
    margin-top: .4rem;
    color: var(--txt-qua)
}

.card-group.ty10 .bg-number-group.large .count:last-child {
    padding-bottom: 0
}

.card-group.ty11 {
    padding: 1.6rem 2rem
}

.card-group.ty11 [class^="card-row"] .card-col-tit {
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 2rem;
    color: var(--txt-pri)
}

.card-group.ty11 [class^="card-row"] .card-col-content {
    font-size: 1.4rem;
    font-weight: 700;
    line-height: 2rem;
    color: var(--txt-pri)
}

.card-group.ty11 [class^="card-row"]+.card-row-infobox {
    margin-top: .8rem
}

.card-group.type2 {
    border: 0;
    border-radius: 1.6rem;
    padding: 2rem
}

.card-group.type2 .title-field-21 {
    color: var(--color-in800, #4946f7)
}

.card-group.type2 .title-field-21 .ico-edit {
    width: 2rem;
    height: 2rem;
    -webkit-filter: var(--filter-in800);
    filter: var(--filter-in800)
}

.card-group.type2 .list-infobox-group {
    margin-top: 4rem
}

.card-group.type2 .list-infobox-group .list-item.total {
    padding-top: 1.6rem;
    border-top: 1px solid var(--color-g200, #eee)
}

.card-group.type2 .list-infobox-group .area-desc,
.card-group.type2 .list-infobox-group .area-desc * {
    font-size: 1.6rem;
    font-weight: 700
}

.card-group.type2 .list-infobox-group .emoji {
    margin-right: 0.6rem
}

.card-group.type2 .list-infobox-group .item-txt {
    text-align: right;
    margin-top: 0.4rem;
    color: var(--color-in700, #5c59f9)
}

.card-group.type2 .txt-count-wrap .number-rolling.active .num:before {
    -webkit-animation-delay: .1s;
    animation-delay: .1s;
    -webkit-animation-duration: 1s;
    animation-duration: 1s
}

.card-group.type2 .txt-count-wrap .number-rolling.active .num+.num:before {
    -webkit-animation-delay: .2s;
    animation-delay: .2s
}

@media only screen and (min-height: 812px) {
    .card-group.type2.fixed-bottom {
        position: fixed !important;
        bottom: 11.2rem;
        left: 2rem;
        right: 2rem
    }
}

.card-group.type3 .card-row-txt+.card-row-txt {
    margin-top: 0.8rem
}

.card-group.type3 .card-col-content .btn-under-link.type2 {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400
}

.card-group.type3 .deco {
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 2rem;
    color: var(--color-w70, rgba(255, 255, 255, 0.7))
}

.card-group.type5 {
    padding: 2.4rem 2rem
}

.card-group.type5 .card-row-progress {
    margin-top: 2.4rem
}

.card-group.type5 .card-row-txt {
    margin-top: 0.8rem
}

.card-group.type5 .card-header+.card-row-txt {
    margin-top: 1.6rem
}

.card-group.type5 [class^="card-row"] .card-col-tit {
    font-size: 1.4rem;
    color: var(--color-w70, #fffFFFB2);
    line-height: 2rem
}

.card-group.type5 [class^="card-row"] .card-col-content {
    font-size: 1.4rem
}

.card-group.type5.white {
    margin-top: 2.4rem
}

.card-group.type5.white .ico-calendar+.txt-btn {
    margin-left: -0.3rem
}

.card-group.type5.white .card-header .card-info .card-account-tit .deco,
.card-group.type5.white [class^="card-row"] .card-col-tit {
    color: var(--color-g700, #7d7d7d)
}

.card-group.type5.white .card-header .card-info .card-account-tit .txt-point .txt-count-wrap.f-18 {
    min-width: 1.1rem
}

.card-group.type6 {
    width: 100%;
    text-align: left;
    padding: 1.85rem 0
}

.card-group.type6:last-child {
    border: none
}

.card-group.type6 .txt-lv5 {
    color: var(--txt-pri)
}

.card-group.type7 .txt-point {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400
}

.card-group.type7 .card-row-tit {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g700);
    margin-bottom: .8rem
}

.card-group.type7 .card-row-tit {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g700);
    margin-bottom: .8rem
}

.card-group.type7 .card-row .card-col-group .date {
    font-size: 1.4rem;
    font-weight: 700;
    line-height: 2.3rem;
    color: var(--color-pn)
}

.card-group.type7 .card-row .card-col-group .sum {
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--txt-pri-active)
}

.card-group.type7 .card-info {
    margin-left: 1.2rem
}

.card-group.type8+.btn-group {
    margin-top: 2.4rem
}

.card-group.type8 .card-row+.card-row {
    margin-top: 0
}

.card-group.type8 .card-row:first-child {
    border-bottom: 1px solid var(--border-qua);
    padding-bottom: 1.6rem;
    margin-bottom: 1.6rem
}

.card-group.type8 .card-row .card-col-group .card-row-content .sum {
    font-size: 1.4rem;
    color: var(--txt-pri)
}

.card-group.type8 .card-row .card-col-group .card-row-content .sum.dsr {
    color: var(--txt-accent-sec)
}

.card-group.type8 .card-row .card-col-group .card-row-content span {
    font-size: 2.1rem;
    line-height: 2.7rem
}

.card-group.type9 {
    margin-top: 1.2rem;
    padding: 2rem 2.4rem;
    border-radius: 2rem;
    border: 1px solid var(--border-img);
    background-color: var(--bg-qua)
}

.card-group.type9 .card-header .card-info .card-txt {
    line-height: 2.7rem
}

.card-group.type9 .card-header .card-img-figure [class*="ico"],
.card-group.type9 .card-header .card-img-figure [class*="log"] {
    margin-right: 1.6rem;
    border: 1px solid var(--border-img)
}

.card-group.type10 {
    border-color: var(--color-w15);
    background: var(--color-w15)
}

.card-group.bg-gray.type8 {
    padding: 2.4rem 2rem 1.6rem
}

.card-group.bg-gray.type8 .card-account-tit span {
    margin-right: 0.2rem
}

.card-group.bg-gray.type8 .tooltip-group {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex
}

.card-group.bg-gray.type8 .tooltip-group .ico-help {
    width: 2rem;
    height: 2rem;
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

.card-group.bg-gray.type8 .card-header+.card-row {
    margin-top: 0.8rem
}

.card-group.bg-gray.type9 {
    padding: 1.6rem 2rem;
    border-radius: 1.2rem
}

.card-group.bg-gray.type9 .card-tit .tit {
    margin-left: 1rem;
    font-size: 1.5rem;
    color: var(--color-g800);
    line-height: 2rem;
    font-weight: bold
}

.card-group.bg-gray.type9 .card-tit .ico-coin {
    width: 2rem;
    height: 2rem;
    -webkit-filter: var(--filter-in700);
    filter: var(--filter-in700);
    margin-top: -0.3rem
}

.card-group.bg-gray.type10 {
    padding-right: 1.6rem
}

.card-group.bg-gray.type10 .card-header .card-info .card-tit {
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: bold;
    color: var(--color-g800, #3b4659)
}

.card-group.bg-gray.type10 .card-header .card-info .card-tit+.card-txt {
    margin-top: 0.2rem
}

.card-group.bg-gray.type10 .card-header .card-info .card-txt {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g700, #4d596f)
}

.card-group .card-header .card-img-figure .ico-bond-percent {
    margin-right: 1.2rem
}

.card-group.bg-coolgray2 {
    background: var(--color-cg500, #e6ebf5);
    border: none
}

.card-group.bg-coolgray3 {
    background: var(--color-cg400, #ebecf0);
    border: none
}

.card-group.bg-cg300 {
    background: var(--color-cg300, #f1f6fb);
    border: none
}

.card-group.bg-gray {
    background-color: var(--color-g100, #f8f8f8);
    border: none
}

.card-group.bg-gray2 {
    background-color: var(--color-g100, #f8f8f8);
    border: none
}

.card-group.bg-gray2 {
    background-color: var(--color-g100, #f8f8f8);
    border: none
}

.card-group.bg-primary1 {
    background-color: var(--color-pn, #17008c);
    border: none
}

.card-group.bg-qua {
    background-color: var(--bg-qua);
    border: none
}

.card-group.bg-ter {
    background-color: var(--bg-ter);
    border: none
}

:root .card-group.bg-coolgray2 {
    background: var(--color-cg500, #e6ebf5);
    border: none
}

:root .card-group.bg-coolgray3 {
    background: var(--color-cg400, #ebecf0);
    border: none
}

:root .card-group.bg-cg300 {
    background: var(--color-cg300, #f1f6fb);
    border: none
}

:root .card-group.bg-gray {
    background-color: var(--color-g100, #f8f8f8);
    border: none
}

:root .card-group.bg-gray2 {
    background-color: var(--color-g100, #f8f8f8);
    border: none
}

:root .card-group.bg-gray2 {
    background-color: var(--color-g100, #f8f8f8);
    border: none
}

:root .card-group.bg-primary1 {
    background-color: var(--color-pn, #17008c);
    border: none
}

:root .card-group.bg-primary1 {
    background-color: var(--color-indigo-in1000, #1728c4);
    border: none
}

:root .card-group.border-qua {
    border: 0.1rem solid var(--border-qua)
}

.card-group.bg-qua.type1+.card-group.bg-qua.type1 {
    margin-top: 1.2rem
}

.card-group.bg-qua.type1 .card-row {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 1.2rem;
    margin-top: 0
}

.card-group.bg-qua.type1 .card-row .img img {
    width: 4.8rem;
    height: 4.8rem
}

.card-group.bg-qua.type1 .card-row .txt-tit {
    margin-bottom: 0.4rem;
    font-size: 1.6rem;
    font-weight: 500;
    line-height: 2.1rem;
    color: var(--txt-pri)
}

.card-group.bg-qua.type1 .card-row .txt-lv03 {
    color: var(--txt-ter)
}

.card-group.bg-qua.type2 {
    padding: 1.6rem
}

.card-group.bg-qua.type2 .card-header .card-info .card-tit {
    font-size: 1.4rem;
    font-weight: bold;
    line-height: 2rem;
    color: var(--txt-qua)
}

.card-group.bg-qua.type2 .card-header .card-info .card-tit [class^="ico-"] {
    margin-right: 0.4rem
}

.card-group.bg-qua.type2 .card-header .card-info .status {
    font-size: 1.4rem;
    font-weight: bold;
    line-height: 2rem;
    color: var(--txt-sec)
}

.card-group.bg-qua.type2 [class^="card-row"].list-type {
    margin-top: 1.2rem
}

.card-group.bg-qua.type2 [class^="card-row"].list-type .card-tit {
    font-size: 1.8rem;
    line-height: 2.5rem;
    color: var(--txt-sec)
}

.card-group.bg-qua.type2 [class^="card-row"].list-type .card-txt {
    margin-top: 1.2rem;
    font-size: 1.6rem;
    line-height: 2.1rem;
    color: var(--txt-ter)
}

.card-group.list-type {
    margin-top: 2rem;
    padding: 0;
    border: 0
}

.card-group.list-type .list-item-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 1rem
}

.card-group.list-type .list-item {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 1.6rem 0;
    border-radius: 1.6rem;
    border: 1px solid var(--border-img);
    background-color: var(--bg-qua)
}

.card-group.list-type .list-item .card-tit {
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--txt-qua)
}

.card-group.list-type .list-item [class^="ico-"] {
    width: 3.6rem;
    height: 3.6rem;
    margin-top: 1.2rem
}

.card-group.list-type .list-item .ico-heart {
    margin: 0 0 0.8rem
}

.card-group.list-type .list-item.active {
    background-color: rgba(239, 88, 151, 0.05)
}

.card-group.list-type .list-item.active .card-tit {
    color: var(--ico-pri-like)
}

.card-group.list-type .list-item.active [class^="ico-"] {
    -webkit-filter: var(--filter-ico-pri-like);
    filter: var(--filter-ico-pri-like)
}

.card-group.list-type .list-item.active:only-child {
    padding: 1.8rem 0
}

.card-group.list-type .list-item.active:only-child [class^="ico-"] {
    -webkit-filter: var(--filter-ico-pri-like);
    filter: var(--filter-ico-pri-like)
}

.card-group.list-type .txt-icon.type1 {
    margin: 2rem 0
}

.card-group.list-type.type1 .list-item {
    border: 0
}

.card-group.list-type.type1 .list-item.active {
    background-color: var(--bg-banner-in)
}

.card-group.list-type.type1 .list-item.active .card-tit {
    color: var(--txt-accent-sec)
}

.card-group.list-type.type1 .list-item.active [class^="ico-"] {
    -webkit-filter: var(--filter-pl);
    filter: var(--filter-pl)
}

.card-group.form-toggle-group .form-toggle-align .form-toggle-label {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.card-group.form-toggle-group .card-row {
    padding-top: 2.4rem
}

.section-component .card-group.chatbot-type .card-box-sub.type2 {
    display: none
}

.section-component.ani-quizebot .card-group.chatbot-type .card-box-sub.type2 {
    display: block
}

.section-component.ani-quizebot .card-group.chatbot-type .card-box-sub.type2 .ico-dot-hori {
    width: 3.4rem;
    height: 3.4rem
}

.card-group.chatbot-type {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding: 0;
    border: 0
}

.card-group.chatbot-type .card-box-sub {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    min-height: 4.5rem;
    padding: 1.2rem 1.6rem;
    border-radius: 1rem;
    background-color: var(--bg-ter);
    font-size: 1.4rem;
    font-weight: 700;
    line-height: 2.1rem;
    color: var(--txt-ter)
}

.card-group.chatbot-type .card-box-sub.type1 {
    margin: 0 0 0 auto;
    background-color: var(--bg-accent-pri);
    line-height: 2rem;
    color: var(--txt-pri-invert)
}

.card-group.chatbot-type .card-box-sub.type2 {
    width: 6.6rem;
    text-align: center
}

.card-group.chatbot-type .card-img-row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 0.8rem;
    margin-top: 2rem
}

.container-component .section-component .card-group.chatbot-type .card-box-sub.type2 {
    display: block
}

[keyframe-chaining] {
    opacity: 0
}

[keyframe-chaining="fade-out"],
[keyframe-chaining="typing"] {
    opacity: 1
}

.card-box-sub-wrap {
    display: block
}

.card-box-sub-wrap.fade-out-hide {
    display: none
}

.card-box-sub .txt,
.txt-lv02 {
    position: relative
}

.card-box-sub .txt>.ani-txt,
.txt-lv02>.ani-txt {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1
}

.card-box-sub .txt>.dummy,
.txt-lv02>.dummy {
    opacity: 0;
    pointer-events: none
}

.card-box-sub .txt>.ani-txt,
.card-box-sub .txt>.dummy {
    font-size: 1.4rem;
    font-weight: 700;
    line-height: 2.1rem;
    color: var(--txt-ter)
}

.txt-lv02>.ani-txt,
.txt-lv02>.dummy {
    font-size: 1.5rem !important;
    line-height: 2rem;
    font-weight: 400
}

.card-group.chatbot-type.type2 .card-box-sub.type2 {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 1.2rem 1.6rem
}

.card-group.chatbot-type.type2 .card-box-sub {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-top: 1.6rem;
    padding: 2.4rem 0;
    border-radius: 0 1.6rem 1.6rem 1.6rem
}

.card-group.chatbot-type.type2 .card-box-sub li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 0 1.6rem 0 1.6rem;
    font-size: 1.5rem;
    font-weight: 400;
    line-height: 2rem
}

.card-group.chatbot-type.type2 .card-box-sub li+li {
    margin-top: 1.4rem
}

.card-group.chatbot-type.type2 .card-box-sub span {
    line-height: 1.2rem;
    color: var(--txt-accent-sec)
}

.card-group.chatbot-type.type2 .card-box-sub .txt {
    padding-left: 0.8rem;
    color: var(--txt-pri)
}

.card-group.bg-primary1 *,
.card-group.bg-primary1 [class^="card-row"] .card-col-content {
    color: var(--color-w100, #fff)
}

.card-group.chk-bd.active {
    border: 1px solid var(--color-bu900, #003fc7)
}

.card-group.attach .card-header .card-info .card-tit {
    font-size: 1.6rem;
    line-height: 2.1rem;
    color: var(--txt-sec)
}

.card-group.attach .card-header .card-info .card-tit .card-tit-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    width: 90%
}

.card-group.attach .card-header .card-info .card-tit .card-tit-wrap .tit {
    margin-right: 0.4rem
}

.card-group.attach .card-header .ico-arrow-link {
    position: absolute;
    top: 0.25rem;
    right: 0;
    width: 1.6rem;
    height: 1.6rem
}

.card-group.attach .card-header .card-info .card-desc {
    margin-top: 1.2rem;
    color: var(--txt-quin)
}

.card-group+.card-group {
    margin-top: 1.6rem
}

.card-group+.form-group {
    margin-top: 1.6rem
}

.card-group+.title-group {
    margin-top: 4.8rem
}

.card-group+.btn-group {
    margin-top: 1.6rem
}

.card-group+.btn-group.center {
    margin-top: 2.4rem;
    text-align: center
}

.card-group .card-header {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.card-group .card-header.line {
    border-bottom: 1px solid var(--color-g200, #eee);
    padding-bottom: 1.6rem;
    margin-bottom: 1.6rem
}

.card-group .card-header .btn-quick-more {
    position: absolute;
    top: 0;
    right: -1rem
}

.card-group .card-header+.card-row-info {
    margin-top: 1.6rem
}

.card-group .card-header .card-img-figure {
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.card-group .card-header .card-img-figure [class*="ico-main-card"],
.card-group .card-header .card-img-figure [class*="logo-card"] {
    margin-right: 1.2rem
}

.card-group .card-header .card-img-figure.cert {
    margin-right: 1.6rem;
    min-width: 6rem
}

.card-group .card-header .card-img-figure [class*="logo-bank"],
.card-group .card-header .card-img-figure [class*="logo-etc"] {
    margin-right: 1.2rem
}

.card-group .card-header .card-img-figure [class*="logo-bank"].w20,
.card-group .card-header .card-img-figure [class*="logo-etc"].w20 {
    margin-right: 0.8rem
}

.card-group .card-header .card-img-figure [class*="logo-bank"].small,
.card-group .card-header .card-img-figure [class*="logo-etc"].small {
    margin-right: 1rem
}

.card-group .card-header .card-img-figure [class*="logo-apt"],
.card-group .card-header .card-img-figure [class*="logo-pay"] {
    margin-right: 1.2rem
}

.card-group .card-header .card-img-figure .ico-add,
.card-group .card-header .card-img-figure .ico-add-wbk {
    margin-right: 1.2rem
}

.card-group .card-header .card-img-figure [class*="ico-pb"] {
    margin-right: 1.2rem
}

.card-group .card-header .card-img-figure .card-account-loan {
    vertical-align: middle;
    margin-top: 0;
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400
}

.card-group .card-header .card-img-figure .ico-main-card img {
    width: 100%
}

.card-group .card-header .card-img-figure.double {
    position: relative;
    width: 3.4rem;
    height: 3.4rem;
    margin-right: 1.2rem
}

.card-group .card-header .card-img-figure.double [class^="logo-bank"] {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    margin: 0 !important;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.card-group .card-header .card-img-figure.double [class^="logo-bank"]:first-of-type {
    left: 0
}

.card-group .card-header .card-img-figure.double [class^="logo-bank"]:last-of-type {
    right: 0
}

.unregistered-group {
    margin-right: 1.2rem
}

.item-unregistered {
    position: relative;
    width: 3.4rem;
    height: 3.4rem;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-transform: perspective(30rem) rotateY(0);
    transform: perspective(30rem) rotateY(0)
}

.item-unregistered.ty2 {
    width: 2.8rem;
    height: 4.4rem
}

.item-unregistered.ty3 {
    width: 4.4rem;
    height: 4.4rem
}

.item-unregistered [class^="logo-"] {
    position: absolute;
    top: 0;
    left: 0;
    margin-right: 0 !important;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    opacity: 0
}

.item-unregistered [class^="logo-"].active {
    z-index: 1;
    opacity: 1
}

.item-unregistered [class^="logo-"]:nth-child(2n) {
    -webkit-transform: rotateY(180deg);
    transform: rotateY(180deg)
}

.item-unregistered.active {
    -webkit-animation: unregisteredFlip 4s ease-in-out infinite;
    animation: unregisteredFlip 4s ease-in-out infinite
}

@-webkit-keyframes unregisteredFlip {
    0% {
        -webkit-transform: perspective(30rem) rotateY(0);
        transform: perspective(30rem) rotateY(0)
    }
    40% {
        -webkit-transform: perspective(30rem) rotateY(200deg);
        transform: perspective(30rem) rotateY(200deg)
    }
    50% {
        -webkit-transform: perspective(30rem) rotateY(180deg);
        transform: perspective(30rem) rotateY(180deg)
    }
    90% {
        -webkit-transform: perspective(30rem) rotateY(380deg);
        transform: perspective(30rem) rotateY(380deg)
    }
    100% {
        -webkit-transform: perspective(30rem) rotateY(360deg);
        transform: perspective(30rem) rotateY(360deg)
    }
}

@keyframes unregisteredFlip {
    0% {
        -webkit-transform: perspective(30rem) rotateY(0);
        transform: perspective(30rem) rotateY(0)
    }
    40% {
        -webkit-transform: perspective(30rem) rotateY(200deg);
        transform: perspective(30rem) rotateY(200deg)
    }
    50% {
        -webkit-transform: perspective(30rem) rotateY(180deg);
        transform: perspective(30rem) rotateY(180deg)
    }
    90% {
        -webkit-transform: perspective(30rem) rotateY(380deg);
        transform: perspective(30rem) rotateY(380deg)
    }
    100% {
        -webkit-transform: perspective(30rem) rotateY(360deg);
        transform: perspective(30rem) rotateY(360deg)
    }
}

.card-group .card-header .card-account-loan {
    color: var(--color-g700, #7d7d7d);
    margin-top: 0.4rem;
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400
}

.card-group .card-header .card-info {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    width: 100%
}

.card-group .card-header .card-info.center {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center
}

.card-group .card-header .card-info .card-tit {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: bold
}

.card-group .card-header .card-info .card-tit+.card-txt {
    margin-top: 0.4rem
}

.card-group .card-header .card-info .card-txt {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400;
    color: var(--color-g700, #7d7d7d)
}

:root .card-group .card-header .card-info .card-txt {
    color: var(--txt-qua, #67748e)
}

.card-group .card-header .card-info .card-txt.black {
    color: var(--color-g900, #141414)
}

.card-group .card-header .card-info .card-txt.primary1 {
    color: var(--color-pn, #17008c)
}

.card-group .card-header .card-info .bar {
    position: relative;
    margin-left: 0.8rem;
    padding-left: 0.8rem
}

.card-group .card-header .card-info .bar:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.4rem;
    width: 0.1rem;
    height: 1.2rem;
    background-color: var(--color-g300, #e0e0e0)
}

.card-group .card-header .card-info.type02 .card-tit {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: bold
}

.card-group .card-header .card-info.type02 .card-tit+.card-txt {
    margin-top: 0.2rem
}

.card-group .card-header .card-info.type02 .tag {
    margin-left: 0.5rem
}

.card-group .card-header .card-info.type02 .card-txt {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g600, #9b9b9b)
}

.card-group .card-header .card-info .card-account-tit {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 500;
    width: 100%
}

.card-group .card-header .card-info .card-account-tit .ell {
    display: -webkit-box;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2
}

:root .card-group .card-header .card-info .card-account-tit {
    color: var(--txt-pri, #020616)
}

.card-group .card-header .card-img-figure+.card-info .card-account-tit>span {
    font-weight: 500
}

.card-group .card-header .card-info .card-account-tit>span.bold {
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: calc(100% - 60px)
}

.card-group .card-header .card-info .card-account-tit.darkgray {
    color: var(--color-g900, #141414)
}

.card-group .card-header .card-info .card-account-tit.ty01 {
    font-size: 1.5rem;
    line-height: 2rem;
    color: var(--color-g800, #414141)
}

.card-group .card-header .card-info .card-account-tit.ty02 {
    font-size: 1.5rem;
    line-height: 2rem;
    color: var(--color-g700, #7d7d7d);
    font-weight: 400
}

.card-group .card-header .card-info .card-account-tit .tit-state {
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 21rem
}

.card-group .card-header .card-info .card-account-tit .tit-tagstate {
    max-width: calc(100% - 60px);
    word-break: keep-all
}

.card-group .card-header .card-info .card-account-tit .txt-point {
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: bold
}

.card-group .card-header .card-info .card-account-tit .txt-point .ico-calendar {
    margin-top: -0.2rem
}

.card-group .card-header .card-info .card-account-tit .txt-addr {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: bold
}

.card-group .card-header .card-info .card-account-tit .tag {
    margin-left: 0.5rem
}

.card-group .card-header .card-info .card-account-tit+.card-cert-txt {
    margin-top: 0.8rem
}

.card-group .card-header .card-info .card-account-tit+.card-state-txt {
    margin-top: 0.8rem
}

.card-group .card-header .card-info .card-account-tit>span+.warning {
    margin-left: auto
}

.card-group .card-header .card-info .card-account-tit .deco {
    font-size: 1.4rem;
    color: var(--color-w70, #fffFFFB2);
    font-weight: 400
}

.card-group .card-header .card-info .card-account-tit1 .tit1 {
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: 700;
    color: var(--txt-pri)
}

.card-group .card-header .card-info .card-account-tit2 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    text-align: left
}

.card-group .card-header .card-info .card-account-tit2 .tit1 {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 500;
    color: var(--txt-pri)
}

.card-group .card-header .card-info .card-account-tit2 .tit2 {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--txt-ter)
}

.card-group .card-header .card-info .card-account-num {
    margin-top: 0.2rem;
    color: var(--color-g600, #9b9b9b);
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400
}

.card-group .card-header .card-info .card-txt {
    margin-top: 0.2rem;
    color: var(--color-g800, #414141);
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400
}

.card-group .card-header .card-info .card-desc {
    margin-top: 0.2rem;
    color: var(--color-g700, #7d7d7d);
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400
}

.card-group .card-header .card-info .card-cert-txt {
    margin-top: 0.2rem;
    color: var(--color-g600, #9b9b9b);
    font-size: 1.2rem;
    line-height: 1.6rem;
    font-weight: 400
}

.card-group .card-header .card-info .card-cert-txt .txt {
    padding-left: 0.4rem
}

.card-group .card-header .card-info .card-cert-txt .warning {
    color: var(--color-re700, #f02727);
    padding-left: 0.4rem
}

.card-group .card-header .card-info .card-state-txt {
    color: var(--color-g600, #9b9b9b);
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400
}

.card-group .card-header .card-info .card-dsr-txt {
    margin-top: 0.4rem;
    color: var(--txt-ter);
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400
}

.card-group .card-header .card-info .card-state-txt.secondary1-1 {
    color: var(--color-bu800, #0150ff)
}

.card-group .card-header .card-info .card-state-txt.warning {
    color: var(--color-re700, #f02727)
}

.card-group .card-header .card-info .card-state-txt .black {
    color: var(--color-g900, #141414)
}

.card-group .card-header .card-info .card-state-txt+.card-account-tit {
    margin-top: 0.8rem
}

.card-group .card-header .card-info .card-account-sum {
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: bold;
    margin-top: 0.4rem;
    color: var(--color-g900, #141414)
}

.card-group .card-header .card-info .card-account-sum.ty01 {
    font-size: 1.6rem;
    line-height: 2.1rem;
    margin-top: .2rem
}

.card-group .card-header .card-info .card-info-sum {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: bold;
    margin-top: 0.4rem;
    color: var(--color-g900, #141414)
}

.card-group .card-header .card-info .status {
    position: absolute;
    right: 0;
    top: 0.2rem
}

.card-group .card-header .card-info .status .darkgray-2 {
    color: var(--color-g700, #7d7d7d)
}

.card-group .card-header .card-info .status .warning {
    color: var(--color-re700, #f02727)
}

.card-group .card-header .card-info .status .secondary1-1 {
    color: var(--color-bu800, #0150ff)
}

.card-group .card-header .card-info+.ico-arrow-link {
    margin-left: 1.6rem
}

.card-group .card-header .card-info+.input-checkbox {
    margin-left: 1rem
}

.card-group.folding-wrap {
    position: relative
}

.card-group.folding-wrap .status {
    position: absolute;
    top: 2rem;
    right: 2rem
}

.card-group .card-header .card-info .card-tit .tit.f16 {
    font-size: 1.6rem;
    line-height: 2.1rem
}

.card-group .card-header .card-info .tag+.card-tit-area {
    margin-top: 1.2rem
}

.card-group .card-header .card-info .ellipsis {
    max-width: 100%;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap
}

.card-group .card-header .card-info .tit-sub {
    font-size: 1.2rem;
    line-height: 1.6rem;
    font-weight: 500;
    color: var(--color-g600, #9b9b9b);
    margin-left: 0.8rem
}

.card-group [class^="card-row"] .card-col-group .card-row-infoline {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-top: 0.8rem;
    font-size: 1.4rem;
    line-height: 2rem
}

.card-group [class^="card-row"] .card-col-group .card-row-infoline [class^="ico"] {
    width: 1.2rem;
    height: 1.2rem;
    margin-right: 0.4rem
}

.card-group [class^="card-row"] .card-col-group .card-row-infoline.down * {
    color: var(--color-bu700, #047af1)
}

.card-group [class^="card-row"] .card-col-group .card-row-infoline.down [class^="ico"] {
    -webkit-filter: var(--filter-bu700);
    filter: var(--filter-bu700)
}

.card-group [class^="card-row"] .card-col-group .card-row-infoline.up * {
    color: var(--color-re700, #f02727)
}

.card-group [class^="card-row"] .card-col-group .card-row-infoline.up [class^="ico"] {
    -webkit-filter: var(--filter-re700);
    filter: var(--filter-re700)
}

.card-group [class^="card-row"] .card-col-group .card-row-infoline.none * {
    color: var(--color-g600, #9b9b9b)
}

.card-group [class^="card-row"] .card-col-group .card-col.stock-graph {
    width: 10.8rem;
    margin: 0 0.8rem
}

.card-group [class^="card-row"]+.card-row-info .data-info {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.card-group [class^="card-row"]+.card-row-info .data-info dt {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 500;
    color: var(--color-g500, #b8b8b8)
}

.card-group [class^="card-row"]+.card-row-info .data-info dd {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 500;
    color: var(--color-g800, #414141)
}

.un-stock-list .card-group .card-header .card-info .ellipsis {
    max-width: 20rem
}

.un-stock-list .card-group [class^="card-row"]+.card-row-info {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.un-stock-list .card-group [class^="card-row"]+.card-row-info .data-info {
    width: 47%
}

.un-stock-list .card-group [class^="card-row"]+.card-row-info .data-info:nth-child(2n) {
    margin-left: 1.6rem
}

.un-stock-list .card-group [class^="card-row"] .card-col-group .card-col {
    width: auto
}

.un-stock-list .card-group [class^="card-row"] .card-col-group .sum.strong {
    font-size: 2.1rem;
    line-height: 2.7rem;
    color: var(--color-g800, #414141)
}

.card-group .card-header .input-checkbox+.card-info {
    margin-left: 1.6rem
}

.card-group .card-header .card-info .card-account-num.txt-lv05 {
    margin-top: 0.8rem;
    font-size: 1.8rem;
    line-height: 2.5rem;
    color: var(--color-g900, #141414);
    font-weight: 700
}

.card-group-table {
    padding: 2.6rem 2rem;
    background-color: var(--color-g100, #f8f8f8);
    border-radius: 1rem
}

.card-group-table table {
    width: 100%
}

.card-group-table table th {
    text-align: left;
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 700;
    color: var(--color-g800, #414141);
    padding-bottom: 1.6rem;
    border-bottom: 1px solid var(--color-g300, #e0e0e0)
}

.card-group-table table tbody tr:first-child td {
    padding-top: 1.6rem
}

.card-group-table table td {
    text-align: left;
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400;
    color: var(--color-g800, #414141);
    padding-top: 2rem
}

.component-card.account-rate-list {
    margin-top: 3.2rem
}

.component-card.account-rate-list .title-group+.card-group {
    margin-top: 1.6rem
}

.card-group .card-header .card-info-tip {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.card-group .card-header .card-info-tip [class^="ico"] {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

.card-group .card-header .card-info-tip .ico-arrow-link {
    width: 1.6rem;
    height: 1.6rem;
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700);
    margin-left: 0
}

.card-group .card-header .card-info-tip .tooltip-group+[class^="input-"] {
    margin-left: 1.2rem
}

.card-group .card-header .ico-arrow-link {
    width: 2rem;
    height: 2rem;
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

:root .card-group .card-header .ico-arrow-link {
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

.card-group .card-header .ico-arrow-link.ty01 {
    width: 1.6rem;
    height: 1.6rem;
    -webkit-filter: var(--filter-ico-sec) !important;
    filter: var(--filter-ico-sec) !important
}

.card-group .card-header .card-loan {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.card-group .card-header .card-loan .card-txt {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g600, #9b9b9b);
    margin-bottom: 0.4rem
}

.card-group .card-header .card-loan .card-tit-area {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.card-group .card-header .card-loan .card-tit {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: bold;
    color: var(--color-g900, #141414)
}

.card-group .card-header .card-loan .card-tit .tag {
    margin-left: 0.8rem
}

.card-group .card-header .card-loan .ico-arrow-link {
    width: 2rem;
    height: 2rem;
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

.card-group .card-header .card-loan .card-state-txt {
    color: var(--color-g600, #9b9b9b);
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    margin-top: 0.4rem
}

.card-group .card-header .corp-loan {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.card-group .card-header .corp-loan .corp-txt {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g700, #7d7d7d);
    margin-bottom: 0.4rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.card-group .card-header .corp-loan .corp-txt.hash {
    margin-top: 0.8rem;
    font-size: 1.2rem;
    line-height: 1.6rem;
    font-weight: 400
}

.card-group .card-header .corp-loan .corp-txt.hash span {
    margin-right: 0.4rem
}

.card-group .card-header .corp-loan .corp-tit {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 1.6rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g900, #141414)
}

.card-group .card-header .corp-loan .corp-tit .tag {
    margin-left: auto;
    margin-right: 0.8rem
}

.card-group .card-header .corp-loan .corp-tit .tag.negative .txt {
    color: var(--color-re700, #f02727) !important
}

.card-group .card-header .card-info02 {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.card-group .card-header .card-info02 .sum {
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: bold
}

.card-group .card-header .card-info02 .txt {
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g700, #7d7d7d)
}

.card-group .card-header .card-info02 .card-txt {
    color: var(--color-g700, #7d7d7d)
}

.card-group .card-header .card-info02 .btn-open {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    padding: 0.5rem 0.2rem 0.5rem 0.6rem
}

.card-group .card-header .card-info02 .btn-open .ico-arrow-open {
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

.card-group .card-header .card-info02 .ico-tap {
    -webkit-filter: var(--filter-g900);
    filter: var(--filter-g900)
}

.card-group .card-header .card-info02 .ico-arrow-link {
    width: 1.6rem;
    height: 1.6rem;
    margin-left: 0
}

.card-group .card-header .card-info02.ty01 .card-txt {
    color: var(--txt-qua)
}

.card-group .card-header .card-info02.ty01 .btn-open {
    padding-left: .4rem
}

.card-group .card-header .card-info02.ty01 .ico-arrow-link {
    -webkit-filter: var(--filter-ico-sec);
    filter: var(--filter-ico-sec)
}

.card-group .card-header .card-info02.ty02 [class^="btn-lv"]:disabled [class^="txt"] {
    color: var(--txt-disabled)
}

.card-group .card-header .card-info03 {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

:root .card-group .card-header .card-info02.a11y .txt-lv02 {
    line-height: 1;
    padding-right: 0.6rem
}

:root .card-group .card-header .card-info02.a11y .txt-lv02 .fw500 {
    display: inline-block;
    padding-top: 0.1rem
}

.card-group .card-header+.card-row {
    margin-top: 1.6rem
}

.card-group .card-header+.btn-group {
    margin-top: 2.4rem
}

.card-group .card-header .card-caption {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    text-align: right
}

.card-group .card-header .card-caption .caption {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400
}

.card-group .card-header .card-caption .caption strong {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: bold
}

.card-group .card-header .card-row-date>span {
    font-size: 1.2rem;
    line-height: 1.6rem;
    font-weight: 400;
    color: var(--color-g600, #9b9b9b)
}

.card-group .card-header .card-row-date .year {
    padding-right: 0.3rem
}

.card-group .card-header .card-state+.input-checkbox {
    margin-left: 1.2rem
}

.card-group .card-content {
    border-top: 0.1rem solid var(--color-g200, #eee);
    margin-top: 1.6rem;
    padding-top: 1.6rem
}

.card-group .card-content .card-row-tit {
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: bold;
    color: var(--color-g900, #141414)
}

.card-group .card-img-row {
    text-align: center;
    margin-top: 2.4rem
}

.card-group .card-img-row .img {
    margin: 0 3.4rem 0
}

.card-group .card-img-row .img img {
    width: 100%
}

.card-group .card-img-row .img .publicmydata {
    display: block;
    height: 19rem
}

.card-group .card-img-row .txt {
    font-size: 1.2rem;
    line-height: 1.6rem;
    font-weight: 400;
    color: var(--color-g800, #414141)
}

.card-group .card-cont-list {
    margin-top: 2rem
}

.card-group .card-cont-list .card-cont-item {
    display: block;
    position: relative;
    border-top: 0.1rem solid var(--color-g200, #eee);
    margin: 0 -2rem;
    padding: 2rem;
    color: var(--color-g900, #141414)
}

.card-group .card-cont-list .card-cont-item:last-child {
    padding-bottom: 0
}

.card-group .card-cont-list .card-cont-item .a-name {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-weight: 700
}

.card-group .card-cont-list .card-cont-item .a-name .tag {
    margin-left: .6rem
}

.card-group .card-cont-list .card-cont-item .a-num {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g600, #9b9b9b);
    margin-top: 0.4rem
}

.card-group .card-cont-list .card-cont-item .a-sum {
    text-align: right;
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: bold;
    margin-top: 1.6rem
}

.card-group .card-cont-list .card-cont-item .ico-arrow-link {
    position: absolute;
    right: 2rem;
    top: 2.4rem
}

.card-group .ui-expand .a-num+.ico-arrow-open {
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700);
    margin: 0.4rem 0 0 0.4rem;
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0)
}

.card-group .ui-expand.open .ico-arrow-open {
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg)
}

.card-group .card-folding-wrap {
    text-align: center
}

.card-group .card-folding-wrap .text-list-group2 {
    text-align: left;
    margin-top: 1.6rem
}

.card-group .card-folding-wrap .text-list-group2 .txt {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400
}

.card-group .card-folding-wrap .btn-arrow {
    font-size: 1.2rem;
    line-height: 1.6rem;
    font-weight: 400;
    color: var(--color-g600, #9b9b9b);
    margin-top: 1.6rem
}

.card-group .card-folding-wrap .btn-arrow .txt-detail {
    margin-right: 0.4rem;
    font-size: 1.4rem;
    color: var(--color-g700, #7d7d7d)
}

.card-group .card-folding-wrap .btn-arrow .txt-detail+.ico-arrow-open {
    width: 1.6rem;
    height: 1.6rem;
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

.card-group [class^="card-row"] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    width: 100%
}

.card-group [class^="card-row"]>.card-row-content {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.card-group [class^="card-row"]+.card-row {
    margin-top: 0.8rem
}

.card-group [class^="card-row"]+.card-row-infobox {
    margin-top: 1.2rem
}

.card-group [class^="card-row"]+.card-row-info {
    margin-top: 1.6rem
}

.card-group [class^="card-row"].sub .card-col-tit {
    color: var(--color-g700, #7d7d7d);
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400
}

.card-group [class^="card-row"].sub .card-col-content {
    color: var(--color-g900, #141414);
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400
}

.card-group [class^="card-row"] .card-col-tit {
    color: var(--color-g700, #7d7d7d);
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 400
}

.card-group [class^="card-row"] .card-col-tit.black {
    color: var(--color-g900, #141414)
}

.card-group [class^="card-row"] .card-col-tit.ty01 {
    position: relative;
    padding: .2rem 0 .2rem 3.2rem;
    line-height: 2rem
}

.card-group [class^="card-row"] .card-col-tit.ty01 [class*="ico-"] {
    position: absolute;
    top: 0;
    left: 0
}

.card-group [class^="card-row"].list-type {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.card-group [class^="card-row"] .card-col-tit.ty02 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.card-group [class^="card-row"] .card-col-tit.ty02+.card-col-tit.ty02 {
    margin-top: 1.2rem
}

.card-group [class^="card-row"] .card-col-tit.ty02 .txt {
    font-weight: 500
}

.card-group [class^="card-row"] .card-col-tit.ty02 .txt .txt {
    font-weight: 700
}

.card-group [class^="card-row"] .card-col-tit.ty02 [class^="ico-"] {
    margin-right: 0.8rem
}

.card-group [class^="card-row"] .tit-info {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400
}

.card-group [class^="card-row"] .txt-info {
    display: inline-block;
    color: var(--color-g700, #7d7d7d);
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400
}

.card-group [class^="card-row"] .txt-info.txt-box {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.card-group [class^="card-row"] .txt-info.txt-box>[class*=ico] {
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.card-group [class^="card-row"] .txt-info.txt-box>[class*=ico]+.txt {
    margin-left: 0.4rem
}

.card-group [class^="card-row"] .txt-info a.underline {
    line-height: 1.8
}

.card-group [class^="card-row"] .card-txt {
    color: var(--color-g800, #414141);
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400
}

.card-group [class^="card-row"] .sum {
    color: var(--color-g900, #141414);
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: bold
}

.card-group [class^="card-row"] .sum>div {
    display: inline
}

.card-group [class^="card-row"] .sum+.txt-info {
    margin-top: 0.4rem
}

.card-group [class^="card-row"] .sum.primary1 {
    color: var(--color-pn, #17008c)
}

.card-group [class^="card-row"] .sum-check01 {
    width: 100%;
    font-size: 2.4rem;
    line-height: 3.3rem;
    font-weight: bold;
    color: var(--color-g500, #b8b8b8);
    position: absolute;
    top: 0;
    left: 0;
    background-color: var(--color-w100, #fff);
    text-align: left
}

.card-group [class^="card-row"] .sum-check02 {
    width: 100%;
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: bold;
    color: var(--color-g500, #b8b8b8);
    position: absolute;
    top: 0;
    left: 0;
    background-color: var(--color-w100, #fff);
    text-align: right
}

.card-group [class^="card-row"] .card-col-content {
    position: relative;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    text-align: right;
    color: var(--color-g900, #141414);
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 400
}

.card-group [class^="card-row"] .card-col-content.left {
    text-align: left
}

.card-group [class^="card-row"] .card-col-content .secondary2 {
    color: var(--color-lm500, #69b405)
}

:root .card-group [class^="card-row"] .card-col-content .secondary2 {
    color: var(--txt-pri-success, #039115)
}

.card-group [class^="card-row"] .card-col-content .secondary1-1 {
    color: var(--color-bu800, #0150ff)
}

.card-group [class^="card-row"] .card-col-content .warning {
    color: var(--color-re700, #f02727)
}

.card-group [class^="card-row"] .card-col-content .gray1 {
    color: var(--color-g600, #9b9b9b)
}

.card-group [class^="card-row"] .card-col-content .sum-group {
    text-align: right
}

.card-group [class^="card-row"] .card-col-content .sum-group .sum-check {
    text-align: right
}

.card-group [class^="card-row"] .card-col-content .sum-group .sum-loading {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse
}

.card-group [class^="card-row"] .card-col-content .sum-group .dot-flashing {
    left: -1.7rem
}

.card-group [class^="card-row"] .card-col-content .sum+.btn-under-link {
    margin-left: 0.4rem
}

.card-group [class^="card-row"] .card-col-content .btn-under-link {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: bold
}

.card-group [class^="card-row"] .card-col-content .check {
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: bold;
    color: var(--color-g500, #b8b8b8)
}

.card-group [class^="card-row"] .card-col-content .ico-refresh {
    margin-left: 0.3rem;
    vertical-align: -0.3rem
}

.card-group [class^="card-row"] .card-col-content .ico-warning {
    margin-right: 0.3rem;
    vertical-align: -0.4rem
}

.card-group [class^="card-row"] .card-col-content .txt-lv03 .btn-under-link {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g700, #7d7d7d);
    margin-left: 0.6rem
}

.card-group [class^="card-row"].challengebox {
    margin-top: 1.5rem
}

.card-group [class^="card-row"].challengebox .card-col-tit {
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g900, #141414)
}

.card-group [class^="card-row"].challengebox .card-col-tit:before {
    content: "·";
    padding-right: 0.5rem
}

.card-group [class^="card-row"].challengebox .card-col-content {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400;
    color: var(--color-g900, #141414)
}

.card-group [class^="card-row"]+.btn-group {
    margin-top: 2.4rem
}

.card-group [class^="card-row"] .card-col-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.card-group [class^="card-row"] .card-col-group .card-col {
    width: 50%
}

.card-group [class^="card-row"] .card-col-group .card-col.align-center {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.card-group [class^="card-row"] .card-col-group .card-col.align-center>* {
    width: 100%
}

.card-group [class^="card-row"] .card-col-group .card-row-option {
    margin-bottom: 0.4rem;
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g700, #7d7d7d)
}

.card-group [class^="card-row"] .card-col-group .sum {
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: bold;
    color: var(--color-pn, #17008c)
}

.card-group [class^="card-row"] .card-col-group .sum.strong {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: bold
}

.card-group [class^="card-row"] .card-col-group .sum.strong strong {
    font-size: 2.1rem;
    line-height: 2.7rem;
    font-weight: bold
}

.card-group [class^="card-row"] .card-col-group .txt-sum,
.card-group [class^="card-row"] .card-col-group .txt-tit {
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: bold
}

.card-group [class^="card-row"] .card-col-group .txt-caption {
    font-size: 1.2rem;
    line-height: 1.6rem;
    font-weight: 400;
    color: var(--color-g600, #9b9b9b);
    margin-top: 0.4rem
}

.card-group [class^="card-row"] .card-col-group .txt-type {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g600, #9b9b9b)
}

.card-group [class^="card-row"] .card-col-group.corp-align {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.card-group [class^="card-row"] .card-col-group.corp-align .card-col {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.card-group [class^="card-row"] .card-col-group.corp-align .card-col:nth-child(2) {
    text-align: center
}

.card-group [class^="card-row"] .card-col-group.corp-align .card-col:nth-child(3) {
    text-align: right
}

.card-group [class^="card-row"] .card-col-group.dsr-calc .card-col {
    width: auto
}

.card-group [class^="card-row"] .card-col-group.dsr-calc .card-col+.card-col {
    margin-left: auto
}

.card-group [class^="card-row"] .card-loan-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%
}

.card-group [class^="card-row"] .card-loan-group .card-col {
    width: 50%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.card-group [class^="card-row"] .card-loan-group .card-col:first-child {
    border-right: 0.1rem solid var(--color-g300, #e0e0e0)
}

.card-group [class^="card-row"] .card-loan-group .card-col-option {
    margin-bottom: 0.4rem;
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g800, #414141);
    text-align: center
}

.card-group [class^="card-row"] .card-loan-group .card-col-content {
    text-align: center
}

.card-group [class^="card-row"] .card-loan-group .card-col-content .sum {
    color: var(--color-pn, #17008c);
    font-size: 2.1rem;
    line-height: 2.7rem;
    font-weight: bold
}

.card-group [class^="card-row"] .card-loan-group .sum {
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: bold;
    color: var(--color-pn, #17008c)
}

.card-group [class^="card-row"] .card-loan-group .sum.strong {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: bold
}

.card-group [class^="card-row"] .card-loan-group .sum.strong strong {
    font-size: 2.1rem;
    line-height: 2.7rem;
    font-weight: bold
}

.card-group.bg-gray [class^="card-row"] .card-col-content .sum-group .sum-loading {
    background-color: var(--color-g100, #f8f8f8)
}

.card-group .card-row .card-caution .ico-warning,
.card-group .card-row-info .card-caution .ico-warning {
    top: 0.1rem
}

.card-group+.txt-field {
    margin-top: 0.8rem;
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g700, #7d7d7d)
}

.component-card-sum+.component-card+.component-card .card-group [class^="card-row"] .card-col-content .sum,
.component-card-sum+.component-card+.component-card .card-group [class^="card-row"] .card-col-content .sum-group.ui-amount,
.component-card-sum+.component-card+.component-card .card-group [class^="card-row"] .card-col-content .txt-lv03,
.component-card-sum+.component-card .card-group [class^="card-row"] .card-col-content .sum,
.component-card-sum+.component-card .card-group [class^="card-row"] .card-col-content .sum-group.ui-amount,
.component-card-sum+.component-card .card-group [class^="card-row"] .card-col-content .txt-lv03 {
    min-height: 2.5rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.card-group.noline .card-check-item {
    border: none;
    padding-top: 0
}

.card-group .card-check-item {
    /*! 근저당 : 체크박스 카드 영역 */
    border-top: 1px solid var(--color-g200, #eee);
    margin: 2rem -2rem 0;
    padding: 2rem 2rem 0
}

.card-group .card-check-item .card-header {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.card-group .card-check-item .card-header .c-info {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.card-group .card-check-item .card-header .tag {
    margin-left: 0.4rem
}

.card-group .card-check-item .card-header .c-check {
    line-height: 0
}

.card-group .card-check-item .card-col-content,
.card-group .card-check-item .card-col-tit {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400
}

.card-group .card-check-item.ty01 [class*="txt-"] {
    color: var(--txt-sec)
}

.card-group .card-box-sub {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    background: var(--color-g100, #f8f8f8);
    padding: 1.6rem 2rem;
    margin-top: 0.8rem;
    border-radius: 1.2rem
}

.card-group .card-box-sub+.btn-group {
    margin-top: 2rem
}

.card-group.loan-ico-list+.card-group.loan-ico-list {
    margin-top: 2.4rem
}

.card-group.loan-ico-list .card-header [class*="ico-loan"] {
    margin-right: 1.2rem
}

.card-group.loan-ico-list .card-header .card-info>div {
    line-height: 2.1rem
}

/*! component element card basic type 오픈뱅킹 */

.card-group .card-header .card-img-figure [class*="logo-insurance"],
.card-group .card-header .card-img-figure [class*="logo-openbankingandcapital"] {
    margin-right: 1.2rem
}

.card-group.add-link .card-header .card-info {
    overflow: hidden;
    padding-right: 3.6rem
}

.card-group.add-link .card-header .card-info .card-account-num,
.card-group.add-link .card-header .card-info .card-account-tit .txt-point {
    display: block;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap
}

.card-group.add-link .input-checkbox.circle {
    position: absolute;
    top: 2.95rem;
    right: 2rem;
    z-index: 3
}

/*! component element card disabled case */

/*! component element card checklist type */

.component-card-checklist .btn-group {
    margin-bottom: 1.2rem
}

.card-accor-group .card-group {
    padding: 0;
    border: 0
}

:root .card-accor-group .card-group {
    padding: 0;
    border: 0
}

.card-accor-group .card-header {
    border-radius: 1.2rem 1.2rem 0 0;
    border: 1px solid var(--color-g300, #e0e0e0);
    border-bottom: 0;
    padding: 2.4rem 2rem
}

.card-accor-group .card-cont-list {
    margin-top: 0;
    border: 1px solid var(--color-g300, #e0e0e0);
    border-bottom: 0;
    padding: 2rem
}

.card-accor-group .card-cont-list:last-child {
    border-radius: 0 0 1rem 1rem;
    border: 1px solid var(--color-g300, #e0e0e0)
}

.card-accor-group .btn-open {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 3rem;
    color: var(--color-g700, #7d7d7d);
    background: var(--color-g100, #f8f8f8);
    border: 1px solid var(--color-g300, #e0e0e0);
    border-radius: 0 0 1rem 1rem
}

.card-accor-group .btn-open .txt-lv03 {
    margin-right: 0.4rem
}

.area-checkbox {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.area-checkbox .input-checkbox-group {
    width: 100%
}

.area-checkbox .input-checkbox-group .input-checkbox {
    margin-top: 0.1rem
}

.area-checkbox .checkbox-txt-field {
    display: block
}

.area-checkbox .checkbox-txt-field .tit-label {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400;
    color: var(--color-g800, #414141)
}

.area-checkbox .checkbox-txt-field .txt-label {
    display: block;
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g700, #7d7d7d);
    margin-top: 0.4rem
}

.area-checkbox .checkbox-txt-field .txt-label>div {
    display: inline
}

.area-checkbox .checkbox-txt-field .tag {
    margin-left: 0.4rem
}

.area-checkbox .input-checkbox-group.disabled .input-checkbox input:disabled+.checkbox-shape-line {
    opacity: 0
}

.area-checkbox .input-checkbox-group.disabled .checkbox-txt-field .tit-label,
.card-accor-group .input-checkbox-group.disabled .checkbox-txt-field .txt-label {
    color: var(--color-g400, #c7c7c7)
}

.card-check-group {
    position: relative;
    display: block;
    background: var(--color-w100, #fff);
    border-radius: 1.2rem;
    border: 1px solid var(--color-g200, #eee);
    padding: 2rem
}

.card-check-group .card-info {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.card-check-group .card-account-tit {
    padding-right: 1.6rem
}

.card-check-group .card-account-num {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: bold;
    margin-top: 0.4rem;
    color: var(--color-g900, #141414)
}

.card-check-group .card-account-num .txt-point>div {
    display: inline
}

.card-check-group .card-row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-top: 1.6rem
}

.card-check-group .card-col-tit {
    color: var(--color-g700, #7d7d7d);
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 400
}

.card-check-group .card-col-content {
    color: var(--color-g900, #141414);
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 400
}

.card-check-group+.card-check-group {
    margin-top: 1.6rem
}

.card-check-group+.btn-group {
    margin-top: 2.4rem
}

.card-check-group2 .card-group .relative {
    display: none
}

.card-check-group2 .card-group .card-header {
    -webkit-box-align: center !important;
    -ms-flex-align: center !important;
    align-items: center !important
}

.card-check-group2 .card-group+.relative {
    display: none
}

.card-check-group2 .card-group.active .relative {
    display: block
}

.card-check-group2 .card-group.active .card-header {
    -webkit-box-align: start !important;
    -ms-flex-align: start !important;
    align-items: flex-start !important
}

.card-check-group2 .card-group.active+.relative {
    display: block
}

.card-check-group2 .graybox-text-group.ty01 .box-inner-group2 {
    padding-bottom: 2.4rem
}

/*! component element card fold-checkbox */

.card-group.fold-checkbox.active {
    background: none
}

.card-group.fold-checkbox.active .card-check-item {
    display: none
}

/*! component element card graph type */

.card-group+.card-graph-group {
    margin-top: 2.4rem
}

.card-graph-group .selectbox-arrow-group {
    margin-bottom: 1.6rem
}

.card-graph-group .selectbox-arrow-group .btn-selectbox {
    padding-right: 0
}

.bar-graph-wrap {
    overflow-x: scroll
}

.bar-graph-wrap .bar-row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end
}

.bar-graph-wrap .bar-col {
    min-width: 5rem;
    padding-top: 2rem;
    text-align: center
}

.bar-graph-wrap .bar-data {
    height: 13.5rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.bar-graph-wrap .bar-wrap {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative
}

.bar-graph-wrap .bar-wrap .txt {
    display: block;
    font-size: 1.2rem;
    line-height: 1.6rem;
    font-weight: 400;
    margin-bottom: 0.2rem;
    white-space: nowrap;
    position: absolute;
    top: -2rem
}

.bar-graph-wrap .bar-wrap .bar {
    width: 0.8rem;
    height: 100%;
    background: var(--color-pl, #b6f23d);
    border-radius: 0.5rem 0.5rem 0 0;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.bar-graph-wrap .bar-head {
    padding: 0.6rem 0;
    border-top: 1px solid var(--color-g200, #eee)
}

.bar-graph-wrap .bar-head .tit {
    font-size: 1.2rem;
    line-height: 1.6rem;
    font-weight: 400
}

/*! component element card graph type2 */

.card-graph-group.type2 .bar-graph-wrap {
    overflow-x: hidden;
    width: 100%
}

.card-graph-group.type2 .bar-graph-wrap .bar-head .tit {
    color: var(--color-g700, #7d7d7d);
    display: block;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.card-graph-group.type2 .bar-graph-wrap .bar-col {
    position: relative;
    padding-top: 1.6rem;
    width: 50%
}

.card-graph-group.type2 .bar-graph-wrap .bar-wrap {
    padding-top: 2.4rem
}

.card-graph-group.type2 .bar-graph-wrap .bar-wrap.type1 .txt {
    color: var(--color-bu700, #006aff)
}

.card-graph-group.type2 .bar-graph-wrap .bar-wrap.type1 .bar {
    background: var(--color-bu700, #006aff)
}

.card-graph-group.type2 .bar-graph-wrap .bar-wrap.type2 .txt {
    color: var(--color-re700, #f02727)
}

.card-graph-group.type2 .bar-graph-wrap .bar-wrap.type2 .bar {
    background: var(--color-re700, #f02727)
}

.card-graph-group.type2 .bar-graph-wrap .bar-wrap .txt {
    top: 0
}

.card-graph-group.type2 .bar-graph-wrap .bar-wrap .bar {
    width: 6.4rem;
    border-radius: 0.4rem 0.4rem 0 0;
    background: var(--color-g200, #eee);
    max-height: 12rem
}

.card-graph-group.type2 .bar-graph-wrap .bar-row {
    -ms-flex-pack: distribute;
    justify-content: space-around
}

.card-graph-group.type2 .card-group [class^="card-row"] {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.card-graph-group.type2 .card-bottom {
    padding: 0.8rem 0;
    text-align: right
}

.card-graph-group.type2 .card-bottom .caption {
    font-size: 1.2rem;
    color: var(--color-g600, #9b9b9b)
}

.card-graph-group.type2 .bar-graph-wrap.bg-qua {
    background-color: var(--bg-qua)
}

.card-graph-group.type2 .bar-graph-wrap.bg-qua .bar-head {
    border-color: var(--border-ter)
}

/*! card card-graph-group type3 */

.card-graph-group.type3 .card-group {
    padding: 2.4rem 2rem
}

.card-graph-group.type3 .card-row {
    margin-top: 1.6rem;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.card-graph-group.type3 .bar-graph-wrap .bar-row {
    margin-top: 1.6rem;
    -webkit-box-align: unset;
    -ms-flex-align: unset;
    align-items: unset
}

.card-graph-group.type3 .bar-graph-wrap .bar-col {
    overflow: hidden;
    min-width: 8rem
}

.card-graph-group.type3 .bar-graph-wrap .bar-col.active .bar-wrap .bar {
    background-color: var(--bg-accent-pri)
}

.card-graph-group.type3 .bar-graph-wrap .bar-col.active .bar-head .tit {
    font-weight: 700;
    color: var(--txt-ter)
}

.card-graph-group.type3 .bar-graph-wrap .bar-wrap .bar {
    opacity: 1;
    width: 3.2rem;
    background-color: var(--bg-sec)
}

.card-graph-group.type3 .bar-graph-wrap .bar-head .tit {
    color: var(--txt-ter)
}

.card-graph-group.type3 .bar-graph-wrap .bar-col {
    padding-top: 0
}

.card-graph-group.type3 .bar-graph-wrap .bar-col .bar-data {
    overflow: hidden;
    padding-top: 2rem
}

.card-graph-group.type3 .bar-graph-wrap .bar-col .bar-wrap .txt {
    opacity: 0;
    -webkit-transform: translateY(101%);
    -ms-transform: translateY(101%);
    transform: translateY(101%)
}

.card-graph-group.type3 .bar-graph-wrap .bar-col .bar-wrap .bar {
    -webkit-transform: translateY(101%);
    -ms-transform: translateY(101%);
    transform: translateY(101%)
}

.card-graph-group.type3 .bar-graph-wrap .bar-row.graph-ani-active .bar-wrap .bar {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
    -webkit-transition: opacity 0.8s ease-out 0s, -webkit-transform 0.8s ease-out 0s;
    transition: opacity 0.8s ease-out 0s, -webkit-transform 0.8s ease-out 0s;
    -o-transition: transform 0.8s ease-out 0s, opacity 0.8s ease-out 0s;
    transition: transform 0.8s ease-out 0s, opacity 0.8s ease-out 0s;
    transition: transform 0.8s ease-out 0s, opacity 0.8s ease-out 0s, -webkit-transform 0.8s ease-out 0s;
    -webkit-transition-delay: 0.1s;
    -o-transition-delay: 0.1s;
    transition-delay: 0.1s
}

.card-graph-group.type3 .bar-graph-wrap .bar-row.graph-ani-active .bar-wrap .txt {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
    -webkit-transition: opacity 0.5s ease-out 0.5s, -webkit-transform 0.5s ease-out 0.5s;
    transition: opacity 0.5s ease-out 0.5s, -webkit-transform 0.5s ease-out 0.5s;
    -o-transition: transform 0.5s ease-out 0.5s, opacity 0.5s ease-out 0.5s;
    transition: transform 0.5s ease-out 0.5s, opacity 0.5s ease-out 0.5s;
    transition: transform 0.5s ease-out 0.5s, opacity 0.5s ease-out 0.5s, -webkit-transform 0.5s ease-out 0.5s;
    -webkit-transition-delay: 0.1s;
    -o-transition-delay: 0.1s;
    transition-delay: 0.1s;
    opacity: 1
}

.card-graph-group.type4 .card-group {
    padding: 2rem 1.9rem
}

.card-graph-group.type4 .card-group .card-row {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.card-graph-group.type4 .bar-graph-wrap {
    padding-top: 2rem;
    overflow: hidden
}

.card-graph-group.type4 .bar-graph-wrap .bar-row {
    overflow: hidden;
    height: 18rem;
    -webkit-column-gap: .6rem;
    -moz-column-gap: .6rem;
    column-gap: .6rem
}

.card-graph-group.type4 .bar-graph-wrap .bar-col {
    min-width: unset
}

.card-graph-group.type4 .bar-graph-wrap .bar-col.active .bar {
    background: var(--bg-accent-pri)
}

.card-graph-group.type4 .bar-graph-wrap .bar-wrap .bar {
    border-radius: .4rem .4rem 0 0;
    width: 1.4rem;
    background-color: var(--bg-sec)
}

.card-graph-group.type4 .bar-graph-wrap .bar-wrap .txt {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: var(--bg-ter-active);
    border-radius: 99rem;
    padding: .2rem .8rem;
    top: -4rem
}

.card-graph-group.type4 .bar-graph-wrap .bar-wrap .txt:after {
    content: "";
    display: block;
    position: absolute;
    left: 50%;
    top: 100%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    border: .4rem solid transparent;
    border-top: 5px solid var(--bg-ter-active)
}

.card-graph-group.type4 .bar-graph-wrap .bar-wrap .txt .txt-data {
    font-size: 1.4rem;
    font-weight: 700;
    line-height: 2rem;
    color: var(--txt-pri-invert)
}

.card-graph-group.type4 .bar-foot {
    border-top: 1px solid var(--border-qua);
    padding-top: .8rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.card-graph-group.type4 .bar-foot .txt {
    font-size: 1.2rem;
    font-weight: 400;
    line-height: 1.6rem;
    color: var(--txt-qua)
}

.card-graph-group.type4 .bar-graph-wrap .bar-col .bar-wrap .txt {
    opacity: 0;
    -webkit-transform: translateY(101%);
    -ms-transform: translateY(101%);
    transform: translateY(101%)
}

.card-graph-group.type4 .bar-graph-wrap .bar-col .bar-wrap .bar {
    -webkit-transform: translateY(101%);
    -ms-transform: translateY(101%);
    transform: translateY(101%)
}

.card-graph-group.type4 .bar-graph-wrap .bar-row.graph-ani-active .bar-wrap .bar {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
    -webkit-transition: opacity 0.8s ease-out 0s, -webkit-transform 0.8s ease-out 0s;
    transition: opacity 0.8s ease-out 0s, -webkit-transform 0.8s ease-out 0s;
    -o-transition: transform 0.8s ease-out 0s, opacity 0.8s ease-out 0s;
    transition: transform 0.8s ease-out 0s, opacity 0.8s ease-out 0s;
    transition: transform 0.8s ease-out 0s, opacity 0.8s ease-out 0s, -webkit-transform 0.8s ease-out 0s;
    -webkit-transition-delay: 0.1s;
    -o-transition-delay: 0.1s;
    transition-delay: 0.1s
}

.card-graph-group.type4 .bar-graph-wrap .bar-row.graph-ani-active .bar-wrap .txt {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
    -webkit-transition: opacity 0.5s ease-out 0.5s, -webkit-transform 0.5s ease-out 0.5s;
    transition: opacity 0.5s ease-out 0.5s, -webkit-transform 0.5s ease-out 0.5s;
    -o-transition: transform 0.5s ease-out 0.5s, opacity 0.5s ease-out 0.5s;
    transition: transform 0.5s ease-out 0.5s, opacity 0.5s ease-out 0.5s;
    transition: transform 0.5s ease-out 0.5s, opacity 0.5s ease-out 0.5s, -webkit-transform 0.5s ease-out 0.5s;
    -webkit-transition-delay: 0.1s;
    -o-transition-delay: 0.1s;
    transition-delay: 0.1s;
    opacity: 1
}

/*! component element card graph type3 */

.bar-graph-wrap.type2 .bar-row {
    -webkit-box-pack: space-evenly;
    -ms-flex-pack: space-evenly;
    justify-content: space-evenly
}

.bar-graph-wrap.type2 .bar-col {
    padding-top: 3.4rem;
    min-width: initial
}

.bar-graph-wrap.type2 .bar-head {
    border: 0
}

.bar-graph-wrap.type2 .bar-wrap .bar {
    width: 2.4rem;
    border-radius: 0.4rem;
    background: var(--color-g200, #eee)
}

.bar-graph-wrap.type2 .bar-wrap .txt {
    display: none;
    position: absolute;
    top: -3.4rem;
    padding: .4rem;
    background: var(--color-pb85, #000000D8);
    border-radius: .4rem;
    color: var(--color-w100, #fff);
    line-height: 1.6rem
}

.bar-graph-wrap.type2 .bar-wrap .txt:after {
    content: "";
    display: block;
    position: absolute;
    left: 50%;
    top: 100%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    border: .4rem solid transparent;
    border-top: 5px solid var(--color-pb85, #000000D8)
}

.bar-graph-wrap.type2 .bar-wrap.type1 .bar {
    background: -webkit-gradient(linear, left top, left bottom, from(var(--color-bu800, #0150ff)), to(var(--color-bu100, #bae2ff)));
    background: -o-linear-gradient(top, var(--color-bu800, #0150ff) 0, var(--color-bu100, #bae2ff) 100%);
    background: linear-gradient(180deg, var(--color-bu800, #0150ff) 0, var(--color-bu100, #bae2ff) 100%)
}

.bar-graph-wrap.type2 .bar-wrap.type1 .txt {
    display: block
}

.bar-graph-wrap.type2 .bar-head .tit {
    font-size: 1.4rem;
    color: var(--color-g700, #7d7d7d)
}

/*! component element card graph type4 */

.bar-graph-wrap.type3 {
    overflow-x: hidden;
    margin-top: 1.6rem
}

.bar-graph-wrap.type3 .bar-row {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.bar-graph-wrap.type3 .bar-col {
    padding-top: 0;
    min-width: 4.8rem;
    border-bottom: 1px solid var(--color-g300, #e0e0e0)
}

.bar-graph-wrap.type3 .bar-data {
    height: 10rem
}

.bar-graph-wrap.type3 .bar-wrap .bar {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 4rem;
    border-radius: .4rem .4rem 0 0;
    background: var(--color-cg500, #e6ebf5)
}

.bar-graph-wrap.type3 .bar-inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-size: 1.2rem;
    line-height: 1.6rem;
    color: var(--color-g800, #414141);
    font-weight: 700
}

.bar-graph-wrap.type3 .bar-inner.ty1 {
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
    background: var(--color-bu500, #1c97ff);
    color: var(--color-w100, #fff)
}

.bar-graph-wrap.type3 .bar-inner.ty2 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

/*! component element card graph type5 */

.card-graph-group.type2 .bar-graph-wrap.type4 {
    position: relative;
    margin-top: 0.5rem;
    overflow-x: scroll
}

.card-graph-group.type2 .bar-graph-wrap.type4 .bar-data {
    width: 100%;
    margin: 0 auto;
    overflow: hidden;
    padding-top: 2.1rem;
    -webkit-box-sizing: content-box;
    box-sizing: content-box
}

.card-graph-group.type2 .bar-graph-wrap.type4 .bar-head {
    padding: 0.8rem 0;
    border-top: 1px solid var(--border-ter)
}

.card-graph-group.type2 .bar-graph-wrap.type4 .bar-row {
    position: relative;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding-top: 2.3rem
}

.card-graph-group.type2 .bar-graph-wrap.type4 .bar-col {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    width: auto;
    min-width: 5.5rem;
    text-align: center;
    padding-top: 0
}

.card-graph-group.type2 .bar-graph-wrap.type4 .bar-wrap {
    padding-top: 0;
    -webkit-transform: translate(0, 100%);
    -ms-transform: translate(0, 100%);
    transform: translate(0, 100%);
    opacity: 0
}

.card-graph-group.type2 .bar-graph-wrap.type4 .bar-wrap .bar {
    width: 3.2rem;
    background-color: var(--bg-sec);
    max-height: 100%;
    padding-bottom: 0.5rem
}

.card-graph-group.type2 .bar-graph-wrap.type4 .is-now-month .bar {
    background-color: var(--bg-accent-pri)
}

.card-graph-group.type2 .bar-graph-wrap.type4 .is-show .bar-wrap {
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    transform: translate(0, 0);
    opacity: 1;
    -webkit-transition: opacity 0.8s ease-out 0s, -webkit-transform 0.8s ease-out 0s;
    transition: opacity 0.8s ease-out 0s, -webkit-transform 0.8s ease-out 0s;
    -o-transition: transform 0.8s ease-out 0s, opacity 0.8s ease-out 0s;
    transition: transform 0.8s ease-out 0s, opacity 0.8s ease-out 0s;
    transition: transform 0.8s ease-out 0s, opacity 0.8s ease-out 0s, -webkit-transform 0.8s ease-out 0s
}

.card-graph-group.type2 .bar-graph-wrap.type4 .is-disabled .bar-wrap {
    display: none
}

.card-graph-group.type2 .bar-graph-wrap.type4 .bar-wrap .txt {
    color: var(--txt-pri);
    top: -2.1rem
}

/*! component element card graph type5 */

.bar-graph-wrap.type5 {
    overflow-x: hidden;
    margin-top: 1.6rem;
    padding: 1.6rem 2rem
}

.bar-graph-wrap.type5 .bar-row {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.bar-graph-wrap.type5 .bar-col {
    position: relative;
    padding-top: 0;
    min-width: 4.8rem;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.bar-graph-wrap.type5 .base-txt {
    position: absolute;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    top: 2rem;
    width: 100%;
    height: 2rem;
    font-size: 1.2rem;
    font-weight: 500;
    color: var(--txt-sec)
}

.bar-graph-wrap.type5 .base-txt span {
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

.bar-graph-wrap.type5 .base-txt::before {
    content: '';
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    width: 100%;
    height: .1rem;
    margin-right: .4rem;
    border-bottom: 0.1rem dashed var(--border-sec)
}

.bar-graph-wrap.type5 .bar-data {
    height: 10rem
}

.bar-graph-wrap.type5 .bar-wrap .bar {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: end;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 8rem;
    border-radius: .0;
    background: var(--color-cg500, #e6ebf5)
}

.bar-graph-wrap.type5 .bar-inner {
    color: var(--color-w100)
}

.bar-graph-wrap.type5.caution .bar-inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
    background: var(--color-yl500);
    color: var(--color-w100, #fff)
}

.bar-graph-wrap.type5.success .bar-inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
    background: var(--bg-accent-pri);
    color: var(--color-w100, #fff)
}

.bar-graph-wrap.type5 .bar-head {
    padding: 0.8rem 0;
    border-top: 1px solid var(--border-ter)
}

.bar-graph-wrap.type5 .bar-head .tit {
    font-size: 1.4rem;
    line-height: 1.6rem;
    font-weight: 400;
    color: var(--color-g700)
}

.bar-graph-wrap.type5.caution .bar-head .txt {
    margin-top: .4rem;
    font-size: 1.9rem;
    font-weight: 700;
    color: var(--color-yl600)
}

.bar-graph-wrap.type5.success .bar-head .txt {
    margin-top: .4rem;
    font-size: 1.9rem;
    font-weight: 700;
    color: var(--txt-accent-sec)
}

.graph-safeloan-label-group {
    margin-bottom: 1.6rem
}

.graph-safeloan-label-group ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.graph-safeloan-label-group ul li+li {
    padding-left: 1.6rem
}

.graph-safeloan-label-group span {
    font-size: 1.2rem;
    font-weight: 400;
    color: var(--txt-qua);
    line-height: 1.6rem
}

.graph-safeloan-label-group span::before {
    content: '';
    display: inline-block;
    vertical-align: middle;
    margin-right: 0.4rem;
    width: 1.2rem;
    height: 1.2rem;
    border-radius: 99rem
}

.graph-safeloan-label-group ul li.label1 span::before {
    background-color: var(--bg-sec);
    border: 1px solid rgba(0, 55, 138, 0.2)
}

.bar-graph-wrap.type5.caution .graph-safeloan-label-group ul li.label2 span::before {
    background-color: var(--color-yl500)
}

.bar-graph-wrap.type5.success .graph-safeloan-label-group ul li.label2 span::before {
    background-color: var(--bg-accent-pri)
}

/*! component element card graph type6 */

.card-graph-group.type2 .bar-graph-wrap.type6 .bar-data {
    height: 12.8rem
}

.card-graph-group.type2 .bar-graph-wrap.type6 .bar-wrap {
    max-height: 14.4rem;
    min-height: 8.4rem
}

.card-graph-group.type2 .bar-graph-wrap.type6 .bar-head {
    border-top: 1px solid var(--border-ter)
}

.card-graph-group.type2 .bar-graph-wrap.type6 .bar-wrap .bar {
    background: var(--bg-sec)
}

.card-graph-group.type2 .bar-graph-wrap.type6 .bar-wrap.type1 .bar {
    background: var(--bg-accent-pri);
    max-height: 10.4rem
}

.card-graph-group.type2.h192 .bar-graph-wrap .bar-data {
    height: 14.7rem
}

.card-graph-group.type2.h192 .bar-graph-wrap .bar-wrap .bar {
    background: var(--bg-sec)
}

.card-graph-group.type2.h192 .bar-graph-wrap .bar-wrap.type1 .bar {
    background: var(--color-g800)
}

.card-graph-group.type2.h192 .bar-head {
    border-color: var(--border-ter)
}

/*! component element card graph column type : 2024-04-29 신규추가 CHPFMTASK-759 */

.bar-graph-wrap.column-type01 {
    padding: 2.4rem 0;
    overflow: unset
}

.bar-graph-wrap.column-type01 .bar-head-colume-type {
    margin-bottom: 1.6rem
}

.bar-graph-wrap.column-type01 .legend-display {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-column-gap: 1.6rem;
    -moz-column-gap: 1.6rem;
    column-gap: 1.6rem;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.bar-graph-wrap.column-type01 .legend-display .legend-display-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-column-gap: .4rem;
    -moz-column-gap: .4rem;
    column-gap: .4rem;
    font-size: 1.2rem;
    font-weight: 400;
    line-height: 1.6rem;
    color: var(--txt-qua)
}

.bar-graph-wrap.column-type01 .legend-display .legend-display-item::before {
    content: '';
    display: inline-block;
    width: 1.2rem;
    height: 1.2rem;
    border-radius: 50%;
    background-color: var(--bg-accent-pri)
}

.bar-graph-wrap.column-type01 .legend-display .legend-display-item:nth-child(2)::before {
    background-color: var(--bg-accent-sec)
}

.bar-graph-wrap.column-type01 .bar-colume-type-row {
    padding: .9rem 0
}

.bar-graph-wrap.column-type01 .bar-colume-type-row.type01 .colume-type-bar-inner {
    background-color: var(--bg-accent-sec)
}

.bar-graph-wrap.column-type01 .colume-type-bar {
    background-color: var(--bg-sec);
    border-radius: .4rem
}

.bar-graph-wrap.column-type01 .colume-type-bar.none {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.bar-graph-wrap.column-type01 .colume-type-bar.none .colume-type-bar-inner {
    color: var(--txt-sec-active);
    padding-left: 0
}

.bar-graph-wrap.column-type01 .colume-type-bar-inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 3.6rem;
    color: var(--txt-pri-invert);
    background-color: var(--bg-accent-pri);
    border-radius: .4rem 0 0 .4rem
}

.bar-graph-wrap.column-type01 .colume-type-bar-inner .percent {
    display: block;
    overflow: visible;
    white-space: nowrap
}

.bar-graph-wrap.column-type01 .colume-type-bar-inner.limit {
    color: var(--color-g900);
    padding-left: 2.5rem
}

/*! component element card graph column type02 CHPFMTASK-1563 */

.bar-graph-wrap.column-type02 {
    overflow: unset
}

.bar-graph-wrap.column-type02 .bar-head-colume-type {
    margin-top: 1.6rem
}

.bar-graph-wrap.column-type02 .legend-display {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-column-gap: 1.6rem;
    -moz-column-gap: 1.6rem;
    column-gap: 1.6rem;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.bar-graph-wrap.column-type02 .legend-display .legend-display-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-column-gap: .4rem;
    -moz-column-gap: .4rem;
    column-gap: .4rem;
    font-size: 1.2rem;
    font-weight: 400;
    line-height: 1.6rem;
    color: var(--txt-qua)
}

.bar-graph-wrap.column-type02 .legend-display .legend-display-item::before {
    content: '';
    display: inline-block;
    width: 1.2rem;
    height: 1.2rem;
    border-radius: 50%;
    background-color: var(--bg-accent-pri)
}

.bar-graph-wrap.column-type02 .legend-display .legend-display-item:nth-child(2)::before {
    background-color: var(--bg-sec);
    border: 1px solid rgba(0, 55, 138, 0.2)
}

.bar-graph-wrap.column-type02 .bar-colume-type-row {
    padding: 3.6rem 0 2rem
}

.bar-graph-wrap.column-type02 .colume-type-bar {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    border-radius: .4rem
}

.bar-graph-wrap.column-type02 .colume-type-bar-inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 6rem
}

.bar-graph-wrap.column-type02 .bar-colume-type-row .colume-type-bar-inner.target {
    background-color: var(--bg-accent-pri);
    border-radius: .4rem 0 0 .4rem;
    color: var(--txt-pri-invert)
}

.bar-graph-wrap.column-type02 .bar-colume-type-row .colume-type-bar-inner.other {
    background-color: var(--bg-ter);
    border-radius: 0 .4rem .4rem 0;
    color: var(--txt-sec)
}

.bar-graph-wrap.column-type02 .colume-type-bar-inner .percent {
    display: block;
    overflow: visible;
    white-space: nowrap;
    z-index: 1
}

.bar-graph-wrap.column-type02 .colume-type-bar-inner.target.limit {
    color: var(--txt-sec)
}

.bar-graph-wrap.column-type02 .colume-type-bar-inner.target.limit .percent {
    position: absolute;
    left: 1.8rem;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

.bar-graph-wrap.column-type02 .colume-type-bar-inner.other.limit .percent {
    position: absolute;
    right: 1.8rem;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

.bar-graph-wrap.column-type02+.card-bottom {
    padding: 0.8rem 0;
    text-align: right
}

.bar-graph-wrap.column-type02+.card-bottom .caption {
    font-size: 1.2rem;
    color: var(--color-g600, #9b9b9b)
}

.card-graph-group.type2 .bar-graph-wrap.type7 .bar-data {
    height: 14.4rem
}

.card-graph-group.type2 .bar-graph-wrap.type7 .bar-head {
    padding: 0.8rem 0;
    border-color: var(--border-ter)
}

.card-graph-group.type2 .bar-graph-wrap.type7 .bar-col {
    padding-top: 0
}

.card-graph-group.type2 .bar-graph-wrap.type7 .bar-wrap .bar {
    background-color: var(--bg-sec)
}

.card-graph-group.type2 .bar-graph-wrap.type7 .bar-wrap.type1 .bar {
    background-color: var(--bg-pri-down)
}

.card-graph-group.type2 .bar-graph-wrap.type7 .bar-wrap.type2 .bar {
    background-color: var(--bg-pri-up)
}

.card-graph-group.type2 .bar-graph-wrap.type7 .bar-wrap.type3 .bar {
    background-color: var(--color-g700)
}

.bar-graph-wrap.column-type02.type1 .bar-colume-type-row .colume-type-bar-inner.target,
.bar-graph-wrap.column-type02.type1 .legend-display .legend-display-item::before {
    background-color: var(--bg-accent-pri)
}

.bar-graph-wrap.column-type02.type1 .legend-display .legend-display-item:nth-child(2)::before {
    background-color: var(--bg-sec)
}

.bar-graph-wrap.column-type02.type2 .bar-colume-type-row .colume-type-bar-inner.target,
.bar-graph-wrap.column-type02.type2 .legend-display .legend-display-item::before {
    background-color: var(--bg-pri-up)
}

.bar-graph-wrap.column-type02.type2 .legend-display .legend-display-item:nth-child(2)::before {
    background-color: var(--bg-sec)
}

.bar-graph-wrap.column-type02.type3 .bar-colume-type-row .colume-type-bar-inner.target,
.bar-graph-wrap.column-type02.type3 .legend-display .legend-display-item::before {
    background-color: var(--color-g700)
}

.bar-graph-wrap.column-type02.type3 .legend-display .legend-display-item:nth-child(2)::before {
    background-color: var(--bg-sec)
}

/*! component element card basic type layout 카드타입 */

.card-layout-group {
    padding: 1.6rem 2.0rem 3.2rem
}

.card-layout-group.type2 {
    padding: 1.6rem 2.0rem 2.4rem
}

.card-layout-group .list-infobox-group {
    margin-top: 2rem
}

.card-layout-group .card-header .card-account-tit {
    font-size: 2.1rem;
    line-height: 2.7rem;
    font-weight: bold;
    color: var(--color-pn, #17008c);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.card-layout-group .card-header .card-account-tit+.card-account-num {
    margin-top: 0.4rem
}

.card-layout-group .card-header .card-account-tit+.card-account-info {
    margin-top: 0.4rem
}

.card-layout-group .card-header .card-account-tit .tag {
    margin-left: 0.8rem
}

.card-layout-group .card-header .card-account-tit .ico-edit {
    width: 2.4rem;
    height: 2.4rem;
    margin-left: 0.6rem
}

.card-layout-group .card-header .card-account-tit~.btn-account-copy .txt-lv05 {
    font-size: 1.6rem !important;
    line-height: 2.1rem
}

.card-layout-group .card-header .card-account-num {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400
}

.card-layout-group .card-header .card-account-num+.card-account-tit {
    margin-top: 0.8rem
}

.card-layout-group .card-header .card-account-info {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g700, #7d7d7d)
}

.card-layout-group .card-header .card-account-text {
    font-size: 1.6rem;
    line-height: 2.1rem;
    color: var(--txt-ter)
}

.card-layout-group .card-header .card-account-text+.card-account-tit {
    font-size: 2.8rem;
    color: var(--txt-pri);
    line-height: 3.6rem;
    margin-top: 0.4rem
}

.card-layout-group .card-header .card-img-figure .pb-ico-wrap {
    position: relative;
    display: block;
    width: 5.6rem;
    height: 5.6rem;
    border-radius: 99rem;
    background-color: var(--bg-qua);
    border: 0.5px solid var(--border-quin)
}

.card-layout-group .card-header .card-img-figure .pb-ico-wrap.big {
    width: 6.4rem;
    height: 6.4rem
}

.card-layout-group .card-header .card-img-figure .pb-ico-wrap [class*="ico-pb"] {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.card-layout-group .card-header .card-img-figure+.card-account-text {
    padding-top: 2rem
}

.card-layout-group .card-header+.card-row-option {
    margin-top: 2.4rem
}

.card-layout-group .card-header+.card-row-main,
.card-layout-group .card-header+.card-row-txt {
    margin-top: 3.2rem
}

.card-layout-group [class^="card-row"] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400
}

.card-layout-group [class^="card-row"] .sum-tit {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400;
    color: var(--color-g900, #141414)
}

.card-layout-group [class^="card-row"] .card-col-tit .point {
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: bold;
    color: var(--color-pl, #b6f23d)
}

.card-layout-group [class^="card-row"] .card-col-content {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    text-align: right;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.card-layout-group [class^="card-row"] .card-col-content .btn-under-link {
    display: inline-block;
    margin-top: 1.6rem
}

.card-layout-group [class^="card-row"] .card-col-content .card-acc+.btn-under-link {
    margin: 0 0 0 .8rem
}

.card-layout-group [class^="card-row"] .sum-num {
    font-size: 2.8rem;
    line-height: 3.6rem;
    font-weight: bold;
    color: var(--color-pn, #17008c)
}

.card-layout-group [class^="card-row"] .txt-desc {
    display: inline-block;
    margin-top: 1.6rem;
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: bold;
    color: var(--color-lm500, #69b405)
}

:root .card-layout-group [class^="card-row"] .txt-desc {
    color: var(--txt-pri-success, #039115)
}

.card-layout-group [class^="card-row"] .btn-edit {
    margin-left: 1rem
}

.card-layout-group [class^="card-row"] .btn-edit .ico-edit {
    width: 2.4rem;
    height: 2.4rem
}

.card-layout-group [class^="card-row"] .bar {
    margin: 0 0.5rem
}

.card-layout-group [class^="card-row"] .bar:after {
    content: '|';
    display: inline-block
}

.card-layout-group [class^="card-row"] .ico-arrow {
    width: 0.7rem;
    height: 0.7rem;
    vertical-align: 0.1rem
}

.card-layout-group .card-row-option .tit-period {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g700, #7d7d7d)
}

.card-layout-group .card-row-option .tit-period.type2 {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400;
    color: var(--color-g800, #414141)
}

.card-layout-group .card-row-option .tit-category {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400
}

.card-layout-group .card-row-option .btn-option {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-left: 0.8rem;
    padding: 0.6rem 1.2rem;
    background: var(--color-pb10, #00000019);
    border-radius: 5rem
}

.card-layout-group .card-row-option .btn-option .ico-option {
    width: 1.2rem;
    height: 1.2rem;
    margin-right: 0.4rem;
    background: url("../../img/mmk/common/ico_option.png") center/contain no-repeat
}

:root .card-layout-group .card-row-option .btn-option .ico-option {
    width: 1.6rem;
    height: 1.6rem
}

.card-layout-group .card-row-option .tit-period.type2+.btn-option {
    background: var(--color-g200, #eee)
}

:root .card-layout-group .card-row-option .tit-period.type2+.btn-option {
    background: var(--color-g100, #f7f9fd)
}

.card-layout-group .card-row-option .tit-period.type2+.btn-option .ico-option {
    -webkit-filter: var(--filter-g900);
    filter: var(--filter-g900);
    margin: 0 0 0 0.4rem
}

:root .card-layout-group .card-row-option .tit-period.type2+.btn-option .ico-option {
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

.card-layout-group .card-row-option .btn-option .txt {
    font-size: 1.4rem;
    color: var(--color-g900, #141414)
}

:root .card-layout-group .card-row-option .btn-option .txt {
    color: var(--color-g700, #4d596f)
}

.card-layout-group .card-row-option+.card-row-main {
    margin-top: 2.4rem
}

.card-layout-group .card-row-option+.card-header {
    margin-top: 2.4rem
}

.card-layout-group .card-row-main.mt8 {
    margin-top: 0.8rem
}

.card-layout-group .card-row-main.mt12 {
    margin-top: 1.2rem
}

.card-layout-group .card-row-main+.card-row-txt {
    margin-top: 3.2rem
}

.card-layout-group .card-row-txt.flex-right {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    margin-top: 1.6rem
}

.card-layout-group .card-row-txt.flex-right .card-col-tit {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.card-layout-group .card-row-main+.card-row-txt.flex-right {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    margin-top: 0.4rem
}

.card-layout-group .card-row-txt.flex-right .card-col-tit>div {
    display: inline;
    color: var(--color-w100, #fff);
    margin-left: 0.4rem
}

.card-layout-group .card-row-txt.flex-right .card-col-tit>div.tag {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin-right: 0.8rem
}

.card-layout-group .card-row-txt.flex-right .card-col-tit>div .ico-arrow-link {
    -webkit-filter: var(--filter-w100);
    filter: var(--filter-w100);
    opacity: 65%;
    margin-left: -0.2rem
}

.card-layout-group .card-row-txt.flex-right .card-col-tit>div.tag [class^="ico-"] {
    width: 1.5rem;
    height: 1.5rem;
    margin: -0.2rem 0.5rem 0 -0.2rem;
    -webkit-filter: var(--filter-w100);
    filter: var(--filter-w100)
}

.card-layout-group .card-row-txt.flex-right .card-col-tit>div .ico-arrow-link {
    -webkit-filter: brightness(0) invert(1);
    filter: brightness(0) invert(1);
    opacity: 65%
}

.card-layout-group .card-row-txt.flex-right+.card-row-txt.flex-right {
    padding-top: 1.2rem;
    margin-top: 1.6rem;
    border-top: 1px solid rgba(255, 255, 255, 0.15)
}

.card-layout-group .card-row-main+.card-row-txt.flex-right+.btn-group {
    margin-top: 3.2rem
}

.card-layout-group .card-row-txt .card-col-tit {
    color: var(--color-pb50, #0000007F)
}

.card-layout-group .card-row-txt .card-col-content {
    color: var(--color-pb50, #0000007F)
}

.card-layout-group .card-row-txt+.card-row-txt {
    margin-top: 0.4rem
}

.card-layout-group .card-header .card-img-figure+.card-account-tit {
    margin-top: 1.6rem
}

.card-layout-group .card-header .card-img-figure+.card-account-tit.ty03 {
    font-size: 2.4rem;
    line-height: 3.3rem
}

.card-layout-group .card-header .card-img-figure+.card-account-tit .line-clamp-1 {
    width: auto;
    max-width: calc(100% - 3rem)
}

.card-layout-group .card-header .card-account-tit,
.card-layout-group [class^="card-row"] .sum-num {
    color: var(--color-g900, #141414)
}

.card-layout-group .card-row-txt-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    margin: 0.6rem 0 1.2rem
}

.card-layout-group .card-row-txt-wrap .row-txt-info {
    display: inline;
    font-size: 1.4rem;
    color: var(--color-g900, #141414);
    line-height: 2rem
}

.card-layout-group .card-row-txt-wrap .row-txt-info+.row-txt-info {
    margin-top: 0.6rem
}

.card-layout-group .card-row-txt-wrap .row-txt-info+.row-txt-info:before {
    content: '';
    display: inline-block;
    vertical-align: middle;
    margin: 0 0.8rem 0 0.5rem;
    width: 0.2rem;
    height: 1.2rem;
    background-color: var(--color-g300, #e0e0e0)
}

.card-layout-group .card-row-txt-wrap .row-txt-info .ico-info {
    width: 2rem;
    height: 2rem;
    margin: -0.2rem 0 0
}

.card-layout-group .card-row-txt-wrap .row-txt-info.info1 {
    color: var(--color-pn, #17008c);
    font-weight: bold
}

.card-layout-group .card-row-txt-wrap .row-txt-info.info1 .ico-info {
    -webkit-filter: var(--filter-pn);
    filter: var(--filter-pn)
}

.card-layout-group .card-row-txt-wrap .row-txt-info.info2 {
    color: var(--color-re700, #f02727);
    font-weight: bold
}

.card-layout-group .card-row-txt-wrap .row-txt-info.info2 .ico-info {
    -webkit-filter: var(--filter-re700);
    filter: var(--filter-re700)
}

.card-layout-group .card-row-txt-wrap .row-txt-info.info3 {
    color: var(--color-g900, #141414);
    font-weight: bold
}

.card-layout-group .card-row-txt-wrap .row-txt-info.info3 .ico-info {
    -webkit-filter: var(--filter-g900);
    filter: var(--filter-g900)
}

.card-layout-group .card-row-txt-wrap .row-txt-info.interest {
    color: var(--color-bu800, #0150ff);
    font-weight: bold
}

:root .card-layout-group .card-row-txt-wrap .row-txt-info.interest {
    color: var(--txt-accent-sec, #4262ff)
}

.card-layout-group .card-row-txt.type2 .card-col-tit {
    color: var(--color-g700, #7d7d7d) !important
}

.card-layout-group .card-row-txt.type2 .card-col-content {
    color: var(--color-g900, #141414) !important
}

.card-layout-group .card-row-txt.type2+.card-row-txt {
    margin-top: 1.6rem
}

.card-layout-group .card-row-txt.flex-start {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.card-layout-group .card-row-txt.flex-start+.card-row-txt.flex-start {
    margin-top: 1.5rem
}

.card-layout-group .card-row-txt.flex-start .card-col-tit {
    font-size: 1.4rem;
    color: var(--color-g900, #141414);
    -ms-flex-preferred-size: 24%;
    flex-basis: 24%
}

.card-layout-group .card-row-txt.flex-start .card-col-content {
    font-size: 1.6rem;
    color: var(--color-g900, #141414);
    font-weight: bold;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.card-account-num+.card-row-txt.flex-start {
    margin-top: 2.4rem
}

.card-layout-group .card-row-savelist {
    padding: 2rem 0;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.card-layout-group .card-row-savelist .card-charged {
    padding-right: 2rem
}

.card-layout-group .card-row-savelist .card-saved {
    border-left: 0.1rem solid var(--color-g300, #e0e0e0);
    border-right: 0.1rem solid var(--color-g300, #e0e0e0);
    padding: 0 2rem
}

.card-layout-group .card-row-savelist .card-saving {
    padding-left: 2rem
}

.card-layout-group .card-row-savelist .card-savelist-tit {
    text-align: center;
    padding-bottom: 1rem
}

.card-layout-group .card-row-savelist .card-sum {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: bold
}

.card-layout-group .card-caution {
    position: relative;
    padding-left: 2.2rem
}

.card-layout-group .card-row-savelist.ty1 .card-charged {
    padding: 0 .8rem;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.card-layout-group .card-row-savelist.ty1 .card-saved {
    padding: 0 .8rem;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.card-layout-group .card-row-savelist.ty1 .card-saving {
    padding: 0 .8rem;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.card-layout-group .card-row-savelist.ty1 .card-sum {
    text-align: center
}

.card-layout-group .card-caution span.txt {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g700, #7d7d7d)
}

.card-layout-group .tipbox-group {
    margin-top: 1.6rem
}

.card-layout-group .btn-group {
    margin-top: 2.4rem
}

.card-layout-group .btn-group+.card-row-txt {
    margin-top: 2.4rem
}

.card-layout-group .card-row-progress {
    margin-top: 3.2rem
}

.card-layout-group .card-row-progress .card-row .card-col-tit {
    color: var(--color-pl, #b6f23d)
}

.card-layout-group .card-row-progress .card-row .card-col-content span {
    color: var(--color-g600, #9b9b9b);
    margin: 0 0.5rem 0 0
}

.card-layout-group.bg-primary1 {
    background: var(--color-pn, #17008c)
}

.card-layout-group.bg-primary1 .card-account-tit {
    color: var(--color-w100, #fff)
}

.card-layout-group.bg-primary1 .card-account-num {
    color: var(--color-pl, #b6f23d)
}

.card-layout-group.bg-primary1 .card-col-tit {
    color: var(--color-g600, #9b9b9b)
}

.card-layout-group.bg-primary1 .card-col-content {
    color: var(--color-g600, #9b9b9b)
}

.card-layout-group.bg-primary1 .card-col-content .txt {
    color: var(--color-w100, #fff);
    margin-left: 0.8rem
}

.card-layout-group.bg-primary1 .sum-num {
    color: var(--color-w100, #fff)
}

.card-layout-group.bg-primary1 .btn-under-link {
    color: var(--color-g600, #9b9b9b)
}

.card-layout-group.bg-primary1 .btn-lv02 {
    background-color: var(--color-w15, #fffFFF26)
}

.card-layout-group.bg-primary2 {
    background-color: var(--color-pl, #b6f23d)
}

.card-layout-group.bg-secondary2 {
    background-color: var(--color-sf200, #80d5d1)
}

.card-layout-group.bg-secondary2 .card-row-option .tit-period {
    color: var(--color-pb50, #0000007F)
}

.card-layout-group.bg-coolgray2 {
    background-color: var(--color-cg500, #e6ebf5)
}

.card-layout-group.bg-coolgray2 .card-img-figure {
    width: 4.4rem;
    height: 4.4rem;
    border-radius: 50%;
    overflow: hidden
}

.card-layout-group.bg-coolgray2 .card-img-figure.card {
    border-radius: 0.3rem;
    width: 5.4rem;
    height: 5.4rem
}

.card-layout-group.bg-coolgray2 .card-img-figure.card [class*="logo-card"]:after {
    content: none
}

.card-layout-group.bg-coolgray4 {
    background-color: var(--color-cg300, #f1f6fb)
}

.card-layout-group.bg-gray {
    background: var(--color-g100, #f8f8f8)
}

.card-layout-group.bg-gray .card-account-tit {
    color: var(--color-g900, #141414)
}

.card-layout-group.bg-gray .sum-num {
    color: var(--color-g900, #141414)
}

.card-layout-group.bg-white .card-img-figure {
    width: 7rem;
    height: 7rem
}

.card-layout-group.bg-white .card-account-tit {
    color: var(--color-g900, #141414)
}

.card-layout-group.bg-white .sum-num {
    color: var(--color-g900, #141414)
}

.card-layout-group.bg-white .card-point-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.card-layout-group.bg-white .card-point-tit {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: bold;
    color: var(--color-g800, #414141)
}

.card-layout-group.bg-white .card-point-sum {
    font-size: 2.4rem;
    line-height: 3.3rem;
    font-weight: bold
}

.card-layout-group.bg-white .card-point-info {
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: bold;
    color: var(--color-g800, #414141);
    margin-top: 3.4rem
}

.card-layout-group.bg-white .card-row-txt .card-col-content,
.card-layout-group.bg-white .card-row-txt .card-col-tit {
    color: var(--color-pb70, #000000B2)
}

.card-layout-group.bg-white .card-row-txt .card-col-content.red,
.card-layout-group.bg-white .card-row-txt .card-col-tit.red {
    color: var(--color-re700, #f02727)
}

.card-layout-group.bg-darkgray2 {
    background: var(--color-g700, #7d7d7d)
}

.card-layout-group.bg-darkgray2 .card-account-tit {
    color: var(--color-w100, #fff)
}

.card-layout-group.bg-darkgray2 .card-account-num {
    color: var(--color-w100, #fff)
}

.card-layout-group.bg-darkgray2 .card-col-tit {
    color: var(--color-w100, #fff)
}

.card-layout-group.bg-darkgray2 .card-col-content {
    color: var(--color-w100, #fff)
}

.card-layout-group.bg-darkgray2 .card-col-content .txt {
    color: var(--color-w100, #fff);
    margin-left: 0.8rem
}

.card-layout-group.bg-darkgray2 .sum-num {
    color: var(--color-w100, #fff)
}

.card-layout-group.bg-darkgray2 .btn-under-link {
    color: var(--color-w100, #fff)
}

.card-layout-group.bg-moneytalk-color1 {
    background-color: var(--color-bu900, #003fc7)
}

.card-layout-group.bg-moneytalk-color2 {
    background-color: var(--color-in800, #4946f7)
}

.card-layout-group.bg-moneytalk-color3 {
    background-color: var(--color-pu800, #b346f7)
}

.card-layout-group.bg-moneytalk-color4 {
    background-color: var(--color-fu800, #e742e4)
}

.card-layout-group.bg-moneytalk-color5 {
    background-color: var(--color-bu500, #1c97ff)
}

.card-layout-group.bg-moneytalk-color6 {
    background-color: var(--color-bu800, #0150ff)
}

.card-layout-group.bg-moneytalk-color7 {
    background-color: #a451f7
}

.card-layout-group.bg-moneytalk-color8 {
    background-color: var(--bg-sec)
}

.card-layout-group.head-bg-light {
    background-color: var(--color-sf200, #80d5d1);
    padding: 12.8rem 2rem 2.4rem
}

.card-layout-group.head-bg-light .card-tit {
    font-size: 2.8rem;
    line-height: 3.6rem;
    font-weight: 700;
    color: var(--color-g900, #141414);
    margin-top: 0.8rem
}

.card-layout-group.head-bg-light .card-subtxt01 {
    font-size: 1.6rem;
    font-weight: 400;
    line-height: 2.1rem;
    color: var(--color-pb100, #000);
    opacity: 0.5
}

.card-layout-group.head-bg-light .card-subtxt02 {
    font-size: 1.4rem;
    font-weight: 400;
    color: var(--color-pb100, #000);
    opacity: 0.5;
    margin-top: 1.2rem
}

:root .card-layout-group.head-bg-light .card-subtxt01 {
    opacity: 0.8
}

:root .card-layout-group.head-bg-light .card-subtxt02 {
    opacity: 0.7
}

.card-layout-group.fixed {
    padding: 1.2rem 2.0rem
}

.card-layout-group.fixed .card-row {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400;
    margin: 0
}

.card-layout-group.fixed.bg-primary1 .card-row .card-col-tit {
    color: var(--color-w100, #fff)
}

.card-layout-group.fixed.bg-primary1 .card-row .card-col-content {
    color: var(--color-w100, #fff)
}

.card-layout-group .card-col-img {
    margin-left: 1.6rem;
    margin-right: 0.4rem;
    position: relative
}

.card-layout-group .card-col-img [class*="card"] {
    -webkit-box-shadow: 0.1rem 0.1rem 0.4rem 0 rgba(0, 0, 0, 0.15);
    box-shadow: 0.1rem 0.1rem 0.4rem 0 rgba(0, 0, 0, 0.15)
}

.card-layout-group .card-col-img .ico-warning {
    position: absolute;
    bottom: 1rem;
    left: 2rem;
    width: 1.6rem;
    height: 1.6rem
}

.card-content-link {
    margin-top: 5.6rem
}

.card-content-link.relative {
    position: relative
}

.card-content-link .card-row {
    margin-top: 1.6rem;
    font-size: 1.6rem
}

.card-content-link .card-row .card-col-tit {
    font-size: 1.6rem;
    color: var(--color-g700, #7d7d7d)
}

.card-content-link .card-row .card-col-content>a {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    text-align: right;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    font-weight: 500
}

.card-content-link .card-row .card-col-content>a>div+span,
.card-content-link .card-row .card-col-content>div+span {
    padding: 0 0.4rem
}

.card-content-link .card-row .card-col-content .ico-arrow-link {
    margin-left: 0.4rem
}

.component-card-sum-top {
    border-bottom: 1px solid var(--color-g200, #eee)
}

.component-card-sum-top .card-sum-group {
    margin: 2rem 0
}

.component-card-sum-top .card-sum-group .sum {
    font-size: 2.1rem
}

.component-card-sum-top.type2[class*="fixed"] {
    position: -webkit-sticky;
    position: sticky;
    z-index: 79;
    top: 5rem;
    left: 0;
    width: 100%
}

.component-card-sum-top.type2 {
    border: 0
}

.component-card-sum-top.type2 .card-sum-group {
    margin: 0;
    padding: 1.6rem 2rem;
    background-color: var(--color-g100, #f8f8f8);
    height: 5.6rem
}

.component-card-sum-top.type2 .card-sum-group>.txt-lv01 {
    font-weight: 500
}

.component-card-sum-top.type2 .card-sum-group .number-rolling {
    vertical-align: 1px
}

.component-card-sum-top.type2 .card-sum-group .number-rolling:after,
.component-card-sum-top.type2 .card-sum-group .number-rolling:before {
    display: none
}

.component-card-sum-top.type2 .card-sum-group.type1 {
    display: block;
    padding: 0;
    background-color: var(--color-w100, #fff)
}

.component-card-sum-top.type2 .card-sum-group.type1 .txt-lv03 {
    margin-bottom: 0.4rem
}

.component-card-sum-top.type2 .card-sum-group.type2 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 0;
    background-color: var(--color-w100, #fff)
}

.component-card-sum-top.type2 .card-layout-group.type1 {
    padding: 0
}

.component-card-sum-top.type2 .card-layout-group.type1 .card-sum-group.type1 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding-right: 2rem;
    padding-left: 2rem;
    border-bottom: 1px solid var(--border-qua, #e0e6f1);
    color: var(--txt-pri, #020616)
}

.component-card-sum-top.type2 .card-layout-group.type1 .card-sum-group.type1 .txt-lv01 {
    color: var(--txt-pri, #020616)
}

.component-card-sum-top.type2.flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.page-inner-scroll.scrolling .component-card-sum-top.type2 .card-sum-group.bg-white {
    background-color: var(--color-g100, #f8f8f8) !important
}

.component-card-sum-top.type2 .card-sum-group.bg-white {
    background-color: var(--color-w100, #fff)
}

.component-card-sum-top.type2.read-num .txt-count-wrap [data-interest-num] {
    width: auto;
    height: auto;
    line-height: normal;
    margin: 0;
    z-index: 1;
    opacity: 0
}

.card-layout-group.type3+.card-layout-group.fixed {
    padding-bottom: 0
}

.card-layout-group.fixed .card-sum-group {
    height: 5.6rem
}

.component-card-sum-top-type3 {
    border: 0
}

.component-card-sum-top-type3[class*="fixed"] {
    position: -webkit-sticky;
    position: sticky;
    z-index: 79;
    top: 5rem;
    left: 0;
    width: 100%
}

.component-card-sum-top-type3 .card-sum-group {
    margin: 0;
    padding: 1.6rem 2rem;
    height: 5.6rem;
    background-color: var(--bg-base)
}

.component-banner-card-report {
    position: relative
}

.component-banner-card-report img {
    max-width: 15rem;
    padding: 1.2rem 0
}

.component-banner-card-report .banner-group {
    text-align: center;
    margin: 3.2rem auto 2.4rem
}

.component-banner-card-report .banner-group .card-name-top {
    margin-top: 2.4rem
}

.component-banner-card-report .banner-group .card-name-top .tit {
    font-size: 1.8rem;
    font-weight: 700;
    line-height: 2.5rem;
    color: var(--color-g900, #141414)
}

.component-banner-card-report .banner-group .card-name-top .tit+.tag {
    margin: -0.2rem 0 0 0.4rem
}

.component-banner-card-report .banner-group .card-name-mid {
    font-size: 1.4rem;
    color: var(--color-g700, #7d7d7d);
    margin-top: 0.4rem
}

.component-banner-card-report .swiper-button-next,
.component-banner-card-report .swiper-button-prev {
    top: 14.5rem;
    margin-top: 0
}

.component-banner-card-report .swiper-button-next:after,
.component-banner-card-report .swiper-button-prev:after {
    content: '';
    width: 2.4rem;
    height: 2.4rem;
    background-size: contain
}

.component-banner-card-report .swiper-button-next:after {
    background-image: var(--path-line-chevron-right)
}

.component-banner-card-report .swiper-button-prev:after {
    background-image: var(--path-line-chevron-left)
}

.component-banner-card-report .swiper-pagination-bullet+.swiper-pagination-bullet {
    margin-left: 0.8rem
}

.card-header+.card-content-link {
    margin-top: 3.2rem
}

.card-layout-group .card-row-columnlist {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-top: 2.4rem
}

.card-row-columnlist .card-column {
    position: relative;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    padding: 0 1.6rem;
    text-align: center
}

.card-row-columnlist .card-column+.card-column::before {
    content: '';
    display: block;
    width: 0.1rem;
    height: 100%;
    background-color: var(--color-g300, #e0e0e0);
    position: absolute;
    top: 0;
    left: 0
}

.card-row-columnlist .card-column .card-column-tit {
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--color-g900, #141414)
}

.card-row-columnlist .card-column .card-column-txt {
    font-size: 1.6rem;
    line-height: 2.1rem;
    color: var(--color-g900, #141414);
    font-weight: 700
}

.card-layout-group [class^="card-row"] .card-col-content .col-content-info {
    margin-right: auto;
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--color-g800, #414141);
    text-align: left;
    width: 100%
}

.card-layout-group [class^="card-row"] .card-col-content .col-content-info .ico-info {
    width: 2rem;
    height: 2rem;
    -webkit-filter: var(--filter-g800);
    filter: var(--filter-g800)
}

:root .card-layout-group [class^="card-row"] .card-col-content .col-content-info .ico-info {
    -webkit-filter: var(--filter-g800);
    filter: var(--filter-g800)
}

.card-layout-group [class^="card-row"] .card-col-content .col-content-info .info-line-clamp {
    max-width: calc(100% - 3rem);
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: inline-block;
    vertical-align: middle
}

.card-layout-group [class^="card-row"] .card-col-content .col-content-info+.sum-num {
    margin-left: 0.2rem
}

.card-layout-group.type3 {
    padding: 1.6rem 2rem 2.4rem
}

.card-layout-group.type3.border:after {
    content: '';
    display: block;
    width: 100%;
    margin: 2.4rem auto 0;
    height: 1px;
    background-color: var(--color-g200, #eee)
}

.card-layout-group.type3 .card-header+.card-row-main {
    margin-top: 2.8rem
}

.card-layout-group.type3 .card-header+.card-row-main+.card-content-link {
    margin-top: 3.2rem
}

.card-layout-group.type3 .card-header+.card-row-main+.card-content-link .card-col-content .btn-under-link {
    color: var(--color-g700, #7d7d7d)
}

.card-layout-group.type3 .card-header .card-account-tit+.card-account-num {
    color: var(--color-g800, #414141);
    font-size: 1.8rem;
    line-height: 2.5rem
}

.card-layout-group.type3 .card-header .card-account-tit+.card-account-num [class^="ico-"] {
    margin-top: -0.3rem
}

.card-layout-group.type3 .card-header .card-account-tit+.card-account-num * {
    color: var(--color-g800, #414141)
}

:root .card-layout-group.type3 .card-header .card-account-tit .ico-copy {
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

.card-layout-group.type3 [class^="card-row"] .sum-num {
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.card-layout-group.type3 .card-row-txt+.card-row-main {
    margin-top: 1.6rem
}

.card-layout-group.type3 .card-row-progress {
    margin-top: 1.6rem
}

.card-layout-group.type3 .progress-group {
    padding-bottom: 0.4rem
}

.card-layout-group.type3 .progress-group .progress-bar {
    background-color: var(--color-cg500, #e6ebf5)
}

.card-layout-group.type3 .progress-group .progress-bar .progress-value,
.card-layout-group.type3 .progress-group .progress-content .progress-day {
    background-color: var(--color-bu800, #0150ff)
}

.card-layout-group.type3 .progress-group .progress-content .progress-day::after {
    border-top: 0.8rem solid var(--color-bu800, #0150ff)
}

.card-layout-group.type3 .progress-group .progress-content .progress-day .num,
.card-layout-group.type3 .progress-group .progress-content .progress-day .txt {
    color: var(--color-w100, #fff)
}

.card-layout-group.type3 [class^="card-row"] .card-col-tit .point {
    color: var(--color-bu800, #0150ff)
}

.card-layout-group.type3 .card-row-txt .card-col-content {
    color: var(--color-g900, #141414)
}

.card-layout-group.type3 .btn-group {
    margin-top: 3.6rem
}

.card-layout-group.type3 .btn-group.border {
    padding-bottom: 2.4rem;
    border-bottom: 1px solid var(--color-g200, #eee)
}

.card-layout-group.type3 .card-row-txt-wrap.has-icon .row-txt-info {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.card-layout-group.type3 .card-row-txt-wrap.has-icon .ico-coin {
    -webkit-filter: var(--filter-in700);
    filter: var(--filter-in700);
    width: 1.5rem;
    height: 1.5rem
}

.card-layout-group.type3 .card-row-txt-wrap.has-icon .row-txt-info {
    color: var(--txt-accent-sec)
}

.card-layout-group.type3 .card-row-txt-wrap.has-icon .row-txt-info .txt {
    font-size: 1.4rem;
    font-weight: 700;
    line-height: 2rem;
    margin: 0 0.4rem 0
}

.card-layout-group.type3 .card-row-txt-wrap.has-icon .rates-info {
    position: relative;
    font-size: 1.4rem;
    font-weight: 700;
    line-height: 2rem;
    padding-right: 0.8rem;
    margin-right: 0.8rem
}

.card-layout-group.type3 .card-row-txt-wrap.has-icon .rates-info::before {
    position: absolute;
    display: block;
    content: '';
    top: 50%;
    right: 0;
    margin-top: -0.6rem;
    width: 0.1rem;
    height: 1.2rem;
    background-color: var(--border-ter)
}

.card-layout-group.type3 .tooltip-focus-group .tooltip-point .txt-area {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end
}

.card-layout-group.type3 .tooltip-focus-group .tooltip-point .txt-area .txt-sum {
    margin-right: 0.6rem;
    font-size: 1.6rem;
    font-weight: 400;
    line-height: 2.8rem;
    color: var(--color-grey-g900)
}

.card-layout-group.type3 .tooltip-focus-group .tooltip-point .txt-area .sum-num {
    display: inline-block;
    color: var(--color-grey-g900)
}

.card-layout-group.type3 .card-col-list {
    margin: 4.2rem 0 2.8rem
}

.card-layout-group.type3 .card-col-list .list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-top: 2rem
}

.card-layout-group.type3 .card-col-list .list:first-child {
    margin-top: 0
}

.card-layout-group.type3 .card-col-list .list>[class^="ico-"] {
    margin-right: 1.2rem
}

.card-layout-group.type3 .card-col-list .list .txt-group .dec {
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 2rem;
    color: var(--txt-qua)
}

.card-layout-group.type3 .card-col-list .list .txt-group .tit {
    margin-top: .4rem;
    font-size: 1.8rem;
    font-weight: 700;
    line-height: 2.4rem;
    color: var(--txt-sec)
}

.card-layout-group.type3 .card-col-list .list .btn-col-stretch {
    -ms-flex-item-align: stretch;
    align-self: stretch
}

.card-layout-group.type3 .card-col-list .list button {
    margin-left: auto
}

.card-layout-group.type4 {
    position: relative;
    padding: 2.4rem 2rem 2rem
}

.card-layout-group.type4:after {
    display: block;
    content: '';
    position: absolute;
    bottom: 0;
    left: 2rem;
    width: calc(100% - 4rem);
    height: .1rem;
    background: var(--border-qua)
}

.card-layout-group.type4 .card-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.card-layout-group.type4 .card-header .card-account-tit {
    font-size: 1.8rem;
    line-height: 2.5rem
}

.card-layout-group.type4 .card-header .card-account-txt {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.card-layout-group.type4 .card-header+.card-row-main {
    margin-top: 2.4rem
}

.card-layout-group.type4 .card-row-main .card-col-content {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.card-layout-group.type4 .card-row-main .sum-num {
    font-size: 2.4rem;
    line-height: 3.3rem
}

.card-layout-group.type4 .card-row-main .desc-num {
    margin-top: .8rem;
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 500;
    color: var(--txt-quin)
}

.card-layout-group.type4 .up-color {
    color: var(--txt-pri-up) !important
}

.card-layout-group.type4 .down-color {
    color: var(--txt-pri-down) !important
}

.card-layout-group.type4 .readonly-color {
    color: var(--txt-readonly) !important
}

.card-layout-group.type4 .card-content-link {
    margin-top: 4rem
}

.card-layout-group.type4 .card-content-link .card-row .card-col-tit {
    font-size: 1.5rem;
    line-height: 2rem
}

.card-layout-group.type4 .card-content-link .card-row .card-col-content a,
.card-layout-group.type4 .card-content-link .card-row .card-col-content div {
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 400
}

.card-util-group {
    padding: 1rem 2rem;
    border-bottom: 1px solid var(--color-g200, #eee);
    background-color: var(--color-w100, #fff)
}

:root .card-util-group {
    border-bottom: 1px solid var(--border-qua)
}

.card-util-group [class^="util_txt"] {
    font-size: 1.4rem;
    color: var(--color-g500, #b8b8b8)
}

.card-util-group [class^="util_txt"]+[class^="util_txt"]:before {
    content: '';
    display: inline-block;
    vertical-align: middle;
    width: 0.1rem;
    height: 1.2rem;
    background-color: var(--color-g500, #b8b8b8);
    margin: -0.1rem 0.4rem 0 0.1rem
}

:root .card-util-group [class^="util_txt"]+[class^="util_txt"]:before {
    background-color: var(--bg-ter)
}

.account-search-group+.card-layout-group.fixed,
.card-sum-group+.card-layout-group.fixed {
    padding: 0 2rem
}

.stickyOn .card-layout-group {
    display: block !important
}

.card-layout-group.fixed .card-sum-group {
    margin: 0 -2rem;
    padding: 0 2rem;
    background-color: var(--color-g100, #f8f8f8)
}

.card-layout-group.fixed .card-util-group {
    margin: 0 -2rem
}

.card-layout-group.fixed .card-util-group.noline {
    border-bottom: 0
}

/*! component element card variation type layout 카드타입 보험상품 */

.card-layout-group2.bg-blue {
    background: var(--color-pn, #17008c);
    padding: 1.6rem 2.0rem 3.2rem;
    color: var(--color-w100, #fff)
}

.card-layout-group2.bg-blue .insurence-ttl {
    padding: 2.4rem 0;
    font-size: 3.4rem;
    border-bottom: 0.1rem solid var(--color-w10, #fffFFF19);
    font-weight: 700
}

.card-layout-group2.bg-blue .insurence-prd {
    padding: 2.4rem 0 6.8rem
}

.card-layout-group2.bg-blue .insurence-prd .tit {
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: bold
}

.card-layout-group2.bg-blue .insurence-prd .txt {
    opacity: .7;
    margin-top: 0.4rem
}

.card-layout-group2.bg-blue .insurence-info {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.card-layout-group2.bg-blue .insurence-info .col-cont:first-child {
    padding-right: 3.2rem
}

.card-layout-group2.bg-blue .insurence-info .col-cont:last-child {
    border-left: 0.1rem solid var(--color-w10, #fffFFF19);
    padding-left: 3.2rem;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto
}

.card-layout-group2.bg-blue .insurence-info .price {
    font-size: 3.4rem;
    font-weight: 700
}

.card-layout-group2.bg-blue .insurence-info .txt-01 {
    opacity: .7;
    margin-bottom: 0.4rem
}

.card-layout-group2.bg-blue .insurence-info .txt-02 {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: bold
}

.card-layout-group2.bg-blue .insurence-prd02 {
    text-align: center
}

.card-layout-group2.bg-blue .insurence-prd02 .tit {
    font-size: 2.1rem;
    line-height: 2.7rem;
    font-weight: bold
}

.card-layout-group2.bg-blue .insurence-prd02 .txt {
    margin: 0.8rem 0
}

.card-layout-group2.bg-blue .insurence-name {
    text-align: center
}

.card-layout-group2.bg-blue .insurence-name .txt {
    display: inline-block;
    padding: 0.5rem 1rem;
    background-color: #3546b6;
    border-radius: 1.2rem;
    font-size: 1.2rem;
    line-height: 1.6rem;
    font-weight: 400;
    color: var(--color-w80, #fffFFFCC)
}

.card-layout-group2.bg-blue .insurence-payment {
    text-align: center;
    font-size: 3.2rem;
    font-weight: 700;
    margin: 3.2rem 0 0
}

/*! component element card card상단 sum layout 카드타입 */

.card-sum-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 1.2rem
}

.card-sum-group.fixed {
    position: fixed;
    top: 5rem;
    padding: 0 2.0rem 1.2rem;
    margin-top: 0;
    left: 0;
    width: 100%;
    background-color: var(--color-g100, #f8f8f8);
    z-index: 2
}

.card-sum-group.right {
    display: block;
    text-align: right
}

.card-sum-group .sum {
    font-size: 1.8rem;
    color: var(--color-g900, #141414);
    font-weight: bold
}

/*! component element card 영역 - background 컬러 */

.component-card.bg-gray {
    padding: 3.2rem 2.0rem;
    margin-top: 0;
    background: var(--color-g100, #f8f8f8)
}

.component-card.bg-gray .title-group {
    margin-bottom: 4.8rem
}

.component-card.bg-gray .title-group+.card-group.shadow {
    margin-top: -2.2rem
}

/*! component element card 고객센터 */

.card-counsel-group {
    position: relative;
    display: block;
    background: var(--color-w100, #fff);
    border-radius: 1rem;
    padding: 2.4rem 2rem;
    -webkit-box-shadow: var(--color-comp100);
    box-shadow: var(--color-comp100)
}

.card-counsel-group .card-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.card-counsel-group .card-header+.card-header {
    margin-top: 2.4rem
}

.card-counsel-group .card-header .card-num {
    font-size: 2.1rem;
    margin-top: 0.4rem;
    font-weight: bold
}

.card-counsel-group .card-txt {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    margin-top: 1.6rem;
    color: var(--color-g700, #7d7d7d)
}

.card-counsel-group .card-footer {
    margin-top: 1.6rem;
    border-top: 1px solid var(--color-g200, #eee)
}

.card-counsel-group .folding-wrap {
    margin-top: 2.4rem;
    text-align: left
}

.card-counsel-group .folding-wrap .btn-arrow {
    width: 100%;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.card-counsel-group .folding-wrap .btn-arrow .ico-arrow-open {
    -webkit-filter: var(--filter-g900);
    filter: var(--filter-g900)
}

.card-counsel-group .folding-wrap .txt-detail {
    color: var(--color-g900, #141414);
    font-weight: 500
}

.folding-infobox-group .card-header {
    padding: 4rem 0 1.6rem;
    border-bottom: 1px solid var(--color-g900, #141414)
}

.folding-infobox-group .card-header:first-child {
    padding-top: 2rem
}

.folding-infobox-group .card-header .card-num {
    margin: 0 0 0.6rem;
    font-size: 2.6rem
}

.folding-infobox-group .folding-infobox {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-top: 1.6rem
}

.folding-infobox-group .area-term {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g900, #141414)
}

.folding-infobox-group .area-desc {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 700
}

.card-counsel-group+.card-counsel-group {
    margin-top: 1rem
}

/*! component element card 고객센터 - 사고신고 날짜영역 */

.card-date {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.card-date>span {
    color: var(--color-g900, #141414);
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400
}

.card-date .date {
    margin-right: 0.5rem
}

.card-date+.btn-group {
    margin-top: 1.6rem
}

.card-row-info {
    border-top: 0.1rem solid var(--color-g200, #eee);
    padding-top: 1.6rem
}

.card-row-info.noline {
    border: none
}

.card-caution {
    position: relative;
    padding-left: 2.2rem
}

.card-caution.pd0 {
    padding: 0
}

.card-caution .txt {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g700, #7d7d7d)
}

.card-caution .txt.secondary1-1 {
    color: var(--color-bu800, #0150ff)
}

.card-caution .ico-info {
    width: 1.8rem;
    height: 1.8rem;
    position: absolute;
    left: 0;
    top: 0.1rem;
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

.card-caution .ico-warning {
    position: absolute;
    left: 0;
    top: -0.1rem;
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

/*! component element card 고객센터 - 금융사기 신고센터 영역 */

.card-col-infobox {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.card-col-infobox .card-col-tit {
    margin-bottom: 0.8rem
}

.card-col-infobox .card-col-contents {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-top: 0.4rem
}

.card-col-infobox .card-col-contents .col-tit {
    color: var(--color-g900, #141414);
    padding-left: 0.8rem
}

.card-col-infobox .card-col-contents .col-txt {
    color: var(--color-g700, #7d7d7d);
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    padding-left: 0.4rem;
    padding-right: 0.4rem
}

.card-col-infobox .card-col-contents .ico-arrow-link {
    position: relative;
    top: -0.1rem
}

/*! component element card 고객센터 - 대출가입 신용대출 슬라이더 박스 */

.card-slider-group {
    background: var(--color-g100, #f8f8f8);
    border: none;
    padding: 2rem;
    border-radius: 1.2rem
}

.card-slider-group .card-slider-info {
    border-top: 0.1rem solid var(--color-g300, #e0e0e0);
    margin-top: 1.6rem;
    padding-top: 1.6rem
}

.card-slider-group .card-row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end
}

.card-slider-group .card-row .input-range-group {
    width: 100%;
    margin-top: 0.8rem
}

.card-slider-group .card-row .input-range-group .range-num {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-top: 1.6rem
}

.card-slider-group .card-row .input-range-group .range-num .max,
.card-slider-group .card-row .input-range-group .range-num .min {
    color: var(--color-g600, #9b9b9b);
    font-size: 1.2rem;
    line-height: 1.6rem;
    font-weight: 400
}

.card-slider-group .card-row .card-row-tit {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g700, #7d7d7d)
}

.card-slider-group .card-row .card-row-content {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g900, #141414)
}

.card-slider-group .card-row+.card-row {
    margin-top: 1rem
}

/*! component element card 아파트 담보대출 */

.loan-apt-group .card-header .card-info .card-account-tit {
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: 400
}

.loan-apt-group .card-header .card-info .card-account-num.primary1 {
    color: var(--color-pn, #17008c)
}

.loan-apt-group .card-header .card-info .card-account-num.dark-gray {
    color: var(--color-g700, #7d7d7d)
}

.loan-apt-group .card-row.left {
    -webkit-box-pack: left;
    -ms-flex-pack: left;
    justify-content: left
}

.loan-apt-group .card-row.left .txt-info {
    padding-right: 2rem
}

/*! component element card 머니톡 */

.card-layout-group.moneytalk {
    padding-top: 3.6rem
}

.card-layout-group .card-moneytalk-tag {
    font-size: 1.6rem;
    color: var(--color-w100, #fff);
    opacity: 0.8
}

.card-layout-group .card-moneytalk-tit {
    font-size: 2.8rem;
    line-height: 3.6rem;
    font-weight: 700;
    color: var(--color-w100, #fff);
    margin-top: 0.8rem
}

.card-layout-group .card-moneytalk-date,
.card-layout-group .card-moneytalk-media {
    font-size: 1.4rem;
    color: var(--color-w100, #fff);
    opacity: 0.5;
    margin-top: 1.2rem
}

:root .card-layout-group .card-moneytalk-date,
:root .card-layout-group .card-moneytalk-media {
    opacity: 0.7
}

.card-layout-group.bg-moneytalk-color8 .card-moneytalk-date,
.card-layout-group.bg-moneytalk-color8 .card-moneytalk-media,
.card-layout-group.bg-moneytalk-color8 .card-moneytalk-tag,
.card-layout-group.bg-moneytalk-color8 .card-moneytalk-tit {
    color: var(--txt-pri);
    opacity: 1
}

.card-moneytalk-wrap,
.card-moneytalk-wrap>[class*=card-moneytalk] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.card-moneytalk-wrap>[class*=card-moneytalk]+[class*=card-moneytalk]:before {
    content: '';
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    width: 0.1rem;
    height: 1.2rem;
    margin: 0 0.8rem;
    background: var(--ico-ter)
}

.component-text-moneytalk .txt-lv01:not(:first-of-type) {
    margin-top: 20px
}

.card-layout-group.moneytalk.theme {
    padding: 0
}

.card-layout-group.moneytalk.theme .card-header {
    padding: 15.6rem 2rem 2.4rem
}

.component-card.moneytalk-writer {
    margin-top: 3.2rem;
    text-align: center
}

.component-card.moneytalk-writer .card-writer-group {
    padding-top: 5.6rem;
    border-top: 1px solid var(--color-g200, #eee);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.component-card.moneytalk-writer .card-writer-img {
    width: 8.8rem;
    height: 8.8rem;
    border-radius: 99rem;
    background-color: var(--color-black-pb100-op30)
}

.component-card.moneytalk-writer .card-writer-img img {
    width: 100%
}

.component-card.moneytalk-writer .card-writer-name {
    font-size: 1.8rem;
    font-weight: 700;
    margin: 1.6rem 0 0.2rem
}

.component-card.moneytalk-writer .card-writer-co {
    font-size: 1.4rem;
    color: var(--color-g700, #7d7d7d)
}

.component-card.moneytalk-writer .card-moneytalk-tip-group {
    margin-top: 3.2rem
}

.component-card.moneytalk-writer+.component-card {
    margin-top: 3.2rem
}

.card-moneytalk-share-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    margin: 3.2rem 0 6.4rem
}

.card-moneytalk-share-group .btn-group {
    margin-top: 1.6rem
}

/*! component element card + banner + lottie 머니톡 */

.section-component.moneytalk {
    position: relative;
    margin-top: -2.8rem;
    margin-bottom: 4.8rem
}

.section-component.moneytalk .component-card.moneytalk-quiz .card-group .card-tit {
    margin-top: 0.4rem;
    font-weight: 500
}

.section-component.moneytalk .component-card.moneytalk-quiz .card-group .btn-group {
    margin-top: 1.2rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.section-component.moneytalk .component-card.moneytalk-quiz .card-group .btn-group .btn-lv04.bg-sky {
    width: 100%;
    -webkit-box-flex: initial;
    -ms-flex: initial;
    flex: initial;
    border: none;
    height: 3.8rem
}

.section-component.moneytalk .component-card.moneytalk-quiz .card-group .btn-group .btn-lv04.bg-sky .txt {
    font-size: 1.5rem;
    line-height: 2rem
}

.section-component.moneytalk .component-card.moneytalk-quiz .card-group .btn-group .btn-lv04.bg-sky+.btn-lv04.bg-sky {
    margin-top: 1rem;
    margin-left: 0
}

.section-component.moneytalk .talk-banner-group.type2.quiz-answer .moneytalk-banner {
    padding: 2rem;
    height: auto
}

.section-component.moneytalk .talk-banner-group.type2.quiz-answer .subtxt-banner {
    color: var(--color-bu800, #0150ff);
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    margin-bottom: 0.4rem
}

.section-component.moneytalk .talk-banner-group.type2.quiz-answer .tit-banner {
    margin-bottom: 0.4rem
}

.section-component.moneytalk .talk-banner-group.type2.quiz-answer .txt-banner {
    margin-bottom: 0;
    color: var(--color-g700, #7d7d7d)
}

.section-component.moneytalk .talk-banner-group.type2.quiz-answer .ico-arrow-sbr {
    position: absolute;
    right: 1.2rem;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 1.6rem;
    height: 1.6rem;
    -webkit-filter: var(--filter-g600);
    filter: var(--filter-g600)
}

.section-component.moneytalk .ani-box {
    width: 100%;
    position: absolute;
    top: -9rem;
    left: 0;
    z-index: 10
}

/*! component element card 제휴사 연계대출 */

.card-flex-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.card-flex-group .card-bg-group {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    background-color: var(--color-cg500, #e6ebf5);
    border-radius: 1.2rem;
    padding: 2rem
}

.card-flex-group .card-bg-group+.card-bg-group {
    margin-left: 1.6rem
}

.card-flex-group .card-bg-group .card-header .corp-tit {
    margin-top: 0.8rem
}

.card-flex-group .card-bg-group .card-row {
    text-align: right;
    margin-top: 2.2rem
}

.card-flex-group .card-bg-group .card-row .corp-txt {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g700, #7d7d7d)
}

.card-flex-group .card-bg-group .card-row .corp-tit {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: bold
}

.card-flex-group .card-bg-group .card-row .corp-tit strong {
    font-size: 2.4rem;
    line-height: 3.3rem;
    font-weight: bold
}

/*! component element card 아담대 서류목록 */

.docu-list-group {
    padding: 0;
    overflow: hidden
}

.docu-list-group .docu-tit {
    border-radius: 1.2rem 1.2rem 0 0;
    background-color: var(--color-g100, #f8f8f8);
    padding: 1.4rem 2rem;
    color: var(--color-g900, #141414);
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: bold
}

.docu-list-group .docu-txt-group {
    padding: 2rem
}

.docu-list-group .docu-txt-group .docu-txt {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g700, #7d7d7d)
}

.docu-list-group .docu-txt-group .docu-txt .txt-flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.docu-list-group .docu-txt-group .docu-txt .txt-flex .txt {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.docu-list-group .docu-txt-group .docu-txt .txt-flex [class*="btn-"] {
    margin-left: 1.6rem
}

.docu-list-group .docu-txt-group .docu-txt .txt-flex+.txt-flex {
    margin-top: 0.8rem
}

.docu-list-group+.card-group {
    margin-top: 3.2rem
}

.docu-list-group.docu-ty01 .docu-tit {
    color: var(--txt-ter)
}

.docu-list-group.docu-ty01 .docu-txt-group {
    border-top: 1px solid var(--border-qua)
}

.docu-list-group.docu-ty01 .docu-txt-group .txt-flex {
    font-size: 1.6rem;
    line-height: 2.1rem;
    color: var(--txt-ter)
}

.docu-list-group.docu-ty01 .docu-txt-group .txt-flex+.txt-flex {
    margin-top: 1.2rem
}

.docu-list-group .docu-txt-group .docu-txt .txt-flex [class*="btn-"] {
    margin-left: 1rem;
    width: 2.4rem;
    height: 2.4rem
}

.docu-list-group .docu-txt-group .docu-txt .txt-flex [class*="btn-"] [class^="ico-"] {
    width: 2.4rem;
    height: 2.4rem
}

/*! component element card 간편결제 - 페이결제 */

.pay-card-group {
    border-radius: 1.2rem;
    background: -o-linear-gradient(339deg, #3374ff 0, #002bff 100%);
    background: linear-gradient(111deg, #3374ff 0, #002bff 100%);
    -webkit-box-shadow: 0 6 14 0 var(--color-pb7, #00000011);
    box-shadow: 0 6 14 0 var(--color-pb7, #00000011);
    padding: 2rem;
    color: var(--color-w100, #fff);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.pay-card-group .txt-fs24 {
    margin-top: 2rem;
    font-size: 2.4rem;
    line-height: 3.3rem;
    font-weight: bold
}

.pay-card-group .txt-fs14 {
    margin-top: 0.4rem;
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    opacity: .4
}

:root .pay-card-group .txt-fs14 {
    opacity: 1
}

.pay-card-group .btn-payment {
    display: block;
    text-align: right
}

.pay-card-group .btn-payment .txt {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-left: 0.4rem
}

/*! component element card 케이뱅크페이 - 가맹점리스트 */

.corp-card-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    margin-top: -2rem
}

.corp-card-group .corp-item {
    width: 47.3%;
    text-align: center;
    margin-top: 2rem
}

.corp-card-group .corp-item:nth-child(even) {
    margin-left: 1.6rem
}

.corp-card-group .img {
    border-radius: 1.2rem;
    overflow: hidden;
    border: 0.1rem solid var(--color-g200, #eee)
}

.corp-card-group .img img {
    width: 100%
}

.corp-card-group .txt {
    margin-top: 0.8rem
}

.corp-card-group .txt-02 {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g700, #7d7d7d);
    margin-top: 0.8rem;
    word-break: keep-all
}

.corp-card-group .tag .txt {
    margin-top: 0
}

.corp-card-group+.title-group {
    margin-top: 4.6rem
}

.corp-card-group.kbankpay .img {
    position: relative;
    height: 9rem
}

.corp-card-group.kbankpay .img img {
    position: absolute;
    width: 12rem;
    top: 50%;
    left: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%)
}

.paybanner-group.zeropay-group.franchise-store .icon-slide .img,
.paybanner-group.zeropay-group.franchise-store .icon-slide [class*="icon-"] {
    height: 8rem
}

.paybanner-group.zeropay-group.franchise-store .icon-slide [class*="icon-"] span {
    position: relative;
    display: inline-block;
    margin-left: 1.2rem;
    width: 7rem;
    height: 7rem;
    text-align: center;
    vertical-align: middle;
    background-color: var(--color-w100, #fff);
    border-radius: 2rem;
    overflow: hidden;
    -webkit-box-shadow: 0 4px 4px var(--color-pb10, #00000019);
    box-shadow: 0 4px 4px var(--color-pb10, #00000019)
}

.paybanner-group.zeropay-group.franchise-store .icon-slide [class*="icon-"] img {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    padding-left: 0;
    width: 100%;
    height: auto
}

.paybanner-group.zeropay-group.franchise-store .icon-slide .img+.img {
    margin-top: 1rem
}

.paybanner-group.zeropay-group.alpha-store {
    margin: 4rem 0;
    padding: 0;
    -webkit-box-shadow: unset;
    box-shadow: unset;
    background: unset
}

.paybanner-group.zeropay-group.alpha-store .icon-slide .img,
.paybanner-group.zeropay-group.alpha-store .icon-slide [class*="icon-"] {
    height: 8rem
}

.paybanner-group.zeropay-group.alpha-store .icon-slide [class*="icon-"] span {
    position: relative;
    display: inline-block;
    margin-left: 2.4rem;
    width: 8rem;
    height: 8rem;
    text-align: center;
    vertical-align: middle;
    background-color: var(--color-w100, #fff);
    border-radius: 50%;
    overflow: hidden;
    -webkit-box-shadow: unset;
    box-shadow: unset
}

.paybanner-group.zeropay-group.alpha-store .icon-slide [class*="icon-"] img {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    padding-left: 0;
    width: 100%;
    height: auto
}

.paybanner-group.zeropay-group.alpha-store .icon-slide .img+.img {
    margin-top: 1rem
}

/*! component element card 내신용관리 - 내신용관리홈 */

.card-chart-group {
    border-radius: 1.2rem;
    background-color: var(--color-w100, #fff);
    padding: 2.4rem 2rem;
    -webkit-box-shadow: 0 0.6rem 1.4rem 0 var(--color-pb7, #00000011);
    box-shadow: 0 0.6rem 1.4rem 0 var(--color-pb7, #00000011)
}

.card-chart-group .cahrt-info .my-credit {
    font-size: 2.4rem;
    line-height: 3.3rem;
    font-weight: bold
}

.card-chart-group .cahrt-graph {
    margin-top: 2.4rem
}

.card-chart-group .cahrt-graph .row-graph {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    text-align: center
}

.card-chart-group .cahrt-graph .row-graph .col-graph {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    width: 25%
}

.card-chart-group .cahrt-graph .row-graph.bar-box {
    border-bottom: 0.1rem solid var(--color-g200, #eee);
    height: 14rem
}

.card-chart-group .cahrt-graph .row-graph.bar-box .col-graph {
    margin-top: auto;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.card-chart-group .cahrt-graph .row-graph.bar-box .col-graph .bar {
    background-color: var(--color-g200, #eee);
    width: 3rem;
    height: 7rem;
    margin: 0.5rem auto 0;
    border-radius: 0.6rem 0.6rem 0 0
}

.card-chart-group .cahrt-graph .row-graph.line {
    margin-top: 1.2rem
}

/*! component element card 보험 - 보험홈 carousel */

.insurence-carousel-group .swiper-container {
    padding: 0 4.8rem 1rem
}

.insurence-carousel-group .section-link {
    display: block;
    min-height: 30rem;
    border-radius: 1.5rem;
    background-color: var(--color-bu900, #003fc7);
    padding: 3.2rem 2.0rem;
    -webkit-box-shadow: 0 0.4rem 0.7rem 0.2rem var(--color-pb10, #00000019);
    box-shadow: 0 0.4rem 0.7rem 0.2rem var(--color-pb10, #00000019)
}

.insurence-carousel-group .section-link [class*="ico-"] {
    width: 3.2rem;
    height: 2.8rem
}

.insurence-carousel-group .section-link [class*="ico-"] img {
    width: 100%
}

.insurence-carousel-group .section-link .ico-banner {
    width: 11.6rem;
    height: 11.6rem;
    margin: -1rem 0 1rem
}

.insurence-carousel-group .section-link .col-head {
    margin-bottom: 4rem
}

.insurence-carousel-group .section-link .col-head .txt-ttl {
    font-size: 2.1rem;
    line-height: 2.7rem;
    font-weight: bold;
    padding: 1.6rem 0 0.4rem
}

.insurence-carousel-group .section-link .col-head .txt-eyebrow {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400
}

.insurence-carousel-group .section-link .col-cont .txt-copy {
    font-size: 2.5rem;
    font-weight: 700
}

.insurence-carousel-group .section-link .col-cont .txt-sub {
    margin-top: 1.6rem;
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400
}

.insurence-carousel-group .section-link .col-cont .txt-sub .ico-percent,
.insurence-carousel-group .section-link .col-cont .txt-sub .ico-won {
    width: 2.2rem;
    height: 2.2rem;
    margin-right: 0.6rem
}

.insurence-carousel-group .section-link.bg-01 {
    background-color: var(--color-bu900, #003fc7);
    color: var(--color-w100, #fff)
}

.insurence-carousel-group .section-link.bg-02 {
    background-color: var(--color-sf200, #80d5d1);
    color: var(--color-pb100, #000)
}

.insurence-carousel-group .section-link.bg-03 {
    background-color: var(--color-pu900, #a425f4);
    color: var(--color-w100, #fff)
}

.renewal .insurence-carousel-group .swiper-container {
    padding: 1.6rem 2rem 4.8rem
}

.renewal .insurence-carousel-group .section-link {
    padding: 2rem;
    min-height: auto;
    height: 13rem;
    -webkit-box-shadow: none;
    box-shadow: none
}

.renewal .insurence-carousel-group .section-link .col-head {
    margin-bottom: 0
}

.renewal .insurence-carousel-group .section-link .col-head .txt-ttl {
    padding: 0 0 0.4rem;
    line-height: 2.7rem
}

.renewal .insurence-carousel-group .section-link .col-head .txt-eyebrow {
    font-size: 1.6rem;
    line-height: 2.1rem
}

.renewal .insurence-carousel-group .section-link .col-cont {
    position: absolute;
    bottom: 1rem;
    right: 1rem
}

.renewal .insurence-carousel-group .section-link .col-cont img {
    width: 6rem
}

.renewal .insurence-carousel-group .section-link.bg-01 {
    background-color: var(--color-vo700, #9659f9)
}

.renewal .insurence-carousel-group .section-link.bg-02 {
    color: var(--color-w100, #fff);
    background-color: var(--color-og600, #e46f00)
}

.renewal .insurence-carousel-group .section-link.bg-03 {
    background-color: var(--color-bu500, #1c97ff)
}

.renewal .title-group .title-field-21 {
    line-height: 2.7rem
}

.renewal .title-group .title-field-24 {
    font-size: 2.4rem;
    color: var(--color-g900, #141414);
    font-weight: 700;
    line-height: 3.3rem
}

.renewal .section-component>.component-tab {
    margin-top: 1.2rem;
    padding: 1.1rem 0 0
}

.renewal .section-component+.component-banner {
    margin-top: 3.2rem
}

.renewal .tab-round-group,
.renewal .tab-round-group .tab-list-type {
    height: auto;
    overflow: visible
}

.renewal .tab-round-group .tab-list-type {
    padding-left: 2rem
}

.renewal .tab-round-group .tab-list-col {
    -ms-flex-flow: wrap;
    flex-flow: wrap
}

.renewal .tab-round-group .tab-list-col .tab-item {
    height: 4.2rem
}

.renewal .tab-round-group .tab-list-col .tab-link {
    color: var(--color-g800, #414141);
    background-color: var(--color-w100, #fff);
    border: 1px solid var(--color-g200, #eee)
}

.renewal .list-linebox-group.insurance {
    margin-top: 0
}

.renewal .list-linebox-group.insurance .col-tit {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.renewal .list-linebox-group.insurance .col-tit+.col-tit {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    margin-left: 2rem
}

.renewal .list-linebox-group.insurance .col-tit .tit-area {
    width: 100%
}

.renewal .list-linebox-group.insurance .col-tit .title-field-01 {
    color: var(--color-g900, #141414);
    line-height: 2.5rem;
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis
}

.renewal .list-linebox-group.insurance .col-tit .dental-pay {
    font-size: 1.2rem;
    color: var(--color-g700, #7d7d7d)
}

.renewal .list-linebox-group.insurance .col-tit .dental-pay .price {
    font-size: 2.1rem;
    margin: 0 0.4rem;
    color: var(--color-bu800, #0150ff)
}

.renewal .list-linebox-group .box-title {
    overflow: hidden
}

.renewal .list-linebox-group .box-title .tag,
.renewal .list-linebox-group .box-title p {
    display: inline-block
}

.renewal .list-linebox-group .box-title p {
    padding-right: 0.8rem;
    line-height: 2rem
}

.renewal .list-linebox-group .box-title .tag {
    margin: -0.2rem 0 0 0.4rem;
    height: 1.8rem;
    vertical-align: middle
}

.renewal .list-linebox-group .box-title .tag .txt {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    height: 100%;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 1.1rem
}

.renewal .list-linebox-group .box-title .tag.line-light {
    background-color: var(--color-w100, #fff)
}

.renewal .list-linebox-group .box-title .tag.bg-light {
    background-color: var(--color-bu800, #0150ff)
}

.renewal .list-linebox-group .box-title .tag.bg-light .txt {
    color: var(--color-w100, #fff)
}

.renewal .list-linebox-group .box-state {
    margin-top: 0.5rem
}

.renewal .list-linebox-group .box-state .txt-state {
    font-size: 1.2rem;
    line-height: 1.6rem
}

.renewal .list-linebox-group .box-tag {
    margin-bottom: 0.2rem
}

.renewal .list-linebox-group .box-tag .txt-tag {
    font-size: 1.4rem;
    color: var(--color-g700, #7d7d7d);
    line-height: 2rem
}

.renewal .list-linebox-group .box-benefit {
    margin-top: 0.8rem
}

.renewal .list-linebox-group .box-benefit .txt-benefit {
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--color-vo700, #9659f9)
}

.renewal .list-linebox-group .box-premium {
    background-color: #e8eeff;
    padding: 0.4rem 0.8rem;
    border-radius: 99rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.renewal .list-linebox-group .box-premium .txt-premium {
    font-size: 1.2rem;
    color: var(--color-bu800, #0150ff)
}

.renewal .list-linebox-group .box-premium+.tooltip-area {
    bottom: 2.4rem !important
}

.renewal .insu-guide-component {
    padding: 2rem 2rem 0
}

.renewal .insu-guide-component .view-txt {
    margin-left: 0.3rem;
    display: inline-block;
    vertical-align: middle;
    font-size: 1.4rem;
    color: var(--color-g900, #141414)
}

.renewal .article-component .tab-content .component-text {
    margin-top: 4.8rem
}

.renewal .article-component .tab-content [class^="component-text"]:first-child {
    margin-top: 2rem
}

.renewal .component-text+.component-list-linebox .list-linebox-group.insurance {
    margin-top: 1.2rem
}

.insurence-carousel-group02 .section-link {
    position: relative;
    display: block;
    width: 100%;
    height: 17rem;
    padding: 3rem 1.4rem 3rem 2.4rem;
    border-radius: 1.6rem;
    background: var(--color-g200, #eee)
}

.insurence-carousel-group02 .section-link.bg-insN10 {
    background: var(--color-yl50, #fbf198)
}

.insurence-carousel-group02 .section-link.bg-insN13 {
    background: var(--color-lm50, #dbfc6e)
}

.insurence-carousel-group02 .section-link.bg-insN01 {
    background: var(--color-vo50, #f5efff)
}

.insurence-carousel-group02 .section-link.bg-insL02 {
    background: var(--color-re50, #ffebe7)
}

.insurence-carousel-group02 .section-link.bg-insN09 {
    background: var(--color-og50, #ffeccc)
}

.insurence-carousel-group02 .section-link.bg-insL71 {
    background: var(--color-gn50, #cef8e0)
}

.insurence-carousel-group02 .section-link.bg-insL05 {
    background: var(--color-bu50, #e0f2ff)
}

.insurence-carousel-group02 .section-link.bg-insL43 {
    background: var(--color-sf50, #cef7f3)
}

.insurence-carousel-group02 .row-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    height: 100%
}

.insurence-carousel-group02 img {
    width: 100%
}

.insurence-carousel-group02 .col-head {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-line-pack: justify;
    align-content: space-between;
    height: 100%
}

.insurence-carousel-group02 .col-head .ell01 {
    display: block;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap
}

.insurence-carousel-group02 .col-head .ell02 {
    display: -webkit-box;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2
}

.insurence-carousel-group02 .col-head .tit {
    width: 19.3rem;
    height: 2.5rem;
    line-height: 2.5rem;
    margin-top: 1.5rem;
    font-size: 1.8rem;
    font-weight: 700
}

.insurence-carousel-group02 .col-head .txt {
    width: 17rem;
    max-height: 4rem;
    line-height: 2rem;
    margin-top: .8rem;
    font-size: 1.5rem
}

.insurence-carousel-group02 .col-cont {
    margin-top: -1rem;
    width: 10.4rem;
    height: 15rem;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center bottom
}

.insurence-carousel-group02 .swiper-pagination {
    margin-top: 1.6rem
}

.insurence-carousel-group02 .swiper-pagination-bullet-active {
    background: var(--color-g800, #414141)
}

.insurence-carousel-group02 .swiper-pagination-bullet+.swiper-pagination-bullet {
    margin-left: .8rem
}

/*! component element card 보험 - 설계중인 보험 */

.my-insurence-group {
    padding: 1.8rem 0;
    border-radius: 1.2rem;
    border: 0.1rem solid var(--color-g300, #e0e0e0);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center
}

.my-insurence-group .col-insurence {
    position: relative;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.my-insurence-group .col-insurence .txt-02 {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: bold;
    color: var(--color-bu800, #0150ff);
    padding-left: 0.4rem
}

.my-insurence-group .col-insurence:last-child:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.6rem;
    width: 0.1rem;
    height: 1.55rem;
    background-color: var(--color-g300, #e0e0e0)
}

/*! component element card 보험 - 내보험료 조회하기 */

.card-insurence-group {
    margin-top: 2.4rem;
    padding: 0 2.0rem
}

.card-insurence-group .insurence-flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.card-insurence-group .insurence-flex .col-cont {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    text-align: center
}

.card-insurence-group .insurence-flex .col-cont .txt-01 {
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g800, #414141)
}

.card-insurence-group .insurence-flex .col-cont .txt-02 {
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: bold;
    color: var(--color-g900, #141414)
}

.card-insurence-group .insurence-flex .col-cont:last-child {
    border-left: 0.1rem solid rgba(119, 119, 119, 0.2)
}

.card-insurence-group .insurence-info-group {
    margin: 1.6rem 0 3.4rem;
    background: var(--color-w100, #fff);
    border-radius: 1.2rem;
    border: 1px solid var(--color-g200, #eee);
    padding: 2rem
}

.card-insurence-group .insurence-info-group .card-row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.card-insurence-group .insurence-info-group .card-row+.card-row {
    margin-top: 1.2rem
}

.card-insurence-group .insurence-info-group .card-row-tit {
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: bold
}

.card-insurence-group .insurence-info-group .card-col-tit {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: bold
}

.card-insurence-group .insurence-info-group .card-col-tit .txt-02 {
    font-size: 1.1rem;
    line-height: 1;
    font-weight: 400;
    color: var(--color-pb50, #0000007F)
}

.card-insurence-group .insurence-info-group .card-col-content {
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: bold;
    color: var(--color-in700, #5c59f9)
}

/*! component element card 보험 - 보험 조건변경 */

.card-group.shadow {
    font-weight: 700
}

.card-group.shadow .form-row+.card-col-row {
    margin-top: 2rem
}

.card-group.shadow .card-col-row {
    margin-top: 1.2rem
}

.card-group.shadow .txt-02 {
    font-size: 1.2rem;
    line-height: 1.6rem;
    font-weight: 400;
    color: var(--color-g700, #7d7d7d)
}

.card-group.shadow .txt-03 {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: bold
}

.card-group.shadow .txt-04 {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: bold;
    color: var(--color-bu900, #003fc7)
}

/*! component element card 머니톡 서비스 */

.component-moneytalk-carousel {
    position: relative;
    margin: 1.6rem 0 4.8rem
}

.component-moneytalk-carousel .swiper-container {
    padding: 0 2rem
}

.component-moneytalk-carousel .swiper-slide {
    margin-right: 20px
}

.component-moneytalk-carousel .swiper-slide:last-child {
    margin-right: 0 !important
}

.component-moneytalk-carousel .swiper-pagination {
    position: absolute;
    top: 0;
    right: 4rem;
    margin-top: 1.8rem
}

.component-moneytalk-carousel .swiper-pagination-bullet {
    background: transparent;
    border: 0.14rem solid var(--color-w100)
}

.component-moneytalk-carousel .swiper-pagination-bullet-active {
    background: var(--color-w100, #fff)
}

.component-moneytalk-carousel .section-link.moneytalk {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding: 2.4rem 2rem 0.8rem 2rem;
    border-radius: 1.2rem
}

.component-moneytalk-carousel .section-link.moneytalk.bg-01 {
    background-color: var(--color-in800, #4946f7)
}

.component-moneytalk-carousel .section-link.moneytalk.bg-02 {
    background-color: var(--color-pu800, #b346f7)
}

.component-moneytalk-carousel .section-link.moneytalk.bg-03 {
    background-color: var(--color-in600, #5574fc)
}

.component-moneytalk-carousel .section-link.moneytalk.bg-04 {
    background-color: var(--color-fu800, #e742e4)
}

.component-moneytalk-carousel .section-link.moneytalk.bg-05 {
    background-color: var(--color-in900, #2b27f1)
}

.component-moneytalk-carousel .section-link.moneytalk .col-head .tit {
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--color-w100, #fff);
    margin-bottom: 0.4rem;
    opacity: 0.7
}

.component-moneytalk-carousel .section-link.moneytalk .col-head .txt span {
    font-size: 2.1rem;
    line-height: 2.7rem;
    color: var(--color-w100, #fff);
    font-weight: 700;
    display: block;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap
}

.component-moneytalk-carousel .section-link.moneytalk .col-cont {
    margin-left: auto;
    margin-top: 1rem
}

.component-moneytalk-carousel .section-link.moneytalk .col-cont img {
    width: 12rem;
    height: 12rem;
    vertical-align: top
}

/*! component element card 선불카드 - MGM */

.card-group.mgm {
    background-color: var(--color-cg300, #f1f6fb);
    padding: 3rem;
    border: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 100%;
    height: 13rem;
    margin-bottom: 2.4rem
}

.card-group.mgm img {
    width: 15.2rem
}

:root .card-group.mgm {
    background-color: var(--bg-qua, #f7f9fd)
}

:root .card-group.mgm {
    border: 0
}

.activeSlide.bg-primary1 {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(30rem, var(--color-pn, #17008c)), color-stop(30rem, var(--color-w100, #fff)));
    background: -o-linear-gradient(top, var(--color-pn, #17008c) 30rem, var(--color-w100, #fff) 30rem);
    background: linear-gradient(to bottom, var(--color-pn, #17008c) 30rem, var(--color-w100, #fff) 30rem)
}

.activeSlide.bg-primary2 {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(30rem, var(--color-lm100, #c0f03e)), color-stop(30rem, var(--color-w100, #fff)));
    background: -o-linear-gradient(top, var(--color-lm100, #c0f03e) 30rem, var(--color-w100, #fff) 30rem);
    background: linear-gradient(to bottom, var(--color-lm100, #c0f03e) 30rem, var(--color-w100, #fff) 30rem)
}

.activeSlide.bg-primary3 {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(30rem, var(--color-bu700, #006aff)), color-stop(30rem, var(--color-w100, #fff)));
    background: -o-linear-gradient(top, var(--color-bu700, #006aff) 30rem, var(--color-w100, #fff) 30rem);
    background: linear-gradient(to bottom, var(--color-bu700, #006aff) 30rem, var(--color-w100, #fff) 30rem)
}

.activeSlide.bg-darkgray2 {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(30rem, var(--color-g700, #7d7d7d)), color-stop(30rem, var(--color-w100, #fff)));
    background: -o-linear-gradient(top, var(--color-g700, #7d7d7d) 30rem, var(--color-w100, #fff) 30rem);
    background: linear-gradient(to bottom, var(--color-g700, #7d7d7d) 30rem, var(--color-w100, #fff) 30rem)
}

.activeSlide.bg-coolgray2 {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(30rem, var(--color-cg500, #e6ebf5)), color-stop(30rem, var(--color-w100, #fff)));
    background: -o-linear-gradient(top, var(--color-cg500, #e6ebf5) 30rem, var(--color-w100, #fff) 30rem);
    background: linear-gradient(to bottom, var(--color-cg500, #e6ebf5) 30rem, var(--color-w100, #fff) 30rem)
}

.activeSlide.bg-gray {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(30rem, var(--color-g100, #f8f8f8)), color-stop(30rem, var(--color-w100, #fff)));
    background: -o-linear-gradient(top, var(--color-g100, #f8f8f8) 30rem, var(--color-w100, #fff) 30rem);
    background: linear-gradient(to bottom, var(--color-g100, #f8f8f8) 30rem, var(--color-w100, #fff) 30rem)
}

.activeSlide.bg-gray-full {
    background: var(--color-g100, #f8f8f8)
}

.activeSlide.bg-blue2 {
    background: var(--color-bu50, #e0f2ff)
}

[class*='bg-'].activeSlide .container-component:last-child {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-flow: column;
    flex-flow: column
}

.activeSlide.bg-coolgray2 .component-search~[class^="component-"],
.activeSlide.bg-darkgray2 .component-search~[class^="component-"],
.activeSlide.bg-gray .component-search~[class^="component-"],
.activeSlide.bg-primary1 .component-search~[class^="component-"],
.activeSlide.bg-primary2 .component-search~[class^="component-"],
.activeSlide.bg-primary3 .component-search~[class^="component-"] {
    -webkit-box-flex: 1;
    -ms-flex: 1 0 auto;
    flex: 1 0 auto
}

.activeSlide.bg-coolgray2 .component-header~[class^="component-"],
.activeSlide.bg-darkgray2 .component-header~[class^="component-"],
.activeSlide.bg-gray .component-header~[class^="component-"],
.activeSlide.bg-primary1 .component-header~[class^="component-"],
.activeSlide.bg-primary2 .component-header~[class^="component-"],
.activeSlide.bg-primary3 .component-header~[class^="component-"] {
    background: var(--color-w100, #fff)
}

.activeSlide.bg-primary1 .component-text-list:last-child {
    margin-top: 0;
    padding-top: 8rem
}

.activeSlide.bg-blue2 .component-header~[class^="component-"]:not(.component-btn.fixed-bottom) {
    background: var(--color-w100, #fff)
}

.activeSlide.bg-blue2 .container-component {
    background: var(--color-w100, #fff)
}

.activeSlide.bg-blue2 .section-component.exchange+.component-text {
    padding-top: 4rem
}

.activeSlide.bg-blue2 .section-component.exchange+.component-text+.component-list+.component-text {
    padding-top: 6rem;
    margin-top: 0
}

.activeSlide.bg-blue2 .section-component.exchange+.component-text+.component-list+.component-text+.component-card {
    padding-top: 2.4rem;
    margin-top: 0
}

.activeSlide.bg-blue2 .section-component.exchange+.component-text+.component-list+.component-text+.component-card+.component-accordion.exchange {
    padding-top: 4rem
}

.activeSlide.bg-blue2 .section-component.exchange+.component-text+.component-list+.component-text+.component-card+.component-accordion.exchange+.component-text-list {
    padding-top: 6.4rem;
    margin-top: 0
}

.card-align-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding: 0 .4rem
}

.card-align-group .card-align-col {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    margin-top: .8rem;
    width: calc(50% - .8rem)
}

.card-align-group .card-align-col:nth-child(1),
.card-align-group .card-align-col:nth-child(2) {
    margin-top: 0
}

.card-align-group .card-align-col:nth-child(2n) {
    margin-left: .8rem
}

.card-align-group .card-group {
    padding: 2rem 1.6rem;
    background: var(--color-cg300, #f1f6fb);
    border: 0
}

.card-align-group .card-group .card-header .card-info .card-account-num {
    margin-top: .4rem
}

.card-align-group .card-group .card-header+.card-row {
    margin-top: 3.3rem
}

.card-align-group .card-group [class^="card-row"] .sum {
    font-size: 3.2rem;
    line-height: 4.2rem
}

.card-align-group.ty01 .card-align-col {
    -webkit-box-flex: initial;
    -ms-flex-positive: initial;
    flex-grow: initial;
    margin-top: 1.2rem;
    width: calc(50% - .6rem)
}

.card-align-group.ty01 .card-align-col:nth-child(1),
.card-align-group.ty01 .card-align-col:nth-child(2) {
    margin-top: 0
}

.card-align-group.ty01 .card-align-col:nth-child(2n) {
    margin-left: .8rem
}

.card-align-group.ty01 .card-group {
    overflow: hidden;
    padding: 2.4rem;
    height: 16.2rem;
    background: var(--bg-qua);
    border: 1px solid var(--border-qua)
}

.card-align-group.ty01 .card-group .img-area {
    width: 3.2rem;
    height: 3.2rem
}

.card-align-group.ty01 .card-group .img-area img {
    width: 100%
}

.card-align-group.ty01 .card-group .card-header {
    margin-top: 1.3rem
}

.card-align-group.ty01 .card-group .card-account-num {
    margin-top: .8rem;
    color: var(--txt-quin)
}

.card-align-group.ty01 .card-group .card-back-info {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 2.4rem 0;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: var(--bg-accent-pri)
}

.card-align-group.ty01 .card-group .card-back-info .img-area {
    position: absolute;
    top: calc(50% - 5.7rem);
    left: calc(50% - 5.7rem);
    width: 11.4rem;
    height: 11.4rem
}

.card-align-group.ty01 .card-group .card-back-info .img-area img {
    width: 100%
}

.card-align-group.ty01 .card-group .card-back-info .card-tit {
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: 700;
    color: var(--txt-pri-invert);
    text-align: center
}

.card-align-group.ty01 .card-group .card-back-info {
    -webkit-animation: card-back-info-ani 12s ease-in infinite;
    animation: card-back-info-ani 12s ease-in infinite;
    opacity: 0
}

.card-align-group.ty01 .card-align-col:nth-child(2) .card-group .card-back-info {
    -webkit-animation-delay: 3s;
    animation-delay: 3s
}

.card-align-group.ty01 .card-align-col:nth-child(4) .card-group .card-back-info {
    -webkit-animation-delay: 6s;
    animation-delay: 6s
}

.card-align-group.ty01 .card-align-col:nth-child(3) .card-group .card-back-info {
    -webkit-animation-delay: 9s;
    animation-delay: 9s
}

@-webkit-keyframes card-back-info-ani {
    0% {
        opacity: 0
    }
    1.6% {
        opacity: 1
    }
    15% {
        opacity: 1
    }
    16.6% {
        opacity: 0
    }
    100% {
        opacity: 0
    }
}

@keyframes card-back-info-ani {
    0% {
        opacity: 0
    }
    1.6% {
        opacity: 1
    }
    15% {
        opacity: 1
    }
    16.6% {
        opacity: 0
    }
    100% {
        opacity: 0
    }
}

.card-group.minor {
    border: none;
    -webkit-box-shadow: 0 2px 6px 0 var(--color-pb5, #0000000C);
    box-shadow: 0 2px 6px 0 var(--color-pb5, #0000000C)
}

.card-group.minor .card-header {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.card-group.minor .card-header+.card-row {
    margin-top: 0.8rem
}

.card-group.minor [class^="card-row"] .card-col-content {
    text-align: left
}

.card-group.minor .card-header .card-info .card-account-tit {
    line-height: 2.1rem;
    font-weight: 500
}

.card-group.minor .card-header .card-info .card-account-num {
    font-size: 1.1rem;
    color: var(--color-g700, #7d7d7d);
    line-height: 1.5rem
}

.card-group.minor [class^="card-row"] .sum {
    font-size: 2.8rem;
    line-height: 3.6rem
}

.card-group.info-ty {
    margin-top: 3.6rem
}

.card-group.info-ty .card-img-figure {
    width: 4rem;
    margin-right: .8rem
}

.card-group.info-ty .card-img-figure img {
    display: block;
    width: 100%
}

.card-group.info-ty .card-tit span {
    font-weight: 500;
    word-break: keep-all
}

.card-group.border-g300 {
    border-color: var(--color-g300, #e0e0e0)
}

.card-group.border-g300 .card-check-item {
    border-color: var(--color-g300, #e0e0e0)
}

.card-group.wrap-ty01 {
    margin-top: 2.4rem
}

.card-group.wrap-ty01 .card-header .card-info [class*="card-account-"] {
    margin-top: 0
}

.card-group.wrap-ty01 .card-header .card-info [class*="card-account-"]+[class^="card-account-"] {
    margin-top: .2rem
}

.card-group.wrap-ty01 .card-header .card-info .card-account-sum {
    font-size: 1.6rem;
    font-weight: 500;
    line-height: 2.1rem
}

.card-group.wrap-ty01 .card-header .tag {
    margin-left: 1.2rem
}

.card-group.wrap-ty01 .card-header .card-account-sum .tag {
    margin-left: .4rem
}

.card-group.wrap-ty01 .card-header .input-checkbox.circle {
    margin-left: 1.2rem
}

.card-group.wrap-ty01 .tooltip-area.align-bottom {
    top: calc(100% + 1.6rem);
    margin-left: .5rem
}

.card-group.wrap-ty01 .tooltip-area.align-bottom:after {
    left: 2.2rem
}

.card-group.wrap-ty01 .card-header .card-account-sum .tooltip-area.align-bottom {
    margin-left: 0
}

.card-group.wrap-ty01 .card-header .card-account-sum .tooltip-area.align-center:after {
    left: 50%
}

.card-check-item .card-group.wrap-ty01 {
    border: 0;
    padding: 0;
    margin-top: 0
}

.card-check-item .card-group.wrap-ty01+.card-group.wrap-ty01 {
    margin-top: 2.4rem
}

.card-check-item .card-group.wrap-ty01 .tooltip-point .tooltip-area.align-right {
    left: auto;
    right: calc(50% + 1.4rem);
    margin-left: 0
}

.card-check-item .card-group.wrap-ty01 .tooltip-point .tooltip-area.align-right:after {
    right: 2rem;
    left: auto
}

.card-group.wrap-ty01 .card-col-content .tooltip-area.align-bottom {
    top: calc(100% + 1rem)
}

.card-group.wrap-ty01 .card-col-content .tooltip-point .tooltip-area.align-right:after {
    right: 2rem;
    left: auto
}

.card-group.wrap-ty01 .card-col-content .tooltip-point .tooltip-area.align-right {
    left: auto;
    right: calc(50% + 1.4rem);
    margin-left: 0
}

.card-group.wrap-ty01.small {
    padding: 1.6rem
}

.card-group.wrap-ty01.gray-box {
    padding: 1.6rem 1.6rem 0 1.6rem;
    background-color: var(--color-g100, #f8f8f8);
    border-color: var(--color-g200, #eee)
}

.card-group.wrap-ty01.gray-box.border-g100 {
    border-color: var(--color-g100, #f8f8f8)
}

.card-group.wrap-ty01.gray-box .card-header {
    margin-bottom: 1.6rem
}

.card-group.wrap-ty01.gray-box .card-check-item {
    margin: 0 -1.6rem;
    padding: 1.6rem 2rem;
    background-color: var(--color-w100, #fff);
    border-color: var(--color-g100, #f8f8f8);
    border-radius: 0 0 1.2rem 1.2rem
}

.card-group.wrap-ty01.gray-box .card-check-item .card-inner {
    width: 100%
}

.card-group.wrap-ty01.gray-box .card-check-item .btn-acco {
    margin-left: .4rem
}

.card-group.wrap-ty01.gray-box .card-check-item .ico-arrow-open {
    width: 1.6rem;
    height: 1.6rem;
    margin: .2rem 0
}

.card-group.wrap-ty01.gray-box .card-check-item .ico-loading-dot {
    width: 2rem
}

.card-group.wrap-ty01.gray-box .card-check-item .ico-loading-dot img {
    width: 100%
}

.card-group.wrap-ty01.gray-box .tooltip-group .btn-tooltip {
    margin: .2rem 0
}

.card-group.wrap-ty01.gray-box .tooltip-group .tooltip-area {
    left: 3.7rem;
    right: 1.2rem
}

.card-group.wrap-ty01.accor-box {
    padding: 1.6rem 2rem
}

.card-group.wrap-ty01.accor-box .card-cont-list {
    margin-top: 1.6rem
}

.card-group.wrap-ty01.accor-box .card-check-item {
    margin: 0 -2rem;
    padding: 1.6rem 2rem 0
}

.card-group.wrap-ty02 {
    padding: 1.6rem 2rem
}

.card-group.wrap-ty02 .card-header .card-account-loan {
    font-size: 1.5rem;
    line-height: 2rem;
    color: var(--color-g900, #141414)
}

.card-group.wrap-ty02 .card-header .card-account-sum {
    margin-top: 0;
    color: var(--color-bu900, #003fc7)
}

.card-group.wrap-ty02 .card-header .btn-open .ico-arrow-open {
    width: 1.6rem;
    height: 1.6rem;
    padding: 0
}

.card-group.wrap-ty02 .card-cont-list {
    margin-top: 1.6rem
}

.card-group.wrap-ty02 .card-check-item {
    margin: 0 -2rem;
    padding: 1.6rem 2rem 0
}

.card-group.wrap-ty02 .card-cont-list {
    margin-top: 1.6rem
}

.card-group.wrap-ty02 .card-check-item [class*="card-row"]+.card-row {
    margin-top: 1.6rem
}

.card-group.wrap-ty02 .card-check-item .card-col-content,
.card-group.wrap-ty02 .card-check-item .card-col-tit {
    font-size: 1.5rem;
    line-height: 2rem
}

.card-group.wrap-ty02 .card-check-item .card-col-tit {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.card-group.wrap-ty02 .card-check-item .card-col-content {
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none
}

.card-group.wrap-ty02 .card-check-item .card-box-sub {
    margin-bottom: 1.6rem
}

.card-group.wrap-ty02 .card-check-item .card-box-sub .card-col-content,
.card-group.wrap-ty02 .card-check-item .card-box-sub .card-col-tit {
    font-size: 1.4rem
}

.card-group.wrap-ty02 .card-check-item .card-box-sub [class*="card-row"]+.card-row {
    margin-top: .8rem
}

.card-group.wrap-ty03 {
    width: 100%;
    padding: 1.6rem;
    margin-top: 1.6rem
}

.card-group.wrap-ty03 .card-header .card-img-figure [class^="ico-"] {
    margin-right: 1rem
}

.card-group.wrap-ty03 .card-header .card-account-sum {
    margin: 0;
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 500
}

.card-group.wrap-ty03 .card-header .card-account-loan {
    margin-top: .2rem;
    color: var(--txt-qua)
}

.card-img-group {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin-left: .9rem;
    -webkit-box-pack: right;
    -ms-flex-pack: right;
    justify-content: right
}

.card-img-group [class*="logo-"]+[class*="logo-"] {
    margin-left: -1rem
}

.card-group .card-info02 .card-img-group+.btn-open {
    padding: 0;
    margin-left: .9rem
}

.card-group .card-info02 .card-img-group+.btn-open .ico-arrow-open {
    width: 1.6rem;
    height: 1.6rem
}

.card-group .btn-arrow.bu800 {
    color: var(--color-bu800, #0150ff);
    font-weight: 500
}

.card-group .btn-arrow.bu800 .ico-arrow-link {
    margin-left: .2rem;
    width: 1.3rem;
    height: 1.3rem;
    -webkit-filter: var(--filter-bu800);
    filter: var(--filter-bu800)
}

.dl-group.ty01 .flex-tit {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.dl-group.ty01 .flex-tit .status {
    font-size: 1.5rem;
    line-height: 2rem;
    color: var(--color-pn, #17008c);
    font-weight: bold
}

.dl-group.ty01 .flex-tit .txt {
    margin-left: 0.4rem;
    font-size: 1.5rem;
    line-height: 2rem;
    color: var(--color-pn, #17008c);
    font-weight: bold
}

.dl-group.ty01 .flex-tit [class*="ico-"] {
    -webkit-filter: var(--filter-pn);
    filter: var(--filter-pn)
}

:root .dl-group.ty01 .flex-tit [class*="ico-"] {
    -webkit-filter: var(--filter-pn);
    filter: var(--filter-pn)
}

.dl-group.ty01 .bl-txt-group .txt {
    margin-top: 1.2rem;
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--color-g900, #141414)
}

.dl-group.ty01 .bl-txt-group .txt+.txt {
    margin-top: .8rem
}

.dl-group.ty01 .btn-lv03 .txt {
    font-size: 1.4rem
}

.dl-group.ty01 .btn-lv03 {
    padding-left: 1.2rem
}

:root .dl-group.ty01 .btn-lv03 {
    padding-left: 0.8rem
}

.dl-group.ty01 .btn-lv03 [class*="ico-"] {
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

:root .dl-group.ty01 .btn-lv03 [class*="ico-"] {
    -webkit-filter: var(--filter-g900);
    filter: var(--filter-g900)
}

.dl-group.ty01 .nodata-statement-group {
    height: auto;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.dl-group.ty01 .nodata-statement-group [class*="ico-"] {
    -webkit-filter: var(--filter-pn);
    filter: var(--filter-pn);
    margin: 0
}

.dl-group.ty01 .nodata-statement-group [class*="txt-"] {
    color: var(--color-pn, #17008c);
    margin-top: .4rem
}

.oil-today-group {
    padding: 1.6rem 2rem;
    border: 0
}

.oil-today-group>div {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding-top: 1.2rem
}

.oil-today-group .txt01 {
    font-size: 1.5rem;
    font-weight: bold;
    line-height: 2rem;
    color: var(--color-g900, #141414)
}

.oil-today-group .txt02 {
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--color-g700, #7d7d7d)
}

.component-oil-box+.component-graph-wrap.oil-graph {
    padding-top: 3.6rem
}

.component-oil-box .card-group {
    border: 0;
    padding: 1.2rem 2rem
}

.component-oil-box .card-group .card-info-oil {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.component-oil-box .card-group .card-info-oil .row-cont * {
    line-height: 2.4rem
}

.component-oil-box .card-group .card-info-oil .row-cont+.row-cont {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    min-width: 0;
    width: calc(100% - 3.2rem);
    margin-left: 0.8rem
}

.component-oil-box .card-group .card-info-oil .row-cont+.row-cont .txt-lv03 {
    margin-left: auto
}

.component-oil-box .card-group .card-info-oil .row-cont .ico-oil-logo {
    width: 2.4rem;
    height: 2.4rem;
    border: 1px solid var(--color-pb10, #00000019)
}

.component-oil-box .card-group .card-info-oil .row-cont .oil-bank-name {
    max-width: calc(100% - 6rem);
    display: inline-block;
    vertical-align: middle;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 1.4rem;
    font-weight: 500;
    line-height: 2rem;
    color: var(--color-g800, #414141)
}

.card-group.bg-gray2.exchange {
    padding: 4rem 0 3rem;
    text-align: center;
    border-radius: 1.6rem
}

.card-group.bg-gray2.exchange .card-img-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: space-evenly;
    -ms-flex-pack: space-evenly;
    justify-content: space-evenly;
    margin-bottom: 3rem
}

.card-group.bg-gray2.exchange .card-img-figure .tit {
    margin-top: 1.2rem;
    color: var(--color-g900, #141414);
    font-size: 1.5rem;
    line-height: 2rem
}

.card-group.bg-gray2.exchange .card-img-figure .num {
    margin-top: 0.2rem;
    color: var(--color-g900, #141414);
    font-size: 1.8rem;
    font-weight: 700;
    line-height: 2.5rem
}

.container-component.subscribe {
    overflow: hidden
}

.component-header+.component-card-subscribe-service {
    margin-top: -5rem
}

.component-card-subscribe-service {
    padding: 5rem 0 0;
    background: -o-linear-gradient(280deg, #4053cf 1.58%, #0e0a88 67.27%, #1f0b6f 93.26%);
    background: linear-gradient(170deg, #4053cf 1.58%, #0e0a88 67.27%, #1f0b6f 93.26%)
}

.card-subscribe-service-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.card-subscribe-service-group .box-label {
    display: inline-block;
    margin-bottom: 1.2rem;
    padding: 0.6rem 1.2rem;
    border-radius: 2rem;
    background-color: var(--color-vo800, #8a46f7)
}

.card-subscribe-service-group .box-label .txt {
    font-size: 1.5rem;
    line-height: 2rem;
    color: var(--color-w100, #fff);
    font-weight: 700
}

.card-subscribe-service-group .box-title {
    font-size: 3.2rem;
    line-height: 4.2rem;
    font-weight: 700;
    color: var(--color-w100, #fff);
    text-align: center
}

.component-card-subscribe-service2 {
    padding: 3.6rem 2rem 5rem
}

.component-card-subscribe-service2 .strong-color1 {
    position: relative;
    display: inline-block;
    z-index: 1
}

.component-card-subscribe-service2 .strong-color1:before {
    content: '';
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 1rem;
    opacity: 0.4;
    background-color: var(--color-in600, #7673fb);
    z-index: -1
}

.card-subscribe-service-group.type2 {
    position: relative;
    margin-top: 2.4rem;
    padding: 2.4rem 2rem 0;
    background-color: var(--color-w100, #fff);
    border-radius: 1.6rem;
    text-align: center
}

.card-subscribe-service-group.type2 .box-label {
    margin-bottom: 2rem;
    padding: 0.4rem 1.4rem;
    border-radius: 2.4rem;
    background-color: var(--color-g900, #141414)
}

.card-subscribe-service-group.type2 .box-label .txt {
    font-size: 1.5rem;
    line-height: 2rem;
    color: var(--color-w100, #fff);
    font-weight: 700
}

.card-subscribe-service-group.type2 .box-title {
    font-size: 1.5rem;
    line-height: 2rem;
    color: var(--color-g700, #414141);
    font-weight: 400
}

.card-subscribe-service-group.type2 .box-title span {
    display: block;
    margin-bottom: 1.6rem;
    font-size: 2.1rem;
    line-height: 2.7rem;
    color: var(--color-g900, #141414);
    font-weight: 700
}

.card-subscribe-service-group.type2 .btn-group {
    width: 100%;
    position: relative;
    background: var(--color-w100, #fff);
    z-index: 1
}

.card-subscribe-service-group.type2 .btn-lv07 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%
}

.card-subscribe-service-group.type2 .btn-lv07+.btn-lv07 {
    margin: 1.2rem 0 2.4rem
}

.card-subscribe-service-group.type2 .btn-lv07 .ico-arrow-link {
    margin-left: auto
}

.card-subscribe-service-group.type2 .btn-lv07.bg-vo800 .ico-arrow-link {
    -webkit-filter: var(--filter-w100);
    filter: var(--filter-w100)
}

.card-subscribe-service-group.type2 .btn-lv07 [class^="ico-logo-"] {
    margin-right: 1.4rem;
    border-radius: 0.8rem;
    overflow: hidden
}

.card-subscribe-service-group.type2 .subscribe-coin-bounce {
    position: absolute;
    top: -1rem;
    left: -10rem;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
    -webkit-animation: subscribe-coin 1.2s ease-in infinite;
    animation: subscribe-coin 1.2s ease-in infinite
}

.card-subscribe-service-group.type2 .subscribe-coin-bounce.right {
    left: inherit;
    right: -10rem;
    -webkit-animation-delay: 0.3s;
    animation-delay: 0.3s
}

.card-subscribe-service-group.type2 .subscribe-coin-bounce.img03 {
    left: -12rem;
    -webkit-animation-delay: 0s;
    animation-delay: 0s
}

@-webkit-keyframes subscribe-coin {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
    30% {
        -webkit-transform: translateY(12px);
        transform: translateY(12px);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
    50% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
}

@keyframes subscribe-coin {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
    30% {
        -webkit-transform: translateY(12px);
        transform: translateY(12px);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
    50% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
}

.img-subscribe-service {
    position: relative;
    width: 100%;
    height: 15rem;
    overflow: hidden
}

.img-subscribe-service img {
    width: 16rem;
    opacity: 0;
    position: absolute;
    top: 100%;
    left: 50%;
    -webkit-transform: translateX(-100%);
    -ms-transform: translateX(-100%);
    transform: translateX(-100%)
}

.img-subscribe-service img.active {
    -webkit-animation: subscribe-service-up 0.5s ease-in-out forwards;
    animation: subscribe-service-up 0.5s ease-in-out forwards
}

.img-subscribe-service.type2 {
    height: 12.5rem
}

.img-subscribe-service.type2 img {
    width: 18.8rem;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%)
}

.img-subscribe-service.type2 img.active {
    -webkit-animation: subscribe-service-up2 0.5s ease-in-out forwards;
    animation: subscribe-service-up2 0.5s ease-in-out forwards
}

@-webkit-keyframes subscribe-service-up {
    0% {
        opacity: 0;
        top: 100%;
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%)
    }
    100% {
        opacity: 1;
        top: 2rem;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%)
    }
}

@keyframes subscribe-service-up {
    0% {
        opacity: 0;
        top: 100%;
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%)
    }
    100% {
        opacity: 1;
        top: 2rem;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%)
    }
}

@-webkit-keyframes subscribe-service-up2 {
    0% {
        opacity: 0;
        top: 100%
    }
    100% {
        opacity: 1;
        top: 2rem
    }
}

@keyframes subscribe-service-up2 {
    0% {
        opacity: 0;
        top: 100%
    }
    100% {
        opacity: 1;
        top: 2rem
    }
}

.card-group.bg-gray2.type3>.card-info {
    font-size: 1.5rem;
    line-height: 2rem
}

.card-group.bg-gray2.type3>.card-info .card-tit {
    margin-bottom: 0.8rem
}

.card-group.bg-gray2.type3>.card-info .card-txt {
    color: var(--color-g700, #7d7d7d)
}

.card-layout-group [class^="card-row"] .card-col-content .btn-under-link.type2 {
    display: inline-block;
    margin: 0
}

.card-layout-group.type5 {
    padding-top: 4.8rem;
    padding-bottom: 0
}

.component-minor-carousel {
    overflow: hidden
}

.component-minor-carousel .onboarding-card-swiper.type2 .swiper-container {
    padding-top: 4.4rem !important;
    padding-bottom: 0 !important;
    overflow: inherit
}

.component-minor-carousel .onboarding-card-swiper.type2 .swiper-slide {
    border-radius: 1.2rem;
    height: auto !important
}

.component-minor-carousel .onboarding-card-swiper.type2 .section-link,
.component-minor-carousel .onboarding-card-swiper.type2 .swiper-slide .onboading-item {
    height: auto !important
}

.component-minor-carousel .onboarding-card-swiper.type2 .swiper-slide-active.inducing .section-link {
    position: relative;
    -webkit-animation: ani-inducing 3.0s ease-in-out infinite;
    animation: ani-inducing 3.0s ease-in-out infinite
}

.component-minor-carousel .onboarding-card-swiper.type2 .swiper-slide-active.inducing .section-link:after {
    content: "";
    display: block;
    position: absolute;
    z-index: -1;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    border-radius: 1.6rem;
    -webkit-box-shadow: 0.8rem 0 0.8rem rgba(18, 176, 218, 0.64);
    box-shadow: 0.8rem 0 0.8rem rgba(18, 176, 218, 0.64);
    -webkit-animation: ani-boxshadow 3.0s ease-in-out infinite;
    animation: ani-boxshadow 3.0s ease-in-out infinite
}

.component-minor-carousel .onboarding-card-swiper.type2 .swiper-slide .onboading-item {
    border-radius: 1.2rem;
    overflow: hidden
}

.component-minor-carousel .swiper-pagination {
    margin-top: 2rem;
    opacity: 1
}

.component-minor-carousel .swiper-pagination-bullet {
    width: 0.8rem;
    height: 0.8rem;
    background: transparent;
    border: 1px solid var(--color-pn, #17008c)
}

.component-minor-carousel .swiper-pagination-bullet-active {
    background-color: var(--color-pn, #17008c)
}

.component-minor-carousel .section-link {
    position: relative;
    display: block;
    background-color: var(--color-w100, #fff);
    -webkit-box-shadow: 0.2rem 0 3rem 0 rgba(0, 0, 0, 0.1);
    box-shadow: 0.2rem 0 3rem 0 rgba(0, 0, 0, 0.1)
}

.component-minor-carousel .section-link .img-wrap {
    position: relative;
    height: 16.4rem;
    width: 100%;
    overflow: hidden
}

.component-minor-carousel .section-link .img-wrap img {
    position: absolute;
    top: 0;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    height: 100%
}

.component-minor-carousel .section-link .img-wrap .tag {
    position: absolute;
    top: 1.1rem;
    left: 1.1rem;
    z-index: 1
}

.component-minor-carousel .section-link .text-wrap {
    padding: 2.4rem 1.8rem;
    text-align: left
}

.component-minor-carousel .section-link .text-wrap>.tit {
    font-size: 1.6rem;
    color: var(--color-g800, #414141);
    line-height: 2.1rem;
    font-weight: 700
}

.component-minor-carousel .section-link .text-wrap>.tit>span {
    display: block;
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 700;
    color: var(--color-cy500, #12b0da)
}

.component-minor-carousel .section-link .text-wrap>.txt {
    font-size: 1.4rem;
    color: var(--color-g600, #9b9b9b);
    line-height: 2rem;
    margin-top: 0.4rem
}

.component-minor-carousel .section-link .tag-group {
    margin-top: 2.1rem
}

.component-chk-card-carousel {
    margin-top: 4.8rem
}

.component-chk-card-carousel .onboarding-card .swiper-container {
    padding-top: 0;
    padding-bottom: 0
}

.component-chk-card-carousel .onboarding-card .swiper-slide {
    width: 19.6rem
}

.component-chk-card-carousel .onboarding-card .swiper-slide:not(.swiper-slide-active) .section-link {
    -webkit-transform: scale(0.72);
    -ms-transform: scale(0.72);
    transform: scale(0.72)
}

.component-chk-card-carousel .onboarding-card .swiper-slide-active.inducing .section-link {
    -webkit-animation: none;
    animation: none
}

.component-chk-card-carousel .onboarding-card .swiper-slide-active.inducing .section-link:after {
    display: none
}

.component-chk-card-carousel .onboarding-card .section-link {
    padding: 0;
    width: 100%;
    height: auto;
    margin: 0 auto;
    -webkit-box-shadow: none;
    box-shadow: none;
    background-color: transparent
}

.component-chk-card-carousel .onboarding-card .section-link img {
    width: 100%;
    -webkit-box-shadow: 0 4px 2.4rem 0 rgba(0, 0, 0, 0.12);
    box-shadow: 0 4px 2.4rem 0 rgba(0, 0, 0, 0.12)
}

.component-chk-card-carousel .onboarding-card .section-link img.disabled {
    opacity: 0.3
}

.component-chk-card-carousel .txt-card-name {
    display: block;
    text-align: center;
    margin-top: 2.4rem;
    font-size: 1.8rem;
    line-height: 2.5rem;
    color: var(--color-g900, #141414);
    font-weight: 700
}

.component-chk-card-carousel .txt-card-name.disabled {
    color: var(--txt-disabled)
}

:root .component-chk-card-carousel .txt-card-name {
    font-size: 1.8rem;
    line-height: 2.5rem;
    color: var(--txt-pri, #020616);
    font-weight: 700
}

.component-chk-card-carousel .onboarding-card .swiper-pagination {
    margin-top: 3.2rem
}

.component-chk-card-carousel .swiper-pagination-bullet {
    width: 0.8rem;
    height: 0.8rem;
    background: transparent;
    border: 1px solid var(--color-pn, #17008c)
}

.component-chk-card-carousel .swiper-pagination-bullet-active {
    background-color: var(--color-pn, #17008c)
}

.chk-swiper .swiper-slide {
    width: 19.6rem;
    -webkit-transition: none;
    -o-transition: none;
    transition: none;
    text-align: center
}

.chk-swiper .swiper-slide.w173 {
    width: 17.3rem
}

.chk-swiper .swiper-slide img {
    width: 72%
}

.chk-swiper .swiper-slide-active img {
    width: 100%
}

.chk-swiper .swiper-slide .section-link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 31rem
}

.chk-swiper .section-link img {
    -webkit-box-shadow: 0 4px 2.4rem 0 rgba(0, 0, 0, 0.12);
    box-shadow: 0 4px 2.4rem 0 rgba(0, 0, 0, 0.12)
}

.chk-swiper .section-link img.disabled {
    opacity: 0.3
}

.chk-swiper .txt-card-name {
    display: block;
    text-align: center;
    margin-top: 2.4rem;
    font-size: 1.8rem;
    line-height: 2.5rem;
    color: var(--color-g900, #141414);
    font-weight: 700
}

.chk-swiper .txt-card-name.disabled {
    color: var(--txt-disabled) !important
}

:root .chk-swiper .txt-card-name {
    color: var(--txt-pri, #020616)
}

.chk-swiper .swiper-pagination {
    margin-top: 3.2rem
}

.chk-swiper .swiper-pagination-bullet {
    width: 0.8rem;
    height: 0.8rem;
    background: transparent;
    border: 1px solid var(--color-pn, #17008c)
}

.chk-swiper .swiper-pagination-bullet-active {
    background-color: var(--color-pn, #17008c)
}

.chk-swiper.card-type-flip .txt-card-name.disabled {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.chk-swiper.card-type-flip .txt-card-name .tag {
    margin-left: 0.4rem
}

.chk-swiper.card-type-flip .txt-card-name+.txt-subtxt {
    margin-top: 0.4rem;
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--txt-readonly);
    font-weight: 400;
    text-align: center
}

.chk-swiper.card-type-flip .swiper-container {
    padding-top: 1.2rem;
    padding-bottom: 2.2rem
}

.chk-swiper.card-type-flip .card-bnr {
    width: 100%;
    height: 31rem;
    -webkit-perspective: 80rem;
    perspective: 80rem
}

.chk-swiper.card-type-flip .card-bnr .flip {
    width: 100%;
    height: 100%;
    position: relative;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-perspective-origin: 50% 50%;
    perspective-origin: 50% 50%;
    -webkit-transition: -webkit-transform 0.8s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    transition: -webkit-transform 0.8s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    -o-transition: transform 0.8s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    transition: transform 0.8s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    transition: transform 0.8s cubic-bezier(0.175, 0.885, 0.32, 1.275), -webkit-transform 0.8s cubic-bezier(0.175, 0.885, 0.32, 1.275)
}

.chk-swiper.card-type-flip .card-bnr .flip .back,
.chk-swiper.card-type-flip .card-bnr .flip .front {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.chk-swiper.card-type-flip .card-bnr .flip .back {
    -webkit-transform: rotateY(180deg);
    transform: rotateY(180deg)
}

.chk-swiper.card-type-flip.active .swiper-slide-active .flip {
    -webkit-transform: rotateY(180deg);
    transform: rotateY(180deg)
}

.chk-swiper.card-type-flip.active .swiper-slide-duplicate-active .flip {
    -webkit-transform: rotateY(180deg);
    transform: rotateY(180deg)
}

.chk-swiper.card-type-flip .txt-card-name {
    margin-top: 1.4rem
}

.chk-swiper.card-type-flip .section-link img {
    border-radius: 1rem;
    -webkit-box-shadow: none;
    box-shadow: none
}

.chk-swiper.card-type-flip .swiper-slide-next img,
.chk-swiper.card-type-flip .swiper-slide-prev img {
    border-radius: 0.8rem
}

.chk-swiper.card-type-flip .swiper-slide-prev .card-bnr .flip .back,
.chk-swiper.card-type-flip .swiper-slide-prev .card-bnr .flip .front {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.chk-swiper.card-type-flip .btn-flip.btn-lv03.type3 {
    background: var(--bg-base);
    border: 1px solid var(--border-ter);
    padding: 0 1.2rem;
    border-radius: 10rem
}

.chk-swiper.card-type-flip .btn-flip.btn-lv03.type3 .txt {
    color: var(--txt-sec)
}

.chk-swiper.card-type-flip .btn-flip.btn-lv03.type3 .ico-flip {
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

.chk-swiper.card-type-flip .back .card-info-text {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 0 1.7rem;
    position: absolute;
    z-index: 1;
    width: 17.3rem;
    height: 27.3rem;
    text-align: center;
    white-space: break-spaces;
    word-break: keep-all
}

.chk-swiper.card-type-flip .back .card-info-text__title {
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 2rem;
    color: var(--txt-pri-invert);
    margin-bottom: 1.6rem
}

.chk-swiper.card-type-flip .back .card-info-text__dec {
    font-size: 1.6rem;
    font-weight: 400;
    line-height: 2rem;
    color: var(--txt-pri-invert)
}

.card-info-text__dec+.card-info-text__dec {
    margin-top: 1.2rem
}

.chk-swiper.card-type-flip.active .back .card-info-text::after {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 27.4rem;
    border-radius: 1rem;
    background-color: var(--color-pb100);
    opacity: .5;
    z-index: -1
}

.chk-swiper.h277 .swiper-slide .section-link {
    height: 32.8rem
}

.chk-swiper.card-type-flip .btn-flip.btn-lv03.type4 {
    background: var(--bg-base);
    border: 1px solid var(--border-ter);
    padding: 2.3rem 1.2rem;
    border-radius: 10rem
}

.chk-swiper.card-type-flip .btn-flip.btn-lv03.type4 .txt {
    color: var(--txt-sec)
}

.chk-swiper.card-type-flip .btn-flip.btn-lv03.type4 .ico-flip {
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

.checkA11y.chk-swiper.card-type-flip .swiper-slide.w173 .card-bnr {
    width: 17.3rem;
    height: 27.3rem
}

.feelings-bankbook-view03 .chk-swiper.card-type-flip .card-bnr .flip .front img {
    width: 80%
}

.feelings-bankbook-view03 .chk-swiper.card-type-flip .swiper-slide-active .card-bnr .flip .front img {
    width: 100%
}

.feelings-bankbook-view03 .chk-swiper.card-type-flip .swiper-slide-prev .card-bnr .flip .front {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.feelings-bankbook-view03 .chk-swiper.card-type-flip .card-bnr .flip .front {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.card-group.bg-gray2.complain {
    padding: 2.8rem
}

.card-group.bg-gray2.complain i {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-item-align: baseline;
    align-self: baseline;
    -webkit-filter: var(--filter-bu200);
    filter: var(--filter-bu200);
    margin-right: 2.2rem
}

.card-group.bg-gray2.complain .ico-message {
    width: 3.6rem;
    height: 3.6rem
}

.card-group.bg-gray2.complain .ico-edit {
    width: 3.6rem;
    height: 3.6rem
}

.card-group.bg-gray2.complain .card-tit {
    color: var(--color-g800)
}

.card-group.bg-gray2.complain .card-tit+.card-txt {
    margin-top: 0.6rem
}

.card-group.bg-gray2.complain .card-txt {
    font-size: 1.5rem;
    line-height: 2rem;
    color: var(--color-g600)
}

.card-group.bg-gray2.inandout .card-tit {
    font-size: 1.5rem;
    line-height: 2rem;
    color: var(--txt-sec)
}

.card-group.bg-gray2.inandout .card-txt {
    color: var(--txt-sec);
    margin-top: .2rem
}

.card-group.bg-gray2.inandout .card-info {
    margin-left: 1.2rem
}

.card-group.bg-gray2.dsr-list {
    padding: 1.6rem 2rem
}

.card-group.bg-gray2.dsr-list .card-tit {
    font-size: 1.5rem;
    line-height: 2rem;
    color: var(--txt-sec)
}

.card-group.bg-gray2.dsr-list .card-txt {
    color: var(--txt-sec);
    margin-top: .2rem
}

.card-group.bg-gray2.dsr-list .card-info {
    margin-left: 1.2rem
}

.component-luckydraw-wrap {
    background-color: #252b37
}

.luckydraw-event-wrap {
    position: relative;
    padding: 2rem 0
}

.luckydraw-event-wrap:before {
    content: '';
    display: block;
    width: 100%;
    height: 2rem;
    background: #252b37 url(/resource/img/mmk/common/img-lucky-top.png) top center repeat-x;
    background-size: contain;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1
}

.luckydraw-event-wrap:after {
    content: '';
    display: block;
    width: 100%;
    height: 2rem;
    background: #252b37 url(/resource/img/mmk/common/img-lucky-bottom.png) center -1px repeat-x;
    background-size: contain;
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 1
}

.lucky-tbl {
    position: relative;
    padding: 11rem 1rem 6rem;
    background-color: #f1ffd6
}

.lucky-tbl:before {
    content: '';
    display: block;
    position: absolute;
    top: 2.4rem;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    width: 19.9rem;
    height: 6.2rem;
    background: url(/resource/img/mmk/common/img-lucky-title.png) 0 0 no-repeat;
    background-size: contain
}

.lucky-tbl:after {
    content: '';
    display: block;
    position: absolute;
    bottom: 1.5rem;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    width: 12.3rem;
    height: 3.1rem;
    background: url(/resource/img/mmk/common/img-lucky-barcode.png) 0 0 no-repeat;
    background-size: contain
}

.lucky-tbl table {
    width: 100%;
    table-layout: fixed
}

.lucky-tbl table th {
    padding: 1rem 0;
    text-align: center;
    border-top: 0.5px solid #008657;
    border-bottom: 0.5px solid #008657;
    font-size: 1.5rem;
    line-height: 2.4rem;
    color: #008657;
    text-align: center;
    font-weight: 700
}

.lucky-tbl tfoot td {
    padding: 2.4rem 0 2.4rem 1.5rem;
    border-top: 1px solid #008657;
    border-bottom: 1px dotted #008657;
    font-size: 1.9rem;
    line-height: 2.4rem;
    color: #008657;
    font-weight: 700;
    text-align: center
}

.lucky-tbl tfoot td+td {
    text-align: right;
    padding: 2.4rem 1.5rem 2.4rem 0
}

.lucky-tbl .nodata {
    font-size: 1.9rem;
    line-height: 2.4rem;
    color: #008657;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 29.8rem
}

.lucky-tbl-list {
    padding: 1.6rem 0;
    position: relative;
    max-height: 33rem;
    overflow-y: auto
}

.lucky-tbl-list td {
    padding-bottom: 1rem;
    font-size: 1.5rem;
    line-height: 2.4rem;
    color: #008657;
    text-align: center
}

.lucky-tbl-count {
    padding: 2rem 1.5rem;
    border-bottom: 1px dotted #008657
}

.lucky-tbl-count ul li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.lucky-tbl-count ul li+li {
    padding-top: 0.4rem
}

.lucky-tbl-count ul li span {
    font-size: 1.5rem;
    line-height: 2.4rem;
    color: #008657;
    font-weight: 700
}

.lucky-check {
    display: block;
    margin: 0 auto;
    width: 2.4rem;
    height: 0;
    padding-top: 2.4rem;
    overflow: hidden;
    background: url(/resource/img/mmk/common/img-lucky-checkcard.png) 0 0 no-repeat;
    background-size: contain
}

.lucky-reco {
    display: block;
    margin: 0 auto;
    width: 2.4rem;
    height: 0;
    padding-top: 2.4rem;
    overflow: hidden;
    background: url(/resource/img/mmk/common/img-lucky-today.png) 0 0 no-repeat;
    background-size: contain
}

.lucky-nmuber {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    padding-right: 1rem
}

.lucky-win {
    position: relative;
    z-index: 1
}

.lucky-win:before {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 2.1rem;
    height: 2.1rem;
    border-radius: 99rem;
    background-color: #b6f23d;
    z-index: -1
}

i.lucky-check,
i.lucky-reco {
    display: inline-block;
    vertical-align: middle;
    margin-left: 0.4rem
}

.title-group+.card-group.folding-wrap {
    margin-top: 1.2rem
}

.card-group.folding-wrap+.card-group.folding-wrap {
    margin-top: 2rem
}

.card-group.folding-wrap .list-infobox-group .list-row {
    border: 0
}

.card-group.folding-wrap .list-infobox-group .list-row:last-child {
    padding-bottom: 0
}

.card-group.bg-gray.type6 {
    padding: 1.8rem 2rem;
    border-radius: 2rem
}

.card-group.bg-gray.type6 [class^="card-row"]+.card-row-infobox {
    margin-top: 1.4rem;
    padding-top: 1.4rem;
    border-top: 1px solid var(--color-grey-g200, #edf1f7)
}

.card-group.bg-gray.type6 .card-col-tit {
    color: var(--txt-sec);
    font-weight: 500;
    font-size: 1.6rem;
    line-height: 2.1rem
}

.card-group.bg-gray.type6 .card-col-tit.ty03 {
    color: var(--txt-qua, #67748e);
    font-size: 1.4rem
}

.card-group.bg-gray.type6 .card-col-content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.card-group.bg-gray.type6 .card-col-content .btn-text {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.card-group.bg-gray.type6 .card-col-content .txt {
    color: var(--txt-pri);
    font-weight: 700;
    font-size: 1.6rem;
    line-height: 2.1rem;
    margin: 0 0.2rem 0
}

.card-group.bg-gray.type6 .card-col-content .txt.ty01 {
    color: var(--txt-qua, #67748e);
    font-size: 1.4rem;
    font-weight: 500
}

.card-group.bg-gray.type6 .card-col-content .ico-arrow-link {
    width: 1.6rem;
    height: 1.6rem
}

.card-group.shopping {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: var(--color-in700);
    border: none !important;
    color: var(--color-w100);
    border-radius: 2rem;
    padding: 3rem 2rem 3rem
}

.card-group.shopping .card-tit {
    font-size: 2.8rem;
    line-height: 3.6rem;
    text-align: center
}

.card-group.shopping .card-header {
    display: block
}

.card-group.shopping .card-header .card-tit-box {
    margin-bottom: 1.2rem
}

.card-group.shopping .card-header .card-tit-box>span {
    display: inline-block;
    text-align: center;
    padding: 0.6rem 1.2rem;
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 700;
    border-radius: 2rem;
    background-color: var(--color-indigo-in800)
}

.card-group.shopping .card-img-figure {
    margin-top: -3rem
}

.card-group.shopping .card-img-figure>img {
    width: 21.4rem;
    height: 21.4rem;
    display: block;
    margin: 0 auto
}

.card-group.shopping .card-box {
    width: 100%;
    margin-top: -2.6rem
}

.card-group.shopping .card-box .card-info {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 5.6rem;
    padding: 0 2rem;
    border-radius: 1.2rem;
    font-size: 1.8rem;
    font-weight: 700;
    line-height: 2.5rem;
    color: var(--color-grey-g1000);
    background-color: var(--color-w100, #fff) !important
}

.card-group.shopping .card-box .card-info .txt {
    font-weight: 700
}

.card-group.shopping .card-box .card-info .gradient {
    display: inline-block;
    background: -o-linear-gradient(349deg, #d235e9 -18.54%, #3b37f4 85.16%);
    background: linear-gradient(101deg, #d235e9 -18.54%, #3b37f4 85.16%);
    color: transparent;
    -webkit-background-clip: text;
    background-clip: text
}

.card-group.shopping-card-box {
    border: none !important;
    background: var(--color-g200);
    padding: 1.4rem 2rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.card-group.shopping-card-box .card-tit {
    white-space: nowrap;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    overflow: hidden;
    font-size: 14px;
    font-weight: 700;
    line-height: 2rem;
    width: calc(100% + 1.4rem)
}

.card-group.shopping-card-box .card-link .ico-arrow-link {
    width: 1.4rem;
    height: 1.4rem;
    -webkit-filter: var(--filter-g500);
    filter: var(--filter-g500)
}

.card-group.shopping-card-box .card-info {
    margin-right: auto;
    padding-left: 1.2rem
}

.card-group.shopping2 {
    border: 2px solid var(--border-ter) !important;
    border-radius: 2rem;
    padding: 2.4rem
}

.card-group.shopping2 .card-header .card-loan .card-txt {
    font-size: 1.5rem;
    font-weight: 400;
    line-height: 2rem;
    color: var(--txt-pri)
}

.card-group.shopping2 .ico-help {
    -webkit-filter: var(--filter-g600);
    filter: var(--filter-g600)
}

.card-group.shopping2 .card-loan .card-tit {
    font-size: 2.8rem;
    line-height: 3.6rem;
    color: var(--color-grey-g1000);
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.card-group.shopping2 .card-loan .card-tit .ico-money-point {
    width: 2.8rem;
    height: 2.8rem;
    margin-right: 0.2rem
}

.card-group.shopping2 .card-content {
    margin-top: 2rem;
    padding-top: 2rem;
    border-top: 0.1rem solid var(--color-g300)
}

.card-group.shopping2 [class^="card-row"] .card-col-content {
    font-weight: 600;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: end
}

.card-group.shopping2 [class^="card-row"] .card-col-content .ico-money-point {
    margin-right: 0.2rem
}

.card-group.shopping2 [class^="card-row"] .card-col-tit {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: var(--color-g900)
}

.card-group.shopping2 [class^="card-row"] .card-col-tit .tooltip-group {
    margin-left: 0.2rem
}

.card-group.shopping2 [class^="card-row"]+.card-row {
    margin-top: 1.6rem
}

.card-group.shopping2 .tooltip-area {
    left: 2.4rem
}

.card-group.shopping2 .tooltip-group .tooltip-sub-title {
    white-space: nowrap
}

.card-group.bg-gray.type7 {
    padding: 2.4rem;
    border-radius: 2rem
}

.card-group.bg-gray.type7 [class^="card-row"]+.card-row-infobox {
    margin-top: 1.6rem
}

.card-group.bg-gray.type7 [class^="card-row"] .card-col-tit {
    font-size: 1.6rem;
    color: var(--color-g600);
    font-weight: 500;
    line-height: 2.1rem
}

.card-group.bg-gray.type7 [class^="card-row"] .card-col-content {
    font-size: 1.6rem;
    font-weight: bold;
    line-height: 2.1rem
}

.card-group.bg-gray.type7 .ico-money-point {
    margin-right: 0.2rem
}

.card-group.bg-gray.type7+.bl-txt-group {
    margin-top: 1.8rem
}

.card-group.bg-gray.type7+.bl-txt-group>.txt {
    font-size: 1.4rem;
    color: var(--color-g500)
}

.card-group.bg-gray.type7+.bl-txt-group>.txt+.txt {
    margin-top: 0.8rem
}

.card-group.noline .card-group-inner {
    border-radius: 1rem;
    border: 1px solid var(--color-g200);
    background-color: var(--bg-base);
    padding: 2rem
}

.card-group.noline .card-group-inner .txt-point {
    font-size: 1.6rem;
    color: var(--color-grey-g900);
    font-weight: 700;
    line-height: 2.1rem
}

.card-group.noline .card-group-inner .card-row {
    margin-top: 2rem
}

.card-group.noline .card-group-inner .card-row .card-col .credit-line {
    font-size: 2.1rem;
    font-weight: 700;
    line-height: 2.7rem;
    color: var(--txt-sec-active)
}

.card-group.noline .card-group-inner .card-row .card-col .no-credit-line {
    font-size: 1.8rem;
    font-weight: 700;
    line-height: 2.5rem;
    color: var(--txt-readonly)
}

.card-group.noline .card-group-inner+.btn-group {
    margin-top: 2.4rem
}

.card-group.noline .card-group-inner .btn-under-link {
    color: var(--color-g600)
}

.card-group.combine-type {
    padding: 2.4rem 2rem
}

.card-group.combine-type .card-header {
    padding-bottom: 2rem;
    border-bottom: 1px solid var(--border-qua)
}

.card-group.combine-type .card-header+.card-row {
    margin-top: 2.4rem;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.card-group.combine-type .card-col-content {
    text-align: left
}

.card-group.combine-type .card-col-content>p,
.card-group.combine-type .card-combin-tit {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.card-group.combine-type .card-combin-tit .tit {
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--txt-sec)
}

.card-group.combine-type .card-combin-tit .txt {
    font-size: 2.1rem;
    line-height: 2.7rem;
    color: var(--color-pb100);
    font-weight: 700
}

.card-group.combine-type .card-combin-tit .txt span {
    color: var(--txt-accent-sec)
}

.card-group.combine-type .card-col-content .txt01 {
    font-size: 1.2rem;
    color: var(--txt-sec);
    line-height: 1.6rem;
    font-weight: 700
}

.card-group.combine-type .card-col-content .txt02 {
    font-size: 1.6rem;
    color: var(--txt-sec);
    line-height: 2.1rem;
    font-weight: 700;
    padding: 0.5rem 0 0.8rem
}

.card-group.combine-type .card-col-content .txt03 {
    font-size: 1.1rem;
    color: var(--txt-qua);
    line-height: 1.5rem;
    font-weight: 400
}

.card-group.combine-type .card-col-ico {
    width: 5.6rem;
    text-align: center
}

.card-group.combine-type .card-col-ico .ico-plus {
    -webkit-filter: var(--filter-ico-qua);
    filter: var(--filter-ico-qua);
    width: 1.1rem;
    height: 1.1rem
}

.card-group.combine-type+.btn-group {
    margin-top: 1.2rem
}

.card-group.pb-interest-graph+.btn-group {
    margin-top: 2rem
}

.card-group.combine-type+.btn-group .ico-arrow-link,
.card-group.pb-interest-graph+.btn-group .ico-arrow-link {
    -webkit-filter: var(--filter-ico-sec);
    filter: var(--filter-ico-sec)
}

.card-group.pb-interest-graph {
    border: 0;
    padding: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    margin-top: 4rem
}

.card-graph-row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.card-graph-row .graph-item {
    position: relative;
    width: 100%;
    text-align: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.card-graph-row .graph-item>span {
    position: relative;
    width: 100%;
    display: block;
    z-index: 1
}

.card-graph-row .graph-item>span.txt01 {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 500;
    color: var(--txt-ter)
}

.card-graph-row .graph-item>span.txt02 {
    font-size: 1.2rem;
    line-height: 1.6rem;
    font-weight: 500;
    color: var(--txt-ter);
    padding: 0.3rem 0 0.2rem
}

.card-graph-row .graph-item.item01 {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.card-graph-row .graph-item.item01:before {
    content: '';
    display: block;
    width: 1px;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-color: var(--color-grey-g400);
    z-index: 2
}

.card-graph-row .graph-item.item02 {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding-top: 0.4rem
}

.card-graph-row .graph-item.item02 span {
    font-size: 1.1rem;
    color: var(--txt-quin);
    line-height: 1.5rem;
    text-align: left;
    color: var(--txt-quin)
}

.card-graph-row .graph-item.item02 span+span {
    text-align: right
}

.card-graph-row.type1 {
    -ms-flex-preferred-size: 40%;
    flex-basis: 40%
}

.card-graph-row.type1 .graph-item .txt01 {
    height: 5.9rem;
    line-height: 5.9rem;
    background-color: var(--color-grey-g100)
}

.card-graph-row.type1 .graph-item.item01 {
    padding-left: 0.8rem
}

.card-graph-row.type1 .graph-item.item01:before {
    left: 0.8rem
}

.card-graph-row.type1 .graph-item.item02 span+span {
    margin-right: -17px
}

.card-graph-row.type2 {
    -ms-flex-preferred-size: 60%;
    flex-basis: 60%;
    padding-right: 0.8rem
}

.card-graph-row.type2 .graph-item.item01:after {
    content: '';
    display: block;
    width: 1px;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    background-color: var(--color-grey-g400);
    z-index: 2
}

.card-graph-row.type2 .graph-item.item02 span+span {
    margin-right: -0.5rem
}

.card-graph-row.type2 .graph-item .txt01 {
    height: 7.7rem;
    line-height: 7.7rem;
    background-color: var(--color-indigo-in50);
    color: var(--txt-accent-sec);
    font-weight: 700
}

.card-content-type {
    padding: 1.6rem 2rem
}

.card-content-type .card-content:first-child {
    margin: 0;
    padding: 0;
    border: 0
}

.card-content-type .card-account-tit {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 500;
    color: var(--txt-pri);
    padding-bottom: 1.2rem
}

.card-content-type [class^="card-row"] .txt-info {
    color: var(--txt-ter)
}

.card-content-type [class^="card-row"] .tit-info {
    color: var(--txt-pri)
}

.card-content-type .card-content+.card-content {
    border-color: var(--border-qua)
}

.component-banner-px-ex {
    margin-top: 5.8rem
}

.banner-pb-ex-group {
    position: relative;
    padding: 0 2.4rem 3rem 2.8rem
}

.banner-pb-ex-group img {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 7.5rem
}

.banner-pb-ex-group .banner-box {
    padding: 2.8rem 2.2rem 2.4rem 2.4rem;
    background-color: var(--color-w100);
    -webkit-box-shadow: 0 0.4rem 1.4rem 0 rgba(0, 0, 0, 0.08);
    box-shadow: 0 0.4rem 1.4rem 0 rgba(0, 0, 0, 0.08);
    border-radius: 1.5rem
}

.banner-pb-ex-group .banner-box .title {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 700;
    color: var(--color-grey-g900);
    padding-bottom: 0.9rem
}

.banner-pb-ex-group .banner-box .box-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.banner-pb-ex-group .banner-box .box-item .item01 {
    font-size: 2.6rem;
    line-height: 3.4rem;
    font-weight: 700;
    color: var(--txt-accent-sec)
}

.banner-pb-ex-group .banner-box .box-item .item02>span {
    display: block;
    width: 10rem;
    height: 4rem;
    border-radius: 1rem;
    background-color: var(--bg-accent-pri);
    line-height: 4rem;
    text-align: center;
    color: var(--color-w100);
    font-size: 1.3rem
}

.component-banner-px-ex+.component-banner-text-type {
    margin-top: 4.8rem !important
}

.banner-text-type-group {
    padding: 2.4rem 2rem;
    border-radius: 1.2rem;
    background-color: var(--color-grey-g100)
}

.banner-text-type-group .title {
    font-size: 1.6rem;
    line-height: 2.1rem;
    color: var(--color-grey-g900);
    font-weight: 700
}

.banner-text-type-group .text {
    font-size: 1.5rem;
    line-height: 2rem;
    color: var(--color-grey-g700);
    font-weight: 400;
    padding-top: 0.8rem
}

.card-certi-group {
    padding-top: 4.3rem;
    position: relative;
    width: 100%;
    background: url(../../img/mmk/common/img_gln_certi.png) top center no-repeat;
    background-size: 13.6rem 12.6rem
}

.card-certi-group .card-box {
    padding: 2rem;
    border-radius: 1.2rem;
    border: 1px solid var(--color-grey-g200);
    background-color: var(--color-w100)
}

.card-certi-group .card-box .card-item01 {
    font-size: 1.5rem;
    line-height: 2rem;
    color: var(--color-grey-g600);
    padding-bottom: 1.2rem
}

.card-certi-group .card-box .card-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end
}

.card-certi-group .card-box .card-item .card-item02 .text01 {
    font-size: 2rem;
    line-height: 2.5rem;
    color: var(--color-grey-g900);
    font-weight: 700
}

.card-certi-group .card-box .card-item .card-item02 .text02 {
    display: inline-block;
    vertical-align: bottom
}

.card-certi-group .card-box .card-item .card-item02 .text02 span {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 2.4rem;
    height: 2.4rem;
    border-radius: 0.4rem;
    background-color: var(--bg-qua);
    font-size: 2.1rem;
    font-weight: 700;
    color: var(--color-bu700)
}

.card-certi-group .card-box .card-item .card-item03 {
    font-size: 2.4rem;
    line-height: 2.5rem;
    color: var(--color-grey-g900);
    font-weight: 700
}

.component-inandout-card-carousel {
    position: relative
}

.component-inandout-card-carousel .inandout-touch {
    opacity: 0;
    -webkit-transform: translateY(20px);
    -ms-transform: translateY(20px);
    transform: translateY(20px)
}

.component-inandout-card-carousel .swiper-slide-active .inandout-touch {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s
}

.component-inandout-card-carousel .inandout-card-get {
    opacity: 0
}

.component-inandout-card-carousel .swiper-slide-active .inandout-card-get {
    opacity: 1
}

.component-inandout-card-carousel .swiper-position-left {
    -webkit-transform: translateY(10px) rotate(-5deg);
    -ms-transform: translateY(10px) rotate(-5deg);
    transform: translateY(10px) rotate(-5deg)
}

.component-inandout-card-carousel .swiper-position-right {
    -webkit-transform: translateY(10px) rotate(5deg);
    -ms-transform: translateY(10px) rotate(5deg);
    transform: translateY(10px) rotate(5deg)
}

.card-click .swiper-slide-active {
    -webkit-transform: translateY(0) rotate(0);
    -ms-transform: translateY(0) rotate(0);
    transform: translateY(0) rotate(0)
}

.card-click .swiper-slide-active .section-link {
    position: relative;
    top: -50px;
    -webkit-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s
}

.inandout-touch {
    position: absolute;
    top: -5.5rem;
    right: -2.5rem;
    border-radius: 10rem;
    width: 7.8rem;
    height: 3.2rem;
    background: var(--bg-base);
    z-index: 1;
    -webkit-filter: drop-shadow(0 0.2rem 0.2rem rgba(0, 0, 0, 0.06));
    filter: drop-shadow(0 0.2rem 0.2rem rgba(0, 0, 0, 0.06));
    -webkit-animation: ani_updown 2.5s ease-in-out infinite;
    animation: ani_updown 2.5s ease-in-out infinite
}

@-webkit-keyframes ani_updown {
    0% {
        top: -5.5rem
    }
    50% {
        top: -4.8rem
    }
    100% {
        top: -5.5rem
    }
}

@keyframes ani_updown {
    0% {
        top: -5.5rem
    }
    50% {
        top: -4.8rem
    }
    100% {
        top: -5.5rem
    }
}

.inandout-touch .txt {
    color: var(--txt-pri-active);
    line-height: 2.2rem
}

.inandout-touch-inner {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 100%
}

.inandout-touch-inner:after {
    content: '';
    display: block;
    width: 2rem;
    height: 2rem;
    border-radius: .1rem;
    position: absolute;
    bottom: -.5rem;
    right: 3rem;
    background-color: var(--bg-base);
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    z-index: -1;
    -webkit-filter: drop-shadow(0 0.2rem 0.2rem rgba(0, 0, 0, 0.06));
    filter: drop-shadow(0 0.2rem 0.2rem rgba(0, 0, 0, 0.06))
}

.inandout-swiper .swiper-slide .section-link {
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border-radius: 1.2rem;
    width: 19rem;
    height: 28.5rem;
    -webkit-box-shadow: 1.5rem 2.1rem 5rem 0.4rem rgba(0, 0, 0, 0.5);
    box-shadow: 1.5rem 2.1rem 5rem 0.4rem rgba(0, 0, 0, 0.5)
}

.blue-card {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 100%;
    background-image: url("../../../../resource/img/mmk/common/inandout/card_blue_plate.png");
    background-size: 100% 100%;
    mix-blend-mode: hard-light
}

.blue-card .premium-before-eft {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 52rem;
    height: 52rem;
    background: -webkit-linear-gradient(top, transparent, rgba(255, 255, 255, 0.3), transparent);
    -webkit-animation: ani_shine 3s infinite;
    animation: ani_shine 3s infinite
}

@-webkit-keyframes ani_shine {
    from {
        -webkit-transform: translate(-100%, -100%) rotate(-45deg);
        transform: translate(-100%, -100%) rotate(-45deg)
    }
    to {
        -webkit-transform: translate(0, 0) rotate(-45deg);
        transform: translate(0, 0) rotate(-45deg)
    }
}

@keyframes ani_shine {
    from {
        -webkit-transform: translate(-100%, -100%) rotate(-45deg);
        transform: translate(-100%, -100%) rotate(-45deg)
    }
    to {
        -webkit-transform: translate(0, 0) rotate(-45deg);
        transform: translate(0, 0) rotate(-45deg)
    }
}

.blue-card .blue-card-coin {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 9rem;
    height: 9.5rem;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    background-image: url("../../../../resource/img/mmk/common/inandout/card_blue_coin.png");
    background-size: 9rem 9.5rem;
    z-index: 1
}

.blue-card.premium-card .premium-after-eft,
.blue-card.premium-card .premium-before-eft {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 52rem;
    height: 52rem;
    background: url("../../../../resource/img/mmk/common/inandout/card_blue_effect.png");
    background-size: 52rem 52rem;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    -webkit-animation: ani_rotate 9s linear infinite;
    animation: ani_rotate 9s linear infinite;
    mix-blend-mode: hard-light
}

.blue-card.premium-card .premium-after-eft {
    animation: ani_rotate 8s reverse linear infinite
}

@-webkit-keyframes ani_rotate {
    from {
        -webkit-transform: translate(-50%, -50%) rotate(0);
        transform: translate(-50%, -50%) rotate(0)
    }
    to {
        -webkit-transform: translate(-50%, -50%) rotate(360deg);
        transform: translate(-50%, -50%) rotate(360deg)
    }
}

@keyframes ani_rotate {
    from {
        -webkit-transform: translate(-50%, -50%) rotate(0);
        transform: translate(-50%, -50%) rotate(0)
    }
    to {
        -webkit-transform: translate(-50%, -50%) rotate(360deg);
        transform: translate(-50%, -50%) rotate(360deg)
    }
}

.gold-card {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 100%;
    background-image: url("../../../../resource/img/mmk/common/inandout/card_gold_plate.png");
    background-size: 100% 100%;
    mix-blend-mode: hard-light
}

.gold-card .premium-before-eft {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 52rem;
    height: 52rem;
    background: -webkit-linear-gradient(top, transparent, rgba(255, 255, 255, 0.3), transparent);
    -webkit-animation: ani_shine 3s infinite;
    animation: ani_shine 3s infinite
}

.gold-card .gold-card-coupon {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 12rem;
    height: 9.8rem;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    background-image: url("../../../../resource/img/mmk/common/inandout/card_gold_coupon.png");
    background-size: 12rem 9.8rem;
    z-index: 1
}

.gold-card.premium-card .premium-after-eft,
.gold-card.premium-card .premium-before-eft {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 52rem;
    height: 52rem;
    background: url("../../../../resource/img/mmk/common/inandout/card_gold_effect.png");
    background-size: 52rem 52rem;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    -webkit-animation: ani_rotate 9s linear infinite;
    animation: ani_rotate 9s linear infinite;
    mix-blend-mode: hard-light
}

.gold-card.premium-card .premium-after-eft {
    animation: ani_rotate 4.5s reverse linear infinite
}

.add-card {
    overflow: hidden;
    width: 100%;
    height: 100%;
    background-image: url("../../../../resource/img/mmk/common/inandout/bg_inandout_mission.png");
    background-size: 100% 100%
}

.add-card.auto-receive {
    background-image: url("../../../../resource/img/mmk/common/inandout/img_goldline.png")
}

.add-card .txt-lv01 {
    font-weight: 500;
    line-height: 2.2rem;
    color: var(--txt-readonly-invert);
    margin-bottom: .54rem
}

.add-card .add-card-ico {
    width: 9.4rem;
    height: 9.4rem;
    background-size: 100% 100%;
    margin: 4.8rem auto 3.66rem
}

.inandout-swiper.card-type-flip .swiper-container {
    padding-top: 6rem;
    padding-bottom: 2.9rem
}

.inandout-swiper.card-type-flip {
    width: 100%;
    height: 100%;
    -webkit-perspective: 80rem;
    perspective: 80rem
}

.inandout-swiper.card-type-flip .flip .front {
    -webkit-transform: rotateY(0);
    transform: rotateY(0)
}

.inandout-swiper.card-type-flip .flip .back {
    -webkit-transform: rotateY(180deg);
    transform: rotateY(180deg)
}

.inandout-swiper.card-type-flip.active .swiper-slide-active .flip {
    -webkit-transform: rotateY(180deg);
    transform: rotateY(180deg)
}

.inandout-swiper .swiper-slide {
    -webkit-transition: none;
    -o-transition: none;
    transition: none;
    text-align: center;
    margin: 0 2rem;
    width: 19rem
}

.inandout-swiper .swiper-slide-active .section-link {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1)
}

.inandout-swiper .swiper-slide img {
    width: 100%
}

.inandout-swiper.card-type-flip .swiper-container {
    padding-top: 6rem;
    padding-bottom: 2.9rem
}

.inandout-swiper.card-type-flip {
    width: 100%;
    height: 100%;
    -webkit-perspective: 80rem;
    perspective: 80rem
}

.inandout-swiper.card-type-flip .flip {
    width: 100%;
    height: 100%;
    position: relative
}

.inandout-swiper.card-type-flip .flip .back,
.inandout-swiper.card-type-flip .flip .front {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    border-radius: 1.6rem;
    overflow: hidden
}

.inandout-swiper.card-type-flip .flip .front {
    -webkit-transform: rotateY(0);
    transform: rotateY(0)
}

.inandout-swiper.card-type-flip .flip .back {
    -webkit-transform: rotateY(180deg);
    transform: rotateY(180deg)
}

.inandout-swiper.card-type-flip.active .swiper-slide-active .flip {
    -webkit-transform: rotateY(180deg);
    transform: rotateY(180deg)
}

.inandout-swiper .swiper-slide {
    -webkit-transition: none;
    -o-transition: none;
    transition: none;
    text-align: center;
    margin: 0 2rem;
    width: 19rem;
    height: 34.1rem
}

.inandout-swiper:not(.swiper-slide-active) .section-link {
    -webkit-transform: scale(0.88);
    -ms-transform: scale(0.88);
    transform: scale(0.88)
}

.inandout-swiper .swiper-slide-active .section-link {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1)
}

.inandout-swiper .swiper-slide img {
    width: 100%
}

.inandout-swiper.card-type-flip .add-card .txt {
    opacity: 0
}

.inandout-swiper.card-type-flip .swiper-slide-active .add-card .txt {
    opacity: 1
}

.inandout-swiper .swiper-slide.swiper-slide-prev {
    -webkit-transform: translateY(10px) rotate(-5deg);
    -ms-transform: translateY(10px) rotate(-5deg);
    transform: translateY(10px) rotate(-5deg)
}

.inandout-swiper .swiper-slide.swiper-slide-next {
    -webkit-transform: translateY(10px) rotate(5deg);
    -ms-transform: translateY(10px) rotate(5deg);
    transform: translateY(10px) rotate(5deg)
}

.inandout-swiper .swiper-slide.moving-left {
    -webkit-transform: translateY(10px) rotate(-5deg);
    -ms-transform: translateY(10px) rotate(-5deg);
    transform: translateY(10px) rotate(-5deg)
}

.inandout-swiper .swiper-slide.moving-right {
    -webkit-transform: translateY(10px) rotate(5deg);
    -ms-transform: translateY(10px) rotate(5deg);
    transform: translateY(10px) rotate(5deg)
}

.inandout-swiper.moving-end .moving-left.swiper-slide {
    -webkit-transform: none;
    -ms-transform: none;
    transform: none
}

.inandout-swiper.moving-end .moving-right.swiper-slide {
    -webkit-transform: none;
    -ms-transform: none;
    transform: none
}

.inandout-swiper.moving-end .swiper-slide.swiper-slide-prev {
    -webkit-transform: translateY(10px) rotate(-5deg);
    -ms-transform: translateY(10px) rotate(-5deg);
    transform: translateY(10px) rotate(-5deg)
}

.inandout-swiper.moving-end .swiper-slide.swiper-slide-next {
    -webkit-transform: translateY(10px) rotate(5deg);
    -ms-transform: translateY(10px) rotate(5deg);
    transform: translateY(10px) rotate(5deg)
}

.inandout-swiper.moving-end .swiper-slide-active {
    -webkit-transform: translateY(0) rotate(0);
    -ms-transform: translateY(0) rotate(0);
    transform: translateY(0) rotate(0)
}

.carousel-group[data-centered-slides="true"] .swiper-slide.type-one {
    margin: 0 auto
}

.inandout-swiper .add-card {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding-bottom: 4.94rem;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.inandout-swiper .add-card .img-group {
    margin: 4.8rem 0 auto 0
}

.inandout-swiper .add-card .txt-lv01 {
    margin-bottom: 0.525rem;
    font-weight: 500;
    line-height: 2.1rem;
    color: var(--txt-readonly-invert)
}

.popup-inandout-wrap .popup-dialog.ui-full {
    background-color: transparent
}

.popup-inandout-wrap .ui-full .btn-group.btn-group-inandout {
    position: relative;
    opacity: 0;
    -webkit-transition: opacity 1s 2s;
    -o-transition: opacity 1s 2s;
    transition: opacity 1s 2s
}

.popup-inandout-wrap .ui-popup.ui-popup-open .btn-group.btn-group-inandout {
    opacity: 1
}

.popup-wrap.popup-inandout-wrap .popup-group.popup-inandout-group {
    overflow: hidden;
    background-color: rgba(0, 0, 0, 0.85)
}

.popup-wrap.popup-inandout-wrap .popup-group.popup-inandout-group .popup-footer {
    position: relative;
    z-index: 2
}

.popup-inout-group {
    position: relative;
    padding-top: 10rem
}

.popup-inout-group .inandout-swiper .section-link {
    -webkit-perspective: 80rem;
    perspective: 80rem;
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1)
}

.popup-inout-group.fade-out {
    -webkit-animation: ani_fade_out 0.5s forwards;
    animation: ani_fade_out 0.5s forwards
}

.popup-inout-group .blue-light {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 80rem;
    height: 80rem;
    background: -o-radial-gradient(#d1ecff, transparent, transparent);
    background: radial-gradient(#d1ecff, transparent, transparent);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    opacity: 0;
    -webkit-animation: ani_size 2s 2s forwards;
    animation: ani_size 2s 2s forwards
}

.popup-inout-group .gold-light {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 80rem;
    height: 80rem;
    background: -o-radial-gradient(#ffe5ba, transparent, transparent);
    background: radial-gradient(#ffe5ba, transparent, transparent);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    opacity: 0;
    -webkit-animation: ani_size 2s 2s forwards;
    animation: ani_size 2s 2s forwards
}

.popup-inout-group .card-confetti {
    position: absolute;
    top: 0;
    left: 0;
    height: auto;
    z-index: 1
}

.popup-inout-group .inandout-swiper.card-type-flip {
    position: relative;
    padding-bottom: 36px
}

.popup-inout-group .inandout-swiper.card-type-flip .front .blue-card-coin {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 12.4rem;
    height: 13.2rem;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    background-image: url("../../../../resource/img/mmk/common/inandout/card_blue_coin.png");
    background-repeat: no-repeat;
    background-size: 12.4rem 13.2rem;
    z-index: 1
}

.popup-inout-group .section-link {
    width: 27rem;
    height: 40.5rem;
    margin: 0 auto;
    border-radius: 1.6rem
}

.popup-inout-group.active .flip.active {
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-animation: ani_open_card 2.5s forwards;
    animation: ani_open_card 2.5s forwards
}

.popup-inout-group .flip .back {
    width: 100%;
    height: 100%;
    padding: 1.5rem;
    background: -webkit-gradient(linear, left top, left bottom, from(#d1ecff), color-stop(33%, #ebf7ff), color-stop(66%, #ebf7ff), to(#d1ecff));
    background: -o-linear-gradient(top, #d1ecff, #ebf7ff 33%, #ebf7ff 66%, #d1ecff);
    background: linear-gradient(to bottom, #d1ecff, #ebf7ff 33%, #ebf7ff 66%, #d1ecff)
}

.popup-inout-group .flip .back.gold-back {
    width: 100%;
    height: 100%;
    padding: 1.5rem;
    background: -webkit-gradient(linear, left top, left bottom, from(#ffe5ba), color-stop(33%, #fff0d7), color-stop(66%, #fff0d7), to(#ffe5ba));
    background: -o-linear-gradient(top, #ffe5ba, #fff0d7 33%, #fff0d7 66%, #ffe5ba);
    background: linear-gradient(to bottom, #ffe5ba, #fff0d7 33%, #fff0d7 66%, #ffe5ba)
}

.popup-inout-group .back.blue-back .badge {
    background-color: var(--color-bu50);
    color: var(--color-blue-bu700)
}

.popup-inout-group .card-back {
    height: 100%;
    padding: 2.5rem 1.9rem 5.9rem;
    background-color: var(--bg-base);
    text-align: center;
    border-radius: 1rem
}

.popup-inout-group .back.gold-back .card-back {
    position: relative;
    padding: 2.5rem 1.9rem 2.5rem
}

.popup-inout-group .back.gold-back .card-back .coupon-link {
    margin-top: 0;
    position: absolute;
    left: 0;
    bottom: 2.5rem;
    width: 100%;
    text-align: center;
    opacity: 0
}

.popup-inout-group .back.gold-back .card-back .coupon-link.active {
    opacity: 1;
    -webkit-transition: opacity .8s ease-out 0s;
    -o-transition: opacity .8s ease-out 0s;
    transition: opacity .8s ease-out 0s
}

.popup-inout-group .card-back .badge {
    display: inline-block;
    padding: .7rem 1.4rem;
    font-size: 1.4rem;
    line-height: 2rem;
    background-color: var(--color-og50);
    color: var(--color-orange-og700);
    border-radius: 1.7rem
}

.popup-inout-group .card-back .thumb {
    display: inline-block;
    overflow: hidden;
    width: 13.5rem;
    height: 13.5rem;
    margin: 3.2rem auto;
    border-radius: 50%
}

.popup-inout-group .gold-back .card-back .thumb {
    width: 10rem;
    height: 10rem;
    margin: 1.6rem auto 2rem
}

.popup-inout-group .card-back .thumb-info {
    font-weight: 500;
    font-size: 1.8rem;
    line-height: 2.5rem;
    color: var(--txt-sec)
}

.popup-inout-group .card-back .thumb-info .info-title {
    margin-bottom: .2rem
}

.popup-inout-group .card-back .info-price {
    font-size: 2.6rem;
    line-height: 4.25rem;
    font-weight: 700
}

.popup-inout-group .card-back .info-price {
    line-height: normal
}

.popup-inout-group .card-back .info-price strong {
    font-size: 5rem;
    font-weight: 700;
    vertical-align: -.3rem
}

.popup-inout-group .gold-back .card-back .info-price strong {
    font-size: 4.4rem;
    font-weight: 700;
    vertical-align: -.3rem
}

.popup-inout-group .card-back .coupon-link {
    display: inline-block;
    margin-top: 3.4rem;
    font-size: 1.6rem;
    line-height: 2.1rem;
    color: var(--txt-ter);
    text-decoration: underline
}

.popup-inout-group .blue-card.premium-card::after,
.popup-inout-group .blue-card::before,
.popup-inout-group .gold-card.premium-card::after,
.popup-inout-group .gold-card::before {
    display: none
}

.popup-inandout-group .popup-inout-group.active .section-link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-column-gap: 4rem;
    -moz-column-gap: 4rem;
    column-gap: 4rem
}

.popup-inandout-group .popup-inout-group.active .section-link .flip {
    display: none;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 27rem;
    flex: 0 0 27rem
}

.popup-inandout-group .popup-inout-group.active .section-link .flip.active {
    display: block
}

.popup-inandout-group .popup-inout-group.active .section-link .flip.move-up-card {
    display: block;
    -webkit-animation: ani_move_up_card 0.3s cubic-bezier(0.64, -0.25, 1, -0.1) forwards;
    animation: ani_move_up_card 0.3s cubic-bezier(0.64, -0.25, 1, -0.1) forwards
}

.popup-inandout-group .popup-inout-group.active .section-link .flip.move-up-card .back {
    -webkit-backface-visibility: visible;
    backface-visibility: visible;
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0)
}

@-webkit-keyframes ani_move_up_card {
    from {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1
    }
    to {
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%);
        opacity: 0
    }
}

@keyframes ani_move_up_card {
    from {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1
    }
    to {
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%);
        opacity: 0
    }
}

@-webkit-keyframes ani_open_card {
    0% {
        -webkit-transform: scale(0) rotateY(0);
        transform: scale(0) rotateY(0)
    }
    30% {
        -webkit-transform: scale(1) rotateY(0);
        transform: scale(1) rotateY(0)
    }
    100% {
        -webkit-transform: scale(1) rotateY(900deg);
        transform: scale(1) rotateY(900deg)
    }
}

@keyframes ani_open_card {
    0% {
        -webkit-transform: scale(0) rotateY(0);
        transform: scale(0) rotateY(0)
    }
    30% {
        -webkit-transform: scale(1) rotateY(0);
        transform: scale(1) rotateY(0)
    }
    100% {
        -webkit-transform: scale(1) rotateY(900deg);
        transform: scale(1) rotateY(900deg)
    }
}

@-webkit-keyframes ani_fade_out {
    from {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1
    }
    to {
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%);
        opacity: 0
    }
}

@keyframes ani_fade_out {
    from {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1
    }
    to {
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%);
        opacity: 0
    }
}

.list-infobox-group.ty06 .item-box-sub {
    border-radius: 2rem
}

.list-infobox-group.ty06 .item-box-sub .box-sub .area-desc,
.list-infobox-group.ty06 .item-box-sub .box-sub .area-desc *,
.list-infobox-group.ty06 .item-box-sub .box-sub .area-term {
    font-size: 1.6rem !important;
    line-height: 2.1rem !important;
    font-weight: 500
}

.list-infobox-group.ty06 .item-box-sub .box-sub .area-desc,
.list-infobox-group.ty06 .item-box-sub .box-sub .area-desc * {
    font-weight: 700
}

.list-infobox-group.ty06 .item-box-sub .row-box+.row-box {
    margin-top: 1.6rem;
    padding-top: 1.6rem
}

.list-infobox-group.ty06 .item-box-sub .box-sub+.box-sub {
    margin-top: 1.6rem
}

.list-infobox-group.noline.ellipsis .list-item {
    padding-top: 1.2rem;
    padding-bottom: 1.2rem
}

.list-infobox-group.noline.ellipsis .list-item+.list-item {
    margin-top: .4rem
}

.list-infobox-group.noline.ellipsis .list-txt {
    width: calc(100% - 6rem);
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    display: -webkit-box;
    white-space: wrap;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    min-width: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.list-infobox-group.noline.ellipsis .area-term.txt-pri {
    padding-right: 0;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.list-infobox-group.noline.ellipsis .area-desc {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 1.2rem;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.list-infobox-group.noline.ellipsis .area-desc .btn-lv03 {
    height: 2.8rem;
    padding-left: 0.6rem;
    padding-right: 0.6rem
}

.list-infobox-group.noline.ellipsis .area-desc .btn-lv03 .txt {
    font-size: 1.3rem;
    line-height: 1.6rem;
    color: var(--txt-accent-pri);
    font-weight: 500
}

.list-infobox-group.noline.ellipsis .area-desc .btn-lv03.primary2 .txt {
    color: #fff
}

.list-infobox-group.noline.ellipsis [class*="ico-"],
.list-infobox-group.noline.ellipsis [class*="logo-"] {
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.list-linebox-group.icon-type-accordion .col-tit {
    width: calc(100% - 2.8rem)
}

.list-linebox-group.icon-type-accordion .accordion-thum-img {
    width: 4rem;
    height: 4rem;
    border-radius: 50%;
    background-color: var(--color-bu25);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-right: 1.6rem
}

.list-linebox-group.icon-type-accordion .accordion-thum-img [class^="ico-"] {
    width: 2.4rem;
    height: 2.4rem
}

.list-linebox-group.icon-type-accordion .list-row.ui-accordion .ico-arrow-open {
    width: 1.6rem;
    height: 1.6rem;
    -webkit-filter: none;
    filter: none;
    -webkit-mask-image: url(/resource/img/mmk/kds3_5/ico/line/chevron_down.svg);
    mask-image: url(/resource/img/mmk/kds3_5/ico/line/chevron_down.svg);
    background-color: var(--bg-pri);
    -webkit-mask-size: cover;
    mask-size: cover;
    background-image: none
}

.list-linebox-group.icon-type-accordion .tit-area {
    padding-left: 0;
    width: calc(100% - 5.6rem)
}

.list-linebox-group.icon-type-accordion .tit-area .tit-list {
    width: 100%;
    margin-top: 0;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.list-linebox-group.icon-type-accordion .box-state {
    margin-top: 0.4rem
}

.list-linebox-group.icon-type-accordion .box-state .txt-state {
    font-size: 1.4rem;
    color: var(--txt-qua);
    line-height: 2rem
}

.list-linebox-group.icon-type-accordion .title-field-notice {
    font-size: 1.5rem
}

.list-linebox-group.icon-type-accordion .accordion-cont {
    margin-top: 1.6rem;
    margin-bottom: 1.2rem;
    border-radius: 2rem;
    padding: 3.2rem 2rem
}

.list-linebox-group.icon-type-accordion .accordion-cont .row+.row {
    margin-top: 2.4rem
}

.list-linebox-group.icon-type-accordion .list-item.ui-accordion-list+.list-item.ui-accordion-list {
    margin-top: 0.4rem
}

.list-linebox-group.icon-type-accordion .list-item.ui-accordion-list.open .tit-area .tit-list {
    display: -webkit-box;
    white-space: wrap;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical
}

.component-inandout-card-carousel .a11y-swiper[data-a11y-nav="true"] .inandout-touch {
    opacity: 0;
    -webkit-transform: translateY(20px);
    -ms-transform: translateY(20px);
    transform: translateY(20px)
}

.component-inandout-card-carousel .a11y-swiper[data-a11y-nav="true"] .swiper-slide-active .inandout-touch {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s
}

.inandout-swiper.a11y-swiper[data-a11y-nav="true"] .swiper-slide .inandout-touch {
    position: relative;
    height: 3.7rem;
    width: 100%;
    top: unset;
    right: unset;
    border-radius: unset;
    background: unset;
    z-index: unset;
    -webkit-filter: unset;
    filter: unset;
    -webkit-animation: ani_updown_a11y 2.5s ease-in-out infinite;
    animation: ani_updown_a11y 2.5s ease-in-out infinite
}

@-webkit-keyframes ani_updown_a11y {
    0% {
        top: -1.2rem
    }
    50% {
        top: -1.9rem
    }
    100% {
        top: -1.2rem
    }
}

@keyframes ani_updown_a11y {
    0% {
        top: -1.2rem
    }
    50% {
        top: -1.9rem
    }
    100% {
        top: -1.2rem
    }
}

.inandout-swiper.a11y-swiper[data-a11y-nav="true"] .swiper-slide .inandout-touch-inner {
    position: absolute;
    top: 0;
    right: 0;
    left: 50%;
    border-radius: 10rem;
    width: 7.8rem;
    height: 3.2rem;
    background: var(--bg-base);
    z-index: 1;
    -webkit-filter: drop-shadow(0 0.2rem 0.2rem rgba(0, 0, 0, 0.06));
    filter: drop-shadow(0 0.2rem 0.2rem rgba(0, 0, 0, 0.06));
    -webkit-animation: unset;
    animation: unset;
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-left: 8.4rem
}

.inandout-swiper.a11y-swiper[data-a11y-nav="true"] .swiper-slide .inandout-touch-inner:after {
    content: '';
    display: block;
    width: 2rem;
    height: 2rem;
    border-radius: .1rem;
    position: absolute;
    bottom: -.5rem;
    right: 3rem;
    background-color: var(--bg-base);
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    z-index: -1;
    -webkit-filter: drop-shadow(0 0.2rem 0.2rem rgba(0, 0, 0, 0.06));
    filter: drop-shadow(0 0.2rem 0.2rem rgba(0, 0, 0, 0.06))
}

.inandout-swiper.a11y-swiper[data-a11y-nav="true"] .swiper-slide .section-link {
    margin: 0 auto
}

.inandout-swiper.a11y-swiper[data-a11y-nav="true"] .swiper-slide.swiper-slide-prev {
    -webkit-transform: none !important;
    -ms-transform: none !important;
    transform: none !important
}

.inandout-swiper.a11y-swiper[data-a11y-nav="true"] .swiper-slide.swiper-slide-next {
    -webkit-transform: none !important;
    -ms-transform: none !important;
    transform: none !important
}

.inandout-swiper.a11y-swiper[data-a11y-nav="true"] .swiper-slide.moving-left {
    -webkit-transform: none !important;
    -ms-transform: none !important;
    transform: none !important
}

.inandout-swiper.a11y-swiper[data-a11y-nav="true"] .swiper-slide.moving-right {
    -webkit-transform: none !important;
    -ms-transform: none !important;
    transform: none !important
}

.inandout-swiper.a11y-swiper[data-a11y-nav="true"] .swiper-slide {
    margin: 0 !important
}

[class^="component"].no-space .inandout-swiper.a11y-swiper[data-a11y-nav="true"] .swiper-container {
    padding-left: 0 !important;
    padding-right: 0 !important;
    padding-top: 2.3rem;
    padding-bottom: 6.5rem
}

.inandout-swiper.a11y-swiper[data-a11y-nav="true"].section-link {
    -webkit-transform: scale(1) !important;
    -ms-transform: scale(1) !important;
    transform: scale(1) !important
}

.inandout-swiper.a11y-swiper[data-a11y-nav="true"] .swiper-button-next,
.inandout-swiper.a11y-swiper[data-a11y-nav="true"] .swiper-button-prev {
    top: 45%;
    width: 5.2rem;
    height: 5.2rem
}

.inandout-swiper.a11y-swiper[data-a11y-nav="true"] .swiper-button-next:after,
.inandout-swiper.a11y-swiper[data-a11y-nav="true"] .swiper-button-prev:after {
    content: "";
    display: block;
    width: 2.8rem;
    height: 2.8rem;
    -webkit-filter: var(--filter-w100);
    filter: var(--filter-w100);
    background-image: var(--path-line-chevron-down);
    background-repeat: no-repeat;
    background-size: contain
}

.inandout-swiper.a11y-swiper[data-a11y-nav="true"] .swiper-button-next:after {
    -webkit-transform: rotate(270deg);
    -ms-transform: rotate(270deg);
    transform: rotate(270deg)
}

.inandout-swiper.a11y-swiper[data-a11y-nav="true"] .swiper-button-prev:after {
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg)
}

.inandout-swiper .tag[class*="ad-"] {
    position: absolute;
    top: 1.6rem;
    right: 1.6rem;
    width: 2rem;
    height: 1.4rem;
    padding: 0;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.inandout-swiper .tag[class*="ad-"] .txt {
    font-size: .9rem;
    line-height: 1.4rem
}

.list-infobox-group.type07 {
    background: var(--bg-qua);
    border-radius: 1.2rem;
    margin-top: 1.6rem
}

.list-infobox-group.type07 .list-row {
    border: none;
    padding: 1.6rem 2rem
}

.list-infobox-group.type07 .list-row:first-child {
    border: none;
    padding: 1.6rem 2rem
}

.list-infobox-group.type07 .list-row .item-box-sub {
    padding: 0;
    margin-top: 0
}

.list-infobox-group.type07 .list-row .item-box-sub .row-box .tit-box-sub {
    margin-bottom: .4rem
}

.list-infobox-group.type07 .list-row .item-box-sub .box-sub {
    padding-top: .8rem;
    margin-top: 0
}

.list-infobox-group.type07 .list-row .item-box-sub .area-desc,
.list-infobox-group.type07 .list-row .item-box-sub .area-desc .txt-lv02 {
    font-size: 1.5rem !important;
    color: var(--txt-pri);
    word-break: break-all
}

.list-infobox-group.type07 .ui-accordion-cont:first-child {
    border-top: 0.1rem solid var(--border-qua)
}

.list-infobox-group.type07 .ui-accordion-cont {
    padding: 0;
    border-top: 0.1rem solid var(--border-qua);
    border-radius: 0 !important;
    margin-top: 1.2rem
}

.list-infobox-group.type07 .ui-accordion .area-term {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.list-infobox-group.type07 .area-term .ico-help {
    margin-left: .2rem;
    width: 2rem;
    height: 2rem;
    margin-top: -.1rem
}

.list-infobox-group.type07 .info-box {
    margin-top: 1.6rem;
    padding: 1.6rem;
    background: var(--bg-base);
    border-radius: 1.2rem;
    font-size: 1.4rem;
    color: var(--txt-sec);
    line-height: 2rem
}

.list-infobox-group.type07 .list-infobox-group {
    border: none;
    background: var(--bg-base);
    margin-top: 1.6rem;
    border-radius: 1.2rem;
    font-size: 1.4rem;
    color: var(--txt-sec);
    line-height: 2rem
}

.list-infobox-group.type07 .list-infobox-group.type-border {
    border: 0.1rem solid var(--border-ter)
}

.list-infobox-group.type07 .list-infobox-group .list-row {
    padding: 1.6rem 2rem 1.6rem
}

.list-infobox-group.type07 .cont-box {
    margin-top: .8rem
}

.list-infobox-group.type07 .success {
    color: var(--txt-accent-sec)
}

.list-infobox-group.type07 .caution {
    color: var(--color-yl700)
}

.list-infobox-group.type07 .btn-acco {
    padding-left: .6rem
}

.list-infobox-group.type07 .list-infobox-group .area-desc .txt-sub {
    margin-top: .2rem
}

.list-infobox-group.type07 .info-txt-area {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: var(--bg-ter);
    padding: .8rem 1.6rem;
    border-radius: 1rem
}

.list-infobox-group.type08 .list-item {
    display: block;
    padding: 1.4rem 0
}

.list-infobox-group.type08 .list-item+.list-item {
    margin-top: 0
}

.list-infobox-group.type08 .item-box {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: left;
    -ms-flex-pack: left;
    justify-content: left
}

.list-infobox-group.type08 .item-box .area-term {
    display: block;
    width: 3rem;
    margin-right: 1.6rem;
    padding-right: 0;
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 2.1rem;
    color: var(--txt-quin);
    text-align: center
}

.list-infobox-group.type08 .item-box .area-desc {
    text-align: left
}

.list-infobox-group.type08 .item-box .area-desc .txt-tit {
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 2rem;
    color: var(--txt-sec);
    width: 100%;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap
}

.list-infobox-group.type08 .item-box .area-desc .txt-price {
    margin-top: 0.4rem;
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--txt-qua)
}

.insurence-carousel-group03 .swiper-slide:not(:last-of-type) {
    margin-right: 1rem
}

.insurence-carousel-group03 .section-link {
    position: relative;
    display: block;
    width: 100%;
    padding: 1.6rem 2rem;
    border-radius: 1.2rem;
    background-color: var(--bg-ter)
}

.insurence-carousel-group03 .row-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.insurence-carousel-group03 img {
    width: 100%
}

.insurence-carousel-group03 .col-head {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-line-pack: justify;
    align-content: space-between
}

.insurence-carousel-group03 .col-head .ell01,
.insurence-carousel-group03 .col-head .ell02 {
    display: -webkit-box;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1
}

.insurence-carousel-group03 .col-head .tit {
    line-height: 2rem;
    font-size: 1.4rem;
    color: var(--txt-qua)
}

.insurence-carousel-group03 .col-head .txt {
    line-height: 2rem;
    font-size: 1.5rem;
    color: var(--txt-sec);
    font-weight: 700;
    margin-top: 0.2rem
}

.insurence-carousel-group03 .col-cont {
    width: 4.4rem;
    height: 4.4rem;
    margin-left: 1.2rem;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center
}

.card-layout-group.main-invest-card {
    margin: 4rem 0 .8rem;
    padding: 0
}

.card-layout-group.main-invest-card .card-group {
    margin: 0;
    padding: 1.6rem 0;
    border: none;
    border-radius: unset
}

.card-layout-group.main-invest-card .card-group .card-info {
    margin-left: 1.2rem
}

.card-layout-group.main-invest-card .card-group .card-tit {
    font-size: 1.6rem;
    font-weight: 500;
    line-height: 2.1rem
}

.card-layout-group.main-invest-card .card-group .card-txt {
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 2rem
}

.simsa-carousel {
    margin-top: 24px
}

.simsa-carousel .card-group {
    height: 19.3rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.simsa-carousel .card-group.bd-quin {
    border: 1px solid var(--border-quin)
}

.simsa-carousel .txt-main {
    font-size: 1.8rem;
    font-weight: 700;
    line-height: 2.5rem
}

.simsa-carousel .txt-sub {
    margin-top: 1.6rem;
    color: var(--txt-ter);
    font-size: 1.5rem;
    line-height: 2rem
}

.simsa-carousel .txt-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end
}

.simsa-carousel .swiper-pagination {
    margin-top: 1.6rem;
    padding-bottom: 2.4rem
}

.component-return-luckydraw {
    padding: 0 2.1rem;
    background-color: var(--color-grey-g900)
}

.component-return-luckydraw::before {
    content: "";
    display: block;
    height: 2rem;
    background: url(/resource/img/mmk/common/return-lucky/img_return_lucky_top.png) no-repeat 0 0/100%
}

.component-return-luckydraw::after {
    content: "";
    display: block;
    height: 2rem;
    background: url(/resource/img/mmk/common/return-lucky/img_return_lucky_bottom.png) no-repeat 0 0/100%
}

.component-return-luckydraw .return-luckydraw-wrap {
    margin-bottom: -1px;
    padding: 1.4rem 1rem 1.5rem;
    background-color: var(--color-w100)
}

.component-return-luckydraw .return-luckydraw-wrap::before {
    content: "";
    display: block;
    width: 10.8rem;
    height: 11.3rem;
    margin: 0 auto 2.3rem;
    background: url(/resource/img/mmk/common/return-lucky/img_return_lucky_title.png) no-repeat 0 0/100%
}

.component-return-luckydraw .return-luckydraw-wrap::after {
    content: "";
    display: block;
    width: 12.3rem;
    height: 3.1rem;
    margin: 1.3rem auto 0;
    background: url(/resource/img/mmk/common/return-lucky/ico_return_lucky_barcode.png) no-repeat 0 0/100%
}

.component-return-luckydraw .ico-lucky-card {
    overflow: hidden;
    width: 2.4rem;
    height: 0;
    padding-top: 2.4rem;
    background-image: url(/resource/img/mmk/common/return-lucky/ico_return_lucky_card.png)
}

.component-return-luckydraw .ico-lucky-card-new {
    overflow: hidden;
    width: 2.4rem;
    height: 0;
    padding-top: 2.4rem;
    background-image: url(/resource/img/mmk/common/return-lucky/ico_return_lucky_card_new.png)
}

.component-return-luckydraw .ico-lucky-today {
    overflow: hidden;
    width: 2.4rem;
    height: 0;
    padding-top: 2.4rem;
    background-image: url(/resource/img/mmk/common/return-lucky/ico_return_lucky_today.png)
}

.table-return-luckydraw {
    position: relative
}

.table-return-luckydraw table {
    width: 100%;
    table-layout: fixed
}

.table-return-luckydraw table th {
    padding: 1rem 0;
    border-top: 1px solid var(--border-ter);
    border-bottom: 1px solid var(--border-ter);
    font-size: 1.5rem;
    line-height: 2.4rem;
    color: var(--txt-ter);
    font-weight: 700;
    text-align: center
}

.table-return-luckydraw tfoot th {
    padding: 2.4rem 0 2.4rem 1.7rem;
    border-top: 1px solid var(--border-ter);
    border-bottom: 1px dotted var(--border-ter);
    font-size: 1.9rem;
    line-height: 2.4rem;
    color: var(--txt-qua);
    font-weight: 700;
    text-align: left
}

.table-return-luckydraw tfoot td {
    padding: 2.4rem 1.7rem 2.4rem 0;
    border-top: 1px solid var(--border-ter);
    border-bottom: 1px dotted var(--border-ter);
    font-size: 1.9rem;
    line-height: 2.4rem;
    color: var(--color-g900);
    font-weight: 700;
    text-align: right
}

.table-return-luckydraw .nodata {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 29.8rem;
    font-size: 1.9rem;
    line-height: 2.4rem;
    color: var(--color-pb100)
}

.return-luckydraw-list {
    padding: 1.1rem 0 1.6rem;
    position: relative;
    max-height: 29.8rem;
    overflow-y: auto
}

.return-luckydraw-list td {
    padding: 0.5rem 0;
    font-size: 1.5rem;
    line-height: 2.4rem;
    color: var(--txtpri);
    text-align: center
}

.return-luckydraw-list .return-lucky-nmuber {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    padding-right: 1rem
}

.return-luckydraw-count {
    padding: 2.6rem 1.7rem;
    border-bottom: 1px dotted var(--border-ter)
}

.return-luckydraw-count ul li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.return-luckydraw-count ul li+li {
    padding-top: 0.4rem
}

.return-luckydraw-count ul li .tit,
.return-luckydraw-count ul li .txt {
    font-size: 1.5rem;
    line-height: 2.4rem;
    color: var(--txt-qua);
    font-weight: 700
}

.return-luckydraw-count ul li .tit {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.return-luckydraw-count ul li .tit [class^="ico-"] {
    margin-right: 0.8rem
}

.return-luckydraw-count ul li .txt {
    color: var(--txt-pri)
}

.card-group.type11 {
    margin-top: 2.4rem
}

.card-group.type11 [class^="card-row"] .card-col-group .sum {
    font-size: 1.6rem
}

.card-group.type11 .card-col-group.type01 {
    border-top: 0.1rem solid var(--border-qua);
    padding-top: 1.6rem;
    margin-top: .8rem
}

.card-group.type11 .card-loan .card-tit {
    margin-bottom: .2rem
}

.card-group.type11 .card-loan .card-row-option {
    margin-bottom: .1rem
}

.card-group.type11 .card-group [class^="card-row"] .sum>div {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.card-group.type11 .card-group [class^="card-row"] .sum .tag {
    margin-left: .6rem
}

.card-group.type11.active {
    border-color: var(--border-qua)
}

.card-group.type12 {
    padding: 0
}

.card-group.type12 .card-header {
    padding: 2.6rem 2rem
}

.card-group.type12 .card-content {
    padding: 1.6rem;
    border-top: 0.1rem solid var(--color-g300, #e0e0e0);
    margin-top: 0
}

.ui-expand-btn.type01 {
    position: absolute;
    left: 50%;
    bottom: 0;
    -webkit-transform: translate(-50%, 50%);
    -ms-transform: translate(-50%, 50%);
    transform: translate(-50%, 50%)
}

.card-group.type13 {
    padding: 1.6rem
}

.card-group.type14 {
    padding: 2.4rem;
    border-radius: 1.6rem
}

.card-group.type14 .card-header+.btn-group {
    margin-top: 1.6rem
}

.card-group.type14 .btn-group button {
    padding: 1.2rem 1.6rem;
    border-radius: 0.8rem;
    background-color: var(--color-g300)
}

.card-group.type14 .btn-group button .txt {
    font-size: 1.4rem;
    line-height: 1.6rem
}

.card-group.type15 {
    border-radius: 1.6rem;
    background-color: var(--bg-qua);
    padding: 1.6rem 2rem;
    border: none
}

.card-group.type15 .card-box-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 1.2rem
}

.card-group.type15 .card-box-list:last-child {
    margin-bottom: 0
}

.card-group.type15 .card-box-list [class^="ico-"] {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    margin: 1.6rem 1.2rem 0 0
}

.card-group.type15 .card-box-list .card-box-title-group .card-box-title {
    font-size: 1.8rem;
    font-weight: 700;
    line-height: 2.5rem;
    color: var(--txt-sec)
}

.card-group.type15 .card-box-list .card-box-title-group .card-box-subtitle {
    margin-top: .2rem;
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 2rem;
    color: var(--txt-qua)
}

.card-group.type15 .card-box-list .card-box-title-group .card-address-box {
    margin-top: .4rem;
    border-radius: 1.2rem;
    border: 1px solid var(--border-quin);
    background-color: var(--bg-base);
    padding: .8rem 1.6rem
}

.card-group.type15 .card-box-list .card-box-title-group .card-address-box .txt {
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 2rem;
    color: var(--txt-qua)
}

.card-group.type16 {
    padding: 1.6rem 2rem
}

.card-group.type16 .card-col-tit {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.card-group.type16 .card-col-tit .compare-items-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-right: 0.4rem
}

.card-group.type16 .card-col-tit .compare-items-group .item:first-child {
    margin-left: 0
}

.card-group.type16 .card-col-tit .compare-items-group .item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-left: -0.6rem
}

.card-group.type17 .card-info+.card-info {
    margin-top: 0.8rem
}

.card-group.type17 .card-info .card-loan-tit .txt-lv03 {
    margin-left: 0
}

.card-group.type18 {
    padding: 2.4rem 2rem
}

.card-group.type18+.card-group.type18 {
    margin-top: 1.2rem
}

.card-group.type18 .card-header .card-info+.ico-arrow-link {
    margin-left: 0.8rem
}

.card-group.type19 {
    padding: 2rem;
    color: var(--txt-sec-active);
    border: none
}

.card-group.type19 [class^="card-row"] .txt-info {
    font-size: 1.6rem;
    color: var(--txt-sec-active)
}

.card-group.type19 [class^="card-row"] .tit-info {
    font-size: 1.6rem;
    color: var(--txt-sec-active);
    font-weight: 700
}

.card-group.type19 .card-row {
    padding: .35rem 0
}

.card-group.type19 .card-row+.card-row {
    margin-top: 1rem
}

.card-group.type20 .card-header+.card-row-info {
    padding-top: 0;
    padding-bottom: 1.6rem;
    margin-bottom: 1.6rem;
    border-top: unset;
    border-bottom: 1px solid var(--border-qua)
}

.card-group.type20 .card-row-info .txt-info {
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 2rem;
    color: var(--txt-ter)
}

.card-group.type20 .card-row-info .tit-info {
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 2rem;
    color: var(--txt-pri)
}

.card-group.type20 .card-col-group .card-col {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-column-gap: .8rem;
    -moz-column-gap: .8rem;
    column-gap: .8rem
}

.card-group.type20 .card-col-group .card-row-option {
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 2rem;
    color: var(--txt-ter)
}

.card-group.type20 .card-col-group .sum {
    font-size: 1.4rem;
    font-weight: 700;
    line-height: 2.3rem;
    color: var(--txt-accent-pri)
}

.card-group.type20 .card-col-group .sum strong {
    font-size: 2.1rem;
    font-weight: 700;
    line-height: 2.7rem;
    color: var(--txt-accent-pri)
}

.card-group.type21 .card-header .card-loan .card-tit-area {
    display: unset
}

.card-group.type21 .card-header .card-loan .card-tit-area .card-sub .sub-tit {
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 2rem;
    color: var(--txt-qua)
}

.card-group.type21 .card-col-group .card-col {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-column-gap: .8rem;
    -moz-column-gap: .8rem;
    column-gap: .8rem
}

.card-group.type21 .card-col-group .card-row-option {
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 2rem;
    color: var(--txt-ter)
}

.card-group.type21 .card-col-group .sum {
    font-size: 1.4rem;
    font-weight: 700;
    line-height: 2.3rem;
    color: var(--txt-accent-pri)
}

.card-group.type21 .card-col-group .sum strong {
    font-size: 2.1rem;
    font-weight: 700;
    line-height: 2.7rem;
    color: var(--txt-accent-pri)
}

.card-group.type22 {
    margin-top: 4.4rem;
    padding: 2rem 1.2rem
}

.card-group.type22 .card-row {
    -webkit-column-gap: 2.4rem;
    -moz-column-gap: 2.4rem;
    column-gap: 2.4rem;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.card-group.type22 .card-row .card-col-content:last-child::before {
    content: '';
    display: block;
    width: .1rem;
    height: 5rem;
    background-color: var(--bg-qua);
    position: absolute;
    top: 50%;
    left: -1.2rem;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

.card-group.type22 .card-row .card-col-content {
    -webkit-box-flex: unset;
    -ms-flex: unset;
    flex: unset;
    min-width: 6.9rem;
    text-align: center
}

.card-group.type22 .card-row .card-col-content .txt {
    font-size: 1.4rem;
    font-weight: 700;
    line-height: 2rem;
    color: var(--txt-ter)
}

.card-group.type22 .card-row .card-col-content .tit {
    font-size: 1.4rem;
    font-weight: 700;
    line-height: 2rem;
    color: var(--txt-pri);
    margin-bottom: .2rem
}

.card-group.type22 .card-row .card-col-content .dec {
    font-size: 1.2rem;
    font-weight: 400;
    line-height: 1.6rem;
    color: var(--txt-qua)
}

.card-group.type22 .card-row .card-col-content+.card-col-content {
    text-align: left;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1
}

.card-group.type23 .card-header .card-info .card-account-num {
    color: var(--txt-ter) !important
}

.card-group.type23 .card-row {
    margin-top: 1.2rem !important
}

.card-group.type23 .card-row .card-col-group .card-row-content .sum {
    font-size: 2.1rem !important;
    line-height: 2.6rem !important
}

.card-group.type23 .status .ico-arrow-sbr {
    background-image: url("/resource/img/mmk/svg_common/chevron_right_card.svg")
}

.component-list.apt-simulation {
    margin-top: 1.6rem
}

.component-list.apt-simulation+.component-card.apt-simulation {
    margin-top: 2.4rem
}

.component-card.apt-simulation {
    margin-top: 3.6rem
}

.card-group.select-info {
    margin: 0 2rem 1.6rem 2rem;
    background: var(--bg-qua);
    border-radius: 2rem;
    border: none
}

.card-group.rate-cut {
    background: var(--bg-qua);
    border: none
}

.card-group.rate-cut .card-rate-info {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.card-group.rate-cut .card-rate-info .sub-txt {
    display: block;
    text-align: center;
    font-size: 1.2rem;
    line-height: 1.6rem
}

.card-group.rate-cut .card-rate-info .rate {
    font-size: 2.6rem;
    line-height: 3.4rem;
    font-weight: 700
}

.card-group.rate-cut .card-rate-info .arrow-area {
    margin-top: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 4.6rem;
    height: 3.4rem
}

.card-group.rate-cut .current-rate .sub-txt {
    color: var(--txt-ter)
}

.card-group.rate-cut .current-rate .rate {
    color: var(--txt-ter)
}

.card-group.rate-cut .changed-rate .sub-txt {
    color: var(--color-pn)
}

.card-group.rate-cut .changed-rate .rate {
    color: var(--color-bu800)
}

.card-group.rate-cut .txt-group.line {
    margin: 1.6rem 2rem 0;
    border-top: 1px solid var(--border-qua)
}

.card-group.rate-cut .rate-detail-box {
    margin: 0 -2rem
}

.card-group.rate-cut .rate-detail {
    margin-top: 1.6rem
}

.card-group.rate-cut .rate-detail .card-col-tit {
    color: var(--color-g900);
    font-weight: bold
}

.card-group.rate-cut .rate-detail .arrow-area {
    margin: 0 0.3rem
}

.card-group.rate-cut .rate-detail .arrow-area .ico-arrow-right {
    width: 0.8rem;
    height: 0.8rem
}

/*! component element card 별 교환소 */

.card-stars-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.card-stars-group .card-col {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    margin-right: 1.2rem;
    padding: 1.6rem 2rem;
    background-color: var(--bg-pri-invert);
    border-radius: 1.6rem
}

.card-stars-group .card-col:last-child {
    margin-right: 0
}

.card-stars-group .card-col-option {
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--txt-sec-invert)
}

.card-stars-group .card-col-content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-top: 0.8rem
}

.card-stars-group .card-col-content>[class^="ico-"] {
    width: 2rem;
    height: 2rem;
    margin-right: 0.4rem
}

.card-stars-group .section-link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.card-stars-group .section-link [class^="ico-"] {
    margin-left: 0.2rem
}

.card-stars-group .txt {
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 2rem;
    color: var(--color-w100)
}

.card-group.utility-bill {
    padding: 2.4rem 2rem 0 2rem;
    background-color: var(--bg-banner-in);
    border: none;
    border-radius: 1.6rem
}

.card-group.utility-bill.bg-qua {
    background-color: var(--bg-qua)
}

.card-group.utility-bill .card-header {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.card-group.utility-bill .card-tit {
    font-size: 2.1rem;
    line-height: 2.8rem;
    color: var(--txt-pri)
}

.card-group.utility-bill .list-infobox-group {
    padding-bottom: 3.2rem
}

.card-group.utility-bill .list-infobox-group .list-row {
    padding: 2.4rem 0 0;
    border: none
}

.card-group.utility-bill .list-infobox-group .list-item+.list-item {
    margin-top: 1.6rem
}

.card-group.utility-bill .list-infobox-group .area-term {
    font-size: 1.6rem;
    font-weight: 500;
    color: var(--txt-sec)
}

.card-group.utility-bill .list-infobox-group .area-desc {
    font-size: 1.6rem;
    font-weight: bold
}

.card-group.utility-bill .list-infobox-group .area-desc [class^="ico-"] {
    margin-left: 0.4rem
}

.card-group.utility-bill .txt {
    padding: 0.8rem 0 2.8rem;
    font-size: 1.6rem;
    font-weight: 500;
    line-height: 2rem;
    color: var(--txt-qua)
}

.card-group.chk-acco {
    padding: 2rem 2rem 0 2rem
}

.card-group.chk-acco .card-header {
    padding-bottom: 2rem
}

.card-group.chk-acco .folding-wrap {
    margin-top: 0;
    border-top: 1px solid var(--border-qua)
}

.card-group.chk-acco .folding-wrap .ui-expand-btn {
    padding: 1.6rem 0;
    width: 100%;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.card-group.chk-acco .folding-wrap .list-infobox-group .tit-box-sub {
    text-align: left
}

.card-group.chk-acco.active {
    background-color: var(--bg-qua-active);
    border-color: var(--border-pri-active)
}

.card-group.chk-acco.active .item-box-sub {
    background-color: var(--bg-sec-base)
}

.card-group.acco .ui-accordion-btn {
    display: block;
    padding: 2rem;
    width: 100%
}

.card-group.acco .card-cont-list {
    margin: 0 2rem 2rem;
    border-top: 1px solid var(--border-qua)
}

.card-group.acco .card-info .info-txt {
    margin-top: 0.2rem;
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--txt-ter)
}

.card-group.acco .card-info02 .ico-arrow-open {
    margin-left: 0.6rem;
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

.card-group.chk-acco .card-info .info-txt {
    margin-top: 0.2rem;
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--txt-ter)
}

.card-group.chk-acco .input-checkbox {
    margin-top: 0.5rem;
    margin-bottom: auto
}

.card-group.chk-acco .input-checkbox.align-center {
    margin: auto
}

.card-group.store-level {
    margin-top: 2rem;
    padding: 1.6rem 2rem;
    background-color: var(--bg-qua);
    border-color: var(--border-quin);
    border-radius: 2rem
}

.card-group.store-level .card-img {
    margin-right: 1.2rem;
    width: 9.6rem;
    height: 9.6rem
}

.card-group.store-level .card-img img {
    width: 9.6rem;
    height: 9.6rem
}

.card-group.store-level .card-content-area {
    width: 100%
}

.card-group.store-level .level-bar-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 0.8rem 1rem 0 0.4rem;
    width: 100%
}

.card-group.store-level .level-bar {
    position: relative;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    height: 1rem;
    border-radius: 1rem;
    background-color: var(--color-g300);
    -webkit-box-shadow: inset 0 1px 2px 0 rgba(0, 0, 0, 0.05);
    box-shadow: inset 0 1px 2px 0 rgba(0, 0, 0, 0.05)
}

.card-group.store-level .level-bar .level-bar-inner {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: inline-block;
    -webkit-clip-path: inset(0 100% 0 0 round 1rem);
    clip-path: inset(0 100% 0 0 round 1rem);
    -webkit-transition: -webkit-clip-path 600ms cubic-bezier(0, 0, 0.25, 1);
    transition: -webkit-clip-path 600ms cubic-bezier(0, 0, 0.25, 1);
    -o-transition: clip-path 600ms cubic-bezier(0, 0, 0.25, 1);
    transition: clip-path 600ms cubic-bezier(0, 0, 0.25, 1);
    transition: clip-path 600ms cubic-bezier(0, 0, 0.25, 1), -webkit-clip-path 600ms cubic-bezier(0, 0, 0.25, 1)
}

.card-group.store-level .level-bar .level-bar-inner.level-1 {
    background: -webkit-gradient(linear, left top, right top, from(var(--color-bu200)), to(var(--color-in700)));
    background: -o-linear-gradient(left, var(--color-bu200), var(--color-in700));
    background: linear-gradient(to right, var(--color-bu200), var(--color-in700))
}

.card-group.store-level .level-bar .level-bar-inner.level-2 {
    background: -webkit-gradient(linear, left top, right top, from(var(--color-in200)), to(var(--color-in700)));
    background: -o-linear-gradient(left, var(--color-in200), var(--color-in700));
    background: linear-gradient(to right, var(--color-in200), var(--color-in700))
}

.card-group.store-level .level-bar .level-bar-inner.level-3 {
    background: -webkit-gradient(linear, left top, right top, from(var(--color-cy300)), to(var(--color-in700)));
    background: -o-linear-gradient(left, var(--color-cy300), var(--color-in700));
    background: linear-gradient(to right, var(--color-cy300), var(--color-in700))
}

.card-group.store-level .level-bar .level-bar-inner.level-4 {
    background: -webkit-gradient(linear, left top, right top, from(var(--color-pu600)), to(var(--color-in700)));
    background: -o-linear-gradient(left, var(--color-pu600), var(--color-in700));
    background: linear-gradient(to right, var(--color-pu600), var(--color-in700))
}

.card-group.store-level .level-txt {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: bold;
    margin-left: 1.2rem;
    color: var(--txt-quin)
}

.card-group.store-level .level-txt .total {
    font-weight: 400
}

.card-group.store-level .level-txt .current {
    color: var(--txt-accent-sec)
}

.card-group.store-level .card-txt {
    margin-top: 0.8rem
}

.card-group.store-level .card-txt .store-tit {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-bottom: 0.2rem;
    padding-left: 0.4rem;
    padding-right: 1rem;
    font-size: 1.6rem;
    line-height: 2.6rem;
    font-weight: bold
}

.card-group.store-level .card-txt .btn-arrow {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 0.4rem;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content
}

.card-group.store-level .card-txt .btn-arrow [class^="ico"] {
    margin-left: 0.4rem
}

.card-group.custom-policy {
    padding: 3.6rem 0;
    text-align: center;
    background-color: var(--bg-qua);
    border-radius: 1.6rem;
    border: none
}

.checkA11y .swiper-button-next:after,
.checkA11y .swiper-button-prev:after {
    font-size: 2rem;
    color: var(--txt-pri)
}

.checkA11y.chk-swiper.card-type-flip {
    position: relative
}

.checkA11y .swiper-button-next,
.checkA11y .swiper-button-prev {
    top: 15rem;
    width: 2.8rem;
    height: 2.8rem;
    margin: 1.2rem
}

.checkA11y.chk-swiper.card-type-flip .card-bnr {
    width: 15rem
}

.simsa-carousel .txt-group .img {
    position: absolute;
    right: 0;
    bottom: -4.7rem
}

.simsa-carousel .btn-group.relative .img {
    position: absolute;
    right: 0.4rem;
    bottom: 2.5rem
}

.card-group.loan-type1 .card-header {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.card-group.loan-type1 [class^="card-row"] .card-col-group .sum {
    color: var(--txt-accent-sec)
}

.component-card.invest+.component-card.invest {
    margin-top: 1.2rem
}

.component-card.invest .card-investment-group:first-of-type {
    margin-top: 0
}

.component-card.invest .btn-group {
    margin: 0.5rem 0 2.5rem
}

.component-card.invest .btn-view-more .txt {
    line-height: 2rem
}

.card-investment-head {
    margin-top: 4rem;
    padding-bottom: 1.2rem;
    background-color: var(--color-w100);
    position: -webkit-sticky;
    position: sticky;
    top: 45.1rem;
    z-index: 10;
    background-color: var(--color-w100)
}

.card-investment-head:first-child {
    margin-top: 0
}

.card-investment-head .tit-head {
    font-size: 1.4rem;
    font-weight: 700;
    line-height: 2rem;
    color: var(--txt-sec)
}

.card-investment-group {
    display: block;
    position: relative;
    margin-top: 1.2rem;
    padding: 2rem 2.2rem;
    border-radius: 1.4rem;
    background-color: var(--color-g100)
}

.card-investment-group .card-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.card-investment-group .card-tag {
    width: 100%;
    margin-bottom: 0.8rem;
    padding-left: 4.4rem
}

.card-investment-group .card-tag .tag {
    height: 2.2rem
}

.card-investment-group .card-tag .tag .txt {
    font-size: 1.1rem;
    line-height: 1.4rem
}

.card-investment-group .card-img-figure {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    width: 2.8rem;
    height: 2.8rem;
    margin-right: 1.6rem;
    border-radius: 100%;
    overflow: hidden
}

.card-investment-group .card-img-figure img {
    width: 2.8rem
}

.card-investment-group .card-info {
    overflow: hidden;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.card-investment-group .card-tit {
    display: block;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap
}

.card-investment-group .card-num {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-top: 0.4rem
}

.card-investment-group .card-num>[class^="txt"] {
    position: relative;
    font-size: 1.4rem;
    font-weight: 500;
    line-height: 2rem;
    color: var(--txt-ter)
}

.card-investment-group .card-num>[class^="txt"]+[class^="txt"] {
    padding-left: 1.1rem
}

.card-investment-group .card-num>[class^="txt"]+[class^="txt"]::before {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: 0.4rem;
    width: 0.3rem;
    height: 0.3rem;
    border-radius: 100%;
    background-color: var(--color-g500);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

.card-investment-group .card-txt {
    display: block;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin-top: 0.6rem;
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--txt-qua)
}

.card-investment-group [class^="logo-"]::after {
    border: 0
}

.card-investment-group.economic .card-tit {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    white-space: normal
}

.card-investment-group.economic .card-img-figure {
    border-radius: 0;
    overflow: visible
}

.card-investment-group.economic.market-closed {
    background-color: var(--color-mg25)
}

.card-investment-group.economic.market-closed .card-tit {
    color: var(--color-re700)
}

.card-investment-group.economic.market-closed .card-txt {
    color: var(--color-re700)
}

.card-investment-group.dividend .card-img-figure {
    margin-top: 0.8rem
}

.card-investment-group.announcement .card-img-figure {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.card-investment-group.stock .card-img-figure {
    margin-top: 0.5rem
}

.card-investment-group .card-img-figure .stock-name,
.component-text-simple.invest .stock-name {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 2.8rem;
    height: 2.8rem;
    border-radius: 100%;
    font-style: normal;
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 2rem;
    color: var(--color-w100)
}

.component-text-simple.invest .stock-name {
    width: 3.4rem;
    height: 3.4rem;
    font-size: 1.8rem;
    margin: 0 auto
}

[class^="component-"] .stock-name.og1 {
    background-color: var(--color-og600)
}

[class^="component-"] .stock-name.og2 {
    background-color: var(--color-og800)
}

[class^="component-"] .stock-name.gn {
    background-color: var(--color-gn800)
}

[class^="component-"] .stock-name.mg {
    background-color: var(--color-mg800)
}

[class^="component-"] .stock-name.pu {
    background-color: var(--color-pu1100)
}

[class^="component-"] .stock-name.cy {
    background-color: var(--color-cy700)
}

[class^="component-"] .stock-name.lm {
    background-color: var(--color-lm800)
}

[class^="component-"] .stock-name.yl {
    background-color: var(--color-yl800)
}

.card-investment-group.nodata {
    margin-top: 2rem !important
}

.card-investment-group.nodata:first-child {
    margin-top: 0 !important
}

.card-investment-group.nodata .card-header {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.card-investment-group.nodata .card-img-figure {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-right: 1.4rem
}

.card-investment-group.nodata .card-tit {
    color: var(--color-g600)
}

.graph-sales-group {
    margin-top: 4rem
}

.graph-sales-group .bar-row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: relative;
    height: 16rem;
    width: 100%
}

.graph-sales-group .bar-col {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.graph-sales-group .bar-col.active .bar-date .date {
    font-weight: 700;
    color: var(--txt-pri)
}

.graph-sales-group .bar-data {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    position: relative;
    height: 13.4rem
}

.graph-sales-group .bar-data .txt {
    margin-bottom: 0.6rem;
    font-size: 1.4rem;
    font-weight: 700;
    color: var(--color-g400);
    line-height: 2rem
}

.graph-sales-group .bar-data .bar-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    font-size: 10.5rem
}

.graph-sales-group .bar-data .bar-group .bar {
    width: 1.2rem;
    margin: 0 0.1rem;
    background-color: var(--color-g200);
    border-radius: 0.4rem 0.4rem 0 0
}

.graph-sales-group .bar-data .bar-group .bar:last-child {
    background-color: var(--color-g300)
}

.graph-sales-group .bar-date .date {
    display: block;
    width: 100%;
    padding-top: 1rem;
    font-size: 1.1rem;
    font-weight: 400;
    line-height: 1.5rem;
    color: var(--txt-quin);
    text-align: center
}

.graph-sales-group .bar-date .date.active {
    font-weight: 700;
    color: var(--txt-pri)
}

.graph-sales-group .bar-row.bottom::after {
    content: "";
    display: block;
    position: absolute;
    right: 0;
    bottom: 2.5rem;
    left: 0;
    height: 1px;
    background-color: var(--color-g200)
}

.graph-sales-group .bar-row.top::before {
    content: "";
    display: block;
    position: absolute;
    top: 2.5rem;
    right: 0;
    left: 0;
    height: 1px;
    background-color: var(--color-g200)
}

.graph-sales-group .bar-row.center::before {
    content: "";
    display: block;
    position: absolute;
    top: 8.1rem;
    right: 0;
    left: 0;
    height: 1px;
    background-color: var(--color-g200)
}

.graph-sales-group .bar-col.active .bar-data.exceed .txt {
    color: var(--txt-pri-up)
}

.graph-sales-group .bar-col.active .bar-data.exceed .bar {
    background-color: var(--color-g500)
}

.graph-sales-group .bar-col.active .bar-data.exceed .bar:last-child {
    background-color: var(--ico-pri-up)
}

.graph-sales-group .bar-col.active .bar-data.fall .txt {
    color: var(--txt-pri-down)
}

.graph-sales-group .bar-col.active .bar-data.fall .bar {
    background-color: var(--color-g500)
}

.graph-sales-group .bar-col.active .bar-data.fall .bar:last-child {
    background-color: var(--ico-pri-down)
}

.graph-sales-group .bar-col.active .bar-data.undecided .txt {
    color: var(--color-g800)
}

.graph-sales-group .bar-col.active .bar-data.undecided .bar {
    background-color: var(--color-g500)
}

.graph-sales-group .bar-col.active .bar-data.undecided .bar:last-child {
    background-color: var(--color-g900)
}

.graph-sales-group .bar-col.active .bar-data.plan .txt {
    color: var(--color-cy600)
}

.graph-sales-group .bar-col.active .bar-data.plan .bar {
    background-color: var(--color-g500)
}

.graph-sales-group .bar-col.active .bar-data.plan .bar:last-child {
    background-color: var(--color-cy600)
}

.graph-sales-group .bar-row.top .bar-data {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.graph-sales-group .bar-row.top .bar-data .bar-group {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.graph-sales-group .bar-row.top .bar-data .bar-group .bar {
    border-radius: 0 0 0.4rem 0.4rem
}

.graph-sales-group .bar-row.center .bar-data {
    padding-bottom: 5.3rem
}

.graph-sales-group .bar-row.center .bar-data .bar-group {
    font-size: 5.2rem
}

.graph-sales-group .bar-row.center .bar-data .bar-group .bar {
    max-height: 5.2rem
}

.graph-sales-group .bar-row.center .bar-data.up .bar-group .bar {
    border-radius: 0.4rem 0.4rem 0 0
}

.graph-sales-group .bar-row.center .bar-data.down {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    padding-top: 5.6rem
}

.graph-sales-group .bar-row.center .bar-data.down .bar-group {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.graph-sales-group .bar-row.center .bar-data.down .bar-group .bar {
    border-radius: 0 0 0.4rem 0.4rem
}

.graph-sales-group .bar-row.center .bar-data.updown .bar-group {
    position: relative
}

.graph-sales-group .bar-row.center .bar-data.updown .bar-group .bar:first-child {
    margin-right: 1.2rem
}

.graph-sales-group .bar-row.center .bar-data.updown .bar-group .bar:last-child {
    position: absolute;
    left: 50%;
    margin-left: 0.1rem;
    margin-right: 0;
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
    -webkit-transform-origin: bottom center;
    -ms-transform-origin: bottom center;
    transform-origin: bottom center;
    margin-bottom: -1px
}

.graph-sales-group .bar-row.center .bar-data.downup .bar-group {
    position: relative
}

.graph-sales-group .bar-row.center .bar-data.downup .bar-group .bar:first-child {
    position: absolute;
    right: 50%;
    margin-right: 0.1rem;
    margin-left: 0;
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
    -webkit-transform-origin: bottom center;
    -ms-transform-origin: bottom center;
    transform-origin: bottom center;
    margin-bottom: -1px
}

.graph-sales-group .bar-row.center .bar-data.downup .bar-group .bar:last-child {
    margin: 0 0 0 1.2rem
}

.card-group.invest {
    padding: 2.4rem 2rem;
    border-radius: 1.4rem
}

.card-group.invest .card-row {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.card-group.invest .card-col {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.card-group.invest .card-col.col2 {
    margin-left: 5rem
}

.card-group.invest .card-col-icon {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    margin-right: 0.6rem;
    padding-top: 0.5rem
}

.card-group.invest .card-col-option {
    width: 7rem
}

.card-group.invest .ico-circle {
    display: block;
    width: 1rem;
    height: 1rem;
    border-radius: 99rem
}

.card-group.invest .ico-circle+.ico-circle {
    margin-left: 0.2rem
}

.card-group.invest .ico-circle.gray {
    background-color: var(--color-g400)
}

.card-group.invest .ico-circle.red {
    background-color: var(--color-re700)
}

.card-group.invest .ico-circle.blue {
    background-color: var(--color-bu700)
}

.card-group.invest .card-col-tit {
    font-size: 1.6rem;
    line-height: 2rem;
    color: var(--txt-ter)
}

.card-group.invest .card-col-txt {
    margin-top: 0.2rem;
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 2rem;
    color: var(--txt-pri)
}

.card-group.invest .card-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-top: 2.4rem;
    padding: 1rem 2rem;
    border-radius: 0.8rem;
    background-color: var(--color-g200)
}

.card-group.invest .card-box .txt {
    font-size: 1.4rem;
    font-weight: 500;
    color: var(--txt-ter)
}

.card-group.invest .card-box [class^="ico-"] {
    margin-left: 0.4rem
}

.card-group.card-glone {
    padding-bottom: 2.4rem;
    border: none !important;
    background-color: var(--bg-qua) !important
}

.card-group.card-glone:first-of-type {
    margin-top: 2rem
}

.card-group.card-glone .card-glone-info {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    margin-top: 0.2rem
}

.card-group.card-glone .card-glone-max {
    width: 8.4rem;
    display: block;
    font-size: 2rem;
    line-height: 2.6rem;
    font-weight: bold;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.card-group.card-glone .card-glone-num {
    display: block;
    font-size: 2rem;
    line-height: 2.6rem;
    font-weight: bold;
    color: var(--txt-accent-sec)
}

.card-group.card-glone .card-glone-left {
    width: 8.4rem;
    display: block;
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--txt-ter);
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.card-group.card-glone .card-glone-right {
    display: block;
    font-weight: 400;
    font-size: 1.4rem;
    line-height: 2rem
}

.card-group.card-glone .card-glone-right span {
    display: block
}

.card-group.card-glone .card-header+.card-row {
    margin-top: 2rem
}

.card-group.card-glone .card-col-group {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.card-group.card-glone .btn-lv03 {
    margin-top: .8rem
}

.card-group.card-glone .card-glone-tag {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: .4rem;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.card-group.card-glone .ico-arrow-link-bold {
    -webkit-filter: var(--ico-ter) !important;
    filter: var(--ico-ter) !important
}

.kds-landing-card-benefit .txt>span.txt {
    padding: 0
}

.card-group.consume-coupon {
    padding: 2.4rem 2rem 3.2rem;
    background-color: var(--bg-qua);
    border: 0
}

.card-group.consume-coupon>.card-header .card-info .card-tit {
    font-size: 1.8rem;
    font-weight: 700;
    line-height: 2.4rem;
    color: var(--txt-pri)
}

.card-group.consume-coupon>.card-header .card-info .card-txt {
    margin-top: 1.6rem;
    font-size: 1.5rem;
    line-height: 2rem;
    color: var(--txt-sec)
}

.card-group.consume-coupon .card-content {
    border: 0
}

.card-group.consume-coupon .card-content>.card-row {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.card-group.consume-coupon .card-content>.card-row+.card-row {
    margin-top: 3.2rem
}

.card-group.consume-coupon .card-content>.card-row .card-img-figure {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 6rem;
    height: 6rem;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 6rem;
    flex: 0 0 6rem;
    margin-right: 1.6rem;
    border-radius: 2rem;
    background-color: var(--bg-pri-base)
}

.card-group.consume-coupon .card-content>.card-row .card-img-figure img {
    width: 4.4rem
}

.card-group.consume-coupon .card-content>.card-row .card-info .card-tit {
    font-size: 1.4rem;
    line-height: 2rem
}

.card-group.consume-coupon .card-content>.card-row .card-info .card-txt {
    margin-top: 0.4rem
}

.card-date-group .card-row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.card-date-group .card-row+.card-row {
    margin-top: 1.2rem
}

.card-date-group .card-item {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    max-width: 8.8rem;
    margin-left: 1.2rem
}

.card-date-group .card-item:first-child {
    margin-left: 0
}

.card-date-group .card-item .card-tit {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 3.2rem;
    border-radius: 0.8rem 0.8rem 0 0;
    background-color: var(--bg-sec);
    font-size: 1.2rem;
    font-weight: 400;
    line-height: 1.6rem;
    color: var(--txt-pri)
}

.card-date-group .card-item .card-txt {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 5rem;
    margin-top: 0;
    border-radius: 0 0 0.8rem 0.8rem;
    background-color: var(--bg-pri-base);
    font-size: 2.1rem;
    font-weight: 700;
    line-height: 2.6rem;
    color: var(--txt-pri)
}

.card-group.consume-coupon .folding-wrap .ico-arrow-open {
    -webkit-filter: var(--filter-g900);
    filter: var(--filter-g900)
}

.card-info-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-top: 2.4rem
}

.card-info-group .card-img-figure {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 5rem;
    flex: 0 0 5rem;
    width: 5rem;
    height: 5rem;
    margin-right: 1.2rem
}

.card-info-group .card-info {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding: 1.2rem 2rem;
    border: 1px dashed var(--border-ter);
    border-radius: 2rem;
    background-color: var(--color-w100)
}

.card-info-group .card-info .txt {
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--txt-sec)
}

.component-card-sticky {
    padding: 2.4rem 2rem
}

.component-card-sticky .card-layout-group {
    padding: 0
}

.component-card-sticky .card-layout-group .selectbox-group.noline .txt-name,
.component-card-sticky .card-layout-group .selectbox-group.noline .txt-value01 {
    color: var(--txt-pri);
    font-size: 2.1rem
}

.component-card-sticky .card-layout-group .ico-arrow-open {
    display: none
}

.page-inner-scroll.scrolling .component-card-sticky {
    position: -webkit-sticky;
    position: sticky;
    z-index: 79;
    top: 5rem;
    left: 0;
    padding: 1.2rem 0.8rem;
    width: 100%;
    border-bottom: 1px solid var(--color-g300, #e0e0e0)
}

.page-inner-scroll.scrolling .component-card-sticky .card-layout-group .selectbox-group.noline .btn-selectbox {
    padding: 0 1.2rem
}

.page-inner-scroll.scrolling .component-card-sticky .card-layout-group .selectbox-group.noline .txt-name,
.page-inner-scroll.scrolling .component-card-sticky .card-layout-group .selectbox-group.noline .txt-value01 {
    color: var(--txt-ter);
    font-size: 1.4rem;
    font-weight: 400
}

.page-inner-scroll.scrolling .component-card-sticky .card-layout-group .selectbox-group.noline .select-txt-wrap.line-clamp-1 .bl-selectbox {
    display: none
}

.page-inner-scroll.scrolling .component-card-sticky .card-layout-group .ico-arrow-open {
    display: inline-block;
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

.card-group.invest-calendar {
    padding: 2rem 2rem;
    background-color: var(--bg-qua)
}

.card-group.invest-calendar+.card-group.invest-calendar {
    margin-top: 1.2rem
}

.card-group.invest-calendar .card-type {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    height: 3.7rem;
    margin-right: 1.2rem;
    padding-right: 1.2rem;
    border-right: 1px solid var(--border-ter)
}

.card-group.invest-calendar .type-tit {
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1.5rem;
    color: var(--txt-ter)
}

.card-group.invest-calendar .type-txt {
    margin-top: 0.6rem;
    font-size: 1.3rem;
    line-height: 1.3rem;
    color: var(--txt-qua)
}

.card-group.invest-calendar .card-header .card-info {
    min-width: 0;
    padding-left: 0.4rem
}

.card-group.invest-calendar .card-header .card-info .card-account-tit {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-weight: 700;
    line-height: 2rem
}

.card-group.invest-calendar .card-header .card-info .card-account-tit>i {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 1.6rem;
    flex: 0 0 1.6rem;
    margin-right: 0.6rem;
    height: 1.6rem;
    border-radius: 999rem;
    overflow: hidden
}

.card-group.invest-calendar .card-header .card-info .card-account-tit>i img {
    max-width: 100%
}

.card-group.invest-calendar .card-header .card-info .card-account-tit>i::after {
    display: none
}

.card-group.invest-calendar .card-header .card-info .card-account-tit .txt {
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap
}

.card-group.invest-calendar .card-header .card-info .card-desc {
    margin-top: 0.8rem;
    font-size: 1.5rem;
    line-height: 1.5rem;
    color: var(--txt-qua)
}

.card-group .support-fund-nodata {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 1.6rem 0;
    height: 13.2rem
}

.card-group .support-fund-nodata .txt {
    margin-top: 1.6rem;
    font-size: 1.5rem;
    line-height: 2rem;
    text-align: center;
    color: var(--txt-qua)
}

.page-inner-scroll.inandout-scroll .in-and-out-season2 .component-header:not(.invert) .header-content .tit-header {
    opacity: 0
}

.page-inner-scroll.inandout-scroll .in-and-out-season2 .component-header.invert .ico-back.white {
    -webkit-filter: var(--filter-w100);
    filter: var(--filter-w100)
}

.page-inner-scroll.inandout-scroll.scrolling .in-and-out-season2 .component-header.invert {
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s
}

.page-inner-scroll.inandout-scroll.scrolling .in-and-out-season2 .component-header.invert .ico-back.white {
    -webkit-filter: unset;
    filter: unset
}

.page-inner-scroll.inandout-scroll.scrolling .in-and-out-season2 .component-header.invert .txt.white.btn-control {
    color: var(--color-g900) !important
}

.page-inner-scroll.inandout-scroll.scrolling .in-and-out-season2 .component-header.invert .header-content .tit-header {
    opacity: 1;
    color: var(--color-g900);
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s
}

.in-and-out-season2 [class^="component"].no-space .inandout-swiper .swiper-container,
.in-and-out-season2 [class^="component"].no-space .inandout-swiper.a11y-swiper[data-a11y-nav="true"] .swiper-container {
    padding-top: 3.6rem
}

.in-and-out-season2 [class^="component"].no-space .inandout-swiper .swiper-container {
    padding-bottom: 6.5rem
}

.in-and-out-season2 .inandout-swiper .swiper-slide .section-link {
    width: 17.2rem;
    height: 25.8rem
}

.in-and-out-season2 .inandout-swiper .swiper-slide .section-link.empty-card .add-card {
    padding-bottom: 4rem;
    background-image: url("../../../../resource/img/mmk/common/inandout/img_inandout_empty_card.png")
}

.in-and-out-season2 .inandout-swiper .swiper-slide .section-link.empty-card .add-card .img-group {
    margin: 0 0 3.6rem 0
}

.in-and-out-season2 .inandout-swiper .swiper-slide {
    height: 25.8rem
}

.in-and-out-season2 .inandout-reward-count {
    position: relative;
    z-index: 2;
    margin-top: -3.7rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: .8rem
}

.in-and-out-season2 .inandout-reward-count .blue-count,
.in-and-out-season2 .inandout-reward-count .gold-count {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: .8rem;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    min-width: 5rem;
    height: 2.8rem;
    padding: 0 1.2rem;
    border-radius: 99rem;
    border: 1px solid var(--border-ter-invert, rgba(255, 255, 255, 0.2));
    background: var(--color-white-w100-op15)
}

.in-and-out-season2 .inandout-reward-count .blue-count::before,
.in-and-out-season2 .inandout-reward-count .gold-count::before {
    content: '';
    display: block;
    width: 1rem;
    height: 1rem;
    border-radius: 99rem
}

.in-and-out-season2 .inandout-reward-count .blue-count .txt,
.in-and-out-season2 .inandout-reward-count .gold-count .txt {
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 2rem;
    color: var(--color-white-w100-op70)
}

.in-and-out-season2 .inandout-reward-count .blue-count::before {
    background-color: var(--color-bu400)
}

.in-and-out-season2 .inandout-reward-count .gold-count::before {
    background-color: var(--color-og300)
}

.popup-inout-group .back.gold-back.type02 .card-back .coupon-thumb .thumb {
    width: 12.4rem;
    height: 12.4rem;
    margin: 0 auto 1.6rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 99rem;
    background-color: var(--bg-qua)
}

.popup-inout-group .back.gold-back.type02 .card-back .coupon-thumb .thumb img {
    width: 9.2rem;
    height: 9.2rem
}

.popup-inout-group .back.gold-back.type02 .card-back .coupon-thumb .info-title {
    margin-bottom: .4rem
}

.popup-inout-group .back.gold-back.type02 .card-back .coupon-thumb .info-price .strong {
    line-height: 6rem
}

.popup-inout-group .back.gold-back.type02 .card-back .coupon-thumb .info-terms {
    margin-top: 1.6rem;
    font-size: 1.6rem;
    font-weight: 500;
    line-height: 2rem;
    color: var(--txt-quin)
}

.popup-inout-group .back.gold-back.type02 .card-back .coupon-link {
    padding: .8rem
}

.card-group.bg-box-qua {
    border: none !important;
    background-color: var(--bg-qua)
}

/*!
* component element
* list
* layout
*/

.component-list .row-cont+.row-cont {
    margin-top: 4.8rem
}

.component-list+.component-list-infobox {
    margin-top: 1.6rem
}

.component-list-linebox .title-group {
    margin-top: 2.4rem;
    margin-right: 2rem
}

.component-list-linebox.bg-white {
    background-color: var(--color-w100, #fff);
    margin-bottom: -10rem;
    padding-bottom: 6.4rem
}

.component-list-linebox.space01 {
    margin-top: 3.2rem;
    padding: 0
}

.component-list-linebox.space01 .section-head {
    background: var(--color-g100, #f8f8f8);
    padding: 0.8rem
}

/*!
* component element
* list
* 성공 실패여부 체크
*/

.list-check {
    color: var(--color-g900, #141414);
    font-size: 1.6rem;
    line-height: 2rem;
    font-weight: bold;
    margin-top: 3.2rem;
    margin-bottom: 1.6rem
}

.list-check .warning {
    color: var(--color-re700, #f02727)
}

/*!
* component element
* list
* infobox type
*/

.list-infobox-group.type01 .area-term {
    padding-right: 0
}

.list-infobox-group.bottomline .list-row:first-child {
    padding-top: 0;
    border-top: 0
}

.list-infobox-group.bottomline+.title-group {
    margin-top: 2.4rem
}

.list-infobox-group .list-row {
    padding: 2rem 0;
    border-bottom: 1px solid var(--color-g300, #e0e0e0)
}

.list-infobox-group .list-row:first-child {
    border-top: 1px solid var(--color-g300, #e0e0e0)
}

.list-infobox-group+.btn-group {
    margin-top: 1.6rem
}

.list-infobox-group.topline .list-row {
    border-bottom: 0;
    padding-bottom: 0
}

.list-infobox-group.topline .list-row .tooltip-group {
    margin-left: 0.2rem
}

.list-infobox-group.topline .list-row .ico-edit {
    width: 1.3rem;
    height: 1.3rem
}

.list-infobox-group.midline .list-row:first-child {
    border-top: 0
}

.list-infobox-group.midline .list-row:last-child {
    padding-bottom: 0;
    border-bottom: 0
}

.list-infobox-group.noline .list-row {
    padding: 0;
    border: 0
}

.list-infobox-group.noLine .item-box-sub .row-box+.row-box {
    margin-top: 1.2rem;
    padding-top: 1.2rem
}

.list-infobox-group.noline .tooltip-group {
    margin-left: 0.2rem
}

.list-infobox-group.noline .ico-arrow-sbr {
    margin-top: 0
}

.list-infobox-group.noline .section-link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.list-infobox-group.noline+.list-infobox-group {
    margin-top: 3.2rem
}

.list-infobox-group .list-info:first-child {
    margin-top: 1.6rem
}

.list-infobox-group .list-info:last-child {
    margin-bottom: 2.4rem
}

.list-infobox-group .list-info+.list-info {
    margin-top: 0.8rem
}

.list-infobox-group .list-info .area-desc,
.list-infobox-group .list-info .area-term {
    font-size: 1.4rem
}

.list-infobox-group .list-link-edit {
    position: relative;
    top: 0.2rem;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    width: 1.8rem;
    height: 1.8rem;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.list-infobox-group .list-item .area-term.black {
    color: var(--color-g900, #141414)
}

.list-infobox-group .list-item .area-term.warning {
    color: var(--color-re700, #e23a32)
}

.list-infobox-group .list-item .txt-addr {
    font-weight: 700;
    margin-bottom: 2.4rem
}

.list-infobox-group .list-item+.list-item {
    margin-top: 1.6rem
}

.list-infobox-group .list-item+.list-item.line-type {
    position: relative;
    padding-top: 1.6rem
}

.list-infobox-group .list-item+.list-item.line-type:before {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: -2rem;
    right: -2rem;
    height: 1px;
    background-color: var(--color-g200, #eee)
}

.list-infobox-group .list-item.flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.list-infobox-group .list-item.flex .area-term {
    padding-right: 0;
    color: var(--color-g700, #7d7d7d)
}

.list-infobox-group .list-item.flex .area-desc.left {
    text-align: left;
    margin-left: 1.2rem
}

.list-infobox-group .area-term {
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 400;
    padding-right: 1rem;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto
}

.list-infobox-group .area-term .list-account-group .list-account-name {
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g900, #141414)
}

.list-infobox-group .area-term .list-account-group .list-account-num {
    font-size: 1.2rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g700, #7d7d7d)
}

.list-infobox-group .area-desc {
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 400;
    text-align: right;
    word-break: keep-all;
    color: var(--color-g900, #141414)
}

.list-infobox-group .area-desc.check {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.list-infobox-group .area-desc.check .col-check {
    margin-left: 0.4rem;
    margin-right: 0
}

.list-infobox-group .area-desc.coolgray {
    color: var(--color-g600, #9b9b9b)
}

:root .list-infobox-group .area-desc.secondary {
    color: var(--txt-pri-success, #039115)
}

.list-infobox-group .area-desc.secondary2 {
    color: var(--color-lm500, #69b405)
}

:root .list-infobox-group .area-desc.secondary2 {
    color: var(--color-ce700, #039115)
}

.kbank-popup-PBKCBX1000000600S_P06 .component-list-infobox .list-infobox-group .area-desc.secondary2 {
    color: var(--txt-accent-sec, #4262ff)
}

.list-infobox-group .area-desc.secondary1-1 {
    color: var(--color-bu800, #0150ff)
}

:root .list-infobox-group .area-desc.secondary1-1 {
    color: var(--txt-accent-sec, #4262ff)
}

.list-infobox-group .area-desc.secondary1-2 {
    color: var(--color-bu900, #003fc7)
}

.list-infobox-group .area-desc.secondary1-3 {
    color: var(--color-bu700, #006aff)
}

.list-infobox-group .area-desc.in700 {
    color: var(--color-in700, #5c59f9)
}

:root .list-infobox-group .area-desc.in700 {
    color: var(--txt-accent-sec, #4262ff)
}

.list-infobox-group .area-desc.warning {
    color: var(--color-re700, #f02727)
}

.list-infobox-group .area-desc.darkgray2 {
    color: var(--color-g700, #7d7d7d)
}

.list-infobox-group .area-desc.primary {
    color: var(--txt-accent-pri)
}

.list-infobox-group .area-desc.primary2 {
    color: var(--color-pn, #17008c)
}

.list-infobox-group .area-desc .txt-sub {
    display: block;
    font-size: 1.2rem;
    line-height: 1.6rem;
    font-weight: 400;
    color: var(--txt-ter);
    margin-top: 0.3rem
}

.list-infobox-group .area-desc .txt-date {
    display: block;
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--txt-ter)
}

.list-infobox-group .area-desc .placeholder {
    color: var(--color-g500, #b8b8b8)
}

.list-infobox-group .area-desc.up-color {
    color: var(--txt-pri-up)
}

.list-infobox-group .area-desc.down-color {
    color: var(--txt-pri-down)
}

:root .list-infobox-group .item-box-sub.fs15 .area-desc .placeholder {
    color: var(--txt-ter, #4d596f);
    font-weight: 500
}

:root .list-infobox-group .item-box-sub.fs15 .area-desc .txt-lv03+.ico-edit.size01 {
    -webkit-filter: var(--filter-g900);
    filter: var(--filter-g900)
}

:root .list-infobox-group .area-desc .ico-edit {
    -webkit-filter: var(--filter-g900);
    filter: var(--filter-g900)
}

:root .list-infobox-group .area-desc .ico-x {
    -webkit-filter: var(--filter-g900);
    filter: var(--filter-g900)
}

:root .list-infobox-group .area-desc .ico-arrow-sbr {
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

:root .list-infobox-group .item-box-sub.fs15 .area-desc .placeholder+.ico-edit {
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

.list-infobox-group .area-desc.full-link {
    position: relative;
    padding-right: 2.1rem
}

.list-infobox-group .area-desc.full-link .list-link-edit {
    position: absolute;
    top: 0;
    right: 0;
    width: auto;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.list-infobox-group .area-desc.full-link [data-type="dateSpinner"] .list-link-edit {
    left: inherit
}

.list-infobox-group .area-desc .ico-arrow-link {
    width: 1.6rem;
    height: 1.6rem
}

.list-infobox-group .item-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.list-infobox-group .item-box .area-term {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: var(--color-g700)
}

.list-infobox-group .item-box .area-term .tooltip-group {
    margin-left: 0.4rem;
    line-height: 1
}

.list-infobox-group .item-box [class*="logo-bank"],
.list-infobox-group .item-box [class*="logo-card"],
.list-infobox-group .item-box [class*="logo-insurance"],
.list-infobox-group .item-box [class*="logo-openbankingandcapital"],
.list-infobox-group .item-box [class*="logo-partnerloan"] {
    margin-right: 0.8rem
}

.list-infobox-group .item-box.openbanking-status-box {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.list-infobox-group .item-box-sub {
    background: var(--color-g100, #f8f8f8);
    padding: 1.6rem 2rem;
    margin-top: 1.6rem;
    border-radius: 0.8rem
}

.list-infobox-group .item-box-sub .area-term {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    color: var(--color-g700, #7d7d7d);
    font-size: 1.4rem
}

.list-infobox-group .item-box-sub .area-desc {
    color: var(--color-g900, #141414);
    font-size: 1.4rem
}

.list-infobox-group .item-box-sub .tit-box-sub {
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: bold;
    margin-bottom: 1.2rem
}

.list-infobox-group .item-box-sub .box-sub {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    min-height: 2rem
}

.list-infobox-group .item-box-sub .box-sub * {
    line-height: 2rem !important
}

.list-infobox-group .item-box-sub .box-sub .sub-tit,
.list-infobox-group .item-box-sub .box-sub .sub-txt {
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g900, #141414)
}

.list-infobox-group .item-box-sub .box-sub+.box-sub {
    margin-top: 0.8rem
}

.list-infobox-group .item-box-sub .box-sub+.ui-expand-cont {
    margin-top: 1.6rem
}

.list-infobox-group .item-box-sub .box-sub+.tit-box-sub {
    margin-top: 1.6rem
}

.list-infobox-group .item-box-sub .row-box+.row-box {
    border-top: 1px solid var(--color-g300, #e0e0e0);
    margin-top: 1.2rem;
    padding-top: 1.2rem
}

.list-infobox-group .item-box-sub .row-box .tit-box-sub {
    margin-bottom: 1.2rem
}

.list-infobox-group .item-box-sub .btn-group {
    margin-top: 1.6rem
}

.list-infobox-group .item-box-sub.space00 {
    margin-top: 0
}

.list-infobox-group .item-box-sub.type-1 {
    background: var(--color-g100);
    padding: 2.4rem 2rem;
    border-radius: 1.2rem
}

.list-infobox-group .item-box-sub.type-1 .row-box+.row-box {
    border-top: 1px solid var(--color-g300, #e0e0e0);
    margin-top: 1.6rem;
    padding-top: 1.6rem
}

.list-infobox-group .item-box-sub.type-1 .box-dl {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    min-height: 2rem
}

.list-infobox-group .item-box-sub.type-1 .box-dl+.box-dl {
    margin-top: 1.2rem
}

.list-infobox-group .item-box-sub.type-1 .box-dl:last-child {
    margin-top: 0.4rem
}

.list-infobox-group .item-box-sub.type-1 .box-dl .area-term {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    color: var(--color-g700, #7d7d7d);
    font-size: 1.5rem
}

.list-infobox-group .item-box-sub.type-1 .box-dl .area-desc {
    color: var(--color-g900, #141414);
    font-size: 1.5rem
}

.list-infobox-group .item-box-sub.type-1 .box-dl .area-desc.warning {
    color: var(--color-re700)
}

.list-infobox-group .item-box.ty01 {
    -webkit-box-pack: left;
    -ms-flex-pack: left;
    justify-content: left
}

.list-infobox-group .item-box.ty01 .area-term {
    padding-left: 1.6rem
}

.list-infobox-group .item-box.ty01 .area-desc {
    word-break: break-all;
    text-align: left
}

.list-infobox-group .item-box-sub .box-sub *,
.list-infobox-group.radius .list-item .item-box * {
    font-size: 1.4rem !important
}

.list-infobox-group .item-box-sub .box-sub .tag .txt {
    font-size: 1.1rem !important;
    line-height: 100% !important
}

.list-infobox-group.radius .list-item .item-box .txt-circle {
    font-size: 1.2rem !important
}

.list-infobox-group .item-box-sub .box-sub .prefer-rate {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 1.2rem !important;
    line-height: 1.6rem !important;
    margin-top: 0;
    color: var(--txt-accent-sec);
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.list-infobox-group .item-box-sub.fs15 .box-sub+.box-sub {
    margin-top: 1.6rem
}

.list-infobox-group .item-box-sub.fs15 .area-term {
    font-size: 1.5rem !important
}

.list-infobox-group .item-box-sub.fs15 .area-desc {
    font-size: 1.5rem !important;
    font-weight: bold
}

:root .list-infobox-group .item-box-sub.fs15 .area-desc.a11y {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.list-infobox-group .item-box-sub.fs15 .area-desc * {
    font-weight: bold;
    font-size: 1.5rem !important
}

:root .list-infobox-group .item-box-sub.fs15 .area-desc .label-field {
    font-weight: 500;
    color: var(--txt-ter, #4d596f)
}

:root .list-infobox-group.noline .list-row .list-item .input-close-group.done .ui-text-del {
    color: var(--txt-pri, #020616)
}

.list-infobox-group .item-box-sub.fs15 .area-desc .label-wrap .checkbox-txt-field {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.list-infobox-group .item-box-sub.fs15 .area-desc .label-wrap .checkbox-txt-field span {
    color: var(--color-g900, #141414)
}

.list-infobox-group .item-box-sub.fs15 .area-desc .label-wrap .input-checkbox {
    margin-right: 0.6rem
}

.list-infobox-group .accordion-tit {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.list-infobox-group .btn-acco {
    padding-left: 0.4rem;
    margin-top: -0.4rem
}

.list-infobox-group .accordion-cont {
    margin-top: 1.6rem;
    padding: 1.6rem 2rem;
    background: var(--color-g100, #f8f8f8)
}

:root .list-infobox-group .accordion-cont {
    border-radius: 1.2rem
}

.list-infobox-group .accordion-cont .cont-item+.cont-item {
    margin-top: 0.8rem
}

.list-infobox-group .accordion-cont .cont-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.list-infobox-group .accordion-cont .area-desc {
    font-size: 1.4rem
}

.list-infobox-group .accordion-cont .area-term {
    color: var(--color-g700, #7d7d7d);
    font-size: 1.4rem
}

.list-infobox-group .item-box-cont+.group-tit {
    margin-top: 1.2rem;
    padding-top: 1.2rem;
    border-top: 1px solid var(--color-g300, #e0e0e0)
}

.list-infobox-group .group-tit {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: bold;
    color: var(--color-g900, #141414)
}

.list-infobox-group .group-tit+.item-box-cont {
    margin-top: 1.2rem
}

.list-infobox-group.radius {
    padding: 0 2rem;
    border: 1px solid var(--color-g200, #eee);
    border-radius: 1rem;
    background-color: var(--color-w100, #fff)
}

.list-infobox-group.radius {
    padding: 0.8rem 2rem 0.4rem
}

.list-infobox-group.radius .list-row {
    border: none;
    padding: 1.2rem 0
}

.list-infobox-group.radius .list-row:first-child {
    border: none
}

.list-infobox-group.radius .list-row+.list-row {
    border-top: 1px solid var(--color-g200, #eee)
}

.list-infobox-group.radius .tit {
    margin-bottom: 0.8rem;
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: bold
}

.list-infobox-group+.text-list-group2 {
    margin-top: 4.8rem
}

.list-infobox-group+.tit-simple-group {
    margin-top: 2.4rem
}

.list-infobox-group+.text-simple-group {
    margin-top: 0.8rem
}

.list-infobox-group .row-infobox .list-row-info {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.list-infobox-group .row-infobox .list-row {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    margin-top: 0.4rem;
    color: var(--color-g700, #7d7d7d)
}

.list-infobox-group .row-infobox .list-state {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    font-size: 2.4rem;
    line-height: 3.3rem;
    font-weight: bold;
    color: var(--color-g900, #141414)
}

.list-infobox-group .list-tit+.list-col-info {
    margin-top: 1.2rem
}

.list-infobox-group .tit-col.bold,
.list-infobox-group .tit-row.bold {
    font-size: 2.4rem;
    line-height: 3.3rem;
    font-weight: bold
}

.list-infobox-group .txt-date {
    margin-top: 0.4rem;
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g600, #9b9b9b)
}

.list-infobox-group .txt-date.secondary1-2 {
    color: var(--color-bu900, #003fc7)
}

.list-infobox-group .list-col-info {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.list-infobox-group .section-head {
    padding: 0.8rem
}

.list-infobox-group+.txt-guide {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    margin-top: 0.8rem;
    color: var(--color-g700, #7d7d7d)
}

.list-infobox-group+.bl-txt-group {
    margin-top: 0.8rem;
    padding-bottom: 1.6rem
}

.list-infobox-group+.bl-txt-group .txt {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g700, #7d7d7d)
}

.list-infobox-group+.bl-txt-group .txt+.txt {
    margin-top: 0.8rem
}

.list-infobox-group .btn-more-box-sub {
    display: block;
    margin: 0.8rem auto 0;
    width: 3.2rem;
    height: 3.2rem;
    border: 1px solid var(--color-g300, #e0e0e0);
    border-radius: 99rem
}

.list-infobox-group .btn-more-box-sub .ico-arrow-open {
    -webkit-filter: var(--filter-g900);
    filter: var(--filter-g900)
}

.list-infobox-group .open .btn-more-box-sub {
    display: none
}

.list-infobox-group .list-infobox-util {
    text-align: right;
    margin-top: 0.8rem
}

.list-infobox-group .list-infobox-util.space-between {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.list-infobox-group .list-infobox-util.space-between .util-col {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 100%;
    flex: 1 1 100%
}

.list-infobox-group .list-infobox-util.space-between .util-col:first-child {
    text-align: left
}

.list-infobox-group .list-infobox-util.space-between .util-col:last-child {
    text-align: right
}

.list-infobox-footer {
    margin-top: 0.8rem
}

.list-infobox-footer .txt-row.right {
    text-align: right
}

.list-infobox-footer .txt-row+.txt-row {
    margin-top: 0.4rem
}

.list-infobox-footer .txt {
    color: var(--color-g700, #7d7d7d);
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400
}

.list-infobox-footer .txt+.txt {
    margin-top: 0.4rem
}

.list-infobox-group.type1 .tit-box-top {
    margin-left: -2rem;
    margin-right: -2rem;
    margin-top: -.8rem;
    padding: 2.6rem 0;
    text-align: center;
    background: var(--color-g100, #f8f8f8);
    border-bottom: 1px solid var(--color-g200, #eee);
    border-radius: 1rem 1rem 0 0
}

.list-infobox-group.type2 {
    position: relative
}

.list-infobox-group.type2 .pb-alarm-tip {
    position: absolute;
    left: 0;
    -webkit-transform: translateX(4rem);
    -ms-transform: translateX(4rem);
    transform: translateX(4rem)
}

.list-infobox-group.type2 .list-item {
    margin: 2.4rem 0 0.8rem
}

.list-infobox-group.type2 .list-item:first-child {
    margin: 0 0 0.8rem;
    padding-top: 2.4rem;
    border-top: 1px solid var(--border-qua)
}

.list-infobox-group.type2 .item-box .area-term {
    position: relative;
    color: var(--txt-pri)
}

.list-infobox-group.type2 .item-box .area-term.new:after {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 1.9rem;
    width: 4.58px;
    height: 4.58px;
    border-radius: 99rem;
    background-color: var(--color-re700)
}

.list-infobox-group.type2 .ico-coin,
.list-infobox-group.type2 .ico-paper {
    width: 2.2rem;
    height: 2.2rem;
    margin-right: 0.8rem;
    -webkit-filter: brightness(0) saturate(100%) invert(82%) sepia(12%) saturate(449%) hue-rotate(155deg) brightness(91%) contrast(89%);
    filter: brightness(0) saturate(100%) invert(82%) sepia(12%) saturate(449%) hue-rotate(155deg) brightness(91%) contrast(89%)
}

.list-infobox-group.type2 .ico-alarm {
    position: relative;
    width: 2.2rem;
    height: 2.2rem;
    margin-right: 0.8rem;
    -webkit-filter: brightness(0) saturate(100%) invert(84%) sepia(55%) saturate(751%) hue-rotate(354deg) brightness(97%) contrast(101%);
    filter: brightness(0) saturate(100%) invert(84%) sepia(55%) saturate(751%) hue-rotate(354deg) brightness(97%) contrast(101%)
}

.list-infobox-group.type2 .ico-arrow-link {
    -webkit-filter: var(--filter-ico-sec);
    filter: var(--filter-ico-sec)
}

.pb-alarm-set {
    position: relative;
    overflow: hidden
}

.pb-alarm-set .pb-alarm-set-btn {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 0;
    padding-top: 100%;
    overflow: hidden;
    display: block
}

.list-infobox-group.gray-round {
    margin-top: 2.4rem;
    padding: 0 2rem
}

.list-infobox-group.gray-round .list-row {
    padding: 1.4rem 2rem;
    background-color: var(--color-g100, #f8f8f8);
    border-bottom: 0;
    border-radius: 1rem
}

.list-infobox-group.gray-round .list-row:first-child {
    border-top: 0
}

.list-infobox-group.gray-round .item-box {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.list-infobox-group.gray-round .item-box .area-term {
    display: none
}

.list-infobox-group.gray-round .item-box .area-desc {
    font-size: 1.2rem;
    font-weight: 400;
    color: var(--color-g700, #7d7d7d);
    text-align: center
}

.component-text-icon+.component-list-infobox .list-infobox-group.gray-round {
    margin-top: -2.4rem
}

.list-infobox-group .accordion-cont.type01 .cont-item+.cont-item {
    margin-top: 1.6rem
}

.list-infobox-group .accordion-cont.type01 .area-term {
    font-size: 1.5rem
}

.list-infobox-group.sub-list .list-item+.list-item {
    margin-top: 0.8rem
}

.list-infobox-group.sub-list .area-desc,
.list-infobox-group.sub-list .item-box .area-term {
    font-size: 1.4rem;
    color: var(--color-g700, #7d7d7d)
}

.list-infobox-group.sub-list .tit-item .area-desc,
.list-infobox-group.sub-list .tit-item .area-term {
    color: var(--color-g900, #141414)
}

.list-detailview {
    border-top: 1px solid var(--color-g300, #e0e0e0);
    border-bottom: 1px solid var(--color-g300, #e0e0e0);
    padding: 1.6rem 0 1.6rem
}

.list-detailview .cont-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-top: 0.8rem
}

.list-detailview .cont-box .area-desc,
.list-detailview .cont-box .area-term {
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--color-g900, #141414)
}

.list-detailview .item-box-cont .cont-item .cont-box {
    padding-left: 10px;
    position: relative
}

.list-detailview .item-box-cont .cont-item .cont-box * {
    color: var(--color-g700, #7d7d7d)
}

.list-detailview .item-box-cont .cont-item .cont-box:before {
    content: '-';
    position: absolute;
    left: 0;
    top: 0;
    display: block;
    color: var(--color-g700, #7d7d7d)
}

.list-detailview>.cont-box:nth-child(1) {
    margin-top: 0
}

.list-detailview .cont-box+.cont-box,
.list-detailview .item-box-cont+.cont-box {
    margin-top: 1.2rem
}

.list-infobox-group .accordion-cont.list-detailview {
    padding: 2.4rem 2rem 1.6rem
}

.list-infobox-group .accordion-cont.list-detailview .group-tit {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    line-height: 2rem
}

.list-infobox-group .accordion-cont.list-detailview .group-tit em,
.list-infobox-group .accordion-cont.list-detailview .group-tit span {
    font-size: 1.4rem;
    font-weight: 400;
    color: var(--color-g900, #141414)
}

.list-infobox-group .accordion-cont.list-detailview .group-tit+.group-tit,
.list-infobox-group .accordion-cont.list-detailview .item-box-cont+.group-tit {
    margin-top: 1.2rem
}

.list-infobox-group .accordion-cont.list-detailview .txt {
    font-size: 1.4rem
}

.list-infobox-group .accordion-cont.list-detailview .txt:before {
    color: var(--color-g700, #7d7d7d)
}

.list-infobox-group .accordion-cont.list-detailview .area-desc,
.list-infobox-group .accordion-cont.list-detailview .area-term {
    font-size: 1.4rem;
    line-height: 2rem
}

.component-text-complex+.component-list-infobox.type2 {
    margin-top: 3.2rem
}

.list-infobox-group .list-item.flex.col-w100 span {
    width: 100%;
    color: #999;
    text-align: right
}

:root .list-infobox-group .list-item.flex.col-w100 span {
    color: var(--color-g700)
}

.list-infobox-group .list-item.flex.col-w100 span.warning {
    color: var(--color-re700, #f02727)
}

.list-infobox-group .list-item.flex.col-w100 span.warning.pd {
    padding-right: 2rem
}

.list-infobox-group .list-item+.list-item.col-w100 {
    margin-top: .4rem
}

.join-group .input-close-group .label-field {
    font-size: 1.5rem
}

.join-group .input-close-group .ico-edit {
    margin: 0 0 0 0.7rem;
    width: 1.6rem;
    height: 1.6rem;
    background-size: 1.6rem 1.6rem
}

.list-infobox-group.join-group .list-item+.list-item {
    margin-top: 2rem
}

.list-infobox-group.join-group .list-item+.list-item.col-w100 {
    margin-top: .4rem
}

.list-infobox-group.ty01 {
    margin-top: 2.4rem
}

.list-infobox-group.ty01 .list-item+.list-item {
    margin-top: 1.2rem
}

.list-infobox-group.ty01 .area-term {
    margin-right: 0;
    font-size: 1.6rem;
    line-height: 2.1rem
}

.list-infobox-group.ty01 .area-desc {
    margin-left: .8rem;
    font-size: 1.6rem;
    line-height: 2.1rem
}

.list-infobox-group.ty01 .list-item.flex .area-desc.left {
    margin-left: .8rem
}

.list-infobox-group.ty02 .item-box {
    -webkit-box-pack: normal;
    -ms-flex-pack: normal;
    justify-content: normal;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.list-infobox-group.ty02 .area-term {
    width: 8.8rem
}

.list-infobox-group.ty02 .area-desc {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-weight: 500
}

.list-infobox-group.ty02 .area-desc .btn-lv03 {
    margin-left: auto
}

.list-infobox-group.ty03 {
    margin-top: 1rem !important
}

.list-infobox-group.ty03 .list-row {
    padding: .8rem 0
}

.list-infobox-group.ty03 [class^="ico-"]+.txt-lv03 {
    margin-left: .6rem
}

.list-infobox-group.ty03 .txt-lv03+.tag {
    margin-left: .2rem
}

.list-infobox-group.ty03 .list-item+.list-item {
    margin-top: .8rem
}

.list-infobox-group.ty03 .area-desc .btn-under-link {
    color: var(--txt-ter)
}

.list-infobox-group.ty04 .list-row {
    border-bottom: 0;
    padding: 1.6rem 0 0;
    margin-top: 1.6rem
}

.list-infobox-group.ty04 .list-item+.list-item {
    margin-top: 1.2rem
}

.list-infobox-group.ty04 .item-box span {
    font-size: 1.6rem;
    line-height: 2.1rem
}

.list-infobox-group.ty04 .item-box span .txt-lv01 {
    color: var(--color-g900)
}

.list-infobox-group.ty04 .list-item .tooltip-group .btn-tooltip {
    top: 0
}

.list-infobox-group.ty04 .list-row.fs15 .item-box span {
    font-size: 1.5rem;
    line-height: 2rem
}

.list-infobox-group.ty05 .item-box {
    -webkit-box-pack: left;
    -ms-flex-pack: left;
    justify-content: left
}

.list-infobox-group.ty05 .area-term {
    width: 8.2rem;
    color: var(--txt-qua, #67748e)
}

.list-infobox-group.ty05 .area-desc {
    text-align: left;
    color: var(--txt-ter, #4d596f);
    font-weight: 500
}

.list-infobox-group.ty05 .area-desc.primary {
    color: var(--txt-accent-pri)
}

.list-infobox-group.ty05 .area-desc .primary {
    color: var(--txt-accent-pri)
}

.list-infobox-group.ty06 {
    margin-top: 1.6rem;
    padding-top: 1.6rem;
    border-top: 1px solid var(--border-qua)
}

.list-infobox-group.ty06 .list-item {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.list-infobox-group.ty06 .list-item+.list-item {
    margin-top: 1.2rem
}

.list-infobox-group.ty06 .area-term {
    font-size: 1.6rem;
    line-height: 2.1rem
}

.list-infobox-group.ty06 .area-desc {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 500
}

.list-infobox-group.ty07 .area-term {
    color: var(--color-g500, #8694b1);
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 500
}

.list-infobox-group.ty07 .area-desc {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 500
}

.list-infobox-group.ty07 .area-desc .ico-money-point {
    width: 2rem;
    height: 2rem;
    margin-right: 0.2rem
}

.list-infobox-group.ty07 .txt-icon {
    margin-top: 1.2rem;
    padding: 1.2rem 0 1.2rem 4rem;
    background-color: var(--color-red-re50, #ffe5e0);
    border-radius: 1.2rem
}

.list-infobox-group.ty07 .txt-icon [class^="ico-"] {
    left: 1.8rem;
    top: calc(50% - 0.9rem)
}

.list-infobox-group.ty08 {
    padding: 0 0.8rem 0.4rem
}

.list-infobox-group.ty08 .list-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2.4rem
}

.list-infobox-group.ty08 .list-grid .list-item {
    margin-top: 0
}

.list-infobox-group.ty08 .list-grid .list-item .item-box {
    display: block
}

.list-infobox-group.ty08 .list-grid .list-item .tit-area {
    font-size: 1.2rem;
    color: var(--color-g700);
    line-height: 1.6rem
}

.list-infobox-group.ty08 .list-grid .list-item .state-area {
    margin-top: 0.8rem
}

.list-infobox-group.ty08 .list-grid .list-item .state-area>.txt {
    font-size: 1.8rem;
    color: var(--txt-sec);
    font-weight: bold;
    line-height: 2.5rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.list-infobox-group.ty08 .list-grid .list-item .state-area .detail {
    margin-top: 0.4rem;
    font-size: 1.1rem;
    color: var(--color-g600);
    line-height: 1.5rem
}

.list-infobox-group.ty08 .list-grid .list-item .state-area .tag {
    margin-left: 0.4rem
}

.list-infobox-group.ty09 .list-row:first-child {
    border-top: none
}

.list-infobox-group.ty09 .list-row:last-child {
    border-bottom: none
}

.list-infobox-group.ty09 .list-row .txt-lv02 {
    margin-bottom: 2rem
}

.list-infobox-group.ty09 .area-desc.total {
    font-size: 1.6rem;
    font-weight: bold
}

.list-infobox-group.ty10 .area-desc,
.list-infobox-group.ty10 .area-term {
    font-size: 1.4rem
}

.list-infobox-group.ty11 .item-box-sub {
    margin-top: 0.4rem;
    padding: 2rem;
    border-radius: 2rem
}

.list-infobox-group.ty11 .item-box-sub .box-sub .area-desc,
.list-infobox-group.ty11 .item-box-sub .box-sub .area-term {
    font-size: 1.6rem !important
}

.list-infobox-group.ty11 .item-box-sub .box-sub .area-desc {
    color: var(--txt-sec, #3b4659);
    font-weight: 500
}

.list-infobox-group.ty11 .item-box-sub .box-sub+.box-sub {
    margin-top: 1.6rem
}

.list-infobox-group.type3 .item-box-sub {
    padding: 2.4rem 2rem 1.6rem
}

.list-infobox-group.type3 .item-box-sub .row-box+.row-box {
    margin-top: 1.2rem;
    padding-top: 2rem
}

.list-infobox-group.type3 .item-box-sub .box-sub+.box-sub {
    margin-top: 1.6rem
}

.list-infobox-group.type3 .item-box-sub .area-term {
    font-size: 1.5rem !important;
    line-height: 2rem !important;
    color: var(--txt-ter)
}

.list-infobox-group.type3 .item-box-sub .area-desc {
    font-size: 1.5rem !important;
    line-height: 2rem !important;
    color: var(--txt-pri)
}

.list-infobox-group.type3 .item-box-sub .area-desc .desc {
    margin-top: 0.2rem;
    font-size: 1.2rem !important;
    line-height: 1.6rem !important;
    color: var(--txt-ter)
}

.list-infobox-group.type3 .txt-lv02 {
    font-size: 1.5rem !important;
    color: var(--txt-ter)
}

.list-infobox-group.type3 .txt-lv01 {
    font-size: 1.6rem !important
}

.list-infobox-group.type3 .item-box-sub.fs16 .area-desc,
.list-infobox-group.type3 .item-box-sub.fs16 .area-term {
    font-size: 1.6rem !important
}

.list-infobox-group.type4 .list-row {
    padding: 1.6rem 0
}

.list-infobox-group.type4 .area-term {
    font-size: 1.6rem;
    color: var(--txt-ter)
}

.list-infobox-group.type4 .area-desc {
    font-size: 1.6rem;
    color: var(--txt-pri)
}

.list-infobox-group.type5 .list-row {
    padding: 1.6rem 0
}

.list-infobox-group.type6 .list-row .list-item .item-box-sub .box-sub:first-child {
    padding-bottom: 1rem;
    margin-bottom: 1rem;
    font-weight: 500;
    border-bottom: 1px solid var(--border-qua)
}

.list-infobox-group.type6 .list-row .list-item .item-box-sub .box-sub.noline {
    padding-bottom: unset;
    margin-bottom: unset;
    font-weight: unset;
    border: none
}

.list-infobox-group.type6 .item-box-sub .box-sub+.box-sub {
    margin-top: 1rem
}

.list-infobox-group.type6 .list-row .list-item .item-box-sub .box-sub.line {
    padding-bottom: 1.6rem;
    margin-bottom: 1.6rem;
    font-weight: 500;
    border-bottom: 1px solid var(--border-qua)
}

.list-infobox-group.type6 .list-row .list-item .item-box-sub .area-desc .txt-accent-pri {
    text-align: right
}

.list-infobox-group.type6 .list-row .list-item .item-box-sub .area-desc {
    max-width: 19rem
}

.list-infobox-group.type6 .list-row .list-item .item-box-sub .area-desc .ico-help {
    margin-left: .4rem;
    width: 2rem;
    height: 2rem
}

.list-infobox-group.radius.type4 .list-item+.list-item {
    margin-top: 1.2rem
}

.list-infobox-group.radius.type4 .list-item .item-box {
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch
}

.list-infobox-group.radius.type4 .list-item .item-box .area-term {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.list-infobox-group.radius.type4 .list-item .item-box .area-term .big {
    -ms-flex-preferred-size: 100%;
    flex-basis: 100%;
    margin-top: .2rem;
    font-size: 1.5rem !important;
    font-weight: 700;
    line-height: 2rem;
    color: var(--color-g800)
}

.list-infobox-group.radius.type4 .list-item .item-box .area-term .small {
    -ms-flex-preferred-size: 100%;
    flex-basis: 100%;
    font-size: 1.4rem !important;
    line-height: 2rem;
    color: var(--txt-qua)
}

.list-infobox-group.radius.type4 .list-item .item-box .area-desc {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.list-infobox-group.radius.type4 .tag {
    background: var(--color-g200)
}

.list-infobox-group.radius.type4 .tag .txt {
    font-size: 1.1rem !important;
    line-height: 1.5rem;
    color: var(--txt-ter)
}

.list-infobox-group.radius.type4 .tag.blue {
    background: var(--color-in50)
}

.list-infobox-group.radius.type4 .tag.blue .txt {
    color: var(--txt-accent-sec)
}

.list-infobox-group.menu-type .list-row {
    padding: 0;
    border: 0
}

.list-infobox-group.menu-type .list-item+.list-item {
    margin-top: 0
}

.list-infobox-group.menu-type .section-link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 1.6rem 0
}

.list-infobox-group.menu-type .area-term {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    overflow: hidden;
    padding-right: 1.6rem
}

.list-infobox-group.menu-type .col-tit {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    overflow: hidden;
    margin-right: 1.6rem
}

.list-infobox-group.menu-type .list-logo {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 3.6rem;
    flex: 0 0 3.6rem;
    width: 3.6rem;
    height: 3.6rem;
    margin-right: 1.6rem;
    border-radius: 1.4rem;
    background-color: var(--bg-pri-invert)
}

.list-infobox-group.menu-type .list-logo [class^="ico-"] {
    width: 2rem;
    height: 2rem
}

.list-infobox-group.menu-type .list-tit {
    overflow: hidden
}

.list-infobox-group.menu-type .txt-tit {
    overflow: hidden;
    display: block;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 2.1rem;
    color: var(--txt-pri-invert)
}

.list-infobox-group.menu-type .txt-guide {
    overflow: hidden;
    display: block;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin-top: 0.4rem;
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--txt-sec-invert)
}

.list-infobox-group.menu-type .list-item .form-toggle-group {
    padding: 1.6rem 0;
    border: 0
}

.list-infobox-group.menu-type .list-item .form-toggle-label {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

/*!
* component element
* list
* linebox type
*/

.list-linebox-group {
    padding: 0;
    background: var(--color-w100, #fff)
}

.list-linebox-group.last-noline .list-item:last-child {
    border-bottom: none
}

.list-linebox-group.noline+.list-linebox-group.noline {
    margin-top: 1.6rem;
    padding-top: 1.6rem;
    border-top: 1px solid var(--color-g200, #eee)
}

:root .list-linebox-group.noline+.list-linebox-group.noline {
    border-top: 1px solid var(--color-g300, #e0e6f1)
}

.list-linebox-group.noline+.list-linebox-group.noline .title-group {
    margin-top: 1.6rem
}

.list-linebox-group.noline .list-item {
    border: none
}

:root .list-linebox-group.noline .list-item {
    border: none
}

.list-linebox-group.noline .section-link {
    padding: 1.6rem 0
}

.list-linebox-group.noline .section-link.ty02 {
    padding: 2.4rem 0
}

.list-linebox-group.noline .section-link.ty02 .box-state {
    margin-top: .8rem
}

.list-linebox-group.noline .section-link.ty02 .txt-state {
    color: var(--txt-quin)
}

.list-linebox-group.noline .section-link.ty03 {
    padding: 1.6rem 2rem
}

.list-linebox-group.noline .title-group {
    margin-top: 0
}

.list-linebox-group.noline.type2 .section-link {
    padding: 1.6rem 2rem
}

.list-linebox-group.noline.type2 .title-group {
    margin-top: 3.2rem
}

.list-linebox-group.noline.type2 .title-group:first-child {
    margin-top: 0
}

.list-linebox-group.noline.type2 .list-linebox-group.prd .section-link {
    padding: 1.2rem 1.5rem 0 0
}

.list-linebox-group.noline.type2 .list-linebox-group.prd .list-item:first-child .section-link {
    padding-top: 0
}

.list-linebox-group.noline.type3 {
    padding-bottom: 1.6rem
}

.list-linebox-group.noline.type3 .area-ico {
    margin-right: 1.2rem
}

.list-linebox-group.noline.type3 .txt-state {
    margin-bottom: 0.4rem;
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 2rem;
    color: var(--txt-ter)
}

.list-linebox-group.noline.type4 {
    padding: 2.4rem 2rem 1.6rem;
    border-radius: 2rem;
    border: 1px solid var(--border-qua)
}

.list-linebox-group.noline.type4 .img-area {
    margin-right: 1.4rem
}

.list-linebox-group.noline.type4 .img-area img {
    width: 4.4rem;
    height: 4.4rem
}

.list-linebox-group.noline.type4 .txt-state {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 0.4rem;
    margin-bottom: 0.3rem;
    font-weight: 500;
    color: var(--txt-pri)
}

.list-linebox-group.noline.type4 .txt-state .line-clamp-1 {
    width: auto
}

.list-linebox-group.noline.type4 .txt {
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--txt-sec)
}

.list-linebox-group.noline.type4 .tag .txt {
    font-size: 1.1rem;
    line-height: 100%
}

.list-linebox-group.noline.type4 .tag.loan .txt {
    color: var(--txt-accent-sec)
}

.list-linebox-group.noline.type4 .tag.neutral .txt {
    color: var(--txt-pri-neutral)
}

.list-linebox-group.close-noline .list-item.ui-accordion-list {
    border: none
}

.list-linebox-group.close-noline .list-item.ui-accordion-list.open {
    border-bottom: 1px solid var(--border-qua)
}

.list-linebox-group.type01 .section-link {
    padding: 2rem
}

.list-linebox-group.noline.type5 {
    border-radius: 1.6rem;
    background-color: var(--bg-qua);
    padding: 2rem
}

.list-linebox-group.noline.type5 .list-row .list-item:first-child {
    margin-bottom: 2rem
}

.list-linebox-group.noline.type5 .section-link {
    padding: 0
}

.list-linebox-group.noline.type6 .list-item {
    border-radius: 1.6rem;
    background-color: var(--bg-qua);
    padding: 1.6rem 2rem
}

.list-linebox-group.noline.type6 .list-item .section-link {
    padding: 0
}

.list-linebox-group.noline.type6 .list-item .accordion-cont {
    padding: 1.2rem 0 0 0
}

.list-linebox-group.noline.type6 .list-item>.section-link .col-tit .tit-list {
    font-size: 1.4rem;
    font-weight: 700;
    line-height: 2rem;
    color: var(--txt-sec)
}

.list-linebox-group.noline.type6 .accordion-cont .bl-txt-group>.txt {
    font-size: 1.1rem;
    font-weight: 400;
    line-height: 1.4rem;
    color: var(--txt-qua)
}

.list-linebox-group.noline.type7 .list-item {
    border-radius: 1.6rem;
    background-color: var(--bg-qua);
    padding: 2rem
}

.list-linebox-group.noline.type7 .list-item .section-link {
    padding: 0
}

.list-linebox-group.noline.type7 .list-item .accordion-cont {
    padding: 1.2rem 0 0 0
}

.list-linebox-group.noline.type7 .list-item .accordion-cont .txt-info {
    font-size: 1.1rem;
    font-weight: 400;
    line-height: 1.4rem;
    color: var(--txt-qea);
    margin-top: 2rem
}

.list-linebox-group.noline.type7 .list-item>.section-link .col-tit .tit-list {
    font-size: 1.4rem;
    font-weight: 700;
    line-height: 2rem;
    color: var(--txt-ter)
}

.list-linebox-group.noline.type7 .accordion-cont .bl-txt-group>.txt {
    font-size: 1.2rem;
    font-weight: 400;
    line-height: 1.6rem;
    color: var(--txt-qua)
}

.list-linebox-group.noline.type7 .mycredit-weathe-accordion {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-top: 1.2rem
}

.list-linebox-group.noline.type7 .mycredit-weathe-accordion .mycredit-weathe-accordion-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.list-linebox-group.noline.type7 .mycredit-weathe-accordion .mycredit-weathe-accordion-list .ico-mycredit-weather {
    background-size: 100%
}

.list-linebox-group.noline.type7 .mycredit-weathe-accordion .mycredit-weathe-accordion-list .txt {
    margin: .6rem 0 .2rem 0;
    font-size: 1rem;
    font-weight: 500;
    line-height: 2rem;
    color: var(--txt-qua)
}

.list-linebox-group.noline.type7 .mycredit-weathe-accordion .mycredit-weathe-accordion-list .tit {
    font-size: 1.3rem;
    font-weight: 500;
    line-height: 2rem;
    color: var(--txt-sec)
}

.list-linebox-group.noline.type8 .list-item {
    border: 1px solid var(--border-qua);
    border-radius: 1.6rem;
    background-color: var(--bg-pri-base);
    padding: 2rem
}

.list-linebox-group.noline.type8 .list-item+.list-item {
    margin-top: 2.4rem
}

.list-linebox-group.noline.type8 .list-item .section-link {
    padding: 0
}

.list-linebox-group.noline.type8 .list-item .accordion-cont {
    margin-top: 1.6rem;
    padding: 1.6rem 2rem;
    border-radius: 1.2rem;
    background-color: var(--bg-qua)
}

.list-linebox-group.noline.type8 .list-item .accordion-cont .txt-info {
    font-size: 1.2rem;
    font-weight: 400;
    line-height: 1.6rem;
    color: var(--txt-ter)
}

.list-linebox-group.noline.type8 .list-item .accordion-cont .bl-txt-group {
    margin-top: 1.2rem;
    padding-top: 1.2rem;
    border-top: 1px solid var(--border-qua)
}

.list-linebox-group.noline.type8 .list-item .accordion-cont .bl-txt-group .txt {
    font-size: 1.3rem;
    font-weight: 400;
    line-height: 2rem;
    color: var(--txt-ter)
}

.list-linebox-group.last-noline.type8 {
    border-radius: 1.6rem;
    background-color: var(--bg-qua);
    padding: 0 2rem
}

.list-linebox-group.last-noline.type8 .section-link {
    padding: 2rem 0
}

.list-linebox-group.type1 .accordion-cont.ui-accordion-cont {
    border-bottom: 1px solid var(--border-qua);
    margin-bottom: 12px
}

.list-linebox-group.type1 .list-row .list-item {
    border: none
}

.list-linebox-group.type1 .tit-list {
    color: var(--txt-pri)
}

.list-linebox-group.topline {
    border-top: 1px solid var(--color-g200, #eee)
}

.list-linebox-group.transparent {
    padding-top: 0.4rem;
    background-color: transparent
}

.list-linebox-group.transparent .list-item:last-child {
    margin-bottom: -2.4rem
}

.list-linebox-group .list-item {
    border-bottom: 1px solid var(--color-g200, #eee)
}

:root .list-linebox-group .list-item {
    border-bottom: 1px solid var(--color-g300, #e0e6f1)
}

:root .list-linebox-group .list-item.a11y {
    position: relative
}

.list-linebox-group .section-link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 1.6rem 2rem
}

.list-linebox-group .section-link.ty01 {
    padding-left: 0;
    padding-right: 0
}

.list-linebox-group .section-link.ty01+.graybox-text-group {
    margin-bottom: 2rem
}

.list-linebox-group .section-link.wide {
    padding: 2rem
}

.list-linebox-group .list-item.jui-sortable-helper .section-link {
    background-color: var(--color-w100, #fff);
    margin: 0 -2rem;
    padding: 1.6rem 2rem;
    -webkit-box-shadow: 0 2px 6px 4px var(--color-pb5, #0000000C);
    box-shadow: 0 2px 6px 4px var(--color-pb5, #0000000C)
}

.list-linebox-group .section-link+.section-link {
    padding-top: 0
}

.list-linebox-group .list-item .section-link+.section-link {
    padding-top: 1.6rem
}

.list-linebox-group.bg-gray {
    background: var(--color-g100, #f8f8f8)
}

.list-linebox-group.type1 .section-link .col-tit {
    overflow: hidden
}

.list-linebox-group.type1 .section-link .tit-area {
    max-width: 100%
}

.list-linebox-group.type1 .section-link .tit-list {
    white-space: nowrap;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    overflow: hidden
}

.list-linebox-group.type1 .section-link .col-state {
    white-space: nowrap
}

.list-linebox-group.qtype .list-item {
    border: 0
}

:root .list-linebox-group.qtype .list-item {
    border: 0
}

.list-linebox-group.qtype .section-link {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    padding: 1.6rem 0
}

.list-linebox-group.qtype .col-state {
    min-height: 2.1rem
}

.list-linebox-group.qtype .col-state .ico-arrow-open {
    -webkit-filter: var(--filter-g500);
    filter: var(--filter-g500)
}

:root .list-linebox-group.qtype .col-state .ico-arrow-open {
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

.list-linebox-group.qtype .accordion-cont {
    padding: 2.8rem 2rem 2.8rem 5.8rem;
    margin: 0 -2rem
}

.list-linebox-group.qtype.type2 .accordion-cont {
    padding: 2.8rem 2rem 2.8rem 4.6rem
}

.list-linebox-group.qtype.type2.title-indent .accordion-cont {
    padding-left: 2rem
}

.list-linebox-group.noline.full-type+.btn-group,
.list-linebox-group.qtype.type2+.btn-group {
    margin: 0.8rem 0 2rem
}

.list-linebox-group.transparent-type {
    background: transparent
}

.list-linebox-group.transparent-type .accordion-cont {
    background: transparent !important;
    padding: 1.6rem 0
}

.list-linebox-group.transparent-type .accordion-cont .txt-group>.txt {
    color: var(--color-g700, #7d7d7d)
}

.list-linebox-group.full-type .accordion-cont {
    margin: 0 -2rem;
    padding: 1.6rem 2rem
}

.list-linebox-group.full-type .accordion-cont .txt-group>.txt {
    color: var(--color-g700, #7d7d7d)
}

.list-linebox-group.wide .list-item>.section-link {
    padding: 2rem
}

.list-linebox-group.info-list.wide .list-item {
    padding: 2.8rem 0
}

.list-linebox-group.wide.no-space .list-item>.section-link,
.list-linebox-group.wide.noline .list-item>.section-link {
    padding: 2rem 0
}

.list-linebox-group .accordion-cont {
    background: var(--color-g100, #f8f8f8);
    padding: 2.4rem 2rem
}

.list-linebox-group .accordion-cont .row-cont .title-group {
    margin-top: 0
}

.list-linebox-group .accordion-cont .row-cont+.row-cont {
    margin-top: 3.2rem
}

.list-linebox-group .accordion-cont .row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.list-linebox-group .accordion-cont .row+.banner-group {
    margin-top: 3.2rem
}

.list-linebox-group .accordion-cont .row .img-bill-group img {
    width: 100%
}

.list-linebox-group .accordion-cont .row+.txt-guide {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    margin-top: 0.8rem;
    color: var(--color-g700, #7d7d7d)
}

.list-linebox-group .accordion-cont .tit-row {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: bold;
    margin-top: 3.2rem;
    margin-bottom: 1.6rem
}

.list-linebox-group .accordion-cont .col-head {
    width: 5rem
}

.list-linebox-group .accordion-cont .txt-group+.bl-txt-group {
    margin-top: 1.6rem
}

.list-linebox-group .accordion-cont .bl-txt-group+.text-list-group2 {
    margin-top: 2.4rem
}

.list-linebox-group .accordion-cont .tit-cont {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: bold
}

.list-linebox-group .accordion-cont .tit-info {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: bold;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-top: 2rem
}

.list-linebox-group .accordion-cont .tit-info.secondary2:before {
    background: var(--color-lm500, #69b405)
}

.list-linebox-group .accordion-cont .tit-info.warning:before {
    background: var(--color-re700, #f02727)
}

.list-linebox-group .accordion-cont .tit-info.black:before {
    background: var(--color-g900, #141414)
}

.list-linebox-group .accordion-cont .tit-info:before {
    content: '';
    display: block;
    width: 0.8rem;
    height: 0.8rem;
    margin-right: 0.6rem
}

.list-linebox-group .accordion-cont .tit-info+.bl-txt-group,
.list-linebox-group .accordion-cont .tit-info+.dash-txt-group {
    margin-top: 0.8rem
}

.list-linebox-group .accordion-cont .tit-cont.byul {
    margin-left: 1.2rem;
    text-indent: -1.2rem
}

.list-linebox-group .accordion-cont .bl-txt-group>.txt,
.list-linebox-group .accordion-cont .byul-txt,
.list-linebox-group .accordion-cont .dash-txt-group>.txt {
    font-size: 1.4rem;
    line-height: 2rem
}

.list-linebox-group .accordion-cont.no-space {
    padding: 0
}

.list-linebox-group .accordion-cont .byul-txt.txt-indent {
    padding-left: 1.2rem;
    text-indent: -1.2rem
}

.list-linebox-group .accordion-cont.no-space .list-linebox-group {
    background-color: transparent
}

.list-linebox-group .accordion-cont.no-space .list-linebox-group .list-item:last-child {
    border-bottom: none
}

.list-linebox-group .accordion-cont .text-list-group2+.text-list-group2 {
    margin-top: 3.2rem
}

.list-linebox-group .accordion-cont [class^="table-group"] th {
    background: var(--color-g200, #eee)
}

.list-linebox-group .accordion-cont .table-group-row th+th {
    border-left: 0.1rem solid var(--color-g300, #e0e0e0)
}

.list-linebox-group .accordion-cont .img-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 1.6rem 0 2rem
}

.list-linebox-group .bill-section-link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 2rem 2rem
}

.list-linebox-group .bill-section-link .col-tit-area {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    width: 100%
}

.list-linebox-group .bill-section-link .col-tit-area .col-tit {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.list-linebox-group .bill-section-link .col-tit-area .tit-list {
    font-weight: 500
}

.list-linebox-group .btn-group {
    margin: 2.4rem 0 0
}

.component-list-linebox.no-space .list-linebox-group .btn-group,
.section-component.ui-tab .tab-content.ui-tab-content .list-linebox-group .btn-group {
    margin: 2.4rem 2rem 0
}

.component-list-linebox.no-space+.component-list-linebox.no-space {
    margin-top: -1px
}

.line-clamp-1 {
    width: 100%;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden
}

.line-clamp-2 {
    width: 100%;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden
}

.line-clamp-3 {
    width: 100%;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden
}

[class*="line-clamp"]>p {
    display: inline
}

.list-linebox-group .tit-head {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400
}

.list-linebox-group .tit-list {
    font-size: 1.6rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g900, #141414)
}

.list-linebox-group .tit-list>.ico-etc-new-large {
    margin-top: -0.3rem
}

.list-linebox-group .list-item>.section-link .col-tit .tit-list {
    font-weight: 500
}

.list-linebox-group .list-item>.section-link .col-tit .tit-list .key-w {
    color: var(--txt-accent-sec);
    font-weight: 700
}

.list-linebox-group .tit-list+.tooltip-group .ico-help {
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700);
    margin-top: 0;
    width: 2rem;
    height: 2rem
}

.list-linebox-group .list-item:nth-child(5n-4) .address-profile {
    background-color: var(--color-in50, #efefff)
}

.list-linebox-group .list-item:nth-child(5n-3) .address-profile {
    background-color: var(--color-ce50, #cdfcbf)
}

.list-linebox-group .list-item:nth-child(5n-2) .address-profile {
    background-color: var(--color-re50, #ffebe7)
}

.list-linebox-group .list-item:nth-child(5n-1) .address-profile {
    background-color: var(--color-sf50, #cef7f3)
}

.list-linebox-group .list-item:nth-child(5n) .address-profile {
    background-color: var(--color-pb10, #00000019)
}

.list-linebox-group .list-item .address-profile {
    width: 3.4rem;
    height: 3.4rem;
    line-height: 3.4rem;
    border-radius: 50%;
    text-align: center
}

:root .list-linebox-group .tit-list+.tooltip-group .ico-help {
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

.list-linebox-group .tit-list .btn-edit {
    margin-left: 0.8rem
}

.list-linebox-group .txt-state {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400;
    color: var(--color-g700, #7d7d7d)
}

.list-linebox-group .txt-state.black {
    color: var(--color-g900, #141414)
}

.list-linebox-group .txt-state.on {
    color: var(--txt-accent-sec) !important
}

.list-linebox-group .txt-state+.btn-under-link {
    margin-left: 0.8rem
}

.list-linebox-group .txt-state+.btn-edit {
    margin-left: 0.8rem
}

.list-linebox-group .box-state .txt-state {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400;
    color: var(--color-g700, #7d7d7d)
}

.list-linebox-group .txt-amount {
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 400
}

.list-linebox-group .status {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400
}

.list-linebox-group .status.red {
    color: var(--color-re700, #f02727)
}

.list-linebox-group .status.blue {
    color: var(--color-bu800, #0150ff)
}

.list-linebox-group .tit-caption {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: bold;
    word-break: normal
}

.list-linebox-group .col-tit {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.list-linebox-group .col-tit .tit-caption {
    margin: -0.3rem 1.2rem 0 0;
    color: var(--color-bu800, #0150ff);
    font-size: 1.8rem
}

:root .list-linebox-group .col-tit .tit-caption {
    color: var(--txt-accent-sec, #4262ff)
}

.list-linebox-group .col-tit .col-area {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.list-linebox-group .col-tit .tag {
    position: relative;
    top: -1px
}

.list-linebox-group .col-caption {
    margin-right: 1.2rem;
    color: var(--color-bu800, #0150ff);
    font-weight: bold;
    font-size: 1.8rem
}

:root .list-linebox-group .col-caption {
    color: var(--txt-accent-sec, #4262ff)
}

.list-linebox-group .col-toggle {
    margin-bottom: -1rem
}

:root .list-linebox-group .list-item.a11y .col-state {
    position: absolute;
    right: 2rem;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

.list-linebox-group .col-state {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-left: 1rem
}

.list-linebox-group .col-state .txt-state {
    color: var(--txt-sec)
}

.list-linebox-group .col-state .txt-state+.ico-arrow-link {
    margin-left: 0.4rem;
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700);
    width: 1.6rem;
    height: 1.6rem
}

.list-linebox-group .col-state .ico-arrow-link {
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700);
    width: 1.6rem;
    height: 1.6rem
}

.list-linebox-group .col-state .ico-arrow-open {
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

:root .list-linebox-group .col-state .ico-arrow-link {
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

:root .list-linebox-group .col-state .ico-arrow-open {
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

.list-linebox-group .col-state.col {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end
}

.list-linebox-group .col-state [class^="btn-lv"].gray-line .txt {
    color: var(--indigo-in1100, #0114a7)
}

.list-linebox-group .box-state {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-top: 0.4rem
}

.list-linebox-group .box-state span {
    color: var(--color-g600, #9b9b9b)
}

.list-linebox-group .box-state span+span {
    position: relative;
    padding-left: 0.8rem;
    margin-left: 0.8rem
}

.list-linebox-group .box-state span+span:before {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    top: 0.4rem;
    width: 0.1rem;
    height: 1.2rem;
    background: var(--color-g300, #e0e0e0)
}

.list-linebox-group .section-head {
    color: var(--color-g600, #9b9b9b);
    background: var(--color-g100, #f8f8f8);
    padding: 2.6rem 2rem 0.9rem
}

.list-linebox-group .section-head.type2 {
    background-color: var(--color-w100, #fff);
    padding: 3.2rem 0 1.6rem
}

.list-linebox-group .section-head.type2 .tit-head {
    font-size: 1.8rem;
    font-weight: 700;
    color: var(--color-g900, #141414);
    line-height: 2.5rem
}

.list-linebox-group .section-head.type2+.list-row .list-item {
    border-bottom: none
}

.list-linebox-group .section-head.type3 {
    background-color: var(--color-w100);
    padding: 2.8rem 2rem 0.8rem
}

.list-linebox-group .section-head.type3 .tit-head {
    color: var(--txt-ter)
}

.list-linebox-group .section-head.type4 {
    color: var(--txt-ter);
    padding: .8rem 2rem
}

.list-linebox-group .section-head.type4 .tit-head {
    font-size: 1.2rem;
    font-weight: 500;
    color: var(--txt-qua)
}

.list-linebox-group .section-head.no-space {
    padding-left: 0;
    padding-right: 0
}

.list-linebox-group .col-list-tit {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.list-linebox-group .col-list-tit .tit-area {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.list-linebox-group .col-list-tit .tit-list {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: bold
}

.list-linebox-group .col-list-tit .tit-txt {
    margin-top: 0.8rem;
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g700, #7d7d7d)
}

.list-linebox-group .list-item-infobox {
    padding: 2rem 0
}

.list-linebox-group .list-item-infobox .list-item-row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g900, #141414)
}

.list-linebox-group .list-item-infobox .list-item-row.sub {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400
}

.list-linebox-group .list-item-infobox .list-item-row.sub .col-tit {
    color: var(--color-g700, #7d7d7d)
}

.list-linebox-group .list-item-infobox .list-item-row+.list-item-row {
    margin-top: 1.2rem
}

.list-linebox-group .list-item-infobox .list-item-row.sub+.list-item-row.sub {
    margin-top: 0.8rem
}

.list-linebox-group.insurance {
    margin-top: 0.8rem
}

.list-linebox-group.insurance .section-link,
.list-linebox-group.moneytalk .section-link {
    padding: 2rem 0;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.list-linebox-group.insurance .rec-item-img {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    padding-right: 1rem
}

.list-linebox-group.insurance .col-amount {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    text-align: right
}

.list-linebox-group.insurance .col-amount .txt-amount {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400;
    margin-top: 0.4rem
}

.list-linebox-group.insurance .col-amount .txt-add {
    font-size: 1.2rem;
    line-height: 1.6rem;
    font-weight: 400;
    color: var(--color-g700, #7d7d7d)
}

.list-linebox-group.insurance .col-tit {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 100%;
    flex: 1 1 100%
}

.list-linebox-group.insurance .col-tit .title-field-01 {
    font-size: 1.8rem;
    line-height: 2.7rem;
    font-weight: bold
}

.list-linebox-group+.txt-add-group {
    margin-top: 1.6rem;
    padding: 0 2.0rem
}

.list-linebox-group+.txt-add-group .txt-lv03 {
    color: var(--color-g600, #9b9b9b)
}

.list-linebox-group+.txt-add-group .txt-lv03+.txt-lv03 {
    margin-top: 0.4rem
}

.list-linebox-group.moneytalk .list-item:last-child,
.list-linebox-group.moneytalk .list-item:only-child {
    border-bottom: none
}

.list-linebox-group.moneytalk .txt-tag {
    font-size: 1.4rem;
    line-height: 2rem
}

.list-linebox-group.moneytalk .box-title>span {
    display: block;
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: 700
}

.list-row.list-utype-01 .list-item .section-link {
    padding: 3.2rem 2.0rem
}

.list-row.list-utype-01 .list-item .tit-area .box-state {
    margin: 0
}

.list-linebox-group.shadow {
    background: transparent
}

.list-linebox-group.shadow .list-item {
    border-radius: 1rem;
    overflow: hidden;
    -webkit-box-shadow: 0 2px 6px 0 var(--color-pb5, #0000000C);
    box-shadow: 0 2px 6px 0 var(--color-pb5, #0000000C);
    border: none
}

.list-linebox-group.shadow .list-item+.list-item {
    margin-top: 1.6rem
}

.list-linebox-group.shadow .list-item .txt {
    font-size: 1.4rem;
    color: var(--color-g700, #7d7d7d)
}

.list-linebox-group.shadow .tit-list {
    color: var(--color-g900, #141414);
    line-height: 2rem
}

.list-linebox-group.shadow .section-link {
    padding: 2rem 1.6rem 2rem 2rem;
    background: var(--color-w100, #fff)
}

.list-linebox-group.shadow .accordion-cont {
    padding: 2rem;
    background: var(--color-w100, #fff);
    border-top: 1px solid var(--color-g200, #eee)
}

.list-linebox-group.notice,
.list-linebox-group.notice .accordion-cont {
    background: transparent
}

.list-linebox-group.notice .list-item {
    border-bottom: none
}

:root .list-linebox-group.notice .list-item {
    border-bottom: none
}

.list-linebox-group.notice .section-link {
    border-bottom: 1px solid var(--color-g300, #e0e0e0)
}

.list-linebox-group.notice .accordion-cont .byul-txt {
    padding-left: 1.2rem;
    text-indent: -1.2rem
}

.list-linebox-group.info-list .list-item {
    padding: 1.6rem 0
}

.popup-inner .list-linebox-group.info-list .list-item:first-child {
    padding-top: 0
}

.list-linebox-group.info-list .col-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.list-linebox-group.no-space .list-item>.section-link,
.list-linebox-group.no-space .section-link {
    padding-left: 0;
    padding-right: 0
}

.list-linebox-group .col-tit .box-row-state {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.list-linebox-group .col-tit .box-row-state .ico-area+.tit-area,
.list-linebox-group .col-tit .box-row-state .logo-area+.tit-area {
    text-align: left;
    margin-left: 1.2rem
}

.list-linebox-group .col-tit .box-row-state .logo-area+.tit-area .ico-arrow-link {
    margin-top: -0.2rem
}

.list-linebox-group.wide .col-tit .box-row-state .ico-area+.tit-area,
.list-linebox-group.wide .col-tit .box-row-state .logo-area+.tit-area {
    margin-left: 1.6rem
}

.list-linebox-group.ty01 {
    padding-bottom: 7.2rem
}

.list-linebox-group.ty01 .list-item {
    border-bottom: 1px solid var(--color-g100, #f8f8f8)
}

.list-linebox-group.ty01 .list-item:last-child {
    border-bottom: 0
}

.list-linebox-group.ty01 .col-tit .box-row-state .logo-area+.tit-area {
    margin-left: 1.6rem
}

.list-linebox-group.ty01 .section-link {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding-top: 3.2rem;
    padding-bottom: 3.2rem;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.list-linebox-group.ty01 .ell01 {
    display: -webkit-box;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1
}

.list-linebox-group.ty01 .ell02 {
    display: -webkit-box;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2
}

.list-linebox-group.ty01 .tit-list {
    max-height: 2.5rem;
    font-size: 1.8rem;
    line-height: 2.5rem
}

.list-linebox-group.ty01 .box-state {
    margin-top: .6rem
}

.list-linebox-group.ty01 .box-state .txt-state {
    max-height: 2rem;
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 500;
    color: var(--color-g900, #141414)
}

.list-linebox-group.ty01 .col-btn {
    width: calc(100% - 5.6rem);
    margin-left: 5.6rem;
    margin-top: 1.6rem
}

.list-linebox-group.ty01 .col-btn .btn-lv02 {
    width: 100%
}

.list-linebox-group.ty01 .col-txt {
    width: calc(100% - 5.6rem);
    margin-left: 5.6rem;
    margin-top: 1.6rem
}

.list-linebox-group.ty01 .col-txt .txt {
    max-height: 3.2rem;
    font-size: 1.2rem;
    line-height: 1.6rem;
    color: var(--color-g600, #9b9b9b)
}

.list-linebox-group.type-logo {
    margin-left: 1.6rem;
    margin-bottom: 1.6rem
}

.list-linebox-group.type-logo .list-item {
    padding: 0.8rem 2.4rem;
    border: none;
    border-left: 0.2rem solid var(--border-quin) !important
}

.list-linebox-group.type-logo .list-item:first-child {
    margin-top: 1.2rem
}

.list-linebox-group.type-logo .list-item+.list-item {
    margin-top: 2rem
}

.list-linebox-group.type-logo .list-item .tit-list {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--txt-sec)
}

.list-linebox-group.type-logo .list-item .txt-state {
    color: var(--txt-sec)
}

.list-linebox-group.type-logo .list-item .logo-area {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 1.2rem;
    margin-top: 1.6rem
}

.list-linebox-group.type-logo .list-item .logo-area img {
    height: 4.4rem
}

.list-linebox-group.type-text {
    margin-left: 1.6rem;
    margin-bottom: 1.6rem
}

.list-linebox-group.type-text .list-item {
    padding: 0.4rem 2.4rem;
    border: none;
    border-left: 0.2rem solid var(--border-quin) !important
}

.list-linebox-group.type-text .list-item+.list-item {
    padding-top: 1.6rem
}

.list-linebox-group.type-text .list-item .tit-list {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--txt-sec)
}

.list-linebox-group.type-text .list-item .txt-state {
    color: var(--txt-sec)
}

.list-linebox-group-type2 .list-item {
    border-radius: 1.2rem;
    border: 1px solid #e0e6f1
}

.list-linebox-group-type2 .section-link {
    padding: .8rem 2rem
}

.list-linebox-group-type2 .ico-tap-type2 {
    width: 1.8rem;
    height: 1.8rem;
    background-image: var(--path-line-drag-handle)
}

.list-linebox-group-disabled .list-item {
    border: 1px solid #e0e6f1;
    background: #edf1f7
}

.list-linebox-group-disabled .logo-area {
    opacity: .3
}

.list-linebox-group-disabled .tit-list {
    color: #c8d3e4
}

.list-linebox-group-disabled .ico-tap {
    -webkit-filter: brightness(0) saturate(100%) invert(90%) sepia(6%) saturate(899%) hue-rotate(186deg) brightness(95%) contrast(88%);
    filter: brightness(0) saturate(100%) invert(90%) sepia(6%) saturate(899%) hue-rotate(186deg) brightness(95%) contrast(88%)
}

.list-linebox-group.no-space .section-link-type2 {
    padding: .8rem 0;
    height: 7.8rem
}

.component-list.fixed {
    position: -webkit-sticky;
    position: sticky;
    top: 5rem;
    left: 0;
    width: 100%;
    background-color: var(--color-w100, #fff);
    z-index: 79
}

.list-row.jui-sortable .btn-drag {
    display: block;
    width: 3.6rem;
    height: 3.6rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.list-row.jui-sortable .btn-drag .ico-drag-handle {
    width: 2rem;
    height: 2rem
}

/*!
* component element
* list
* 오늘의 생활시세
*/

.list-linebox-group.fullline {
    margin: 0 -2rem
}

.list-linebox-group.fullline .section-link {
    padding: 1.6rem 2rem
}

.list-linebox-group.fullline .box-state {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.list-linebox-group.fullline .box-state span+span {
    padding-left: 0
}

.list-linebox-group.fullline .box-state span+span:before {
    display: none
}

.list-linebox-group.fullline .box-state span+span [class^="ico-triangle"] {
    width: 1.2rem;
    height: 1.2rem
}

.list-linebox-group.fullline .col-tit {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.list-linebox-group.fullline .col-tit.oil {
    min-width: 0
}

.list-linebox-group.fullline .col-tit.oil .tit-area {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    min-width: 0
}

.list-linebox-group.fullline .col-tit.oil .tit-area .box-txt-oil {
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap
}

.list-linebox-group.fullline .col-tit .tit-area .box-txt {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.list-linebox-group.fullline .col-tit .tit-area .box-txt>[class^="txt-"] {
    margin-right: 0.4rem;
    line-height: 2rem
}

.list-linebox-group.fullline .col-tit .tit-area .box-txt .tag {
    margin-left: 0.4rem
}

.list-linebox-group.fullline .col-tit .cont-area {
    margin-right: 1.2rem
}

.list-linebox-group.fullline .col-tit .cont-area [class^="ico-"] {
    width: 3.4rem;
    height: 3.4rem;
    border-radius: 99rem;
    background-color: var(--color-g100, #f8f8f8)
}

.list-linebox-group.fullline .col-tit .cont-area [class^="ico-"].w44 {
    width: 4.4rem;
    height: 4.4rem
}

.list-linebox-group.fullline.noline .list-item {
    border-top: none
}

.list-linebox-group.fullline.bg-gray .list-item:last-child {
    border-bottom: 0
}

/*!
* component element
* list
* deal type
*/

.list-deal-group {
    padding: 0
}

.list-deal-group.noline .list-item {
    border-bottom: 0
}

.list-deal-group .list-item {
    border-bottom: 1px solid var(--border-qua)
}

.list-deal-group .section-tap {
    display: block;
    width: 100%;
    text-align: left;
    padding: 2rem 2rem
}

.list-deal-group [class^="row-"] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.list-deal-group .row-date {
    margin-bottom: 0.8rem
}

.list-deal-group .row-date .txt-date {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g600, #9b9b9b)
}

.list-deal-group .row-head {
    margin-bottom: 1.2rem
}

.list-deal-group .row-head>span {
    color: var(--color-g500, #b8b8b8)
}

.list-deal-group .row-tit {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.list-deal-group .row-state {
    margin-top: 0.4rem
}

.list-deal-group .row-state .txt-sum {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    text-align: right;
    margin-left: 0.4rem;
    white-space: nowrap;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.list-deal-group .area-date {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.list-deal-group .area-date span {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400
}

.list-deal-group .area-date span+span {
    position: relative;
    margin-left: 0.8rem;
    padding-left: 0.8rem
}

.list-deal-group .area-date span+span:before {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 0.1rem;
    height: 1rem;
    background: var(--border-ter)
}

.list-deal-group .area-date .txt-time {
    color: var(--color-g700, #7d7d7d)
}

.list-deal-group .area-date+.area-info {
    margin-left: 0.6rem;
    margin-right: auto
}

.list-deal-group .row-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.list-deal-group .row-wrap .row-tit {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.list-deal-group .row-wrap .row-tit .area-ico {
    margin-right: 1.2rem
}

.list-deal-group .row-wrap .row-state {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    text-align: right
}

.list-deal-group .row-wrap .row-state .txt-amount+.txt-sum {
    margin-top: 0.4rem
}

.list-deal-group .txt-detail {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 500;
    max-width: 100%;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap
}

.list-deal-group .txt-amount {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: bold;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    margin-left: 0.4rem
}

.list-deal-group .txt-amount-small {
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--color-g700, #7d7d7d);
    margin-top: 0.4rem
}

.list-deal-group .txt-amount strong {
    font-size: 2.1rem;
    line-height: 2.7rem;
    font-weight: bold
}

.list-deal-group .txt-amount strong+strong {
    margin-left: -0.2rem
}

.list-deal-group .txt-amount em {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: bold;
    margin-right: 0.2rem
}

.list-deal-group .txt-amount.secondary1-1 {
    color: var(--color-bu800, #0150ff)
}

.list-deal-group .txt-amount.fail {
    color: var(--color-re700, #f02727);
    position: relative
}

.list-deal-group .txt-amount.fail:after {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    height: 0.2rem;
    background-color: var(--color-re700, #f02727)
}

.list-deal-group .txt-memo {
    width: 100%;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g700, #7d7d7d)
}

.list-deal-group .txt-memo.max-char20 {
    max-width: 25rem
}

.list-deal-group .txt-memo .txt+.txt:before {
    content: '';
    display: inline-block;
    width: 0.1rem;
    height: 1rem;
    background: var(--color-g300, #e0e0e0);
    margin: 0 0.8rem 0 0.5rem
}

.list-deal-group .txt-sum {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g700, #7d7d7d)
}

.list-deal-group .txt-sum.darkgray2 {
    color: var(--color-g700, #7d7d7d)
}

.list-deal-group .txt-sum em {
    margin-left: 0.4rem
}

.list-deal-group.box .list-item {
    border: 1px solid var(--color-g200, #eee);
    border-radius: 1rem
}

.list-deal-group .list-top-sort {
    padding: 0 2rem;
    font-size: 1.5rem;
    line-height: 2rem;
    color: var(--color-g700, #7d7d7d)
}

.list-deal-group .list-row+.list-top-sort {
    margin-top: 1.2rem
}

.list-deal-head {
    padding: 2.4rem 2rem 1.2rem
}

.list-deal-head .tit-head {
    font-size: 1.4rem;
    color: var(--color-g700, #7d7d7d)
}

.card-list-tap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.list-deal-group.type2 .txt-detail .transport {
    margin-bottom: 0.4rem
}

.list-deal-group.type2 .txt-detail+.tag {
    margin-left: 0.4rem
}

.list-deal-group.type2 .section-tap {
    padding-left: 5.6rem;
    position: relative
}

.list-deal-group.type2.no-space .section-tap {
    padding: 2rem 0 2rem 3.6rem
}

.list-deal-group.type2 .no-ico .section-tap {
    padding-left: 2rem
}

.list-deal-group.type2.no-space .no-ico .section-tap {
    padding: 2rem 0
}

.list-deal-group.type2.no-space .no-ico .section-tap.pd16 {
    padding: 1.6rem 0
}

.list-deal-group.type2 .section-tap .row-head {
    position: absolute;
    left: 2rem;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

.list-deal-group.type2.no-space .section-tap .row-head {
    left: 0
}

.list-deal-group.type2 .txt-amount {
    text-align: right;
    margin-left: 1.6rem;
    -webkit-box-flex: 1;
    -ms-flex: 1 0 auto;
    flex: 1 0 auto
}

.list-deal-group.type2 .txt-amount.fail:after {
    display: none
}

.list-deal-group.type2 .txt-amount.fail strong:after {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    height: 0.2rem;
    background-color: var(--color-re700, #f02727)
}

.list-deal-group.type2 .txt-amount strong {
    font-size: 1.6rem;
    position: relative
}

.list-deal-group.type2 .txt-amount.d-flex-dr-c .txt-sum {
    margin-top: 0.4rem
}

.list-deal-group.type2 .txt-memo .txt {
    color: var(--color-g700, #7d7d7d)
}

.list-deal-group.type2 .txt-sum {
    color: var(--color-g700, #7d7d7d)
}

.list-deal-group.type2 .row-tit.ty01 {
    min-height: 4.35rem
}

.list-deal-group.type2 .row-tit.ty01 .txt-detail .transport {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 0;
    font-weight: 500
}

.list-deal-group.type2 .row-tit.ty01 .txt-detail .transport .tag {
    margin-left: .4rem
}

.list-deal-group.type2 .row-tit.ty01 .txt-detail .transport+.txt-memo {
    margin-top: 0.4rem
}

.list-deal-group.type2.no-line .list-item {
    border-bottom: 0
}

.card-list-stit {
    padding: 2.4rem 2rem 1.2rem;
    font-size: 1.6rem;
    color: var(--color-g700, #7d7d7d)
}

.list-deal-group.no-space .section-tap {
    padding: 2rem 0
}

.list-deal-group.last-noline .list-item:last-child {
    border-bottom: none
}

.list-deal-group.last-noline .list-row+.btn-group .btn-view-more {
    border-top: 1px solid var(--color-g200, #eee)
}

.list-deal-head.loan-head-type {
    padding: 2.8rem 0 0.9rem
}

.list-deal-head.loan-head-type .tit-head {
    font-size: 1.4rem;
    color: var(--txt-quin);
    font-weight: 700
}

.list-deal-group.noline-type03 .list-item:last-child {
    border-bottom: 0
}

.list-deal-group.type3 .section-tap {
    position: relative
}

.list-deal-group.type3 .row-check {
    position: absolute;
    left: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

.list-deal-group.type3 .row-head,
.list-deal-group.type3 .row-state,
.list-deal-group.type3 .row-tit {
    padding-left: 3.4rem
}

.list-deal-group.type3.money-return .section-tap:has(input:disabled) span {
    color: var(--txt-disabled)
}

.list-deal-group.type4 .txt-memo {
    max-width: 70%;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap
}

.list-deal-group.type4 .txt-sum.cancel {
    position: relative;
    -webkit-box-flex: inherit;
    -ms-flex: inherit;
    flex: inherit
}

.list-deal-group.type4 .txt-sum.cancel::after {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    height: 0.1rem;
    background-color: var(--color-g700)
}

.list-deal-group.type4 .txt-point {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-weight: 700
}

.list-deal-group.type4 .txt-point em {
    font-weight: 700
}

.list-deal-group.type4 .txt-point .ico-money-point {
    margin-right: 0.2rem
}

.list-deal-group.type4 .txt-point .tag {
    margin-left: 0.4rem;
    border-radius: 0.6rem;
    padding: 0.1rem 0.6rem 0;
    margin-top: -0.2rem
}

.list-deal-group.type4 .txt-point .tag .txt {
    font-size: 1.2rem;
    font-weight: 700
}

.list-deal-group.type4 .txt-point.fail {
    color: var(--color-re700)
}

.list-deal-group.type4 .txt-point.success {
    color: var(--color-bu900) !important
}

.list-deal-group.type4 .list-item:last-child {
    border-bottom: none
}

.list-deal-group.type4 .list-item.cancel .row-tit,
.list-deal-group.type4 .list-item.cancel .txt-memo {
    color: var(--color-g500)
}

.list-deal-group.type5 .txt-memo .txt {
    width: 100%;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden
}

.list-deal-group.type5 .row-state .txt-sum {
    margin-left: 0.4rem;
    min-width: 14.1rem;
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none
}

/*!
* component element
* list
* deal type > transfer-result
*/

.transfer-result-group .list-item:only-child {
    border-bottom: 0
}

.transfer-result-group .list-item:only-child:after {
    content: '';
    display: block;
    width: 100%;
    height: 0.8rem;
    background-color: var(--color-g100, #f8f8f8);
    border-top: 1px solid var(--color-g200, #eee)
}

.list-deal-group.transfer-result-group .txt-detail {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

/*!
* component element
* list
* toggle type
*/

.list-toggle-group .list-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 2rem;
    border-bottom: 1px solid var(--color-g300, #e0e0e0)
}

:root .list-toggle-group .list-item {
    padding: 1.6rem 2rem
}

.list-toggle-group.no-indent .list-item {
    padding: 1.6rem 0
}

.list-toggle-group .list-item .col-toggle {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.list-toggle-group .list-item .col-toggle .txt-lv03+.tooltip-group {
    margin: -0.1rem 0 0 0.4rem
}

.list-toggle-group .tit-toggle {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 500
}

:root .list-toggle-group .tit-toggle {
    color: var(--txt-pri)
}

.list-toggle-group .tit-toggle+.txt-toggle {
    margin-top: 0.4rem
}

.list-toggle-group .tit-toggle+.input-checkbox-group {
    margin-top: 0.8rem
}

.list-toggle-group .txt-toggle {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g700, #7d7d7d)
}

.list-toggle-group .txt-toggle+.input-checkbox-group {
    margin-top: 0.8rem
}

.popup-dialog.ui-bottom .popup-inner .list-toggle-group .list-item {
    padding: 0 0 2.4rem;
    border: 0
}

.popup-dialog.ui-bottom .popup-inner .list-toggle-group .tit-toggle {
    font-weight: 400
}

.popup-dialog.ui-bottom .popup-inner .list-toggle-group .tit-toggle.disabled {
    color: var(--color-g500, #b8b8b8)
}

.list-toggle-group.noline .list-item {
    padding: 1.6rem 0;
    border-bottom: 0
}

.list-toggle-group .txt-toggle.d-day {
    color: var(--txt-quin)
}

.list-toggle-group .txt-toggle.d-day .tit {
    font-size: 1.6rem;
    font-weight: 500;
    line-height: 2rem
}

.list-toggle-group .txt-toggle.d-day .txt {
    margin-top: .4rem;
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 2rem
}

/*!
* component element
* list
* 국가목록
*/

.nation-list-group .btn-option {
    display: block;
    width: 100%;
    text-align: left;
    padding: 1.3rem 0;
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 500
}

/*!
* component element
* list
* 주소검색
*/

.addr-list-group .addr-item {
    border-bottom: 1px solid var(--color-g200, #eee)
}

.addr-list-group .btn-option {
    display: block;
    width: 100%;
    text-align: left;
    padding: 1.3rem 0;
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g900, #141414)
}

.addr-list-group .addr-num {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: bold
}

:root .addr-list-group .addr-num {
    font-weight: 500
}

.addr-list-group .addr-num+.addr-01 {
    margin-top: 0.4rem
}

.addr-list-group .addr-01 {
    margin-top: 0.4rem
}

.addr-list-group .addr-02 {
    color: var(--color-g600, #9b9b9b);
    margin-top: 0.4rem
}

.addr-list-group .secondary1-1 {
    color: var(--color-bu800, #0150ff)
}

.addr-list-group .point01 {
    font-weight: bold;
    color: var(--color-bu800, #0150ff)
}

.addr-list-group.nospace {
    margin: 0 0 2rem
}

.addr-list-group.nospace .addr-item {
    border-bottom: none
}

.addr-list-group.noline .addr-item {
    border: none
}

.addr-list-group.border-qua .addr-item {
    border-color: var(--border-qua)
}

.addr-list-group .addr-list.pd20 .addr-item {
    padding: 0 2rem
}

/*!
* component element
* list
* checkbox type
*/

.list-checkbox-group .list-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 2rem 2rem;
    border-bottom: 1px solid var(--color-g300, #e0e0e0)
}

.list-checkbox-group .col-check {
    margin-right: 1.2rem
}

.list-checkbox-group .data-info .tit {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g700, #7d7d7d)
}

.list-checkbox-group .data-info .txt {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400;
    color: var(--color-g900, #141414)
}

/*!
* component element
* list
* checkbox type
* 공과금 - 자주쓰는 지로번호 관리
*/

.col-check,
.row-check {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative;
    width: 2.4rem;
    height: 2.4rem;
    margin-right: 0.8rem
}

.col-check .ico-star-gray,
.row-check .ico-star-gray {
    width: 2rem;
    height: 2rem;
    background-image: var(--path-solid-star);
    -webkit-filter: var(--filter-g300);
    filter: var(--filter-g300)
}

.col-check input,
.row-check input {
    padding: 0;
    position: absolute;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    opacity: 0;
    width: 100%;
    height: 100%;
    z-index: 1
}

.col-check input:checked+.ico-star-gray,
.row-check input:checked+.ico-star-gray {
    -webkit-filter: var(--filter-lm100);
    filter: var(--filter-lm100)
}

:root .col-check .ico-star-gray,
:root .row-check .ico-star-gray {
    background-image: var(--path-checkbox-star);
    -webkit-filter: unset;
    filter: unset
}

:root .col-check input:checked+.ico-star-gray,
:root .row-check input:checked+.ico-star-gray {
    background-image: var(--path-checkbox-star-active)
}

/*!
* component element
* list
* radio type
* FETASK-1412 미성년자 계좌개설 > 서브 홈
*/

.list-radio-group .list-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 2rem 0;
    border-bottom: 1px solid var(--color-g300, #e0e0e0)
}

.list-radio-group .col-check {
    margin-right: 1.2rem
}

.list-radio-group .data-info .tit {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 700;
    color: var(--color-g900, #141414)
}

.list-radio-group .data-info .txt {
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g700, #7d7d7d);
    margin-top: 0.4rem
}

/*!
* component element
* list
* radio type
* CHPFMTASK-1370 PBKINQ0313000000S_M03
*/

.list-radio-group.type02 .list-item {
    border-bottom: 0;
    padding: 1.6rem 0
}

.list-radio-group.type02 .list-item:first-child {
    padding-top: 0
}

.list-radio-group.type02 .tit {
    font-weight: 500
}

/*!
* component element
* list
* 제휴고객사 목록
*/

.corp-list-gorup {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: left;
    -ms-flex-pack: left;
    justify-content: left;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.corp-list-gorup .corp-item {
    width: 50%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 1.2rem 0
}

.corp-list-gorup .corp-item [class*="logo-"] {
    margin-right: 0.8rem
}

.corp-list-gorup .corp-item .txt {
    color: var(--color-g800, #414141)
}

/*!
* component element
* list
* 이체하기 - 계좌리스트
*/

.rec-list-group+.rec-list-group {
    margin-top: 3.6rem
}

.rec-list-group .rec-list-title {
    position: -webkit-sticky;
    position: sticky;
    background: var(--color-w100, #fff);
    z-index: 2;
    margin: 0 -2rem;
    padding: 0 2rem 1rem
}

/*! top 값은 스크립트로 계산 */

.rec-list-group .rec-list-title .title-txt {
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g700, #7d7d7d)
}

.rec-list-group .rec-list {
    width: 100%
}

.rec-list-group .rec-list-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
    padding: 1.6rem 0;
    border-bottom: 1px solid var(--color-g200, #eee)
}

.rec-list-group .rec-list-item:nth-child(5n-4) .address-profile {
    background-color: var(--color-in50, #efefff)
}

.rec-list-group .rec-list-item:nth-child(5n-3) .address-profile {
    background-color: var(--color-ce50, #cdfcbf)
}

.rec-list-group .rec-list-item:nth-child(5n-2) .address-profile {
    background-color: var(--color-re50, #ffebe7)
}

.rec-list-group .rec-list-item:nth-child(5n-1) .address-profile {
    background-color: var(--color-sf50, #cef7f3)
}

.rec-list-group .rec-list-item:nth-child(5n) .address-profile {
    background-color: var(--color-pb10, #00000019)
}

.rec-list-group.noline .rec-list-item {
    border-bottom: 0
}

.rec-list-group .rec-item-img {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    padding-right: 1rem
}

.rec-list-group .address-profile {
    width: 3.4rem;
    height: 3.4rem;
    line-height: 3.4rem;
    border-radius: 50%;
    text-align: center
}

.rec-list-group .rec-item-txt {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 100%;
    flex: 1 1 100%
}

.rec-list-group .rec-item-img [class*="logo-bank"] {
    vertical-align: middle
}

.rec-list-group .rec-item-txt .txt01 {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400;
    color: var(--color-g900, #141414)
}

.rec-list-group .rec-item-img+.rec-item-txt>.txt01 {
    font-weight: 500
}

.rec-list-group .rec-item-txt .txt01+.txt02 {
    margin-top: 0.45rem
}

.rec-list-group .rec-item-txt .txt02 {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g600, #9b9b9b)
}

.rec-list-group .rec-item-bu {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto
}

.rec-list-group .rec-item-bu .txt01 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    font-size: 1.6rem;
    font-weight: 500;
    line-height: 2rem;
    color: var(--color-g900, #141414);
    text-align: right
}

.rec-list-group .rec-item-bu .txt02 {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 700;
    color: var(--txt-ter);
    text-align: right;
    margin-top: 0.45rem
}

.rec-list-group .rec-join-openbank {
    margin-top: 3.6rem;
    width: 100%;
    text-align: center
}

.rec-list-group .rec-join-openbank .openbank-txt {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400;
    color: var(--color-g600, #9b9b9b)
}

.rec-list-group .rec-join-openbank .openbank-txt+.openbank-link {
    margin-top: 1.6rem
}

.rec-list-group .rec-join-openbank .openbank-link {
    display: inline-block;
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g900, #141414);
    border-bottom: 1px solid var(--color-g900, #141414)
}

.rec-list-group .rec-list-btn {
    width: 100%
}

/*! 리스트삭제 기능 */

.rec-list-group .rec-list.ui-deleteList {
    width: auto;
    margin: 0 -2rem;
    overflow: hidden
}

.rec-list-group .rec-list.ui-deleteList .rec-list-item {
    position: relative;
    border-bottom: 0;
    padding: 0
}

.rec-list-group .rec-list.ui-deleteList .rec-list-item .rec-list-box {
    position: relative;
    z-index: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 0 0 0 2rem;
    padding: 1.6rem 0;
    width: 100%;
    border: 0;
    background: var(--color-w100, #fff)
}

.rec-list-group .rec-list.ui-deleteList .rec-list-item .rec-list-box:after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: calc(100% - 2rem);
    height: 1px;
    background: var(--color-g200, #eee);
    -webkit-transition: width 0.3s;
    -o-transition: width 0.3s;
    transition: width 0.3s
}

.rec-list-group .rec-list.ui-deleteList .rec-list-item .rec-list-box.active:after {
    width: 100%
}

.rec-list-group .rec-list.ui-deleteList .rec-list-item .rec-list-box.moved:after {
    width: 100%
}

.rec-list-group .rec-list.ui-deleteList .rec-list-item .rec-list-del {
    position: absolute;
    top: 0;
    right: 0;
    width: 8rem;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    background: var(--color-re700, #f02727);
    color: var(--color-w100, #fff)
}

.rec-list-group .rec-list.ui-deleteList .rec-item-bu {
    position: relative;
    right: 2rem
}

.rec-list-group .rec-list-item.call .rec-list-box {
    -webkit-animation: demoshow 0.9s ease;
    animation: demoshow 0.9s ease;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s
}

@-webkit-keyframes demoshow {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    40% {
        -webkit-transform: translateX(-80px);
        transform: translateX(-80px)
    }
    80% {
        -webkit-transform: translateX(-80px);
        transform: translateX(-80px)
    }
    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}

@keyframes demoshow {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    40% {
        -webkit-transform: translateX(-80px);
        transform: translateX(-80px)
    }
    80% {
        -webkit-transform: translateX(-80px);
        transform: translateX(-80px)
    }
    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}

.rec-list-group.ty01 {
    padding-bottom: 1.2rem
}

.rec-list-group.ty01+.rec-list-group.ty01 {
    margin-top: 0
}

.rec-list-group.ty01 .rec-list-item {
    padding: 2.4rem 0;
    border-bottom: 0
}

.rec-list-group.ty01 .rec-list-item>a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%
}

.rec-list-group.ty01 .rex-num {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: 2.2rem;
    font-size: 1.6rem;
    color: var(--txt-quin);
    font-weight: 700
}

.rec-list-group.ty01 .rec-item-img {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding-right: 1.2rem
}

.rec-list-group.ty01 .item-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto
}

.rec-list-group.ty01 .rec-item-img~.item-wrap {
    max-width: calc(100% - 4.6rem)
}

.rec-list-group.ty01 .rex-num~.item-wrap {
    max-width: calc(100% - 6.8rem)
}

.rec-list-group.ty01 .rec-item-txt {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.rec-list-group.ty01 .rec-item-txt [class*="txt"] {
    margin-top: 0;
    font-size: 1.6rem;
    line-height: 2.1rem;
    color: var(--txt-sec)
}

.rec-list-group.ty01 .rec-item-txt .txt01 {
    overflow: hidden;
    height: 2.1rem;
    white-space: nowrap;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    font-weight: 500
}

.rec-list-group.ty01 .rec-item-txt .txt02 {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    font-weight: bold;
    text-align: right
}

.rec-list-group.ty01 .rec-item-txt .inner-txt01 {
    font-size: 1.6rem;
    line-height: 2.1rem;
    color: var(--txt-ter);
    font-weight: 500
}

.rec-list-group.ty01 .rec-item-txt .inner-txt02 {
    margin-top: .4rem;
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--txt-quin);
    font-weight: 400
}

.rec-list-group.ty01 .rec-item-txt .empty-ty {
    position: relative;
    min-width: 1rem
}

.rec-list-group.ty01 .rec-item-txt .empty-ty span {
    position: absolute;
    top: .3rem;
    right: 0;
    color: var(--txt-quin)
}

.rec-list-group.ty01 .rec-item-bu {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-top: .4rem
}

.rec-list-group.ty01 .rec-item-bu [class*="txt"] {
    margin-top: 0;
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--txt-quin);
    font-weight: 400
}

.rec-list-group.ty01 [class*="txt"].down-color {
    color: var(--txt-pri-down) !important
}

.rec-list-group.ty01 [class*="txt"].up-color {
    color: var(--txt-pri-up) !important
}

.rec-list-group.ty01 [class*="txt"].up-color .ico-triangle-up-sample01 {
    width: 1.2rem;
    height: 1.2rem;
    -webkit-filter: var(--filter-re700);
    filter: var(--filter-re700)
}

.rec-list-group.ty01 [class*="txt"].down-color .ico-triangle-down-sample01 {
    width: 1.2rem;
    height: 1.2rem;
    -webkit-filter: var(--filter-bu700);
    filter: var(--filter-bu700)
}

.rec-list-group.type1 .rec-item-img {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 4.4rem;
    height: 4.4rem;
    margin-right: 1.6rem;
    padding-right: 0;
    border-radius: 1.2rem;
    background-color: var(--bg-qua)
}

.rec-list-group.type1 .rec-item-txt .txt01 {
    line-height: 2rem
}

.rec-list-group.type1 .rec-item-txt .txt02 {
    margin-top: 0.2rem
}

.rec-list-group.type1 .rec-item-bu .btn-lv04 {
    width: 7.6rem;
    border-radius: 1.2rem
}

.rec-list-group.type1 .rec-list-item {
    padding: 2.4rem 0;
    border-bottom: 0
}

.rec-list-group.type1 .rec-list-item.finish .rec-item-img [class^="ico-mission-"] {
    background-position: 50% 100%
}

.rec-list-group.type1 .rec-list-item.finish .ico-check-line.bu700 {
    -webkit-filter: var(--filter-bu700) !important;
    filter: var(--filter-bu700) !important
}

.rec-list-group.type1 .rec-list-item.finish .btn-lv04 .txt,
.rec-list-group.type1 .rec-list-item.finish .rec-item-txt .txt01,
.rec-list-group.type1 .rec-list-item.finish .rec-item-txt .txt02 {
    color: var(--txt-readonly)
}

.tab-content-group .rec-list-group.ty01.invest-rec-list-group [class*="txt"].up-color .ico-triangle-up-sample01 {
    background: none;
    -webkit-filter: unset;
    filter: unset;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.tab-content-group .rec-list-group.ty01.invest-rec-list-group [class*="txt"].up-color .ico-triangle-up-sample01::before {
    content: '';
    display: inline-block;
    width: 1.2rem;
    height: 1.2rem;
    background: url("../../img/mmk/kds3_5/ico/solid/triangle_up_re.svg") no-repeat 0 0;
    background-size: 1.2rem
}

.tab-content-group .rec-list-group.ty01.invest-rec-list-group [class*="txt"].down-color .ico-triangle-down-sample01 {
    background: none;
    -webkit-filter: unset;
    filter: unset;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.tab-content-group .rec-list-group.ty01.invest-rec-list-group [class*="txt"].down-color .ico-triangle-down-sample01::before {
    content: '';
    display: inline-block;
    width: 1.2rem;
    height: 1.2rem;
    background: url("../../img/mmk/kds3_5/ico/solid/triangle_down_re.svg") no-repeat 0 0;
    background-size: 1.2rem
}

.rec-list-group.ty01 .rec-list-btn {
    border-top: 1px solid var(--border-qua)
}

.rec-list-group.ty01 .rec-list-btn .btn-view-more {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 2.8rem 0 1.6rem
}

.rec-list-group.ty01 .rec-list-btn .btn-view-more .txt {
    font-size: 1.5rem;
    line-height: 2rem
}

.rec-list-group.ty01 .rec-list-btn .btn-view-more .ico-arrow-link {
    margin-top: 0
}

.rec-list-group.ty01 .line-ty {
    padding: .4rem 2rem;
    border: 1px solid var(--border-quin);
    border-radius: 2rem
}

.rec-list-group.ty01 .line-ty .rec-list-item+.rec-list-item {
    border-top: 1px solid var(--border-qua)
}

.rec-list-group.ty01 .nodata-statement-group {
    height: 46.5rem
}

.rec-list-group.ty01.invest-rec-list-group .rec-item-txt {
    -webkit-column-gap: 1.6rem;
    -moz-column-gap: 1.6rem;
    column-gap: 1.6rem
}

.rec-list-group.ty01.invest-rec-list-group .rec-item-bu {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 100%;
    flex: 1 1 100%;
    -webkit-column-gap: .8rem;
    -moz-column-gap: .8rem;
    column-gap: .8rem
}

.rec-list-group.ty01.invest-rec-list-group .rec-item-bu .txt01 {
    overflow: hidden;
    height: 2rem;
    white-space: nowrap;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis
}

.rec-list-group.ty01.invest-rec-list-group .rec-item-bu .txt02 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.rec-list-group.ty02 .rec-list-item {
    border-bottom: 0;
    padding: 0
}

.rec-list-group.ty02 .rec-list-item+.rec-list-item {
    margin-top: 2.4rem
}

.rec-list-group.ty02 .rec-item-txt .txt01 {
    color: var(--txt-sec);
    font-weight: bold;
    margin-top: 0.2rem
}

.rec-list-group.ty02 .rec-item-txt .txt02 {
    color: var(--txt-qua)
}

.rec-list-group.ty03 .rec-list .rec-list-item {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.rec-list-group.ty03 .rec-list .rec-list-item .rec-item-txt {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.rec-list-group.ty03 .rec-item-img {
    padding-right: 1.2rem
}

.rec-list-group.ty03 .rec-item-txt .txt01+.txt02 {
    margin-top: .4rem;
    color: var(--txt-ter)
}

.rec-list-group.ty03 .rec-item-bu .txt01 {
    font-size: 1.6rem;
    font-weight: 400;
    line-height: 2rem;
    color: var(--txt-sec)
}

.rec-list-group.ty03 .rec-item-bu button {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.rec-list-group.ty03 .rec-item-bu button .txt {
    margin-right: .4rem
}

.rec-list-group.ty03.case1 {
    padding: 1.6rem 0
}

.rec-list-group.ty03 .loading {
    width: 3.2rem
}

.rec-list-group.ty03 .dot-flashing.type2 {
    left: .5rem
}

.rec-list-group.ty03 .rec-list-item.cancel-disabled .rec-item-bu .txt01,
.rec-list-group.ty03 .rec-list-item.cancel-disabled .rec-item-txt .txt01,
.rec-list-group.ty03 .rec-list-item.cancel-disabled .rec-item-txt .txt02 {
    color: var(--txt-quin) !important
}

.rec-list-group.ty03 .cancel-disabled .txt01 .tag {
    margin-left: .4rem
}

.rec-list-group.ty03 .rec-list-item.cancel-disabled .msg-error {
    position: relative;
    -ms-flex-preferred-size: 100%;
    flex-basis: 100%;
    width: 100%;
    margin: .4rem 0 0 4.5rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.rec-list-group.ty03 .rec-list-item.cancel-disabled .msg-error__txt {
    display: inline-block;
    font-size: 1.4rem;
    margin-left: .4rem;
    font-weight: 400;
    line-height: 2rem;
    color: var(--txt-pri-error)
}

/*!
* component element
* list
* 간편결제 - 아이콘메뉴리스트
*/

.icon-list-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.icon-list-group .item-tap {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    text-align: center;
    margin: 3rem 0 4.2rem
}

.icon-list-group .item-tap [class*="ico-"] {
    width: 3.2rem;
    height: 3.2rem
}

.icon-list-group .item-tap .txt {
    display: block;
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    margin-top: 0.6rem
}

.icon-list-group.bar .item-tap:not(:first-child) {
    border-left: 0.1rem solid var(--color-g300, #e0e0e0)
}

.icon-list-group.bar .txt {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: bold
}

/*!
* component element
* list
* 케이뱅크페이 - 이벤트 리스트
*/

.list-event-group .list-item {
    padding: 2rem 0
}

.list-event-group .section-link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.list-event-group .section-link .img {
    width: 10rem;
    height: 5.8rem;
    border-radius: 0.4rem;
    overflow: hidden;
    background-color: var(--color-g200, #eee)
}

.list-event-group .section-link .img img {
    width: 100%
}

.list-event-group .section-link .txt-group {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    width: 65%;
    padding: 0 1rem 0 1.2rem
}

.list-event-group .section-link .txt-group .txt-date {
    font-size: 1.2rem;
    line-height: 1.6rem;
    font-weight: 400;
    color: var(--color-g700, #7d7d7d)
}

.list-event-group .section-link .txt-group .tit {
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: bold;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin-top: 0.4rem
}

/*!
* component element
* list
* 이체하기 - 출금 계좌 리스트
*/

.trn-list-group .btn-trn-option {
    display: block;
    width: 100%;
    text-align: left;
    padding: 0;
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400
}

.trn-list-group .trn-list .trn-list-item:first-child .area-trn-option {
    padding-top: 0
}

.trn-list-group .btn-trn-option.selected {
    position: relative
}

.trn-list-group .btn-trn-option.selected:after {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    right: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-check-ico-pri-success);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center
}

:root .trn-list-group .trn-list .trn-list-item:first-child .btn-trn-option.selected:after {
    top: 15.51724%;
    -webkit-transform: unset;
    -ms-transform: unset;
    transform: unset
}

:root .trn-list-group .btn-trn-option.selected:after {
    background-image: var(--path-solid-colored-check-ico-sec-active)
}

.trn-list-group .btn-trn-option:disabled {
    color: var(--color-g400, #c7c7c7)
}

.trn-list-group .btn-trn-option:disabled .tit-trn-option,
.trn-list-group .btn-trn-option:disabled .txt-trn-option {
    color: inherit
}

.trn-list-group .btn-trn-option [class*="ico-"]+.txt {
    margin-left: 0.8rem;
    vertical-align: middle
}

.trn-list-group .area-trn-option {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 1.6rem 0;
    border-bottom: 1px solid var(--color-g200, #eee)
}

.trn-list-group .area-trn-option span {
    display: inline-block
}

.trn-list-group .area-trn-option .tag {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin-left: .4rem
}

.trn-list-group .ico-bank {
    margin-right: 1rem;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.trn-list-group .tit-trn-option {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400
}

.trn-list-group .txt-trn-option {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g600, #9b9b9b)
}

.trn-list-group .txt-trn-option [class*="ico-"] {
    margin-left: 0.6rem
}

.trn-list-group .trn-list .trn-list-item .area-trn-option i+span>.tit-trn-option {
    font-weight: 500
}

.trn-list-group .tit-trn-option.ty2 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.trn-list-group .trn-list-item.skeleton .ico-bank {
    position: relative;
    background-image: none
}

.trn-list-group .trn-list-item.skeleton .ico-bank:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 3.4rem;
    height: 3.4rem;
    background-color: var(--color-g100, #f8f8f8)
}

.trn-list-group .trn-list-item.skeleton .tit-trn-option {
    position: relative
}

.trn-list-group .trn-list-item.skeleton .tit-trn-option:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 25rem;
    height: 100%;
    background-color: var(--color-g100, #f8f8f8);
    border-radius: 0.6rem
}

.trn-list-group .trn-list-item.skeleton .txt-trn-option {
    position: relative
}

.trn-list-group .trn-list-item.skeleton .txt-trn-option:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 10rem;
    height: 100%;
    background-color: var(--color-g100, #f8f8f8);
    border-radius: 0.6rem
}

.trn-list-group:not(.apt-ing) .area-trn-option span {
    max-width: calc(100% - 3.5rem);
    width: 100%;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.trn-list-group:not(.apt-ing) .area-trn-option .tag {
    -webkit-box-flex: 0;
    -ms-flex: 0;
    flex: 0
}

.trn-list-group .trn-link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-top: 1px solid var(--border-qua);
    padding: 1.6rem 0
}

.trn-list-group .trn-link .ico-plus {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: var(--bg-ter);
    border-radius: 99rem;
    padding: 1rem;
    background-size: 1.6rem;
    margin-right: 1.2rem;
    width: 3.2rem;
    height: 3.2rem
}

/*!
* component element
* list
* 모임원 목록
*/

.meet-bg>span {
    position: relative;
    display: block;
    width: 6.2rem;
    height: 3.6rem;
    line-height: 4.8rem;
    font-size: 0;
    color: var(--color-cg500, #e6ebf5);
    text-align: center;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    border-radius: .2rem
}

.meet-bg>span>img {
    width: 100%;
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.meet-bg>span.pic {
    overflow: hidden
}

.meet-item,
.meet-per {
    position: relative
}

.meet-per>span {
    position: relative;
    display: block;
    width: 4.8rem;
    height: 4.8rem;
    line-height: 4.8rem;
    font-size: 0;
    color: var(--color-cg500, #e6ebf5);
    text-align: center;
    border-radius: 1.6rem;
    background-color: var(--color-cg500, #e6ebf5);
    background-image: url("../../img/mmk/svg_common/ico_profile.svg");
    background-repeat: no-repeat;
    background-position: center center
}

.meet-per>span>img {
    width: 100%;
    height: 100%
}

.meet-per>span.pic {
    overflow: hidden
}

.meet-per>span.on {
    border: 2px solid var(--color-bu800, #0150ff)
}

.meet-per>span.txt {
    font-size: 1.8rem;
    color: var(--color-g900, #141414);
    background-image: none
}

.meet-per>span.total {
    background-color: var(--color-bu800, #0150ff);
    background-image: url("../../img/mmk/svg_common/ico_challenge.svg")
}

.meet-per>span.family {
    background-image: url("../../img/mmk/svg_common/ico_rel_family.svg")
}

.meet-per>span.biz {
    background-image: url("../../img/mmk/svg_common/ico_rel_biz.svg")
}

.meet-per>span.etc {
    background-image: url("../../img/mmk/svg_common/ico_rel_etc.svg")
}

.meet-per>span.friend {
    background-image: url("../../img/mmk/svg_common/ico_rel_friend.svg")
}

.meet-per>span.love {
    background-image: url("../../img/mmk/svg_common/ico_rel_love.svg")
}

.meet-per>span.play {
    background-image: url("../../img/mmk/svg_common/ico_rel_play.svg")
}

.meet-per .ico-star {
    width: 2rem;
    height: 2.2rem;
    position: absolute;
    top: -0.5rem;
    right: -0.5rem
}

.meet-per .badge {
    position: absolute;
    bottom: 0;
    right: 0;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 1.6rem;
    min-width: 1.6rem;
    padding: 0 4px;
    overflow: hidden;
    border-radius: 99rem;
    font-size: 0;
    background-image: url("../../img/mmk/common/ico_together_crown.png");
    background-position: 100% 0;
    background-repeat: no-repeat;
    background-size: contain
}

.meet-per .badge.txt {
    color: var(--color-w100, #fff);
    font-size: 8px;
    background-image: none;
    background-color: var(--color-pb100, #000)
}

.meet-per-name {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    margin-left: 1.2rem;
    width: 100%
}

.meet-per-name span {
    font-size: 1.6rem;
    line-height: 2rem;
    color: var(--color-g900, #141414)
}

.meet-per-name .txt-lv04 {
    line-height: 1.6rem
}

.meet-per-name.wait span {
    color: var(--txt-quin) !important
}

.meet-per-name span+span {
    margin-top: .4rem;
    font-size: 1.4rem;
    color: var(--txt-sec)
}

.meet-per-name span.meet-join {
    color: #0150ff
}

.meet-amount {
    margin-bottom: 0.4rem;
    font-size: 1.5rem;
    color: var(-txt-sec)
}

.meet-account {
    font-size: 1.6rem;
    color: var(--color-g900, #141414);
    font-weight: bold
}

.meet-account+span {
    margin-top: .4rem;
    font-size: 1.4rem;
    color: #7d7d7d
}

.meet-per.del {
    padding-top: .6rem
}

.meet-per.del .btn-cancel {
    position: absolute;
    top: 0;
    right: -.6rem
}

.meet-per.del .btn-cancel .ico-delete-input {
    width: 1.8rem;
    height: 1.8rem;
    -webkit-filter: var(--filter-g400);
    filter: var(--filter-g400)
}

.meet-list-group>li {
    border-bottom: 1px solid var(--color-g200, #eee)
}

.meet-list-group>li .meet-row {
    position: relative;
    width: 100%;
    padding: 2rem 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.popup-dialog.ui-bottom .meet-list-group>li:first-child .meet-row {
    padding-top: 0
}

.meet-list-group>li .zero .meet-per-name span {
    color: var(--txt-pri)
}

.meet-list-group>li .zero .meet-per-name span+span {
    color: var(--txt-sec)
}

.meet-list-group>li .zero .meet-account,
.meet-list-group>li .zero .meet-amount {
    color: var(--color-g500, #b8b8b8)
}

.meet-list-group>li .meet-row.selected {
    position: relative
}

.meet-list-group>li .meet-row.selected:after {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    right: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-check-ico-pri-success);
    background-size: 2.4rem 2.4rem;
    background-repeat: no-repeat;
    background-position: right center
}

:root .meet-list-group>li .meet-row.selected:after {
    background-image: var(--path-solid-colored-check-ico-sec-active)
}

.meet-list-group>li .meet-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    align-items: center
}

.meet-list-group>li .meet-item+.meet-item,
.meet-list-group>li .reverse .meet-item+.meet-item {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end
}

.meet-list-group>li .meet-item.row {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row
}

.meet-list-group>li .meet-item.row .btn-lv03 {
    padding: 0 1.2rem;
    border-radius: 99rem
}

.meet-list-group>li .meet-item.row button+button {
    margin-left: 1rem
}

.meet-list-group>li .meet-row.reverse {
    padding: 0
}

.meet-list-group>li .reverse .meet-item {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.meet-list-group>li .reverse .meet-account {
    margin-top: 1rem
}

.meet-list-group>li .reverse .meet-amount .name {
    color: var(--color-g900, #141414)
}

.meet-list-group>li .reverse .meet-amount .name:after {
    content: '';
    display: inline-block;
    width: 1px;
    height: 1rem;
    background: var(--color-g300, #e0e0e0);
    margin: 0 .5rem 0 .8rem
}

.meet-list-group.noline>li {
    border: none
}

.meet-list-group.noline>li .meet-row {
    padding: 1.4rem 0
}

.meet-list-group.noline>li:last-child .meet-row {
    padding-bottom: 2rem
}

.meet-list-group.noline+.btn-group .btn-view-more {
    padding-top: 2rem;
    border-top: 1px solid var(--color-g200, #eee)
}

.meet-list-group.noline+.btn-group .btn-view-more .txt {
    font-size: 1.6rem;
    color: var(--color-g900, #141414)
}

.meet-list-group.noline+.btn-group .btn-view-more .ico-arrow-open {
    -webkit-filter: var(--filter-g900);
    filter: var(--filter-g900)
}

.meet-list-group.noline+.btn-group .btn-view-more .ico-arrow-close {
    background-size: contain;
    background-image: var(--path-line-chevron-up);
    -webkit-filter: var(--filter-g900);
    filter: var(--filter-g900)
}

.popup-header .meet-list-group>li {
    border-bottom: 1px solid var(--color-g200, #eee);
    padding-bottom: 2.4rem
}

.meet-list-group.row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    max-width: 100vw;
    overflow-x: auto;
    white-space: nowrap
}

.meet-list-group.row>li {
    border: 0
}

.meet-list-group.row>li+li {
    padding-left: 1.6rem
}

.meet-list-group.row>li:first-child {
    padding-left: 2rem
}

.meet-list-group.row>li:last-child {
    padding-right: 2rem
}

.meet-list-group.row>li .meet-item {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-flow: column;
    flex-flow: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.meet-list-group.row>li .meet-per-name {
    margin: .6rem 0 0;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.meet-list-group.row>li .meet-per-name>span {
    font-size: 1.4rem;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 100%
}

.meet-list-group.row.prd {
    padding: 4.8rem 0 1.6rem
}

.meet-list-group.row.prd::-webkit-scrollbar {
    display: none
}

.component-list.row-scroll {
    padding: 0 0 2.4rem
}

.list-row .member-off .section-link .tit-list {
    color: var(--txt-quin)
}

.list-row .member-off .section-link .col-state .txt {
    color: var(--txt-quin)
}

.list-row .member-off .section-link .state {
    color: var(--txt-quin);
    font-size: 1.2rem;
    line-height: 1.9rem
}

/*!
* component element
* list
* 스탬프 목록 FETASK-1167
*/

.stamp-list-group {
    position: relative;
    margin-top: 4rem
}

.stamp-list-group::after,
.stamp-list-group::before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    width: 3.6rem;
    height: 4.8rem;
    z-index: 1
}

.stamp-list-group::before {
    left: 0;
    background: -webkit-gradient(linear, left top, right top, color-stop(40%, var(--color-w100, #fff)), to(rgba(255, 255, 255, 0)));
    background: -o-linear-gradient(left, var(--color-w100, #fff) 40%, rgba(255, 255, 255, 0) 100%);
    background: linear-gradient(90deg, var(--color-w100, #fff) 40%, rgba(255, 255, 255, 0) 100%)
}

.stamp-list-group::after {
    right: 0;
    background: -webkit-gradient(linear, right top, left top, color-stop(40%, var(--color-w100, #fff)), to(rgba(255, 255, 255, 0)));
    background: -o-linear-gradient(right, var(--color-w100, #fff) 40%, rgba(255, 255, 255, 0) 100%);
    background: linear-gradient(270deg, var(--color-w100, #fff) 40%, rgba(255, 255, 255, 0) 100%)
}

.stamp-list-group .stamp-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    position: relative;
    max-width: 100vw;
    overflow: auto hidden;
    height: 4.8rem;
    white-space: nowrap
}

.stamp-list-group .stamp-list::-webkit-scrollbar {
    display: none
}

.stamp-list-group .stamp-list>li {
    margin: 0 0.8rem
}

.stamp-list-group .stamp-list>li:first-child {
    margin-left: 0;
    padding-left: 4rem
}

.stamp-list-group .stamp-list>li:last-child {
    margin-right: 0;
    padding-right: 4rem
}

.stamp-list-group .stamp-list>li.check .btn-stamp.front {
    background-image: url(/resource/img/mmk/svg_common/ico_stamp_check_gray.svg)
}

.stamp-list-group .stamp-list>li.check.finish .btn-stamp.front {
    background-image: url(/resource/img/mmk/svg_common/ico_stamp_check.svg)
}

.stamp-list-group .stamp-list>li.check .btn-stamp.back {
    background-image: url(/resource/img/mmk/svg_common/ico_stamp_number_gray.svg)
}

.stamp-list-group .stamp-list>li.check.finish .btn-stamp.back {
    background-image: url(/resource/img/mmk/svg_common/ico_stamp_number.svg)
}

.stamp-list .btn-stamp {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 4.8rem;
    height: 4.8rem;
    background: url(/resource/img/mmk/svg_common/ico_stamp_number_gray.svg) 0 0 no-repeat;
    background-size: 100%
}

.stamp-list .btn-stamp .txt {
    font-size: 2rem;
    font-weight: 700;
    line-height: 1;
    color: var(--txt-disabled, #c8d2e4)
}

.stamp-list>li.finish .btn-stamp {
    background-image: url(/resource/img/mmk/svg_common/ico_stamp_number.svg)
}

.stamp-list>li.finish .btn-stamp .txt {
    color: var(--color-w100, #fff)
}

.stamp-list .flip-area {
    position: relative;
    width: 4.8rem;
    height: 4.8rem;
    -webkit-perspective: 1000px;
    perspective: 1000px
}

.stamp-list .flip-area .btn-stamp {
    position: absolute;
    top: 0;
    left: 0;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

.stamp-list .flip-area .btn-stamp.front {
    transform: rotateY(0);
    -webkit-transform: rotateY(0)
}

.stamp-list .flip-area .btn-stamp.back {
    transform: rotateY(180deg);
    -webkit-transform: rotateY(180deg)
}

.stamp-list .finish .flip-area {
    pointer-events: none
}

.stamp-list .finish .flip-area .btn-stamp.front,
.stamp-list .finish .flip-area.active .btn-stamp.front {
    -webkit-animation: none !important;
    animation: none !important
}

.stamp-list .finish .flip-area .btn-stamp.front,
.stamp-list .finish .flip-area.active .btn-stamp.front {
    transform: rotateY(0);
    -webkit-transform: rotateY(0)
}

.stamp-list .finish .flip-area .btn-stamp.back,
.stamp-list .finish .flip-area.active .btn-stamp.back {
    display: none
}

.stamp-list .flip-area .flip-con {
    display: block;
    width: 100%;
    height: 100%;
    position: relative;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-perspective-origin: 50% 50%;
    perspective-origin: 50% 50%;
    -webkit-transition: -webkit-transform 1.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    transition: -webkit-transform 1.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    -o-transition: transform 1.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    transition: transform 1.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    transition: transform 1.5s cubic-bezier(0.175, 0.885, 0.32, 1.275), -webkit-transform 1.5s cubic-bezier(0.175, 0.885, 0.32, 1.275)
}

.stamp-list .flip-area.active .flip-con {
    -webkit-transform: rotateY(180deg);
    transform: rotateY(180deg)
}

.component-gathering-selected {
    display: none;
    position: -webkit-sticky;
    position: sticky;
    top: 5rem;
    left: 0;
    width: 100%;
    height: 11.2rem;
    background-color: var(--color-w100, #fff);
    z-index: 79;
    margin-top: 0 !important;
    padding: 1.8rem 0
}

.component-gathering-selected:after {
    content: "";
    background: var(--color-w100, #fff);
    width: 100%;
    height: 1rem;
    position: absolute;
    left: 0;
    top: 99%
}

.component-gathering-selected.active {
    display: block
}

.component-gathering-selected.active+.component-search {
    top: 16.2rem;
    padding-top: .6rem;
    padding-bottom: 1px
}

.component-gathering-selected.active+.section-component .tab-list.sticky {
    top: 16.2rem
}

.component-gathering-selected+.component-search.fixed-addr02+.component-list {
    margin-top: 1.4rem
}

/*! ios(노치) 대응 => device.scss */

/*!
* component element
* list
* 회원가입 관심토픽
*/

.topic-list-group ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-left: -1rem
}

.topic-list-group ul>li {
    width: calc(100%/3);
    text-align: center;
    padding-left: 1rem
}

.topic-list-group ul>li:nth-child(n+4) {
    padding-top: 2rem
}

.topic-list-group.col2 ul>li {
    width: calc(100%/2);
    -webkit-box-flex: 0;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto
}

.topic-list-group.col2 ul>li:nth-child(n+3) {
    padding-top: 2rem
}

.topic-list-group.col4 ul>li {
    width: calc(100%/4);
    -webkit-box-flex: 0;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto
}

.topic-list-group.col4 ul>li:nth-child(n+4) {
    padding-top: 0
}

.topic-list-group.col4 ul>li:nth-child(n+5) {
    padding-top: 2rem
}

.topic-list-group.col4 ul>li .input-checkbox.topic .topic-pic {
    height: 7.5rem
}

.topic-list-group.col4 ul>li .input-checkbox.topic .topic-pic [class^="ico-topic"] {
    top: 1.5rem
}

/*!
* component element
* list
* 머니톡 서비스
*/

.col2-list-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.col2-list-group>li {
    position: relative;
    width: 50%;
    text-align: center
}

.col2-list-group>li:nth-child(n+3) {
    border-top: 1px solid var(--color-g200, #eee)
}

.col2-list-group>li:nth-child(2n)::before {
    content: '';
    width: 1px;
    position: absolute;
    top: 2.8rem;
    left: 0;
    bottom: 2.8rem;
    background-color: var(--color-g200, #eee)
}

.col2-list-group>li .section-link {
    padding: 2.8rem 2rem;
    display: block
}

.col2-list-group>li .section-link .book-img {
    width: 7.2rem
}

.col2-list-group>li .section-link .txt-tag {
    font-size: 1.4rem;
    line-height: 2rem;
    margin: 1.6rem 0 0.8rem
}

.col2-list-group>li .section-link .box-title>span {
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: 700;
    display: -webkit-box;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    word-wrap: break-word;
    white-space: normal
}

.component-list.moneytalk-theme {
    background-color: var(--color-pn, #17008c);
    padding: 3.2rem 0 6.4rem 2rem;
    overflow: hidden
}

.component-list.moneytalk-theme.type2 {
    padding: 2.4rem 2rem 4rem
}

.component-list.moneytalk-theme .title-group {
    padding-bottom: 0.4rem
}

.component-list.moneytalk-theme .title-group .title-field-page {
    position: relative;
    color: var(--color-w100, #fff);
    width: calc(100% - 2rem)
}

.component-list.moneytalk-theme .title-group .title-field-page:after {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    right: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-chevron-right);
    background-size: contain;
    -webkit-filter: var(--filter-w100);
    filter: var(--filter-w100)
}

.component-header+.component-list.moneytalk-theme .title-group .title-field-page:after,
.component-text+.component-list.moneytalk-theme .title-group .title-field-page:after {
    display: none
}

.component-list.moneytalk-theme .title-group .ico-arrow-link {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-filter: var(--filter-w100);
    filter: var(--filter-w100)
}

.emoji-list-group>li {
    margin-top: 1rem
}

.emoji-list-group>li .section-link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.emoji-list-group>li .section-link>div {
    padding: 1.3rem 2rem;
    border-radius: 99rem;
    font-size: 1.8rem;
    color: var(--color-w100, #fff);
    font-weight: 700;
    white-space: pre
}

.emoji-list-group>li .section-link>div:after {
    content: '';
    display: inline-block;
    margin: -0.3rem 0 0 0.7rem;
    width: 1.6rem;
    height: 1.6rem;
    background-image: var(--path-line-chevron-right);
    background-position: 0 0;
    background-repeat: no-repeat;
    background-size: contain;
    -webkit-filter: var(--filter-w100);
    filter: var(--filter-w100);
    vertical-align: middle
}

.emoji-list-group>li .section-link>div+span,
.emoji-list-group>li .section-link>span+div,
.emoji-list-group>li .section-link>span+span {
    margin-left: 1rem
}

.emoji-list-group>li .section-link>span {
    font-size: 2.7rem
}

.document-guide-group:not(:first-child) {
    margin-top: 4.8rem
}

.document-guide-group .guide-img {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: relative;
    width: 100%;
    height: 21.2rem;
    overflow: hidden;
    border-radius: 1rem 1rem 0 0;
    background: #100e13
}

.popup-dialog.ui-bottom .popup-header+.popup-content .component-document-guide .swiper-slide:first-child {
    margin-top: 0
}

.document-guide-group .guide-img.right {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.document-guide-group.fail .guide-img:before {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 16rem;
    height: 16rem;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    background: url(../../img/mmk/common/img_guide_fail.png) no-repeat;
    background-size: 16rem auto
}

.document-guide-group.confirm .guide-img:before {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 16rem;
    height: 16rem;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    background: url(../../img/mmk/common/img_guide_confirm.png) no-repeat;
    background-size: 16rem auto
}

.document-guide-group .guide-img img {
    display: block;
    height: 24rem
}

.document-guide-group .guide-txt {
    padding: .4rem .8rem;
    color: var(--color-w100, #fff);
    font-size: 1.4rem;
    text-align: center;
    line-height: 2rem;
    border-radius: 0 0 1rem 1rem
}

.document-guide-group.fail .guide-txt {
    background: var(--color-re800, #d3140f)
}

.document-guide-group.confirm .guide-txt {
    background: var(--color-ce800, #007c0f)
}

.document-guide-group.type2 .guide-img {
    background: var(--color-g100, #f8f8f8);
    border-radius: 1.2rem 1.2rem 0 0;
    margin-top: 1.6rem
}

.document-guide-group.type2 .guide-img:before {
    display: none
}

.document-guide-group.type2 .guide-img img {
    background: var(--color-g100, #f8f8f8);
    border-radius: 0 0 1.2rem 1.2rem
}

.document-guide-group.type2 .guide-txt {
    border-radius: 0
}

.compare-list-group {
    margin-top: 3.6rem
}

.compare-list-group .row+.row {
    margin-top: 4rem
}

.compare-list-group .col-group {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    text-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-wrap: wrap-reverse;
    flex-wrap: wrap-reverse
}

.compare-list-group .col-group .ico-transfer-animation {
    width: 3rem;
    margin-bottom: .6rem
}

.compare-list-group .col-group .card-img-group {
    margin-bottom: 1.6rem;
    margin-left: 0
}

.compare-list-group .col {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    -ms-flex-preferred-size: 0;
    flex-basis: 0
}

.compare-list-group .tit {
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--color-g700, #7d7d7d)
}

.compare-list-group .txt {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-size: 1.6rem;
    line-height: 2.1rem;
    color: var(--color-g900, #141414)
}

.compare-list-group .txt-result {
    width: 100%;
    margin-top: 1.6rem;
    font-size: 1.5rem;
    height: 4.6rem;
    line-height: 4.6rem;
    color: var(--color-g900, #141414);
    font-weight: 500;
    background: var(--color-cg300, #f1f6fb);
    border-radius: 1.6rem
}

.compare-list-group .txt-result.ty01 {
    background: var(--color-g100, #f8f8f8)
}

.compare-list-group .txt-result span {
    font-weight: 700;
    color: var(--color-pn, #17008c)
}

.compare-list-group .ico-loading-dot {
    width: 2rem;
    height: 2.1rem
}

.compare-list-group .ico-loading-dot img {
    width: 100%
}

.list-infobox-group.level1 .area-desc,
.list-infobox-group.level1 .area-term {
    font-size: 1.6rem;
    line-height: 2.1rem
}

.list-infobox-group.level1.seach-type .list-item+.list-item {
    margin-top: 0
}

.list-infobox-group.level1.seach-type .link {
    display: block;
    padding: 1.6rem 0
}

.list-infobox-group.level1.seach-type .item-box {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.list-infobox-group.level1.seach-type .area-term {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    max-width: 100%
}

.list-infobox-group.level1.seach-type .area-term span:first-child {
    font-weight: 500;
    color: var(--txt-pri)
}

.list-infobox-group.level1.seach-type .area-term span:first-child .key-w {
    color: var(--txt-accent-sec);
    font-weight: 700
}

.list-infobox-group.level1.seach-type .area-term span:nth-child(2) {
    margin-top: 0.4rem;
    font-size: 1.4rem;
    font-weight: 400;
    color: var(--txt-ter)
}

.list-infobox-group.level1.seach-type .area-desc span {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 700;
    color: var(--txt-pri)
}

.list-infobox-group.gray-box {
    padding: 2.4rem 2rem;
    background-color: var(--color-g100, #f8f8f8);
    border-radius: 1.2rem
}

.category-list-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 1.6rem 1rem
}

.category-list-group li {
    width: calc(25% - 1rem)
}

.category-list-group .category-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 1.3rem 2.3rem
}

.category-list-group .category-item .txt {
    font-size: 1.4rem;
    font-weight: 500;
    line-height: 2.4rem;
    margin-top: 0.6rem;
    white-space: nowrap
}

.goods-list-group .goods-ltem-link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.goods-list-group .goods-ltem-link .goods-item-img {
    position: relative;
    width: 13rem;
    height: 13rem;
    min-width: 13rem;
    border-radius: 1.8rem;
    margin-right: 1.6rem;
    overflow: hidden
}

.goods-list-group .goods-ltem-link .goods-item-img::after {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    border: 1px solid var(--color-pb10);
    border-radius: 1.8rem
}

.goods-list-group .goods-ltem-link .goods-item-img>img {
    width: 100%;
    height: 100%
}

.goods-list-group .goods-list-item+.goods-list-item {
    margin-top: 1.6rem
}

.goods-list-group .goods-ltem-link .goods-text {
    position: relative;
    font-size: 1.5rem;
    font-weight: 500;
    line-height: 2rem;
    color: var(--color-g700);
    margin-bottom: 0.6rem
}

.goods-list-group .goods-ltem-link .goods-text .goods-brand {
    display: block;
    max-width: 100%;
    position: absolute;
    top: 0;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap
}

.goods-list-group .goods-ltem-link .goods-text .goods-brand+.line-clamp-2 {
    padding-top: 2rem
}

.goods-list-group .goods-ltem-link .goods-price {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 1.8rem;
    font-weight: 700;
    line-height: 2.5rem;
    color: var(--txt-pri)
}

.goods-list-group .goods-ltem-link .goods-price i {
    margin-right: 0.2rem;
    width: 2rem;
    height: 2rem
}

.row-link-group li {
    position: relative;
    padding: 1.5rem 0;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.row-link-group li:first-child {
    padding-top: 0
}

.row-link-group li+li {
    border-top: 1px solid var(--color-g200, #eee)
}

.row-link-group li .txt-wrap {
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--txt-ter)
}

.row-link-group li .txt-wrap span {
    display: block;
    margin-bottom: 0.2rem;
    font-size: 1.6rem;
    line-height: 2.1rem;
    color: var(--txt-pri);
    font-weight: 500
}

.row-link-group li .btn-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-left: auto;
    position: relative;
    z-index: 1
}

.row-link-group li .btn-wrap button+button {
    margin-left: .8rem
}

.row-link-group li .img-wrap.bg-type {
    background-color: var(--bg-ter)
}

.row-link-group li .img-wrap {
    width: 3.6rem;
    height: 3.6rem;
    margin-right: 1.2rem;
    border-radius: 99rem;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.row-link-group li>a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.component-list.all-account {
    position: relative
}

.component-list.all-account .my-list-row-logo {
    -ms-flex-preferred-size: 3.6rem;
    flex-basis: 3.6rem;
    width: 3.6rem;
    height: 3.6rem
}

.my-all-account-tit {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-top: 4.8rem
}

.my-all-account-tit .title {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 700;
    color: var(--txt-pri)
}

.my-all-account-tit .title+p {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 500;
    color: var(--txt-qua)
}

.my-all-account-tit .title span {
    color: var(--txt-accent-sec)
}

.my-all-account-tit .title+.title,
.my-all-account-tit .title+.title span {
    font-size: 1.4rem;
    font-weight: 500;
    color: var(--txt-qua)
}

.btn-my-list-more {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    border: 1px solid var(--border-qua);
    background-color: var(--color-w100);
    padding: 1.6rem 2rem;
    border-radius: 1rem;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.btn-my-list-more .ico-plus {
    width: 1.6rem;
    height: 1.6rem;
    -webkit-filter: var(--filter-g500);
    filter: var(--filter-g500)
}

.my-all-account-list>li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding-top: 2.8rem
}

.my-all-account-list>li:first-child {
    padding-top: 2rem
}

.my-all-account-list.type2>li {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.my-all-account-list.line>li {
    padding: 2.3rem 2rem;
    border: 1px solid var(--border-quin);
    border-radius: 1.6rem
}

.my-all-account-list.line>li+li {
    margin-top: 1.2rem
}

.main-list-row-logo.logo-loop-motion .swiper-container,
.main-list-row-logo.logo-loop-motion .swiper-slide,
.main-list-row-logo.logo-loop-motion .swiper-wrapper {
    width: 4rem;
    height: 4rem
}

.my-list-row-logo.square.logo-loop-motion {
    height: 4.6rem
}

.my-list-row-logo.logo-loop-motion .swiper-container,
.my-list-row-logo.logo-loop-motion .swiper-wrapper .my-list-row-logo.logo-loop-motion .swiper-slide {
    width: 3.6rem;
    height: 3.6rem
}

.my-all-account-list.line>li .logo-loop-motion:not(.square) .swiper-slide {
    border-radius: 99rem;
    overflow: hidden
}

.my-all-account-list.line>li .square.logo-loop-motion .swiper-container,
.my-all-account-list.line>li .square.logo-loop-motion .swiper-wrapper .my-all-account-list.line>li .square.logo-loop-motion .swiper-slide {
    width: 2.8rem;
    height: 4.6rem
}

.my-all-account-tit+.my-all-account-list.line {
    margin-top: 1.6rem
}

.my-all-account-tit+.my-all-account-list.line+.btn-group {
    margin-top: 1.2rem
}

.my-all-account-tit+.my-all-account-list.line .main-list-row-txt .sum-group .sum-off {
    font-size: 1.6rem;
    line-height: 2.1rem
}

.main-my-account-group[class*=other-] .my-list-row-txt .sum-group .sum,
.main-my-account-group[class*=other-] .my-list-row-txt .sum-group .sum a,
.my-all-account-group[class*=other-] .my-list-row-txt .sum-group .sum,
.my-all-account-group[class*=other-] .my-list-row-txt .sum-group .sum a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.main-my-account-group[class*=other-] .my-list-row-txt .sum-group .sum .ico-refresh,
.my-all-account-group[class*=other-] .my-list-row-txt .sum-group .sum .ico-refresh {
    margin-left: 0.2rem
}

.my-all-account-group.banner {
    margin-top: 1.6rem
}

.list-linebox-group.card-footer {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    background: var(--bg-qua)
}

.my-all-account-list.type3>li {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    overflow: hidden
}

.my-all-account-list.type3 .card-footer {
    margin: 2rem -2rem -2.4rem -2rem;
    border-top: 1px solid var(--border-quin, #e0e6f1);
    border-bottom: none
}

.my-all-account-list.type3 .card-footer .tit-list {
    font-size: 1.4rem;
    color: var(--txt-qua);
    font-weight: 400
}

.my-all-account-list.type3 .card-footer .tit-list img {
    margin-right: .6rem
}

.my-all-account-list.type3 .card-footer .section-link {
    padding-top: 1.5rem;
    padding-bottom: 1.5rem
}

.my-all-account-list.type4 {
    margin-top: .4rem
}

.my-all-account-list.type4 li {
    padding-top: 1.6rem
}

.my-all-account-list.type4 li .my-list-row-logo {
    margin-right: 1rem
}

.my-all-account-list.type4 .my-list-row-txt .list-row-name .txt {
    font-size: 1.5rem;
    line-height: 2rem;
    color: var(--txt-pri)
}

.my-all-account-list.type4 .sum-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    word-break: keep-all
}

.my-all-account-list.type4 .sum-group .ico-arrow-link {
    width: 1.4rem;
    height: 1.4rem;
    -webkit-filter: var(--filter-ico-sec);
    filter: var(--filter-ico-sec)
}

.my-all-account-list.type4 .sum {
    font-size: 1.6rem;
    line-height: 2rem;
    font-weight: 700;
    color: var(--txt-pri)
}

.my-all-account-list.type4 .my-list-row-logo {
    background: var(--bg-ter)
}

.my-all-account-list.type4 .my-list-row-logo {
    width: 2.8rem;
    height: 2.8rem;
    -ms-flex-preferred-size: 2.8rem;
    flex-basis: 2.8rem
}

.my-all-account-list.type4 .my-list-row-logo i {
    width: 2.2rem;
    height: 2.2rem
}

.my-list-row-item {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%
}

.my-list-row-item+.btn-group {
    width: 100%;
    margin-top: 2rem
}

.my-list-row-logo {
    position: relative;
    -ms-flex-preferred-size: 4rem;
    flex-basis: 4rem;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    margin-right: 1.2rem;
    width: 4rem;
    height: 4rem;
    border-radius: 99rem;
    background-color: #f2f4f6
}

.my-list-row-logo i {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.my-list-row-logo i.ico-info-detail-pocket {
    width: 3.2rem;
    height: 3.2rem
}

.my-list-row-logo img {
    width: 3.6rem;
    height: 3.6rem
}

.my-list-row-logo .ico-account-hide,
.my-list-row-logo .ico-account-inquiry,
.my-list-row-logo .ico-building {
    width: 2.4rem;
    height: 2.4rem
}

.my-list-row-logo.square {
    border-radius: 0;
    background-color: transparent;
    height: auto;
    -ms-flex-preferred-size: 3.6rem;
    flex-basis: 3.6rem;
    width: 3.6rem
}

.my-list-row-logo.square i {
    border-radius: 0.4rem;
    overflow: hidden
}

.my-list-row-logo.square i:after {
    border-radius: 0.4rem
}

.my-list-row-logo.loan {
    background-color: #e8faee
}

.my-list-row-logo.w28 {
    -ms-flex-preferred-size: 2.8rem;
    flex-basis: 2.8rem;
    width: 2.8rem;
    height: 2.8rem
}

.my-list-row-logo.border:after {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 99rem;
    border: 1px solid var(--color-pb5);
    z-index: 1
}

.my-list-row-txt {
    width: 100%;
    overflow: hidden
}

.my-list-row-logo .my-list-row-txt {
    width: calc(100% - 5.2rem)
}

.my-list-row-txt .txt-group {
    margin-bottom: 0.2rem
}

.my-list-row-txt .txt-group .tag-group {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex
}

.my-list-row-txt .txt-group .tag-group .tag {
    margin-left: 0.4rem
}

.my-list-row-txt .txt-group .tag-group .tag:first-child {
    margin-left: 0.2rem
}

.my-list-row-txt .sum-group {
    min-height: 2.1rem
}

.my-list-row-txt .txt-group2 {
    margin-top: 0.8rem
}

.my-list-row-txt .txt-group2 .txt {
    font-size: 1.2rem;
    line-height: 1.6rem;
    color: var(--txt-quin)
}

.my-list-row-txt .list-bne-name {
    display: block;
    font-size: 1.6rem;
    line-height: 2.1rem;
    color: var(--txt-pri);
    font-weight: 700
}

.my-list-row-txt .list-bne-name.off {
    color: var(--txt-qua);
    font-size: 1.8rem;
    line-height: 2.5rem
}

.my-list-row-txt .list-row-name {
    color: var(--txt-sec);
    display: inline-block;
    vertical-align: middle;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 100%
}

.my-list-row-txt .list-row-name .txt {
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 2rem;
    color: var(--txt-sec);
    max-width: 100%
}

.my-list-row-txt .list-row-name .txt+.txt {
    margin-left: 0.5rem;
    color: var(--txt-quin)
}

.my-list-row-txt .list-row-name .txt+.txt:before {
    content: '';
    display: inline-block;
    vertical-align: middle;
    margin-top: -0.2rem;
    margin-right: 0.5rem;
    width: 1px;
    height: 1.2rem;
    background-color: var(--border-ter)
}

.insu .my-list-row-txt .list-row-name {
    color: var(--txt-quin)
}

.insu .my-list-row-txt .list-row-name .txt:first-child {
    color: var(--txt-sec)
}

.my-list-row-txt .sum-group .sum-check {
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: 700;
    color: var(--txt-qua)
}

.my-list-row-txt .sum-group .sum {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 700;
    color: var(--txt-pri)
}

.my-list-row-txt .sum-group .sum-off {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 700;
    color: var(--txt-quin)
}

.my-list-btn {
    margin-left: auto
}

.list-infobox-group.pb-interest-info-group .list-item,
.list-infobox-group.pb-interest-info-group .list-item+.list-item {
    margin-top: 2.4rem
}

.list-infobox-group.pb-interest-info-group .item-box .area-term strong.txt-lv01 {
    margin-top: 0.2rem
}

.list-linebox-group.pb-infobox-list {
    margin-top: 3.2rem
}

.list-linebox-group.pb-infobox-list .list-item {
    margin: .8rem 0
}

.list-linebox-group.pb-infobox-list .tit-area {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.list-linebox-group.pb-infobox-list .tit-list.tit01 {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 700;
    color: var(--txt-sec)
}

.list-linebox-group.pb-infobox-list .tit-list.tit02 {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--txt-quin)
}

.list-linebox-group.pb-infobox-list .label-area {
    width: 3.8rem;
    margin-right: 1.6rem
}

.list-linebox-group.pb-infobox-list .label-area .txt {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 500;
    color: var(--txt-ter)
}

.list-infobox-group.pb-infobox-list2 .item-box {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.list-infobox-group.pb-infobox-list2 .item-box .area-term {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.list-infobox-group.pb-infobox-list2 .item-box .txt01 {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 500;
    color: var(--txt-pri)
}

.list-infobox-group.pb-infobox-list2 .item-box .txt02 {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--txt-ter)
}

.list-infobox-group.pb-infobox-list3 .item-box .area-term span+span::before {
    content: '';
    display: inline-block;
    margin: -0.2rem 0.6rem 0;
    width: 1px;
    height: 1.9rem;
    background-color: var(--txt-quin);
    vertical-align: middle
}

.desc-list-group .list-row .list-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 14px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 1.6rem 1.6rem 1.6rem 1.4rem
}

.desc-list-group .list-row .list-item .col-icon {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 7rem;
    flex: 0 0 7rem
}

.desc-list-group .list-row .list-item .col-info {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 5px;
    padding-left: 1.4rem
}

.desc-list-group .list-row .list-item .col-info::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
    width: 1px;
    height: 4rem;
    background: var(--color-g400)
}

.rec-list-group.ty01 .rec-list-item .rex-num[class*=digit] {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-right: 1.2rem
}

.rec-list-group.ty01 .rec-list-item .rex-num.digit2 {
    width: 2rem
}

.rec-list-group.ty01 .rec-list-item .rex-num.digit2~.item-wrap {
    max-width: calc(100% - 7.8rem)
}

.rec-list-group.ty01 .rec-list-item .rex-num.digit3 {
    width: 3rem
}

.rec-list-group.ty01 .rec-list-item .rex-num.digit3~.item-wrap {
    max-width: calc(100% - 8.8rem)
}

.rec-list-group.ty01 .rec-list.type1 .rec-item-txt .txt01 {
    max-width: 15.1rem
}

.rec-list-group.ty01 .rec-list.type1 .rec-item-per {
    margin-left: auto
}

.list-infobox-group.invest .item-box-sub {
    padding: 2.4rem 2rem;
    border-radius: 1.4rem
}

/*!
* component element
* list-table
* layout
*/

.component-list-table .list-table {
    table-layout: fixed;
    width: 100%
}

.component-list-table .list-table thead {
    border-bottom: 1px solid var(--border-ter)
}

.component-list-table .list-table .tit {
    padding: .8rem 0;
    font-size: 1.4rem;
    font-weight: 700;
    color: var(--txt-qua);
    line-height: 2rem;
    text-align: right;
    padding-right: .4rem
}

.component-list-table .list-table .tit:last-child {
    padding-right: 0
}

.component-list-table .list-table tbody td {
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 2rem;
    padding: 1.4rem .4rem 1.4rem 0;
    text-align: right
}

.component-list-table .list-table tbody td:last-child {
    padding-right: 0
}

.component-list-table .list-table tbody td:first-child {
    color: var(--txt-qua);
    text-align: left
}

.component-list-table .list-table tbody td:nth-child(2) {
    font-weight: 500;
    color: var(--txt-pri)
}

.component-list-table .list-table tbody td .up-color {
    color: var(--txt-pri-up)
}

.component-list-table .list-table tbody td .down-color {
    color: var(--txt-pri-down)
}

.component-list-table .list-table tbody td [class^="ico-triangle"] {
    width: 1.2rem;
    height: 1.2rem
}

.component-list-table .list-table tbody td .ico-triangle-up-sample01 {
    -webkit-filter: var(--filter-re700);
    filter: var(--filter-re700)
}

.component-list-table .list-table tbody td .ico-triangle-down-sample01 {
    -webkit-filter: var(--filter-bu700);
    filter: var(--filter-bu700)
}

.component-list-table .list-table .align-center {
    text-align: center
}

.component-list-table .list-table .align-left {
    text-align: left
}

.component-list.bg-qua {
    background-color: var(--bg-qua)
}

.list-row.type04 {
    background: var(--bg-qua);
    border-radius: 1.6rem;
    padding: 1.6rem 2rem
}

.list-row.type04 .list-item {
    border: none
}

.list-row.type04 .list-item+.list-item {
    margin-top: .8rem
}

.list-row.type04 .tit-area {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 1.5rem;
    font-weight: 700
}

.list-row.type04 .tit-area .sub-tit {
    font-size: 1.4rem;
    color: var(--txt-qua);
    margin-bottom: .2rem;
    font-weight: 400;
    line-height: 2rem
}

.list-row.type04 .tit-area .tit-list {
    margin-left: 1.2rem;
    font-size: 1.5rem
}

.list-row.type04 .section-link {
    padding: .4rem 0
}

.list-row.type04 .tit-list {
    color: var(--txt-sec)
}

.component-list .health-care-group .health-care-list:first-child {
    position: relative
}

.component-list .health-care-group .tooltip-focus-group .tooltip-area.default.black {
    top: calc(100% + 2.4rem)
}

.component-list .health-care-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 1.8rem 0
}

.component-list .health-care-tit {
    font-size: 1.6rem;
    font-weight: 500;
    line-height: 2.1rem;
    color: var(--txt-sec);
    margin-right: .8rem;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.component-list .health-care-item {
    text-align: right;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.component-list .health-care-item .txt01 {
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 2.1rem;
    color: var(--txt-sec);
    margin-bottom: .2rem
}

.component-list .health-care-item .txt02 {
    font-size: 1.4rem;
    font-weight: 500;
    line-height: 2rem;
    color: var(--txt-quin)
}

.component-list .health-care-item .up {
    color: var(--txt-pri-up)
}

.component-list .health-care-item .down {
    color: var(--txt-pri-down)
}

.component-list .health-care-group.type01 .health-care-list {
    display: block;
    -webkit-box-pack: unset;
    -ms-flex-pack: unset;
    justify-content: unset;
    -webkit-box-align: unset;
    -ms-flex-align: unset;
    align-items: unset
}

.component-list .health-care-group.type01 .health-care-list .health-care-list-link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.compare-list-group-box {
    margin-top: 1.2rem;
    padding: 2rem;
    border-radius: 1.2rem;
    background-color: var(--bg-qua)
}

.compare-list-group-box .compare-list-group {
    margin-top: 0
}

.compare-list-group.type01 .row .col-group {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.compare-list-group.type01 .row .col-group+.col-group {
    margin-top: 1.6rem
}

.compare-list-group.type01 .row+.row {
    margin-top: 3.2rem
}

.compare-list-group.type01 .row .col-group .col .tit {
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 2rem;
    color: var(--txt-qua)
}

.compare-list-group.type01 .row .col-group .col .sub-txt {
    font-size: 1.5rem;
    font-weight: 500;
    line-height: 2rem;
    color: var(--txt-sec)
}

.compare-list-group.type01 .txt-result {
    margin-top: 0;
    height: 4.4rem;
    color: var(--txt-pri);
    line-height: 2rem;
    padding: 1.2rem 2rem;
    border-radius: 99rem;
    background-color: var(--bg-ter)
}

.compare-list-group.type01 .txt-result span {
    color: var(--color-bu900)
}

.component-compare .header-title-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.component-compare .header-title-group .compare-items-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.component-compare .header-title-group .compare-items-group [class^="logo-"]::after {
    border: 0.5px solid rgba(0, 55, 138, 0)
}

.component-compare .header-title-group .compare-items-group .ico-transfer-animation {
    width: 3.5rem;
    height: 2.2rem
}

.component-compare .header-title-group .compare-items-group .item {
    line-height: 0
}

.component-compare .header-title-group .compare-items-group .item:first-child {
    margin-left: 0
}

.component-compare .header-title-group .compare-items-group .item {
    margin-left: -.6rem
}

.compare-list-group-box .today-box {
    margin-top: 3.2rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 1.5rem 2rem 1.5rem 1.5rem;
    border-radius: 1.2rem;
    border: 1px solid var(--border-quin);
    background-color: var(--bg-base)
}

.compare-list-group-box .today-box .left {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-column-gap: .4rem;
    -moz-column-gap: .4rem;
    column-gap: .4rem
}

.rec-list-group.add-list .rec-list-item {
    border-bottom: 0
}

.rec-list-group.add-list .rec-item-img {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: relative;
    width: 4rem;
    height: 4rem;
    margin-right: 2rem;
    padding: 0
}

.rec-list-group.add-list .rec-item-img .img {
    position: relative;
    z-index: 1
}

.rec-list-group.add-list .rec-item-img .txt {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    z-index: 2;
    font-size: 1.8rem;
    font-weight: 700;
    line-height: 2.4rem;
    color: var(--txt-quin);
    white-space: nowrap
}

.rec-list-group.add-list .rec-item-img .txt.rank {
    top: 0.65rem;
    color: var(--txt-sec);
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0)
}

.rec-list-group.add-list .rec-item-txt {
    overflow: hidden;
    margin-right: 1.6rem
}

.rec-list-group.add-list .rec-item-txt .txt01 {
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 500;
    color: var(--txt-sec)
}

.rec-list-group.add-list .rec-item-txt .txt02 {
    margin-top: 0.4rem
}

.rec-list-group.add-list .rec-item-bu {
    width: 4rem;
    height: 4rem
}

.rec-list-group.add-list .rec-item-bu .input-checkbox.like {
    position: relative;
    width: 100%;
    height: 100%
}

.rec-list-group.add-list .rec-item-bu .input-checkbox input {
    left: auto;
    right: 0
}

.rec-list-group.add-list .rec-item-bu .checkbox-shape-like.type2 {
    position: absolute;
    top: 50%;
    right: 0.8rem;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

.component-list.top-chart {
    margin-top: 3.2rem
}

.component-list.top-chart .chart-list-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap
}

.component-list.top-chart .chart-list-group .list-item {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    overflow: hidden;
    height: 18rem;
    margin-right: 1.2rem
}

.component-list.top-chart .chart-list-group .list-item:last-child {
    margin-right: 0
}

.component-list.top-chart .chart-list-group .chart-group {
    position: relative;
    width: 100%;
    padding: 1.6rem 0.8rem;
    background-color: var(--bg-qua);
    border-radius: 2rem;
    text-align: center
}

.component-list.top-chart .chart-list-group .chart-group.top1 {
    height: 100%
}

.component-list.top-chart .chart-list-group .chart-group.top2 {
    height: 78%
}

.component-list.top-chart .chart-list-group .chart-group.top3 {
    height: 61%
}

.component-list.top-chart .chart-list-group .txt-rank {
    font-size: 1.8rem;
    font-weight: 700;
    line-height: 2rem;
    color: var(--txt-quin)
}

.component-list.top-chart .chart-list-group .chart-group.top1 .txt-rank {
    font-size: 2.1rem;
    line-height: 2.6rem;
    color: var(--txt-accent-sec)
}

.component-list.top-chart .chart-list-group .chart-bottom {
    position: absolute;
    bottom: 1.6rem;
    right: 0.8rem;
    left: 0.8rem
}

.component-list.top-chart .chart-list-group .txt-tit {
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 1.6rem;
    font-weight: 500;
    line-height: 2.1rem;
    color: var(--txt-sec)
}

.component-list.top-chart .chart-list-group .txt-num {
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin-top: 0.2rem;
    font-size: 1.4rem;
    font-weight: 500;
    line-height: 2rem;
    color: var(--txt-qua)
}

.list-linebox-group.safe-block .list-item+.list-item {
    margin-top: 1.2rem
}

.list-linebox-group.safe-block .list-item {
    padding-top: 1.6rem;
    border-bottom: none
}

.list-linebox-group.safe-block .icon-area {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.list-linebox-group.safe-block .tit-area {
    padding-left: 1.2rem
}

.list-linebox-group.safe-block .tit-area .sub-tit {
    color: var(--txt-ter);
    font-size: 1.4rem;
    line-height: 2rem
}

.list-linebox-group.safe-block .tit-area .tit {
    margin-top: 0.2rem;
    font-weight: bold
}

.list-deal-head.no-space {
    padding: 2.4rem 0 1.2rem
}

.list-deal-head.safe-block {
    padding: 4.8rem 0 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.list-deal-head.safe-block .btn-under-link {
    padding: 0.4rem
}

.list-deal-head.safe-block .tit-head.error {
    color: var(--txt-pri-error)
}

.ob-list-group {
    padding: 1.6rem 0
}

.ob-list-group .ob-list {
    width: 100%
}

.ob-list-group .ob-list-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
    padding: 1.6rem 0;
    border-bottom: 1px solid var(--border-qua)
}

.ob-list-group .ob-item-img {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding-right: 1.2rem
}

.ob-list-group .ob-item-txt {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.ob-list-group .ob-item-txt .tit {
    font-size: 1.6rem;
    line-height: 2rem;
    font-weight: 500
}

.ob-list-group .ob-item-state .complete {
    color: var(--txt-accent-sec)
}

.ob-list-group .ob-item-state .error {
    color: var(--txt-pri-error)
}

.ob-list-group .ob-item-state .loading {
    width: 2.8rem
}

.ob-list-group .ob-item-error .error-txt {
    font-weight: 500;
    color: var(--txt-pri-error)
}

.ob-list-group .ob-item-error .tooltip-group .ico-help {
    -webkit-filter: var(--filter-pri-up);
    filter: var(--filter-pri-up)
}

.list-deal-group.custom-policy .list-item {
    padding: 2rem 0;
    border: none
}

.list-deal-group.custom-policy .list-item .box-row-state {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.list-deal-group.custom-policy .list-item .list-num {
    margin-right: 1.2rem;
    color: var(--txt-quin);
    font-weight: bold
}

.list-deal-group.custom-policy .list-item .list-num.accent {
    color: var(--txt-accent-sec)
}

.list-deal-group.custom-policy .list-item .logo-area {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 5.2rem;
    height: 5.2rem;
    margin-right: 1.2rem;
    border: 0.6px solid var(--border-img);
    border-radius: 2rem
}

.list-deal-group.custom-policy .list-item .logo-area img {
    width: 3.8rem;
    height: 3.8rem
}

.list-deal-group.custom-policy .list-item .logo-area .tag {
    position: absolute;
    left: -0.4rem;
    top: -0.5rem
}

.list-deal-group.custom-policy .list-item .logo-area i {
    width: 2.4rem;
    height: 2.4rem
}

.list-deal-group.custom-policy .list-item .tit-list {
    width: 100%;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    color: var(--txt-sec);
    font-weight: bold
}

.list-deal-group.custom-policy .box-state {
    margin-top: 0.4rem
}

.list-deal-group.custom-policy .box-state span {
    font-size: 1.4rem;
    color: var(--txt-ter)
}

.list-deal-group.custom-policy .box-state .txt-info {
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden
}

.list-deal-group.custom-policy .box-state .txt-d-day {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto
}

.list-deal-group.custom-policy .tag-area {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-top: 1rem
}

.list-deal-group.custom-policy .tag-area .tag {
    height: 2.2rem;
    margin-right: 0.6rem;
    margin-bottom: 0.6rem;
    padding: 0.4rem 0.6rem 0.4rem;
    border-radius: 0.4rem;
    background-color: var(--color-in25)
}

.list-deal-group.custom-policy .tag-area .tag [class^="ico"] {
    width: 1.2rem;
    height: 1.2rem;
    margin-right: 0.4rem;
    -webkit-filter: var(--filter-pl);
    filter: var(--filter-pl)
}

.list-deal-group.custom-policy .tag-area .tag .txt {
    font-size: 1.2rem;
    font-weight: 500;
    line-height: 1.4rem
}

.list-deal-group.custom-policy .like-area {
    margin-left: auto
}

.list-deal-group.custom-policy.type2 .list-item {
    padding: 1.6rem 0 2rem
}

.list-deal-group.custom-policy.type2 .list-item .box-row-state {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.list-deal-group.custom-policy.type2 .list-item .tit-list {
    margin-top: 0.2rem
}

.list-deal-group.upbit-lounge .list-item {
    border-bottom: 0
}

.list-deal-group.upbit-lounge .section-tap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 2.4rem 0 !important
}

.list-deal-group.upbit-lounge .row-head {
    display: block;
    margin: 0 1.2rem 0 0
}

.list-deal-group.upbit-lounge .row-content {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    overflow: hidden
}

.list-deal-group.upbit-lounge .area-ico {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 3.4rem;
    flex: 0 0 3.4rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: relative;
    width: 3.4rem;
    height: 3.4rem;
    border-radius: 999rem;
    overflow: hidden
}

.list-deal-group.upbit-lounge .area-ico.noimg {
    background-color: var(--bg-ter);
    font-size: 1.2rem;
    font-weight: 500;
    line-height: 1.6rem;
    color: var(--txt-sec)
}

.list-deal-group.upbit-lounge .area-ico::after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    border: 1px solid var(--color-pb5);
    border-radius: 999rem
}

.list-deal-group.upbit-lounge .area-ico img {
    width: 100%
}

.list-deal-group.upbit-lounge .txt-detail {
    color: var(--txt-sec)
}

.list-deal-group.upbit-lounge .txt-amount strong {
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 2.1rem;
    color: var(--txt-sec)
}

.list-deal-group.upbit-lounge .txt-memo .txt {
    color: var(--txt-quin)
}

/*!
* component element
* list
* 혜택존 가이드
*/

.list-benefit-group {
    padding: 3.2rem 2rem;
    border-radius: 1.2rem;
    background-color: var(--color-w100)
}

.list-benefit-group.bg-qua {
    background-color: var(--bg-qua)
}

.list-benefit-group .list-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.list-benefit-group .list-item+.list-item {
    margin-top: 2rem
}

.list-benefit-group .txt-area {
    margin-left: 0.8rem
}

.list-benefit-group .txt-area .tit {
    display: block;
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 2rem;
    color: var(--txt-sec-active)
}

.list-benefit-group .txt-area .desc {
    display: block;
    margin-top: 0.4rem;
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--txt-qua)
}

.list-linebox-group.financial-scam .tit-area pre {
    font-family: 'Pretendard K Edition', -apple-system, BlinkMacSystemFont, system-ui, Roboto, 'Helvetica Neue', 'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', sans-serif;
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 2rem;
    color: var(--txt-sec);
    white-space: normal
}

.list-linebox-group.financial-scam .section-link {
    padding: 1.4rem 0
}

.list-linebox-group.financial-scam .col-img {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 7.4rem;
    flex: 0 0 7.4rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    overflow: hidden;
    position: relative;
    width: 7.4rem;
    height: 7.4rem;
    margin-left: 2rem;
    border-radius: 1.4rem
}

.list-linebox-group.financial-scam .col-img img {
    position: absolute;
    top: 50%;
    left: 50%;
    height: 7.4rem;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    max-width: none
}

.list-linebox-group.financial-scam .tit-area [class^="txt"] {
    display: -webkit-box;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    max-width: 25rem;
    white-space: pre-wrap
}

.list-linebox-group.financial-scam .tit-area .txt-lv01 {
    line-height: 2.2rem
}

.list-linebox-group.invest-school-list .list-row {
    margin-top: 2.8rem
}

.list-linebox-group.invest-school-list .section-link {
    width: 100%;
    max-width: 100%;
    padding: 0
}

.list-linebox-group.invest-school-list .list-item {
    padding: 0
}

.list-linebox-group.invest-school-list .list-item:not(:first-of-type) {
    margin-top: 3.2rem
}

.list-linebox-group.invest-school-list .invest-school-list-img {
    border-radius: 1.8rem;
    overflow: hidden;
    width: 8rem;
    height: 8rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-right: 1.6rem;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.list-linebox-group.invest-school-list .invest-school-list-img img {
    width: 100%;
    height: 100%
}

.list-linebox-group.invest-school-list .invest-school-list-tit [class^="ico-"] {
    line-height: 2rem
}

.list-linebox-group.invest-school-list .invest-school-list-tit pre {
    overflow: hidden;
    max-width: 100%;
    font-family: 'Pretendard K Edition', -apple-system, BlinkMacSystemFont, system-ui, Roboto, 'Helvetica Neue', 'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', sans-serif;
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 2rem;
    color: var(--txt-sec);
    white-space: normal
}

.list-linebox-group.invest-school-list .invest-school-list-right {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    height: 8rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding-top: 0.3rem;
    padding-bottom: 0.3rem
}

.invest-school-editor .card-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.invest-school-editor-tit [class^="ico-"] {
    -webkit-transform: translateY(-0.16rem);
    -ms-transform: translateY(-0.16rem);
    transform: translateY(-0.16rem)
}

.invest-school-editor-thum {
    width: 4rem;
    height: 4rem;
    border-radius: 50%;
    border: 1px solid #d9d9d9;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    margin-right: 1rem;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.invest-school-editor-contents {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    -ms-flex-negative: 1;
    flex-shrink: 1;
    overflow: hidden;
    min-width: 0
}

.invest-school-editor-name {
    font-size: 1.6rem;
    line-height: 2rem;
    font-weight: 700;
    color: var(--txt-pri);
    overflow: hidden;
    white-space: nowrap;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis
}

.invest-school-editor-info {
    margin-top: 1.6rem;
    font-size: 1.5rem;
    line-height: 2.4rem;
    font-weight: 400;
    color: var(--txt-ter);
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical
}

.list-infobox-group .item-box-sub.guarantee .txt-sub {
    margin-top: 0.2rem;
    font-size: 1.2rem !important;
    line-height: 1.6rem !important
}

.list-linebox-group.ty02 .list-row .list-item:last-child {
    border-bottom: none
}

.list-linebox-group.ty02 .list-row .list-item .section-link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 2.4rem 0
}

.list-linebox-group.ty02 .list-row .list-item .section-link .logo-area {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    margin-right: 1.2rem
}

.list-linebox-group.ty02 .list-row .list-item .section-link .tit-area {
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.list-linebox-group.ty02 .list-row .list-item .section-link .tit-area .label {
    max-width: calc(100% - 8rem);
    overflow: hidden;
    white-space: nowrap;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    font-size: 1.6rem;
    font-weight: 500;
    line-height: 2rem;
    color: var(--txt-pri);
    margin-right: .6rem
}

.list-linebox-group.ty02 .list-row .list-item .section-link .tit-area .tag {
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.list-linebox-group.ty02 .list-row .list-item .section-link .tit-area .desc {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    width: 100%;
    margin-top: .4rem;
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 2rem;
    color: var(--txt-ter);
    overflow: hidden;
    white-space: nowrap;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis
}

.list-linebox-group.ty02 .list-row .list-item .section-link.disabled .logo-area {
    opacity: .5
}

.list-linebox-group.ty02 .list-row .list-item .section-link.disabled .tit-area .label {
    color: var(--txt-disabled)
}

.list-linebox-group.ty02 .list-row .list-item .section-link.disabled .tit-area .desc {
    color: var(--txt-disabled)
}

.list-card-group .list-item+.list-item {
    margin-top: 0.4rem
}

.list-card-group .section-link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 1.8rem 0;
    overflow: hidden
}

.list-card-group .section-link.active {
    -webkit-transform: scale(0.95);
    -ms-transform: scale(0.95);
    transform: scale(0.95)
}

.list-card-group .item-number {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 1.6rem;
    flex: 0 0 1.6rem;
    margin-right: 1.4rem;
    font-size: 1.4rem;
    line-height: 2;
    color: var(--txt-ter);
    text-align: center;
    white-space: nowrap
}

.list-card-group .list-item:nth-child(-n+3) .item-number {
    font-weight: 700;
    color: var(--txt-pri)
}

.list-card-group .item-img {
    -ms-flex-preferred-size: 2.8rem;
    flex-basis: 2.8rem;
    margin-right: 1.6rem
}

.list-card-group .item-img img {
    width: 2.8rem
}

.list-card-group .item-txt {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    overflow: hidden
}

.list-card-group .item-txt .tit {
    font-size: 1.6rem;
    font-weight: 500;
    line-height: 2rem;
    color: var(--txt-pri);
    word-break: keep-all
}

.list-card-group .item-txt .txt {
    margin-top: 0.4rem;
    font-size: 1.4rem;
    line-height: 1.6rem;
    color: var(--txt-qua);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden
}

.list-card-group .item-txt.line-clamp-1 .tit,
.list-card-group .item-txt.line-clamp-1 .txt {
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden
}

.list-card-group .item-btn {
    margin-left: 1.6rem
}

.list-card-group .btn-lv03 {
    max-width: 9rem;
    height: 2.8rem;
    padding: 0 0.6rem
}

.list-card-group .btn-lv03 .txt {
    max-width: 100%;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 1.3rem
}

.list-card-group .section-link:active {
    -webkit-animation: list-card-active 0.1s ease-in-out forwards;
    animation: list-card-active 0.1s ease-in-out forwards;
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1)
}

.temp-card-list.top10 {
    padding: 0 1.8rem
}

@-webkit-keyframes list-card-active {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }
    100% {
        -webkit-transform: scale(0.95);
        transform: scale(0.95)
    }
}

@keyframes list-card-active {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }
    100% {
        -webkit-transform: scale(0.95);
        transform: scale(0.95)
    }
}

.list-linebox-group.card .list-item:last-child {
    border-bottom: 0
}

.list-linebox-group.card .section-link {
    padding: 1.8rem 0
}

.list-linebox-group.card.hover .section-link:active {
    -webkit-animation: list-card-active 0.1s ease-in-out forwards;
    animation: list-card-active 0.1s ease-in-out forwards;
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1)
}

.list-linebox-group.card .col-img {
    -ms-flex-preferred-size: 6.4rem;
    flex-basis: 6.4rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 6.4rem;
    height: 6.4rem;
    margin-right: 1.6rem;
    border-radius: 1rem;
    background-color: var(--bg-qua)
}

.list-linebox-group.card .col-img i {
    width: 4.8rem;
    height: 4.8rem
}

.list-linebox-group.card .col-img img {
    width: 4.8rem
}

.list-linebox-group.card .col-tit {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.list-linebox-group.card .txt-state {
    margin-top: 0.4rem;
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--txt-ter)
}

.list-cardicon-group {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(7.1rem, 1fr));
    margin: 0 -1.15rem;
    padding: 0.4rem 0 2rem
}

.list-cardicon-group .list-item {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: 2.4rem 0 0 0
}

.list-cardicon-group .list-item:last-child {
    margin-right: 0
}

.list-cardicon-group .section-link {
    display: block;
    width: 4.8rem;
    text-align: center
}

.list-cardicon-group.hover .section-link:active {
    -webkit-animation: list-card-active 0.1s ease-in-out forwards;
    animation: list-card-active 0.1s ease-in-out forwards;
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1)
}

.list-cardicon-group .section-link .img {
    display: block;
    width: 4.4rem;
    height: 4.4rem;
    margin: 0 auto;
    border-radius: 99rem;
    overflow: hidden
}

.list-cardicon-group .section-link .img img {
    width: 100%
}

.list-cardicon-group .section-link .txt {
    display: block;
    margin-top: 0.6rem;
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--txt-qua)
}

.list-linebox-group.support-fund .logo-area {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-right: 1.6rem;
    width: 3.6rem;
    height: 3.6rem;
    border-radius: 1.4rem;
    background-color: var(--bg-qua)
}

.list-linebox-group.support-fund .section-link {
    padding: 0.8rem 0
}

.list-linebox-group.support-fund .col-tit {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.component-link-list.component-link-list-subpage {
    position: relative;
    margin: 0;
    padding: 0;
    background-color: var(--bg-base)
}

.component-link-list.component-link-list-subpage .title-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    padding: 2.4rem 2rem 1.6rem 2rem
}

.component-link-list.component-link-list-subpage .title-group [class^="ico-"] {
    margin-left: 0.2rem
}

.component-link-list.component-link-list-subpage .item-group {
    overflow: hidden
}

.component-link-list.component-link-list-subpage .link-list-group.left .link-list .item-text {
    -webkit-box-flex: 0;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 1.6rem;
    line-height: 2rem;
    color: var(--txt-pri)
}

.component-link-list.component-link-list-subpage .link-list .tag {
    margin-left: 0.4rem;
    margin-right: 0.8rem
}

.component-link-list.component-link-list-subpage .txt-ranking {
    margin-right: 0.8rem;
    background: -o-linear-gradient(315deg, var(--color-vo700), var(--color-in800));
    background: linear-gradient(135deg, var(--color-vo700), var(--color-in800));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 1.5rem;
    line-height: 2.4rem;
    font-weight: 500;
    white-space: nowrap
}

.component-link-list.component-link-list-subpage .ico-arrow-link {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 1.6rem;
    flex: 0 0 1.6rem;
    margin-left: auto
}

.component-link-list.component-link-list-subpage .link-list-group {
    padding: 0 1.6rem 2.4rem 2rem
}

.component-link-list.component-link-list-subpage .link-list:not(:last-child) {
    margin-bottom: 1.6rem
}

.component-link-list.component-link-list-subpage .link-list a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.thumb-reverse-list ul li {
    margin-bottom: 3.6rem
}

.thumb-reverse-list ul li a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.thumb-reverse-list ul li a strong {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 100%;
    flex: 1 1 100%;
    font-size: 1.6rem;
    line-height: 2.1rem;
    color: var(--txt-sec);
    font-weight: 700;
    display: -webkit-box;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2
}

.thumb-reverse-list ul li a .thumb {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 7.4rem;
    flex: 0 0 7.4rem;
    width: 7.4rem;
    height: 7.4rem;
    margin-left: 2rem;
    border-radius: 1.4rem;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    overflow: hidden
}

.thumb-reverse-list ul li a .thumb img {
    position: absolute;
    top: 50%;
    left: 50%;
    height: 7.4rem;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    max-width: none
}

.row-box .left {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.row-box .left .tag {
    margin-left: 0.4rem
}

.list-linebox-group.upbit-service .section-link {
    padding: 0
}

.list-linebox-group.upbit-service .list-item {
    margin-top: 2rem
}

.list-linebox-group.upbit-service .col-img {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 5.4rem;
    flex: 0 0 5.4rem;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 5.4rem;
    height: 5.4rem;
    margin-right: 1.2rem;
    border-radius: 2rem;
    background-color: var(--bg-ter)
}

.list-linebox-group.upbit-service .col-tit {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    margin-right: 1.6rem
}

.list-linebox-group.upbit-service .txt-state {
    margin-top: 0.2rem;
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--txt-qua)
}

.list-linebox-group.upbit-service .tit-list {
    font-size: 1.6rem;
    font-weight: 700 !important;
    line-height: 2rem
}

.list-linebox-group.upbit-service .ico-arrow-link {
    -webkit-filter: var(--filter-g400);
    filter: var(--filter-g400)
}

.list-linebox-group.upbit-service .col-state {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.list-linebox-group.upbit-news .list-item+.list-item {
    margin-top: 3.2rem
}

.list-linebox-group.upbit-news .section-link {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    padding: 0
}

.list-linebox-group.upbit-news .col-img {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 7.2rem;
    flex: 0 0 7.2rem;
    position: relative;
    height: 7.2rem;
    margin-right: 1.6rem;
    border-radius: 1.6rem;
    overflow: hidden
}

.list-linebox-group.upbit-news .col-img img {
    height: 7.2rem;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.list-linebox-group.upbit-news .col-tit {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.list-linebox-group.upbit-news .tit-area {
    margin-top: 0.2rem
}

.list-linebox-group.upbit-news .box-state {
    margin-top: 0.4rem
}

.list-linebox-group.upbit-news .box-state span+span:before {
    background: var(--border-quin)
}

.list-linebox-group.upbit-news .txt-state {
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--txt-quin)
}

.list-linebox-group.upbit-news .txt-tit {
    display: -webkit-box;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    font-size: 1.6rem;
    font-weight: 500;
    line-height: 2.2rem;
    color: var(--txt-sec)
}

.list-linebox-group .num-area {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    min-width: 2rem;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: var(--txt-quin);
    font-weight: 700;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.list-linebox-group .num-area.num-1 {
    min-width: 1.4rem
}

.list-linebox-group .num-area+.cont-area {
    margin-left: 1.2rem
}

.list-linebox-group .num-area+.tit-area {
    margin-left: 1.2rem
}

.list-linebox-group.list-market-index .col-tit,
.list-linebox-group.list-market-index .col-tit .tit-area {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.list-linebox-group.list-market-index .col-tit .tit-area .box-txt>[class^="txt-"].line-clamp-1 {
    max-width: calc(100% - 0.42rem)
}

.list-linebox-group.list-market-index .col-tit .cont-area:first-of-type {
    margin-left: 0.4rem
}

.list-linebox-group.list-market-index .col-tit .cont-area:first-of-type+.tit-area {
    margin-right: 0.4rem
}

.list-linebox-group.list-market-index [class*=box-market-index] {
    margin-right: 0.4rem
}

.list-linebox-group.list-market-index .a11y .section-link {
    padding-right: 6.8rem
}

.list-linebox-group.list-market-index .box-state .txt-state {
    font-size: 1.4rem;
    color: var(--txt-qua)
}

.list-linebox-group.list-market-index .col-tit .num-area+.cont-area {
    margin-top: 2px
}

.list-linebox-group.list-market-index-search .section-link {
    padding: 1.6rem 2.4rem 1.2rem 2rem
}

.list-linebox-group.list-market-index-search .col-state {
    white-space: nowrap
}

.list-linebox-group.list-market-index-share .section-link {
    padding: 1.6rem 2rem
}

.list-linebox-group.list-market-index-share .col-state {
    white-space: nowrap;
    margin-left: 0.4rem
}

.list-infobox-group.ty06 .list-infobox-result {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: end;
    margin-bottom: 2rem
}

.list-infobox-group.ty06 .item-box-sub .area-term {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.list-infobox-group.ty06 .item-box-sub .area-term [class^="ico-"] {
    margin-right: .4rem
}

.list-infobox-group.ty06 .item-box-sub .area-desc {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.list-infobox-group.ty06 .item-box-sub .area-desc [class^="ico-"] {
    margin-right: .4rem
}

.list-linebox-group.bd-top .list-item {
    border-bottom: none
}

.list-linebox-group.bd-top .section-link {
    border-bottom: 1px solid var(--border-qua)
}

.list-linebox-group.bd-top .accordion-cont {
    padding: 0 2rem 4.8rem
}

.list-linebox-group.bd-top .accordion-cont .list-item {
    border: none
}

.list-infobox-group .item-box-sub.type-2 .row-box .tit-box-sub {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-bottom: 1.6rem;
    font-size: 1.6rem
}

.list-infobox-group .item-box-sub.type-2 .row-box+.row-box {
    padding-top: 1.6rem;
    margin-top: 1.6rem
}

.list-infobox-group .item-box-sub.type-2 .box-sub+.box-sub {
    margin-top: 1.6rem
}

.mission-list-group .list-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 1.4rem 0
}

.mission-list-group .img-wrap {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 3.6rem;
    flex: 0 0 3.6rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 3.6rem;
    height: 3.6rem;
    margin-right: 1.6rem;
    border-radius: 1.4rem;
    background-color: var(--color-w15)
}

.mission-list-group .txt-wrap {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.mission-list-group .txt-wrap .txt-tit {
    font-size: 1.6rem;
    font-weight: 500;
    line-height: 2.1rem;
    color: var(--txt-pri-invert)
}

.mission-list-group .txt-wrap .txt-guide {
    margin-top: 0.4rem;
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--txt-sec-invert)
}

.mission-list-group .btn-wrap {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    margin-left: 1.6rem
}

.mission-list-group .btn-wrap .btn-lv03 {
    min-width: 8.9rem;
    height: 4rem;
    padding: 0 1.4rem;
    background-color: var(--color-g800)
}

.mission-list-group .btn-wrap .btn-lv03 .txt {
    color: var(--color-in200)
}

.mission-list-group .btn-wrap .btn-lv03.primary2 {
    background-color: var(--bg-accent-pri)
}

.mission-list-group .btn-wrap .btn-lv03.primary2 .txt {
    color: var(--txt-pri-invert)
}

.mission-list-group .btn-wrap .btn-lv03.finish .txt {
    color: var(--txt-disabled-invert)
}

/*!
* component element
* popup
* common style
*/

.popup-wrap .dimm {
    display: none;
    position: fixed;
    top: -100px;
    right: -100px;
    bottom: -100px;
    left: -100px;
    z-index: 99;
    background: var(--color-pb100, #000);
    opacity: .6
}

.popup-wrap .dimm.none {
    opacity: 0 !important
}

.popup-wrap .popup-dialog {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    opacity: 0;
    overflow: auto;
    z-index: 150;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    display: none
}

.popup-wrap .popup-group {
    width: 100%;
    position: relative;
    background-color: var(--color-w100, #fff)
}

.popup-wrap .btn-popup-close {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 6.4rem;
    height: 5rem;
    position: absolute;
    top: 0;
    right: 0
}

.popup-wrap .btn-popup-close .ico-line {
    width: 2rem;
    height: 2rem
}

.popup-wrap .btn-popup-close .ico-line:after,
.popup-wrap .btn-popup-close .ico-line:before {
    background-color: var(--color-g900, #141414)
}

.popup-wrap .btn-confirm {
    position: absolute;
    top: 0;
    right: 2rem;
    margin: 0.3rem 0 0 1.6rem
}

.popup-wrap .btn-confirm .txt-lv01 {
    color: var(--color-g900, #141414)
}

.popup-wrap .btn-confirm.disabled .txt-lv01 {
    color: var(--color-g400, #c7c7c7)
}

/*!
* component element
* popup
* full type
*/

.popup-dialog.ui-full {
    margin: auto;
    width: 100%;
    height: 100%;
    background-color: var(--color-w100, #fff)
}

.popup-dialog.ui-full .btn-popup-close {
    width: 6.4rem;
    height: 5rem
}

.popup-dialog.ui-full .btn-popup-close .ico-line {
    width: 2rem;
    height: 2rem
}

.popup-dialog.ui-full .btn-back {
    position: absolute;
    top: 0;
    left: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 4.8rem;
    height: 5rem;
    z-index: 1
}

.popup-dialog.ui-full .btn-confirm {
    right: .8rem;
    padding: 0 1.2rem;
    margin: 0;
    line-height: 2.1rem;
    height: 5rem
}

.popup-dialog.ui-full .popup-section {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    width: 100%
}

.popup-dialog.ui-full .popup-group {
    height: 100%
}

.popup-dialog.ui-full .popup-group.bg-gray {
    background: var(--color-g100, #f8f8f8)
}

.popup-dialog.ui-full .popup-group.bg-pri-invert {
    background: var(--bg-pri-invert)
}

.popup-dialog.ui-full .popup-header {
    position: fixed;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 100%;
    z-index: 4;
    background-color: var(--color-w100, #fff);
    height: 5.0rem
}

.popup-dialog.ui-full .popup-header .tit-head {
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: 400
}

.popup-dialog.ui-full .popup-content,
.popup-dialog.ui-full-change .popup-content {
    padding-top: 5.0rem
}

.popup-dialog.ui-full .popup-content.shield {
    display: block;
    height: 100%
}

.popup-dialog.ui-full .popup-content.h100 {
    height: 90%;
    padding-top: 0
}

.popup-dialog.ui-full .popup-content.h100 .popup-inner {
    height: 90%;
    padding: 0
}

.popup-dialog.ui-full .popup-content .popup-inner {
    padding: 0 0 15.4rem
}

.popup-dialog.ui-full .popup-content .popup-inner .component-board:first-child {
    margin-top: 0
}

.popup-dialog.ui-full .popup-content .popup-inner .component-list:first-child {
    margin-top: 2.4rem
}

.popup-dialog.ui-full .popup-content .popup-inner .component-card-bg,
.popup-dialog.ui-full .popup-content .popup-inner .component-keypad {
    margin-top: 0
}

.popup-dialog.ui-full .popup-content .popup-inner .component-text-h64 {
    margin-top: 6.4rem;
    padding: 0 2.0rem
}

.popup-dialog.ui-full .popup-content .popup-inner .component-text-simple {
    margin-top: 2.4rem
}

.popup-dialog.ui-full .popup-content .popup-inner .component-text-simple+.component-list-linebox {
    margin-top: 4.8rem
}

.popup-dialog.ui-full .popup-content .popup-inner.no-space {
    padding: 0
}

.popup-dialog.ui-full .popup-content .popup-inner>.component-text-complex {
    padding-top: 2.4rem
}

.popup-wrap.popup-mission-talisman .popup-dialog.ui-full {
    background-color: transparent
}

.popup-wrap.popup-mission-talisman .popup-dialog.ui-full .popup-header {
    background-color: transparent
}

.popup-wrap.popup-mission-talisman .popup-group.mission-talisman {
    background-color: transparent;
    z-index: 1;
    overflow-x: hidden
}

.popup-wrap.popup-mission-talisman .popup-group.mission-talisman::before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: var(--color-pb70);
    -webkit-backdrop-filter: blur(1.6rem);
    backdrop-filter: blur(1.6rem);
    will-change: backdrop-filter
}

.popup-wrap.popup-mission-talisman .popup-dialog.ui-full .btn-popup-close {
    right: 0.8rem;
    width: 4.8rem;
    height: 4.8rem
}

.popup-wrap.popup-mission-talisman .popup-dialog.ui-full.popup-blur {
    background-color: var(--color-pb70);
    -webkit-backdrop-filter: blur(1.6rem);
    backdrop-filter: blur(1.6rem);
    will-change: backdrop-filter
}

.popup-wrap.popup-mission-talisman .popup-dialog.ui-full.popup-blur .popup-group.mission-talisman::before {
    display: none
}

/*!
* component element
* popup
* simple type
*/

.popup-dialog.ui-simple {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.popup-dialog.ui-simple .popup-section {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    width: 100%;
    margin: auto;
    padding: 2rem
}

.popup-dialog.ui-simple .popup-group {
    border-radius: 2.0rem;
    padding: 3.2rem 2rem 2rem
}

.popup-dialog.ui-simple .popup-header .title-group {
    text-align: center;
    color: var(--color-g900, #141414)
}

.popup-dialog.ui-simple .popup-content {
    margin-top: 3.2rem
}

.popup-dialog.ui-simple .popup-content+.popup-footer {
    margin-top: 3.2rem
}

.popup-dialog.ui-simple .popup-footer {
    margin-top: 3.2rem
}

/*!
* component element
* popup
* bottom type
*/

.popup-dialog.ui-bottom .btn-popup-close {
    width: 3rem;
    height: 3rem;
    top: 0;
    right: 1.7rem
}

.popup-dialog.ui-bottom .btn-popup-close .ico-line {
    width: 2rem;
    height: 2rem
}

.popup-dialog.ui-bottom .popup-group {
    position: fixed;
    bottom: 0;
    left: 0;
    padding: 3.2rem 0 2.4rem;
    border-radius: 2.0rem 2.0rem 0 0;
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    max-height: 70vh
}

.popup-dialog.ui-bottom .popup-section.hv-60 .popup-group {
    max-height: 60vh
}

.popup-dialog.ui-bottom .popup-section.scrollarea-list-5 .popup-group {
    max-height: 45.3rem
}

.popup-dialog.ui-bottom .popup-section.scrollarea-list-4 .popup-group {
    max-height: 37.6rem
}

.popup-dialog.ui-bottom .popup-section.scrollarea-select-double-3 .popup-group {
    max-height: 42.8rem
}

.popup-dialog.ui-bottom .popup-header {
    position: relative;
    padding: 0 2rem 2.4rem
}

.popup-dialog.ui-bottom .popup-header+.popup-content {
    margin-top: 0;
    padding: 0 0 3.2rem
}

.popup-dialog.ui-bottom.pop-bot-shadow .popup-header+.popup-content {
    padding: 0 0 5.6rem
}

.popup-dialog.ui-bottom.pop-bot-shadow[data-type="calendar"] .popup-header+.popup-content {
    padding: 2rem 2rem 5.6rem
}

.popup-dialog.ui-bottom .popup-header+.popup-content.top-space01 {
    margin-top: 3.2rem
}

.popup-dialog.ui-bottom .popup-header+.popup-content.top-space01+.popup-footer {
    margin-top: 0
}

.popup-dialog.ui-bottom .popup-header+.popup-footer {
    margin-top: 0.8rem
}

.popup-dialog.ui-bottom .popup-header.flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.popup-dialog.ui-bottom .popup-header.flex .btn-confirm {
    position: inherit;
    top: inherit;
    right: inherit;
    margin: 0.3rem 0 0 1.6rem;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.popup-dialog.ui-bottom .popup-header.flex2 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.popup-dialog.ui-bottom .popup-header.flex2 .btn-back {
    margin-right: .4rem
}

.popup-dialog.ui-bottom .popup-header .keyword-select-chips .btn-open {
    display: block
}

.popup-dialog.ui-bottom .popup-content {
    position: relative;
    overflow-y: auto;
    -ms-scroll-chaining: none;
    overscroll-behavior: contain
}

.popup-dialog.ui-bottom .popup-content+.popup-footer {
    position: relative;
    z-index: 2;
    margin-top: 0
}

.popup-dialog.ui-bottom .popup-content+.popup-footer.simple-popup-footer {
    margin: -3.6rem 0 0;
    padding-top: 3.2rem;
    z-index: 1
}

.popup-dialog.ui-bottom .popup-header .tit-head {
    font-size: 2.1rem;
    line-height: 2.7rem;
    font-weight: bold
}

.popup-dialog.ui-bottom .popup-header .txt-sub {
    margin-top: 1.6rem;
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400;
    color: var(--color-g700, #7d7d7d)
}

.popup-dialog.ui-bottom .popup-inner {
    padding: 0 2.0rem;
    overflow: hidden;
    max-height: none
}

.popup-dialog.ui-bottom .popup-inner.max-height-none {
    max-height: none
}

.popup-dialog.ui-bottom .popup-inner.no-space {
    padding: 0
}

.popup-dialog.ui-bottom .popup-inner.no-space .component-text {
    margin: 1.6rem 2rem 0
}

.popup-dialog.ui-bottom .popup-footer {
    padding: 0 2.0rem
}

.pop-bot-shadow.popup-dialog.ui-bottom[data-type="banner"] .popup-content+.popup-footer:before {
    content: none
}

.popup-dialog.ui-bottom[data-type="banner"] .popup-group {
    padding: 0 0 2.4rem
}

.popup-dialog.ui-bottom[data-type="banner"] .popup-inner {
    padding: 0
}

.popup-dialog.ui-bottom[data-type="banner"] .banner-link img {
    display: block;
    width: 100%
}

.popup-dialog.ui-bottom[data-type="banner"] .btn-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-top: -1rem
}

.popup-dialog.ui-bottom .form-row:first-child .form-tit.tit-small {
    margin-top: 0
}

/*!
* component element
* popup
* bottom select type
* select type
*/

.popup-dialog.ui-bottom[data-type^="select"] .popup-inner {
    padding: 0;
    max-height: none
}

.popup-dialog.ui-bottom[data-type^="select"] .btn-option {
    display: block;
    width: 100%;
    text-align: left;
    padding: 1.6rem 2rem;
    color: var(--color-g900, #141414);
    font-size: 1.6rem;
    line-height: 2rem;
    font-weight: 500;
    font-variant-numeric: inherit
}

:root .popup-dialog.ui-bottom[data-type^="select"] .btn-option {
    color: var(--txt-pri, #020616)
}

.popup-dialog.ui-bottom[data-type^="select"] .select-item:first-child .btn-option.selected:after,
.popup-dialog.ui-bottom[data-type^="select"] .swiper-slide:first-child .btn-option.selected:after {
    margin-top: -1.2rem
}

.popup-dialog.ui-bottom[data-type^="select"] .btn-option.selected {
    position: relative
}

.popup-dialog.ui-bottom[data-type^="select"] .btn-option.selected:after {
    content: '';
    display: block;
    width: 2.4rem;
    height: 2.4rem;
    position: absolute;
    top: 50%;
    right: 2rem;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    background-image: var(--path-solid-colored-check-ico-pri-success);
    background-size: contain;
    background-repeat: no-repeat
}

:root .popup-dialog.ui-bottom[data-type^="select"] .btn-option.selected:after {
    background-image: var(--path-checkbox-line-active);
    -webkit-filter: var(--filter-in900);
    filter: var(--filter-in900)
}

.popup-dialog.ui-bottom[data-type^="select"] .btn-option.selected:disabled:after {
    -webkit-filter: var(--filter-g400);
    filter: var(--filter-g400)
}

.popup-dialog.ui-bottom[data-type^="select"] .select-item.bank .btn-option.selected:after {
    display: none
}

:root .popup-dialog.ui-bottom[data-type^="select"] .select-item.stock .btn-option.selected:after {
    display: none
}

.popup-dialog.ui-bottom[data-type^="select"] .btn-option.text-disabled,
.popup-dialog.ui-bottom[data-type^="select"] .btn-option:disabled {
    color: var(--color-g400, #c7c7c7)
}

.popup-dialog.ui-bottom[data-type^="select"] .btn-option.text-disabled .tit-option,
.popup-dialog.ui-bottom[data-type^="select"] .btn-option.text-disabled .txt-option,
.popup-dialog.ui-bottom[data-type^="select"] .btn-option:disabled .tit-option,
.popup-dialog.ui-bottom[data-type^="select"] .btn-option:disabled .txt-option {
    color: inherit
}

.popup-dialog.ui-bottom[data-type^="select"] .btn-option.text-disabled .area-option i i[class^="ico-"] {
    opacity: 0.3
}

:root .popup-dialog.ui-bottom[data-type^="select"] .btn-option:disabled {
    color: var(--txt-disabled)
}

.popup-dialog.ui-bottom[data-type^="select"] .btn-option [class*="ico-"]+.txt {
    margin-left: 0.8rem;
    vertical-align: middle
}

.popup-dialog.ui-bottom[data-type^="select"] .tit-option {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
    font-size: 1.6rem;
    line-height: 2rem;
    font-weight: 500
}

.popup-dialog.ui-bottom[data-type^="select"] .tit-option .tag {
    margin-left: .4rem
}

.popup-dialog.ui-bottom[data-type^="select"] .txt-option {
    display: inline-block;
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g700, #7d7d7d)
}

.popup-dialog.ui-bottom[data-type^="select"] .input-checkbox-group.left {
    margin: 1rem 2rem
}

.popup-dialog.ui-bottom[data-type^="select"] .input-checkbox-group.left .checkbox-txt-field {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400
}

.popup-dialog.ui-bottom[data-type^="select"] .select-icon .area-option {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.popup-dialog.ui-bottom[data-type^="select"] .select-icon .area-option [class^="ico-"] {
    display: inline-block;
    margin-right: 1.2rem
}

.popup-dialog.ui-bottom[data-type^="select"] .select-icon .area-option .area-txt {
    display: block
}

.popup-dialog.ui-bottom[data-type^="select"] .select-list.line .select-item {
    position: relative
}

.popup-dialog.ui-bottom[data-type^="select"] .select-list.line .select-item+.select-item:before {
    content: '';
    position: absolute;
    top: 0;
    left: 2rem;
    right: 2rem;
    height: 1px;
    background-color: var(--color-g200, #eee)
}

.popup-dialog.ui-bottom[data-type^="select"] .select-list.line-bottom .select-item:last-child::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 2rem;
    right: 2rem;
    height: 1px;
    background-color: var(--color-g200, #eee)
}

.popup-dialog.ui-bottom[data-type^="select"] .btn-option .area-option .bg-area {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 4.2rem;
    height: 4.2rem;
    margin-right: 1.2rem;
    border-radius: 1.5rem;
    background-color: var(--bg-qua)
}

.popup-dialog.ui-bottom[data-type^="select"] .btn-option .area-option .bg-area img {
    width: 3.2rem;
    height: 3.2rem
}

.popup-dialog.ui-bottom[data-type^="select"] .select-item.no-apply .bg-area {
    width: 3.2rem;
    height: 3.2rem;
    background-color: var(--bg-ter)
}

.popup-dialog.ui-bottom[data-type^="select"] .btn-option .area-option.show_img {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.popup-dialog.ui-bottom[data-type^="select"] .btn-option .area-option.show_img .logo-area+.tit-area {
    margin-left: 1.2rem
}

/*!
* component element
* popup
* bottom select type
* select line type
*/

.popup-dialog.ui-bottom[data-type^="select"] .popup-inner .swiper-wrapper.line>li+li:before {
    content: '';
    position: absolute;
    top: 0;
    left: 2rem;
    right: 2rem;
    height: 1px;
    background-color: var(--color-g200, #eee)
}

.popup-dialog.ui-bottom[data-type^="select"] .popup-inner .swiper-wrapper.line>li:last-child::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 2rem;
    right: 2rem;
    height: 1px;
    background-color: var(--color-g200, #eee)
}

/*!
* component element
* popup
* bottom select type
* tab + select type
*/

.popup-dialog.ui-bottom[data-type^="select"] .popup-group.section-component.ui-tab .tab-list {
    margin: 2.4rem -2rem 0
}

.popup-dialog.ui-bottom[data-type^="select"] .popup-group.section-component.ui-tab .popup-header {
    padding-bottom: 0.1rem
}

.popup-dialog.ui-bottom[data-type^="select"] .all-check .btn-option:after {
    content: '';
    display: block;
    width: 2.4rem;
    height: 2.4rem;
    position: absolute;
    top: 50%;
    right: 2rem;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    background-image: var(--path-checkbox-line-disabled);
    -webkit-filter: var(--filter-g500);
    filter: var(--filter-g500);
    background-size: contain;
    background-repeat: no-repeat
}

/*!
* component element
* popup
* bottom select type
* 일반 조합형
*/

.popup-dialog.ui-bottom[data-type^="select-double"] .btn-option {
    padding: 0 2.0rem
}

.popup-dialog.ui-bottom[data-type^="select-double"] .area-option {
    display: block;
    padding: 1.6rem 0;
    border-bottom: 1px solid var(--color-g200, #eee)
}

:root .popup-dialog.ui-bottom[data-type^="select-double"] .area-option {
    border-bottom: 1px solid var(--color-g300, #e0e6f1)
}

.popup-dialog.ui-bottom[data-type^="select-double"] .carousel-select-group.noline .area-option,
.popup-dialog.ui-bottom[data-type^="select-double"] .select-list.noline .area-option {
    border-bottom: 0
}

.popup-dialog.ui-bottom[data-type^="select-double"] .select-list>li:last-child .area-option,
.popup-dialog.ui-bottom[data-type^="select-double"] .swiper-wrapper>li:last-child .area-option {
    border-bottom: 0
}

.popup-dialog.ui-bottom[data-type^="select-double"] .swiper-slide:first-child .area-option {
    padding-top: 0
}

.popup-dialog.ui-bottom[data-type^="select-double"] .txt-option {
    margin-top: 0.4rem
}

.popup-dialog.ui-bottom[data-type^="select-double"] .btn-option,
.popup-dialog.ui-bottom[data-type^="select-single"] .btn-option {
    padding-right: 5rem
}

.popup-dialog.ui-bottom[data-type^="select-single"] .btn-option .area-option {
    display: block
}

.popup-dialog.ui-bottom[data-type^="select-double"] .btn-option .area-option,
.popup-dialog.ui-bottom[data-type^="select-single"] .btn-option .area-option {
    width: calc(100% + 3rem);
    padding-right: 3rem
}

.popup-dialog.ui-bottom[data-type^="select-single"] .btn-option .tag.new {
    margin-left: 0.4rem;
    vertical-align: middle
}

.popup-dialog.ui-bottom[data-type^="select-double"] .btn-option+.btn-under-link {
    padding: 0 2rem
}

/*!
/*!
* component element
* popup
* bottom select type
* wide type (icon, img)
* FETASK-1651
*/

.popup-dialog.ui-bottom[data-type^="select-double"] .carousel-select-group.wide .area-option {
    padding: 2.8rem 0
}

.popup-dialog.ui-bottom[data-type^="select-double"] .carousel-select-group.wide .area-option [class^="ico-"] {
    margin-right: 1.6rem
}

.popup-dialog.ui-bottom[data-type^="select-double"] .carousel-select-group.wide .swiper-slide:first-child .area-option {
    padding-top: 0
}

.popup-dialog.ui-bottom[data-type^="select-double"] .carousel-select-group.wide .swiper-slide.has-bg .area-option {
    padding-left: 0.8rem
}

.popup-dialog.ui-bottom[data-type^="select-double"] .carousel-select-group.wide .swiper-slide.has-bg .area-option [class^="ico-"] {
    position: relative;
    margin-right: 2.4rem
}

.popup-dialog.ui-bottom[data-type^="select-double"] .carousel-select-group.wide .swiper-slide.has-bg .area-option [class^="ico-"]::after {
    position: absolute;
    content: '';
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    left: 50%;
    width: 6.4rem;
    height: 6.4rem;
    background: var(--color-g100, #f8f8f8);
    z-index: -1;
    border-radius: 1rem
}

/*!
* component element
* popup
* bottom select type
* 오픈뱅킹 계좌선택
*/

.popup-dialog.ui-bottom[data-type^="select-openbank"] .select-list .select-item {
    position: relative
}

.popup-dialog.ui-bottom[data-type^="select-openbank"] .select-list .select-item:first-child .area-option {
    padding-top: 0
}

.popup-dialog.ui-bottom[data-type^="select-openbank"] .select-list .select-item .btn-float {
    position: absolute;
    left: 6.8rem;
    top: 4rem;
    color: var(--color-g700, #7d7d7d)
}

.popup-dialog.ui-bottom[data-type^="select-openbank"] .popup-header+.popup-content .select-item:first-child .btn-float {
    top: 2.4rem
}

.popup-dialog.ui-bottom[data-type^="select-openbank"] .select-list .select-item .btn-float .ico-refresh {
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

.popup-dialog.ui-bottom[data-type^="select-openbank"] .btn-option {
    padding: 0 2.0rem
}

.popup-dialog.ui-bottom[data-type^="select-openbank"] .area-option {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 1.6rem 0;
    border-bottom: 1px solid var(--color-g200, #eee)
}

.popup-dialog.ui-bottom[data-type^="select-openbank"] .select-list>li:last-child .area-option {
    border-bottom: 0
}

.popup-dialog.ui-bottom[data-type^="select-openbank"] .area-option .txt-option [class^="ico"] {
    margin-top: -0.2rem
}

.popup-dialog.ui-bottom[data-type^="select-openbank"] .area-option .txt-option .ico-warning {
    width: 1.6rem;
    height: 1.6rem;
    background-image: var(--path-solid-exclamation-circle);
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

.popup-dialog.ui-bottom[data-type^="select-openbank"] .ico-bank {
    margin-right: 1.2rem
}

.popup-dialog.ui-bottom[data-type^="select-openbank"] .txt-option {
    margin-top: 0.4rem
}

.popup-dialog.ui-bottom.ui-bottom-account .area-option .one-val,
.popup-dialog.ui-bottom.ui-bottom-account .one-val {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

@media all and (min-width: 360px) {
    .popup-dialog.ui-bottom[data-type^="select-openbank"] .area-option>span {
        min-height: 44px
    }
}

.popup-dialog.ui-bottom[data-type^="select-openbank"] .popup-group {
    padding-bottom: 2.4rem
}

.popup-dialog.ui-bottom[data-type^="select-openbank"] .popup-content {
    margin-bottom: 0
}

.popup-dialog.ui-bottom[data-type^="select-openbank"] .select-container {
    margin-bottom: 0
}

.popup-dialog.ui-bottom[data-type^="select-openbank"] .popup-group {}

.popup-dialog.ui-bottom[data-type^="select-openbank"] .popup-header+.popup-content:last-child {
    padding-bottom: 0
}

.popup-dialog.ui-bottom[data-type^="select-openbank"] .popup-content:last-child:before {
    content: none
}

@media screen and (max-width: 320px) {
    .popup-dialog.ui-bottom[data-type^="select-openbank"] .popup-group {
        max-height: 325px !important
    }
}

.popup-dialog.ui-bottom.ui-bottom-account[data-type^="select-single"] .select-item {
    padding: 0 2rem
}

.popup-dialog.ui-bottom.ui-bottom-account[data-type^="select-single"] .btn-option {
    padding: 2.8rem 0
}

.popup-dialog.ui-bottom.ui-bottom-account[data-type^="select-single"] .btn-option.selected:after {
    right: 0
}

.popup-dialog.ui-bottom.ui-bottom-account[data-type^="select-single"] .select-item+.select-item .btn-option {
    border-top: 1px solid var(--color-g200, #eee)
}

.select-list .select-item .dot-flashing,
.select-list .select-item .dot-flashing:after,
.select-list .select-item .dot-flashing:before {
    width: .5rem;
    height: .5rem
}

.popup-dialog.ui-bottom.account-pop .popup-group,
.popup-dialog.ui-bottom.account-pop[data-type^="select"] .popup-group {}

.popup-dialog.ui-bottom.account-pop .popup-inner {
    max-height: none
}

.popup-dialog.ui-bottom.account-pop .popup-inner .trn-list-group,
.popup-dialog.ui-bottom.account-pop[data-type^="select"] .popup-inner .swiper-container {
    margin-bottom: 0
}

.popup-dialog.ui-bottom .add-btn-group {
    position: relative
}

.popup-dialog.ui-bottom .add-btn-group .btn-option .area-option {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 1.6rem 0;
    border-bottom: 0;
    border-top: 1px solid var(--color-g200, #eee)
}

.popup-dialog.ui-bottom .add-btn-group .btn-option .area-option.line-bt {
    border-bottom: 1px solid var(--color-g200, #eee)
}

.popup-dialog.ui-bottom .add-btn-group+.add-btn-group .btn-option .area-option.line-bt {
    border-top: 0
}

.popup-dialog.ui-bottom .add-btn-group .btn-option .area-option .r-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 3.4rem;
    height: 3.4rem;
    min-height: 3.4rem;
    margin-right: 1.2rem;
    background-color: var(--bg-ter);
    border-radius: 100%
}

.popup-dialog.ui-bottom .add-btn-group .btn-option .area-option .ico-plus {
    display: block;
    width: 2rem;
    height: 2rem;
    background-size: contain;
    border-radius: 100%;
    -webkit-filter: var(--filter-ico-ter);
    filter: var(--filter-ico-ter)
}

.popup-dialog.ui-bottom .add-btn-group .area-option>span {
    min-height: auto
}

.popup-dialog.ui-bottom.ui-bottom-account[data-type^="select-single"] .add-btn-group .btn-option {
    padding: 0 2rem
}

.popup-dialog.ui-bottom.ui-bottom-account[data-type^="select-single"] .add-btn-group .btn-option .area-option {
    width: 100%;
    border-top: 1px solid var(--color-g200, #eee)
}

.popup-dialog.ui-bottom .popup-header+.popup-content .add-btn-group+.select-container .select-item:first-child {
    margin-top: 0
}

.popup-dialog.ui-bottom .popup-header+.popup-content .add-btn-group+.select-container .select-item:first-child .btn-option.selected:after,
.popup-dialog.ui-bottom .popup-header+.popup-content .add-btn-group+.select-container .swiper-slide:first-child .btn-option.selected:after {
    margin-top: 0
}

.popup-dialog.ui-bottom[data-type^="select-openbank"] .add-btn-group+.select-container .select-list .select-item:first-child .area-option {
    padding-top: 1.6rem
}

/*!
* component element
* popup
* bottom select type
* 리스트 > 텍스트 + 이미지 조합
*/

.popup-dialog.ui-bottom[data-type^="select"] .text-img-combine .btn-option {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 2rem;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.popup-dialog.ui-bottom[data-type^="select"] .text-img-combine .txt-tag {
    font-size: 1.4rem;
    line-height: 2rem
}

.popup-dialog.ui-bottom[data-type^="select"] .text-img-combine .box-title>span {
    display: block;
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: 700;
    word-break: keep-all
}

.popup-dialog.ui-bottom[data-type^="select"] .text-img-combine .img-area {
    margin-left: 1.6rem
}

.popup-dialog.ui-bottom[data-type^="select"] .text-img-combine .img-area img {
    width: 100%
}

.popup-dialog.ui-bottom[data-type^="select"] .text-img-combine .img-area img.book-img {
    width: auto;
    height: 7.2rem
}

/*!
* component element
* popup
* bottom select type
* 통신사 선택
*/

.popup-dialog.ui-bottom[data-type^="select-phone"] .popup-content+.popup-footer {
    margin-top: 2.4rem
}

.popup-dialog.ui-bottom[data-type^="select-phone"] .txt-phone {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g700, #7d7d7d);
    margin-bottom: 0.4rem
}

.popup-dialog.ui-bottom[data-type^="select-phone"] .txt-link {
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 400
}

/*!
* component element
* popup
* bottom select type
* 은행/증권사 선택
*/

.popup-dialog.ui-bottom[data-type="select-bank"] .popup-group {
    padding-bottom: 0
}

.popup-dialog.ui-bottom[data-type="select-bank"] .popup-content {
    margin-bottom: 0
}

.popup-dialog.ui-bottom[data-type="select-bank"] .select-container {
    padding: 0 2rem
}

.popup-dialog.ui-bottom[data-type="select-bank"] .select-container .select-list+.select-list {
    margin-top: 3.2rem
}

.popup-dialog.ui-bottom[data-type="select-bank"] .select-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.popup-dialog.ui-bottom[data-type="select-bank"] .select-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: calc(100% / 3 - .8rem);
    margin: 0 0.4rem;
    margin-top: 0.8rem;
    -webkit-box-flex: 0;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto
}

.popup-dialog.ui-bottom[data-type="select-bank"] .select-item:nth-child(1),
.popup-dialog.ui-bottom[data-type="select-bank"] .select-item:nth-child(2),
.popup-dialog.ui-bottom[data-type="select-bank"] .select-item:nth-child(3) {
    margin-top: 0
}

.popup-dialog.ui-bottom[data-type="select-bank"] .select-item.spacer {
    width: 100%;
    margin-top: 2.4rem
}

.popup-dialog.ui-bottom[data-type="select-bank"] .btn-option {
    position: relative;
    padding: 1.2rem 0 !important;
    background-color: var(--color-g100, #f8f8f8);
    border-radius: 0.8rem
}

:root .popup-dialog.ui-bottom[data-type="select-bank"] .btn-option {
    border-radius: 1.6rem
}

.popup-dialog.ui-bottom[data-type="select-bank"] .btn-option.selected {
    background: var(--color-cg400, #ebecf0)
}

.popup-dialog.ui-bottom[data-type="select-bank"] .btn-option:disabled {
    -webkit-filter: grayscale(1);
    filter: grayscale(1)
}

.popup-dialog.ui-bottom[data-type="select-bank"] .btn-option:disabled:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: var(--color-pb20, #00000033);
    border-radius: 1rem
}

.popup-dialog.ui-bottom[data-type="select-bank"] .area-option {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.popup-dialog.ui-bottom[data-type="select-bank"] .tit-option {
    display: inline-block;
    width: 100%;
    text-align: center;
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g900, #141414);
    margin-top: 0.6rem
}

:root .popup-dialog.ui-bottom[data-type="select-bank"] .btn-option.selected {
    background-color: var(--color-g100)
}

:root .popup-dialog.ui-bottom[data-type="select-bank"] .btn-option.selected .tit-option {
    color: var(--color-g600);
    font-weight: 400
}

:root .popup-dialog.ui-bottom[data-type="select-bank"] .tit-option {
    color: var(--color-g600, #67748e)
}

.popup-dialog.ui-bottom[data-type="select-bank"] .select-item.bank+.select-item.stock {
    margin-top: 3.2rem
}

.popup-dialog.ui-bottom[data-type="select-bank"] .select-item.bank+.select-item.stock+.select-item.stock {
    margin-top: 3.2rem
}

.popup-dialog.ui-bottom[data-type="select-bank"] .select-item.bank+.select-item.stock+.select-item.stock+.select-item.stock {
    margin-top: 3.2rem
}

.popup-dialog.ui-bottom[data-type="select-bank"] .select-list.type2 .select-item {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

/*!
* component element
* popup
* bottom calendar type
*/

.pop-bot-shadow.popup-dialog.ui-bottom[data-type="calendar"] .popup-content+.popup-footer:before {
    content: none
}

.popup-dialog.ui-bottom[data-type="calendar"] .popup-group>.popup-content {
    height: 32.4rem
}

.popup-dialog.ui-bottom[data-type="calendar"] .popup-group>.popup-content+.popup-footer {
    margin-top: 1.2rem !important
}

.popup-dialog.ui-bottom[data-type="calendar"] .popup-group {
    padding-bottom: 3.2rem
}

:root .popup-dialog.ui-bottom[data-type="calendar"] .popup-group {
    padding-bottom: 2.6rem
}

.popup-dialog.ui-bottom[data-type="calendar"] .popup-content {
    padding: 0 2.0rem
}

.popup-dialog.ui-bottom[data-type="calendar"] .jui-widget {
    font-family: inherit
}

.popup-dialog.ui-bottom[data-type="calendar"] .jui-widget.jui-widget-content {
    width: 100%;
    border: 0
}

.popup-dialog.ui-bottom[data-type="calendar"] .jui-widget-header {
    background: none;
    border: none
}

.popup-dialog.ui-bottom[data-type="calendar"] .jui-datepicker .jui-datepicker-title {
    font-size: 2.1rem;
    font-weight: bold;
    position: relative;
    text-align: left;
    margin: 0;
    padding: 0 0.4rem;
    display: inline-block;
    color: var(--txt-pri)
}

.popup-dialog.ui-bottom[data-type="calendar"] .jui-datepicker .jui-datepicker-header {
    padding: 0
}

.popup-dialog.ui-bottom[data-type="calendar"] .jui-datepicker {
    padding: 0
}

.popup-dialog.ui-bottom[data-type="calendar"] .jui-datepicker .jui-datepicker-next,
.popup-dialog.ui-bottom[data-type="calendar"] .jui-datepicker .jui-datepicker-prev {
    width: 3.2rem;
    height: 3.2rem;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

.popup-dialog.ui-bottom[data-type="calendar"] .jui-datepicker .jui-datepicker-next span,
.popup-dialog.ui-bottom[data-type="calendar"] .jui-datepicker .jui-datepicker-prev span {
    width: 3.2rem;
    height: 3.2rem;
    -webkit-filter: var(--filter-g900);
    filter: var(--filter-g900);
    margin-left: 0;
    margin-top: 0;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    background-image: var(--path-line-chevron-right);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 1.6rem 1.6rem
}

.popup-dialog.ui-bottom[data-type="calendar"] .jui-datepicker .jui-datepicker-next .jui-icon-circle-triangle-w,
.popup-dialog.ui-bottom[data-type="calendar"] .jui-datepicker .jui-datepicker-prev .jui-icon-circle-triangle-w {
    -webkit-transform: translate(-50%, -50%) rotate(180deg);
    -ms-transform: translate(-50%, -50%) rotate(180deg);
    transform: translate(-50%, -50%) rotate(180deg)
}

:root .popup-dialog.ui-bottom[data-type="calendar"] .jui-datepicker .jui-datepicker-next span,
:root .popup-dialog.ui-bottom[data-type="calendar"] .jui-datepicker .jui-datepicker-prev span {
    display: none
}

:root .popup-dialog.ui-bottom[data-type="calendar"] .jui-datepicker .jui-datepicker-next,
:root .popup-dialog.ui-bottom[data-type="calendar"] .jui-datepicker .jui-datepicker-prev {
    width: 3.2rem;
    height: 3.2rem;
    -webkit-filter: var(--filter-g900);
    filter: var(--filter-g900);
    margin-left: 0;
    margin-top: 0;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    background-image: var(--path-line-chevron-right);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 1.6rem 1.6rem
}

:root .popup-dialog.ui-bottom[data-type="calendar"] .jui-datepicker .jui-datepicker-prev {
    -webkit-transform: translate(-50%, -50%) rotate(180deg);
    -ms-transform: translate(-50%, -50%) rotate(180deg);
    transform: translate(-50%, -50%) rotate(180deg)
}

.popup-dialog.ui-bottom[data-type="calendar"] .jui-datepicker .jui-datepicker-next {
    right: 0
}

.popup-dialog.ui-bottom[data-type="calendar"] .jui-datepicker .jui-datepicker-prev {
    left: inherit;
    right: 5.2rem
}

.popup-dialog.ui-bottom[data-type="calendar"] .jui-datepicker-calendar {
    margin: 2.4rem 0 0;
    height: 26.1rem
}

.popup-dialog.ui-bottom[data-type="calendar"] .jui-datepicker th {
    padding: 0;
    font-size: 1.6rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--txt-qua)
}

.popup-dialog.ui-bottom[data-type="calendar"] .jui-datepicker td {
    text-align: center;
    padding: 0.8rem 0 0 0
}

.popup-dialog.ui-bottom[data-type="calendar"] .jui-datepicker td a,
.popup-dialog.ui-bottom[data-type="calendar"] .jui-datepicker td span {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 0;
    border: none;
    background: none;
    width: 3.2rem;
    height: 3.2rem;
    border-radius: 50%;
    color: var(--txt-sec);
    font-size: 1.5rem
}

:root .popup-dialog.ui-bottom[data-type="calendar"] .jui-datepicker td.jui-state-disabled a,
:root .popup-dialog.ui-bottom[data-type="calendar"] .jui-datepicker td.jui-state-disabled span {
    color: var(--txt-disabled, #c8d2e4)
}

.popup-dialog.ui-bottom[data-type="calendar"] .jui-datepicker-other-month {
    pointer-events: none
}

.popup-dialog.ui-bottom[data-type="calendar"] .jui-datepicker-other-month .jui-state-default {
    display: none;
    pointer-events: none
}

.popup-dialog.ui-bottom[data-type="calendar"] .jui-state-highlight,
.popup-dialog.ui-bottom[data-type="calendar"] .jui-widget-content .jui-state-highlight {
    background: none;
    border: 0.2rem solid var(--color-lm100, #c0f03e);
    border-radius: 99rem;
    font-weight: 500
}

:root .popup-dialog.ui-bottom[data-type="calendar"] .jui-state-highlight,
:root .popup-dialog.ui-bottom[data-type="calendar"] .jui-widget-content .jui-state-highlight {
    color: var(--bg-pri-active, #0114a7);
    border-color: var(--border-accent-pri);
    background: var(--bg-pri-invert, #fff)
}

.popup-dialog.ui-bottom[data-type="calendar"] .jui-button.jui-state-active:hover,
.popup-dialog.ui-bottom[data-type="calendar"] .jui-button:active,
.popup-dialog.ui-bottom[data-type="calendar"] .jui-state-active,
.popup-dialog.ui-bottom[data-type="calendar"] .jui-widget-content .jui-state-active,
.popup-dialog.ui-bottom[data-type="calendar"] .jui-widget-header .jui-state-active,
.popup-dialog.ui-bottom[data-type="calendar"] a.jui-button:active {
    color: var(--color-pn, #17008c);
    background: var(--color-pl, #b6f23d);
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: bold;
    line-height: inherit
}

:root .popup-dialog.ui-bottom[data-type="calendar"] .jui-button.jui-state-active:hover,
:root .popup-dialog.ui-bottom[data-type="calendar"] .jui-button:active,
:root .popup-dialog.ui-bottom[data-type="calendar"] .jui-state-active,
:root .popup-dialog.ui-bottom[data-type="calendar"] .jui-widget-content .jui-state-active,
:root .popup-dialog.ui-bottom[data-type="calendar"] .jui-widget-header .jui-state-active,
:root .popup-dialog.ui-bottom[data-type="calendar"] a.jui-button:active {
    color: var(--txt-pri-invert, #fff);
    background: var(--bg-pri-active, #0114a7)
}

.popup-dialog.ui-bottom[data-type="calendar"] .jui-datepicker td.jui-state-disabled a,
.popup-dialog.ui-bottom[data-type="calendar"] .jui-datepicker td.jui-state-disabled span,
.popup-dialog.ui-bottom[data-type="calendar"] .jui-state-disabled,
.popup-dialog.ui-bottom[data-type="calendar"] .jui-widget-content .jui-state-disabled,
.popup-dialog.ui-bottom[data-type="calendar"] .jui-widget-header .jui-state-disabled {
    color: var(--color-pb20, #00000033)
}

:root .popup-dialog.ui-bottom[data-type="calendar"] .jui-state-disabled,
:root .popup-dialog.ui-bottom[data-type="calendar"] .jui-widget-content .jui-state-disabled,
:root .popup-dialog.ui-bottom[data-type="calendar"] .jui-widget-header .jui-state-disabled {
    -webkit-filter: var(--filter-g400);
    filter: var(--filter-g400)
}

.popup-dialog.ui-bottom[data-type="calendar"] .jui-datepicker-other-month.jui-state-disabled .jui-state-default {
    display: none
}

.ui-popup[spinnertype] .input-arrow-group {
    width: 0;
    height: 0;
    overflow: hidden
}

.ui-popup[spinnertype] .jui-datepicker-title {
    position: relative
}

.popup-dialog.ui-bottom[data-type="calendar"][spinnertype] .jui-datepicker .jui-datepicker-title:after {
    content: '';
    display: inline-block;
    vertical-align: middle;
    margin-top: -0.4rem;
    width: 2.4rem;
    height: 2.4rem;
    background-position: center center;
    background-repeat: no-repeat;
    background-image: var(--path-line-chevron-down);
    background-size: 1.6rem 1.6rem;
    -webkit-filter: var(--filter-pb100);
    filter: var(--filter-pb100)
}

:root .popup-dialog.ui-bottom[data-type="calendar"][spinnertype] .jui-datepicker .jui-datepicker-title:after {
    background-image: var(--path-solid-triangle-down);
    -webkit-filter: unset;
    filter: unset;
    margin-left: 0.4rem;
    width: 1.6rem;
    height: 1.6rem
}

.ui-popup[spinnertype] .jui-datepicker-title div[caln-event] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.ui-popup[spinnertype] .jui-datepicker .jui-datepicker-title select.jui-datepicker-month,
.ui-popup[spinnertype] .jui-datepicker .jui-datepicker-title select.jui-datepicker-year {
    border: 0;
    width: auto;
    -moz-appearance: none;
    appearance: none;
    -webkit-appearance: none;
    padding: 0
}

.ui-popup[spinnertype] .jui-datepicker .jui-datepicker-title select.jui-datepicker-month {
    margin-left: 0.5rem
}

.ui-popup[spinnertype] .jui-datepicker .jui-datepicker-title {
    text-align: left;
    margin: 0;
    padding: 0 0.4rem;
    display: inline-block
}

.ui-popup[spinnertype] .jui-datepicker .jui-datepicker-title,
.ui-popup[spinnertype] .jui-datepicker .jui-datepicker-title select {
    font-family: 'Pretendard K Edition', -apple-system, BlinkMacSystemFont, system-ui, Roboto, 'Helvetica Neue', 'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', sans-serif;
    font-weight: 700;
    background: var(--color-w100, #fff)
}

.popup-dialog.ui-bottom[data-type="dateSpinner"][type-slideview="5"] .popup-group {
    max-height: 70vh !important
}

.popup-dialog.ui-bottom[data-type="dateSpinner"][type-slideview="5"] .group-spinner {
    height: 28.6rem
}

:root .popup-dialog.ui-bottom[data-type="dateSpinner"][type-slideview="5"] .group-spinner {
    height: 24rem
}

.popup-dialog.ui-bottom[data-type="dateSpinner"][type-slideview="5"] .group-spinner:before {
    height: 4.8rem;
    top: 37%
}

.popup-dialog.ui-bottom[data-type="dateSpinner"][type-slideview="5"] .popup-header+.popup-content {
    padding: 0 0 1.6rem
}

:root .popup-dialog.ui-bottom[data-type="dateSpinner"][type-slideview="5"] .popup-header+.popup-content {
    padding: 0 0 1.2rem
}

.popup-dialog.ui-bottom[data-type="dateSpinner"][type-slideview="5"] .swiper-wrapper {
    max-height: auto !important;
    top: -10px !important
}

:root .popup-dialog.ui-bottom[data-type="dateSpinner"][type-slideview="5"] .swiper-wrapper .swiper-slide:first-child {
    margin-top: 0.3rem
}

/*!
* component element
* popup
* bottom dateSpinner type
*/

.popup-dialog.ui-bottom[data-type="dateSpinner"] .group-spinner {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 0 2rem;
    height: 20rem
}

.popup-dialog.ui-bottom[data-type="dateSpinner"] .component-form>.toggle-radio-area {
    margin-bottom: 48px;
    padding: 0 2rem
}

.popup-dialog.ui-bottom[data-type="dateSpinner"] .toggle-radio-area+.group-spinner {
    margin-bottom: 0.8rem
}

.popup-dialog.ui-bottom[data-type="dateSpinner"] .group-spinner:before {
    position: absolute;
    content: '';
    display: block;
    left: 2rem;
    right: 2rem;
    top: 25%;
    bottom: 50%;
    background: var(--color-pl, #b6f23d);
    border-radius: 1.2rem
}

.popup-dialog.ui-bottom[data-type="dateSpinner"] .group-spinner.no-space {
    padding-left: 0;
    padding-right: 0
}

.popup-dialog.ui-bottom[data-type="dateSpinner"] .group-spinner.no-space:before {
    left: 0;
    right: 0
}

:root .popup-dialog.ui-bottom[data-type="dateSpinner"] .group-spinner:before {
    background: var(--bg-ter)
}

.popup-dialog.ui-bottom[data-type="dateSpinner"] .swiper-container:before {
    position: absolute;
    content: '';
    display: block;
    top: 0;
    left: 0;
    width: 100%;
    height: 2.4rem;
    background: -webkit-gradient(linear, left bottom, left top, from(rgba(255, 255, 255, 0)), to(var(--color-w100, #fff)));
    background: -o-linear-gradient(bottom, rgba(255, 255, 255, 0) 0, var(--color-w100, #fff) 100%);
    background: linear-gradient(0deg, rgba(255, 255, 255, 0) 0, var(--color-w100, #fff) 100%);
    z-index: 2
}

.popup-dialog.ui-bottom[data-type="dateSpinner"] .swiper-container:after {
    position: absolute;
    content: '';
    display: block;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 3.2rem;
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0)), to(var(--color-w100, #fff)));
    background: -o-linear-gradient(top, rgba(255, 255, 255, 0) 0, var(--color-w100, #fff) 100%);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0, var(--color-w100, #fff) 100%);
    z-index: 1
}

.popup-dialog.ui-bottom[data-type="dateSpinner"] .swiper-container {
    width: 100%
}

.popup-dialog.ui-bottom[data-type="dateSpinner"] .swiper-wrapper {
    max-height: 53.325vw;
    top: -6.7vw
}

.popup-dialog.ui-bottom[data-type="dateSpinner"] .swiper-slide-active .btn-option {
    color: var(--color-g900, #141414);
    font-weight: 700
}

:root .popup-dialog.ui-bottom[data-type="dateSpinner"] .swiper-slide-active .btn-option {
    color: var(--txt-pri-active, #0114a7)
}

.popup-dialog.ui-bottom[data-type="dateSpinner"] .btn-option {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    color: var(--color-g700, #7d7d7d);
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: 400
}

:root .popup-dialog.ui-bottom[data-type="dateSpinner"] .btn-option {
    color: var(--color-g800, #3b4659)
}

.popup-dialog.ui-bottom[data-type="dateSpinner"] [data-spinner-area] .group-spinner {
    width: 100%;
    padding: 0;
    margin: 0 auto
}

.popup-dialog.ui-bottom[data-type="dateSpinner"] .ui-input[data-date="YYMMDD"]+[data-spinner-area] .group-spinner:before {
    left: 0;
    right: 0
}

/*!
* component element
* popup
* bottom dateSpinner type
* 팝업 페이지용 Spinner
*/

.popup-dialog.ui-bottom[data-type="dateSpinner"] .group-spinner.group-spinner-type01 {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 0 2rem;
    height: 20rem
}

.popup-dialog.ui-bottom[data-type="dateSpinner"] .group-spinner-swiper {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%
}

@media (min-width: 375px) {
    .popup-dialog.ui-bottom[data-type="dateSpinner"] .swiper-wrapper {
        max-height: 53.325px;
        top: -24.7px
    }
    :root .popup-dialog.ui-bottom[data-type="dateSpinner"][type-slideview="5"] .swiper-wrapper {
        max-height: 48px
    }
}

/*!
* component element
* popup
* alert type
*/

.popup-dialog.ui-alert {
    text-align: center
}

.popup-dialog.ui-alert .popup-section {
    width: 100%;
    margin: auto;
    padding: 2rem 4rem
}

.popup-dialog.ui-alert .popup-group {
    padding: 3.2rem 2rem 2rem;
    border-radius: 2rem;
    overflow: hidden
}

.popup-dialog.ui-alert .popup-content+.popup-footer {
    margin-top: 3.2rem
}

.popup-dialog.ui-alert .txt-alert {
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: 700;
    word-break: keep-all;
    color: var(--color-g900, #141414)
}

.popup-dialog.ui-alert .txt-sub {
    display: block;
    margin-top: 1.6rem;
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g700, #7d7d7d)
}

.popup-dialog.ui-alert .folding-wrap {
    margin-top: 1.6rem
}

.popup-dialog.ui-alert .folding-wrap .txt-detail {
    color: var(--color-g700, #7d7d7d)
}

.popup-dialog.ui-alert .folding-wrap .ico-arrow-open {
    width: 1.6rem;
    height: 1.6rem;
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

.popup-dialog.ui-alert .banner-alert {
    margin-top: -3.2rem;
    margin-left: -2rem;
    margin-right: -2rem;
    margin-bottom: 3.2rem
}

.popup-dialog.ui-alert .banner-alert img {
    display: block;
    width: 100%
}

.popup-dialog.ui-alert .alert-ico-figure {
    margin-bottom: 2rem
}

.popup-dialog.ui-alert .alert-img-figure {
    margin-bottom: 2rem
}

.popup-dialog.ui-alert .alert-img-figure img {
    width: 6.4rem;
    height: 6.4rem
}

.popup-dialog.ui-alert .alert-legacy-html {
    margin-top: 1.6rem;
    text-align: center;
    font-size: 1.5rem;
    font-weight: 400;
    line-height: 2rem;
    color: var(--txt-ter)
}

.popup-dialog.ui-alert .alert-legacy-html .list-infobox-group {
    margin-top: 2rem
}

.popup-dialog.ui-alert .alert-legacy-html .tit-box-sub {
    text-align: left;
    color: var(--txt-pri)
}

@media only screen and (min-width: 0) and (max-width: 499px) {
    .popup-dialog.ui-alert .popup-section {
        padding: 2rem
    }
}

@media only screen and (min-width: 500px) and (max-width: 999px) {
    .popup-dialog.ui-alert .popup-section {
        padding: 0;
        width: 52vw
    }
}

@media only screen and (min-width: 1000px) {
    .popup-dialog.ui-alert .popup-section {
        width: 48rem;
        padding: 2rem 0
    }
}

@media only screen and (min-width: 1440px) {
    .popup-dialog.ui-alert .popup-section {
        width: 52%
    }
}

/*!
* component element
* popup
* control
*/

.popup-dialog:not(.ui-full) [class^="component-"] {
    padding: 0
}

/*!
* component element
* toast popup
* basic type
*/

.toast-wrap {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: fixed;
    left: 0;
    bottom: 14.2rem;
    padding: 0 2rem;
    z-index: 999
}

.toast-wrap .toast-group {
    padding: 1.2rem 2.4rem;
    background: var(--color-pb85, #000000D8);
    text-align: center;
    border-radius: 1rem
}

.toast-wrap .toast-txt {
    color: var(--color-w100, #fff);
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 400
}

.toast-dimm {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    opacity: 1;
    overflow: auto;
    z-index: 998;
    display: block
}

/*!
* component element
* toast popup
* moneytree type
*/

.toast-wrap.moneytree-toast {
    bottom: 18rem
}

/*!

/*!
* toast popup
* icon type
*/

.toast-wrap.icon-type .toast-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: relative;
    padding: 1.2rem 2.8rem 1.2rem 2.4rem;
    -webkit-box-shadow: 0 0.2rem 3rem 0 rgba(0, 0, 0, 0.08);
    box-shadow: 0 0.2rem 3rem 0 rgba(0, 0, 0, 0.08)
}

.toast-wrap.icon-type .ico-positive {
    position: absolute;
    left: 2.4rem;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 2rem;
    height: 2rem;
    background-image: var(--path-etc-success);
    background-repeat: no-repeat;
    background-size: 2rem
}

.toast-wrap.icon-type .ico-negative {
    position: absolute;
    left: 2.4rem;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 2rem;
    height: 2rem;
    background-image: var(--path-etc-warning);
    background-repeat: no-repeat;
    background-size: 2rem
}

.toast-wrap.icon-type [class^="ico-"] {
    position: absolute;
    left: 2.4rem;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 2rem;
    height: 2rem;
    background-repeat: no-repeat;
    background-size: 2rem
}

.toast-wrap.icon-type [class^="ico-"] svg {
    width: 100%;
    height: 100%
}

.toast-wrap.icon-type .toast-txt {
    text-align: left;
    margin-left: 3.2rem;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.toast-ani {
    opacity: 0;
    -webkit-transform: translateY(4rem);
    -ms-transform: translateY(4rem);
    transform: translateY(4rem);
    -webkit-transition: all 0.2s var(--kds-easing-accelerate);
    -o-transition: all 0.2s var(--kds-easing-accelerate);
    transition: all 0.2s var(--kds-easing-accelerate)
}

.toast-ani.open {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
    -webkit-transition: all 0.2s var(--kds-easing-decelerate);
    -o-transition: all 0.2s var(--kds-easing-decelerate);
    transition: all 0.2s var(--kds-easing-decelerate)
}

.toast-wrap.toast-ani.icon-type .ico-positive {
    background-image: var(--path-etc-success-effect)
}

.toast-wrap.toast-ani.icon-type .ico-negative {
    background-image: var(--path-etc-warning-effect)
}

/*!
* toast popup
* btn type + icon type
*/

.toast-wrap.btn-type .toast-group {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 0.8rem 1.2rem 0.8rem 2.4rem
}

.toast-wrap.btn-type .toast-btn {
    padding: 0 0.8rem;
    height: 2.8rem;
    border-radius: 0.4rem;
    background-color: var(--color-w15, #fffFFF26);
    vertical-align: middle;
    margin-left: 1.2rem
}

.toast-wrap.btn-type .toast-btn .txt {
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--color-w80, #fffFFFCC)
}

.toast-wrap.btn-type .toast-txt {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    line-height: 2rem;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    text-align: left
}

/*!

/*!
/*!
* toast popup
* cta 없는 type
*/

.toast-wrap.type2 {
    bottom: 5rem
}

/*!
/*!
* toast popup
* title + text
*/

/*!
/*!
* toast popup
* CHPFMTASK-846 홈 개편
* 계좌번호 복사
*/

.toast-wrap.withdraw-type {
    bottom: 7.2rem;
    border-radius: 2rem;
    z-index: 159
}

.toast-wrap.withdraw-type .toast-group {
    position: relative;
    bottom: -5rem;
    opacity: 0;
    -webkit-animation: toast-up ease-out 0.6s forwards;
    animation: toast-up ease-out 0.6s forwards;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 1.6rem 1.6rem 1.6rem 2rem;
    border-radius: 2rem;
    background-color: var(--color-g900)
}

.toast-wrap.withdraw-type.no-motion .toast-group {
    -webkit-animation: none;
    animation: none
}

.toast-wrap.withdraw-type.show .toast-group {
    bottom: 0;
    opacity: 1
}

.toast-wrap.withdraw-type .toast-txt-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.toast-wrap.withdraw-type .toast-close-btn {
    line-height: 1
}

.toast-wrap.withdraw-type .toast-close-btn .ico-close-popup {
    width: 1.6rem;
    height: 1.6rem;
    -webkit-filter: var(--filter-w100);
    filter: var(--filter-w100);
    opacity: 0.65
}

.toast-wrap.withdraw-type [class*="logo-"]+.toast-column-box {
    margin-left: 1rem
}

.toast-wrap.withdraw-type .toast-column-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    text-align: left
}

.toast-wrap.withdraw-type .toast-column-box .column-item {
    font-size: 1.5rem;
    color: var(--color-white-w100);
    line-height: 2rem
}

.toast-wrap.withdraw-type .toast-column-box .column-item+.column-item {
    font-size: 1.4rem;
    color: var(--color-white-w65);
    line-height: 2rem;
    margin-top: 0.2rem
}

@-webkit-keyframes toast-up {
    0% {
        bottom: -5rem;
        opacity: 0
    }
    100% {
        bottom: 0;
        opacity: 1
    }
}

@keyframes toast-up {
    0% {
        bottom: -5rem;
        opacity: 0
    }
    100% {
        bottom: 0;
        opacity: 1
    }
}

/*!
* toast popup
* CHPFMTASK-855 사장님 홈
* 상단 토스트
*/

.toast-wrap.ceo-type {
    bottom: auto;
    top: 9.4rem;
    border-radius: 2.6rem
}

.toast-wrap.ceo-type .toast-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 1.6rem 2.4rem;
    border-radius: 2.6rem;
    background: var(--color-w100);
    -webkit-box-shadow: 0 0.2rem 3rem 0 rgba(0, 0, 0, 0.08);
    box-shadow: 0 0.2rem 3rem 0 rgba(0, 0, 0, 0.08)
}

.toast-wrap.ceo-type .toast-txt-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.toast-wrap.ceo-type .toast-txt {
    position: relative;
    padding-left: 4rem;
    font-size: 1.5rem;
    color: var(--txt-sec);
    font-weight: 700;
    line-height: 2rem
}

.toast-wrap.ceo-type .toast-txt:before {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    left: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 3.2rem;
    height: 3.2rem;
    border-radius: 99rem;
    background: var(--bg-ter) url("/resource/img/mmk/home/icon_ceo_ceohome.png") center no-repeat;
    background-size: 2.4rem 2.4rem
}

/*!
* toast popup
* CHPFMTASK-2738: [KDS][interaction] td(토스트팝업) 아이콘 수정
* 체크 애니메이션
*/

.toast-wrap.open .ico-positive .svg-success-circle {
    -webkit-animation: growAnimation 0.25s cubic-bezier(0.42, 0, 0.2, 1) both;
    animation: growAnimation 0.25s cubic-bezier(0.42, 0, 0.2, 1) both;
    -webkit-transform-origin: center;
    -ms-transform-origin: center;
    transform-origin: center
}

.toast-wrap.open .ico-positive .svg-success-path {
    stroke-dasharray: 20;
    stroke-dashoffset: 20;
    -webkit-animation: draw 0.5s cubic-bezier(0, 0, 0.25, 1) both 0.25s;
    animation: draw 0.5s cubic-bezier(0, 0, 0.25, 1) both 0.25s
}

.toast-wrap.open .ico-negative .svg-warning-triangle {
    -webkit-animation: growAnimation 0.25s cubic-bezier(0.42, 0, 0.2, 1) both;
    animation: growAnimation 0.25s cubic-bezier(0.42, 0, 0.2, 1) both;
    -webkit-transform-origin: center;
    -ms-transform-origin: center;
    transform-origin: center
}

.toast-wrap.open .ico-negative .svg-warning-path {
    stroke-dasharray: 20;
    stroke-dashoffset: 20;
    -webkit-animation: draw 1.5s cubic-bezier(0, 0, 0.25, 1) both 0.25s;
    animation: draw 1.5s cubic-bezier(0, 0, 0.25, 1) both 0.25s
}

@-webkit-keyframes growAnimation {
    from {
        -webkit-transform: scale(0);
        transform: scale(0)
    }
    to {
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

@keyframes growAnimation {
    from {
        -webkit-transform: scale(0);
        transform: scale(0)
    }
    to {
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

@-webkit-keyframes draw {
    to {
        stroke-dashoffset: 0
    }
}

@keyframes draw {
    to {
        stroke-dashoffset: 0
    }
}

/*!
* component element
* Picker
* DatePicker
*/

.input-arrow-group {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.input-arrow-group input {
    text-align: right;
    border: none;
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    padding-right: 2rem
}

.input-arrow-group .ico-arrow-open {
    position: absolute;
    right: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 1.6rem;
    height: 1.6rem;
    margin: -0.05rem 0 0
}

.input-triangle-group {
    position: relative
}

.input-triangle-group input {
    width: 11rem;
    background: transparent;
    color: var(--color-g900, #141414);
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400;
    border: none
}

.input-triangle-group .bl-selectbox {
    position: absolute;
    left: 9.4rem
}

/*!
* component element
* DatePicker
* cols1 type
* CHPFMTASK-1033
* PBKINQ2005000100S
*/

.input-arrow-group.cols1-type {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    padding-right: 2rem;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-flex: 1;
    -ms-flex: auto;
    flex: auto
}

.input-arrow-group.cols1-type * {
    font-size: 1.4rem;
    color: var(--txt-ter)
}

.input-arrow-group.cols1-type input {
    padding-right: 0;
    text-align: left;
    max-width: 5rem
}

.input-arrow-group.cols1-type .ico-arrow-open {
    position: relative;
    top: 0;
    -webkit-transform: translateX(4px);
    -ms-transform: translateX(4px);
    transform: translateX(4px)
}

/*!
* component element
* list-checkbox 다건일 경우
*/

.list-checkbox-group.many .list-row.poup {
    padding: 0 2rem
}

.list-checkbox-group.many .list-row .list-item {
    padding: 1.6rem 0;
    border-bottom: none
}

.list-checkbox-group.many .list-row .list-item:first-child {
    padding-top: 0
}

.list-checkbox-group.many .list-row .list-item+.list-item {
    border-top: 0.1rem solid var(--color-g200, #eee)
}

.list-checkbox-group.many .list-row .input-checkbox {
    width: 100%;
    height: 100%
}

.list-checkbox-group.many .list-row input+.checkbox-select {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    height: 100%
}

.list-checkbox-group.many .list-row input+.checkbox-select:after {
    content: '';
    display: block;
    width: 2.4rem;
    height: 2.4rem;
    position: absolute;
    top: 50%;
    right: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    background-image: var(--path-solid-colored-check-ico-ter);
    background-size: contain;
    background-repeat: no-repeat
}

.list-checkbox-group.many .list-row input:checked+.checkbox-select:after {
    background-image: var(--path-checkbox-line-active)
}

.list-checkbox-group.many .list-row input:disabled+.checkbox-select {
    width: 100%;
    height: 100%
}

.list-checkbox-group.many .list-row input:disabled+.checkbox-select:after {
    display: none
}

.list-checkbox-group.many .list-row input:disabled+.checkbox-select dl * {
    color: var(--color-g400, #c7c7c7)
}

.list-checkbox-group.many .list-row .checkbox-select dl {
    margin-right: 5.5rem
}

.list-checkbox-group.many .list-row .checkbox-select dl dt {
    display: inline-block;
    width: 100%;
    font-weight: 500;
    font-size: 1.6rem;
    color: var(--color-g900, #141414);
    line-height: 2.1rem
}

.list-checkbox-group.many .list-row .checkbox-select dl dd {
    display: inline-block;
    width: 100%;
    margin-top: 0.4rem;
    font-weight: 400;
    font-size: 1.4rem;
    color: var(--color-g600, #9b9b9b);
    line-height: 2rem
}

.list-checkbox-group.many.type02 .list-row input+.checkbox-select {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.list-checkbox-group.many.type02 .list-row input+.checkbox-select .data-logo {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    margin-right: 1.2rem
}

.list-radio-group.type01 .list-row .list-item {
    padding: 1.6rem 0;
    border-bottom: none
}

.list-radio-group.type01 .list-row .list-item:first-child {
    padding-top: 0
}

.list-radio-group.type01 .list-row .list-item {
    padding: 0.8rem 0;
    border-bottom: none
}

.list-radio-group.type01:has(input:checked) .radio-txt-field {
    color: var(--txt-sec-active)
}

.list-checkbox-group.many.noline .list-row .list-item+.list-item {
    border: none
}

/*!
* component element
* tab
*/

.popup-dialog.ui-bottom .popup-header .section-component.ui-tab {
    margin: 0 -2rem
}

/*!
* component element
* 반팝업 popup-gradiant 신규추가 관련
*/

.popup-dialog.ui-bottom .popup-group.autoHeight {
    max-height: 90% !important
}

.popup-dialog.ui-bottom .popup-header+.popup-content:last-child {
    padding-bottom: 0
}

.pop-bot-shadow.popup-dialog.ui-bottom .popup-header+.popup-content:last-child {
    padding-bottom: 5.6rem
}

.pop-top-shadow.popup-dialog.ui-bottom .popup-header:before {
    content: '';
    display: block;
    width: 100%;
    height: 2.4rem;
    position: absolute;
    bottom: -2.3rem;
    left: 0;
    background: -webkit-gradient(linear, left bottom, left top, from(rgba(255, 255, 255, 0)), to(var(--color-w100, #fff)));
    background: -o-linear-gradient(bottom, rgba(255, 255, 255, 0) 0, var(--color-w100, #fff) 100%);
    background: linear-gradient(0deg, rgba(255, 255, 255, 0) 0, var(--color-w100, #fff) 100%);
    z-index: 2
}

.popup-dialog.ui-bottom .popup-group>.popup-content+.popup-footer {
    margin-top: 3.2rem
}

.popup-dialog.ui-bottom .popup-group>.popup-header+.popup-content+.popup-footer {
    margin-top: 0
}

.pop-bot-shadow.popup-dialog.ui-bottom .popup-content+.popup-footer:before {
    content: '';
    display: block;
    width: 100%;
    height: 5.4rem;
    position: absolute;
    top: -5.4rem;
    left: 0;
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0)), to(var(--color-w100, #fff)));
    background: -o-linear-gradient(top, rgba(255, 255, 255, 0) 0, var(--color-w100, #fff) 100%);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0, var(--color-w100, #fff) 100%);
    pointer-events: none
}

.pop-bot-shadow.popup-dialog.ui-bottom .popup-header+.popup-content:last-child:before {
    content: '';
    display: block;
    width: 100%;
    height: 5.4rem;
    position: fixed;
    bottom: 2.4rem;
    left: 0;
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0)), to(var(--color-w100, #fff)));
    background: -o-linear-gradient(top, rgba(255, 255, 255, 0) 0, var(--color-w100, #fff) 100%);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0, var(--color-w100, #fff) 100%);
    z-index: 2
}

.pop-bot-shadow.popup-dialog.ui-bottom[data-type="select-bank"] .popup-header+.popup-content:last-child:before {
    bottom: 0
}

.pop-bot-shadow.popup-dialog.ui-bottom.account-pop .popup-header+.popup-content:last-child .trn-list-item:last-child,
.pop-bot-shadow.popup-dialog.ui-bottom.account-pop[data-type^="select"] .popup-header+.popup-content:last-child .swiper-slide:last-child {
    padding-bottom: 2.4rem
}

.pop-bot-shadow.popup-dialog.ui-bottom.account-pop .popup-header+.popup-content .trn-list-container.type01 .trn-list-item:last-child {
    padding-bottom: 0
}

.popup-dialog.ui-bottom .popup-header+.popup-content .select-item:first-child,
.popup-dialog.ui-bottom .popup-header+.popup-content .swiper-slide:first-child,
.popup-dialog.ui-bottom.account-pop[data-type^="select"] .popup-header+.popup-content .swiper-slide:first-child {
    margin-top: 0.8rem
}

.popup-dialog.ui-bottom[data-type^="select"] .select-item:first-child .btn-option,
.popup-dialog.ui-bottom[data-type^="select"] .swiper-slide:first-child .btn-option,
.popup-dialog.ui-bottom[data-type^="select-double"] .select-item:first-child .area-option {
    padding-top: 0
}

.popup-dialog.ui-bottom[data-type="select-bank"] .popup-header+.popup-content .select-item:first-child,
.popup-dialog.ui-bottom[data-type^="dateSpinner"] .popup-header+.popup-content .swiper-slide:first-child {
    margin-top: 0
}

.popup-dialog.ui-bottom.bottom-txt-btn .component-btn.fixed-bottom {
    padding-bottom: 2.4rem
}

.popup-dialog.ui-bottom.bottom-txt-btn .component-btn.fixed-bottom .txt-lv01 {
    line-height: 2rem
}

.popup-dialog.ui-bottom.bottom-txt-btn .component-btn.fixed-bottom .btn-group {
    padding: 2rem 0 0.8rem;
    position: relative
}

.popup-dialog.ui-bottom.bottom-txt-btn .component-btn.fixed-bottom .btn-group .btn-under-link {
    color: var(--color-g700, #7d7d7d)
}

.popup-dialog.ui-bottom.bottom-txt-btn .component-btn.fixed-bottom:before {
    display: none
}

.popup-dialog.ui-bottom.bottom-txt-btn .component-btn.fixed-bottom .btn-group {
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0)), color-stop(26.56%, var(--color-w100, #fff)), to(var(--color-w100, #fff)));
    background: -o-linear-gradient(top, rgba(255, 255, 255, 0) 0, var(--color-w100, #fff) 26.56%, var(--color-w100, #fff) 100%);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0, var(--color-w100, #fff) 26.56%, var(--color-w100, #fff) 100%)
}

.popup-dialog.ui-bottom.bottom-txt-btn .popup-content {
    padding-bottom: 5.6rem !important
}

/*!
* component element
* 반팝업 2depth case
*/

.popup-dialog.ui-bottom .popup-group.popup-depth2 {
    left: 130%;
    -webkit-transition: 0.6s;
    -o-transition: 0.6s;
    transition: 0.6s;
    z-index: -1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.popup-dialog.ui-bottom .popup-group.popup-depth2.active {
    left: 0;
    z-index: 1
}

.popup-dialog.ui-bottom .popup-group.popup-depth2 .popup-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    left: 50%;
    opacity: 0;
    z-index: 1
}

.popup-dialog.ui-bottom .popup-group.popup-depth2 .popup-header .btn-back {
    margin-right: 0.4rem
}

.popup-dialog.ui-bottom .popup-group.popup-depth2 .popup-content,
.popup-dialog.ui-bottom .popup-group.popup-depth2 .popup-footer {
    opacity: 0
}

.popup-dialog.ui-bottom .popup-group.popup-depth2 .popup-footer,
.popup-dialog.ui-bottom .popup-group.popup-depth2>.popup-header+.popup-content+.popup-footer {
    margin-top: auto
}

.popup-dialog.ui-bottom .popup-group.popup-depth2 .popup-header.on {
    -webkit-animation: popup-header-event 0.3s ease-in forwards;
    animation: popup-header-event 0.3s ease-in forwards;
    -webkit-animation-delay: 0.3s;
    animation-delay: 0.3s
}

.popup-dialog.ui-bottom .popup-group.popup-depth2 .popup-content.on,
.popup-dialog.ui-bottom .popup-group.popup-depth2 .popup-footer.on {
    -webkit-animation: popup-event 0.3s ease-in forwards;
    animation: popup-event 0.3s ease-in forwards;
    -webkit-animation-delay: 0.4s;
    animation-delay: 0.4s
}

@-webkit-keyframes popup-header-event {
    0% {
        left: 50%;
        opacity: 0
    }
    100% {
        left: 0;
        opacity: 1
    }
}

@keyframes popup-header-event {
    0% {
        left: 50%;
        opacity: 0
    }
    100% {
        left: 0;
        opacity: 1
    }
}

@-webkit-keyframes popup-event {
    0% {
        opacity: 0
    }
    100% {
        opacity: 1
    }
}

@keyframes popup-event {
    0% {
        opacity: 0
    }
    100% {
        opacity: 1
    }
}

.main-event.popup-dialog.ui-full .popup-content,
.main-event.popup-dialog.ui-full .popup-footer,
.main-event.popup-dialog.ui-full .popup-header {
    background: transparent
}

.main-event.popup-dialog.ui-full .popup-group {
    background: rgba(20, 20, 20, 0.96)
}

.main-event.popup-dialog.ui-full .popup-footer .component-btn.fixed-bottom:before {
    display: none
}

.main-event.popup-dialog.ui-full .title-group {
    text-align: center;
    padding-bottom: 3.2rem
}

.main-event.popup-dialog.ui-full .title-group * {
    color: var(--color-w100, #fff)
}

.main-event.popup-dialog.ui-full .title-group .txt-guide {
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: 700
}

.main-event.popup-dialog.ui-full .title-group .title-field-popup-full {
    font-size: 3.2rem;
    line-height: 4.2rem
}

.main-event.popup-dialog.ui-full .popup-content .popup-inner {
    padding-bottom: 0
}

.popup-dialog.ui-bottom[data-type^="select-double"] .card-list-container .area-option {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.popup-dialog.ui-bottom[data-type^="select-double"] .card-list-container .area-option [class*="ico-"] {
    margin-right: 1.6rem
}

.popup-dialog.ui-bottom[data-type^="select-double"] .popup-header+.popup-content .card-list-container .swiper-slide:first-child {
    margin-top: 1.6rem
}

.popup-dialog.ui-full.height_full .popup-content {
    height: 100%
}

.popup-dialog.ui-full.height_full .popup-content .popup-inner {
    height: 100%;
    padding: 0
}

.popup-dialog.ui-bottom .trn-list>li:last-child .area-trn-option {
    border-bottom: 0
}

.popup-dialog.ui-bottom .popup-group.keypad-fix-btn-group {
    padding-bottom: 1.6rem
}

.popup-dialog.ui-bottom .popup-group.keypad-fix-btn-group .popup-header+.popup-content {
    padding-bottom: 2.4rem
}

.popup-dialog.ui-bottom .popup-group.keypad-fix-btn-group .popup-footer {
    padding-top: 1.6rem;
    border-top: 1px solid var(--color-g300, #e0e0e0)
}

.popup-dialog.ui-full.bg-blue {
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(40%, var(--color-in700)), color-stop(50%, var(--color-w100)));
    background-image: -o-linear-gradient(var(--color-in700) 40%, var(--color-w100) 50%);
    background-image: linear-gradient(var(--color-in700) 40%, var(--color-w100) 50%)
}

.popup-dialog.ui-full .popup-header.bg-blue {
    background: var(--color-in700)
}

.popup-dialog.ui-full .popup-header.bg-blue .ico-close-popup {
    -webkit-filter: var(--filter-w100);
    filter: var(--filter-w100)
}

.popup-dialog.ui-full .popup-header.bg-blue.bg-white .ico-close-popup {
    -webkit-filter: initial;
    filter: initial
}

.popup-dialog.ui-full .popup-content.shopping {
    position: -webkit-sticky;
    position: sticky;
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(50%, var(--color-in700)), color-stop(50%, var(--color-w100)));
    background-image: -o-linear-gradient(var(--color-in700) 50%, var(--color-w100) 50%);
    background-image: linear-gradient(var(--color-in700) 50%, var(--color-w100) 50%)
}

.popup-dialog.ui-full .popup-content.shopping .popup-inner-top {
    position: -webkit-sticky;
    position: sticky;
    width: 100%;
    left: 0;
    top: 5rem;
    z-index: 1;
    overflow: hidden
}

.ios .popup-dialog.ui-full .popup-content.shopping .popup-inner-top {
    top: 9.4rem
}

.ios.nonotch .popup-dialog.ui-full .popup-content.shopping .popup-inner-top {
    top: 7rem
}

.popup-dialog.ui-full .popup-group.shopping {
    background: var(--color-in700)
}

.popup-dialog.ui-full .popup-group.shopping.bg-white .popup-content.shopping .popup-inner-top::after {
    display: none
}

.popup-dialog.ui-full .popup-content.shopping .component-coupang-top {
    position: relative;
    overflow: hidden
}

.popup-dialog.ui-full .popup-content.shopping .component-coupang-top .img-area {
    position: absolute;
    content: '';
    width: 17.8rem;
    top: -2.1rem;
    right: -1.3rem
}

.popup-dialog.ui-full .popup-content.shopping .component-coupang-top .img-area>img {
    width: 100%
}

.popup-dialog.ui-full .popup-content.shopping .component-coupang-top .text-area {
    font-weight: 700;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: var(--color-w100);
    margin: 3.4rem 0 4.7rem
}

.popup-dialog.ui-full .popup-content.shopping .component-coupang-top .text-area .sm {
    font-size: 1.8rem;
    line-height: 2.5rem
}

.popup-dialog.ui-full .popup-content.shopping .component-coupang-top .text-area .lg {
    font-size: 3.2rem;
    line-height: 4.2rem
}

.popup-dialog.ui-full .popup-content.shopping .popup-inner-bottom {
    position: relative;
    min-height: 70vh;
    padding: 3.2rem 0 2.4rem;
    border-radius: 2rem 2rem 0 0;
    background: var(--color-w100);
    z-index: 2
}

.popup-dialog.ui-full .popup-content.shopping .list-infobox-group .list-item+.list-item {
    margin-top: 2rem
}

.popup-dialog.ui-full .popup-content.shopping .popup-inner-bottom .component-list.mt40+.component-text {
    margin-top: 6.6rem
}

.popup-dialog.ui-full .popup-content.shopping .component-line03 {
    height: 1.2rem
}

.popup-dialog.ui-bottom .title-field-popup.shopping .goods-price {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 2.6rem;
    font-weight: 700;
    line-height: 3.4rem;
    margin-top: 1.2rem
}

.popup-dialog.ui-bottom .title-field-popup.shopping .goods-price i {
    margin-right: 0.2rem
}

.popup-dialog.ui-bottom .popup-content.shopping .component-goods .list-infobox-group {
    padding: 2rem 0 0
}

.popup-dialog.ui-bottom .popup-content.shopping .component-goods .list-infobox-group .area-term {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400
}

.popup-dialog.ui-bottom .popup-content.shopping .component-goods .list-infobox-group .area-desc {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 700
}

.popup-dialog.ui-bottom .popup-content.shopping .component-goods .list-infobox-group .list-row {
    padding-bottom: 0.8rem
}

.popup-dialog.ui-bottom .popup-content.shopping .input-txt-group.h-small2>input {
    font-weight: 700
}

.popup-dialog.ui-full .component-text-simple .ico-figure-group .alert-icon {
    width: 6.4rem;
    height: 6.4rem;
    display: inline-block
}

[case="calendar"] .popup-header .txt-guide-popup {
    margin-top: 2.7rem;
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 2.1rem;
    color: var(--txt-pri-active)
}

[case="calendar"] .popup-header .txt-guide-popup::after {
    content: '';
    display: inline-block;
    width: 1.6rem;
    height: 1.6rem;
    background-image: url("/resource/img/mmk/kds3_5/ico/solid/triangle_up.svg");
    background-size: contain;
    vertical-align: middle;
    margin-left: .4rem;
    -webkit-filter: var(--filter-in1100);
    filter: var(--filter-in1100)
}

.popup-inner.profits .component-text-list {
    background-color: var(--bg-qua, #f7f9fd);
    padding: 3.6rem 2rem 4.8rem
}

.popup-inner.profits .text-list-group .txt {
    color: var(--color-g800, #3b4659);
    font-weight: 500
}

.popup-dialog.ui-bottom .popup-group.coupon {
    padding-bottom: 0
}

.pop-bot-shadow.popup-dialog.ui-bottom .popup-group.coupon .popup-header+.popup-content:last-child {
    padding-bottom: 4rem
}

.pop-bot-shadow.popup-dialog.ui-bottom .popup-group.coupon .popup-header+.popup-content:last-child::before {
    display: none
}

.popup-group.coupon .title-group .title-field-popup {
    font-size: 1.8rem;
    line-height: 2.5rem
}

.photo-pop .btn-lv01.divider-gray .txt {
    font-size: 1.5rem;
    font-weight: 500;
    color: var(--txt-qua) !important
}

.photo-pop .btn-lv01.divider-gray .ico-search {
    width: 1.6rem;
    height: 1.6rem;
    -webkit-filter: var(--ico-sec);
    filter: var(--ico-sec);
    margin-right: .4rem
}

[data-select-popup] select {
    position: absolute !important;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(1px, 1px, 1px, 1px)
}

[tooltip-popup-desc] {
    display: none
}

.popup-dialog.ui-bottom .ico-siren-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-bottom: 2rem
}

.popup-dialog.ui-bottom .ico-siren-wrap .ico-siren {
    width: 6.4rem;
    height: 6.4rem
}

.popup-dialog.ui-bottom.pop-bot-shadow[data-type="calendar"].ui-bottom .popup-group,
.popup-dialog.ui-bottom[data-type="calendar"] .popup-group {
    max-height: 70.3vh
}

.popup-dialog.ui-bottom.pop-bot-shadow[data-type="calendar"] .popup-header,
.popup-dialog.ui-bottom[data-type="calendar"] .popup-header {
    padding-bottom: 0
}

.popup-dialog.ui-bottom.pop-bot-shadow[data-type="calendar"] .popup-header+.popup-content {
    padding-bottom: 0
}

.popup-dialog.ui-bottom.pop-bot-shadow[data-type="calendar"] .popup-header+.popup-content,
.popup-dialog.ui-bottom[data-type="calendar"] .popup-header+.popup-content {
    padding: 2.8rem 2rem 0
}

.popup-dialog.ui-bottom.pop-bot-shadow[data-type="calendar"] .popup-header+.popup-content .jui-datepicker .jui-datepicker-title,
.popup-dialog.ui-bottom[data-type="calendar"] .popup-header+.popup-content .jui-datepicker .jui-datepicker-title {
    font-size: 1.6rem;
    line-height: 2rem;
    font-weight: 700;
    color: var(--txt-pri);
    padding: 0
}

.popup-dialog.ui-bottom.pop-bot-shadow[data-type="calendar"] .popup-header+.popup-content .jui-datepicker-calendar,
.popup-dialog.ui-bottom[data-type="calendar"] .popup-header+.popup-content .jui-datepicker-calendar {
    margin-top: 2.8rem
}

.popup-dialog.ui-bottom.pop-bot-shadow[data-type="calendar"] .popup-group>.popup-header+.popup-content,
.popup-dialog.ui-bottom[data-type="calendar"] .popup-group>.popup-header+.popup-content {
    height: 33.7rem
}

.popup-dialog.ui-bottom[data-type="calendar"] .popup-group>.popup-content {
    height: 33rem
}

.popup-dialog.ui-bottom.pop-bot-shadow[data-type="calendar"] .jui-datepicker .jui-datepicker-prev,
.popup-dialog.ui-bottom[data-type="calendar"] .jui-datepicker .jui-datepicker-prev {
    right: 4rem
}

.popup-dialog.ui-bottom.pop-bot-shadow[data-type="calendar"] .jui-datepicker .jui-datepicker-next,
.popup-dialog.ui-bottom[data-type="calendar"] .jui-datepicker .jui-datepicker-next {
    right: -1rem
}

/*!
* component element
* 반팝업 darkmode case
*/

.popup-wrap .popup-group.darkmode {
    background-color: var(--color-grey-g900)
}

.popup-wrap .popup-group.darkmode .title-group .title-field-popup {
    color: var(--color-g100)
}

:root .popup-wrap .popup-group.darkmode .title-group .txt-guide-popup {
    color: var(--color-g400)
}

.popup-wrap .popup-group.darkmode .popup-footer .btn-lv01.divider-gray {
    background-color: var(--color-g800)
}

.popup-wrap .popup-group.darkmode .popup-footer .btn-lv01.divider-gray .txt {
    color: var(--color-in200)
}

.pop-top-shadow.popup-dialog.ui-bottom .popup-group.darkmode .popup-header:before {
    background: -webkit-gradient(linear, left bottom, left top, from(rgba(255, 255, 255, 0)), to(var(--color-grey-g900, #252b37)));
    background: -o-linear-gradient(bottom, rgba(255, 255, 255, 0) 0, var(--color-grey-g900, #252b37) 100%);
    background: linear-gradient(0deg, rgba(255, 255, 255, 0) 0, var(--color-grey-g900, #252b37) 100%)
}

.pop-bot-shadow.popup-dialog.ui-bottom .popup-group.darkmode .popup-header+.popup-content:last-child:before {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, rgba(255, 255, 255, 0)), to(var(--color-grey-g900, #252b37)));
    background: -o-linear-gradient(top, rgba(255, 255, 255, 0) 0, var(--color-grey-g900, #252b37) 100%);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0, var(--color-grey-g900, #252b37) 100%)
}

.popup-inner.alpha .ico-quick-transfer {
    -webkit-filter: var(--filter-ce300);
    filter: var(--filter-ce300)
}

.popup-inner.alpha .ico-credit-card {
    -webkit-filter: var(--filter-bu400);
    filter: var(--filter-bu400)
}

.popup-dialog.ui-bottom .section-component .component-tab.mt-type1 {
    margin-top: -0.8rem
}

.popup-inner.search-active .component-header {
    -webkit-transform: translateY(4.5rem);
    -ms-transform: translateY(4.5rem);
    transform: translateY(4.5rem)
}

.ui-popup-open .popup-inner.search-active .component-header {
    -webkit-animation: search-up 0.5s forwards;
    animation: search-up 0.5s forwards
}

@-webkit-keyframes search-up {
    0% {
        -webkit-transform: translateY(4.5rem);
        transform: translateY(4.5rem)
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

@keyframes search-up {
    0% {
        -webkit-transform: translateY(4.5rem);
        transform: translateY(4.5rem)
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

.popup-inner.search-active .component-header .header-content a {
    padding: 0;
    opacity: 0;
    width: 0
}

.ui-popup-open .popup-inner.search-active .component-header .header-content a {
    -webkit-animation: btn-show 0.5s forwards;
    animation: btn-show 0.5s forwards;
    white-space: nowrap
}

@-webkit-keyframes btn-show {
    0% {
        padding: 0;
        opacity: 0;
        width: 0
    }
    70% {
        opacity: 0
    }
    100% {
        padding: 0 0.8rem 0 0.8rem;
        opacity: 1;
        width: 4.4rem
    }
}

@keyframes btn-show {
    0% {
        padding: 0;
        opacity: 0;
        width: 0
    }
    70% {
        opacity: 0
    }
    100% {
        padding: 0 0.8rem 0 0.8rem;
        opacity: 1;
        width: 4.4rem
    }
}

.popup-inner.search-active .component-banner,
.popup-inner.search-active .component-list,
.popup-inner.search-active .component-tab {
    opacity: 0
}

.ui-popup-open .popup-inner.search-active .component-banner,
.ui-popup-open .popup-inner.search-active .component-list,
.ui-popup-open .popup-inner.search-active .component-tab {
    -webkit-animation: section-opacity 0.5s 0.3s forwards;
    animation: section-opacity 0.5s 0.3s forwards
}

@-webkit-keyframes section-opacity {
    0% {
        opacity: 0
    }
    100% {
        opacity: 1
    }
}

@keyframes section-opacity {
    0% {
        opacity: 0
    }
    100% {
        opacity: 1
    }
}

.popup-dialog.ui-full .popup-content .popup-inner .component-header.sticky {
    position: -webkit-sticky;
    position: sticky
}

.popup-dialog.ui-bottom .title-group .btn-control.disabled {
    color: var(--txt-disabled)
}

.popup-section.popup-section-poll .component-img-poll.type01 {
    margin-top: 0
}

.popup-section.popup-section-poll .component-form-poll.type01 {
    margin-top: 0
}

.popup-section.popup-section-poll .component-img-poll.type01+.component-form {
    margin-top: 2.8rem !important
}

.popup-section.popup-section-poll .popup-inner .component-text-simple:first-child {
    margin-top: 0 !important
}

.popup-section.popup-section-poll .popup-inner .component-text-simple+.component-form-poll {
    margin-top: 2.8rem !important
}

.popup-section.popup-section-poll .popup-inner .component-form-poll:only-child {
    margin-top: 0 !important
}

.popup-section.popup-section-poll .popup-inner .component-form-poll.number-poll:first-child {
    margin-top: 2rem
}

.popup-section.popup-section-poll .popup-inner .component-form-poll.number-poll {
    margin-top: 4.8rem
}

.popup-section.popup-section-poll .popup-inner .component-form-poll.number-poll:only-child {
    margin-top: 2rem !important
}

.popup-section.popup-section-poll .popup-inner .component-form.poll-card-warp:first-child {
    margin-top: 0
}

.popup-section.popup-section-poll .popup-inner .component-form.poll-card-warp {
    margin-top: 1rem
}

.popup-section.popup-section-poll-type2 .poll-space-24 {
    margin-top: 2.4rem !important
}

.popup-section.popup-section-poll-type2 .poll-space-24:first-child {
    margin-top: 0 !important
}

.popup-section.popup-section-poll-type2 .poll-space-28 {
    margin-top: 2.8rem !important
}

.popup-section.popup-section-poll-type2 .poll-space-28:first-child {
    margin-top: 0 !important
}

.popup-section.popup-section-poll-type2 .poll-space-48 {
    margin-top: 4.8rem !important
}

.popup-section.popup-section-poll-type2 .poll-space-48:first-child {
    margin-top: 2rem !important
}

.popup-section.popup-section-poll-type2 .poll-card-warp.poll-space-28:first-child {
    margin-top: 0 !important
}

.popup-section.popup-section-poll-type2 .poll-card-warp.poll-space-28+.poll-card-warp.poll-space-28 {
    margin-top: 1rem !important
}

.popup-dialog.ui-bottom.pop-bot-shadow .popup-section.popup-section-poll-type2 .popup-header+.popup-content {
    padding-bottom: 3.2rem
}

/*!
* component element
* keypad
* layout
*/

.component-keypad {
    position: fixed;
    top: 0;
    bottom: 0;
    width: 100%;
    padding: 0
}

.component-keypad-popup {
    height: 100%;
    overflow: hidden;
    position: relative;
    z-index: 4
}

.component-keypad-trn {
    position: fixed;
    z-index: 79;
    width: 100%;
    bottom: 0;
    background-color: var(--color-w100, #fff);
    padding: 0
}

.component-keypad-trn .keypad-group {
    padding: 0
}

/*!
* component element
* 아파트 담보대출 keypad
* layout
*/

.popup-dialog:not(.ui-full) .page-FPMMAN .component-keypad-popup {
    padding-bottom: 2rem
}

/*!
* component element
* keypad
* popup keypad layout
*/

.keypad-group.keypad-popup {
    padding: 0
}

.keypad-group.keypad-popup .keypad-row-output {
    padding-top: 0.6rem;
    min-height: 9rem;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: start
}

.keypad-group.keypad-popup .keypad-row-input {
    min-height: auto;
    margin-bottom: -1rem
}

/*!
* component element
* keypad
* basic type
*/

.keypad-group {
    height: 100%;
    min-height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding: 5rem 0 0
}

.keypad-group [class^="keypad-row"] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.keypad-group .keypad-row-form {
    -webkit-box-flex: 0;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    padding: 0 2rem
}

.keypad-group .keypad-row-form .selectbox-group {
    margin-top: 0.4rem
}

.keypad-group .keypad-form-group {
    padding: 0 2.0rem;
    margin-top: 1.6rem
}

.keypad-group .keypad-form-group .tooltip-focus-group .tooltip-area.align-center.small.black {
    bottom: calc(100% + 1.5rem);
    -webkit-transform: translateX(-53%);
    -ms-transform: translateX(-53%);
    transform: translateX(-53%)
}

.keypad-group .keypad-form-group+.keypad-form-group {
    margin-top: 1.2rem
}

.keypad-group .keypad-form-txt {
    font-size: 1.6rem;
    line-height: 1.3125;
    font-weight: 400;
    color: var(--color-g700, #7d7d7d);
    margin-left: 0.4rem
}

.keypad-group .keypad-bank-area {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.keypad-group .keypad-bank-area.loading {
    position: relative;
    padding-bottom: 1.2rem
}

.keypad-group .keypad-bank-area.loading .keypad-bank-loading {
    display: block
}

.keypad-group .keypad-bank-area.loading .keypad-bank-info {
    display: block
}

.keypad-group .keypad-bank-area.error .keypad-bank-util {
    display: block
}

.keypad-group .keypad-bank-info {
    height: 2rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    font-size: 0
}

.keypad-group .keypad-bank-info .ico-bank,
.keypad-group .keypad-bank-info [class^="ico-pb"] {
    margin-right: 0.4rem;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto
}

.keypad-group .keypad-bank-info .bank-txt00 {
    display: inline-block;
    vertical-align: middle;
    font-size: 1.6rem;
    line-height: 1.3125;
    font-weight: bold;
    color: var(--color-g900, #141414)
}

.keypad-group .keypad-bank-info .bank-txt01 {
    display: inline-block;
    vertical-align: middle;
    font-size: 1.6rem;
    line-height: 1.3125;
    font-weight: bold;
    color: var(--color-g900, #141414);
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 9.7rem;
    -webkit-box-flex: 1;
    -ms-flex: 1 0 auto;
    flex: 1 0 auto
}

.keypad-group .keypad-bank-info .bank-txt02 {
    display: inline-block;
    vertical-align: middle;
    font-size: 1.6rem;
    line-height: 1.3125;
    font-weight: bold;
    color: var(--color-g900, #141414);
    margin-left: 0.4rem
}

.keypad-group .keypad-bank-info .bank-sub-txt {
    display: inline-block;
    vertical-align: middle;
    font-size: 1.6rem;
    line-height: 1.3125;
    font-weight: 400;
    color: var(--color-g700, #7d7d7d);
    margin-left: 0.4rem;
    -webkit-box-flex: 1;
    -ms-flex: 1 0 auto;
    flex: 1 0 auto
}

.keypad-group .keypad-bank-info .selectbox-group {
    margin: 0
}

.keypad-group .keypad-bank-loading {
    display: none;
    height: 2rem;
    line-height: 2rem;
    background: url("../../img/mmk/common/ico_remit_loadingdot.png") no-repeat left center;
    background-size: 2rem 2rem;
    padding-left: 2rem
}

.keypad-group .keypad-bank-util {
    display: none;
    margin-top: 1.2rem;
    position: absolute;
    top: 2rem
}

.keypad-group .keypad-bank-util .keypad-bank-msg {
    font-size: 1.6rem;
    line-height: 1.3125;
    font-weight: 400;
    color: var(--color-re700, #f02727);
    -webkit-animation: 2.35s shaking linear alternate;
    animation: 2.35s shaking linear alternate;
    -webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;
    -webkit-animation-delay: 1s;
    animation-delay: 1s
}

@-webkit-keyframes shaking {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    2% {
        -webkit-transform: translateX(5px);
        transform: translateX(5px)
    }
    4% {
        -webkit-transform: translateX(-5px);
        transform: translateX(-5px)
    }
    6% {
        -webkit-transform: translateX(5px);
        transform: translateX(5px)
    }
    10% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    40% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    42% {
        -webkit-transform: translateX(5px);
        transform: translateX(5px)
    }
    44% {
        -webkit-transform: translateX(-5px);
        transform: translateX(-5px)
    }
    46% {
        -webkit-transform: translateX(5px);
        transform: translateX(5px)
    }
    50% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    90% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    92% {
        -webkit-transform: translateX(5px);
        transform: translateX(5px)
    }
    94% {
        -webkit-transform: translateX(-5px);
        transform: translateX(-5px)
    }
    96% {
        -webkit-transform: translateX(5px);
        transform: translateX(5px)
    }
    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}

@keyframes shaking {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    2% {
        -webkit-transform: translateX(5px);
        transform: translateX(5px)
    }
    4% {
        -webkit-transform: translateX(-5px);
        transform: translateX(-5px)
    }
    6% {
        -webkit-transform: translateX(5px);
        transform: translateX(5px)
    }
    10% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    40% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    42% {
        -webkit-transform: translateX(5px);
        transform: translateX(5px)
    }
    44% {
        -webkit-transform: translateX(-5px);
        transform: translateX(-5px)
    }
    46% {
        -webkit-transform: translateX(5px);
        transform: translateX(5px)
    }
    50% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    90% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    92% {
        -webkit-transform: translateX(5px);
        transform: translateX(5px)
    }
    94% {
        -webkit-transform: translateX(-5px);
        transform: translateX(-5px)
    }
    96% {
        -webkit-transform: translateX(5px);
        transform: translateX(5px)
    }
    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}

.keypad-group .keypad-row-output {
    -webkit-box-flex: 1;
    -ms-flex: auto;
    flex: auto;
    padding: 0 2.0rem;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.keypad-group .keypad-row-input {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.keypad-group .keypad-row-btn {
    padding: 0 2.0rem 2.4rem;
    margin-top: 0.8rem
}

.keypad-group .keypad-row-btn .btn-group {
    margin-top: 0
}

.keypad-group .keypad-value .placeholder {
    font-size: 2.8rem;
    line-height: 1.35714;
    font-weight: bold;
    color: var(--color-g500, #b8b8b8)
}

:root .keypad-group .keypad-value .placeholder {
    color: var(--txt-placeholder, #8694b1)
}

.keypad-group .keypad-value .placeholder .add-placeholder {
    display: block;
    font-size: 1.4rem;
    line-height: 1.42857;
    font-weight: 400;
    margin-top: 0.8rem
}

.keypad-group .keypad-value .placeholder {
    position: relative
}

.keypad-group .keypad-value .placeholder:before {
    content: '';
    display: block;
    width: 0.2rem;
    height: 3.2rem;
    background-color: var(--color-pn, #17008c);
    position: absolute;
    top: 50%;
    left: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-animation: fakeCursor 1s infinite;
    animation: fakeCursor 1s infinite;
    -webkit-animation-play-state: running;
    animation-play-state: running
}

:root .keypad-group .keypad-value .placeholder:before {
    background-color: var(--ico-cursor, #4262ff)
}

.keypad-group .keypad-value.active .placeholder:before {
    display: none
}

.keypad-group .keypad-value .value {
    display: none
}

.keypad-group .keypad-value .value em,
.keypad-group .keypad-value .value span {
    font-size: 2.8rem;
    line-height: 1.35714;
    font-weight: bold
}

.keypad-group .keypad-value .value .btn-delete-txt {
    vertical-align: 0.5rem;
    padding: 0.5rem 0 0.5rem 0.5rem
}

.keypad-group .keypad-value .value-sub-area {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    margin-top: 0.8rem
}

.keypad-group .keypad-value .value-sub-area .value-p {
    display: none;
    font-size: 1.6rem;
    line-height: 1.33333;
    font-weight: 400;
    color: var(--color-g900, #141414);
    white-space: nowrap
}

.keypad-group .keypad-value .value-sub-area .value-p:not(:last-child):after {
    content: '';
    display: inline-block;
    width: 1px;
    height: 1.4rem;
    background-color: var(--color-g300, #e0e0e0);
    margin: 0 0.8rem;
    vertical-align: -0.2rem
}

.keypad-group .keypad-value .value-sub-area .value-s {
    font-size: 1.6rem;
    line-height: 1.33333;
    font-weight: 400;
    color: var(--txt-quin, #8694b1)
}

.keypad-group .keypad-value .value-sub-area .value-s button {
    color: inherit;
    border-bottom: 1px solid var(--txt-quin, #8694b1)
}

.keypad-group .keypad-value .value-sub-area .value-s button:disabled {
    border: 0
}

.keypad-group .keypad-value .validation-area {
    display: none
}

.keypad-group .keypad-value .validation-txt-set {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    margin-top: 0.8rem
}

.keypad-group .keypad-value .validation-txt-set [class^="valied-"] {
    display: inline-block;
    font-size: 1.6rem;
    line-height: 1.3125;
    font-weight: 400;
    color: var(--color-re700, #f02727)
}

.keypad-group .keypad-value .validation-txt-set .valied-txt {
    margin-right: 0.4rem
}

.keypad-group .keypad-value .validation-txt-set .valied-link {
    border-bottom: 1px solid var(--color-re700, #f02727);
    line-height: 1.2
}

.keypad-group .keypad-value .validation-txt-set .valied-link.disabled {
    border: 0
}

.keypad-group .keypad-value .amounttext {
    display: none
}

.keypad-group .keypad-value.active .amounttext,
.keypad-group .keypad-value.active .value {
    display: block
}

.keypad-group .keypad-value.active .value-sub-area .value-p {
    display: block
}

.keypad-group .keypad-value.active .placeholder {
    display: none
}

.keypad-group .keypad-value.error .value em,
.keypad-group .keypad-value.error .value span {
    color: var(--color-re700, #f02727)
}

.keypad-group .keypad-value.error .value-sub-area {
    display: none
}

.keypad-group .keypad-value.error .validation-area {
    display: block
}

.keypad-group .keypad-value .amounttext {
    font-size: 1.2rem;
    line-height: 1.33333;
    font-weight: 400;
    color: var(--color-g600, #9b9b9b)
}

.keypad-group.ty01 .keypad-value.active .value-sub-area .value-s {
    display: none
}

.keypad-group.ty01 .keypad-value.active .value-sub-area .value-p:not(:last-child):after {
    display: none
}

.keypad-group .keypad-value.error.hold .value-sub-area {
    display: block;
    float: left
}

.keypad-group .keypad-value.error.hold .value-sub-area .value-p {
    color: var(--color-re700, #f02727)
}

.keypad-group .keypad-value.error.hold .value-sub-area .value-s {
    display: none
}

.keypad-group .keypad-value.error.hold .value-sub-area .value-p:not(:last-child):after {
    content: '';
    display: inline-block;
    width: 1px;
    height: 1.4rem;
    background-color: var(--color-g300, #e0e0e0);
    margin: 0 0.8rem;
    vertical-align: -0.2rem
}

.keypad-group[data-code="preferCode"].ty01 .keypad-value .value-sub-area .value-s.type-prefer {
    display: none
}

.keypad-group[data-code="preferCode"].preferCode .keypad-value .value-sub-area .value-s {
    display: none
}

.keypad-group[data-code="preferCode"].preferCode .keypad-value .value-sub-area .value-s.type-prefer {
    display: block
}

/*! [numpad-amount-val] */

.keypad-group .keypad-value .value [data-role="numpad-amount-val"] span {
    display: inline-block;
    opacity: 0
}

.keypad-group[data-trn="oversea"] .keypad-value .value [data-role="numpad-amount-val"] {
    opacity: 1;
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    transform: translate(0, 0)
}

.keypad-group .keypad-value .value [data-role="numpad-amount-val"] span:not(.remove):nth-last-of-type(3n+1):after {
    content: ','
}

.keypad-group .keypad-value .value [data-role="numpad-amount-val"] span:not(.remove):nth-last-of-type(1):after {
    content: ''
}

.keypad-group .keypad-value .value [data-role="numpad-amount-val"] span.show {
    -webkit-animation: numberShow .1s linear forwards;
    animation: numberShow .1s linear forwards
}

.keypad-group .keypad-value .value [data-role="numpad-amount-val"] span.remove {
    -webkit-animation: numberRemove .1s linear forwards;
    animation: numberRemove .1s linear forwards
}

.keypad-group .keypad-value.error {
    -webkit-animation: none;
    animation: none
}

.keypad-group .keypad-value.error.motion .value {
    -webkit-animation: 1s shakingShort ease-in-out forwards;
    animation: 1s shakingShort ease-in-out forwards
}

.keypad-group .keypad-value .value-sub-area {
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap
}

.keypad-group .keypad-value .validation-txt-set {
    display: none
}

.keypad-group .keypad-value .validation-txt-set.show {
    display: block
}

.prd-cal-keypad .keypad-value .value,
.prd-cal-keypad .keypad-value .value-sub-area .value-p {
    display: none
}

.keypad-group .keypad-bank-util .keypad-bank-msg {
    -webkit-animation: 1s shakingShort ease-in-out forwards;
    animation: 1s shakingShort ease-in-out forwards
}

@-webkit-keyframes numberShow {
    100% {
        opacity: 1;
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0)
    }
    90% {
        opacity: .9;
        -webkit-transform: translate(0, -10%);
        transform: translate(0, -10%)
    }
    50% {
        opacity: .4;
        -webkit-transform: translate(0, -25%);
        transform: translate(0, -25%)
    }
    0% {
        opacity: 0;
        -webkit-transform: translate(0, -50%);
        transform: translate(0, -50%)
    }
}

@keyframes numberShow {
    100% {
        opacity: 1;
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0)
    }
    90% {
        opacity: .9;
        -webkit-transform: translate(0, -10%);
        transform: translate(0, -10%)
    }
    50% {
        opacity: .4;
        -webkit-transform: translate(0, -25%);
        transform: translate(0, -25%)
    }
    0% {
        opacity: 0;
        -webkit-transform: translate(0, -50%);
        transform: translate(0, -50%)
    }
}

@-webkit-keyframes numberRemove {
    100% {
        opacity: 0;
        -webkit-transform: translate(0, -50%);
        transform: translate(0, -50%)
    }
    50% {
        opacity: .5;
        -webkit-transform: translate(0, -25%);
        transform: translate(0, -25%)
    }
    10% {
        opacity: .9;
        -webkit-transform: translate(0, -10%);
        transform: translate(0, -10%)
    }
    0% {
        opacity: 1;
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0)
    }
}

@keyframes numberRemove {
    100% {
        opacity: 0;
        -webkit-transform: translate(0, -50%);
        transform: translate(0, -50%)
    }
    50% {
        opacity: .5;
        -webkit-transform: translate(0, -25%);
        transform: translate(0, -25%)
    }
    10% {
        opacity: .9;
        -webkit-transform: translate(0, -10%);
        transform: translate(0, -10%)
    }
    0% {
        opacity: 1;
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0)
    }
}

@-webkit-keyframes shakingShort {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    10% {
        -webkit-transform: translateX(4px);
        transform: translateX(4px)
    }
    20% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    30% {
        -webkit-transform: translateX(4px);
        transform: translateX(4px)
    }
    40% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    50% {
        -webkit-transform: translateX(4px);
        transform: translateX(4px)
    }
    60% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    70% {
        -webkit-transform: translateX(4px);
        transform: translateX(4px)
    }
    80% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    90% {
        -webkit-transform: translateX(4px);
        transform: translateX(4px)
    }
    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}

@keyframes shakingShort {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    10% {
        -webkit-transform: translateX(4px);
        transform: translateX(4px)
    }
    20% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    30% {
        -webkit-transform: translateX(4px);
        transform: translateX(4px)
    }
    40% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    50% {
        -webkit-transform: translateX(4px);
        transform: translateX(4px)
    }
    60% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    70% {
        -webkit-transform: translateX(4px);
        transform: translateX(4px)
    }
    80% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    90% {
        -webkit-transform: translateX(4px);
        transform: translateX(4px)
    }
    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}

.keypad-group .keypad-tap {
    padding-bottom: 3.2rem;
    text-align: center
}

.keypad-group .keypad-tap span {
    font-size: 1.4rem;
    line-height: 1.42857;
    font-weight: 400
}

.keypad-group .keypad-quick {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 0.8rem 2rem;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    text-align: center;
    width: 100%;
    z-index: 10
}

.keypad-group .keypad-quick .list-item {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 0px;
    flex: 1 1 0;
    color: var(--color-pn, #17008c)
}

.keypad-group .keypad-quick .list-item+.list-item {
    margin-left: 0.8rem
}

.keypad-group .keypad-quick .keypad-btn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 3.2rem;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-color: var(--color-cg300, #f1f6fb);
    border-radius: 0.8rem
}

:root .keypad-group .keypad-quick .keypad-btn {
    background-color: var(--bg-qua, #f7f9fd)
}

.keypad-group .keypad-quick .txt {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400
}

.keypad-group .keypad-table {
    width: 100%;
    height: 100%
}

.keypad-group .keypad-table th {
    text-align: center;
    height: 6.8rem;
    font-size: 2.4rem
}

.keypad-group .keypad-table th button {
    width: 100%;
    height: 100%;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    color: var(--color-pb100, #000)
}

[data-type="saving"] .value-sub-area .value-p:after {
    display: none !important
}

.value-sub-area[data-saving="plus"] .value-p,
.value-sub-area[data-saving="plus"] .value-s {
    color: var(--txt-ter-active) !important
}

.value-sub-area[data-saving="plus"][over-saving="true"] .value-p,
.value-sub-area[data-saving="plus"][over-saving="true"] .value-s {
    color: var(--color-re700) !important
}

.keypad-group .keypad-value .value-sub-area[data-saving="plus"][over-saving="true"] .value-s button {
    border-bottom-color: var(--color-re700)
}

.value-sub-area[data-saving="minus"] .value-p,
.value-sub-area[data-saving="minus"] .value-s {
    color: var(--color-re700) !important
}

.value-sub-area[data-saving="etc"] .value-p,
.value-sub-area[data-saving="etc"] .value-s {
    display: none !important
}

.value-sub-area[data-saving="plus"][over-balance="true"] .value-p,
.value-sub-area[data-saving="plus"][over-balance="true"] .value-s {
    color: var(--color-re700, #f02727) !important
}

.value-sub-area[data-saving="plus"][over-balance="true"] .value-P button,
.value-sub-area[data-saving="plus"][over-balance="true"] .value-s button {
    border-bottom: 1px solid var(--color-re700, #f02727)
}

/*! 키패드 버튼 높이 고정 2023-03-27 */

@media only screen and (min-height: 926px) {
    .keypad-group .keypad-table th {
        height: 8.8rem
    }
    .keypad-group.keypad-popup .keypad-table th {
        height: 6.8rem
    }
}

@media only screen and (min-height: 780px) and (max-height: 925px) {
    .keypad-group .keypad-table th {
        height: 6.8rem
    }
}

@media only screen and (min-height: 667px) and (max-height: 779px) {
    .keypad-group .keypad-table th {
        height: 5.6rem
    }
}

@media only screen and (max-height: 666px) {
    .keypad-group .keypad-table th {
        height: 5rem
    }
}

.keypad-group .keypad-btn-wrap.type1 {
    display: grid;
    grid-template-columns: repeat(3, 1fr)
}

.keypad-group .keypad-btn-wrap.type1.keypad-table {
    height: auto
}

.keypad-group .keypad-btn-wrap.type1 .number {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 6.8rem;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    font-size: 2.4rem;
    color: var(--color-pb100)
}

/*! 키패드 버튼 높이 고정 2023-03-27 */

@media only screen and (min-height: 926px) {
    .keypad-group .keypad-btn-wrap.type1 .number {
        height: 8.8rem
    }
}

@media only screen and (min-height: 780px) and (max-height: 925px) {
    .keypad-group .keypad-btn-wrap.type1 .number {
        height: 6.8rem
    }
}

@media only screen and (min-height: 667px) and (max-height: 779px) {
    .keypad-group .keypad-btn-wrap.type1 .number {
        height: 5.6rem
    }
}

@media only screen and (max-height: 666px) {
    .keypad-group .keypad-btn-wrap.type1 .number {
        height: 5rem
    }
}

@media only screen and (device-width: 320px) and (device-height: 568px) {}

/*! component element spinner loading 메인, 컨텐츠 */

.component-loader {
    position: relative;
    text-align: center;
    margin: 6rem 0
}

.component-loader .skeleton-loader {
    top: 0;
    margin-top: 0
}

.component-loader .txt {
    padding-top: 4.8rem;
    font-size: 1.4rem;
    line-height: 1.42857;
    font-weight: bold
}

/*!
* component element
* loading
* 전체 or 컨텐츠
*/

.loading-group {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    background-color: var(--color-pb70, #000000B2);
    z-index: 100
}

.loading-group .loading-box {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    font-size: 0
}

.loading-group .dot {
    width: 2.4rem;
    height: 2.4rem;
    border-radius: 2.4rem;
    display: inline-block;
    background-color: var(--color-g100, #f8f8f8);
    -webkit-transform: scale(0);
    -ms-transform: scale(0);
    transform: scale(0);
    margin: 0 0.2rem
}

.loading-group .dot01 {
    -webkit-animation-delay: .3s;
    animation-delay: .3s
}

.loading-group .dot02 {
    -webkit-animation-delay: .6s;
    animation-delay: .6s
}

.loading-group .dot03 {
    -webkit-animation-delay: .9s;
    animation-delay: .9s
}

.loading-group .dot04 {
    -webkit-animation-delay: 1.2s;
    animation-delay: 1.2s
}

.loading-group.in-content {
    position: absolute
}

.css-animation-bounce {
    -webkit-animation: animationBounce 1.5s infinite ease-in-out;
    animation: animationBounce 1.5s infinite ease-in-out;
    -webkit-transform-origin: center;
    -ms-transform-origin: center;
    transform-origin: center
}

@-webkit-keyframes animationBounce {
    0%,
    100% {
        opacity: 0;
        -webkit-transform: scale(0);
        transform: scale(0)
    }
    50% {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

@keyframes animationBounce {
    0%,
    100% {
        opacity: 0;
        -webkit-transform: scale(0);
        transform: scale(0)
    }
    50% {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

/*!
* component element
* loading
* 컨텐츠 로딩
*/

.dot-pulse {
    position: relative;
    left: -9988px;
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 50%;
    background-color: var(--ico-sec);
    color: var(--ico-sec);
    -webkit-box-shadow: 9988px 0 0 -5px var(--ico-sec);
    box-shadow: 9988px 0 0 -5px var(--ico-sec);
    -webkit-animation: dotPulse 1.5s infinite linear;
    animation: dotPulse 1.5s infinite linear;
    -webkit-animation-delay: .25s;
    animation-delay: .25s
}

.dot-pulse:after,
.dot-pulse:before {
    content: '';
    display: inline-block;
    position: absolute;
    top: 0;
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 50%;
    background-color: var(--ico-sec);
    color: var(--ico-sec)
}

.dot-pulse:before {
    -webkit-box-shadow: 10000px 0 0 -5px var(--ico-sec);
    box-shadow: 10000px 0 0 -5px var(--ico-sec);
    -webkit-animation: dotPulseBefore 1.5s infinite linear;
    animation: dotPulseBefore 1.5s infinite linear;
    -webkit-animation-delay: 0s;
    animation-delay: 0s
}

.dot-pulse:after {
    -webkit-box-shadow: 10012px 0 0 -5px var(--ico-sec);
    box-shadow: 10012px 0 0 -5px var(--ico-sec);
    -webkit-animation: dotPulseAfter 1.5s infinite linear;
    animation: dotPulseAfter 1.5s infinite linear;
    -webkit-animation-delay: .5s;
    animation-delay: .5s
}

@-webkit-keyframes dotPulseBefore {
    0% {
        -webkit-box-shadow: 9988px 0 0 -5px var(--ico-sec);
        box-shadow: 9988px 0 0 -5px var(--ico-sec)
    }
    30% {
        -webkit-box-shadow: 9988px 0 0 2px var(--ico-sec);
        box-shadow: 9988px 0 0 2px var(--ico-sec)
    }
    100%,
    60% {
        -webkit-box-shadow: 9988px 0 0 -5px var(--ico-sec);
        box-shadow: 9988px 0 0 -5px var(--ico-sec)
    }
}

@keyframes dotPulseBefore {
    0% {
        -webkit-box-shadow: 9988px 0 0 -5px var(--ico-sec);
        box-shadow: 9988px 0 0 -5px var(--ico-sec)
    }
    30% {
        -webkit-box-shadow: 9988px 0 0 2px var(--ico-sec);
        box-shadow: 9988px 0 0 2px var(--ico-sec)
    }
    100%,
    60% {
        -webkit-box-shadow: 9988px 0 0 -5px var(--ico-sec);
        box-shadow: 9988px 0 0 -5px var(--ico-sec)
    }
}

@-webkit-keyframes dotPulse {
    0% {
        -webkit-box-shadow: 10000px 0 0 -5px var(--ico-sec);
        box-shadow: 10000px 0 0 -5px var(--ico-sec)
    }
    30% {
        -webkit-box-shadow: 10000px 0 0 2px var(--ico-sec);
        box-shadow: 10000px 0 0 2px var(--ico-sec)
    }
    100%,
    60% {
        -webkit-box-shadow: 10000px 0 0 -5px var(--ico-sec);
        box-shadow: 10000px 0 0 -5px var(--ico-sec)
    }
}

@keyframes dotPulse {
    0% {
        -webkit-box-shadow: 10000px 0 0 -5px var(--ico-sec);
        box-shadow: 10000px 0 0 -5px var(--ico-sec)
    }
    30% {
        -webkit-box-shadow: 10000px 0 0 2px var(--ico-sec);
        box-shadow: 10000px 0 0 2px var(--ico-sec)
    }
    100%,
    60% {
        -webkit-box-shadow: 10000px 0 0 -5px var(--ico-sec);
        box-shadow: 10000px 0 0 -5px var(--ico-sec)
    }
}

@-webkit-keyframes dotPulseAfter {
    0% {
        -webkit-box-shadow: 10012px 0 0 -5px var(--ico-sec);
        box-shadow: 10012px 0 0 -5px var(--ico-sec)
    }
    30% {
        -webkit-box-shadow: 10012px 0 0 2px var(--ico-sec);
        box-shadow: 10012px 0 0 2px var(--ico-sec)
    }
    100%,
    60% {
        -webkit-box-shadow: 10012px 0 0 -5px var(--ico-sec);
        box-shadow: 10012px 0 0 -5px var(--ico-sec)
    }
}

@keyframes dotPulseAfter {
    0% {
        -webkit-box-shadow: 10012px 0 0 -5px var(--ico-sec);
        box-shadow: 10012px 0 0 -5px var(--ico-sec)
    }
    30% {
        -webkit-box-shadow: 10012px 0 0 2px var(--ico-sec);
        box-shadow: 10012px 0 0 2px var(--ico-sec)
    }
    100%,
    60% {
        -webkit-box-shadow: 10012px 0 0 -5px var(--ico-sec);
        box-shadow: 10012px 0 0 -5px var(--ico-sec)
    }
}

.dot-pulse.sec {
    position: relative;
    left: -9988px;
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 50%;
    background-color: var(--ico-sec);
    color: var(--ico-sec);
    -webkit-box-shadow: 9988px 0 0 -5px var(--ico-sec);
    box-shadow: 9988px 0 0 -5px var(--ico-sec);
    -webkit-animation: dotSecPulse 1.5s infinite linear;
    animation: dotSecPulse 1.5s infinite linear;
    -webkit-animation-delay: .25s;
    animation-delay: .25s
}

.dot-pulse.sec:after,
.dot-pulse.sec:before {
    content: '';
    display: inline-block;
    position: absolute;
    top: 0;
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 50%;
    background-color: var(--ico-sec);
    color: var(--ico-sec)
}

.dot-pulse.sec:before {
    -webkit-box-shadow: 10000px 0 0 -5px var(--ico-sec);
    box-shadow: 10000px 0 0 -5px var(--ico-sec);
    -webkit-animation: dotSecPulseBefore 1.5s infinite linear;
    animation: dotSecPulseBefore 1.5s infinite linear;
    -webkit-animation-delay: 0s;
    animation-delay: 0s
}

.dot-pulse.sec:after {
    -webkit-box-shadow: 10012px 0 0 -5px var(--ico-sec);
    box-shadow: 10012px 0 0 -5px var(--ico-sec);
    -webkit-animation: dotSecPulseAfter 1.5s infinite linear;
    animation: dotSecPulseAfter 1.5s infinite linear;
    -webkit-animation-delay: .5s;
    animation-delay: .5s
}

@-webkit-keyframes dotSecPulseBefore {
    0% {
        -webkit-box-shadow: 9988px 0 0 -5px var(--ico-sec);
        box-shadow: 9988px 0 0 -5px var(--ico-sec)
    }
    30% {
        -webkit-box-shadow: 9988px 0 0 2px var(--ico-sec);
        box-shadow: 9988px 0 0 2px var(--ico-sec)
    }
    100%,
    60% {
        -webkit-box-shadow: 9988px 0 0 -5px var(--ico-sec);
        box-shadow: 9988px 0 0 -5px var(--ico-sec)
    }
}

@keyframes dotSecPulseBefore {
    0% {
        -webkit-box-shadow: 9988px 0 0 -5px var(--ico-sec);
        box-shadow: 9988px 0 0 -5px var(--ico-sec)
    }
    30% {
        -webkit-box-shadow: 9988px 0 0 2px var(--ico-sec);
        box-shadow: 9988px 0 0 2px var(--ico-sec)
    }
    100%,
    60% {
        -webkit-box-shadow: 9988px 0 0 -5px var(--ico-sec);
        box-shadow: 9988px 0 0 -5px var(--ico-sec)
    }
}

@-webkit-keyframes dotSecPulse {
    0% {
        -webkit-box-shadow: 10000px 0 0 -5px var(--ico-sec);
        box-shadow: 10000px 0 0 -5px var(--ico-sec)
    }
    30% {
        -webkit-box-shadow: 10000px 0 0 2px var(--ico-sec);
        box-shadow: 10000px 0 0 2px var(--ico-sec)
    }
    100%,
    60% {
        -webkit-box-shadow: 10000px 0 0 -5px var(--ico-sec);
        box-shadow: 10000px 0 0 -5px var(--ico-sec)
    }
}

@keyframes dotSecPulse {
    0% {
        -webkit-box-shadow: 10000px 0 0 -5px var(--ico-sec);
        box-shadow: 10000px 0 0 -5px var(--ico-sec)
    }
    30% {
        -webkit-box-shadow: 10000px 0 0 2px var(--ico-sec);
        box-shadow: 10000px 0 0 2px var(--ico-sec)
    }
    100%,
    60% {
        -webkit-box-shadow: 10000px 0 0 -5px var(--ico-sec);
        box-shadow: 10000px 0 0 -5px var(--ico-sec)
    }
}

@-webkit-keyframes dotSecPulseAfter {
    0% {
        -webkit-box-shadow: 10012px 0 0 -5px var(--ico-sec);
        box-shadow: 10012px 0 0 -5px var(--ico-sec)
    }
    30% {
        -webkit-box-shadow: 10012px 0 0 2px var(--ico-sec);
        box-shadow: 10012px 0 0 2px var(--ico-sec)
    }
    100%,
    60% {
        -webkit-box-shadow: 10012px 0 0 -5px var(--ico-sec);
        box-shadow: 10012px 0 0 -5px var(--ico-sec)
    }
}

@keyframes dotSecPulseAfter {
    0% {
        -webkit-box-shadow: 10012px 0 0 -5px var(--ico-sec);
        box-shadow: 10012px 0 0 -5px var(--ico-sec)
    }
    30% {
        -webkit-box-shadow: 10012px 0 0 2px var(--ico-sec);
        box-shadow: 10012px 0 0 2px var(--ico-sec)
    }
    100%,
    60% {
        -webkit-box-shadow: 10012px 0 0 -5px var(--ico-sec);
        box-shadow: 10012px 0 0 -5px var(--ico-sec)
    }
}

.dot-flashing {
    position: relative;
    left: 1.7rem;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background-color: var(--color-pn, #17008c);
    color: var(--color-pn, #17008c);
    -webkit-animation: dotFlashing 1s infinite linear alternate;
    animation: dotFlashing 1s infinite linear alternate;
    -webkit-animation-delay: .5s;
    animation-delay: .5s
}

.dot-flashing:after,
.dot-flashing:before {
    content: '';
    display: inline-block;
    position: absolute;
    top: 0
}

.dot-flashing:before {
    left: -1.5rem;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background-color: var(--color-pn, #17008c);
    color: var(--color-pn, #17008c);
    -webkit-animation: dotFlashing 1s infinite alternate;
    animation: dotFlashing 1s infinite alternate;
    -webkit-animation-delay: 0s;
    animation-delay: 0s
}

.dot-flashing:after {
    left: 1.5rem;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background-color: var(--color-pn, #17008c);
    color: var(--color-pn, #17008c);
    -webkit-animation: dotFlashing 1s infinite alternate;
    animation: dotFlashing 1s infinite alternate;
    -webkit-animation-delay: 1s;
    animation-delay: 1s
}

@-webkit-keyframes dotFlashing {
    0% {
        background-color: var(--color-pn, #17008c)
    }
    100%,
    50% {
        background-color: var(--color-vo100, #ece1fe)
    }
}

@keyframes dotFlashing {
    0% {
        background-color: var(--color-pn, #17008c)
    }
    100%,
    50% {
        background-color: var(--color-vo100, #ece1fe)
    }
}

.component-list.all-account .dot-flashing,
.component-list.all-account .dot-flashing:after,
.component-list.all-account .dot-flashing:before,
.main-all-account-list .dot-flashing,
.main-all-account-list .dot-flashing:after,
.main-all-account-list .dot-flashing:before,
.order-sortable-list .dot-flashing,
.order-sortable-list .dot-flashing:after,
.order-sortable-list .dot-flashing:before {
    width: 6px;
    height: 6px;
    background-color: var(--ico-ter);
    color: var(--ico-ter);
    -webkit-animation: dotFlashing3 1s infinite linear alternate;
    animation: dotFlashing3 1s infinite linear alternate
}

.component-list.all-account .dot-flashing,
.main-all-account-list .dot-flashing,
.order-sortable-list .dot-flashing {
    left: 1.1rem;
    -webkit-animation-delay: 0.5s;
    animation-delay: 0.5s
}

.component-list.all-account .dot-flashing:before,
.main-all-account-list .dot-flashing:before,
.order-sortable-list .dot-flashing:before {
    left: -1.1rem;
    -webkit-animation-delay: 0s;
    animation-delay: 0s
}

.component-list.all-account .dot-flashing:after,
.main-all-account-list .dot-flashing:after,
.order-sortable-list .dot-flashing:after {
    left: 1.1rem;
    -webkit-animation-delay: 1s;
    animation-delay: 1s
}

@-webkit-keyframes dotFlashing3 {
    0% {
        background-color: var(--ico-ter)
    }
    100%,
    50% {
        background-color: var(--ico-qua)
    }
}

@keyframes dotFlashing3 {
    0% {
        background-color: var(--ico-ter)
    }
    100%,
    50% {
        background-color: var(--ico-qua)
    }
}

.dot-flashing-new {
    position: relative;
    width: 3rem;
    height: 1.2rem
}

.dot-flashing-new .dot {
    position: absolute;
    top: 0;
    left: 0;
    display: inline-block;
    width: 0.6rem;
    height: 0.6rem;
    border-radius: 50%;
    background-color: var(--color-g400);
    -webkit-animation: dotFlashing-new 0.6s ease-in infinite alternate;
    animation: dotFlashing-new 0.6s ease-in infinite alternate
}

.dot-flashing-new .dot.dot2 {
    left: 50%;
    margin-left: -0.3rem;
    -webkit-animation-delay: 0.1s;
    animation-delay: 0.1s
}

.dot-flashing-new .dot.dot3 {
    left: auto;
    right: 0;
    -webkit-animation-delay: 0.2s;
    animation-delay: 0.2s
}

@-webkit-keyframes dotFlashing-new {
    0% {
        background-color: var(--color-g400);
        top: 0
    }
    50% {
        background-color: var(--ico-ter);
        top: 0.6rem
    }
    100% {
        background-color: var(--ico-ter);
        top: 0.6rem
    }
}

@keyframes dotFlashing-new {
    0% {
        background-color: var(--color-g400);
        top: 0
    }
    50% {
        background-color: var(--ico-ter);
        top: 0.6rem
    }
    100% {
        background-color: var(--ico-ter);
        top: 0.6rem
    }
}

.dot-flashing-new.type2 {
    height: 1rem
}

.dot-flashing-new.type2 .dot {
    background-color: var(--color-w50);
    -webkit-animation: dotFlashing-new2 0.6s ease-in infinite alternate;
    animation: dotFlashing-new2 0.6s ease-in infinite alternate
}

.dot-flashing-new.type2 .dot.dot2 {
    -webkit-animation-delay: 0.1s;
    animation-delay: 0.1s
}

.dot-flashing-new.type2 .dot.dot3 {
    -webkit-animation-delay: 0.2s;
    animation-delay: 0.2s
}

@-webkit-keyframes dotFlashing-new2 {
    0% {
        background-color: var(--color-w50);
        top: 0
    }
    50% {
        background-color: var(--color-og400);
        top: 0.5rem
    }
    100% {
        background-color: var(--color-og400);
        top: 0.5rem
    }
}

@keyframes dotFlashing-new2 {
    0% {
        background-color: var(--color-w50);
        top: 0
    }
    50% {
        background-color: var(--color-og400);
        top: 0.5rem
    }
    100% {
        background-color: var(--color-og400);
        top: 0.5rem
    }
}

.dot-flashing-new.type3 {
    -webkit-transform: scale(0.6);
    -ms-transform: scale(0.6);
    transform: scale(0.6);
    height: 1.8rem
}

.dot-flashing.type2 {
    position: relative;
    left: 1.1rem;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background-color: var(--color-g500);
    color: var(--color-g500);
    -webkit-animation: dotFlashing-type2 0.6s infinite linear alternate;
    animation: dotFlashing-type2 0.6s infinite linear alternate;
    -webkit-animation-delay: .3s;
    animation-delay: .3s
}

.dot-flashing.type2:after,
.dot-flashing.type2:before {
    content: '';
    display: inline-block;
    position: absolute;
    top: 0
}

.dot-flashing.type2:before {
    left: -1.1rem;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background-color: var(--color-g500);
    color: var(--color-g500);
    -webkit-animation: dotFlashing-type2 0.6s infinite alternate;
    animation: dotFlashing-type2 0.6s infinite alternate;
    -webkit-animation-delay: 0s;
    animation-delay: 0s
}

.dot-flashing.type2:after {
    left: 1.1rem;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background-color: var(--color-g500);
    color: var(--color-g500);
    -webkit-animation: dotFlashing-type2 0.6s infinite alternate;
    animation: dotFlashing-type2 0.6s infinite alternate;
    -webkit-animation-delay: .6s;
    animation-delay: .6s
}

@-webkit-keyframes dotFlashing-type2 {
    0% {
        background-color: var(--color-g500)
    }
    100%,
    50% {
        background-color: var(--color-g400)
    }
}

@keyframes dotFlashing-type2 {
    0% {
        background-color: var(--color-g500)
    }
    100%,
    50% {
        background-color: var(--color-g400)
    }
}

.dot-flashing-new.type4 {
    position: relative;
    width: 3rem;
    height: 1.2rem
}

.dot-flashing-new.type4 .dot {
    position: absolute;
    top: 0;
    left: 0;
    display: inline-block;
    width: 0.6rem;
    height: 0.6rem;
    border-radius: 50%;
    background-color: var(--ico-qua);
    -webkit-animation: dotFlashing-new4 0.6s linear infinite alternate;
    animation: dotFlashing-new4 0.6s linear infinite alternate
}

.dot-flashing-new.type4 .dot.dot2 {
    left: 50%;
    margin-left: -0.3rem;
    -webkit-animation-delay: 0.3s;
    animation-delay: 0.3s
}

.dot-flashing-new.type4 .dot.dot3 {
    left: auto;
    right: 0;
    -webkit-animation-delay: 0.6s;
    animation-delay: 0.6s
}

@-webkit-keyframes dotFlashing-new4 {
    0% {
        background-color: var(--ico-qua);
        top: 0
    }
    50% {
        background-color: var(--color-w40);
        top: 0.6rem
    }
    100% {
        background-color: var(--color-w40);
        top: 0.6rem
    }
}

@keyframes dotFlashing-new4 {
    0% {
        background-color: var(--ico-qua);
        top: 0
    }
    50% {
        background-color: var(--color-w40);
        top: 0.6rem
    }
    100% {
        background-color: var(--color-w40);
        top: 0.6rem
    }
}

/*!
* component element
* 브릿지 loading
* 컨텐츠 로딩
*/

.component-text-simple.invest-loading .logo-default {
    height: 3.6rem;
    margin-bottom: 1.6rem
}

.component-text-simple.invest-loading .logo-default img {
    width: auto;
    height: 100%
}

/*!
* Use Device Media-query
*/

/*! mixin 영역 */

/*!
* Status Bar top area android (상단바 영역과 컨텐츠 간격 컨트롤)
* Status Bar 영역 확장 확장버전에는 body 에 statusExpension 클래스 추가되어 컨트롤함
* 안드로이드 : 24px;아이폰 : 44px(노치);20px(노치X);
*/

/*! mixin :공통 - 헤더영역 */

html.android.statusExpension .component-header {
    padding-top: 2.4rem
}

html.android.statusExpension .popup-header .component-header {
    padding-top: 0
}

/*! 홈 - 일반 */

html.android.statusExpension .home-default .main-container-component.bg-main {
    padding-top: calc(2.4rem + 5.6rem)
}

/*! 홈 - 추천 */

html.android.statusExpension .main-tab-container [class^="main-tab-content0"].scrolling .component-tab.sticky-tab {
    top: calc(2.4rem + 0.2rem)
}

/*! 홈 - 혜택 */

html.android.statusExpension .page-inner-scroll.scrolling .component-tab.sticky-tab02 .tab-round-group {
    top: calc(2.4rem + 5rem)
}

/*! 홈 - 타임라인 */

html.android.statusExpension .main-tab-container [class^="main-tab-content0"].scrolling .component-form-date {
    top: calc(2.4rem + 5rem + 0.2rem)
}

/*! 홈 - 순서변경 */

html.android.statusExpension .page-inner-scroll.scrolling .component-text-simple.fixed-top {
    top: calc(2.4rem + 0.9rem)
}

/*! 공통 - 풀팝업일때 */

html.android.statusExpension .popup-dialog.ui-full .popup-group,
html.android.statusExpension .popup-dialog.ui-full-change .popup-group,
html.android.statusExpension .popup-dialog.ui-full-change.plus-box-event-pop .popup-group {
    padding-top: 2.4rem
}

html.android.statusExpension .popup-dialog.ui-full .popup-group:after {
    content: '';
    height: 2.4rem;
    background-color: var(--color-w100, #fff);
    position: fixed;
    top: 0;
    left: 0;
    width: 100%
}

html.android.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group:after {
    display: none
}

html.android.statusExpension .popup-dialog.ui-full-change.plus-box-event-pop .interest-group-top .ani-step1-1 {
    margin-top: 8.2rem
}

html.android.statusExpension .popup-dialog.ui-full .popup-group.shopping:after {
    background: var(--color-in700)
}

html.android.statusExpension .popup-dialog.ui-full .popup-group.shopping.bg-white:after {
    background-color: var(--color-w100, #fff)
}

/*! 홈 개편 */

html.android.statusExpension .component-header.main {
    padding-top: calc(2.4rem + 0.6rem)
}

html.android.statusExpension .ptr--ptr.ptr--refresh {
    padding-top: 2.4rem
}

html.android.statusExpension .ptr--ptr.ptr--refresh.pull-home {
    padding-top: 0;
    margin-top: 2.4rem
}

html.android.statusExpension .ptr--ptr.ptr--refresh+.component-header.main {
    padding-top: 0.6rem
}

html.android.statusExpension .scrolling .ptr--ptr.ptr--refresh+.component-header.main {
    padding-top: calc(2.4rem + 0.6rem)
}

html.android.statusExpension .component-tab.foru-tab-ver.scrollOn .tab-group.foru-type {
    top: calc(2.4rem)
}

html.android.statusExpension .component-header.main+.component-tab.foru-tab-ver {
    top: calc(2.4rem + 5.6rem)
}

html.android.statusExpension .component-main-bnf-tab {
    top: calc(2.4rem + 5rem)
}

html.android.statusExpension .invest-home .tab-list-group.sticky-invest {
    top: calc(2.4rem + 5.6rem)
}

html.android.statusExpension .component-ceo-calendar {
    top: calc(2.4rem + 5rem)
}

html.android.statusExpension .component-ceo-my-account.type2 {
    padding-top: calc(2.4rem + 37rem)
}

html.android.statusExpension .container-component-coach .coach-item01 {
    padding-top: 2.4rem
}

html.android.statusExpension .component-header.search {
    padding-top: calc(2.4rem + 1.2rem);
    height: auto
}

html.android.statusExpension .component-header.search.search-result {
    height: calc(2.4rem + 10.5rem)
}

html.android.statusExpension .popup-inner .component-header.search.search-result {
    height: 10.5rem
}

html.android.statusExpension .popup-inner .component-header.search.sticky {
    top: 2.4rem;
    padding-top: 1.2rem
}

html.android.statusExpension .section-component.alarm .component-keyword {
    top: calc(2.4rem + 5rem)
}

html.android.statusExpension .section-component.alarm .component-form-date {
    top: calc(2.4rem + 5rem)
}

html.android.statusExpension .section-component.alarm.alarm-filter .component-form-date {
    top: calc(2.4rem + 10.6rem)
}

html.android.statusExpension .main-tab-container [class^="main-tab-content0"] .component-main-refresh {
    top: calc(5rem + 2.4rem)
}

html.android.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group {
    padding-top: 2.2rem
}

html.android.statusExpension .safe-camp-kv .safe-camp-inner {
    margin-top: 2.4rem
}

/*! mixin :공통 - 헤더영역 */

/*! 검색 - 공통 */

html.android.statusExpension .component-list.fixed,
html.android.statusExpension .component-search[class*="fixed"] {
    top: calc(2.4rem + 5rem)
}

html.android.statusExpension .component-gathering-selected.active {
    top: calc(2.4rem + 5rem)
}

html.android.statusExpension .component-gathering-selected.active+.component-search {
    top: calc(2.4rem + 16.2rem)
}

/*! 모임통장 - 모임홈 */

html.android.statusExpension .component-meet-profile {
    margin-top: -2.4rem
}

html.android.statusExpension .component-meethome-profile {
    margin-top: calc(-5rem - 2.4rem)
}

/*! 상단 tab 고정 */

html.android.statusExpension .component-tab.food-cate-sticky,
html.android.statusExpension .component-text-simple+.component-tab.sticky,
html.android.statusExpension .section-component .component-tab.sticky,
html.android.statusExpension .section-component.living-price-tab .component-tab.sticky {
    top: calc(2.4rem + 5rem)
}

/*! 이체 */

html.android.statusExpension .component-header+.component-keypad {
    padding-top: 2.4rem
}

html.android.statusExpension .section-component-sticky {
    top: calc(2.4rem + 5rem)
}

html.android.statusExpension .fixed-msg-card,
html.android.statusExpension .section-flex-colume {
    height: calc(100vh - calc(2.4rem + 5rem))
}

html.android.statusExpension .section-flex-colume.type3 {
    height: calc(100vh - calc(2.4rem + 11rem))
}

html.android.statusExpension .section-flex-colume.type4 {
    height: calc(100vh - calc(2.4rem + 19.4rem))
}

html.android.statusExpension .component-card-sum-top.type2[class*="fixed"] {
    top: calc(2.4rem + 5rem)
}

html.android.statusExpension .dim-moneytree-wrap {
    top: calc(2.4rem + 5rem)
}

html.android.statusExpension .toast-wrap.ceo-type {
    bottom: auto;
    top: calc(2.4rem + 9.4rem)
}

html.android.statusExpension .component-tab.sticky+.article-component .component-search[class*="fixed"] {
    top: calc(2.4rem + 11rem)
}

html.android.statusExpension .container-component.shopping .component-text.sticky {
    top: calc(2.4rem + 5rem)
}

html.android.statusExpension .container-component.shopping .component-text.sticky+.component-tab .tab-list-group.sticky {
    top: calc(2.4rem + 9rem)
}

html.android.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach {
    padding-top: 2.4rem
}

html.android.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach.active {
    padding-top: 2.4rem
}

html.android.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group {
    padding-top: calc(2.4rem + 8.6rem)
}

html.android.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach .coach-close {
    padding-top: 0
}

html.android.statusExpension .page-inner-scroll.inandout-scroll .inandout-calendar-inner {
    top: 2.4rem
}

html.android.statusExpension .inandout-tab-wrap {
    top: calc(5.5rem + 2.4rem)
}

html.android.statusExpension .section-component.custom-policy .component-tab.sticky-chip {
    top: calc(2.4rem + 11rem)
}

html.android.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group.popup-inandout-pre-group {
    padding-top: 2.4rem
}

html.android.statusExpension .popup-inandout-group.pre-event .container-component-coach {
    top: 2.4rem
}

html.android.statusExpension .ailive-today-quiz {
    padding-top: 2.4rem
}

html.android.statusExpension .tab-list-group[data-sticky-item] {
    top: calc(2.4rem + 5rem)
}

html.android.statusExpension .container-component.ai-quiz .section-component.type2 {
    margin-top: calc(-5rem - 2.4rem);
    padding-top: calc(5rem + 2.4rem)
}

html.android.statusExpension .container-component.ai-quiz .section-component.type4 {
    margin-top: calc(-5rem - 2.4rem);
    padding-top: calc(5rem + 2.4rem)
}

html.android.statusExpension .fortune2025 .component-iframe {
    height: calc(100vh - (14.4rem + 2.4rem))
}

html.android.statusExpension .container-component.common-cert.h-center .section-component.cert-section {
    min-height: calc(100vh - 24rem)
}

html.android.statusExpension .section-component.stars-type1 {
    height: calc(100vh - (5rem + 2.4rem))
}

html.android.statusExpension .section-component.mission-top {
    top: calc(5rem + 2.4rem)
}

html.android.statusExpension .section-component.mission-rolling {
    top: calc(23.8rem + 2.4rem)
}

html.android.statusExpension .page-inner-scroll.money-mission.first-lock-entry.scroll-top .section-component.mission-rolling {
    top: calc(24.3rem + 2.4rem)
}

html.android.statusExpension .container-component.container-fixed {
    padding-top: calc(5rem + 2.4rem)
}

html.android.statusExpension .page-inner-scroll.no-overscroll-y .container-component {
    padding-top: calc(5rem + 2.4rem)
}

html.android.statusExpension .popup-dialog.ui-full .popup-group.mission-talisman:after {
    background-color: transparent
}

html.android.statusExpension .popup-dialog.ui-full .popup-group.coin-full-wrap:after {
    background-color: transparent
}

html.android.statusExpension .popup-dialog.ui-full .popup-group.transparent:after {
    background-color: transparent
}

html.android.statusExpension .component-invest-calendar {
    top: calc(5rem + 2.4rem)
}

html.android.statusExpension .page-inner-scroll.scrolling .component-tab.financial-scam {
    top: calc(5rem + 2.4rem)
}

html.android.statusExpension .component-tab.sticky-logotab {
    top: calc(5rem + 2.4rem)
}

html.android.statusExpension .tooltip-focus-group .tooltip-area.align-bottom.digit-signature {
    top: calc(2.2rem + 2.4rem)
}

html.android.statusExpension .weekly-invest-main-bg {
    margin-top: calc(var(--header-height) * -1 - 2.4rem);
    height: calc(var(--weekly-invest-height) + 2.4rem)
}

html.android.statusExpension .weekly-invest-main .extra-cash,
html.android.statusExpension .weekly-invest-main .gauge,
html.android.statusExpension .weekly-invest-main-inner {
    margin-top: 2.4rem
}

html.android.statusExpension .content-savings.expired {
    height: calc(2.4rem + 53.9rem)
}

html.android.statusExpension .content-savings.expired {
    height: calc(2.4rem + 53.9rem)
}

html.android.statusExpension .content-savings {
    height: calc(2.4rem + 44.8rem)
}

html.android.statusExpension .content-savings .img-area {
    top: 2.4rem
}

html.android.statusExpension .content-savings .prodname-info {
    top: calc(2.4rem + 30.8rem)
}

html.android.statusExpension .content-savings .kds-banner-card {
    top: calc(2.4rem + 42.1rem)
}

html.android.statusExpension .savings-scroll .component-header::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 2.4rem;
    background: var(--bg-pri-base)
}

html.android.statusExpension .savings-scroll .component-fixed-bottom {
    min-height: calc(100vh - 5rem - 2.4rem)
}

html.android.statusExpension .container-component.ai-quiz.h-center .section-component {
    height: calc(100% - (16.2rem + 2.4rem + 0))
}

html.android.statusExpension .container-component.view-center .section-component {
    height: calc(100% - (16.2rem + 2.4rem + 0))
}

html.android.statusExpension .section-component.alarm-nodata {
    height: calc(100vh - (5rem + 2.4rem + 0))
}

html.android.statusExpension .container-component.today-coupon.h-center .section-component {
    height: calc(100% - (20.2rem + 2.4rem + 0))
}

html.android.statusExpension .section-component.stars-type2 {
    padding-top: calc(4.8rem + 2.4rem);
    padding-bottom: calc(8rem + 0)
}

html.android.statusExpension .page-inner-scroll.scrolling .component-card-sticky {
    top: calc(2.4rem + 5rem)
}

/*!
* Status Bar top area android (상단바 영역과 컨텐츠 간격 컨트롤)
* 아이폰 노치 디자인 디바이스 : 44px;
*/

@media only screen and (device-width: 320px) and (device-height: 693px) and (-webkit-device-pixel-ratio: 3) {
    /*! mixin :공통 - 헤더영역 */
    html.ios.statusExpension .component-header {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .popup-header .component-header {
        padding-top: 0
    }
    /*! 홈 - 일반 */
    html.ios.statusExpension .home-default .main-container-component.bg-main {
        padding-top: calc(4.4rem + 5.6rem)
    }
    /*! 홈 - 추천 */
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"].scrolling .component-tab.sticky-tab {
        top: calc(4.4rem + 0.2rem)
    }
    /*! 홈 - 혜택 */
    html.ios.statusExpension .page-inner-scroll.scrolling .component-tab.sticky-tab02 .tab-round-group {
        top: calc(4.4rem + 5rem)
    }
    /*! 홈 - 타임라인 */
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"].scrolling .component-form-date {
        top: calc(4.4rem + 5rem + 0.2rem)
    }
    /*! 홈 - 순서변경 */
    html.ios.statusExpension .page-inner-scroll.scrolling .component-text-simple.fixed-top {
        top: calc(4.4rem + 0.9rem)
    }
    /*! 공통 - 풀팝업일때 */
    html.ios.statusExpension .popup-dialog.ui-full .popup-group,
    html.ios.statusExpension .popup-dialog.ui-full-change .popup-group,
    html.ios.statusExpension .popup-dialog.ui-full-change.plus-box-event-pop .popup-group {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group:after {
        content: '';
        height: 4.4rem;
        background-color: var(--color-w100, #fff);
        position: fixed;
        top: 0;
        left: 0;
        width: 100%
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group:after {
        display: none
    }
    html.ios.statusExpension .popup-dialog.ui-full-change.plus-box-event-pop .interest-group-top .ani-step1-1 {
        margin-top: 8.2rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.shopping:after {
        background: var(--color-in700)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.shopping.bg-white:after {
        background-color: var(--color-w100, #fff)
    }
    /*! 홈 개편 */
    html.ios.statusExpension .component-header.main {
        padding-top: calc(4.4rem + 0.6rem)
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh.pull-home {
        padding-top: 0;
        margin-top: 4.4rem
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: 0.6rem
    }
    html.ios.statusExpension .scrolling .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: calc(4.4rem + 0.6rem)
    }
    html.ios.statusExpension .component-tab.foru-tab-ver.scrollOn .tab-group.foru-type {
        top: calc(4.4rem)
    }
    html.ios.statusExpension .component-header.main+.component-tab.foru-tab-ver {
        top: calc(4.4rem + 5.6rem)
    }
    html.ios.statusExpension .component-main-bnf-tab {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .invest-home .tab-list-group.sticky-invest {
        top: calc(4.4rem + 5.6rem)
    }
    html.ios.statusExpension .component-ceo-calendar {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .component-ceo-my-account.type2 {
        padding-top: calc(4.4rem + 37rem)
    }
    html.ios.statusExpension .container-component-coach .coach-item01 {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .component-header.search {
        padding-top: calc(4.4rem + 1.2rem);
        height: auto
    }
    html.ios.statusExpension .component-header.search.search-result {
        height: calc(4.4rem + 10.5rem)
    }
    html.ios.statusExpension .popup-inner .component-header.search.search-result {
        height: 10.5rem
    }
    html.ios.statusExpension .popup-inner .component-header.search.sticky {
        top: 4.4rem;
        padding-top: 1.2rem
    }
    html.ios.statusExpension .section-component.alarm .component-keyword {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .section-component.alarm .component-form-date {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .section-component.alarm.alarm-filter .component-form-date {
        top: calc(4.4rem + 10.6rem)
    }
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"] .component-main-refresh {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: 2.2rem
    }
    html.ios.statusExpension .safe-camp-kv .safe-camp-inner {
        margin-top: 4.4rem
    }
    /*! mixin :공통 - 헤더영역 */
    body.ios .component-header {
        padding-top: 4.4rem
    }
    body.ios .popup-header .component-header {
        padding-top: 0
    }
    /*! 홈 - 일반 */
    body.ios .home-default .main-container-component.bg-main {
        padding-top: calc(4.4rem + 5.6rem)
    }
    /*! 홈 - 추천 */
    body.ios .main-tab-container [class^="main-tab-content0"].scrolling .component-tab.sticky-tab {
        top: calc(4.4rem + 0.2rem)
    }
    /*! 홈 - 혜택 */
    body.ios .page-inner-scroll.scrolling .component-tab.sticky-tab02 .tab-round-group {
        top: calc(4.4rem + 5rem)
    }
    /*! 홈 - 타임라인 */
    body.ios .main-tab-container [class^="main-tab-content0"].scrolling .component-form-date {
        top: calc(4.4rem + 5rem + 0.2rem)
    }
    /*! 홈 - 순서변경 */
    body.ios .page-inner-scroll.scrolling .component-text-simple.fixed-top {
        top: calc(4.4rem + 0.9rem)
    }
    /*! 공통 - 풀팝업일때 */
    body.ios .popup-dialog.ui-full .popup-group,
    body.ios .popup-dialog.ui-full-change .popup-group,
    body.ios .popup-dialog.ui-full-change.plus-box-event-pop .popup-group {
        padding-top: 4.4rem
    }
    body.ios .popup-dialog.ui-full .popup-group:after {
        content: '';
        height: 4.4rem;
        background-color: var(--color-w100, #fff);
        position: fixed;
        top: 0;
        left: 0;
        width: 100%
    }
    body.ios .popup-dialog.ui-full .popup-group.popup-inandout-group:after {
        display: none
    }
    body.ios .popup-dialog.ui-full-change.plus-box-event-pop .interest-group-top .ani-step1-1 {
        margin-top: 8.2rem
    }
    body.ios .popup-dialog.ui-full .popup-group.shopping:after {
        background: var(--color-in700)
    }
    body.ios .popup-dialog.ui-full .popup-group.shopping.bg-white:after {
        background-color: var(--color-w100, #fff)
    }
    /*! 홈 개편 */
    body.ios .component-header.main {
        padding-top: calc(4.4rem + 0.6rem)
    }
    body.ios .ptr--ptr.ptr--refresh {
        padding-top: 4.4rem
    }
    body.ios .ptr--ptr.ptr--refresh.pull-home {
        padding-top: 0;
        margin-top: 4.4rem
    }
    body.ios .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: 0.6rem
    }
    body.ios .scrolling .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: calc(4.4rem + 0.6rem)
    }
    body.ios .component-tab.foru-tab-ver.scrollOn .tab-group.foru-type {
        top: calc(4.4rem)
    }
    body.ios .component-header.main+.component-tab.foru-tab-ver {
        top: calc(4.4rem + 5.6rem)
    }
    body.ios .component-main-bnf-tab {
        top: calc(4.4rem + 5rem)
    }
    body.ios .invest-home .tab-list-group.sticky-invest {
        top: calc(4.4rem + 5.6rem)
    }
    body.ios .component-ceo-calendar {
        top: calc(4.4rem + 5rem)
    }
    body.ios .component-ceo-my-account.type2 {
        padding-top: calc(4.4rem + 37rem)
    }
    body.ios .container-component-coach .coach-item01 {
        padding-top: 4.4rem
    }
    body.ios .component-header.search {
        padding-top: calc(4.4rem + 1.2rem);
        height: auto
    }
    body.ios .component-header.search.search-result {
        height: calc(4.4rem + 10.5rem)
    }
    body.ios .popup-inner .component-header.search.search-result {
        height: 10.5rem
    }
    body.ios .popup-inner .component-header.search.sticky {
        top: 4.4rem;
        padding-top: 1.2rem
    }
    body.ios .section-component.alarm .component-keyword {
        top: calc(4.4rem + 5rem)
    }
    body.ios .section-component.alarm .component-form-date {
        top: calc(4.4rem + 5rem)
    }
    body.ios .section-component.alarm.alarm-filter .component-form-date {
        top: calc(4.4rem + 10.6rem)
    }
    body.ios .main-tab-container [class^="main-tab-content0"] .component-main-refresh {
        top: calc(5rem + 4.4rem)
    }
    body.ios .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: 2.2rem
    }
    body.ios .safe-camp-kv .safe-camp-inner {
        margin-top: 4.4rem
    }
    /*! mixin :공통 - 헤더영역 */
    /*! 검색 - 공통 */
    html.ios.statusExpension .component-list.fixed,
    html.ios.statusExpension .component-search[class*="fixed"] {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .component-gathering-selected.active {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .component-gathering-selected.active+.component-search {
        top: calc(4.4rem + 16.2rem)
    }
    /*! 모임통장 - 모임홈 */
    html.ios.statusExpension .component-meet-profile {
        margin-top: -4.4rem
    }
    html.ios.statusExpension .component-meethome-profile {
        margin-top: calc(-5rem - 4.4rem)
    }
    /*! 상단 tab 고정 */
    html.ios.statusExpension .component-tab.food-cate-sticky,
    html.ios.statusExpension .component-text-simple+.component-tab.sticky,
    html.ios.statusExpension .section-component .component-tab.sticky,
    html.ios.statusExpension .section-component.living-price-tab .component-tab.sticky {
        top: calc(4.4rem + 5rem)
    }
    /*! 이체 */
    html.ios.statusExpension .component-header+.component-keypad {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .section-component-sticky {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .fixed-msg-card,
    html.ios.statusExpension .section-flex-colume {
        height: calc(100vh - calc(4.4rem + 5rem))
    }
    html.ios.statusExpension .section-flex-colume.type3 {
        height: calc(100vh - calc(4.4rem + 11rem))
    }
    html.ios.statusExpension .section-flex-colume.type4 {
        height: calc(100vh - calc(4.4rem + 19.4rem))
    }
    html.ios.statusExpension .component-card-sum-top.type2[class*="fixed"] {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .dim-moneytree-wrap {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .toast-wrap.ceo-type {
        bottom: auto;
        top: calc(4.4rem + 9.4rem)
    }
    html.ios.statusExpension .component-tab.sticky+.article-component .component-search[class*="fixed"] {
        top: calc(4.4rem + 11rem)
    }
    html.ios.statusExpension .container-component.shopping .component-text.sticky {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .container-component.shopping .component-text.sticky+.component-tab .tab-list-group.sticky {
        top: calc(4.4rem + 9rem)
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach.active {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: calc(4.4rem + 8.6rem)
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach .coach-close {
        padding-top: 0
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .inandout-calendar-inner {
        top: 4.4rem
    }
    html.ios.statusExpension .inandout-tab-wrap {
        top: calc(5.5rem + 4.4rem)
    }
    html.ios.statusExpension .section-component.custom-policy .component-tab.sticky-chip {
        top: calc(4.4rem + 11rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group.popup-inandout-pre-group {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .popup-inandout-group.pre-event .container-component-coach {
        top: 4.4rem
    }
    html.ios.statusExpension .ailive-today-quiz {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .tab-list-group[data-sticky-item] {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .container-component.ai-quiz .section-component.type2 {
        margin-top: calc(-5rem - 4.4rem);
        padding-top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .container-component.ai-quiz .section-component.type4 {
        margin-top: calc(-5rem - 4.4rem);
        padding-top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .fortune2025 .component-iframe {
        height: calc(100vh - (14.4rem + 4.4rem))
    }
    html.ios.statusExpension .container-component.common-cert.h-center .section-component.cert-section {
        min-height: calc(100vh - 24rem)
    }
    html.ios.statusExpension .section-component.stars-type1 {
        height: calc(100vh - (5rem + 4.4rem))
    }
    html.ios.statusExpension .section-component.mission-top {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .section-component.mission-rolling {
        top: calc(23.8rem + 4.4rem)
    }
    html.ios.statusExpension .page-inner-scroll.money-mission.first-lock-entry.scroll-top .section-component.mission-rolling {
        top: calc(24.3rem + 4.4rem)
    }
    html.ios.statusExpension .container-component.container-fixed {
        padding-top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .page-inner-scroll.no-overscroll-y .container-component {
        padding-top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.mission-talisman:after {
        background-color: transparent
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.coin-full-wrap:after {
        background-color: transparent
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.transparent:after {
        background-color: transparent
    }
    html.ios.statusExpension .component-invest-calendar {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .page-inner-scroll.scrolling .component-tab.financial-scam {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .component-tab.sticky-logotab {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .tooltip-focus-group .tooltip-area.align-bottom.digit-signature {
        top: calc(2.2rem + 4.4rem)
    }
    html.ios.statusExpension .weekly-invest-main-bg {
        margin-top: calc(var(--header-height) * -1 - 4.4rem);
        height: calc(var(--weekly-invest-height) + 4.4rem)
    }
    html.ios.statusExpension .weekly-invest-main .extra-cash,
    html.ios.statusExpension .weekly-invest-main .gauge,
    html.ios.statusExpension .weekly-invest-main-inner {
        margin-top: 4.4rem
    }
    /*! mixin :공통 - 헤더영역 */
    /*! 검색 - 공통 */
    body.ios .component-list.fixed,
    body.ios .component-search[class*="fixed"] {
        top: calc(4.4rem + 5rem)
    }
    body.ios .component-gathering-selected.active {
        top: calc(4.4rem + 5rem)
    }
    body.ios .component-gathering-selected.active+.component-search {
        top: calc(4.4rem + 16.2rem)
    }
    /*! 모임통장 - 모임홈 */
    body.ios .component-meet-profile {
        margin-top: -4.4rem
    }
    body.ios .component-meethome-profile {
        margin-top: calc(-5rem - 4.4rem)
    }
    /*! 상단 tab 고정 */
    body.ios .component-tab.food-cate-sticky,
    body.ios .component-text-simple+.component-tab.sticky,
    body.ios .section-component .component-tab.sticky,
    body.ios .section-component.living-price-tab .component-tab.sticky {
        top: calc(4.4rem + 5rem)
    }
    /*! 이체 */
    body.ios .component-header+.component-keypad {
        padding-top: 4.4rem
    }
    body.ios .section-component-sticky {
        top: calc(4.4rem + 5rem)
    }
    body.ios .fixed-msg-card,
    body.ios .section-flex-colume {
        height: calc(100vh - calc(4.4rem + 5rem))
    }
    body.ios .section-flex-colume.type3 {
        height: calc(100vh - calc(4.4rem + 11rem))
    }
    body.ios .section-flex-colume.type4 {
        height: calc(100vh - calc(4.4rem + 19.4rem))
    }
    body.ios .component-card-sum-top.type2[class*="fixed"] {
        top: calc(4.4rem + 5rem)
    }
    body.ios .dim-moneytree-wrap {
        top: calc(4.4rem + 5rem)
    }
    body.ios .toast-wrap.ceo-type {
        bottom: auto;
        top: calc(4.4rem + 9.4rem)
    }
    body.ios .component-tab.sticky+.article-component .component-search[class*="fixed"] {
        top: calc(4.4rem + 11rem)
    }
    body.ios .container-component.shopping .component-text.sticky {
        top: calc(4.4rem + 5rem)
    }
    body.ios .container-component.shopping .component-text.sticky+.component-tab .tab-list-group.sticky {
        top: calc(4.4rem + 9rem)
    }
    body.ios .page-inner-scroll.inandout-scroll .container-component-coach {
        padding-top: 4.4rem
    }
    body.ios .page-inner-scroll.inandout-scroll .container-component-coach.active {
        padding-top: 4.4rem
    }
    body.ios .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: calc(4.4rem + 8.6rem)
    }
    body.ios .page-inner-scroll.inandout-scroll .container-component-coach .coach-close {
        padding-top: 0
    }
    body.ios .page-inner-scroll.inandout-scroll .inandout-calendar-inner {
        top: 4.4rem
    }
    body.ios .inandout-tab-wrap {
        top: calc(5.5rem + 4.4rem)
    }
    body.ios .section-component.custom-policy .component-tab.sticky-chip {
        top: calc(4.4rem + 11rem)
    }
    body.ios .popup-dialog.ui-full .popup-group.popup-inandout-group.popup-inandout-pre-group {
        padding-top: 4.4rem
    }
    body.ios .popup-inandout-group.pre-event .container-component-coach {
        top: 4.4rem
    }
    body.ios .ailive-today-quiz {
        padding-top: 4.4rem
    }
    body.ios .tab-list-group[data-sticky-item] {
        top: calc(4.4rem + 5rem)
    }
    body.ios .container-component.ai-quiz .section-component.type2 {
        margin-top: calc(-5rem - 4.4rem);
        padding-top: calc(5rem + 4.4rem)
    }
    body.ios .container-component.ai-quiz .section-component.type4 {
        margin-top: calc(-5rem - 4.4rem);
        padding-top: calc(5rem + 4.4rem)
    }
    body.ios .fortune2025 .component-iframe {
        height: calc(100vh - (14.4rem + 4.4rem))
    }
    body.ios .container-component.common-cert.h-center .section-component.cert-section {
        min-height: calc(100vh - 24rem)
    }
    body.ios .section-component.stars-type1 {
        height: calc(100vh - (5rem + 4.4rem))
    }
    body.ios .section-component.mission-top {
        top: calc(5rem + 4.4rem)
    }
    body.ios .section-component.mission-rolling {
        top: calc(23.8rem + 4.4rem)
    }
    body.ios .page-inner-scroll.money-mission.first-lock-entry.scroll-top .section-component.mission-rolling {
        top: calc(24.3rem + 4.4rem)
    }
    body.ios .container-component.container-fixed {
        padding-top: calc(5rem + 4.4rem)
    }
    body.ios .page-inner-scroll.no-overscroll-y .container-component {
        padding-top: calc(5rem + 4.4rem)
    }
    body.ios .popup-dialog.ui-full .popup-group.mission-talisman:after {
        background-color: transparent
    }
    body.ios .popup-dialog.ui-full .popup-group.coin-full-wrap:after {
        background-color: transparent
    }
    body.ios .popup-dialog.ui-full .popup-group.transparent:after {
        background-color: transparent
    }
    body.ios .component-invest-calendar {
        top: calc(5rem + 4.4rem)
    }
    body.ios .page-inner-scroll.scrolling .component-tab.financial-scam {
        top: calc(5rem + 4.4rem)
    }
    body.ios .component-tab.sticky-logotab {
        top: calc(5rem + 4.4rem)
    }
    body.ios .tooltip-focus-group .tooltip-area.align-bottom.digit-signature {
        top: calc(2.2rem + 4.4rem)
    }
    body.ios .weekly-invest-main-bg {
        margin-top: calc(var(--header-height) * -1 - 4.4rem);
        height: calc(var(--weekly-invest-height) + 4.4rem)
    }
    body.ios .weekly-invest-main .extra-cash,
    body.ios .weekly-invest-main .gauge,
    body.ios .weekly-invest-main-inner {
        margin-top: 4.4rem
    }
    html.ios.statusExpension .content-savings.expired {
        height: calc(4.4rem + 53.9rem)
    }
    html.ios.statusExpension .content-savings.expired {
        height: calc(4.4rem + 53.9rem)
    }
    html.ios.statusExpension .content-savings {
        height: calc(4.4rem + 44.8rem)
    }
    html.ios.statusExpension .content-savings .img-area {
        top: 4.4rem
    }
    html.ios.statusExpension .content-savings .prodname-info {
        top: calc(4.4rem + 30.8rem)
    }
    html.ios.statusExpension .content-savings .kds-banner-card {
        top: calc(4.4rem + 42.1rem)
    }
    html.ios.statusExpension .savings-scroll .component-header::before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 4.4rem;
        background: var(--bg-pri-base)
    }
    html.ios.statusExpension .savings-scroll .component-fixed-bottom {
        min-height: calc(100vh - 5rem - 4.4rem - 4rem)
    }
    html.ios.statusExpension .container-component.ai-quiz.h-center .section-component {
        height: calc(100% - (16.2rem + 4.4rem + 4rem))
    }
    html.ios.statusExpension .container-component.view-center .section-component {
        height: calc(100% - (16.2rem + 4.4rem + 4rem))
    }
    html.ios.statusExpension .section-component.alarm-nodata {
        height: calc(100vh - (5rem + 4.4rem + 4rem))
    }
    html.ios.statusExpension .container-component.today-coupon.h-center .section-component {
        height: calc(100% - (20.2rem + 4.4rem + 4rem))
    }
    html.ios.statusExpension .section-component.stars-type2 {
        padding-top: calc(4.8rem + 4.4rem);
        padding-bottom: calc(8rem + 4rem)
    }
    html.ios.statusExpension .page-inner-scroll.scrolling .component-card-sticky {
        top: calc(4.4rem + 5rem)
    }
    body.ios .content-savings.expired {
        height: calc(4.4rem + 53.9rem)
    }
    body.ios .content-savings.expired {
        height: calc(4.4rem + 53.9rem)
    }
    body.ios .content-savings {
        height: calc(4.4rem + 44.8rem)
    }
    body.ios .content-savings .img-area {
        top: 4.4rem
    }
    body.ios .content-savings .prodname-info {
        top: calc(4.4rem + 30.8rem)
    }
    body.ios .content-savings .kds-banner-card {
        top: calc(4.4rem + 42.1rem)
    }
    body.ios .savings-scroll .component-header::before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 4.4rem;
        background: var(--bg-pri-base)
    }
    body.ios .savings-scroll .component-fixed-bottom {
        min-height: calc(100vh - 5rem - 4.4rem - 4rem)
    }
    body.ios .container-component.ai-quiz.h-center .section-component {
        height: calc(100% - (16.2rem + 4.4rem + 4rem))
    }
    body.ios .container-component.view-center .section-component {
        height: calc(100% - (16.2rem + 4.4rem + 4rem))
    }
    body.ios .section-component.alarm-nodata {
        height: calc(100vh - (5rem + 4.4rem + 4rem))
    }
    body.ios .container-component.today-coupon.h-center .section-component {
        height: calc(100% - (20.2rem + 4.4rem + 4rem))
    }
    body.ios .section-component.stars-type2 {
        padding-top: calc(4.8rem + 4.4rem);
        padding-bottom: calc(8rem + 4rem)
    }
    body.ios .page-inner-scroll.scrolling .component-card-sticky {
        top: calc(4.4rem + 5rem)
    }
}

/*! iPhone XR(확대), 11(확대) */

@media only screen and (device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 2) {
    /*! mixin :공통 - 헤더영역 */
    html.ios.statusExpension .component-header {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .popup-header .component-header {
        padding-top: 0
    }
    /*! 홈 - 일반 */
    html.ios.statusExpension .home-default .main-container-component.bg-main {
        padding-top: calc(4.4rem + 5.6rem)
    }
    /*! 홈 - 추천 */
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"].scrolling .component-tab.sticky-tab {
        top: calc(4.4rem + 0.2rem)
    }
    /*! 홈 - 혜택 */
    html.ios.statusExpension .page-inner-scroll.scrolling .component-tab.sticky-tab02 .tab-round-group {
        top: calc(4.4rem + 5rem)
    }
    /*! 홈 - 타임라인 */
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"].scrolling .component-form-date {
        top: calc(4.4rem + 5rem + 0.2rem)
    }
    /*! 홈 - 순서변경 */
    html.ios.statusExpension .page-inner-scroll.scrolling .component-text-simple.fixed-top {
        top: calc(4.4rem + 0.9rem)
    }
    /*! 공통 - 풀팝업일때 */
    html.ios.statusExpension .popup-dialog.ui-full .popup-group,
    html.ios.statusExpension .popup-dialog.ui-full-change .popup-group,
    html.ios.statusExpension .popup-dialog.ui-full-change.plus-box-event-pop .popup-group {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group:after {
        content: '';
        height: 4.4rem;
        background-color: var(--color-w100, #fff);
        position: fixed;
        top: 0;
        left: 0;
        width: 100%
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group:after {
        display: none
    }
    html.ios.statusExpension .popup-dialog.ui-full-change.plus-box-event-pop .interest-group-top .ani-step1-1 {
        margin-top: 8.2rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.shopping:after {
        background: var(--color-in700)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.shopping.bg-white:after {
        background-color: var(--color-w100, #fff)
    }
    /*! 홈 개편 */
    html.ios.statusExpension .component-header.main {
        padding-top: calc(4.4rem + 0.6rem)
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh.pull-home {
        padding-top: 0;
        margin-top: 4.4rem
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: 0.6rem
    }
    html.ios.statusExpension .scrolling .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: calc(4.4rem + 0.6rem)
    }
    html.ios.statusExpension .component-tab.foru-tab-ver.scrollOn .tab-group.foru-type {
        top: calc(4.4rem)
    }
    html.ios.statusExpension .component-header.main+.component-tab.foru-tab-ver {
        top: calc(4.4rem + 5.6rem)
    }
    html.ios.statusExpension .component-main-bnf-tab {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .invest-home .tab-list-group.sticky-invest {
        top: calc(4.4rem + 5.6rem)
    }
    html.ios.statusExpension .component-ceo-calendar {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .component-ceo-my-account.type2 {
        padding-top: calc(4.4rem + 37rem)
    }
    html.ios.statusExpension .container-component-coach .coach-item01 {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .component-header.search {
        padding-top: calc(4.4rem + 1.2rem);
        height: auto
    }
    html.ios.statusExpension .component-header.search.search-result {
        height: calc(4.4rem + 10.5rem)
    }
    html.ios.statusExpension .popup-inner .component-header.search.search-result {
        height: 10.5rem
    }
    html.ios.statusExpension .popup-inner .component-header.search.sticky {
        top: 4.4rem;
        padding-top: 1.2rem
    }
    html.ios.statusExpension .section-component.alarm .component-keyword {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .section-component.alarm .component-form-date {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .section-component.alarm.alarm-filter .component-form-date {
        top: calc(4.4rem + 10.6rem)
    }
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"] .component-main-refresh {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: 2.2rem
    }
    html.ios.statusExpension .safe-camp-kv .safe-camp-inner {
        margin-top: 4.4rem
    }
    /*! mixin :공통 - 헤더영역 */
    body.ios .component-header {
        padding-top: 4.4rem
    }
    body.ios .popup-header .component-header {
        padding-top: 0
    }
    /*! 홈 - 일반 */
    body.ios .home-default .main-container-component.bg-main {
        padding-top: calc(4.4rem + 5.6rem)
    }
    /*! 홈 - 추천 */
    body.ios .main-tab-container [class^="main-tab-content0"].scrolling .component-tab.sticky-tab {
        top: calc(4.4rem + 0.2rem)
    }
    /*! 홈 - 혜택 */
    body.ios .page-inner-scroll.scrolling .component-tab.sticky-tab02 .tab-round-group {
        top: calc(4.4rem + 5rem)
    }
    /*! 홈 - 타임라인 */
    body.ios .main-tab-container [class^="main-tab-content0"].scrolling .component-form-date {
        top: calc(4.4rem + 5rem + 0.2rem)
    }
    /*! 홈 - 순서변경 */
    body.ios .page-inner-scroll.scrolling .component-text-simple.fixed-top {
        top: calc(4.4rem + 0.9rem)
    }
    /*! 공통 - 풀팝업일때 */
    body.ios .popup-dialog.ui-full .popup-group,
    body.ios .popup-dialog.ui-full-change .popup-group,
    body.ios .popup-dialog.ui-full-change.plus-box-event-pop .popup-group {
        padding-top: 4.4rem
    }
    body.ios .popup-dialog.ui-full .popup-group:after {
        content: '';
        height: 4.4rem;
        background-color: var(--color-w100, #fff);
        position: fixed;
        top: 0;
        left: 0;
        width: 100%
    }
    body.ios .popup-dialog.ui-full .popup-group.popup-inandout-group:after {
        display: none
    }
    body.ios .popup-dialog.ui-full-change.plus-box-event-pop .interest-group-top .ani-step1-1 {
        margin-top: 8.2rem
    }
    body.ios .popup-dialog.ui-full .popup-group.shopping:after {
        background: var(--color-in700)
    }
    body.ios .popup-dialog.ui-full .popup-group.shopping.bg-white:after {
        background-color: var(--color-w100, #fff)
    }
    /*! 홈 개편 */
    body.ios .component-header.main {
        padding-top: calc(4.4rem + 0.6rem)
    }
    body.ios .ptr--ptr.ptr--refresh {
        padding-top: 4.4rem
    }
    body.ios .ptr--ptr.ptr--refresh.pull-home {
        padding-top: 0;
        margin-top: 4.4rem
    }
    body.ios .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: 0.6rem
    }
    body.ios .scrolling .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: calc(4.4rem + 0.6rem)
    }
    body.ios .component-tab.foru-tab-ver.scrollOn .tab-group.foru-type {
        top: calc(4.4rem)
    }
    body.ios .component-header.main+.component-tab.foru-tab-ver {
        top: calc(4.4rem + 5.6rem)
    }
    body.ios .component-main-bnf-tab {
        top: calc(4.4rem + 5rem)
    }
    body.ios .invest-home .tab-list-group.sticky-invest {
        top: calc(4.4rem + 5.6rem)
    }
    body.ios .component-ceo-calendar {
        top: calc(4.4rem + 5rem)
    }
    body.ios .component-ceo-my-account.type2 {
        padding-top: calc(4.4rem + 37rem)
    }
    body.ios .container-component-coach .coach-item01 {
        padding-top: 4.4rem
    }
    body.ios .component-header.search {
        padding-top: calc(4.4rem + 1.2rem);
        height: auto
    }
    body.ios .component-header.search.search-result {
        height: calc(4.4rem + 10.5rem)
    }
    body.ios .popup-inner .component-header.search.search-result {
        height: 10.5rem
    }
    body.ios .popup-inner .component-header.search.sticky {
        top: 4.4rem;
        padding-top: 1.2rem
    }
    body.ios .section-component.alarm .component-keyword {
        top: calc(4.4rem + 5rem)
    }
    body.ios .section-component.alarm .component-form-date {
        top: calc(4.4rem + 5rem)
    }
    body.ios .section-component.alarm.alarm-filter .component-form-date {
        top: calc(4.4rem + 10.6rem)
    }
    body.ios .main-tab-container [class^="main-tab-content0"] .component-main-refresh {
        top: calc(5rem + 4.4rem)
    }
    body.ios .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: 2.2rem
    }
    body.ios .safe-camp-kv .safe-camp-inner {
        margin-top: 4.4rem
    }
    /*! mixin :공통 - 헤더영역 */
    /*! 검색 - 공통 */
    html.ios.statusExpension .component-list.fixed,
    html.ios.statusExpension .component-search[class*="fixed"] {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .component-gathering-selected.active {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .component-gathering-selected.active+.component-search {
        top: calc(4.4rem + 16.2rem)
    }
    /*! 모임통장 - 모임홈 */
    html.ios.statusExpension .component-meet-profile {
        margin-top: -4.4rem
    }
    html.ios.statusExpension .component-meethome-profile {
        margin-top: calc(-5rem - 4.4rem)
    }
    /*! 상단 tab 고정 */
    html.ios.statusExpension .component-tab.food-cate-sticky,
    html.ios.statusExpension .component-text-simple+.component-tab.sticky,
    html.ios.statusExpension .section-component .component-tab.sticky,
    html.ios.statusExpension .section-component.living-price-tab .component-tab.sticky {
        top: calc(4.4rem + 5rem)
    }
    /*! 이체 */
    html.ios.statusExpension .component-header+.component-keypad {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .section-component-sticky {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .fixed-msg-card,
    html.ios.statusExpension .section-flex-colume {
        height: calc(100vh - calc(4.4rem + 5rem))
    }
    html.ios.statusExpension .section-flex-colume.type3 {
        height: calc(100vh - calc(4.4rem + 11rem))
    }
    html.ios.statusExpension .section-flex-colume.type4 {
        height: calc(100vh - calc(4.4rem + 19.4rem))
    }
    html.ios.statusExpension .component-card-sum-top.type2[class*="fixed"] {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .dim-moneytree-wrap {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .toast-wrap.ceo-type {
        bottom: auto;
        top: calc(4.4rem + 9.4rem)
    }
    html.ios.statusExpension .component-tab.sticky+.article-component .component-search[class*="fixed"] {
        top: calc(4.4rem + 11rem)
    }
    html.ios.statusExpension .container-component.shopping .component-text.sticky {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .container-component.shopping .component-text.sticky+.component-tab .tab-list-group.sticky {
        top: calc(4.4rem + 9rem)
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach.active {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: calc(4.4rem + 8.6rem)
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach .coach-close {
        padding-top: 0
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .inandout-calendar-inner {
        top: 4.4rem
    }
    html.ios.statusExpension .inandout-tab-wrap {
        top: calc(5.5rem + 4.4rem)
    }
    html.ios.statusExpension .section-component.custom-policy .component-tab.sticky-chip {
        top: calc(4.4rem + 11rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group.popup-inandout-pre-group {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .popup-inandout-group.pre-event .container-component-coach {
        top: 4.4rem
    }
    html.ios.statusExpension .ailive-today-quiz {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .tab-list-group[data-sticky-item] {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .container-component.ai-quiz .section-component.type2 {
        margin-top: calc(-5rem - 4.4rem);
        padding-top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .container-component.ai-quiz .section-component.type4 {
        margin-top: calc(-5rem - 4.4rem);
        padding-top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .fortune2025 .component-iframe {
        height: calc(100vh - (14.4rem + 4.4rem))
    }
    html.ios.statusExpension .container-component.common-cert.h-center .section-component.cert-section {
        min-height: calc(100vh - 24rem)
    }
    html.ios.statusExpension .section-component.stars-type1 {
        height: calc(100vh - (5rem + 4.4rem))
    }
    html.ios.statusExpension .section-component.mission-top {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .section-component.mission-rolling {
        top: calc(23.8rem + 4.4rem)
    }
    html.ios.statusExpension .page-inner-scroll.money-mission.first-lock-entry.scroll-top .section-component.mission-rolling {
        top: calc(24.3rem + 4.4rem)
    }
    html.ios.statusExpension .container-component.container-fixed {
        padding-top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .page-inner-scroll.no-overscroll-y .container-component {
        padding-top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.mission-talisman:after {
        background-color: transparent
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.coin-full-wrap:after {
        background-color: transparent
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.transparent:after {
        background-color: transparent
    }
    html.ios.statusExpension .component-invest-calendar {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .page-inner-scroll.scrolling .component-tab.financial-scam {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .component-tab.sticky-logotab {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .tooltip-focus-group .tooltip-area.align-bottom.digit-signature {
        top: calc(2.2rem + 4.4rem)
    }
    html.ios.statusExpension .weekly-invest-main-bg {
        margin-top: calc(var(--header-height) * -1 - 4.4rem);
        height: calc(var(--weekly-invest-height) + 4.4rem)
    }
    html.ios.statusExpension .weekly-invest-main .extra-cash,
    html.ios.statusExpension .weekly-invest-main .gauge,
    html.ios.statusExpension .weekly-invest-main-inner {
        margin-top: 4.4rem
    }
    /*! mixin :공통 - 헤더영역 */
    /*! 검색 - 공통 */
    body.ios .component-list.fixed,
    body.ios .component-search[class*="fixed"] {
        top: calc(4.4rem + 5rem)
    }
    body.ios .component-gathering-selected.active {
        top: calc(4.4rem + 5rem)
    }
    body.ios .component-gathering-selected.active+.component-search {
        top: calc(4.4rem + 16.2rem)
    }
    /*! 모임통장 - 모임홈 */
    body.ios .component-meet-profile {
        margin-top: -4.4rem
    }
    body.ios .component-meethome-profile {
        margin-top: calc(-5rem - 4.4rem)
    }
    /*! 상단 tab 고정 */
    body.ios .component-tab.food-cate-sticky,
    body.ios .component-text-simple+.component-tab.sticky,
    body.ios .section-component .component-tab.sticky,
    body.ios .section-component.living-price-tab .component-tab.sticky {
        top: calc(4.4rem + 5rem)
    }
    /*! 이체 */
    body.ios .component-header+.component-keypad {
        padding-top: 4.4rem
    }
    body.ios .section-component-sticky {
        top: calc(4.4rem + 5rem)
    }
    body.ios .fixed-msg-card,
    body.ios .section-flex-colume {
        height: calc(100vh - calc(4.4rem + 5rem))
    }
    body.ios .section-flex-colume.type3 {
        height: calc(100vh - calc(4.4rem + 11rem))
    }
    body.ios .section-flex-colume.type4 {
        height: calc(100vh - calc(4.4rem + 19.4rem))
    }
    body.ios .component-card-sum-top.type2[class*="fixed"] {
        top: calc(4.4rem + 5rem)
    }
    body.ios .dim-moneytree-wrap {
        top: calc(4.4rem + 5rem)
    }
    body.ios .toast-wrap.ceo-type {
        bottom: auto;
        top: calc(4.4rem + 9.4rem)
    }
    body.ios .component-tab.sticky+.article-component .component-search[class*="fixed"] {
        top: calc(4.4rem + 11rem)
    }
    body.ios .container-component.shopping .component-text.sticky {
        top: calc(4.4rem + 5rem)
    }
    body.ios .container-component.shopping .component-text.sticky+.component-tab .tab-list-group.sticky {
        top: calc(4.4rem + 9rem)
    }
    body.ios .page-inner-scroll.inandout-scroll .container-component-coach {
        padding-top: 4.4rem
    }
    body.ios .page-inner-scroll.inandout-scroll .container-component-coach.active {
        padding-top: 4.4rem
    }
    body.ios .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: calc(4.4rem + 8.6rem)
    }
    body.ios .page-inner-scroll.inandout-scroll .container-component-coach .coach-close {
        padding-top: 0
    }
    body.ios .page-inner-scroll.inandout-scroll .inandout-calendar-inner {
        top: 4.4rem
    }
    body.ios .inandout-tab-wrap {
        top: calc(5.5rem + 4.4rem)
    }
    body.ios .section-component.custom-policy .component-tab.sticky-chip {
        top: calc(4.4rem + 11rem)
    }
    body.ios .popup-dialog.ui-full .popup-group.popup-inandout-group.popup-inandout-pre-group {
        padding-top: 4.4rem
    }
    body.ios .popup-inandout-group.pre-event .container-component-coach {
        top: 4.4rem
    }
    body.ios .ailive-today-quiz {
        padding-top: 4.4rem
    }
    body.ios .tab-list-group[data-sticky-item] {
        top: calc(4.4rem + 5rem)
    }
    body.ios .container-component.ai-quiz .section-component.type2 {
        margin-top: calc(-5rem - 4.4rem);
        padding-top: calc(5rem + 4.4rem)
    }
    body.ios .container-component.ai-quiz .section-component.type4 {
        margin-top: calc(-5rem - 4.4rem);
        padding-top: calc(5rem + 4.4rem)
    }
    body.ios .fortune2025 .component-iframe {
        height: calc(100vh - (14.4rem + 4.4rem))
    }
    body.ios .container-component.common-cert.h-center .section-component.cert-section {
        min-height: calc(100vh - 24rem)
    }
    body.ios .section-component.stars-type1 {
        height: calc(100vh - (5rem + 4.4rem))
    }
    body.ios .section-component.mission-top {
        top: calc(5rem + 4.4rem)
    }
    body.ios .section-component.mission-rolling {
        top: calc(23.8rem + 4.4rem)
    }
    body.ios .page-inner-scroll.money-mission.first-lock-entry.scroll-top .section-component.mission-rolling {
        top: calc(24.3rem + 4.4rem)
    }
    body.ios .container-component.container-fixed {
        padding-top: calc(5rem + 4.4rem)
    }
    body.ios .page-inner-scroll.no-overscroll-y .container-component {
        padding-top: calc(5rem + 4.4rem)
    }
    body.ios .popup-dialog.ui-full .popup-group.mission-talisman:after {
        background-color: transparent
    }
    body.ios .popup-dialog.ui-full .popup-group.coin-full-wrap:after {
        background-color: transparent
    }
    body.ios .popup-dialog.ui-full .popup-group.transparent:after {
        background-color: transparent
    }
    body.ios .component-invest-calendar {
        top: calc(5rem + 4.4rem)
    }
    body.ios .page-inner-scroll.scrolling .component-tab.financial-scam {
        top: calc(5rem + 4.4rem)
    }
    body.ios .component-tab.sticky-logotab {
        top: calc(5rem + 4.4rem)
    }
    body.ios .tooltip-focus-group .tooltip-area.align-bottom.digit-signature {
        top: calc(2.2rem + 4.4rem)
    }
    body.ios .weekly-invest-main-bg {
        margin-top: calc(var(--header-height) * -1 - 4.4rem);
        height: calc(var(--weekly-invest-height) + 4.4rem)
    }
    body.ios .weekly-invest-main .extra-cash,
    body.ios .weekly-invest-main .gauge,
    body.ios .weekly-invest-main-inner {
        margin-top: 4.4rem
    }
    html.ios.statusExpension .content-savings.expired {
        height: calc(4.4rem + 53.9rem)
    }
    html.ios.statusExpension .content-savings.expired {
        height: calc(4.4rem + 53.9rem)
    }
    html.ios.statusExpension .content-savings {
        height: calc(4.4rem + 44.8rem)
    }
    html.ios.statusExpension .content-savings .img-area {
        top: 4.4rem
    }
    html.ios.statusExpension .content-savings .prodname-info {
        top: calc(4.4rem + 30.8rem)
    }
    html.ios.statusExpension .content-savings .kds-banner-card {
        top: calc(4.4rem + 42.1rem)
    }
    html.ios.statusExpension .savings-scroll .component-header::before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 4.4rem;
        background: var(--bg-pri-base)
    }
    html.ios.statusExpension .savings-scroll .component-fixed-bottom {
        min-height: calc(100vh - 5rem - 4.4rem - 4rem)
    }
    html.ios.statusExpension .container-component.ai-quiz.h-center .section-component {
        height: calc(100% - (16.2rem + 4.4rem + 4rem))
    }
    html.ios.statusExpension .container-component.view-center .section-component {
        height: calc(100% - (16.2rem + 4.4rem + 4rem))
    }
    html.ios.statusExpension .section-component.alarm-nodata {
        height: calc(100vh - (5rem + 4.4rem + 4rem))
    }
    html.ios.statusExpension .container-component.today-coupon.h-center .section-component {
        height: calc(100% - (20.2rem + 4.4rem + 4rem))
    }
    html.ios.statusExpension .section-component.stars-type2 {
        padding-top: calc(4.8rem + 4.4rem);
        padding-bottom: calc(8rem + 4rem)
    }
    html.ios.statusExpension .page-inner-scroll.scrolling .component-card-sticky {
        top: calc(4.4rem + 5rem)
    }
    body.ios .content-savings.expired {
        height: calc(4.4rem + 53.9rem)
    }
    body.ios .content-savings.expired {
        height: calc(4.4rem + 53.9rem)
    }
    body.ios .content-savings {
        height: calc(4.4rem + 44.8rem)
    }
    body.ios .content-savings .img-area {
        top: 4.4rem
    }
    body.ios .content-savings .prodname-info {
        top: calc(4.4rem + 30.8rem)
    }
    body.ios .content-savings .kds-banner-card {
        top: calc(4.4rem + 42.1rem)
    }
    body.ios .savings-scroll .component-header::before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 4.4rem;
        background: var(--bg-pri-base)
    }
    body.ios .savings-scroll .component-fixed-bottom {
        min-height: calc(100vh - 5rem - 4.4rem - 4rem)
    }
    body.ios .container-component.ai-quiz.h-center .section-component {
        height: calc(100% - (16.2rem + 4.4rem + 4rem))
    }
    body.ios .container-component.view-center .section-component {
        height: calc(100% - (16.2rem + 4.4rem + 4rem))
    }
    body.ios .section-component.alarm-nodata {
        height: calc(100vh - (5rem + 4.4rem + 4rem))
    }
    body.ios .container-component.today-coupon.h-center .section-component {
        height: calc(100% - (20.2rem + 4.4rem + 4rem))
    }
    body.ios .section-component.stars-type2 {
        padding-top: calc(4.8rem + 4.4rem);
        padding-bottom: calc(8rem + 4rem)
    }
    body.ios .page-inner-scroll.scrolling .component-card-sticky {
        top: calc(4.4rem + 5rem)
    }
}

/*! iPhone 11 Pro, X, Xs, 12 Mini(기본) 11 Pro Max(확대), Xs Max(확대), 12 pro max(확대) */

@media only screen and (device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 3) {
    /*! mixin :공통 - 헤더영역 */
    html.ios.statusExpension .component-header {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .popup-header .component-header {
        padding-top: 0
    }
    /*! 홈 - 일반 */
    html.ios.statusExpension .home-default .main-container-component.bg-main {
        padding-top: calc(4.4rem + 5.6rem)
    }
    /*! 홈 - 추천 */
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"].scrolling .component-tab.sticky-tab {
        top: calc(4.4rem + 0.2rem)
    }
    /*! 홈 - 혜택 */
    html.ios.statusExpension .page-inner-scroll.scrolling .component-tab.sticky-tab02 .tab-round-group {
        top: calc(4.4rem + 5rem)
    }
    /*! 홈 - 타임라인 */
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"].scrolling .component-form-date {
        top: calc(4.4rem + 5rem + 0.2rem)
    }
    /*! 홈 - 순서변경 */
    html.ios.statusExpension .page-inner-scroll.scrolling .component-text-simple.fixed-top {
        top: calc(4.4rem + 0.9rem)
    }
    /*! 공통 - 풀팝업일때 */
    html.ios.statusExpension .popup-dialog.ui-full .popup-group,
    html.ios.statusExpension .popup-dialog.ui-full-change .popup-group,
    html.ios.statusExpension .popup-dialog.ui-full-change.plus-box-event-pop .popup-group {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group:after {
        content: '';
        height: 4.4rem;
        background-color: var(--color-w100, #fff);
        position: fixed;
        top: 0;
        left: 0;
        width: 100%
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group:after {
        display: none
    }
    html.ios.statusExpension .popup-dialog.ui-full-change.plus-box-event-pop .interest-group-top .ani-step1-1 {
        margin-top: 8.2rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.shopping:after {
        background: var(--color-in700)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.shopping.bg-white:after {
        background-color: var(--color-w100, #fff)
    }
    /*! 홈 개편 */
    html.ios.statusExpension .component-header.main {
        padding-top: calc(4.4rem + 0.6rem)
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh.pull-home {
        padding-top: 0;
        margin-top: 4.4rem
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: 0.6rem
    }
    html.ios.statusExpension .scrolling .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: calc(4.4rem + 0.6rem)
    }
    html.ios.statusExpension .component-tab.foru-tab-ver.scrollOn .tab-group.foru-type {
        top: calc(4.4rem)
    }
    html.ios.statusExpension .component-header.main+.component-tab.foru-tab-ver {
        top: calc(4.4rem + 5.6rem)
    }
    html.ios.statusExpension .component-main-bnf-tab {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .invest-home .tab-list-group.sticky-invest {
        top: calc(4.4rem + 5.6rem)
    }
    html.ios.statusExpension .component-ceo-calendar {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .component-ceo-my-account.type2 {
        padding-top: calc(4.4rem + 37rem)
    }
    html.ios.statusExpension .container-component-coach .coach-item01 {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .component-header.search {
        padding-top: calc(4.4rem + 1.2rem);
        height: auto
    }
    html.ios.statusExpension .component-header.search.search-result {
        height: calc(4.4rem + 10.5rem)
    }
    html.ios.statusExpension .popup-inner .component-header.search.search-result {
        height: 10.5rem
    }
    html.ios.statusExpension .popup-inner .component-header.search.sticky {
        top: 4.4rem;
        padding-top: 1.2rem
    }
    html.ios.statusExpension .section-component.alarm .component-keyword {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .section-component.alarm .component-form-date {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .section-component.alarm.alarm-filter .component-form-date {
        top: calc(4.4rem + 10.6rem)
    }
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"] .component-main-refresh {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: 2.2rem
    }
    html.ios.statusExpension .safe-camp-kv .safe-camp-inner {
        margin-top: 4.4rem
    }
    /*! mixin :공통 - 헤더영역 */
    body.ios .component-header {
        padding-top: 4.4rem
    }
    body.ios .popup-header .component-header {
        padding-top: 0
    }
    /*! 홈 - 일반 */
    body.ios .home-default .main-container-component.bg-main {
        padding-top: calc(4.4rem + 5.6rem)
    }
    /*! 홈 - 추천 */
    body.ios .main-tab-container [class^="main-tab-content0"].scrolling .component-tab.sticky-tab {
        top: calc(4.4rem + 0.2rem)
    }
    /*! 홈 - 혜택 */
    body.ios .page-inner-scroll.scrolling .component-tab.sticky-tab02 .tab-round-group {
        top: calc(4.4rem + 5rem)
    }
    /*! 홈 - 타임라인 */
    body.ios .main-tab-container [class^="main-tab-content0"].scrolling .component-form-date {
        top: calc(4.4rem + 5rem + 0.2rem)
    }
    /*! 홈 - 순서변경 */
    body.ios .page-inner-scroll.scrolling .component-text-simple.fixed-top {
        top: calc(4.4rem + 0.9rem)
    }
    /*! 공통 - 풀팝업일때 */
    body.ios .popup-dialog.ui-full .popup-group,
    body.ios .popup-dialog.ui-full-change .popup-group,
    body.ios .popup-dialog.ui-full-change.plus-box-event-pop .popup-group {
        padding-top: 4.4rem
    }
    body.ios .popup-dialog.ui-full .popup-group:after {
        content: '';
        height: 4.4rem;
        background-color: var(--color-w100, #fff);
        position: fixed;
        top: 0;
        left: 0;
        width: 100%
    }
    body.ios .popup-dialog.ui-full .popup-group.popup-inandout-group:after {
        display: none
    }
    body.ios .popup-dialog.ui-full-change.plus-box-event-pop .interest-group-top .ani-step1-1 {
        margin-top: 8.2rem
    }
    body.ios .popup-dialog.ui-full .popup-group.shopping:after {
        background: var(--color-in700)
    }
    body.ios .popup-dialog.ui-full .popup-group.shopping.bg-white:after {
        background-color: var(--color-w100, #fff)
    }
    /*! 홈 개편 */
    body.ios .component-header.main {
        padding-top: calc(4.4rem + 0.6rem)
    }
    body.ios .ptr--ptr.ptr--refresh {
        padding-top: 4.4rem
    }
    body.ios .ptr--ptr.ptr--refresh.pull-home {
        padding-top: 0;
        margin-top: 4.4rem
    }
    body.ios .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: 0.6rem
    }
    body.ios .scrolling .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: calc(4.4rem + 0.6rem)
    }
    body.ios .component-tab.foru-tab-ver.scrollOn .tab-group.foru-type {
        top: calc(4.4rem)
    }
    body.ios .component-header.main+.component-tab.foru-tab-ver {
        top: calc(4.4rem + 5.6rem)
    }
    body.ios .component-main-bnf-tab {
        top: calc(4.4rem + 5rem)
    }
    body.ios .invest-home .tab-list-group.sticky-invest {
        top: calc(4.4rem + 5.6rem)
    }
    body.ios .component-ceo-calendar {
        top: calc(4.4rem + 5rem)
    }
    body.ios .component-ceo-my-account.type2 {
        padding-top: calc(4.4rem + 37rem)
    }
    body.ios .container-component-coach .coach-item01 {
        padding-top: 4.4rem
    }
    body.ios .component-header.search {
        padding-top: calc(4.4rem + 1.2rem);
        height: auto
    }
    body.ios .component-header.search.search-result {
        height: calc(4.4rem + 10.5rem)
    }
    body.ios .popup-inner .component-header.search.search-result {
        height: 10.5rem
    }
    body.ios .popup-inner .component-header.search.sticky {
        top: 4.4rem;
        padding-top: 1.2rem
    }
    body.ios .section-component.alarm .component-keyword {
        top: calc(4.4rem + 5rem)
    }
    body.ios .section-component.alarm .component-form-date {
        top: calc(4.4rem + 5rem)
    }
    body.ios .section-component.alarm.alarm-filter .component-form-date {
        top: calc(4.4rem + 10.6rem)
    }
    body.ios .main-tab-container [class^="main-tab-content0"] .component-main-refresh {
        top: calc(5rem + 4.4rem)
    }
    body.ios .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: 2.2rem
    }
    body.ios .safe-camp-kv .safe-camp-inner {
        margin-top: 4.4rem
    }
    /*! mixin :공통 - 헤더영역 */
    /*! 검색 - 공통 */
    html.ios.statusExpension .component-list.fixed,
    html.ios.statusExpension .component-search[class*="fixed"] {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .component-gathering-selected.active {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .component-gathering-selected.active+.component-search {
        top: calc(4.4rem + 16.2rem)
    }
    /*! 모임통장 - 모임홈 */
    html.ios.statusExpension .component-meet-profile {
        margin-top: -4.4rem
    }
    html.ios.statusExpension .component-meethome-profile {
        margin-top: calc(-5rem - 4.4rem)
    }
    /*! 상단 tab 고정 */
    html.ios.statusExpension .component-tab.food-cate-sticky,
    html.ios.statusExpension .component-text-simple+.component-tab.sticky,
    html.ios.statusExpension .section-component .component-tab.sticky,
    html.ios.statusExpension .section-component.living-price-tab .component-tab.sticky {
        top: calc(4.4rem + 5rem)
    }
    /*! 이체 */
    html.ios.statusExpension .component-header+.component-keypad {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .section-component-sticky {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .fixed-msg-card,
    html.ios.statusExpension .section-flex-colume {
        height: calc(100vh - calc(4.4rem + 5rem))
    }
    html.ios.statusExpension .section-flex-colume.type3 {
        height: calc(100vh - calc(4.4rem + 11rem))
    }
    html.ios.statusExpension .section-flex-colume.type4 {
        height: calc(100vh - calc(4.4rem + 19.4rem))
    }
    html.ios.statusExpension .component-card-sum-top.type2[class*="fixed"] {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .dim-moneytree-wrap {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .toast-wrap.ceo-type {
        bottom: auto;
        top: calc(4.4rem + 9.4rem)
    }
    html.ios.statusExpension .component-tab.sticky+.article-component .component-search[class*="fixed"] {
        top: calc(4.4rem + 11rem)
    }
    html.ios.statusExpension .container-component.shopping .component-text.sticky {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .container-component.shopping .component-text.sticky+.component-tab .tab-list-group.sticky {
        top: calc(4.4rem + 9rem)
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach.active {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: calc(4.4rem + 8.6rem)
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach .coach-close {
        padding-top: 0
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .inandout-calendar-inner {
        top: 4.4rem
    }
    html.ios.statusExpension .inandout-tab-wrap {
        top: calc(5.5rem + 4.4rem)
    }
    html.ios.statusExpension .section-component.custom-policy .component-tab.sticky-chip {
        top: calc(4.4rem + 11rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group.popup-inandout-pre-group {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .popup-inandout-group.pre-event .container-component-coach {
        top: 4.4rem
    }
    html.ios.statusExpension .ailive-today-quiz {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .tab-list-group[data-sticky-item] {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .container-component.ai-quiz .section-component.type2 {
        margin-top: calc(-5rem - 4.4rem);
        padding-top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .container-component.ai-quiz .section-component.type4 {
        margin-top: calc(-5rem - 4.4rem);
        padding-top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .fortune2025 .component-iframe {
        height: calc(100vh - (14.4rem + 4.4rem))
    }
    html.ios.statusExpension .container-component.common-cert.h-center .section-component.cert-section {
        min-height: calc(100vh - 24rem)
    }
    html.ios.statusExpension .section-component.stars-type1 {
        height: calc(100vh - (5rem + 4.4rem))
    }
    html.ios.statusExpension .section-component.mission-top {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .section-component.mission-rolling {
        top: calc(23.8rem + 4.4rem)
    }
    html.ios.statusExpension .page-inner-scroll.money-mission.first-lock-entry.scroll-top .section-component.mission-rolling {
        top: calc(24.3rem + 4.4rem)
    }
    html.ios.statusExpension .container-component.container-fixed {
        padding-top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .page-inner-scroll.no-overscroll-y .container-component {
        padding-top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.mission-talisman:after {
        background-color: transparent
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.coin-full-wrap:after {
        background-color: transparent
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.transparent:after {
        background-color: transparent
    }
    html.ios.statusExpension .component-invest-calendar {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .page-inner-scroll.scrolling .component-tab.financial-scam {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .component-tab.sticky-logotab {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .tooltip-focus-group .tooltip-area.align-bottom.digit-signature {
        top: calc(2.2rem + 4.4rem)
    }
    html.ios.statusExpension .weekly-invest-main-bg {
        margin-top: calc(var(--header-height) * -1 - 4.4rem);
        height: calc(var(--weekly-invest-height) + 4.4rem)
    }
    html.ios.statusExpension .weekly-invest-main .extra-cash,
    html.ios.statusExpension .weekly-invest-main .gauge,
    html.ios.statusExpension .weekly-invest-main-inner {
        margin-top: 4.4rem
    }
    /*! mixin :공통 - 헤더영역 */
    /*! 검색 - 공통 */
    body.ios .component-list.fixed,
    body.ios .component-search[class*="fixed"] {
        top: calc(4.4rem + 5rem)
    }
    body.ios .component-gathering-selected.active {
        top: calc(4.4rem + 5rem)
    }
    body.ios .component-gathering-selected.active+.component-search {
        top: calc(4.4rem + 16.2rem)
    }
    /*! 모임통장 - 모임홈 */
    body.ios .component-meet-profile {
        margin-top: -4.4rem
    }
    body.ios .component-meethome-profile {
        margin-top: calc(-5rem - 4.4rem)
    }
    /*! 상단 tab 고정 */
    body.ios .component-tab.food-cate-sticky,
    body.ios .component-text-simple+.component-tab.sticky,
    body.ios .section-component .component-tab.sticky,
    body.ios .section-component.living-price-tab .component-tab.sticky {
        top: calc(4.4rem + 5rem)
    }
    /*! 이체 */
    body.ios .component-header+.component-keypad {
        padding-top: 4.4rem
    }
    body.ios .section-component-sticky {
        top: calc(4.4rem + 5rem)
    }
    body.ios .fixed-msg-card,
    body.ios .section-flex-colume {
        height: calc(100vh - calc(4.4rem + 5rem))
    }
    body.ios .section-flex-colume.type3 {
        height: calc(100vh - calc(4.4rem + 11rem))
    }
    body.ios .section-flex-colume.type4 {
        height: calc(100vh - calc(4.4rem + 19.4rem))
    }
    body.ios .component-card-sum-top.type2[class*="fixed"] {
        top: calc(4.4rem + 5rem)
    }
    body.ios .dim-moneytree-wrap {
        top: calc(4.4rem + 5rem)
    }
    body.ios .toast-wrap.ceo-type {
        bottom: auto;
        top: calc(4.4rem + 9.4rem)
    }
    body.ios .component-tab.sticky+.article-component .component-search[class*="fixed"] {
        top: calc(4.4rem + 11rem)
    }
    body.ios .container-component.shopping .component-text.sticky {
        top: calc(4.4rem + 5rem)
    }
    body.ios .container-component.shopping .component-text.sticky+.component-tab .tab-list-group.sticky {
        top: calc(4.4rem + 9rem)
    }
    body.ios .page-inner-scroll.inandout-scroll .container-component-coach {
        padding-top: 4.4rem
    }
    body.ios .page-inner-scroll.inandout-scroll .container-component-coach.active {
        padding-top: 4.4rem
    }
    body.ios .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: calc(4.4rem + 8.6rem)
    }
    body.ios .page-inner-scroll.inandout-scroll .container-component-coach .coach-close {
        padding-top: 0
    }
    body.ios .page-inner-scroll.inandout-scroll .inandout-calendar-inner {
        top: 4.4rem
    }
    body.ios .inandout-tab-wrap {
        top: calc(5.5rem + 4.4rem)
    }
    body.ios .section-component.custom-policy .component-tab.sticky-chip {
        top: calc(4.4rem + 11rem)
    }
    body.ios .popup-dialog.ui-full .popup-group.popup-inandout-group.popup-inandout-pre-group {
        padding-top: 4.4rem
    }
    body.ios .popup-inandout-group.pre-event .container-component-coach {
        top: 4.4rem
    }
    body.ios .ailive-today-quiz {
        padding-top: 4.4rem
    }
    body.ios .tab-list-group[data-sticky-item] {
        top: calc(4.4rem + 5rem)
    }
    body.ios .container-component.ai-quiz .section-component.type2 {
        margin-top: calc(-5rem - 4.4rem);
        padding-top: calc(5rem + 4.4rem)
    }
    body.ios .container-component.ai-quiz .section-component.type4 {
        margin-top: calc(-5rem - 4.4rem);
        padding-top: calc(5rem + 4.4rem)
    }
    body.ios .fortune2025 .component-iframe {
        height: calc(100vh - (14.4rem + 4.4rem))
    }
    body.ios .container-component.common-cert.h-center .section-component.cert-section {
        min-height: calc(100vh - 24rem)
    }
    body.ios .section-component.stars-type1 {
        height: calc(100vh - (5rem + 4.4rem))
    }
    body.ios .section-component.mission-top {
        top: calc(5rem + 4.4rem)
    }
    body.ios .section-component.mission-rolling {
        top: calc(23.8rem + 4.4rem)
    }
    body.ios .page-inner-scroll.money-mission.first-lock-entry.scroll-top .section-component.mission-rolling {
        top: calc(24.3rem + 4.4rem)
    }
    body.ios .container-component.container-fixed {
        padding-top: calc(5rem + 4.4rem)
    }
    body.ios .page-inner-scroll.no-overscroll-y .container-component {
        padding-top: calc(5rem + 4.4rem)
    }
    body.ios .popup-dialog.ui-full .popup-group.mission-talisman:after {
        background-color: transparent
    }
    body.ios .popup-dialog.ui-full .popup-group.coin-full-wrap:after {
        background-color: transparent
    }
    body.ios .popup-dialog.ui-full .popup-group.transparent:after {
        background-color: transparent
    }
    body.ios .component-invest-calendar {
        top: calc(5rem + 4.4rem)
    }
    body.ios .page-inner-scroll.scrolling .component-tab.financial-scam {
        top: calc(5rem + 4.4rem)
    }
    body.ios .component-tab.sticky-logotab {
        top: calc(5rem + 4.4rem)
    }
    body.ios .tooltip-focus-group .tooltip-area.align-bottom.digit-signature {
        top: calc(2.2rem + 4.4rem)
    }
    body.ios .weekly-invest-main-bg {
        margin-top: calc(var(--header-height) * -1 - 4.4rem);
        height: calc(var(--weekly-invest-height) + 4.4rem)
    }
    body.ios .weekly-invest-main .extra-cash,
    body.ios .weekly-invest-main .gauge,
    body.ios .weekly-invest-main-inner {
        margin-top: 4.4rem
    }
    html.ios.statusExpension .content-savings.expired {
        height: calc(4.4rem + 53.9rem)
    }
    html.ios.statusExpension .content-savings.expired {
        height: calc(4.4rem + 53.9rem)
    }
    html.ios.statusExpension .content-savings {
        height: calc(4.4rem + 44.8rem)
    }
    html.ios.statusExpension .content-savings .img-area {
        top: 4.4rem
    }
    html.ios.statusExpension .content-savings .prodname-info {
        top: calc(4.4rem + 30.8rem)
    }
    html.ios.statusExpension .content-savings .kds-banner-card {
        top: calc(4.4rem + 42.1rem)
    }
    html.ios.statusExpension .savings-scroll .component-header::before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 4.4rem;
        background: var(--bg-pri-base)
    }
    html.ios.statusExpension .savings-scroll .component-fixed-bottom {
        min-height: calc(100vh - 5rem - 4.4rem - 4rem)
    }
    html.ios.statusExpension .container-component.ai-quiz.h-center .section-component {
        height: calc(100% - (16.2rem + 4.4rem + 4rem))
    }
    html.ios.statusExpension .container-component.view-center .section-component {
        height: calc(100% - (16.2rem + 4.4rem + 4rem))
    }
    html.ios.statusExpension .section-component.alarm-nodata {
        height: calc(100vh - (5rem + 4.4rem + 4rem))
    }
    html.ios.statusExpension .container-component.today-coupon.h-center .section-component {
        height: calc(100% - (20.2rem + 4.4rem + 4rem))
    }
    html.ios.statusExpension .section-component.stars-type2 {
        padding-top: calc(4.8rem + 4.4rem);
        padding-bottom: calc(8rem + 4rem)
    }
    html.ios.statusExpension .page-inner-scroll.scrolling .component-card-sticky {
        top: calc(4.4rem + 5rem)
    }
    body.ios .content-savings.expired {
        height: calc(4.4rem + 53.9rem)
    }
    body.ios .content-savings.expired {
        height: calc(4.4rem + 53.9rem)
    }
    body.ios .content-savings {
        height: calc(4.4rem + 44.8rem)
    }
    body.ios .content-savings .img-area {
        top: 4.4rem
    }
    body.ios .content-savings .prodname-info {
        top: calc(4.4rem + 30.8rem)
    }
    body.ios .content-savings .kds-banner-card {
        top: calc(4.4rem + 42.1rem)
    }
    body.ios .savings-scroll .component-header::before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 4.4rem;
        background: var(--bg-pri-base)
    }
    body.ios .savings-scroll .component-fixed-bottom {
        min-height: calc(100vh - 5rem - 4.4rem - 4rem)
    }
    body.ios .container-component.ai-quiz.h-center .section-component {
        height: calc(100% - (16.2rem + 4.4rem + 4rem))
    }
    body.ios .container-component.view-center .section-component {
        height: calc(100% - (16.2rem + 4.4rem + 4rem))
    }
    body.ios .section-component.alarm-nodata {
        height: calc(100vh - (5rem + 4.4rem + 4rem))
    }
    body.ios .container-component.today-coupon.h-center .section-component {
        height: calc(100% - (20.2rem + 4.4rem + 4rem))
    }
    body.ios .section-component.stars-type2 {
        padding-top: calc(4.8rem + 4.4rem);
        padding-bottom: calc(8rem + 4rem)
    }
    body.ios .page-inner-scroll.scrolling .component-card-sticky {
        top: calc(4.4rem + 5rem)
    }
}

/*! iPhone 12, 12 Pro, 14 */

@media only screen and (device-width: 390px) and (device-height: 844px) and (-webkit-device-pixel-ratio: 3) {
    /*! mixin :공통 - 헤더영역 */
    html.ios.statusExpension .component-header {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .popup-header .component-header {
        padding-top: 0
    }
    /*! 홈 - 일반 */
    html.ios.statusExpension .home-default .main-container-component.bg-main {
        padding-top: calc(4.4rem + 5.6rem)
    }
    /*! 홈 - 추천 */
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"].scrolling .component-tab.sticky-tab {
        top: calc(4.4rem + 0.2rem)
    }
    /*! 홈 - 혜택 */
    html.ios.statusExpension .page-inner-scroll.scrolling .component-tab.sticky-tab02 .tab-round-group {
        top: calc(4.4rem + 5rem)
    }
    /*! 홈 - 타임라인 */
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"].scrolling .component-form-date {
        top: calc(4.4rem + 5rem + 0.2rem)
    }
    /*! 홈 - 순서변경 */
    html.ios.statusExpension .page-inner-scroll.scrolling .component-text-simple.fixed-top {
        top: calc(4.4rem + 0.9rem)
    }
    /*! 공통 - 풀팝업일때 */
    html.ios.statusExpension .popup-dialog.ui-full .popup-group,
    html.ios.statusExpension .popup-dialog.ui-full-change .popup-group,
    html.ios.statusExpension .popup-dialog.ui-full-change.plus-box-event-pop .popup-group {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group:after {
        content: '';
        height: 4.4rem;
        background-color: var(--color-w100, #fff);
        position: fixed;
        top: 0;
        left: 0;
        width: 100%
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group:after {
        display: none
    }
    html.ios.statusExpension .popup-dialog.ui-full-change.plus-box-event-pop .interest-group-top .ani-step1-1 {
        margin-top: 8.2rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.shopping:after {
        background: var(--color-in700)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.shopping.bg-white:after {
        background-color: var(--color-w100, #fff)
    }
    /*! 홈 개편 */
    html.ios.statusExpension .component-header.main {
        padding-top: calc(4.4rem + 0.6rem)
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh.pull-home {
        padding-top: 0;
        margin-top: 4.4rem
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: 0.6rem
    }
    html.ios.statusExpension .scrolling .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: calc(4.4rem + 0.6rem)
    }
    html.ios.statusExpension .component-tab.foru-tab-ver.scrollOn .tab-group.foru-type {
        top: calc(4.4rem)
    }
    html.ios.statusExpension .component-header.main+.component-tab.foru-tab-ver {
        top: calc(4.4rem + 5.6rem)
    }
    html.ios.statusExpension .component-main-bnf-tab {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .invest-home .tab-list-group.sticky-invest {
        top: calc(4.4rem + 5.6rem)
    }
    html.ios.statusExpension .component-ceo-calendar {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .component-ceo-my-account.type2 {
        padding-top: calc(4.4rem + 37rem)
    }
    html.ios.statusExpension .container-component-coach .coach-item01 {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .component-header.search {
        padding-top: calc(4.4rem + 1.2rem);
        height: auto
    }
    html.ios.statusExpension .component-header.search.search-result {
        height: calc(4.4rem + 10.5rem)
    }
    html.ios.statusExpension .popup-inner .component-header.search.search-result {
        height: 10.5rem
    }
    html.ios.statusExpension .popup-inner .component-header.search.sticky {
        top: 4.4rem;
        padding-top: 1.2rem
    }
    html.ios.statusExpension .section-component.alarm .component-keyword {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .section-component.alarm .component-form-date {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .section-component.alarm.alarm-filter .component-form-date {
        top: calc(4.4rem + 10.6rem)
    }
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"] .component-main-refresh {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: 2.2rem
    }
    html.ios.statusExpension .safe-camp-kv .safe-camp-inner {
        margin-top: 4.4rem
    }
    /*! mixin :공통 - 헤더영역 */
    body.ios .component-header {
        padding-top: 4.4rem
    }
    body.ios .popup-header .component-header {
        padding-top: 0
    }
    /*! 홈 - 일반 */
    body.ios .home-default .main-container-component.bg-main {
        padding-top: calc(4.4rem + 5.6rem)
    }
    /*! 홈 - 추천 */
    body.ios .main-tab-container [class^="main-tab-content0"].scrolling .component-tab.sticky-tab {
        top: calc(4.4rem + 0.2rem)
    }
    /*! 홈 - 혜택 */
    body.ios .page-inner-scroll.scrolling .component-tab.sticky-tab02 .tab-round-group {
        top: calc(4.4rem + 5rem)
    }
    /*! 홈 - 타임라인 */
    body.ios .main-tab-container [class^="main-tab-content0"].scrolling .component-form-date {
        top: calc(4.4rem + 5rem + 0.2rem)
    }
    /*! 홈 - 순서변경 */
    body.ios .page-inner-scroll.scrolling .component-text-simple.fixed-top {
        top: calc(4.4rem + 0.9rem)
    }
    /*! 공통 - 풀팝업일때 */
    body.ios .popup-dialog.ui-full .popup-group,
    body.ios .popup-dialog.ui-full-change .popup-group,
    body.ios .popup-dialog.ui-full-change.plus-box-event-pop .popup-group {
        padding-top: 4.4rem
    }
    body.ios .popup-dialog.ui-full .popup-group:after {
        content: '';
        height: 4.4rem;
        background-color: var(--color-w100, #fff);
        position: fixed;
        top: 0;
        left: 0;
        width: 100%
    }
    body.ios .popup-dialog.ui-full .popup-group.popup-inandout-group:after {
        display: none
    }
    body.ios .popup-dialog.ui-full-change.plus-box-event-pop .interest-group-top .ani-step1-1 {
        margin-top: 8.2rem
    }
    body.ios .popup-dialog.ui-full .popup-group.shopping:after {
        background: var(--color-in700)
    }
    body.ios .popup-dialog.ui-full .popup-group.shopping.bg-white:after {
        background-color: var(--color-w100, #fff)
    }
    /*! 홈 개편 */
    body.ios .component-header.main {
        padding-top: calc(4.4rem + 0.6rem)
    }
    body.ios .ptr--ptr.ptr--refresh {
        padding-top: 4.4rem
    }
    body.ios .ptr--ptr.ptr--refresh.pull-home {
        padding-top: 0;
        margin-top: 4.4rem
    }
    body.ios .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: 0.6rem
    }
    body.ios .scrolling .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: calc(4.4rem + 0.6rem)
    }
    body.ios .component-tab.foru-tab-ver.scrollOn .tab-group.foru-type {
        top: calc(4.4rem)
    }
    body.ios .component-header.main+.component-tab.foru-tab-ver {
        top: calc(4.4rem + 5.6rem)
    }
    body.ios .component-main-bnf-tab {
        top: calc(4.4rem + 5rem)
    }
    body.ios .invest-home .tab-list-group.sticky-invest {
        top: calc(4.4rem + 5.6rem)
    }
    body.ios .component-ceo-calendar {
        top: calc(4.4rem + 5rem)
    }
    body.ios .component-ceo-my-account.type2 {
        padding-top: calc(4.4rem + 37rem)
    }
    body.ios .container-component-coach .coach-item01 {
        padding-top: 4.4rem
    }
    body.ios .component-header.search {
        padding-top: calc(4.4rem + 1.2rem);
        height: auto
    }
    body.ios .component-header.search.search-result {
        height: calc(4.4rem + 10.5rem)
    }
    body.ios .popup-inner .component-header.search.search-result {
        height: 10.5rem
    }
    body.ios .popup-inner .component-header.search.sticky {
        top: 4.4rem;
        padding-top: 1.2rem
    }
    body.ios .section-component.alarm .component-keyword {
        top: calc(4.4rem + 5rem)
    }
    body.ios .section-component.alarm .component-form-date {
        top: calc(4.4rem + 5rem)
    }
    body.ios .section-component.alarm.alarm-filter .component-form-date {
        top: calc(4.4rem + 10.6rem)
    }
    body.ios .main-tab-container [class^="main-tab-content0"] .component-main-refresh {
        top: calc(5rem + 4.4rem)
    }
    body.ios .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: 2.2rem
    }
    body.ios .safe-camp-kv .safe-camp-inner {
        margin-top: 4.4rem
    }
    /*! mixin :공통 - 헤더영역 */
    /*! 검색 - 공통 */
    html.ios.statusExpension .component-list.fixed,
    html.ios.statusExpension .component-search[class*="fixed"] {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .component-gathering-selected.active {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .component-gathering-selected.active+.component-search {
        top: calc(4.4rem + 16.2rem)
    }
    /*! 모임통장 - 모임홈 */
    html.ios.statusExpension .component-meet-profile {
        margin-top: -4.4rem
    }
    html.ios.statusExpension .component-meethome-profile {
        margin-top: calc(-5rem - 4.4rem)
    }
    /*! 상단 tab 고정 */
    html.ios.statusExpension .component-tab.food-cate-sticky,
    html.ios.statusExpension .component-text-simple+.component-tab.sticky,
    html.ios.statusExpension .section-component .component-tab.sticky,
    html.ios.statusExpension .section-component.living-price-tab .component-tab.sticky {
        top: calc(4.4rem + 5rem)
    }
    /*! 이체 */
    html.ios.statusExpension .component-header+.component-keypad {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .section-component-sticky {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .fixed-msg-card,
    html.ios.statusExpension .section-flex-colume {
        height: calc(100vh - calc(4.4rem + 5rem))
    }
    html.ios.statusExpension .section-flex-colume.type3 {
        height: calc(100vh - calc(4.4rem + 11rem))
    }
    html.ios.statusExpension .section-flex-colume.type4 {
        height: calc(100vh - calc(4.4rem + 19.4rem))
    }
    html.ios.statusExpension .component-card-sum-top.type2[class*="fixed"] {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .dim-moneytree-wrap {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .toast-wrap.ceo-type {
        bottom: auto;
        top: calc(4.4rem + 9.4rem)
    }
    html.ios.statusExpension .component-tab.sticky+.article-component .component-search[class*="fixed"] {
        top: calc(4.4rem + 11rem)
    }
    html.ios.statusExpension .container-component.shopping .component-text.sticky {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .container-component.shopping .component-text.sticky+.component-tab .tab-list-group.sticky {
        top: calc(4.4rem + 9rem)
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach.active {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: calc(4.4rem + 8.6rem)
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach .coach-close {
        padding-top: 0
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .inandout-calendar-inner {
        top: 4.4rem
    }
    html.ios.statusExpension .inandout-tab-wrap {
        top: calc(5.5rem + 4.4rem)
    }
    html.ios.statusExpension .section-component.custom-policy .component-tab.sticky-chip {
        top: calc(4.4rem + 11rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group.popup-inandout-pre-group {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .popup-inandout-group.pre-event .container-component-coach {
        top: 4.4rem
    }
    html.ios.statusExpension .ailive-today-quiz {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .tab-list-group[data-sticky-item] {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .container-component.ai-quiz .section-component.type2 {
        margin-top: calc(-5rem - 4.4rem);
        padding-top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .container-component.ai-quiz .section-component.type4 {
        margin-top: calc(-5rem - 4.4rem);
        padding-top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .fortune2025 .component-iframe {
        height: calc(100vh - (14.4rem + 4.4rem))
    }
    html.ios.statusExpension .container-component.common-cert.h-center .section-component.cert-section {
        min-height: calc(100vh - 24rem)
    }
    html.ios.statusExpension .section-component.stars-type1 {
        height: calc(100vh - (5rem + 4.4rem))
    }
    html.ios.statusExpension .section-component.mission-top {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .section-component.mission-rolling {
        top: calc(23.8rem + 4.4rem)
    }
    html.ios.statusExpension .page-inner-scroll.money-mission.first-lock-entry.scroll-top .section-component.mission-rolling {
        top: calc(24.3rem + 4.4rem)
    }
    html.ios.statusExpension .container-component.container-fixed {
        padding-top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .page-inner-scroll.no-overscroll-y .container-component {
        padding-top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.mission-talisman:after {
        background-color: transparent
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.coin-full-wrap:after {
        background-color: transparent
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.transparent:after {
        background-color: transparent
    }
    html.ios.statusExpension .component-invest-calendar {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .page-inner-scroll.scrolling .component-tab.financial-scam {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .component-tab.sticky-logotab {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .tooltip-focus-group .tooltip-area.align-bottom.digit-signature {
        top: calc(2.2rem + 4.4rem)
    }
    html.ios.statusExpension .weekly-invest-main-bg {
        margin-top: calc(var(--header-height) * -1 - 4.4rem);
        height: calc(var(--weekly-invest-height) + 4.4rem)
    }
    html.ios.statusExpension .weekly-invest-main .extra-cash,
    html.ios.statusExpension .weekly-invest-main .gauge,
    html.ios.statusExpension .weekly-invest-main-inner {
        margin-top: 4.4rem
    }
    /*! mixin :공통 - 헤더영역 */
    /*! 검색 - 공통 */
    body.ios .component-list.fixed,
    body.ios .component-search[class*="fixed"] {
        top: calc(4.4rem + 5rem)
    }
    body.ios .component-gathering-selected.active {
        top: calc(4.4rem + 5rem)
    }
    body.ios .component-gathering-selected.active+.component-search {
        top: calc(4.4rem + 16.2rem)
    }
    /*! 모임통장 - 모임홈 */
    body.ios .component-meet-profile {
        margin-top: -4.4rem
    }
    body.ios .component-meethome-profile {
        margin-top: calc(-5rem - 4.4rem)
    }
    /*! 상단 tab 고정 */
    body.ios .component-tab.food-cate-sticky,
    body.ios .component-text-simple+.component-tab.sticky,
    body.ios .section-component .component-tab.sticky,
    body.ios .section-component.living-price-tab .component-tab.sticky {
        top: calc(4.4rem + 5rem)
    }
    /*! 이체 */
    body.ios .component-header+.component-keypad {
        padding-top: 4.4rem
    }
    body.ios .section-component-sticky {
        top: calc(4.4rem + 5rem)
    }
    body.ios .fixed-msg-card,
    body.ios .section-flex-colume {
        height: calc(100vh - calc(4.4rem + 5rem))
    }
    body.ios .section-flex-colume.type3 {
        height: calc(100vh - calc(4.4rem + 11rem))
    }
    body.ios .section-flex-colume.type4 {
        height: calc(100vh - calc(4.4rem + 19.4rem))
    }
    body.ios .component-card-sum-top.type2[class*="fixed"] {
        top: calc(4.4rem + 5rem)
    }
    body.ios .dim-moneytree-wrap {
        top: calc(4.4rem + 5rem)
    }
    body.ios .toast-wrap.ceo-type {
        bottom: auto;
        top: calc(4.4rem + 9.4rem)
    }
    body.ios .component-tab.sticky+.article-component .component-search[class*="fixed"] {
        top: calc(4.4rem + 11rem)
    }
    body.ios .container-component.shopping .component-text.sticky {
        top: calc(4.4rem + 5rem)
    }
    body.ios .container-component.shopping .component-text.sticky+.component-tab .tab-list-group.sticky {
        top: calc(4.4rem + 9rem)
    }
    body.ios .page-inner-scroll.inandout-scroll .container-component-coach {
        padding-top: 4.4rem
    }
    body.ios .page-inner-scroll.inandout-scroll .container-component-coach.active {
        padding-top: 4.4rem
    }
    body.ios .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: calc(4.4rem + 8.6rem)
    }
    body.ios .page-inner-scroll.inandout-scroll .container-component-coach .coach-close {
        padding-top: 0
    }
    body.ios .page-inner-scroll.inandout-scroll .inandout-calendar-inner {
        top: 4.4rem
    }
    body.ios .inandout-tab-wrap {
        top: calc(5.5rem + 4.4rem)
    }
    body.ios .section-component.custom-policy .component-tab.sticky-chip {
        top: calc(4.4rem + 11rem)
    }
    body.ios .popup-dialog.ui-full .popup-group.popup-inandout-group.popup-inandout-pre-group {
        padding-top: 4.4rem
    }
    body.ios .popup-inandout-group.pre-event .container-component-coach {
        top: 4.4rem
    }
    body.ios .ailive-today-quiz {
        padding-top: 4.4rem
    }
    body.ios .tab-list-group[data-sticky-item] {
        top: calc(4.4rem + 5rem)
    }
    body.ios .container-component.ai-quiz .section-component.type2 {
        margin-top: calc(-5rem - 4.4rem);
        padding-top: calc(5rem + 4.4rem)
    }
    body.ios .container-component.ai-quiz .section-component.type4 {
        margin-top: calc(-5rem - 4.4rem);
        padding-top: calc(5rem + 4.4rem)
    }
    body.ios .fortune2025 .component-iframe {
        height: calc(100vh - (14.4rem + 4.4rem))
    }
    body.ios .container-component.common-cert.h-center .section-component.cert-section {
        min-height: calc(100vh - 24rem)
    }
    body.ios .section-component.stars-type1 {
        height: calc(100vh - (5rem + 4.4rem))
    }
    body.ios .section-component.mission-top {
        top: calc(5rem + 4.4rem)
    }
    body.ios .section-component.mission-rolling {
        top: calc(23.8rem + 4.4rem)
    }
    body.ios .page-inner-scroll.money-mission.first-lock-entry.scroll-top .section-component.mission-rolling {
        top: calc(24.3rem + 4.4rem)
    }
    body.ios .container-component.container-fixed {
        padding-top: calc(5rem + 4.4rem)
    }
    body.ios .page-inner-scroll.no-overscroll-y .container-component {
        padding-top: calc(5rem + 4.4rem)
    }
    body.ios .popup-dialog.ui-full .popup-group.mission-talisman:after {
        background-color: transparent
    }
    body.ios .popup-dialog.ui-full .popup-group.coin-full-wrap:after {
        background-color: transparent
    }
    body.ios .popup-dialog.ui-full .popup-group.transparent:after {
        background-color: transparent
    }
    body.ios .component-invest-calendar {
        top: calc(5rem + 4.4rem)
    }
    body.ios .page-inner-scroll.scrolling .component-tab.financial-scam {
        top: calc(5rem + 4.4rem)
    }
    body.ios .component-tab.sticky-logotab {
        top: calc(5rem + 4.4rem)
    }
    body.ios .tooltip-focus-group .tooltip-area.align-bottom.digit-signature {
        top: calc(2.2rem + 4.4rem)
    }
    body.ios .weekly-invest-main-bg {
        margin-top: calc(var(--header-height) * -1 - 4.4rem);
        height: calc(var(--weekly-invest-height) + 4.4rem)
    }
    body.ios .weekly-invest-main .extra-cash,
    body.ios .weekly-invest-main .gauge,
    body.ios .weekly-invest-main-inner {
        margin-top: 4.4rem
    }
    html.ios.statusExpension .content-savings.expired {
        height: calc(4.4rem + 53.9rem)
    }
    html.ios.statusExpension .content-savings.expired {
        height: calc(4.4rem + 53.9rem)
    }
    html.ios.statusExpension .content-savings {
        height: calc(4.4rem + 44.8rem)
    }
    html.ios.statusExpension .content-savings .img-area {
        top: 4.4rem
    }
    html.ios.statusExpension .content-savings .prodname-info {
        top: calc(4.4rem + 30.8rem)
    }
    html.ios.statusExpension .content-savings .kds-banner-card {
        top: calc(4.4rem + 42.1rem)
    }
    html.ios.statusExpension .savings-scroll .component-header::before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 4.4rem;
        background: var(--bg-pri-base)
    }
    html.ios.statusExpension .savings-scroll .component-fixed-bottom {
        min-height: calc(100vh - 5rem - 4.4rem - 4rem)
    }
    html.ios.statusExpension .container-component.ai-quiz.h-center .section-component {
        height: calc(100% - (16.2rem + 4.4rem + 4rem))
    }
    html.ios.statusExpension .container-component.view-center .section-component {
        height: calc(100% - (16.2rem + 4.4rem + 4rem))
    }
    html.ios.statusExpension .section-component.alarm-nodata {
        height: calc(100vh - (5rem + 4.4rem + 4rem))
    }
    html.ios.statusExpension .container-component.today-coupon.h-center .section-component {
        height: calc(100% - (20.2rem + 4.4rem + 4rem))
    }
    html.ios.statusExpension .section-component.stars-type2 {
        padding-top: calc(4.8rem + 4.4rem);
        padding-bottom: calc(8rem + 4rem)
    }
    html.ios.statusExpension .page-inner-scroll.scrolling .component-card-sticky {
        top: calc(4.4rem + 5rem)
    }
    body.ios .content-savings.expired {
        height: calc(4.4rem + 53.9rem)
    }
    body.ios .content-savings.expired {
        height: calc(4.4rem + 53.9rem)
    }
    body.ios .content-savings {
        height: calc(4.4rem + 44.8rem)
    }
    body.ios .content-savings .img-area {
        top: 4.4rem
    }
    body.ios .content-savings .prodname-info {
        top: calc(4.4rem + 30.8rem)
    }
    body.ios .content-savings .kds-banner-card {
        top: calc(4.4rem + 42.1rem)
    }
    body.ios .savings-scroll .component-header::before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 4.4rem;
        background: var(--bg-pri-base)
    }
    body.ios .savings-scroll .component-fixed-bottom {
        min-height: calc(100vh - 5rem - 4.4rem - 4rem)
    }
    body.ios .container-component.ai-quiz.h-center .section-component {
        height: calc(100% - (16.2rem + 4.4rem + 4rem))
    }
    body.ios .container-component.view-center .section-component {
        height: calc(100% - (16.2rem + 4.4rem + 4rem))
    }
    body.ios .section-component.alarm-nodata {
        height: calc(100vh - (5rem + 4.4rem + 4rem))
    }
    body.ios .container-component.today-coupon.h-center .section-component {
        height: calc(100% - (20.2rem + 4.4rem + 4rem))
    }
    body.ios .section-component.stars-type2 {
        padding-top: calc(4.8rem + 4.4rem);
        padding-bottom: calc(8rem + 4rem)
    }
    body.ios .page-inner-scroll.scrolling .component-card-sticky {
        top: calc(4.4rem + 5rem)
    }
}

/*! iPhone 14 Pro, 15, 15 Pro */

@media only screen and (device-width: 393px) and (device-height: 852px) and (-webkit-device-pixel-ratio: 3) {
    /*! mixin :공통 - 헤더영역 */
    html.ios.statusExpension .component-header {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .popup-header .component-header {
        padding-top: 0
    }
    /*! 홈 - 일반 */
    html.ios.statusExpension .home-default .main-container-component.bg-main {
        padding-top: calc(4.4rem + 5.6rem)
    }
    /*! 홈 - 추천 */
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"].scrolling .component-tab.sticky-tab {
        top: calc(4.4rem + 0.2rem)
    }
    /*! 홈 - 혜택 */
    html.ios.statusExpension .page-inner-scroll.scrolling .component-tab.sticky-tab02 .tab-round-group {
        top: calc(4.4rem + 5rem)
    }
    /*! 홈 - 타임라인 */
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"].scrolling .component-form-date {
        top: calc(4.4rem + 5rem + 0.2rem)
    }
    /*! 홈 - 순서변경 */
    html.ios.statusExpension .page-inner-scroll.scrolling .component-text-simple.fixed-top {
        top: calc(4.4rem + 0.9rem)
    }
    /*! 공통 - 풀팝업일때 */
    html.ios.statusExpension .popup-dialog.ui-full .popup-group,
    html.ios.statusExpension .popup-dialog.ui-full-change .popup-group,
    html.ios.statusExpension .popup-dialog.ui-full-change.plus-box-event-pop .popup-group {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group:after {
        content: '';
        height: 4.4rem;
        background-color: var(--color-w100, #fff);
        position: fixed;
        top: 0;
        left: 0;
        width: 100%
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group:after {
        display: none
    }
    html.ios.statusExpension .popup-dialog.ui-full-change.plus-box-event-pop .interest-group-top .ani-step1-1 {
        margin-top: 8.2rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.shopping:after {
        background: var(--color-in700)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.shopping.bg-white:after {
        background-color: var(--color-w100, #fff)
    }
    /*! 홈 개편 */
    html.ios.statusExpension .component-header.main {
        padding-top: calc(4.4rem + 0.6rem)
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh.pull-home {
        padding-top: 0;
        margin-top: 4.4rem
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: 0.6rem
    }
    html.ios.statusExpension .scrolling .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: calc(4.4rem + 0.6rem)
    }
    html.ios.statusExpension .component-tab.foru-tab-ver.scrollOn .tab-group.foru-type {
        top: calc(4.4rem)
    }
    html.ios.statusExpension .component-header.main+.component-tab.foru-tab-ver {
        top: calc(4.4rem + 5.6rem)
    }
    html.ios.statusExpension .component-main-bnf-tab {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .invest-home .tab-list-group.sticky-invest {
        top: calc(4.4rem + 5.6rem)
    }
    html.ios.statusExpension .component-ceo-calendar {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .component-ceo-my-account.type2 {
        padding-top: calc(4.4rem + 37rem)
    }
    html.ios.statusExpension .container-component-coach .coach-item01 {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .component-header.search {
        padding-top: calc(4.4rem + 1.2rem);
        height: auto
    }
    html.ios.statusExpension .component-header.search.search-result {
        height: calc(4.4rem + 10.5rem)
    }
    html.ios.statusExpension .popup-inner .component-header.search.search-result {
        height: 10.5rem
    }
    html.ios.statusExpension .popup-inner .component-header.search.sticky {
        top: 4.4rem;
        padding-top: 1.2rem
    }
    html.ios.statusExpension .section-component.alarm .component-keyword {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .section-component.alarm .component-form-date {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .section-component.alarm.alarm-filter .component-form-date {
        top: calc(4.4rem + 10.6rem)
    }
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"] .component-main-refresh {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: 2.2rem
    }
    html.ios.statusExpension .safe-camp-kv .safe-camp-inner {
        margin-top: 4.4rem
    }
    /*! mixin :공통 - 헤더영역 */
    body.ios .component-header {
        padding-top: 4.4rem
    }
    body.ios .popup-header .component-header {
        padding-top: 0
    }
    /*! 홈 - 일반 */
    body.ios .home-default .main-container-component.bg-main {
        padding-top: calc(4.4rem + 5.6rem)
    }
    /*! 홈 - 추천 */
    body.ios .main-tab-container [class^="main-tab-content0"].scrolling .component-tab.sticky-tab {
        top: calc(4.4rem + 0.2rem)
    }
    /*! 홈 - 혜택 */
    body.ios .page-inner-scroll.scrolling .component-tab.sticky-tab02 .tab-round-group {
        top: calc(4.4rem + 5rem)
    }
    /*! 홈 - 타임라인 */
    body.ios .main-tab-container [class^="main-tab-content0"].scrolling .component-form-date {
        top: calc(4.4rem + 5rem + 0.2rem)
    }
    /*! 홈 - 순서변경 */
    body.ios .page-inner-scroll.scrolling .component-text-simple.fixed-top {
        top: calc(4.4rem + 0.9rem)
    }
    /*! 공통 - 풀팝업일때 */
    body.ios .popup-dialog.ui-full .popup-group,
    body.ios .popup-dialog.ui-full-change .popup-group,
    body.ios .popup-dialog.ui-full-change.plus-box-event-pop .popup-group {
        padding-top: 4.4rem
    }
    body.ios .popup-dialog.ui-full .popup-group:after {
        content: '';
        height: 4.4rem;
        background-color: var(--color-w100, #fff);
        position: fixed;
        top: 0;
        left: 0;
        width: 100%
    }
    body.ios .popup-dialog.ui-full .popup-group.popup-inandout-group:after {
        display: none
    }
    body.ios .popup-dialog.ui-full-change.plus-box-event-pop .interest-group-top .ani-step1-1 {
        margin-top: 8.2rem
    }
    body.ios .popup-dialog.ui-full .popup-group.shopping:after {
        background: var(--color-in700)
    }
    body.ios .popup-dialog.ui-full .popup-group.shopping.bg-white:after {
        background-color: var(--color-w100, #fff)
    }
    /*! 홈 개편 */
    body.ios .component-header.main {
        padding-top: calc(4.4rem + 0.6rem)
    }
    body.ios .ptr--ptr.ptr--refresh {
        padding-top: 4.4rem
    }
    body.ios .ptr--ptr.ptr--refresh.pull-home {
        padding-top: 0;
        margin-top: 4.4rem
    }
    body.ios .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: 0.6rem
    }
    body.ios .scrolling .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: calc(4.4rem + 0.6rem)
    }
    body.ios .component-tab.foru-tab-ver.scrollOn .tab-group.foru-type {
        top: calc(4.4rem)
    }
    body.ios .component-header.main+.component-tab.foru-tab-ver {
        top: calc(4.4rem + 5.6rem)
    }
    body.ios .component-main-bnf-tab {
        top: calc(4.4rem + 5rem)
    }
    body.ios .invest-home .tab-list-group.sticky-invest {
        top: calc(4.4rem + 5.6rem)
    }
    body.ios .component-ceo-calendar {
        top: calc(4.4rem + 5rem)
    }
    body.ios .component-ceo-my-account.type2 {
        padding-top: calc(4.4rem + 37rem)
    }
    body.ios .container-component-coach .coach-item01 {
        padding-top: 4.4rem
    }
    body.ios .component-header.search {
        padding-top: calc(4.4rem + 1.2rem);
        height: auto
    }
    body.ios .component-header.search.search-result {
        height: calc(4.4rem + 10.5rem)
    }
    body.ios .popup-inner .component-header.search.search-result {
        height: 10.5rem
    }
    body.ios .popup-inner .component-header.search.sticky {
        top: 4.4rem;
        padding-top: 1.2rem
    }
    body.ios .section-component.alarm .component-keyword {
        top: calc(4.4rem + 5rem)
    }
    body.ios .section-component.alarm .component-form-date {
        top: calc(4.4rem + 5rem)
    }
    body.ios .section-component.alarm.alarm-filter .component-form-date {
        top: calc(4.4rem + 10.6rem)
    }
    body.ios .main-tab-container [class^="main-tab-content0"] .component-main-refresh {
        top: calc(5rem + 4.4rem)
    }
    body.ios .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: 2.2rem
    }
    body.ios .safe-camp-kv .safe-camp-inner {
        margin-top: 4.4rem
    }
    /*! mixin :공통 - 헤더영역 */
    /*! 검색 - 공통 */
    html.ios.statusExpension .component-list.fixed,
    html.ios.statusExpension .component-search[class*="fixed"] {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .component-gathering-selected.active {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .component-gathering-selected.active+.component-search {
        top: calc(4.4rem + 16.2rem)
    }
    /*! 모임통장 - 모임홈 */
    html.ios.statusExpension .component-meet-profile {
        margin-top: -4.4rem
    }
    html.ios.statusExpension .component-meethome-profile {
        margin-top: calc(-5rem - 4.4rem)
    }
    /*! 상단 tab 고정 */
    html.ios.statusExpension .component-tab.food-cate-sticky,
    html.ios.statusExpension .component-text-simple+.component-tab.sticky,
    html.ios.statusExpension .section-component .component-tab.sticky,
    html.ios.statusExpension .section-component.living-price-tab .component-tab.sticky {
        top: calc(4.4rem + 5rem)
    }
    /*! 이체 */
    html.ios.statusExpension .component-header+.component-keypad {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .section-component-sticky {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .fixed-msg-card,
    html.ios.statusExpension .section-flex-colume {
        height: calc(100vh - calc(4.4rem + 5rem))
    }
    html.ios.statusExpension .section-flex-colume.type3 {
        height: calc(100vh - calc(4.4rem + 11rem))
    }
    html.ios.statusExpension .section-flex-colume.type4 {
        height: calc(100vh - calc(4.4rem + 19.4rem))
    }
    html.ios.statusExpension .component-card-sum-top.type2[class*="fixed"] {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .dim-moneytree-wrap {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .toast-wrap.ceo-type {
        bottom: auto;
        top: calc(4.4rem + 9.4rem)
    }
    html.ios.statusExpension .component-tab.sticky+.article-component .component-search[class*="fixed"] {
        top: calc(4.4rem + 11rem)
    }
    html.ios.statusExpension .container-component.shopping .component-text.sticky {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .container-component.shopping .component-text.sticky+.component-tab .tab-list-group.sticky {
        top: calc(4.4rem + 9rem)
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach.active {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: calc(4.4rem + 8.6rem)
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach .coach-close {
        padding-top: 0
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .inandout-calendar-inner {
        top: 4.4rem
    }
    html.ios.statusExpension .inandout-tab-wrap {
        top: calc(5.5rem + 4.4rem)
    }
    html.ios.statusExpension .section-component.custom-policy .component-tab.sticky-chip {
        top: calc(4.4rem + 11rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group.popup-inandout-pre-group {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .popup-inandout-group.pre-event .container-component-coach {
        top: 4.4rem
    }
    html.ios.statusExpension .ailive-today-quiz {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .tab-list-group[data-sticky-item] {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .container-component.ai-quiz .section-component.type2 {
        margin-top: calc(-5rem - 4.4rem);
        padding-top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .container-component.ai-quiz .section-component.type4 {
        margin-top: calc(-5rem - 4.4rem);
        padding-top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .fortune2025 .component-iframe {
        height: calc(100vh - (14.4rem + 4.4rem))
    }
    html.ios.statusExpension .container-component.common-cert.h-center .section-component.cert-section {
        min-height: calc(100vh - 24rem)
    }
    html.ios.statusExpension .section-component.stars-type1 {
        height: calc(100vh - (5rem + 4.4rem))
    }
    html.ios.statusExpension .section-component.mission-top {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .section-component.mission-rolling {
        top: calc(23.8rem + 4.4rem)
    }
    html.ios.statusExpension .page-inner-scroll.money-mission.first-lock-entry.scroll-top .section-component.mission-rolling {
        top: calc(24.3rem + 4.4rem)
    }
    html.ios.statusExpension .container-component.container-fixed {
        padding-top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .page-inner-scroll.no-overscroll-y .container-component {
        padding-top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.mission-talisman:after {
        background-color: transparent
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.coin-full-wrap:after {
        background-color: transparent
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.transparent:after {
        background-color: transparent
    }
    html.ios.statusExpension .component-invest-calendar {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .page-inner-scroll.scrolling .component-tab.financial-scam {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .component-tab.sticky-logotab {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .tooltip-focus-group .tooltip-area.align-bottom.digit-signature {
        top: calc(2.2rem + 4.4rem)
    }
    html.ios.statusExpension .weekly-invest-main-bg {
        margin-top: calc(var(--header-height) * -1 - 4.4rem);
        height: calc(var(--weekly-invest-height) + 4.4rem)
    }
    html.ios.statusExpension .weekly-invest-main .extra-cash,
    html.ios.statusExpension .weekly-invest-main .gauge,
    html.ios.statusExpension .weekly-invest-main-inner {
        margin-top: 4.4rem
    }
    /*! mixin :공통 - 헤더영역 */
    /*! 검색 - 공통 */
    body.ios .component-list.fixed,
    body.ios .component-search[class*="fixed"] {
        top: calc(4.4rem + 5rem)
    }
    body.ios .component-gathering-selected.active {
        top: calc(4.4rem + 5rem)
    }
    body.ios .component-gathering-selected.active+.component-search {
        top: calc(4.4rem + 16.2rem)
    }
    /*! 모임통장 - 모임홈 */
    body.ios .component-meet-profile {
        margin-top: -4.4rem
    }
    body.ios .component-meethome-profile {
        margin-top: calc(-5rem - 4.4rem)
    }
    /*! 상단 tab 고정 */
    body.ios .component-tab.food-cate-sticky,
    body.ios .component-text-simple+.component-tab.sticky,
    body.ios .section-component .component-tab.sticky,
    body.ios .section-component.living-price-tab .component-tab.sticky {
        top: calc(4.4rem + 5rem)
    }
    /*! 이체 */
    body.ios .component-header+.component-keypad {
        padding-top: 4.4rem
    }
    body.ios .section-component-sticky {
        top: calc(4.4rem + 5rem)
    }
    body.ios .fixed-msg-card,
    body.ios .section-flex-colume {
        height: calc(100vh - calc(4.4rem + 5rem))
    }
    body.ios .section-flex-colume.type3 {
        height: calc(100vh - calc(4.4rem + 11rem))
    }
    body.ios .section-flex-colume.type4 {
        height: calc(100vh - calc(4.4rem + 19.4rem))
    }
    body.ios .component-card-sum-top.type2[class*="fixed"] {
        top: calc(4.4rem + 5rem)
    }
    body.ios .dim-moneytree-wrap {
        top: calc(4.4rem + 5rem)
    }
    body.ios .toast-wrap.ceo-type {
        bottom: auto;
        top: calc(4.4rem + 9.4rem)
    }
    body.ios .component-tab.sticky+.article-component .component-search[class*="fixed"] {
        top: calc(4.4rem + 11rem)
    }
    body.ios .container-component.shopping .component-text.sticky {
        top: calc(4.4rem + 5rem)
    }
    body.ios .container-component.shopping .component-text.sticky+.component-tab .tab-list-group.sticky {
        top: calc(4.4rem + 9rem)
    }
    body.ios .page-inner-scroll.inandout-scroll .container-component-coach {
        padding-top: 4.4rem
    }
    body.ios .page-inner-scroll.inandout-scroll .container-component-coach.active {
        padding-top: 4.4rem
    }
    body.ios .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: calc(4.4rem + 8.6rem)
    }
    body.ios .page-inner-scroll.inandout-scroll .container-component-coach .coach-close {
        padding-top: 0
    }
    body.ios .page-inner-scroll.inandout-scroll .inandout-calendar-inner {
        top: 4.4rem
    }
    body.ios .inandout-tab-wrap {
        top: calc(5.5rem + 4.4rem)
    }
    body.ios .section-component.custom-policy .component-tab.sticky-chip {
        top: calc(4.4rem + 11rem)
    }
    body.ios .popup-dialog.ui-full .popup-group.popup-inandout-group.popup-inandout-pre-group {
        padding-top: 4.4rem
    }
    body.ios .popup-inandout-group.pre-event .container-component-coach {
        top: 4.4rem
    }
    body.ios .ailive-today-quiz {
        padding-top: 4.4rem
    }
    body.ios .tab-list-group[data-sticky-item] {
        top: calc(4.4rem + 5rem)
    }
    body.ios .container-component.ai-quiz .section-component.type2 {
        margin-top: calc(-5rem - 4.4rem);
        padding-top: calc(5rem + 4.4rem)
    }
    body.ios .container-component.ai-quiz .section-component.type4 {
        margin-top: calc(-5rem - 4.4rem);
        padding-top: calc(5rem + 4.4rem)
    }
    body.ios .fortune2025 .component-iframe {
        height: calc(100vh - (14.4rem + 4.4rem))
    }
    body.ios .container-component.common-cert.h-center .section-component.cert-section {
        min-height: calc(100vh - 24rem)
    }
    body.ios .section-component.stars-type1 {
        height: calc(100vh - (5rem + 4.4rem))
    }
    body.ios .section-component.mission-top {
        top: calc(5rem + 4.4rem)
    }
    body.ios .section-component.mission-rolling {
        top: calc(23.8rem + 4.4rem)
    }
    body.ios .page-inner-scroll.money-mission.first-lock-entry.scroll-top .section-component.mission-rolling {
        top: calc(24.3rem + 4.4rem)
    }
    body.ios .container-component.container-fixed {
        padding-top: calc(5rem + 4.4rem)
    }
    body.ios .page-inner-scroll.no-overscroll-y .container-component {
        padding-top: calc(5rem + 4.4rem)
    }
    body.ios .popup-dialog.ui-full .popup-group.mission-talisman:after {
        background-color: transparent
    }
    body.ios .popup-dialog.ui-full .popup-group.coin-full-wrap:after {
        background-color: transparent
    }
    body.ios .popup-dialog.ui-full .popup-group.transparent:after {
        background-color: transparent
    }
    body.ios .component-invest-calendar {
        top: calc(5rem + 4.4rem)
    }
    body.ios .page-inner-scroll.scrolling .component-tab.financial-scam {
        top: calc(5rem + 4.4rem)
    }
    body.ios .component-tab.sticky-logotab {
        top: calc(5rem + 4.4rem)
    }
    body.ios .tooltip-focus-group .tooltip-area.align-bottom.digit-signature {
        top: calc(2.2rem + 4.4rem)
    }
    body.ios .weekly-invest-main-bg {
        margin-top: calc(var(--header-height) * -1 - 4.4rem);
        height: calc(var(--weekly-invest-height) + 4.4rem)
    }
    body.ios .weekly-invest-main .extra-cash,
    body.ios .weekly-invest-main .gauge,
    body.ios .weekly-invest-main-inner {
        margin-top: 4.4rem
    }
    html.ios.statusExpension .content-savings.expired {
        height: calc(4.4rem + 53.9rem)
    }
    html.ios.statusExpension .content-savings.expired {
        height: calc(4.4rem + 53.9rem)
    }
    html.ios.statusExpension .content-savings {
        height: calc(4.4rem + 44.8rem)
    }
    html.ios.statusExpension .content-savings .img-area {
        top: 4.4rem
    }
    html.ios.statusExpension .content-savings .prodname-info {
        top: calc(4.4rem + 30.8rem)
    }
    html.ios.statusExpension .content-savings .kds-banner-card {
        top: calc(4.4rem + 42.1rem)
    }
    html.ios.statusExpension .savings-scroll .component-header::before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 4.4rem;
        background: var(--bg-pri-base)
    }
    html.ios.statusExpension .savings-scroll .component-fixed-bottom {
        min-height: calc(100vh - 5rem - 4.4rem - 4rem)
    }
    html.ios.statusExpension .container-component.ai-quiz.h-center .section-component {
        height: calc(100% - (16.2rem + 4.4rem + 4rem))
    }
    html.ios.statusExpension .container-component.view-center .section-component {
        height: calc(100% - (16.2rem + 4.4rem + 4rem))
    }
    html.ios.statusExpension .section-component.alarm-nodata {
        height: calc(100vh - (5rem + 4.4rem + 4rem))
    }
    html.ios.statusExpension .container-component.today-coupon.h-center .section-component {
        height: calc(100% - (20.2rem + 4.4rem + 4rem))
    }
    html.ios.statusExpension .section-component.stars-type2 {
        padding-top: calc(4.8rem + 4.4rem);
        padding-bottom: calc(8rem + 4rem)
    }
    html.ios.statusExpension .page-inner-scroll.scrolling .component-card-sticky {
        top: calc(4.4rem + 5rem)
    }
    body.ios .content-savings.expired {
        height: calc(4.4rem + 53.9rem)
    }
    body.ios .content-savings.expired {
        height: calc(4.4rem + 53.9rem)
    }
    body.ios .content-savings {
        height: calc(4.4rem + 44.8rem)
    }
    body.ios .content-savings .img-area {
        top: 4.4rem
    }
    body.ios .content-savings .prodname-info {
        top: calc(4.4rem + 30.8rem)
    }
    body.ios .content-savings .kds-banner-card {
        top: calc(4.4rem + 42.1rem)
    }
    body.ios .savings-scroll .component-header::before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 4.4rem;
        background: var(--bg-pri-base)
    }
    body.ios .savings-scroll .component-fixed-bottom {
        min-height: calc(100vh - 5rem - 4.4rem - 4rem)
    }
    body.ios .container-component.ai-quiz.h-center .section-component {
        height: calc(100% - (16.2rem + 4.4rem + 4rem))
    }
    body.ios .container-component.view-center .section-component {
        height: calc(100% - (16.2rem + 4.4rem + 4rem))
    }
    body.ios .section-component.alarm-nodata {
        height: calc(100vh - (5rem + 4.4rem + 4rem))
    }
    body.ios .container-component.today-coupon.h-center .section-component {
        height: calc(100% - (20.2rem + 4.4rem + 4rem))
    }
    body.ios .section-component.stars-type2 {
        padding-top: calc(4.8rem + 4.4rem);
        padding-bottom: calc(8rem + 4rem)
    }
    body.ios .page-inner-scroll.scrolling .component-card-sticky {
        top: calc(4.4rem + 5rem)
    }
}

/*! iPhone 16 Pro */

@media only screen and (device-width: 402px) and (device-height: 874px) and (-webkit-device-pixel-ratio: 3) {
    /*! mixin :공통 - 헤더영역 */
    html.ios.statusExpension .component-header {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .popup-header .component-header {
        padding-top: 0
    }
    /*! 홈 - 일반 */
    html.ios.statusExpension .home-default .main-container-component.bg-main {
        padding-top: calc(4.4rem + 5.6rem)
    }
    /*! 홈 - 추천 */
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"].scrolling .component-tab.sticky-tab {
        top: calc(4.4rem + 0.2rem)
    }
    /*! 홈 - 혜택 */
    html.ios.statusExpension .page-inner-scroll.scrolling .component-tab.sticky-tab02 .tab-round-group {
        top: calc(4.4rem + 5rem)
    }
    /*! 홈 - 타임라인 */
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"].scrolling .component-form-date {
        top: calc(4.4rem + 5rem + 0.2rem)
    }
    /*! 홈 - 순서변경 */
    html.ios.statusExpension .page-inner-scroll.scrolling .component-text-simple.fixed-top {
        top: calc(4.4rem + 0.9rem)
    }
    /*! 공통 - 풀팝업일때 */
    html.ios.statusExpension .popup-dialog.ui-full .popup-group,
    html.ios.statusExpension .popup-dialog.ui-full-change .popup-group,
    html.ios.statusExpension .popup-dialog.ui-full-change.plus-box-event-pop .popup-group {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group:after {
        content: '';
        height: 4.4rem;
        background-color: var(--color-w100, #fff);
        position: fixed;
        top: 0;
        left: 0;
        width: 100%
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group:after {
        display: none
    }
    html.ios.statusExpension .popup-dialog.ui-full-change.plus-box-event-pop .interest-group-top .ani-step1-1 {
        margin-top: 8.2rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.shopping:after {
        background: var(--color-in700)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.shopping.bg-white:after {
        background-color: var(--color-w100, #fff)
    }
    /*! 홈 개편 */
    html.ios.statusExpension .component-header.main {
        padding-top: calc(4.4rem + 0.6rem)
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh.pull-home {
        padding-top: 0;
        margin-top: 4.4rem
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: 0.6rem
    }
    html.ios.statusExpension .scrolling .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: calc(4.4rem + 0.6rem)
    }
    html.ios.statusExpension .component-tab.foru-tab-ver.scrollOn .tab-group.foru-type {
        top: calc(4.4rem)
    }
    html.ios.statusExpension .component-header.main+.component-tab.foru-tab-ver {
        top: calc(4.4rem + 5.6rem)
    }
    html.ios.statusExpension .component-main-bnf-tab {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .invest-home .tab-list-group.sticky-invest {
        top: calc(4.4rem + 5.6rem)
    }
    html.ios.statusExpension .component-ceo-calendar {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .component-ceo-my-account.type2 {
        padding-top: calc(4.4rem + 37rem)
    }
    html.ios.statusExpension .container-component-coach .coach-item01 {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .component-header.search {
        padding-top: calc(4.4rem + 1.2rem);
        height: auto
    }
    html.ios.statusExpension .component-header.search.search-result {
        height: calc(4.4rem + 10.5rem)
    }
    html.ios.statusExpension .popup-inner .component-header.search.search-result {
        height: 10.5rem
    }
    html.ios.statusExpension .popup-inner .component-header.search.sticky {
        top: 4.4rem;
        padding-top: 1.2rem
    }
    html.ios.statusExpension .section-component.alarm .component-keyword {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .section-component.alarm .component-form-date {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .section-component.alarm.alarm-filter .component-form-date {
        top: calc(4.4rem + 10.6rem)
    }
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"] .component-main-refresh {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: 2.2rem
    }
    html.ios.statusExpension .safe-camp-kv .safe-camp-inner {
        margin-top: 4.4rem
    }
    /*! mixin :공통 - 헤더영역 */
    body.ios .component-header {
        padding-top: 4.4rem
    }
    body.ios .popup-header .component-header {
        padding-top: 0
    }
    /*! 홈 - 일반 */
    body.ios .home-default .main-container-component.bg-main {
        padding-top: calc(4.4rem + 5.6rem)
    }
    /*! 홈 - 추천 */
    body.ios .main-tab-container [class^="main-tab-content0"].scrolling .component-tab.sticky-tab {
        top: calc(4.4rem + 0.2rem)
    }
    /*! 홈 - 혜택 */
    body.ios .page-inner-scroll.scrolling .component-tab.sticky-tab02 .tab-round-group {
        top: calc(4.4rem + 5rem)
    }
    /*! 홈 - 타임라인 */
    body.ios .main-tab-container [class^="main-tab-content0"].scrolling .component-form-date {
        top: calc(4.4rem + 5rem + 0.2rem)
    }
    /*! 홈 - 순서변경 */
    body.ios .page-inner-scroll.scrolling .component-text-simple.fixed-top {
        top: calc(4.4rem + 0.9rem)
    }
    /*! 공통 - 풀팝업일때 */
    body.ios .popup-dialog.ui-full .popup-group,
    body.ios .popup-dialog.ui-full-change .popup-group,
    body.ios .popup-dialog.ui-full-change.plus-box-event-pop .popup-group {
        padding-top: 4.4rem
    }
    body.ios .popup-dialog.ui-full .popup-group:after {
        content: '';
        height: 4.4rem;
        background-color: var(--color-w100, #fff);
        position: fixed;
        top: 0;
        left: 0;
        width: 100%
    }
    body.ios .popup-dialog.ui-full .popup-group.popup-inandout-group:after {
        display: none
    }
    body.ios .popup-dialog.ui-full-change.plus-box-event-pop .interest-group-top .ani-step1-1 {
        margin-top: 8.2rem
    }
    body.ios .popup-dialog.ui-full .popup-group.shopping:after {
        background: var(--color-in700)
    }
    body.ios .popup-dialog.ui-full .popup-group.shopping.bg-white:after {
        background-color: var(--color-w100, #fff)
    }
    /*! 홈 개편 */
    body.ios .component-header.main {
        padding-top: calc(4.4rem + 0.6rem)
    }
    body.ios .ptr--ptr.ptr--refresh {
        padding-top: 4.4rem
    }
    body.ios .ptr--ptr.ptr--refresh.pull-home {
        padding-top: 0;
        margin-top: 4.4rem
    }
    body.ios .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: 0.6rem
    }
    body.ios .scrolling .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: calc(4.4rem + 0.6rem)
    }
    body.ios .component-tab.foru-tab-ver.scrollOn .tab-group.foru-type {
        top: calc(4.4rem)
    }
    body.ios .component-header.main+.component-tab.foru-tab-ver {
        top: calc(4.4rem + 5.6rem)
    }
    body.ios .component-main-bnf-tab {
        top: calc(4.4rem + 5rem)
    }
    body.ios .invest-home .tab-list-group.sticky-invest {
        top: calc(4.4rem + 5.6rem)
    }
    body.ios .component-ceo-calendar {
        top: calc(4.4rem + 5rem)
    }
    body.ios .component-ceo-my-account.type2 {
        padding-top: calc(4.4rem + 37rem)
    }
    body.ios .container-component-coach .coach-item01 {
        padding-top: 4.4rem
    }
    body.ios .component-header.search {
        padding-top: calc(4.4rem + 1.2rem);
        height: auto
    }
    body.ios .component-header.search.search-result {
        height: calc(4.4rem + 10.5rem)
    }
    body.ios .popup-inner .component-header.search.search-result {
        height: 10.5rem
    }
    body.ios .popup-inner .component-header.search.sticky {
        top: 4.4rem;
        padding-top: 1.2rem
    }
    body.ios .section-component.alarm .component-keyword {
        top: calc(4.4rem + 5rem)
    }
    body.ios .section-component.alarm .component-form-date {
        top: calc(4.4rem + 5rem)
    }
    body.ios .section-component.alarm.alarm-filter .component-form-date {
        top: calc(4.4rem + 10.6rem)
    }
    body.ios .main-tab-container [class^="main-tab-content0"] .component-main-refresh {
        top: calc(5rem + 4.4rem)
    }
    body.ios .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: 2.2rem
    }
    body.ios .safe-camp-kv .safe-camp-inner {
        margin-top: 4.4rem
    }
    /*! mixin :공통 - 헤더영역 */
    /*! 검색 - 공통 */
    html.ios.statusExpension .component-list.fixed,
    html.ios.statusExpension .component-search[class*="fixed"] {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .component-gathering-selected.active {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .component-gathering-selected.active+.component-search {
        top: calc(4.4rem + 16.2rem)
    }
    /*! 모임통장 - 모임홈 */
    html.ios.statusExpension .component-meet-profile {
        margin-top: -4.4rem
    }
    html.ios.statusExpension .component-meethome-profile {
        margin-top: calc(-5rem - 4.4rem)
    }
    /*! 상단 tab 고정 */
    html.ios.statusExpension .component-tab.food-cate-sticky,
    html.ios.statusExpension .component-text-simple+.component-tab.sticky,
    html.ios.statusExpension .section-component .component-tab.sticky,
    html.ios.statusExpension .section-component.living-price-tab .component-tab.sticky {
        top: calc(4.4rem + 5rem)
    }
    /*! 이체 */
    html.ios.statusExpension .component-header+.component-keypad {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .section-component-sticky {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .fixed-msg-card,
    html.ios.statusExpension .section-flex-colume {
        height: calc(100vh - calc(4.4rem + 5rem))
    }
    html.ios.statusExpension .section-flex-colume.type3 {
        height: calc(100vh - calc(4.4rem + 11rem))
    }
    html.ios.statusExpension .section-flex-colume.type4 {
        height: calc(100vh - calc(4.4rem + 19.4rem))
    }
    html.ios.statusExpension .component-card-sum-top.type2[class*="fixed"] {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .dim-moneytree-wrap {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .toast-wrap.ceo-type {
        bottom: auto;
        top: calc(4.4rem + 9.4rem)
    }
    html.ios.statusExpension .component-tab.sticky+.article-component .component-search[class*="fixed"] {
        top: calc(4.4rem + 11rem)
    }
    html.ios.statusExpension .container-component.shopping .component-text.sticky {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .container-component.shopping .component-text.sticky+.component-tab .tab-list-group.sticky {
        top: calc(4.4rem + 9rem)
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach.active {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: calc(4.4rem + 8.6rem)
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach .coach-close {
        padding-top: 0
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .inandout-calendar-inner {
        top: 4.4rem
    }
    html.ios.statusExpension .inandout-tab-wrap {
        top: calc(5.5rem + 4.4rem)
    }
    html.ios.statusExpension .section-component.custom-policy .component-tab.sticky-chip {
        top: calc(4.4rem + 11rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group.popup-inandout-pre-group {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .popup-inandout-group.pre-event .container-component-coach {
        top: 4.4rem
    }
    html.ios.statusExpension .ailive-today-quiz {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .tab-list-group[data-sticky-item] {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .container-component.ai-quiz .section-component.type2 {
        margin-top: calc(-5rem - 4.4rem);
        padding-top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .container-component.ai-quiz .section-component.type4 {
        margin-top: calc(-5rem - 4.4rem);
        padding-top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .fortune2025 .component-iframe {
        height: calc(100vh - (14.4rem + 4.4rem))
    }
    html.ios.statusExpension .container-component.common-cert.h-center .section-component.cert-section {
        min-height: calc(100vh - 24rem)
    }
    html.ios.statusExpension .section-component.stars-type1 {
        height: calc(100vh - (5rem + 4.4rem))
    }
    html.ios.statusExpension .section-component.mission-top {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .section-component.mission-rolling {
        top: calc(23.8rem + 4.4rem)
    }
    html.ios.statusExpension .page-inner-scroll.money-mission.first-lock-entry.scroll-top .section-component.mission-rolling {
        top: calc(24.3rem + 4.4rem)
    }
    html.ios.statusExpension .container-component.container-fixed {
        padding-top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .page-inner-scroll.no-overscroll-y .container-component {
        padding-top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.mission-talisman:after {
        background-color: transparent
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.coin-full-wrap:after {
        background-color: transparent
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.transparent:after {
        background-color: transparent
    }
    html.ios.statusExpension .component-invest-calendar {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .page-inner-scroll.scrolling .component-tab.financial-scam {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .component-tab.sticky-logotab {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .tooltip-focus-group .tooltip-area.align-bottom.digit-signature {
        top: calc(2.2rem + 4.4rem)
    }
    html.ios.statusExpension .weekly-invest-main-bg {
        margin-top: calc(var(--header-height) * -1 - 4.4rem);
        height: calc(var(--weekly-invest-height) + 4.4rem)
    }
    html.ios.statusExpension .weekly-invest-main .extra-cash,
    html.ios.statusExpension .weekly-invest-main .gauge,
    html.ios.statusExpension .weekly-invest-main-inner {
        margin-top: 4.4rem
    }
    /*! mixin :공통 - 헤더영역 */
    /*! 검색 - 공통 */
    body.ios .component-list.fixed,
    body.ios .component-search[class*="fixed"] {
        top: calc(4.4rem + 5rem)
    }
    body.ios .component-gathering-selected.active {
        top: calc(4.4rem + 5rem)
    }
    body.ios .component-gathering-selected.active+.component-search {
        top: calc(4.4rem + 16.2rem)
    }
    /*! 모임통장 - 모임홈 */
    body.ios .component-meet-profile {
        margin-top: -4.4rem
    }
    body.ios .component-meethome-profile {
        margin-top: calc(-5rem - 4.4rem)
    }
    /*! 상단 tab 고정 */
    body.ios .component-tab.food-cate-sticky,
    body.ios .component-text-simple+.component-tab.sticky,
    body.ios .section-component .component-tab.sticky,
    body.ios .section-component.living-price-tab .component-tab.sticky {
        top: calc(4.4rem + 5rem)
    }
    /*! 이체 */
    body.ios .component-header+.component-keypad {
        padding-top: 4.4rem
    }
    body.ios .section-component-sticky {
        top: calc(4.4rem + 5rem)
    }
    body.ios .fixed-msg-card,
    body.ios .section-flex-colume {
        height: calc(100vh - calc(4.4rem + 5rem))
    }
    body.ios .section-flex-colume.type3 {
        height: calc(100vh - calc(4.4rem + 11rem))
    }
    body.ios .section-flex-colume.type4 {
        height: calc(100vh - calc(4.4rem + 19.4rem))
    }
    body.ios .component-card-sum-top.type2[class*="fixed"] {
        top: calc(4.4rem + 5rem)
    }
    body.ios .dim-moneytree-wrap {
        top: calc(4.4rem + 5rem)
    }
    body.ios .toast-wrap.ceo-type {
        bottom: auto;
        top: calc(4.4rem + 9.4rem)
    }
    body.ios .component-tab.sticky+.article-component .component-search[class*="fixed"] {
        top: calc(4.4rem + 11rem)
    }
    body.ios .container-component.shopping .component-text.sticky {
        top: calc(4.4rem + 5rem)
    }
    body.ios .container-component.shopping .component-text.sticky+.component-tab .tab-list-group.sticky {
        top: calc(4.4rem + 9rem)
    }
    body.ios .page-inner-scroll.inandout-scroll .container-component-coach {
        padding-top: 4.4rem
    }
    body.ios .page-inner-scroll.inandout-scroll .container-component-coach.active {
        padding-top: 4.4rem
    }
    body.ios .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: calc(4.4rem + 8.6rem)
    }
    body.ios .page-inner-scroll.inandout-scroll .container-component-coach .coach-close {
        padding-top: 0
    }
    body.ios .page-inner-scroll.inandout-scroll .inandout-calendar-inner {
        top: 4.4rem
    }
    body.ios .inandout-tab-wrap {
        top: calc(5.5rem + 4.4rem)
    }
    body.ios .section-component.custom-policy .component-tab.sticky-chip {
        top: calc(4.4rem + 11rem)
    }
    body.ios .popup-dialog.ui-full .popup-group.popup-inandout-group.popup-inandout-pre-group {
        padding-top: 4.4rem
    }
    body.ios .popup-inandout-group.pre-event .container-component-coach {
        top: 4.4rem
    }
    body.ios .ailive-today-quiz {
        padding-top: 4.4rem
    }
    body.ios .tab-list-group[data-sticky-item] {
        top: calc(4.4rem + 5rem)
    }
    body.ios .container-component.ai-quiz .section-component.type2 {
        margin-top: calc(-5rem - 4.4rem);
        padding-top: calc(5rem + 4.4rem)
    }
    body.ios .container-component.ai-quiz .section-component.type4 {
        margin-top: calc(-5rem - 4.4rem);
        padding-top: calc(5rem + 4.4rem)
    }
    body.ios .fortune2025 .component-iframe {
        height: calc(100vh - (14.4rem + 4.4rem))
    }
    body.ios .container-component.common-cert.h-center .section-component.cert-section {
        min-height: calc(100vh - 24rem)
    }
    body.ios .section-component.stars-type1 {
        height: calc(100vh - (5rem + 4.4rem))
    }
    body.ios .section-component.mission-top {
        top: calc(5rem + 4.4rem)
    }
    body.ios .section-component.mission-rolling {
        top: calc(23.8rem + 4.4rem)
    }
    body.ios .page-inner-scroll.money-mission.first-lock-entry.scroll-top .section-component.mission-rolling {
        top: calc(24.3rem + 4.4rem)
    }
    body.ios .container-component.container-fixed {
        padding-top: calc(5rem + 4.4rem)
    }
    body.ios .page-inner-scroll.no-overscroll-y .container-component {
        padding-top: calc(5rem + 4.4rem)
    }
    body.ios .popup-dialog.ui-full .popup-group.mission-talisman:after {
        background-color: transparent
    }
    body.ios .popup-dialog.ui-full .popup-group.coin-full-wrap:after {
        background-color: transparent
    }
    body.ios .popup-dialog.ui-full .popup-group.transparent:after {
        background-color: transparent
    }
    body.ios .component-invest-calendar {
        top: calc(5rem + 4.4rem)
    }
    body.ios .page-inner-scroll.scrolling .component-tab.financial-scam {
        top: calc(5rem + 4.4rem)
    }
    body.ios .component-tab.sticky-logotab {
        top: calc(5rem + 4.4rem)
    }
    body.ios .tooltip-focus-group .tooltip-area.align-bottom.digit-signature {
        top: calc(2.2rem + 4.4rem)
    }
    body.ios .weekly-invest-main-bg {
        margin-top: calc(var(--header-height) * -1 - 4.4rem);
        height: calc(var(--weekly-invest-height) + 4.4rem)
    }
    body.ios .weekly-invest-main .extra-cash,
    body.ios .weekly-invest-main .gauge,
    body.ios .weekly-invest-main-inner {
        margin-top: 4.4rem
    }
    html.ios.statusExpension .content-savings.expired {
        height: calc(4.4rem + 53.9rem)
    }
    html.ios.statusExpension .content-savings.expired {
        height: calc(4.4rem + 53.9rem)
    }
    html.ios.statusExpension .content-savings {
        height: calc(4.4rem + 44.8rem)
    }
    html.ios.statusExpension .content-savings .img-area {
        top: 4.4rem
    }
    html.ios.statusExpension .content-savings .prodname-info {
        top: calc(4.4rem + 30.8rem)
    }
    html.ios.statusExpension .content-savings .kds-banner-card {
        top: calc(4.4rem + 42.1rem)
    }
    html.ios.statusExpension .savings-scroll .component-header::before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 4.4rem;
        background: var(--bg-pri-base)
    }
    html.ios.statusExpension .savings-scroll .component-fixed-bottom {
        min-height: calc(100vh - 5rem - 4.4rem - 4rem)
    }
    html.ios.statusExpension .container-component.ai-quiz.h-center .section-component {
        height: calc(100% - (16.2rem + 4.4rem + 4rem))
    }
    html.ios.statusExpension .container-component.view-center .section-component {
        height: calc(100% - (16.2rem + 4.4rem + 4rem))
    }
    html.ios.statusExpension .section-component.alarm-nodata {
        height: calc(100vh - (5rem + 4.4rem + 4rem))
    }
    html.ios.statusExpension .container-component.today-coupon.h-center .section-component {
        height: calc(100% - (20.2rem + 4.4rem + 4rem))
    }
    html.ios.statusExpension .section-component.stars-type2 {
        padding-top: calc(4.8rem + 4.4rem);
        padding-bottom: calc(8rem + 4rem)
    }
    html.ios.statusExpension .page-inner-scroll.scrolling .component-card-sticky {
        top: calc(4.4rem + 5rem)
    }
    body.ios .content-savings.expired {
        height: calc(4.4rem + 53.9rem)
    }
    body.ios .content-savings.expired {
        height: calc(4.4rem + 53.9rem)
    }
    body.ios .content-savings {
        height: calc(4.4rem + 44.8rem)
    }
    body.ios .content-savings .img-area {
        top: 4.4rem
    }
    body.ios .content-savings .prodname-info {
        top: calc(4.4rem + 30.8rem)
    }
    body.ios .content-savings .kds-banner-card {
        top: calc(4.4rem + 42.1rem)
    }
    body.ios .savings-scroll .component-header::before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 4.4rem;
        background: var(--bg-pri-base)
    }
    body.ios .savings-scroll .component-fixed-bottom {
        min-height: calc(100vh - 5rem - 4.4rem - 4rem)
    }
    body.ios .container-component.ai-quiz.h-center .section-component {
        height: calc(100% - (16.2rem + 4.4rem + 4rem))
    }
    body.ios .container-component.view-center .section-component {
        height: calc(100% - (16.2rem + 4.4rem + 4rem))
    }
    body.ios .section-component.alarm-nodata {
        height: calc(100vh - (5rem + 4.4rem + 4rem))
    }
    body.ios .container-component.today-coupon.h-center .section-component {
        height: calc(100% - (20.2rem + 4.4rem + 4rem))
    }
    body.ios .section-component.stars-type2 {
        padding-top: calc(4.8rem + 4.4rem);
        padding-bottom: calc(8rem + 4rem)
    }
    body.ios .page-inner-scroll.scrolling .component-card-sticky {
        top: calc(4.4rem + 5rem)
    }
}

/*! iPhone 11, Xr */

@media only screen and (device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 2) {
    /*! mixin :공통 - 헤더영역 */
    html.ios.statusExpension .component-header {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .popup-header .component-header {
        padding-top: 0
    }
    /*! 홈 - 일반 */
    html.ios.statusExpension .home-default .main-container-component.bg-main {
        padding-top: calc(4.4rem + 5.6rem)
    }
    /*! 홈 - 추천 */
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"].scrolling .component-tab.sticky-tab {
        top: calc(4.4rem + 0.2rem)
    }
    /*! 홈 - 혜택 */
    html.ios.statusExpension .page-inner-scroll.scrolling .component-tab.sticky-tab02 .tab-round-group {
        top: calc(4.4rem + 5rem)
    }
    /*! 홈 - 타임라인 */
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"].scrolling .component-form-date {
        top: calc(4.4rem + 5rem + 0.2rem)
    }
    /*! 홈 - 순서변경 */
    html.ios.statusExpension .page-inner-scroll.scrolling .component-text-simple.fixed-top {
        top: calc(4.4rem + 0.9rem)
    }
    /*! 공통 - 풀팝업일때 */
    html.ios.statusExpension .popup-dialog.ui-full .popup-group,
    html.ios.statusExpension .popup-dialog.ui-full-change .popup-group,
    html.ios.statusExpension .popup-dialog.ui-full-change.plus-box-event-pop .popup-group {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group:after {
        content: '';
        height: 4.4rem;
        background-color: var(--color-w100, #fff);
        position: fixed;
        top: 0;
        left: 0;
        width: 100%
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group:after {
        display: none
    }
    html.ios.statusExpension .popup-dialog.ui-full-change.plus-box-event-pop .interest-group-top .ani-step1-1 {
        margin-top: 8.2rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.shopping:after {
        background: var(--color-in700)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.shopping.bg-white:after {
        background-color: var(--color-w100, #fff)
    }
    /*! 홈 개편 */
    html.ios.statusExpension .component-header.main {
        padding-top: calc(4.4rem + 0.6rem)
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh.pull-home {
        padding-top: 0;
        margin-top: 4.4rem
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: 0.6rem
    }
    html.ios.statusExpension .scrolling .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: calc(4.4rem + 0.6rem)
    }
    html.ios.statusExpension .component-tab.foru-tab-ver.scrollOn .tab-group.foru-type {
        top: calc(4.4rem)
    }
    html.ios.statusExpension .component-header.main+.component-tab.foru-tab-ver {
        top: calc(4.4rem + 5.6rem)
    }
    html.ios.statusExpension .component-main-bnf-tab {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .invest-home .tab-list-group.sticky-invest {
        top: calc(4.4rem + 5.6rem)
    }
    html.ios.statusExpension .component-ceo-calendar {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .component-ceo-my-account.type2 {
        padding-top: calc(4.4rem + 37rem)
    }
    html.ios.statusExpension .container-component-coach .coach-item01 {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .component-header.search {
        padding-top: calc(4.4rem + 1.2rem);
        height: auto
    }
    html.ios.statusExpension .component-header.search.search-result {
        height: calc(4.4rem + 10.5rem)
    }
    html.ios.statusExpension .popup-inner .component-header.search.search-result {
        height: 10.5rem
    }
    html.ios.statusExpension .popup-inner .component-header.search.sticky {
        top: 4.4rem;
        padding-top: 1.2rem
    }
    html.ios.statusExpension .section-component.alarm .component-keyword {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .section-component.alarm .component-form-date {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .section-component.alarm.alarm-filter .component-form-date {
        top: calc(4.4rem + 10.6rem)
    }
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"] .component-main-refresh {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: 2.2rem
    }
    html.ios.statusExpension .safe-camp-kv .safe-camp-inner {
        margin-top: 4.4rem
    }
    /*! mixin :공통 - 헤더영역 */
    body.ios .component-header {
        padding-top: 4.4rem
    }
    body.ios .popup-header .component-header {
        padding-top: 0
    }
    /*! 홈 - 일반 */
    body.ios .home-default .main-container-component.bg-main {
        padding-top: calc(4.4rem + 5.6rem)
    }
    /*! 홈 - 추천 */
    body.ios .main-tab-container [class^="main-tab-content0"].scrolling .component-tab.sticky-tab {
        top: calc(4.4rem + 0.2rem)
    }
    /*! 홈 - 혜택 */
    body.ios .page-inner-scroll.scrolling .component-tab.sticky-tab02 .tab-round-group {
        top: calc(4.4rem + 5rem)
    }
    /*! 홈 - 타임라인 */
    body.ios .main-tab-container [class^="main-tab-content0"].scrolling .component-form-date {
        top: calc(4.4rem + 5rem + 0.2rem)
    }
    /*! 홈 - 순서변경 */
    body.ios .page-inner-scroll.scrolling .component-text-simple.fixed-top {
        top: calc(4.4rem + 0.9rem)
    }
    /*! 공통 - 풀팝업일때 */
    body.ios .popup-dialog.ui-full .popup-group,
    body.ios .popup-dialog.ui-full-change .popup-group,
    body.ios .popup-dialog.ui-full-change.plus-box-event-pop .popup-group {
        padding-top: 4.4rem
    }
    body.ios .popup-dialog.ui-full .popup-group:after {
        content: '';
        height: 4.4rem;
        background-color: var(--color-w100, #fff);
        position: fixed;
        top: 0;
        left: 0;
        width: 100%
    }
    body.ios .popup-dialog.ui-full .popup-group.popup-inandout-group:after {
        display: none
    }
    body.ios .popup-dialog.ui-full-change.plus-box-event-pop .interest-group-top .ani-step1-1 {
        margin-top: 8.2rem
    }
    body.ios .popup-dialog.ui-full .popup-group.shopping:after {
        background: var(--color-in700)
    }
    body.ios .popup-dialog.ui-full .popup-group.shopping.bg-white:after {
        background-color: var(--color-w100, #fff)
    }
    /*! 홈 개편 */
    body.ios .component-header.main {
        padding-top: calc(4.4rem + 0.6rem)
    }
    body.ios .ptr--ptr.ptr--refresh {
        padding-top: 4.4rem
    }
    body.ios .ptr--ptr.ptr--refresh.pull-home {
        padding-top: 0;
        margin-top: 4.4rem
    }
    body.ios .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: 0.6rem
    }
    body.ios .scrolling .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: calc(4.4rem + 0.6rem)
    }
    body.ios .component-tab.foru-tab-ver.scrollOn .tab-group.foru-type {
        top: calc(4.4rem)
    }
    body.ios .component-header.main+.component-tab.foru-tab-ver {
        top: calc(4.4rem + 5.6rem)
    }
    body.ios .component-main-bnf-tab {
        top: calc(4.4rem + 5rem)
    }
    body.ios .invest-home .tab-list-group.sticky-invest {
        top: calc(4.4rem + 5.6rem)
    }
    body.ios .component-ceo-calendar {
        top: calc(4.4rem + 5rem)
    }
    body.ios .component-ceo-my-account.type2 {
        padding-top: calc(4.4rem + 37rem)
    }
    body.ios .container-component-coach .coach-item01 {
        padding-top: 4.4rem
    }
    body.ios .component-header.search {
        padding-top: calc(4.4rem + 1.2rem);
        height: auto
    }
    body.ios .component-header.search.search-result {
        height: calc(4.4rem + 10.5rem)
    }
    body.ios .popup-inner .component-header.search.search-result {
        height: 10.5rem
    }
    body.ios .popup-inner .component-header.search.sticky {
        top: 4.4rem;
        padding-top: 1.2rem
    }
    body.ios .section-component.alarm .component-keyword {
        top: calc(4.4rem + 5rem)
    }
    body.ios .section-component.alarm .component-form-date {
        top: calc(4.4rem + 5rem)
    }
    body.ios .section-component.alarm.alarm-filter .component-form-date {
        top: calc(4.4rem + 10.6rem)
    }
    body.ios .main-tab-container [class^="main-tab-content0"] .component-main-refresh {
        top: calc(5rem + 4.4rem)
    }
    body.ios .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: 2.2rem
    }
    body.ios .safe-camp-kv .safe-camp-inner {
        margin-top: 4.4rem
    }
    /*! mixin :공통 - 헤더영역 */
    /*! 검색 - 공통 */
    html.ios.statusExpension .component-list.fixed,
    html.ios.statusExpension .component-search[class*="fixed"] {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .component-gathering-selected.active {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .component-gathering-selected.active+.component-search {
        top: calc(4.4rem + 16.2rem)
    }
    /*! 모임통장 - 모임홈 */
    html.ios.statusExpension .component-meet-profile {
        margin-top: -4.4rem
    }
    html.ios.statusExpension .component-meethome-profile {
        margin-top: calc(-5rem - 4.4rem)
    }
    /*! 상단 tab 고정 */
    html.ios.statusExpension .component-tab.food-cate-sticky,
    html.ios.statusExpension .component-text-simple+.component-tab.sticky,
    html.ios.statusExpension .section-component .component-tab.sticky,
    html.ios.statusExpension .section-component.living-price-tab .component-tab.sticky {
        top: calc(4.4rem + 5rem)
    }
    /*! 이체 */
    html.ios.statusExpension .component-header+.component-keypad {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .section-component-sticky {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .fixed-msg-card,
    html.ios.statusExpension .section-flex-colume {
        height: calc(100vh - calc(4.4rem + 5rem))
    }
    html.ios.statusExpension .section-flex-colume.type3 {
        height: calc(100vh - calc(4.4rem + 11rem))
    }
    html.ios.statusExpension .section-flex-colume.type4 {
        height: calc(100vh - calc(4.4rem + 19.4rem))
    }
    html.ios.statusExpension .component-card-sum-top.type2[class*="fixed"] {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .dim-moneytree-wrap {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .toast-wrap.ceo-type {
        bottom: auto;
        top: calc(4.4rem + 9.4rem)
    }
    html.ios.statusExpension .component-tab.sticky+.article-component .component-search[class*="fixed"] {
        top: calc(4.4rem + 11rem)
    }
    html.ios.statusExpension .container-component.shopping .component-text.sticky {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .container-component.shopping .component-text.sticky+.component-tab .tab-list-group.sticky {
        top: calc(4.4rem + 9rem)
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach.active {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: calc(4.4rem + 8.6rem)
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach .coach-close {
        padding-top: 0
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .inandout-calendar-inner {
        top: 4.4rem
    }
    html.ios.statusExpension .inandout-tab-wrap {
        top: calc(5.5rem + 4.4rem)
    }
    html.ios.statusExpension .section-component.custom-policy .component-tab.sticky-chip {
        top: calc(4.4rem + 11rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group.popup-inandout-pre-group {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .popup-inandout-group.pre-event .container-component-coach {
        top: 4.4rem
    }
    html.ios.statusExpension .ailive-today-quiz {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .tab-list-group[data-sticky-item] {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .container-component.ai-quiz .section-component.type2 {
        margin-top: calc(-5rem - 4.4rem);
        padding-top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .container-component.ai-quiz .section-component.type4 {
        margin-top: calc(-5rem - 4.4rem);
        padding-top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .fortune2025 .component-iframe {
        height: calc(100vh - (14.4rem + 4.4rem))
    }
    html.ios.statusExpension .container-component.common-cert.h-center .section-component.cert-section {
        min-height: calc(100vh - 24rem)
    }
    html.ios.statusExpension .section-component.stars-type1 {
        height: calc(100vh - (5rem + 4.4rem))
    }
    html.ios.statusExpension .section-component.mission-top {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .section-component.mission-rolling {
        top: calc(23.8rem + 4.4rem)
    }
    html.ios.statusExpension .page-inner-scroll.money-mission.first-lock-entry.scroll-top .section-component.mission-rolling {
        top: calc(24.3rem + 4.4rem)
    }
    html.ios.statusExpension .container-component.container-fixed {
        padding-top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .page-inner-scroll.no-overscroll-y .container-component {
        padding-top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.mission-talisman:after {
        background-color: transparent
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.coin-full-wrap:after {
        background-color: transparent
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.transparent:after {
        background-color: transparent
    }
    html.ios.statusExpension .component-invest-calendar {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .page-inner-scroll.scrolling .component-tab.financial-scam {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .component-tab.sticky-logotab {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .tooltip-focus-group .tooltip-area.align-bottom.digit-signature {
        top: calc(2.2rem + 4.4rem)
    }
    html.ios.statusExpension .weekly-invest-main-bg {
        margin-top: calc(var(--header-height) * -1 - 4.4rem);
        height: calc(var(--weekly-invest-height) + 4.4rem)
    }
    html.ios.statusExpension .weekly-invest-main .extra-cash,
    html.ios.statusExpension .weekly-invest-main .gauge,
    html.ios.statusExpension .weekly-invest-main-inner {
        margin-top: 4.4rem
    }
    /*! mixin :공통 - 헤더영역 */
    /*! 검색 - 공통 */
    body.ios .component-list.fixed,
    body.ios .component-search[class*="fixed"] {
        top: calc(4.4rem + 5rem)
    }
    body.ios .component-gathering-selected.active {
        top: calc(4.4rem + 5rem)
    }
    body.ios .component-gathering-selected.active+.component-search {
        top: calc(4.4rem + 16.2rem)
    }
    /*! 모임통장 - 모임홈 */
    body.ios .component-meet-profile {
        margin-top: -4.4rem
    }
    body.ios .component-meethome-profile {
        margin-top: calc(-5rem - 4.4rem)
    }
    /*! 상단 tab 고정 */
    body.ios .component-tab.food-cate-sticky,
    body.ios .component-text-simple+.component-tab.sticky,
    body.ios .section-component .component-tab.sticky,
    body.ios .section-component.living-price-tab .component-tab.sticky {
        top: calc(4.4rem + 5rem)
    }
    /*! 이체 */
    body.ios .component-header+.component-keypad {
        padding-top: 4.4rem
    }
    body.ios .section-component-sticky {
        top: calc(4.4rem + 5rem)
    }
    body.ios .fixed-msg-card,
    body.ios .section-flex-colume {
        height: calc(100vh - calc(4.4rem + 5rem))
    }
    body.ios .section-flex-colume.type3 {
        height: calc(100vh - calc(4.4rem + 11rem))
    }
    body.ios .section-flex-colume.type4 {
        height: calc(100vh - calc(4.4rem + 19.4rem))
    }
    body.ios .component-card-sum-top.type2[class*="fixed"] {
        top: calc(4.4rem + 5rem)
    }
    body.ios .dim-moneytree-wrap {
        top: calc(4.4rem + 5rem)
    }
    body.ios .toast-wrap.ceo-type {
        bottom: auto;
        top: calc(4.4rem + 9.4rem)
    }
    body.ios .component-tab.sticky+.article-component .component-search[class*="fixed"] {
        top: calc(4.4rem + 11rem)
    }
    body.ios .container-component.shopping .component-text.sticky {
        top: calc(4.4rem + 5rem)
    }
    body.ios .container-component.shopping .component-text.sticky+.component-tab .tab-list-group.sticky {
        top: calc(4.4rem + 9rem)
    }
    body.ios .page-inner-scroll.inandout-scroll .container-component-coach {
        padding-top: 4.4rem
    }
    body.ios .page-inner-scroll.inandout-scroll .container-component-coach.active {
        padding-top: 4.4rem
    }
    body.ios .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: calc(4.4rem + 8.6rem)
    }
    body.ios .page-inner-scroll.inandout-scroll .container-component-coach .coach-close {
        padding-top: 0
    }
    body.ios .page-inner-scroll.inandout-scroll .inandout-calendar-inner {
        top: 4.4rem
    }
    body.ios .inandout-tab-wrap {
        top: calc(5.5rem + 4.4rem)
    }
    body.ios .section-component.custom-policy .component-tab.sticky-chip {
        top: calc(4.4rem + 11rem)
    }
    body.ios .popup-dialog.ui-full .popup-group.popup-inandout-group.popup-inandout-pre-group {
        padding-top: 4.4rem
    }
    body.ios .popup-inandout-group.pre-event .container-component-coach {
        top: 4.4rem
    }
    body.ios .ailive-today-quiz {
        padding-top: 4.4rem
    }
    body.ios .tab-list-group[data-sticky-item] {
        top: calc(4.4rem + 5rem)
    }
    body.ios .container-component.ai-quiz .section-component.type2 {
        margin-top: calc(-5rem - 4.4rem);
        padding-top: calc(5rem + 4.4rem)
    }
    body.ios .container-component.ai-quiz .section-component.type4 {
        margin-top: calc(-5rem - 4.4rem);
        padding-top: calc(5rem + 4.4rem)
    }
    body.ios .fortune2025 .component-iframe {
        height: calc(100vh - (14.4rem + 4.4rem))
    }
    body.ios .container-component.common-cert.h-center .section-component.cert-section {
        min-height: calc(100vh - 24rem)
    }
    body.ios .section-component.stars-type1 {
        height: calc(100vh - (5rem + 4.4rem))
    }
    body.ios .section-component.mission-top {
        top: calc(5rem + 4.4rem)
    }
    body.ios .section-component.mission-rolling {
        top: calc(23.8rem + 4.4rem)
    }
    body.ios .page-inner-scroll.money-mission.first-lock-entry.scroll-top .section-component.mission-rolling {
        top: calc(24.3rem + 4.4rem)
    }
    body.ios .container-component.container-fixed {
        padding-top: calc(5rem + 4.4rem)
    }
    body.ios .page-inner-scroll.no-overscroll-y .container-component {
        padding-top: calc(5rem + 4.4rem)
    }
    body.ios .popup-dialog.ui-full .popup-group.mission-talisman:after {
        background-color: transparent
    }
    body.ios .popup-dialog.ui-full .popup-group.coin-full-wrap:after {
        background-color: transparent
    }
    body.ios .popup-dialog.ui-full .popup-group.transparent:after {
        background-color: transparent
    }
    body.ios .component-invest-calendar {
        top: calc(5rem + 4.4rem)
    }
    body.ios .page-inner-scroll.scrolling .component-tab.financial-scam {
        top: calc(5rem + 4.4rem)
    }
    body.ios .component-tab.sticky-logotab {
        top: calc(5rem + 4.4rem)
    }
    body.ios .tooltip-focus-group .tooltip-area.align-bottom.digit-signature {
        top: calc(2.2rem + 4.4rem)
    }
    body.ios .weekly-invest-main-bg {
        margin-top: calc(var(--header-height) * -1 - 4.4rem);
        height: calc(var(--weekly-invest-height) + 4.4rem)
    }
    body.ios .weekly-invest-main .extra-cash,
    body.ios .weekly-invest-main .gauge,
    body.ios .weekly-invest-main-inner {
        margin-top: 4.4rem
    }
    html.ios.statusExpension .content-savings.expired {
        height: calc(4.4rem + 53.9rem)
    }
    html.ios.statusExpension .content-savings.expired {
        height: calc(4.4rem + 53.9rem)
    }
    html.ios.statusExpension .content-savings {
        height: calc(4.4rem + 44.8rem)
    }
    html.ios.statusExpension .content-savings .img-area {
        top: 4.4rem
    }
    html.ios.statusExpension .content-savings .prodname-info {
        top: calc(4.4rem + 30.8rem)
    }
    html.ios.statusExpension .content-savings .kds-banner-card {
        top: calc(4.4rem + 42.1rem)
    }
    html.ios.statusExpension .savings-scroll .component-header::before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 4.4rem;
        background: var(--bg-pri-base)
    }
    html.ios.statusExpension .savings-scroll .component-fixed-bottom {
        min-height: calc(100vh - 5rem - 4.4rem - 4rem)
    }
    html.ios.statusExpension .container-component.ai-quiz.h-center .section-component {
        height: calc(100% - (16.2rem + 4.4rem + 4rem))
    }
    html.ios.statusExpension .container-component.view-center .section-component {
        height: calc(100% - (16.2rem + 4.4rem + 4rem))
    }
    html.ios.statusExpension .section-component.alarm-nodata {
        height: calc(100vh - (5rem + 4.4rem + 4rem))
    }
    html.ios.statusExpension .container-component.today-coupon.h-center .section-component {
        height: calc(100% - (20.2rem + 4.4rem + 4rem))
    }
    html.ios.statusExpension .section-component.stars-type2 {
        padding-top: calc(4.8rem + 4.4rem);
        padding-bottom: calc(8rem + 4rem)
    }
    html.ios.statusExpension .page-inner-scroll.scrolling .component-card-sticky {
        top: calc(4.4rem + 5rem)
    }
    body.ios .content-savings.expired {
        height: calc(4.4rem + 53.9rem)
    }
    body.ios .content-savings.expired {
        height: calc(4.4rem + 53.9rem)
    }
    body.ios .content-savings {
        height: calc(4.4rem + 44.8rem)
    }
    body.ios .content-savings .img-area {
        top: 4.4rem
    }
    body.ios .content-savings .prodname-info {
        top: calc(4.4rem + 30.8rem)
    }
    body.ios .content-savings .kds-banner-card {
        top: calc(4.4rem + 42.1rem)
    }
    body.ios .savings-scroll .component-header::before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 4.4rem;
        background: var(--bg-pri-base)
    }
    body.ios .savings-scroll .component-fixed-bottom {
        min-height: calc(100vh - 5rem - 4.4rem - 4rem)
    }
    body.ios .container-component.ai-quiz.h-center .section-component {
        height: calc(100% - (16.2rem + 4.4rem + 4rem))
    }
    body.ios .container-component.view-center .section-component {
        height: calc(100% - (16.2rem + 4.4rem + 4rem))
    }
    body.ios .section-component.alarm-nodata {
        height: calc(100vh - (5rem + 4.4rem + 4rem))
    }
    body.ios .container-component.today-coupon.h-center .section-component {
        height: calc(100% - (20.2rem + 4.4rem + 4rem))
    }
    body.ios .section-component.stars-type2 {
        padding-top: calc(4.8rem + 4.4rem);
        padding-bottom: calc(8rem + 4rem)
    }
    body.ios .page-inner-scroll.scrolling .component-card-sticky {
        top: calc(4.4rem + 5rem)
    }
}

/*! iPhone 11 Pro Max, Xs Max */

@media only screen and (device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 3) {
    /*! mixin :공통 - 헤더영역 */
    html.ios.statusExpension .component-header {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .popup-header .component-header {
        padding-top: 0
    }
    /*! 홈 - 일반 */
    html.ios.statusExpension .home-default .main-container-component.bg-main {
        padding-top: calc(4.4rem + 5.6rem)
    }
    /*! 홈 - 추천 */
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"].scrolling .component-tab.sticky-tab {
        top: calc(4.4rem + 0.2rem)
    }
    /*! 홈 - 혜택 */
    html.ios.statusExpension .page-inner-scroll.scrolling .component-tab.sticky-tab02 .tab-round-group {
        top: calc(4.4rem + 5rem)
    }
    /*! 홈 - 타임라인 */
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"].scrolling .component-form-date {
        top: calc(4.4rem + 5rem + 0.2rem)
    }
    /*! 홈 - 순서변경 */
    html.ios.statusExpension .page-inner-scroll.scrolling .component-text-simple.fixed-top {
        top: calc(4.4rem + 0.9rem)
    }
    /*! 공통 - 풀팝업일때 */
    html.ios.statusExpension .popup-dialog.ui-full .popup-group,
    html.ios.statusExpension .popup-dialog.ui-full-change .popup-group,
    html.ios.statusExpension .popup-dialog.ui-full-change.plus-box-event-pop .popup-group {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group:after {
        content: '';
        height: 4.4rem;
        background-color: var(--color-w100, #fff);
        position: fixed;
        top: 0;
        left: 0;
        width: 100%
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group:after {
        display: none
    }
    html.ios.statusExpension .popup-dialog.ui-full-change.plus-box-event-pop .interest-group-top .ani-step1-1 {
        margin-top: 8.2rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.shopping:after {
        background: var(--color-in700)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.shopping.bg-white:after {
        background-color: var(--color-w100, #fff)
    }
    /*! 홈 개편 */
    html.ios.statusExpension .component-header.main {
        padding-top: calc(4.4rem + 0.6rem)
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh.pull-home {
        padding-top: 0;
        margin-top: 4.4rem
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: 0.6rem
    }
    html.ios.statusExpension .scrolling .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: calc(4.4rem + 0.6rem)
    }
    html.ios.statusExpension .component-tab.foru-tab-ver.scrollOn .tab-group.foru-type {
        top: calc(4.4rem)
    }
    html.ios.statusExpension .component-header.main+.component-tab.foru-tab-ver {
        top: calc(4.4rem + 5.6rem)
    }
    html.ios.statusExpension .component-main-bnf-tab {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .invest-home .tab-list-group.sticky-invest {
        top: calc(4.4rem + 5.6rem)
    }
    html.ios.statusExpension .component-ceo-calendar {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .component-ceo-my-account.type2 {
        padding-top: calc(4.4rem + 37rem)
    }
    html.ios.statusExpension .container-component-coach .coach-item01 {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .component-header.search {
        padding-top: calc(4.4rem + 1.2rem);
        height: auto
    }
    html.ios.statusExpension .component-header.search.search-result {
        height: calc(4.4rem + 10.5rem)
    }
    html.ios.statusExpension .popup-inner .component-header.search.search-result {
        height: 10.5rem
    }
    html.ios.statusExpension .popup-inner .component-header.search.sticky {
        top: 4.4rem;
        padding-top: 1.2rem
    }
    html.ios.statusExpension .section-component.alarm .component-keyword {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .section-component.alarm .component-form-date {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .section-component.alarm.alarm-filter .component-form-date {
        top: calc(4.4rem + 10.6rem)
    }
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"] .component-main-refresh {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: 2.2rem
    }
    html.ios.statusExpension .safe-camp-kv .safe-camp-inner {
        margin-top: 4.4rem
    }
    /*! mixin :공통 - 헤더영역 */
    body.ios .component-header {
        padding-top: 4.4rem
    }
    body.ios .popup-header .component-header {
        padding-top: 0
    }
    /*! 홈 - 일반 */
    body.ios .home-default .main-container-component.bg-main {
        padding-top: calc(4.4rem + 5.6rem)
    }
    /*! 홈 - 추천 */
    body.ios .main-tab-container [class^="main-tab-content0"].scrolling .component-tab.sticky-tab {
        top: calc(4.4rem + 0.2rem)
    }
    /*! 홈 - 혜택 */
    body.ios .page-inner-scroll.scrolling .component-tab.sticky-tab02 .tab-round-group {
        top: calc(4.4rem + 5rem)
    }
    /*! 홈 - 타임라인 */
    body.ios .main-tab-container [class^="main-tab-content0"].scrolling .component-form-date {
        top: calc(4.4rem + 5rem + 0.2rem)
    }
    /*! 홈 - 순서변경 */
    body.ios .page-inner-scroll.scrolling .component-text-simple.fixed-top {
        top: calc(4.4rem + 0.9rem)
    }
    /*! 공통 - 풀팝업일때 */
    body.ios .popup-dialog.ui-full .popup-group,
    body.ios .popup-dialog.ui-full-change .popup-group,
    body.ios .popup-dialog.ui-full-change.plus-box-event-pop .popup-group {
        padding-top: 4.4rem
    }
    body.ios .popup-dialog.ui-full .popup-group:after {
        content: '';
        height: 4.4rem;
        background-color: var(--color-w100, #fff);
        position: fixed;
        top: 0;
        left: 0;
        width: 100%
    }
    body.ios .popup-dialog.ui-full .popup-group.popup-inandout-group:after {
        display: none
    }
    body.ios .popup-dialog.ui-full-change.plus-box-event-pop .interest-group-top .ani-step1-1 {
        margin-top: 8.2rem
    }
    body.ios .popup-dialog.ui-full .popup-group.shopping:after {
        background: var(--color-in700)
    }
    body.ios .popup-dialog.ui-full .popup-group.shopping.bg-white:after {
        background-color: var(--color-w100, #fff)
    }
    /*! 홈 개편 */
    body.ios .component-header.main {
        padding-top: calc(4.4rem + 0.6rem)
    }
    body.ios .ptr--ptr.ptr--refresh {
        padding-top: 4.4rem
    }
    body.ios .ptr--ptr.ptr--refresh.pull-home {
        padding-top: 0;
        margin-top: 4.4rem
    }
    body.ios .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: 0.6rem
    }
    body.ios .scrolling .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: calc(4.4rem + 0.6rem)
    }
    body.ios .component-tab.foru-tab-ver.scrollOn .tab-group.foru-type {
        top: calc(4.4rem)
    }
    body.ios .component-header.main+.component-tab.foru-tab-ver {
        top: calc(4.4rem + 5.6rem)
    }
    body.ios .component-main-bnf-tab {
        top: calc(4.4rem + 5rem)
    }
    body.ios .invest-home .tab-list-group.sticky-invest {
        top: calc(4.4rem + 5.6rem)
    }
    body.ios .component-ceo-calendar {
        top: calc(4.4rem + 5rem)
    }
    body.ios .component-ceo-my-account.type2 {
        padding-top: calc(4.4rem + 37rem)
    }
    body.ios .container-component-coach .coach-item01 {
        padding-top: 4.4rem
    }
    body.ios .component-header.search {
        padding-top: calc(4.4rem + 1.2rem);
        height: auto
    }
    body.ios .component-header.search.search-result {
        height: calc(4.4rem + 10.5rem)
    }
    body.ios .popup-inner .component-header.search.search-result {
        height: 10.5rem
    }
    body.ios .popup-inner .component-header.search.sticky {
        top: 4.4rem;
        padding-top: 1.2rem
    }
    body.ios .section-component.alarm .component-keyword {
        top: calc(4.4rem + 5rem)
    }
    body.ios .section-component.alarm .component-form-date {
        top: calc(4.4rem + 5rem)
    }
    body.ios .section-component.alarm.alarm-filter .component-form-date {
        top: calc(4.4rem + 10.6rem)
    }
    body.ios .main-tab-container [class^="main-tab-content0"] .component-main-refresh {
        top: calc(5rem + 4.4rem)
    }
    body.ios .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: 2.2rem
    }
    body.ios .safe-camp-kv .safe-camp-inner {
        margin-top: 4.4rem
    }
    /*! mixin :공통 - 헤더영역 */
    /*! 검색 - 공통 */
    html.ios.statusExpension .component-list.fixed,
    html.ios.statusExpension .component-search[class*="fixed"] {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .component-gathering-selected.active {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .component-gathering-selected.active+.component-search {
        top: calc(4.4rem + 16.2rem)
    }
    /*! 모임통장 - 모임홈 */
    html.ios.statusExpension .component-meet-profile {
        margin-top: -4.4rem
    }
    html.ios.statusExpension .component-meethome-profile {
        margin-top: calc(-5rem - 4.4rem)
    }
    /*! 상단 tab 고정 */
    html.ios.statusExpension .component-tab.food-cate-sticky,
    html.ios.statusExpension .component-text-simple+.component-tab.sticky,
    html.ios.statusExpension .section-component .component-tab.sticky,
    html.ios.statusExpension .section-component.living-price-tab .component-tab.sticky {
        top: calc(4.4rem + 5rem)
    }
    /*! 이체 */
    html.ios.statusExpension .component-header+.component-keypad {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .section-component-sticky {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .fixed-msg-card,
    html.ios.statusExpension .section-flex-colume {
        height: calc(100vh - calc(4.4rem + 5rem))
    }
    html.ios.statusExpension .section-flex-colume.type3 {
        height: calc(100vh - calc(4.4rem + 11rem))
    }
    html.ios.statusExpension .section-flex-colume.type4 {
        height: calc(100vh - calc(4.4rem + 19.4rem))
    }
    html.ios.statusExpension .component-card-sum-top.type2[class*="fixed"] {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .dim-moneytree-wrap {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .toast-wrap.ceo-type {
        bottom: auto;
        top: calc(4.4rem + 9.4rem)
    }
    html.ios.statusExpension .component-tab.sticky+.article-component .component-search[class*="fixed"] {
        top: calc(4.4rem + 11rem)
    }
    html.ios.statusExpension .container-component.shopping .component-text.sticky {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .container-component.shopping .component-text.sticky+.component-tab .tab-list-group.sticky {
        top: calc(4.4rem + 9rem)
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach.active {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: calc(4.4rem + 8.6rem)
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach .coach-close {
        padding-top: 0
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .inandout-calendar-inner {
        top: 4.4rem
    }
    html.ios.statusExpension .inandout-tab-wrap {
        top: calc(5.5rem + 4.4rem)
    }
    html.ios.statusExpension .section-component.custom-policy .component-tab.sticky-chip {
        top: calc(4.4rem + 11rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group.popup-inandout-pre-group {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .popup-inandout-group.pre-event .container-component-coach {
        top: 4.4rem
    }
    html.ios.statusExpension .ailive-today-quiz {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .tab-list-group[data-sticky-item] {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .container-component.ai-quiz .section-component.type2 {
        margin-top: calc(-5rem - 4.4rem);
        padding-top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .container-component.ai-quiz .section-component.type4 {
        margin-top: calc(-5rem - 4.4rem);
        padding-top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .fortune2025 .component-iframe {
        height: calc(100vh - (14.4rem + 4.4rem))
    }
    html.ios.statusExpension .container-component.common-cert.h-center .section-component.cert-section {
        min-height: calc(100vh - 24rem)
    }
    html.ios.statusExpension .section-component.stars-type1 {
        height: calc(100vh - (5rem + 4.4rem))
    }
    html.ios.statusExpension .section-component.mission-top {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .section-component.mission-rolling {
        top: calc(23.8rem + 4.4rem)
    }
    html.ios.statusExpension .page-inner-scroll.money-mission.first-lock-entry.scroll-top .section-component.mission-rolling {
        top: calc(24.3rem + 4.4rem)
    }
    html.ios.statusExpension .container-component.container-fixed {
        padding-top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .page-inner-scroll.no-overscroll-y .container-component {
        padding-top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.mission-talisman:after {
        background-color: transparent
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.coin-full-wrap:after {
        background-color: transparent
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.transparent:after {
        background-color: transparent
    }
    html.ios.statusExpension .component-invest-calendar {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .page-inner-scroll.scrolling .component-tab.financial-scam {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .component-tab.sticky-logotab {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .tooltip-focus-group .tooltip-area.align-bottom.digit-signature {
        top: calc(2.2rem + 4.4rem)
    }
    html.ios.statusExpension .weekly-invest-main-bg {
        margin-top: calc(var(--header-height) * -1 - 4.4rem);
        height: calc(var(--weekly-invest-height) + 4.4rem)
    }
    html.ios.statusExpension .weekly-invest-main .extra-cash,
    html.ios.statusExpension .weekly-invest-main .gauge,
    html.ios.statusExpension .weekly-invest-main-inner {
        margin-top: 4.4rem
    }
    /*! mixin :공통 - 헤더영역 */
    /*! 검색 - 공통 */
    body.ios .component-list.fixed,
    body.ios .component-search[class*="fixed"] {
        top: calc(4.4rem + 5rem)
    }
    body.ios .component-gathering-selected.active {
        top: calc(4.4rem + 5rem)
    }
    body.ios .component-gathering-selected.active+.component-search {
        top: calc(4.4rem + 16.2rem)
    }
    /*! 모임통장 - 모임홈 */
    body.ios .component-meet-profile {
        margin-top: -4.4rem
    }
    body.ios .component-meethome-profile {
        margin-top: calc(-5rem - 4.4rem)
    }
    /*! 상단 tab 고정 */
    body.ios .component-tab.food-cate-sticky,
    body.ios .component-text-simple+.component-tab.sticky,
    body.ios .section-component .component-tab.sticky,
    body.ios .section-component.living-price-tab .component-tab.sticky {
        top: calc(4.4rem + 5rem)
    }
    /*! 이체 */
    body.ios .component-header+.component-keypad {
        padding-top: 4.4rem
    }
    body.ios .section-component-sticky {
        top: calc(4.4rem + 5rem)
    }
    body.ios .fixed-msg-card,
    body.ios .section-flex-colume {
        height: calc(100vh - calc(4.4rem + 5rem))
    }
    body.ios .section-flex-colume.type3 {
        height: calc(100vh - calc(4.4rem + 11rem))
    }
    body.ios .section-flex-colume.type4 {
        height: calc(100vh - calc(4.4rem + 19.4rem))
    }
    body.ios .component-card-sum-top.type2[class*="fixed"] {
        top: calc(4.4rem + 5rem)
    }
    body.ios .dim-moneytree-wrap {
        top: calc(4.4rem + 5rem)
    }
    body.ios .toast-wrap.ceo-type {
        bottom: auto;
        top: calc(4.4rem + 9.4rem)
    }
    body.ios .component-tab.sticky+.article-component .component-search[class*="fixed"] {
        top: calc(4.4rem + 11rem)
    }
    body.ios .container-component.shopping .component-text.sticky {
        top: calc(4.4rem + 5rem)
    }
    body.ios .container-component.shopping .component-text.sticky+.component-tab .tab-list-group.sticky {
        top: calc(4.4rem + 9rem)
    }
    body.ios .page-inner-scroll.inandout-scroll .container-component-coach {
        padding-top: 4.4rem
    }
    body.ios .page-inner-scroll.inandout-scroll .container-component-coach.active {
        padding-top: 4.4rem
    }
    body.ios .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: calc(4.4rem + 8.6rem)
    }
    body.ios .page-inner-scroll.inandout-scroll .container-component-coach .coach-close {
        padding-top: 0
    }
    body.ios .page-inner-scroll.inandout-scroll .inandout-calendar-inner {
        top: 4.4rem
    }
    body.ios .inandout-tab-wrap {
        top: calc(5.5rem + 4.4rem)
    }
    body.ios .section-component.custom-policy .component-tab.sticky-chip {
        top: calc(4.4rem + 11rem)
    }
    body.ios .popup-dialog.ui-full .popup-group.popup-inandout-group.popup-inandout-pre-group {
        padding-top: 4.4rem
    }
    body.ios .popup-inandout-group.pre-event .container-component-coach {
        top: 4.4rem
    }
    body.ios .ailive-today-quiz {
        padding-top: 4.4rem
    }
    body.ios .tab-list-group[data-sticky-item] {
        top: calc(4.4rem + 5rem)
    }
    body.ios .container-component.ai-quiz .section-component.type2 {
        margin-top: calc(-5rem - 4.4rem);
        padding-top: calc(5rem + 4.4rem)
    }
    body.ios .container-component.ai-quiz .section-component.type4 {
        margin-top: calc(-5rem - 4.4rem);
        padding-top: calc(5rem + 4.4rem)
    }
    body.ios .fortune2025 .component-iframe {
        height: calc(100vh - (14.4rem + 4.4rem))
    }
    body.ios .container-component.common-cert.h-center .section-component.cert-section {
        min-height: calc(100vh - 24rem)
    }
    body.ios .section-component.stars-type1 {
        height: calc(100vh - (5rem + 4.4rem))
    }
    body.ios .section-component.mission-top {
        top: calc(5rem + 4.4rem)
    }
    body.ios .section-component.mission-rolling {
        top: calc(23.8rem + 4.4rem)
    }
    body.ios .page-inner-scroll.money-mission.first-lock-entry.scroll-top .section-component.mission-rolling {
        top: calc(24.3rem + 4.4rem)
    }
    body.ios .container-component.container-fixed {
        padding-top: calc(5rem + 4.4rem)
    }
    body.ios .page-inner-scroll.no-overscroll-y .container-component {
        padding-top: calc(5rem + 4.4rem)
    }
    body.ios .popup-dialog.ui-full .popup-group.mission-talisman:after {
        background-color: transparent
    }
    body.ios .popup-dialog.ui-full .popup-group.coin-full-wrap:after {
        background-color: transparent
    }
    body.ios .popup-dialog.ui-full .popup-group.transparent:after {
        background-color: transparent
    }
    body.ios .component-invest-calendar {
        top: calc(5rem + 4.4rem)
    }
    body.ios .page-inner-scroll.scrolling .component-tab.financial-scam {
        top: calc(5rem + 4.4rem)
    }
    body.ios .component-tab.sticky-logotab {
        top: calc(5rem + 4.4rem)
    }
    body.ios .tooltip-focus-group .tooltip-area.align-bottom.digit-signature {
        top: calc(2.2rem + 4.4rem)
    }
    body.ios .weekly-invest-main-bg {
        margin-top: calc(var(--header-height) * -1 - 4.4rem);
        height: calc(var(--weekly-invest-height) + 4.4rem)
    }
    body.ios .weekly-invest-main .extra-cash,
    body.ios .weekly-invest-main .gauge,
    body.ios .weekly-invest-main-inner {
        margin-top: 4.4rem
    }
    html.ios.statusExpension .content-savings.expired {
        height: calc(4.4rem + 53.9rem)
    }
    html.ios.statusExpension .content-savings.expired {
        height: calc(4.4rem + 53.9rem)
    }
    html.ios.statusExpension .content-savings {
        height: calc(4.4rem + 44.8rem)
    }
    html.ios.statusExpension .content-savings .img-area {
        top: 4.4rem
    }
    html.ios.statusExpension .content-savings .prodname-info {
        top: calc(4.4rem + 30.8rem)
    }
    html.ios.statusExpension .content-savings .kds-banner-card {
        top: calc(4.4rem + 42.1rem)
    }
    html.ios.statusExpension .savings-scroll .component-header::before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 4.4rem;
        background: var(--bg-pri-base)
    }
    html.ios.statusExpension .savings-scroll .component-fixed-bottom {
        min-height: calc(100vh - 5rem - 4.4rem - 4rem)
    }
    html.ios.statusExpension .container-component.ai-quiz.h-center .section-component {
        height: calc(100% - (16.2rem + 4.4rem + 4rem))
    }
    html.ios.statusExpension .container-component.view-center .section-component {
        height: calc(100% - (16.2rem + 4.4rem + 4rem))
    }
    html.ios.statusExpension .section-component.alarm-nodata {
        height: calc(100vh - (5rem + 4.4rem + 4rem))
    }
    html.ios.statusExpension .container-component.today-coupon.h-center .section-component {
        height: calc(100% - (20.2rem + 4.4rem + 4rem))
    }
    html.ios.statusExpension .section-component.stars-type2 {
        padding-top: calc(4.8rem + 4.4rem);
        padding-bottom: calc(8rem + 4rem)
    }
    html.ios.statusExpension .page-inner-scroll.scrolling .component-card-sticky {
        top: calc(4.4rem + 5rem)
    }
    body.ios .content-savings.expired {
        height: calc(4.4rem + 53.9rem)
    }
    body.ios .content-savings.expired {
        height: calc(4.4rem + 53.9rem)
    }
    body.ios .content-savings {
        height: calc(4.4rem + 44.8rem)
    }
    body.ios .content-savings .img-area {
        top: 4.4rem
    }
    body.ios .content-savings .prodname-info {
        top: calc(4.4rem + 30.8rem)
    }
    body.ios .content-savings .kds-banner-card {
        top: calc(4.4rem + 42.1rem)
    }
    body.ios .savings-scroll .component-header::before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 4.4rem;
        background: var(--bg-pri-base)
    }
    body.ios .savings-scroll .component-fixed-bottom {
        min-height: calc(100vh - 5rem - 4.4rem - 4rem)
    }
    body.ios .container-component.ai-quiz.h-center .section-component {
        height: calc(100% - (16.2rem + 4.4rem + 4rem))
    }
    body.ios .container-component.view-center .section-component {
        height: calc(100% - (16.2rem + 4.4rem + 4rem))
    }
    body.ios .section-component.alarm-nodata {
        height: calc(100vh - (5rem + 4.4rem + 4rem))
    }
    body.ios .container-component.today-coupon.h-center .section-component {
        height: calc(100% - (20.2rem + 4.4rem + 4rem))
    }
    body.ios .section-component.stars-type2 {
        padding-top: calc(4.8rem + 4.4rem);
        padding-bottom: calc(8rem + 4rem)
    }
    body.ios .page-inner-scroll.scrolling .component-card-sticky {
        top: calc(4.4rem + 5rem)
    }
}

/*! iPhone 12 Pro Max */

@media only screen and (device-width: 428px) and (device-height: 926px) and (-webkit-device-pixel-ratio: 3) {
    /*! mixin :공통 - 헤더영역 */
    html.ios.statusExpension .component-header {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .popup-header .component-header {
        padding-top: 0
    }
    /*! 홈 - 일반 */
    html.ios.statusExpension .home-default .main-container-component.bg-main {
        padding-top: calc(4.4rem + 5.6rem)
    }
    /*! 홈 - 추천 */
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"].scrolling .component-tab.sticky-tab {
        top: calc(4.4rem + 0.2rem)
    }
    /*! 홈 - 혜택 */
    html.ios.statusExpension .page-inner-scroll.scrolling .component-tab.sticky-tab02 .tab-round-group {
        top: calc(4.4rem + 5rem)
    }
    /*! 홈 - 타임라인 */
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"].scrolling .component-form-date {
        top: calc(4.4rem + 5rem + 0.2rem)
    }
    /*! 홈 - 순서변경 */
    html.ios.statusExpension .page-inner-scroll.scrolling .component-text-simple.fixed-top {
        top: calc(4.4rem + 0.9rem)
    }
    /*! 공통 - 풀팝업일때 */
    html.ios.statusExpension .popup-dialog.ui-full .popup-group,
    html.ios.statusExpension .popup-dialog.ui-full-change .popup-group,
    html.ios.statusExpension .popup-dialog.ui-full-change.plus-box-event-pop .popup-group {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group:after {
        content: '';
        height: 4.4rem;
        background-color: var(--color-w100, #fff);
        position: fixed;
        top: 0;
        left: 0;
        width: 100%
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group:after {
        display: none
    }
    html.ios.statusExpension .popup-dialog.ui-full-change.plus-box-event-pop .interest-group-top .ani-step1-1 {
        margin-top: 8.2rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.shopping:after {
        background: var(--color-in700)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.shopping.bg-white:after {
        background-color: var(--color-w100, #fff)
    }
    /*! 홈 개편 */
    html.ios.statusExpension .component-header.main {
        padding-top: calc(4.4rem + 0.6rem)
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh.pull-home {
        padding-top: 0;
        margin-top: 4.4rem
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: 0.6rem
    }
    html.ios.statusExpension .scrolling .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: calc(4.4rem + 0.6rem)
    }
    html.ios.statusExpension .component-tab.foru-tab-ver.scrollOn .tab-group.foru-type {
        top: calc(4.4rem)
    }
    html.ios.statusExpension .component-header.main+.component-tab.foru-tab-ver {
        top: calc(4.4rem + 5.6rem)
    }
    html.ios.statusExpension .component-main-bnf-tab {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .invest-home .tab-list-group.sticky-invest {
        top: calc(4.4rem + 5.6rem)
    }
    html.ios.statusExpension .component-ceo-calendar {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .component-ceo-my-account.type2 {
        padding-top: calc(4.4rem + 37rem)
    }
    html.ios.statusExpension .container-component-coach .coach-item01 {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .component-header.search {
        padding-top: calc(4.4rem + 1.2rem);
        height: auto
    }
    html.ios.statusExpension .component-header.search.search-result {
        height: calc(4.4rem + 10.5rem)
    }
    html.ios.statusExpension .popup-inner .component-header.search.search-result {
        height: 10.5rem
    }
    html.ios.statusExpension .popup-inner .component-header.search.sticky {
        top: 4.4rem;
        padding-top: 1.2rem
    }
    html.ios.statusExpension .section-component.alarm .component-keyword {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .section-component.alarm .component-form-date {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .section-component.alarm.alarm-filter .component-form-date {
        top: calc(4.4rem + 10.6rem)
    }
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"] .component-main-refresh {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: 2.2rem
    }
    html.ios.statusExpension .safe-camp-kv .safe-camp-inner {
        margin-top: 4.4rem
    }
    /*! mixin :공통 - 헤더영역 */
    body.ios .component-header {
        padding-top: 4.4rem
    }
    body.ios .popup-header .component-header {
        padding-top: 0
    }
    /*! 홈 - 일반 */
    body.ios .home-default .main-container-component.bg-main {
        padding-top: calc(4.4rem + 5.6rem)
    }
    /*! 홈 - 추천 */
    body.ios .main-tab-container [class^="main-tab-content0"].scrolling .component-tab.sticky-tab {
        top: calc(4.4rem + 0.2rem)
    }
    /*! 홈 - 혜택 */
    body.ios .page-inner-scroll.scrolling .component-tab.sticky-tab02 .tab-round-group {
        top: calc(4.4rem + 5rem)
    }
    /*! 홈 - 타임라인 */
    body.ios .main-tab-container [class^="main-tab-content0"].scrolling .component-form-date {
        top: calc(4.4rem + 5rem + 0.2rem)
    }
    /*! 홈 - 순서변경 */
    body.ios .page-inner-scroll.scrolling .component-text-simple.fixed-top {
        top: calc(4.4rem + 0.9rem)
    }
    /*! 공통 - 풀팝업일때 */
    body.ios .popup-dialog.ui-full .popup-group,
    body.ios .popup-dialog.ui-full-change .popup-group,
    body.ios .popup-dialog.ui-full-change.plus-box-event-pop .popup-group {
        padding-top: 4.4rem
    }
    body.ios .popup-dialog.ui-full .popup-group:after {
        content: '';
        height: 4.4rem;
        background-color: var(--color-w100, #fff);
        position: fixed;
        top: 0;
        left: 0;
        width: 100%
    }
    body.ios .popup-dialog.ui-full .popup-group.popup-inandout-group:after {
        display: none
    }
    body.ios .popup-dialog.ui-full-change.plus-box-event-pop .interest-group-top .ani-step1-1 {
        margin-top: 8.2rem
    }
    body.ios .popup-dialog.ui-full .popup-group.shopping:after {
        background: var(--color-in700)
    }
    body.ios .popup-dialog.ui-full .popup-group.shopping.bg-white:after {
        background-color: var(--color-w100, #fff)
    }
    /*! 홈 개편 */
    body.ios .component-header.main {
        padding-top: calc(4.4rem + 0.6rem)
    }
    body.ios .ptr--ptr.ptr--refresh {
        padding-top: 4.4rem
    }
    body.ios .ptr--ptr.ptr--refresh.pull-home {
        padding-top: 0;
        margin-top: 4.4rem
    }
    body.ios .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: 0.6rem
    }
    body.ios .scrolling .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: calc(4.4rem + 0.6rem)
    }
    body.ios .component-tab.foru-tab-ver.scrollOn .tab-group.foru-type {
        top: calc(4.4rem)
    }
    body.ios .component-header.main+.component-tab.foru-tab-ver {
        top: calc(4.4rem + 5.6rem)
    }
    body.ios .component-main-bnf-tab {
        top: calc(4.4rem + 5rem)
    }
    body.ios .invest-home .tab-list-group.sticky-invest {
        top: calc(4.4rem + 5.6rem)
    }
    body.ios .component-ceo-calendar {
        top: calc(4.4rem + 5rem)
    }
    body.ios .component-ceo-my-account.type2 {
        padding-top: calc(4.4rem + 37rem)
    }
    body.ios .container-component-coach .coach-item01 {
        padding-top: 4.4rem
    }
    body.ios .component-header.search {
        padding-top: calc(4.4rem + 1.2rem);
        height: auto
    }
    body.ios .component-header.search.search-result {
        height: calc(4.4rem + 10.5rem)
    }
    body.ios .popup-inner .component-header.search.search-result {
        height: 10.5rem
    }
    body.ios .popup-inner .component-header.search.sticky {
        top: 4.4rem;
        padding-top: 1.2rem
    }
    body.ios .section-component.alarm .component-keyword {
        top: calc(4.4rem + 5rem)
    }
    body.ios .section-component.alarm .component-form-date {
        top: calc(4.4rem + 5rem)
    }
    body.ios .section-component.alarm.alarm-filter .component-form-date {
        top: calc(4.4rem + 10.6rem)
    }
    body.ios .main-tab-container [class^="main-tab-content0"] .component-main-refresh {
        top: calc(5rem + 4.4rem)
    }
    body.ios .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: 2.2rem
    }
    body.ios .safe-camp-kv .safe-camp-inner {
        margin-top: 4.4rem
    }
    /*! mixin :공통 - 헤더영역 */
    /*! 검색 - 공통 */
    html.ios.statusExpension .component-list.fixed,
    html.ios.statusExpension .component-search[class*="fixed"] {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .component-gathering-selected.active {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .component-gathering-selected.active+.component-search {
        top: calc(4.4rem + 16.2rem)
    }
    /*! 모임통장 - 모임홈 */
    html.ios.statusExpension .component-meet-profile {
        margin-top: -4.4rem
    }
    html.ios.statusExpension .component-meethome-profile {
        margin-top: calc(-5rem - 4.4rem)
    }
    /*! 상단 tab 고정 */
    html.ios.statusExpension .component-tab.food-cate-sticky,
    html.ios.statusExpension .component-text-simple+.component-tab.sticky,
    html.ios.statusExpension .section-component .component-tab.sticky,
    html.ios.statusExpension .section-component.living-price-tab .component-tab.sticky {
        top: calc(4.4rem + 5rem)
    }
    /*! 이체 */
    html.ios.statusExpension .component-header+.component-keypad {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .section-component-sticky {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .fixed-msg-card,
    html.ios.statusExpension .section-flex-colume {
        height: calc(100vh - calc(4.4rem + 5rem))
    }
    html.ios.statusExpension .section-flex-colume.type3 {
        height: calc(100vh - calc(4.4rem + 11rem))
    }
    html.ios.statusExpension .section-flex-colume.type4 {
        height: calc(100vh - calc(4.4rem + 19.4rem))
    }
    html.ios.statusExpension .component-card-sum-top.type2[class*="fixed"] {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .dim-moneytree-wrap {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .toast-wrap.ceo-type {
        bottom: auto;
        top: calc(4.4rem + 9.4rem)
    }
    html.ios.statusExpension .component-tab.sticky+.article-component .component-search[class*="fixed"] {
        top: calc(4.4rem + 11rem)
    }
    html.ios.statusExpension .container-component.shopping .component-text.sticky {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .container-component.shopping .component-text.sticky+.component-tab .tab-list-group.sticky {
        top: calc(4.4rem + 9rem)
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach.active {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: calc(4.4rem + 8.6rem)
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach .coach-close {
        padding-top: 0
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .inandout-calendar-inner {
        top: 4.4rem
    }
    html.ios.statusExpension .inandout-tab-wrap {
        top: calc(5.5rem + 4.4rem)
    }
    html.ios.statusExpension .section-component.custom-policy .component-tab.sticky-chip {
        top: calc(4.4rem + 11rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group.popup-inandout-pre-group {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .popup-inandout-group.pre-event .container-component-coach {
        top: 4.4rem
    }
    html.ios.statusExpension .ailive-today-quiz {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .tab-list-group[data-sticky-item] {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .container-component.ai-quiz .section-component.type2 {
        margin-top: calc(-5rem - 4.4rem);
        padding-top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .container-component.ai-quiz .section-component.type4 {
        margin-top: calc(-5rem - 4.4rem);
        padding-top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .fortune2025 .component-iframe {
        height: calc(100vh - (14.4rem + 4.4rem))
    }
    html.ios.statusExpension .container-component.common-cert.h-center .section-component.cert-section {
        min-height: calc(100vh - 24rem)
    }
    html.ios.statusExpension .section-component.stars-type1 {
        height: calc(100vh - (5rem + 4.4rem))
    }
    html.ios.statusExpension .section-component.mission-top {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .section-component.mission-rolling {
        top: calc(23.8rem + 4.4rem)
    }
    html.ios.statusExpension .page-inner-scroll.money-mission.first-lock-entry.scroll-top .section-component.mission-rolling {
        top: calc(24.3rem + 4.4rem)
    }
    html.ios.statusExpension .container-component.container-fixed {
        padding-top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .page-inner-scroll.no-overscroll-y .container-component {
        padding-top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.mission-talisman:after {
        background-color: transparent
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.coin-full-wrap:after {
        background-color: transparent
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.transparent:after {
        background-color: transparent
    }
    html.ios.statusExpension .component-invest-calendar {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .page-inner-scroll.scrolling .component-tab.financial-scam {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .component-tab.sticky-logotab {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .tooltip-focus-group .tooltip-area.align-bottom.digit-signature {
        top: calc(2.2rem + 4.4rem)
    }
    html.ios.statusExpension .weekly-invest-main-bg {
        margin-top: calc(var(--header-height) * -1 - 4.4rem);
        height: calc(var(--weekly-invest-height) + 4.4rem)
    }
    html.ios.statusExpension .weekly-invest-main .extra-cash,
    html.ios.statusExpension .weekly-invest-main .gauge,
    html.ios.statusExpension .weekly-invest-main-inner {
        margin-top: 4.4rem
    }
    /*! mixin :공통 - 헤더영역 */
    /*! 검색 - 공통 */
    body.ios .component-list.fixed,
    body.ios .component-search[class*="fixed"] {
        top: calc(4.4rem + 5rem)
    }
    body.ios .component-gathering-selected.active {
        top: calc(4.4rem + 5rem)
    }
    body.ios .component-gathering-selected.active+.component-search {
        top: calc(4.4rem + 16.2rem)
    }
    /*! 모임통장 - 모임홈 */
    body.ios .component-meet-profile {
        margin-top: -4.4rem
    }
    body.ios .component-meethome-profile {
        margin-top: calc(-5rem - 4.4rem)
    }
    /*! 상단 tab 고정 */
    body.ios .component-tab.food-cate-sticky,
    body.ios .component-text-simple+.component-tab.sticky,
    body.ios .section-component .component-tab.sticky,
    body.ios .section-component.living-price-tab .component-tab.sticky {
        top: calc(4.4rem + 5rem)
    }
    /*! 이체 */
    body.ios .component-header+.component-keypad {
        padding-top: 4.4rem
    }
    body.ios .section-component-sticky {
        top: calc(4.4rem + 5rem)
    }
    body.ios .fixed-msg-card,
    body.ios .section-flex-colume {
        height: calc(100vh - calc(4.4rem + 5rem))
    }
    body.ios .section-flex-colume.type3 {
        height: calc(100vh - calc(4.4rem + 11rem))
    }
    body.ios .section-flex-colume.type4 {
        height: calc(100vh - calc(4.4rem + 19.4rem))
    }
    body.ios .component-card-sum-top.type2[class*="fixed"] {
        top: calc(4.4rem + 5rem)
    }
    body.ios .dim-moneytree-wrap {
        top: calc(4.4rem + 5rem)
    }
    body.ios .toast-wrap.ceo-type {
        bottom: auto;
        top: calc(4.4rem + 9.4rem)
    }
    body.ios .component-tab.sticky+.article-component .component-search[class*="fixed"] {
        top: calc(4.4rem + 11rem)
    }
    body.ios .container-component.shopping .component-text.sticky {
        top: calc(4.4rem + 5rem)
    }
    body.ios .container-component.shopping .component-text.sticky+.component-tab .tab-list-group.sticky {
        top: calc(4.4rem + 9rem)
    }
    body.ios .page-inner-scroll.inandout-scroll .container-component-coach {
        padding-top: 4.4rem
    }
    body.ios .page-inner-scroll.inandout-scroll .container-component-coach.active {
        padding-top: 4.4rem
    }
    body.ios .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: calc(4.4rem + 8.6rem)
    }
    body.ios .page-inner-scroll.inandout-scroll .container-component-coach .coach-close {
        padding-top: 0
    }
    body.ios .page-inner-scroll.inandout-scroll .inandout-calendar-inner {
        top: 4.4rem
    }
    body.ios .inandout-tab-wrap {
        top: calc(5.5rem + 4.4rem)
    }
    body.ios .section-component.custom-policy .component-tab.sticky-chip {
        top: calc(4.4rem + 11rem)
    }
    body.ios .popup-dialog.ui-full .popup-group.popup-inandout-group.popup-inandout-pre-group {
        padding-top: 4.4rem
    }
    body.ios .popup-inandout-group.pre-event .container-component-coach {
        top: 4.4rem
    }
    body.ios .ailive-today-quiz {
        padding-top: 4.4rem
    }
    body.ios .tab-list-group[data-sticky-item] {
        top: calc(4.4rem + 5rem)
    }
    body.ios .container-component.ai-quiz .section-component.type2 {
        margin-top: calc(-5rem - 4.4rem);
        padding-top: calc(5rem + 4.4rem)
    }
    body.ios .container-component.ai-quiz .section-component.type4 {
        margin-top: calc(-5rem - 4.4rem);
        padding-top: calc(5rem + 4.4rem)
    }
    body.ios .fortune2025 .component-iframe {
        height: calc(100vh - (14.4rem + 4.4rem))
    }
    body.ios .container-component.common-cert.h-center .section-component.cert-section {
        min-height: calc(100vh - 24rem)
    }
    body.ios .section-component.stars-type1 {
        height: calc(100vh - (5rem + 4.4rem))
    }
    body.ios .section-component.mission-top {
        top: calc(5rem + 4.4rem)
    }
    body.ios .section-component.mission-rolling {
        top: calc(23.8rem + 4.4rem)
    }
    body.ios .page-inner-scroll.money-mission.first-lock-entry.scroll-top .section-component.mission-rolling {
        top: calc(24.3rem + 4.4rem)
    }
    body.ios .container-component.container-fixed {
        padding-top: calc(5rem + 4.4rem)
    }
    body.ios .page-inner-scroll.no-overscroll-y .container-component {
        padding-top: calc(5rem + 4.4rem)
    }
    body.ios .popup-dialog.ui-full .popup-group.mission-talisman:after {
        background-color: transparent
    }
    body.ios .popup-dialog.ui-full .popup-group.coin-full-wrap:after {
        background-color: transparent
    }
    body.ios .popup-dialog.ui-full .popup-group.transparent:after {
        background-color: transparent
    }
    body.ios .component-invest-calendar {
        top: calc(5rem + 4.4rem)
    }
    body.ios .page-inner-scroll.scrolling .component-tab.financial-scam {
        top: calc(5rem + 4.4rem)
    }
    body.ios .component-tab.sticky-logotab {
        top: calc(5rem + 4.4rem)
    }
    body.ios .tooltip-focus-group .tooltip-area.align-bottom.digit-signature {
        top: calc(2.2rem + 4.4rem)
    }
    body.ios .weekly-invest-main-bg {
        margin-top: calc(var(--header-height) * -1 - 4.4rem);
        height: calc(var(--weekly-invest-height) + 4.4rem)
    }
    body.ios .weekly-invest-main .extra-cash,
    body.ios .weekly-invest-main .gauge,
    body.ios .weekly-invest-main-inner {
        margin-top: 4.4rem
    }
    html.ios.statusExpension .content-savings.expired {
        height: calc(4.4rem + 53.9rem)
    }
    html.ios.statusExpension .content-savings.expired {
        height: calc(4.4rem + 53.9rem)
    }
    html.ios.statusExpension .content-savings {
        height: calc(4.4rem + 44.8rem)
    }
    html.ios.statusExpension .content-savings .img-area {
        top: 4.4rem
    }
    html.ios.statusExpension .content-savings .prodname-info {
        top: calc(4.4rem + 30.8rem)
    }
    html.ios.statusExpension .content-savings .kds-banner-card {
        top: calc(4.4rem + 42.1rem)
    }
    html.ios.statusExpension .savings-scroll .component-header::before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 4.4rem;
        background: var(--bg-pri-base)
    }
    html.ios.statusExpension .savings-scroll .component-fixed-bottom {
        min-height: calc(100vh - 5rem - 4.4rem - 4rem)
    }
    html.ios.statusExpension .container-component.ai-quiz.h-center .section-component {
        height: calc(100% - (16.2rem + 4.4rem + 4rem))
    }
    html.ios.statusExpension .container-component.view-center .section-component {
        height: calc(100% - (16.2rem + 4.4rem + 4rem))
    }
    html.ios.statusExpension .section-component.alarm-nodata {
        height: calc(100vh - (5rem + 4.4rem + 4rem))
    }
    html.ios.statusExpension .container-component.today-coupon.h-center .section-component {
        height: calc(100% - (20.2rem + 4.4rem + 4rem))
    }
    html.ios.statusExpension .section-component.stars-type2 {
        padding-top: calc(4.8rem + 4.4rem);
        padding-bottom: calc(8rem + 4rem)
    }
    html.ios.statusExpension .page-inner-scroll.scrolling .component-card-sticky {
        top: calc(4.4rem + 5rem)
    }
    body.ios .content-savings.expired {
        height: calc(4.4rem + 53.9rem)
    }
    body.ios .content-savings.expired {
        height: calc(4.4rem + 53.9rem)
    }
    body.ios .content-savings {
        height: calc(4.4rem + 44.8rem)
    }
    body.ios .content-savings .img-area {
        top: 4.4rem
    }
    body.ios .content-savings .prodname-info {
        top: calc(4.4rem + 30.8rem)
    }
    body.ios .content-savings .kds-banner-card {
        top: calc(4.4rem + 42.1rem)
    }
    body.ios .savings-scroll .component-header::before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 4.4rem;
        background: var(--bg-pri-base)
    }
    body.ios .savings-scroll .component-fixed-bottom {
        min-height: calc(100vh - 5rem - 4.4rem - 4rem)
    }
    body.ios .container-component.ai-quiz.h-center .section-component {
        height: calc(100% - (16.2rem + 4.4rem + 4rem))
    }
    body.ios .container-component.view-center .section-component {
        height: calc(100% - (16.2rem + 4.4rem + 4rem))
    }
    body.ios .section-component.alarm-nodata {
        height: calc(100vh - (5rem + 4.4rem + 4rem))
    }
    body.ios .container-component.today-coupon.h-center .section-component {
        height: calc(100% - (20.2rem + 4.4rem + 4rem))
    }
    body.ios .section-component.stars-type2 {
        padding-top: calc(4.8rem + 4.4rem);
        padding-bottom: calc(8rem + 4rem)
    }
    body.ios .page-inner-scroll.scrolling .component-card-sticky {
        top: calc(4.4rem + 5rem)
    }
}

/*! iPhone 14+ */

@media only screen and (device-width: 426px) and (device-height: 926px) and (-webkit-device-pixel-ratio: 3) {
    /*! mixin :공통 - 헤더영역 */
    html.ios.statusExpension .component-header {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .popup-header .component-header {
        padding-top: 0
    }
    /*! 홈 - 일반 */
    html.ios.statusExpension .home-default .main-container-component.bg-main {
        padding-top: calc(4.4rem + 5.6rem)
    }
    /*! 홈 - 추천 */
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"].scrolling .component-tab.sticky-tab {
        top: calc(4.4rem + 0.2rem)
    }
    /*! 홈 - 혜택 */
    html.ios.statusExpension .page-inner-scroll.scrolling .component-tab.sticky-tab02 .tab-round-group {
        top: calc(4.4rem + 5rem)
    }
    /*! 홈 - 타임라인 */
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"].scrolling .component-form-date {
        top: calc(4.4rem + 5rem + 0.2rem)
    }
    /*! 홈 - 순서변경 */
    html.ios.statusExpension .page-inner-scroll.scrolling .component-text-simple.fixed-top {
        top: calc(4.4rem + 0.9rem)
    }
    /*! 공통 - 풀팝업일때 */
    html.ios.statusExpension .popup-dialog.ui-full .popup-group,
    html.ios.statusExpension .popup-dialog.ui-full-change .popup-group,
    html.ios.statusExpension .popup-dialog.ui-full-change.plus-box-event-pop .popup-group {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group:after {
        content: '';
        height: 4.4rem;
        background-color: var(--color-w100, #fff);
        position: fixed;
        top: 0;
        left: 0;
        width: 100%
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group:after {
        display: none
    }
    html.ios.statusExpension .popup-dialog.ui-full-change.plus-box-event-pop .interest-group-top .ani-step1-1 {
        margin-top: 8.2rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.shopping:after {
        background: var(--color-in700)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.shopping.bg-white:after {
        background-color: var(--color-w100, #fff)
    }
    /*! 홈 개편 */
    html.ios.statusExpension .component-header.main {
        padding-top: calc(4.4rem + 0.6rem)
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh.pull-home {
        padding-top: 0;
        margin-top: 4.4rem
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: 0.6rem
    }
    html.ios.statusExpension .scrolling .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: calc(4.4rem + 0.6rem)
    }
    html.ios.statusExpension .component-tab.foru-tab-ver.scrollOn .tab-group.foru-type {
        top: calc(4.4rem)
    }
    html.ios.statusExpension .component-header.main+.component-tab.foru-tab-ver {
        top: calc(4.4rem + 5.6rem)
    }
    html.ios.statusExpension .component-main-bnf-tab {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .invest-home .tab-list-group.sticky-invest {
        top: calc(4.4rem + 5.6rem)
    }
    html.ios.statusExpension .component-ceo-calendar {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .component-ceo-my-account.type2 {
        padding-top: calc(4.4rem + 37rem)
    }
    html.ios.statusExpension .container-component-coach .coach-item01 {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .component-header.search {
        padding-top: calc(4.4rem + 1.2rem);
        height: auto
    }
    html.ios.statusExpension .component-header.search.search-result {
        height: calc(4.4rem + 10.5rem)
    }
    html.ios.statusExpension .popup-inner .component-header.search.search-result {
        height: 10.5rem
    }
    html.ios.statusExpension .popup-inner .component-header.search.sticky {
        top: 4.4rem;
        padding-top: 1.2rem
    }
    html.ios.statusExpension .section-component.alarm .component-keyword {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .section-component.alarm .component-form-date {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .section-component.alarm.alarm-filter .component-form-date {
        top: calc(4.4rem + 10.6rem)
    }
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"] .component-main-refresh {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: 2.2rem
    }
    html.ios.statusExpension .safe-camp-kv .safe-camp-inner {
        margin-top: 4.4rem
    }
    /*! mixin :공통 - 헤더영역 */
    body.ios .component-header {
        padding-top: 4.4rem
    }
    body.ios .popup-header .component-header {
        padding-top: 0
    }
    /*! 홈 - 일반 */
    body.ios .home-default .main-container-component.bg-main {
        padding-top: calc(4.4rem + 5.6rem)
    }
    /*! 홈 - 추천 */
    body.ios .main-tab-container [class^="main-tab-content0"].scrolling .component-tab.sticky-tab {
        top: calc(4.4rem + 0.2rem)
    }
    /*! 홈 - 혜택 */
    body.ios .page-inner-scroll.scrolling .component-tab.sticky-tab02 .tab-round-group {
        top: calc(4.4rem + 5rem)
    }
    /*! 홈 - 타임라인 */
    body.ios .main-tab-container [class^="main-tab-content0"].scrolling .component-form-date {
        top: calc(4.4rem + 5rem + 0.2rem)
    }
    /*! 홈 - 순서변경 */
    body.ios .page-inner-scroll.scrolling .component-text-simple.fixed-top {
        top: calc(4.4rem + 0.9rem)
    }
    /*! 공통 - 풀팝업일때 */
    body.ios .popup-dialog.ui-full .popup-group,
    body.ios .popup-dialog.ui-full-change .popup-group,
    body.ios .popup-dialog.ui-full-change.plus-box-event-pop .popup-group {
        padding-top: 4.4rem
    }
    body.ios .popup-dialog.ui-full .popup-group:after {
        content: '';
        height: 4.4rem;
        background-color: var(--color-w100, #fff);
        position: fixed;
        top: 0;
        left: 0;
        width: 100%
    }
    body.ios .popup-dialog.ui-full .popup-group.popup-inandout-group:after {
        display: none
    }
    body.ios .popup-dialog.ui-full-change.plus-box-event-pop .interest-group-top .ani-step1-1 {
        margin-top: 8.2rem
    }
    body.ios .popup-dialog.ui-full .popup-group.shopping:after {
        background: var(--color-in700)
    }
    body.ios .popup-dialog.ui-full .popup-group.shopping.bg-white:after {
        background-color: var(--color-w100, #fff)
    }
    /*! 홈 개편 */
    body.ios .component-header.main {
        padding-top: calc(4.4rem + 0.6rem)
    }
    body.ios .ptr--ptr.ptr--refresh {
        padding-top: 4.4rem
    }
    body.ios .ptr--ptr.ptr--refresh.pull-home {
        padding-top: 0;
        margin-top: 4.4rem
    }
    body.ios .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: 0.6rem
    }
    body.ios .scrolling .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: calc(4.4rem + 0.6rem)
    }
    body.ios .component-tab.foru-tab-ver.scrollOn .tab-group.foru-type {
        top: calc(4.4rem)
    }
    body.ios .component-header.main+.component-tab.foru-tab-ver {
        top: calc(4.4rem + 5.6rem)
    }
    body.ios .component-main-bnf-tab {
        top: calc(4.4rem + 5rem)
    }
    body.ios .invest-home .tab-list-group.sticky-invest {
        top: calc(4.4rem + 5.6rem)
    }
    body.ios .component-ceo-calendar {
        top: calc(4.4rem + 5rem)
    }
    body.ios .component-ceo-my-account.type2 {
        padding-top: calc(4.4rem + 37rem)
    }
    body.ios .container-component-coach .coach-item01 {
        padding-top: 4.4rem
    }
    body.ios .component-header.search {
        padding-top: calc(4.4rem + 1.2rem);
        height: auto
    }
    body.ios .component-header.search.search-result {
        height: calc(4.4rem + 10.5rem)
    }
    body.ios .popup-inner .component-header.search.search-result {
        height: 10.5rem
    }
    body.ios .popup-inner .component-header.search.sticky {
        top: 4.4rem;
        padding-top: 1.2rem
    }
    body.ios .section-component.alarm .component-keyword {
        top: calc(4.4rem + 5rem)
    }
    body.ios .section-component.alarm .component-form-date {
        top: calc(4.4rem + 5rem)
    }
    body.ios .section-component.alarm.alarm-filter .component-form-date {
        top: calc(4.4rem + 10.6rem)
    }
    body.ios .main-tab-container [class^="main-tab-content0"] .component-main-refresh {
        top: calc(5rem + 4.4rem)
    }
    body.ios .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: 2.2rem
    }
    body.ios .safe-camp-kv .safe-camp-inner {
        margin-top: 4.4rem
    }
    /*! mixin :공통 - 헤더영역 */
    /*! 검색 - 공통 */
    html.ios.statusExpension .component-list.fixed,
    html.ios.statusExpension .component-search[class*="fixed"] {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .component-gathering-selected.active {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .component-gathering-selected.active+.component-search {
        top: calc(4.4rem + 16.2rem)
    }
    /*! 모임통장 - 모임홈 */
    html.ios.statusExpension .component-meet-profile {
        margin-top: -4.4rem
    }
    html.ios.statusExpension .component-meethome-profile {
        margin-top: calc(-5rem - 4.4rem)
    }
    /*! 상단 tab 고정 */
    html.ios.statusExpension .component-tab.food-cate-sticky,
    html.ios.statusExpension .component-text-simple+.component-tab.sticky,
    html.ios.statusExpension .section-component .component-tab.sticky,
    html.ios.statusExpension .section-component.living-price-tab .component-tab.sticky {
        top: calc(4.4rem + 5rem)
    }
    /*! 이체 */
    html.ios.statusExpension .component-header+.component-keypad {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .section-component-sticky {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .fixed-msg-card,
    html.ios.statusExpension .section-flex-colume {
        height: calc(100vh - calc(4.4rem + 5rem))
    }
    html.ios.statusExpension .section-flex-colume.type3 {
        height: calc(100vh - calc(4.4rem + 11rem))
    }
    html.ios.statusExpension .section-flex-colume.type4 {
        height: calc(100vh - calc(4.4rem + 19.4rem))
    }
    html.ios.statusExpension .component-card-sum-top.type2[class*="fixed"] {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .dim-moneytree-wrap {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .toast-wrap.ceo-type {
        bottom: auto;
        top: calc(4.4rem + 9.4rem)
    }
    html.ios.statusExpension .component-tab.sticky+.article-component .component-search[class*="fixed"] {
        top: calc(4.4rem + 11rem)
    }
    html.ios.statusExpension .container-component.shopping .component-text.sticky {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .container-component.shopping .component-text.sticky+.component-tab .tab-list-group.sticky {
        top: calc(4.4rem + 9rem)
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach.active {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: calc(4.4rem + 8.6rem)
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach .coach-close {
        padding-top: 0
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .inandout-calendar-inner {
        top: 4.4rem
    }
    html.ios.statusExpension .inandout-tab-wrap {
        top: calc(5.5rem + 4.4rem)
    }
    html.ios.statusExpension .section-component.custom-policy .component-tab.sticky-chip {
        top: calc(4.4rem + 11rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group.popup-inandout-pre-group {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .popup-inandout-group.pre-event .container-component-coach {
        top: 4.4rem
    }
    html.ios.statusExpension .ailive-today-quiz {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .tab-list-group[data-sticky-item] {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .container-component.ai-quiz .section-component.type2 {
        margin-top: calc(-5rem - 4.4rem);
        padding-top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .container-component.ai-quiz .section-component.type4 {
        margin-top: calc(-5rem - 4.4rem);
        padding-top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .fortune2025 .component-iframe {
        height: calc(100vh - (14.4rem + 4.4rem))
    }
    html.ios.statusExpension .container-component.common-cert.h-center .section-component.cert-section {
        min-height: calc(100vh - 24rem)
    }
    html.ios.statusExpension .section-component.stars-type1 {
        height: calc(100vh - (5rem + 4.4rem))
    }
    html.ios.statusExpension .section-component.mission-top {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .section-component.mission-rolling {
        top: calc(23.8rem + 4.4rem)
    }
    html.ios.statusExpension .page-inner-scroll.money-mission.first-lock-entry.scroll-top .section-component.mission-rolling {
        top: calc(24.3rem + 4.4rem)
    }
    html.ios.statusExpension .container-component.container-fixed {
        padding-top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .page-inner-scroll.no-overscroll-y .container-component {
        padding-top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.mission-talisman:after {
        background-color: transparent
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.coin-full-wrap:after {
        background-color: transparent
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.transparent:after {
        background-color: transparent
    }
    html.ios.statusExpension .component-invest-calendar {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .page-inner-scroll.scrolling .component-tab.financial-scam {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .component-tab.sticky-logotab {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .tooltip-focus-group .tooltip-area.align-bottom.digit-signature {
        top: calc(2.2rem + 4.4rem)
    }
    html.ios.statusExpension .weekly-invest-main-bg {
        margin-top: calc(var(--header-height) * -1 - 4.4rem);
        height: calc(var(--weekly-invest-height) + 4.4rem)
    }
    html.ios.statusExpension .weekly-invest-main .extra-cash,
    html.ios.statusExpension .weekly-invest-main .gauge,
    html.ios.statusExpension .weekly-invest-main-inner {
        margin-top: 4.4rem
    }
    /*! mixin :공통 - 헤더영역 */
    /*! 검색 - 공통 */
    body.ios .component-list.fixed,
    body.ios .component-search[class*="fixed"] {
        top: calc(4.4rem + 5rem)
    }
    body.ios .component-gathering-selected.active {
        top: calc(4.4rem + 5rem)
    }
    body.ios .component-gathering-selected.active+.component-search {
        top: calc(4.4rem + 16.2rem)
    }
    /*! 모임통장 - 모임홈 */
    body.ios .component-meet-profile {
        margin-top: -4.4rem
    }
    body.ios .component-meethome-profile {
        margin-top: calc(-5rem - 4.4rem)
    }
    /*! 상단 tab 고정 */
    body.ios .component-tab.food-cate-sticky,
    body.ios .component-text-simple+.component-tab.sticky,
    body.ios .section-component .component-tab.sticky,
    body.ios .section-component.living-price-tab .component-tab.sticky {
        top: calc(4.4rem + 5rem)
    }
    /*! 이체 */
    body.ios .component-header+.component-keypad {
        padding-top: 4.4rem
    }
    body.ios .section-component-sticky {
        top: calc(4.4rem + 5rem)
    }
    body.ios .fixed-msg-card,
    body.ios .section-flex-colume {
        height: calc(100vh - calc(4.4rem + 5rem))
    }
    body.ios .section-flex-colume.type3 {
        height: calc(100vh - calc(4.4rem + 11rem))
    }
    body.ios .section-flex-colume.type4 {
        height: calc(100vh - calc(4.4rem + 19.4rem))
    }
    body.ios .component-card-sum-top.type2[class*="fixed"] {
        top: calc(4.4rem + 5rem)
    }
    body.ios .dim-moneytree-wrap {
        top: calc(4.4rem + 5rem)
    }
    body.ios .toast-wrap.ceo-type {
        bottom: auto;
        top: calc(4.4rem + 9.4rem)
    }
    body.ios .component-tab.sticky+.article-component .component-search[class*="fixed"] {
        top: calc(4.4rem + 11rem)
    }
    body.ios .container-component.shopping .component-text.sticky {
        top: calc(4.4rem + 5rem)
    }
    body.ios .container-component.shopping .component-text.sticky+.component-tab .tab-list-group.sticky {
        top: calc(4.4rem + 9rem)
    }
    body.ios .page-inner-scroll.inandout-scroll .container-component-coach {
        padding-top: 4.4rem
    }
    body.ios .page-inner-scroll.inandout-scroll .container-component-coach.active {
        padding-top: 4.4rem
    }
    body.ios .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: calc(4.4rem + 8.6rem)
    }
    body.ios .page-inner-scroll.inandout-scroll .container-component-coach .coach-close {
        padding-top: 0
    }
    body.ios .page-inner-scroll.inandout-scroll .inandout-calendar-inner {
        top: 4.4rem
    }
    body.ios .inandout-tab-wrap {
        top: calc(5.5rem + 4.4rem)
    }
    body.ios .section-component.custom-policy .component-tab.sticky-chip {
        top: calc(4.4rem + 11rem)
    }
    body.ios .popup-dialog.ui-full .popup-group.popup-inandout-group.popup-inandout-pre-group {
        padding-top: 4.4rem
    }
    body.ios .popup-inandout-group.pre-event .container-component-coach {
        top: 4.4rem
    }
    body.ios .ailive-today-quiz {
        padding-top: 4.4rem
    }
    body.ios .tab-list-group[data-sticky-item] {
        top: calc(4.4rem + 5rem)
    }
    body.ios .container-component.ai-quiz .section-component.type2 {
        margin-top: calc(-5rem - 4.4rem);
        padding-top: calc(5rem + 4.4rem)
    }
    body.ios .container-component.ai-quiz .section-component.type4 {
        margin-top: calc(-5rem - 4.4rem);
        padding-top: calc(5rem + 4.4rem)
    }
    body.ios .fortune2025 .component-iframe {
        height: calc(100vh - (14.4rem + 4.4rem))
    }
    body.ios .container-component.common-cert.h-center .section-component.cert-section {
        min-height: calc(100vh - 24rem)
    }
    body.ios .section-component.stars-type1 {
        height: calc(100vh - (5rem + 4.4rem))
    }
    body.ios .section-component.mission-top {
        top: calc(5rem + 4.4rem)
    }
    body.ios .section-component.mission-rolling {
        top: calc(23.8rem + 4.4rem)
    }
    body.ios .page-inner-scroll.money-mission.first-lock-entry.scroll-top .section-component.mission-rolling {
        top: calc(24.3rem + 4.4rem)
    }
    body.ios .container-component.container-fixed {
        padding-top: calc(5rem + 4.4rem)
    }
    body.ios .page-inner-scroll.no-overscroll-y .container-component {
        padding-top: calc(5rem + 4.4rem)
    }
    body.ios .popup-dialog.ui-full .popup-group.mission-talisman:after {
        background-color: transparent
    }
    body.ios .popup-dialog.ui-full .popup-group.coin-full-wrap:after {
        background-color: transparent
    }
    body.ios .popup-dialog.ui-full .popup-group.transparent:after {
        background-color: transparent
    }
    body.ios .component-invest-calendar {
        top: calc(5rem + 4.4rem)
    }
    body.ios .page-inner-scroll.scrolling .component-tab.financial-scam {
        top: calc(5rem + 4.4rem)
    }
    body.ios .component-tab.sticky-logotab {
        top: calc(5rem + 4.4rem)
    }
    body.ios .tooltip-focus-group .tooltip-area.align-bottom.digit-signature {
        top: calc(2.2rem + 4.4rem)
    }
    body.ios .weekly-invest-main-bg {
        margin-top: calc(var(--header-height) * -1 - 4.4rem);
        height: calc(var(--weekly-invest-height) + 4.4rem)
    }
    body.ios .weekly-invest-main .extra-cash,
    body.ios .weekly-invest-main .gauge,
    body.ios .weekly-invest-main-inner {
        margin-top: 4.4rem
    }
    html.ios.statusExpension .content-savings.expired {
        height: calc(4.4rem + 53.9rem)
    }
    html.ios.statusExpension .content-savings.expired {
        height: calc(4.4rem + 53.9rem)
    }
    html.ios.statusExpension .content-savings {
        height: calc(4.4rem + 44.8rem)
    }
    html.ios.statusExpension .content-savings .img-area {
        top: 4.4rem
    }
    html.ios.statusExpension .content-savings .prodname-info {
        top: calc(4.4rem + 30.8rem)
    }
    html.ios.statusExpension .content-savings .kds-banner-card {
        top: calc(4.4rem + 42.1rem)
    }
    html.ios.statusExpension .savings-scroll .component-header::before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 4.4rem;
        background: var(--bg-pri-base)
    }
    html.ios.statusExpension .savings-scroll .component-fixed-bottom {
        min-height: calc(100vh - 5rem - 4.4rem - 4rem)
    }
    html.ios.statusExpension .container-component.ai-quiz.h-center .section-component {
        height: calc(100% - (16.2rem + 4.4rem + 4rem))
    }
    html.ios.statusExpension .container-component.view-center .section-component {
        height: calc(100% - (16.2rem + 4.4rem + 4rem))
    }
    html.ios.statusExpension .section-component.alarm-nodata {
        height: calc(100vh - (5rem + 4.4rem + 4rem))
    }
    html.ios.statusExpension .container-component.today-coupon.h-center .section-component {
        height: calc(100% - (20.2rem + 4.4rem + 4rem))
    }
    html.ios.statusExpension .section-component.stars-type2 {
        padding-top: calc(4.8rem + 4.4rem);
        padding-bottom: calc(8rem + 4rem)
    }
    html.ios.statusExpension .page-inner-scroll.scrolling .component-card-sticky {
        top: calc(4.4rem + 5rem)
    }
    body.ios .content-savings.expired {
        height: calc(4.4rem + 53.9rem)
    }
    body.ios .content-savings.expired {
        height: calc(4.4rem + 53.9rem)
    }
    body.ios .content-savings {
        height: calc(4.4rem + 44.8rem)
    }
    body.ios .content-savings .img-area {
        top: 4.4rem
    }
    body.ios .content-savings .prodname-info {
        top: calc(4.4rem + 30.8rem)
    }
    body.ios .content-savings .kds-banner-card {
        top: calc(4.4rem + 42.1rem)
    }
    body.ios .savings-scroll .component-header::before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 4.4rem;
        background: var(--bg-pri-base)
    }
    body.ios .savings-scroll .component-fixed-bottom {
        min-height: calc(100vh - 5rem - 4.4rem - 4rem)
    }
    body.ios .container-component.ai-quiz.h-center .section-component {
        height: calc(100% - (16.2rem + 4.4rem + 4rem))
    }
    body.ios .container-component.view-center .section-component {
        height: calc(100% - (16.2rem + 4.4rem + 4rem))
    }
    body.ios .section-component.alarm-nodata {
        height: calc(100vh - (5rem + 4.4rem + 4rem))
    }
    body.ios .container-component.today-coupon.h-center .section-component {
        height: calc(100% - (20.2rem + 4.4rem + 4rem))
    }
    body.ios .section-component.stars-type2 {
        padding-top: calc(4.8rem + 4.4rem);
        padding-bottom: calc(8rem + 4rem)
    }
    body.ios .page-inner-scroll.scrolling .component-card-sticky {
        top: calc(4.4rem + 5rem)
    }
}

/*! iPhone 14 Pro Max, 15+, 15 Pro Max */

@media only screen and (device-width: 430px) and (device-height: 932px) and (-webkit-device-pixel-ratio: 3) {
    /*! mixin :공통 - 헤더영역 */
    html.ios.statusExpension .component-header {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .popup-header .component-header {
        padding-top: 0
    }
    /*! 홈 - 일반 */
    html.ios.statusExpension .home-default .main-container-component.bg-main {
        padding-top: calc(4.4rem + 5.6rem)
    }
    /*! 홈 - 추천 */
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"].scrolling .component-tab.sticky-tab {
        top: calc(4.4rem + 0.2rem)
    }
    /*! 홈 - 혜택 */
    html.ios.statusExpension .page-inner-scroll.scrolling .component-tab.sticky-tab02 .tab-round-group {
        top: calc(4.4rem + 5rem)
    }
    /*! 홈 - 타임라인 */
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"].scrolling .component-form-date {
        top: calc(4.4rem + 5rem + 0.2rem)
    }
    /*! 홈 - 순서변경 */
    html.ios.statusExpension .page-inner-scroll.scrolling .component-text-simple.fixed-top {
        top: calc(4.4rem + 0.9rem)
    }
    /*! 공통 - 풀팝업일때 */
    html.ios.statusExpension .popup-dialog.ui-full .popup-group,
    html.ios.statusExpension .popup-dialog.ui-full-change .popup-group,
    html.ios.statusExpension .popup-dialog.ui-full-change.plus-box-event-pop .popup-group {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group:after {
        content: '';
        height: 4.4rem;
        background-color: var(--color-w100, #fff);
        position: fixed;
        top: 0;
        left: 0;
        width: 100%
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group:after {
        display: none
    }
    html.ios.statusExpension .popup-dialog.ui-full-change.plus-box-event-pop .interest-group-top .ani-step1-1 {
        margin-top: 8.2rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.shopping:after {
        background: var(--color-in700)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.shopping.bg-white:after {
        background-color: var(--color-w100, #fff)
    }
    /*! 홈 개편 */
    html.ios.statusExpension .component-header.main {
        padding-top: calc(4.4rem + 0.6rem)
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh.pull-home {
        padding-top: 0;
        margin-top: 4.4rem
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: 0.6rem
    }
    html.ios.statusExpension .scrolling .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: calc(4.4rem + 0.6rem)
    }
    html.ios.statusExpension .component-tab.foru-tab-ver.scrollOn .tab-group.foru-type {
        top: calc(4.4rem)
    }
    html.ios.statusExpension .component-header.main+.component-tab.foru-tab-ver {
        top: calc(4.4rem + 5.6rem)
    }
    html.ios.statusExpension .component-main-bnf-tab {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .invest-home .tab-list-group.sticky-invest {
        top: calc(4.4rem + 5.6rem)
    }
    html.ios.statusExpension .component-ceo-calendar {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .component-ceo-my-account.type2 {
        padding-top: calc(4.4rem + 37rem)
    }
    html.ios.statusExpension .container-component-coach .coach-item01 {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .component-header.search {
        padding-top: calc(4.4rem + 1.2rem);
        height: auto
    }
    html.ios.statusExpension .component-header.search.search-result {
        height: calc(4.4rem + 10.5rem)
    }
    html.ios.statusExpension .popup-inner .component-header.search.search-result {
        height: 10.5rem
    }
    html.ios.statusExpension .popup-inner .component-header.search.sticky {
        top: 4.4rem;
        padding-top: 1.2rem
    }
    html.ios.statusExpension .section-component.alarm .component-keyword {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .section-component.alarm .component-form-date {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .section-component.alarm.alarm-filter .component-form-date {
        top: calc(4.4rem + 10.6rem)
    }
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"] .component-main-refresh {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: 2.2rem
    }
    html.ios.statusExpension .safe-camp-kv .safe-camp-inner {
        margin-top: 4.4rem
    }
    /*! mixin :공통 - 헤더영역 */
    body.ios .component-header {
        padding-top: 4.4rem
    }
    body.ios .popup-header .component-header {
        padding-top: 0
    }
    /*! 홈 - 일반 */
    body.ios .home-default .main-container-component.bg-main {
        padding-top: calc(4.4rem + 5.6rem)
    }
    /*! 홈 - 추천 */
    body.ios .main-tab-container [class^="main-tab-content0"].scrolling .component-tab.sticky-tab {
        top: calc(4.4rem + 0.2rem)
    }
    /*! 홈 - 혜택 */
    body.ios .page-inner-scroll.scrolling .component-tab.sticky-tab02 .tab-round-group {
        top: calc(4.4rem + 5rem)
    }
    /*! 홈 - 타임라인 */
    body.ios .main-tab-container [class^="main-tab-content0"].scrolling .component-form-date {
        top: calc(4.4rem + 5rem + 0.2rem)
    }
    /*! 홈 - 순서변경 */
    body.ios .page-inner-scroll.scrolling .component-text-simple.fixed-top {
        top: calc(4.4rem + 0.9rem)
    }
    /*! 공통 - 풀팝업일때 */
    body.ios .popup-dialog.ui-full .popup-group,
    body.ios .popup-dialog.ui-full-change .popup-group,
    body.ios .popup-dialog.ui-full-change.plus-box-event-pop .popup-group {
        padding-top: 4.4rem
    }
    body.ios .popup-dialog.ui-full .popup-group:after {
        content: '';
        height: 4.4rem;
        background-color: var(--color-w100, #fff);
        position: fixed;
        top: 0;
        left: 0;
        width: 100%
    }
    body.ios .popup-dialog.ui-full .popup-group.popup-inandout-group:after {
        display: none
    }
    body.ios .popup-dialog.ui-full-change.plus-box-event-pop .interest-group-top .ani-step1-1 {
        margin-top: 8.2rem
    }
    body.ios .popup-dialog.ui-full .popup-group.shopping:after {
        background: var(--color-in700)
    }
    body.ios .popup-dialog.ui-full .popup-group.shopping.bg-white:after {
        background-color: var(--color-w100, #fff)
    }
    /*! 홈 개편 */
    body.ios .component-header.main {
        padding-top: calc(4.4rem + 0.6rem)
    }
    body.ios .ptr--ptr.ptr--refresh {
        padding-top: 4.4rem
    }
    body.ios .ptr--ptr.ptr--refresh.pull-home {
        padding-top: 0;
        margin-top: 4.4rem
    }
    body.ios .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: 0.6rem
    }
    body.ios .scrolling .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: calc(4.4rem + 0.6rem)
    }
    body.ios .component-tab.foru-tab-ver.scrollOn .tab-group.foru-type {
        top: calc(4.4rem)
    }
    body.ios .component-header.main+.component-tab.foru-tab-ver {
        top: calc(4.4rem + 5.6rem)
    }
    body.ios .component-main-bnf-tab {
        top: calc(4.4rem + 5rem)
    }
    body.ios .invest-home .tab-list-group.sticky-invest {
        top: calc(4.4rem + 5.6rem)
    }
    body.ios .component-ceo-calendar {
        top: calc(4.4rem + 5rem)
    }
    body.ios .component-ceo-my-account.type2 {
        padding-top: calc(4.4rem + 37rem)
    }
    body.ios .container-component-coach .coach-item01 {
        padding-top: 4.4rem
    }
    body.ios .component-header.search {
        padding-top: calc(4.4rem + 1.2rem);
        height: auto
    }
    body.ios .component-header.search.search-result {
        height: calc(4.4rem + 10.5rem)
    }
    body.ios .popup-inner .component-header.search.search-result {
        height: 10.5rem
    }
    body.ios .popup-inner .component-header.search.sticky {
        top: 4.4rem;
        padding-top: 1.2rem
    }
    body.ios .section-component.alarm .component-keyword {
        top: calc(4.4rem + 5rem)
    }
    body.ios .section-component.alarm .component-form-date {
        top: calc(4.4rem + 5rem)
    }
    body.ios .section-component.alarm.alarm-filter .component-form-date {
        top: calc(4.4rem + 10.6rem)
    }
    body.ios .main-tab-container [class^="main-tab-content0"] .component-main-refresh {
        top: calc(5rem + 4.4rem)
    }
    body.ios .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: 2.2rem
    }
    body.ios .safe-camp-kv .safe-camp-inner {
        margin-top: 4.4rem
    }
    /*! mixin :공통 - 헤더영역 */
    /*! 검색 - 공통 */
    html.ios.statusExpension .component-list.fixed,
    html.ios.statusExpension .component-search[class*="fixed"] {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .component-gathering-selected.active {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .component-gathering-selected.active+.component-search {
        top: calc(4.4rem + 16.2rem)
    }
    /*! 모임통장 - 모임홈 */
    html.ios.statusExpension .component-meet-profile {
        margin-top: -4.4rem
    }
    html.ios.statusExpension .component-meethome-profile {
        margin-top: calc(-5rem - 4.4rem)
    }
    /*! 상단 tab 고정 */
    html.ios.statusExpension .component-tab.food-cate-sticky,
    html.ios.statusExpension .component-text-simple+.component-tab.sticky,
    html.ios.statusExpension .section-component .component-tab.sticky,
    html.ios.statusExpension .section-component.living-price-tab .component-tab.sticky {
        top: calc(4.4rem + 5rem)
    }
    /*! 이체 */
    html.ios.statusExpension .component-header+.component-keypad {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .section-component-sticky {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .fixed-msg-card,
    html.ios.statusExpension .section-flex-colume {
        height: calc(100vh - calc(4.4rem + 5rem))
    }
    html.ios.statusExpension .section-flex-colume.type3 {
        height: calc(100vh - calc(4.4rem + 11rem))
    }
    html.ios.statusExpension .section-flex-colume.type4 {
        height: calc(100vh - calc(4.4rem + 19.4rem))
    }
    html.ios.statusExpension .component-card-sum-top.type2[class*="fixed"] {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .dim-moneytree-wrap {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .toast-wrap.ceo-type {
        bottom: auto;
        top: calc(4.4rem + 9.4rem)
    }
    html.ios.statusExpension .component-tab.sticky+.article-component .component-search[class*="fixed"] {
        top: calc(4.4rem + 11rem)
    }
    html.ios.statusExpension .container-component.shopping .component-text.sticky {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .container-component.shopping .component-text.sticky+.component-tab .tab-list-group.sticky {
        top: calc(4.4rem + 9rem)
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach.active {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: calc(4.4rem + 8.6rem)
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach .coach-close {
        padding-top: 0
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .inandout-calendar-inner {
        top: 4.4rem
    }
    html.ios.statusExpension .inandout-tab-wrap {
        top: calc(5.5rem + 4.4rem)
    }
    html.ios.statusExpension .section-component.custom-policy .component-tab.sticky-chip {
        top: calc(4.4rem + 11rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group.popup-inandout-pre-group {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .popup-inandout-group.pre-event .container-component-coach {
        top: 4.4rem
    }
    html.ios.statusExpension .ailive-today-quiz {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .tab-list-group[data-sticky-item] {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .container-component.ai-quiz .section-component.type2 {
        margin-top: calc(-5rem - 4.4rem);
        padding-top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .container-component.ai-quiz .section-component.type4 {
        margin-top: calc(-5rem - 4.4rem);
        padding-top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .fortune2025 .component-iframe {
        height: calc(100vh - (14.4rem + 4.4rem))
    }
    html.ios.statusExpension .container-component.common-cert.h-center .section-component.cert-section {
        min-height: calc(100vh - 24rem)
    }
    html.ios.statusExpension .section-component.stars-type1 {
        height: calc(100vh - (5rem + 4.4rem))
    }
    html.ios.statusExpension .section-component.mission-top {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .section-component.mission-rolling {
        top: calc(23.8rem + 4.4rem)
    }
    html.ios.statusExpension .page-inner-scroll.money-mission.first-lock-entry.scroll-top .section-component.mission-rolling {
        top: calc(24.3rem + 4.4rem)
    }
    html.ios.statusExpension .container-component.container-fixed {
        padding-top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .page-inner-scroll.no-overscroll-y .container-component {
        padding-top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.mission-talisman:after {
        background-color: transparent
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.coin-full-wrap:after {
        background-color: transparent
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.transparent:after {
        background-color: transparent
    }
    html.ios.statusExpension .component-invest-calendar {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .page-inner-scroll.scrolling .component-tab.financial-scam {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .component-tab.sticky-logotab {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .tooltip-focus-group .tooltip-area.align-bottom.digit-signature {
        top: calc(2.2rem + 4.4rem)
    }
    html.ios.statusExpension .weekly-invest-main-bg {
        margin-top: calc(var(--header-height) * -1 - 4.4rem);
        height: calc(var(--weekly-invest-height) + 4.4rem)
    }
    html.ios.statusExpension .weekly-invest-main .extra-cash,
    html.ios.statusExpension .weekly-invest-main .gauge,
    html.ios.statusExpension .weekly-invest-main-inner {
        margin-top: 4.4rem
    }
    /*! mixin :공통 - 헤더영역 */
    /*! 검색 - 공통 */
    body.ios .component-list.fixed,
    body.ios .component-search[class*="fixed"] {
        top: calc(4.4rem + 5rem)
    }
    body.ios .component-gathering-selected.active {
        top: calc(4.4rem + 5rem)
    }
    body.ios .component-gathering-selected.active+.component-search {
        top: calc(4.4rem + 16.2rem)
    }
    /*! 모임통장 - 모임홈 */
    body.ios .component-meet-profile {
        margin-top: -4.4rem
    }
    body.ios .component-meethome-profile {
        margin-top: calc(-5rem - 4.4rem)
    }
    /*! 상단 tab 고정 */
    body.ios .component-tab.food-cate-sticky,
    body.ios .component-text-simple+.component-tab.sticky,
    body.ios .section-component .component-tab.sticky,
    body.ios .section-component.living-price-tab .component-tab.sticky {
        top: calc(4.4rem + 5rem)
    }
    /*! 이체 */
    body.ios .component-header+.component-keypad {
        padding-top: 4.4rem
    }
    body.ios .section-component-sticky {
        top: calc(4.4rem + 5rem)
    }
    body.ios .fixed-msg-card,
    body.ios .section-flex-colume {
        height: calc(100vh - calc(4.4rem + 5rem))
    }
    body.ios .section-flex-colume.type3 {
        height: calc(100vh - calc(4.4rem + 11rem))
    }
    body.ios .section-flex-colume.type4 {
        height: calc(100vh - calc(4.4rem + 19.4rem))
    }
    body.ios .component-card-sum-top.type2[class*="fixed"] {
        top: calc(4.4rem + 5rem)
    }
    body.ios .dim-moneytree-wrap {
        top: calc(4.4rem + 5rem)
    }
    body.ios .toast-wrap.ceo-type {
        bottom: auto;
        top: calc(4.4rem + 9.4rem)
    }
    body.ios .component-tab.sticky+.article-component .component-search[class*="fixed"] {
        top: calc(4.4rem + 11rem)
    }
    body.ios .container-component.shopping .component-text.sticky {
        top: calc(4.4rem + 5rem)
    }
    body.ios .container-component.shopping .component-text.sticky+.component-tab .tab-list-group.sticky {
        top: calc(4.4rem + 9rem)
    }
    body.ios .page-inner-scroll.inandout-scroll .container-component-coach {
        padding-top: 4.4rem
    }
    body.ios .page-inner-scroll.inandout-scroll .container-component-coach.active {
        padding-top: 4.4rem
    }
    body.ios .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: calc(4.4rem + 8.6rem)
    }
    body.ios .page-inner-scroll.inandout-scroll .container-component-coach .coach-close {
        padding-top: 0
    }
    body.ios .page-inner-scroll.inandout-scroll .inandout-calendar-inner {
        top: 4.4rem
    }
    body.ios .inandout-tab-wrap {
        top: calc(5.5rem + 4.4rem)
    }
    body.ios .section-component.custom-policy .component-tab.sticky-chip {
        top: calc(4.4rem + 11rem)
    }
    body.ios .popup-dialog.ui-full .popup-group.popup-inandout-group.popup-inandout-pre-group {
        padding-top: 4.4rem
    }
    body.ios .popup-inandout-group.pre-event .container-component-coach {
        top: 4.4rem
    }
    body.ios .ailive-today-quiz {
        padding-top: 4.4rem
    }
    body.ios .tab-list-group[data-sticky-item] {
        top: calc(4.4rem + 5rem)
    }
    body.ios .container-component.ai-quiz .section-component.type2 {
        margin-top: calc(-5rem - 4.4rem);
        padding-top: calc(5rem + 4.4rem)
    }
    body.ios .container-component.ai-quiz .section-component.type4 {
        margin-top: calc(-5rem - 4.4rem);
        padding-top: calc(5rem + 4.4rem)
    }
    body.ios .fortune2025 .component-iframe {
        height: calc(100vh - (14.4rem + 4.4rem))
    }
    body.ios .container-component.common-cert.h-center .section-component.cert-section {
        min-height: calc(100vh - 24rem)
    }
    body.ios .section-component.stars-type1 {
        height: calc(100vh - (5rem + 4.4rem))
    }
    body.ios .section-component.mission-top {
        top: calc(5rem + 4.4rem)
    }
    body.ios .section-component.mission-rolling {
        top: calc(23.8rem + 4.4rem)
    }
    body.ios .page-inner-scroll.money-mission.first-lock-entry.scroll-top .section-component.mission-rolling {
        top: calc(24.3rem + 4.4rem)
    }
    body.ios .container-component.container-fixed {
        padding-top: calc(5rem + 4.4rem)
    }
    body.ios .page-inner-scroll.no-overscroll-y .container-component {
        padding-top: calc(5rem + 4.4rem)
    }
    body.ios .popup-dialog.ui-full .popup-group.mission-talisman:after {
        background-color: transparent
    }
    body.ios .popup-dialog.ui-full .popup-group.coin-full-wrap:after {
        background-color: transparent
    }
    body.ios .popup-dialog.ui-full .popup-group.transparent:after {
        background-color: transparent
    }
    body.ios .component-invest-calendar {
        top: calc(5rem + 4.4rem)
    }
    body.ios .page-inner-scroll.scrolling .component-tab.financial-scam {
        top: calc(5rem + 4.4rem)
    }
    body.ios .component-tab.sticky-logotab {
        top: calc(5rem + 4.4rem)
    }
    body.ios .tooltip-focus-group .tooltip-area.align-bottom.digit-signature {
        top: calc(2.2rem + 4.4rem)
    }
    body.ios .weekly-invest-main-bg {
        margin-top: calc(var(--header-height) * -1 - 4.4rem);
        height: calc(var(--weekly-invest-height) + 4.4rem)
    }
    body.ios .weekly-invest-main .extra-cash,
    body.ios .weekly-invest-main .gauge,
    body.ios .weekly-invest-main-inner {
        margin-top: 4.4rem
    }
    html.ios.statusExpension .content-savings.expired {
        height: calc(4.4rem + 53.9rem)
    }
    html.ios.statusExpension .content-savings.expired {
        height: calc(4.4rem + 53.9rem)
    }
    html.ios.statusExpension .content-savings {
        height: calc(4.4rem + 44.8rem)
    }
    html.ios.statusExpension .content-savings .img-area {
        top: 4.4rem
    }
    html.ios.statusExpension .content-savings .prodname-info {
        top: calc(4.4rem + 30.8rem)
    }
    html.ios.statusExpension .content-savings .kds-banner-card {
        top: calc(4.4rem + 42.1rem)
    }
    html.ios.statusExpension .savings-scroll .component-header::before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 4.4rem;
        background: var(--bg-pri-base)
    }
    html.ios.statusExpension .savings-scroll .component-fixed-bottom {
        min-height: calc(100vh - 5rem - 4.4rem - 4rem)
    }
    html.ios.statusExpension .container-component.ai-quiz.h-center .section-component {
        height: calc(100% - (16.2rem + 4.4rem + 4rem))
    }
    html.ios.statusExpension .container-component.view-center .section-component {
        height: calc(100% - (16.2rem + 4.4rem + 4rem))
    }
    html.ios.statusExpension .section-component.alarm-nodata {
        height: calc(100vh - (5rem + 4.4rem + 4rem))
    }
    html.ios.statusExpension .container-component.today-coupon.h-center .section-component {
        height: calc(100% - (20.2rem + 4.4rem + 4rem))
    }
    html.ios.statusExpension .section-component.stars-type2 {
        padding-top: calc(4.8rem + 4.4rem);
        padding-bottom: calc(8rem + 4rem)
    }
    html.ios.statusExpension .page-inner-scroll.scrolling .component-card-sticky {
        top: calc(4.4rem + 5rem)
    }
    body.ios .content-savings.expired {
        height: calc(4.4rem + 53.9rem)
    }
    body.ios .content-savings.expired {
        height: calc(4.4rem + 53.9rem)
    }
    body.ios .content-savings {
        height: calc(4.4rem + 44.8rem)
    }
    body.ios .content-savings .img-area {
        top: 4.4rem
    }
    body.ios .content-savings .prodname-info {
        top: calc(4.4rem + 30.8rem)
    }
    body.ios .content-savings .kds-banner-card {
        top: calc(4.4rem + 42.1rem)
    }
    body.ios .savings-scroll .component-header::before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 4.4rem;
        background: var(--bg-pri-base)
    }
    body.ios .savings-scroll .component-fixed-bottom {
        min-height: calc(100vh - 5rem - 4.4rem - 4rem)
    }
    body.ios .container-component.ai-quiz.h-center .section-component {
        height: calc(100% - (16.2rem + 4.4rem + 4rem))
    }
    body.ios .container-component.view-center .section-component {
        height: calc(100% - (16.2rem + 4.4rem + 4rem))
    }
    body.ios .section-component.alarm-nodata {
        height: calc(100vh - (5rem + 4.4rem + 4rem))
    }
    body.ios .container-component.today-coupon.h-center .section-component {
        height: calc(100% - (20.2rem + 4.4rem + 4rem))
    }
    body.ios .section-component.stars-type2 {
        padding-top: calc(4.8rem + 4.4rem);
        padding-bottom: calc(8rem + 4rem)
    }
    body.ios .page-inner-scroll.scrolling .component-card-sticky {
        top: calc(4.4rem + 5rem)
    }
}

/*! iPhone 16 Pro Max */

@media only screen and (device-width: 440px) and (device-height: 956px) and (-webkit-device-pixel-ratio: 3) {
    /*! mixin :공통 - 헤더영역 */
    html.ios.statusExpension .component-header {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .popup-header .component-header {
        padding-top: 0
    }
    /*! 홈 - 일반 */
    html.ios.statusExpension .home-default .main-container-component.bg-main {
        padding-top: calc(4.4rem + 5.6rem)
    }
    /*! 홈 - 추천 */
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"].scrolling .component-tab.sticky-tab {
        top: calc(4.4rem + 0.2rem)
    }
    /*! 홈 - 혜택 */
    html.ios.statusExpension .page-inner-scroll.scrolling .component-tab.sticky-tab02 .tab-round-group {
        top: calc(4.4rem + 5rem)
    }
    /*! 홈 - 타임라인 */
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"].scrolling .component-form-date {
        top: calc(4.4rem + 5rem + 0.2rem)
    }
    /*! 홈 - 순서변경 */
    html.ios.statusExpension .page-inner-scroll.scrolling .component-text-simple.fixed-top {
        top: calc(4.4rem + 0.9rem)
    }
    /*! 공통 - 풀팝업일때 */
    html.ios.statusExpension .popup-dialog.ui-full .popup-group,
    html.ios.statusExpension .popup-dialog.ui-full-change .popup-group,
    html.ios.statusExpension .popup-dialog.ui-full-change.plus-box-event-pop .popup-group {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group:after {
        content: '';
        height: 4.4rem;
        background-color: var(--color-w100, #fff);
        position: fixed;
        top: 0;
        left: 0;
        width: 100%
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group:after {
        display: none
    }
    html.ios.statusExpension .popup-dialog.ui-full-change.plus-box-event-pop .interest-group-top .ani-step1-1 {
        margin-top: 8.2rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.shopping:after {
        background: var(--color-in700)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.shopping.bg-white:after {
        background-color: var(--color-w100, #fff)
    }
    /*! 홈 개편 */
    html.ios.statusExpension .component-header.main {
        padding-top: calc(4.4rem + 0.6rem)
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh.pull-home {
        padding-top: 0;
        margin-top: 4.4rem
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: 0.6rem
    }
    html.ios.statusExpension .scrolling .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: calc(4.4rem + 0.6rem)
    }
    html.ios.statusExpension .component-tab.foru-tab-ver.scrollOn .tab-group.foru-type {
        top: calc(4.4rem)
    }
    html.ios.statusExpension .component-header.main+.component-tab.foru-tab-ver {
        top: calc(4.4rem + 5.6rem)
    }
    html.ios.statusExpension .component-main-bnf-tab {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .invest-home .tab-list-group.sticky-invest {
        top: calc(4.4rem + 5.6rem)
    }
    html.ios.statusExpension .component-ceo-calendar {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .component-ceo-my-account.type2 {
        padding-top: calc(4.4rem + 37rem)
    }
    html.ios.statusExpension .container-component-coach .coach-item01 {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .component-header.search {
        padding-top: calc(4.4rem + 1.2rem);
        height: auto
    }
    html.ios.statusExpension .component-header.search.search-result {
        height: calc(4.4rem + 10.5rem)
    }
    html.ios.statusExpension .popup-inner .component-header.search.search-result {
        height: 10.5rem
    }
    html.ios.statusExpension .popup-inner .component-header.search.sticky {
        top: 4.4rem;
        padding-top: 1.2rem
    }
    html.ios.statusExpension .section-component.alarm .component-keyword {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .section-component.alarm .component-form-date {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .section-component.alarm.alarm-filter .component-form-date {
        top: calc(4.4rem + 10.6rem)
    }
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"] .component-main-refresh {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: 2.2rem
    }
    html.ios.statusExpension .safe-camp-kv .safe-camp-inner {
        margin-top: 4.4rem
    }
    /*! mixin :공통 - 헤더영역 */
    body.ios .component-header {
        padding-top: 4.4rem
    }
    body.ios .popup-header .component-header {
        padding-top: 0
    }
    /*! 홈 - 일반 */
    body.ios .home-default .main-container-component.bg-main {
        padding-top: calc(4.4rem + 5.6rem)
    }
    /*! 홈 - 추천 */
    body.ios .main-tab-container [class^="main-tab-content0"].scrolling .component-tab.sticky-tab {
        top: calc(4.4rem + 0.2rem)
    }
    /*! 홈 - 혜택 */
    body.ios .page-inner-scroll.scrolling .component-tab.sticky-tab02 .tab-round-group {
        top: calc(4.4rem + 5rem)
    }
    /*! 홈 - 타임라인 */
    body.ios .main-tab-container [class^="main-tab-content0"].scrolling .component-form-date {
        top: calc(4.4rem + 5rem + 0.2rem)
    }
    /*! 홈 - 순서변경 */
    body.ios .page-inner-scroll.scrolling .component-text-simple.fixed-top {
        top: calc(4.4rem + 0.9rem)
    }
    /*! 공통 - 풀팝업일때 */
    body.ios .popup-dialog.ui-full .popup-group,
    body.ios .popup-dialog.ui-full-change .popup-group,
    body.ios .popup-dialog.ui-full-change.plus-box-event-pop .popup-group {
        padding-top: 4.4rem
    }
    body.ios .popup-dialog.ui-full .popup-group:after {
        content: '';
        height: 4.4rem;
        background-color: var(--color-w100, #fff);
        position: fixed;
        top: 0;
        left: 0;
        width: 100%
    }
    body.ios .popup-dialog.ui-full .popup-group.popup-inandout-group:after {
        display: none
    }
    body.ios .popup-dialog.ui-full-change.plus-box-event-pop .interest-group-top .ani-step1-1 {
        margin-top: 8.2rem
    }
    body.ios .popup-dialog.ui-full .popup-group.shopping:after {
        background: var(--color-in700)
    }
    body.ios .popup-dialog.ui-full .popup-group.shopping.bg-white:after {
        background-color: var(--color-w100, #fff)
    }
    /*! 홈 개편 */
    body.ios .component-header.main {
        padding-top: calc(4.4rem + 0.6rem)
    }
    body.ios .ptr--ptr.ptr--refresh {
        padding-top: 4.4rem
    }
    body.ios .ptr--ptr.ptr--refresh.pull-home {
        padding-top: 0;
        margin-top: 4.4rem
    }
    body.ios .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: 0.6rem
    }
    body.ios .scrolling .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: calc(4.4rem + 0.6rem)
    }
    body.ios .component-tab.foru-tab-ver.scrollOn .tab-group.foru-type {
        top: calc(4.4rem)
    }
    body.ios .component-header.main+.component-tab.foru-tab-ver {
        top: calc(4.4rem + 5.6rem)
    }
    body.ios .component-main-bnf-tab {
        top: calc(4.4rem + 5rem)
    }
    body.ios .invest-home .tab-list-group.sticky-invest {
        top: calc(4.4rem + 5.6rem)
    }
    body.ios .component-ceo-calendar {
        top: calc(4.4rem + 5rem)
    }
    body.ios .component-ceo-my-account.type2 {
        padding-top: calc(4.4rem + 37rem)
    }
    body.ios .container-component-coach .coach-item01 {
        padding-top: 4.4rem
    }
    body.ios .component-header.search {
        padding-top: calc(4.4rem + 1.2rem);
        height: auto
    }
    body.ios .component-header.search.search-result {
        height: calc(4.4rem + 10.5rem)
    }
    body.ios .popup-inner .component-header.search.search-result {
        height: 10.5rem
    }
    body.ios .popup-inner .component-header.search.sticky {
        top: 4.4rem;
        padding-top: 1.2rem
    }
    body.ios .section-component.alarm .component-keyword {
        top: calc(4.4rem + 5rem)
    }
    body.ios .section-component.alarm .component-form-date {
        top: calc(4.4rem + 5rem)
    }
    body.ios .section-component.alarm.alarm-filter .component-form-date {
        top: calc(4.4rem + 10.6rem)
    }
    body.ios .main-tab-container [class^="main-tab-content0"] .component-main-refresh {
        top: calc(5rem + 4.4rem)
    }
    body.ios .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: 2.2rem
    }
    body.ios .safe-camp-kv .safe-camp-inner {
        margin-top: 4.4rem
    }
    /*! mixin :공통 - 헤더영역 */
    /*! 검색 - 공통 */
    html.ios.statusExpension .component-list.fixed,
    html.ios.statusExpension .component-search[class*="fixed"] {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .component-gathering-selected.active {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .component-gathering-selected.active+.component-search {
        top: calc(4.4rem + 16.2rem)
    }
    /*! 모임통장 - 모임홈 */
    html.ios.statusExpension .component-meet-profile {
        margin-top: -4.4rem
    }
    html.ios.statusExpension .component-meethome-profile {
        margin-top: calc(-5rem - 4.4rem)
    }
    /*! 상단 tab 고정 */
    html.ios.statusExpension .component-tab.food-cate-sticky,
    html.ios.statusExpension .component-text-simple+.component-tab.sticky,
    html.ios.statusExpension .section-component .component-tab.sticky,
    html.ios.statusExpension .section-component.living-price-tab .component-tab.sticky {
        top: calc(4.4rem + 5rem)
    }
    /*! 이체 */
    html.ios.statusExpension .component-header+.component-keypad {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .section-component-sticky {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .fixed-msg-card,
    html.ios.statusExpension .section-flex-colume {
        height: calc(100vh - calc(4.4rem + 5rem))
    }
    html.ios.statusExpension .section-flex-colume.type3 {
        height: calc(100vh - calc(4.4rem + 11rem))
    }
    html.ios.statusExpension .section-flex-colume.type4 {
        height: calc(100vh - calc(4.4rem + 19.4rem))
    }
    html.ios.statusExpension .component-card-sum-top.type2[class*="fixed"] {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .dim-moneytree-wrap {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .toast-wrap.ceo-type {
        bottom: auto;
        top: calc(4.4rem + 9.4rem)
    }
    html.ios.statusExpension .component-tab.sticky+.article-component .component-search[class*="fixed"] {
        top: calc(4.4rem + 11rem)
    }
    html.ios.statusExpension .container-component.shopping .component-text.sticky {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .container-component.shopping .component-text.sticky+.component-tab .tab-list-group.sticky {
        top: calc(4.4rem + 9rem)
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach.active {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: calc(4.4rem + 8.6rem)
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach .coach-close {
        padding-top: 0
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .inandout-calendar-inner {
        top: 4.4rem
    }
    html.ios.statusExpension .inandout-tab-wrap {
        top: calc(5.5rem + 4.4rem)
    }
    html.ios.statusExpension .section-component.custom-policy .component-tab.sticky-chip {
        top: calc(4.4rem + 11rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group.popup-inandout-pre-group {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .popup-inandout-group.pre-event .container-component-coach {
        top: 4.4rem
    }
    html.ios.statusExpension .ailive-today-quiz {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .tab-list-group[data-sticky-item] {
        top: calc(4.4rem + 5rem)
    }
    html.ios.statusExpension .container-component.ai-quiz .section-component.type2 {
        margin-top: calc(-5rem - 4.4rem);
        padding-top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .container-component.ai-quiz .section-component.type4 {
        margin-top: calc(-5rem - 4.4rem);
        padding-top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .fortune2025 .component-iframe {
        height: calc(100vh - (14.4rem + 4.4rem))
    }
    html.ios.statusExpension .container-component.common-cert.h-center .section-component.cert-section {
        min-height: calc(100vh - 24rem)
    }
    html.ios.statusExpension .section-component.stars-type1 {
        height: calc(100vh - (5rem + 4.4rem))
    }
    html.ios.statusExpension .section-component.mission-top {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .section-component.mission-rolling {
        top: calc(23.8rem + 4.4rem)
    }
    html.ios.statusExpension .page-inner-scroll.money-mission.first-lock-entry.scroll-top .section-component.mission-rolling {
        top: calc(24.3rem + 4.4rem)
    }
    html.ios.statusExpension .container-component.container-fixed {
        padding-top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .page-inner-scroll.no-overscroll-y .container-component {
        padding-top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.mission-talisman:after {
        background-color: transparent
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.coin-full-wrap:after {
        background-color: transparent
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.transparent:after {
        background-color: transparent
    }
    html.ios.statusExpension .component-invest-calendar {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .page-inner-scroll.scrolling .component-tab.financial-scam {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .component-tab.sticky-logotab {
        top: calc(5rem + 4.4rem)
    }
    html.ios.statusExpension .tooltip-focus-group .tooltip-area.align-bottom.digit-signature {
        top: calc(2.2rem + 4.4rem)
    }
    html.ios.statusExpension .weekly-invest-main-bg {
        margin-top: calc(var(--header-height) * -1 - 4.4rem);
        height: calc(var(--weekly-invest-height) + 4.4rem)
    }
    html.ios.statusExpension .weekly-invest-main .extra-cash,
    html.ios.statusExpension .weekly-invest-main .gauge,
    html.ios.statusExpension .weekly-invest-main-inner {
        margin-top: 4.4rem
    }
    /*! mixin :공통 - 헤더영역 */
    /*! 검색 - 공통 */
    body.ios .component-list.fixed,
    body.ios .component-search[class*="fixed"] {
        top: calc(4.4rem + 5rem)
    }
    body.ios .component-gathering-selected.active {
        top: calc(4.4rem + 5rem)
    }
    body.ios .component-gathering-selected.active+.component-search {
        top: calc(4.4rem + 16.2rem)
    }
    /*! 모임통장 - 모임홈 */
    body.ios .component-meet-profile {
        margin-top: -4.4rem
    }
    body.ios .component-meethome-profile {
        margin-top: calc(-5rem - 4.4rem)
    }
    /*! 상단 tab 고정 */
    body.ios .component-tab.food-cate-sticky,
    body.ios .component-text-simple+.component-tab.sticky,
    body.ios .section-component .component-tab.sticky,
    body.ios .section-component.living-price-tab .component-tab.sticky {
        top: calc(4.4rem + 5rem)
    }
    /*! 이체 */
    body.ios .component-header+.component-keypad {
        padding-top: 4.4rem
    }
    body.ios .section-component-sticky {
        top: calc(4.4rem + 5rem)
    }
    body.ios .fixed-msg-card,
    body.ios .section-flex-colume {
        height: calc(100vh - calc(4.4rem + 5rem))
    }
    body.ios .section-flex-colume.type3 {
        height: calc(100vh - calc(4.4rem + 11rem))
    }
    body.ios .section-flex-colume.type4 {
        height: calc(100vh - calc(4.4rem + 19.4rem))
    }
    body.ios .component-card-sum-top.type2[class*="fixed"] {
        top: calc(4.4rem + 5rem)
    }
    body.ios .dim-moneytree-wrap {
        top: calc(4.4rem + 5rem)
    }
    body.ios .toast-wrap.ceo-type {
        bottom: auto;
        top: calc(4.4rem + 9.4rem)
    }
    body.ios .component-tab.sticky+.article-component .component-search[class*="fixed"] {
        top: calc(4.4rem + 11rem)
    }
    body.ios .container-component.shopping .component-text.sticky {
        top: calc(4.4rem + 5rem)
    }
    body.ios .container-component.shopping .component-text.sticky+.component-tab .tab-list-group.sticky {
        top: calc(4.4rem + 9rem)
    }
    body.ios .page-inner-scroll.inandout-scroll .container-component-coach {
        padding-top: 4.4rem
    }
    body.ios .page-inner-scroll.inandout-scroll .container-component-coach.active {
        padding-top: 4.4rem
    }
    body.ios .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: calc(4.4rem + 8.6rem)
    }
    body.ios .page-inner-scroll.inandout-scroll .container-component-coach .coach-close {
        padding-top: 0
    }
    body.ios .page-inner-scroll.inandout-scroll .inandout-calendar-inner {
        top: 4.4rem
    }
    body.ios .inandout-tab-wrap {
        top: calc(5.5rem + 4.4rem)
    }
    body.ios .section-component.custom-policy .component-tab.sticky-chip {
        top: calc(4.4rem + 11rem)
    }
    body.ios .popup-dialog.ui-full .popup-group.popup-inandout-group.popup-inandout-pre-group {
        padding-top: 4.4rem
    }
    body.ios .popup-inandout-group.pre-event .container-component-coach {
        top: 4.4rem
    }
    body.ios .ailive-today-quiz {
        padding-top: 4.4rem
    }
    body.ios .tab-list-group[data-sticky-item] {
        top: calc(4.4rem + 5rem)
    }
    body.ios .container-component.ai-quiz .section-component.type2 {
        margin-top: calc(-5rem - 4.4rem);
        padding-top: calc(5rem + 4.4rem)
    }
    body.ios .container-component.ai-quiz .section-component.type4 {
        margin-top: calc(-5rem - 4.4rem);
        padding-top: calc(5rem + 4.4rem)
    }
    body.ios .fortune2025 .component-iframe {
        height: calc(100vh - (14.4rem + 4.4rem))
    }
    body.ios .container-component.common-cert.h-center .section-component.cert-section {
        min-height: calc(100vh - 24rem)
    }
    body.ios .section-component.stars-type1 {
        height: calc(100vh - (5rem + 4.4rem))
    }
    body.ios .section-component.mission-top {
        top: calc(5rem + 4.4rem)
    }
    body.ios .section-component.mission-rolling {
        top: calc(23.8rem + 4.4rem)
    }
    body.ios .page-inner-scroll.money-mission.first-lock-entry.scroll-top .section-component.mission-rolling {
        top: calc(24.3rem + 4.4rem)
    }
    body.ios .container-component.container-fixed {
        padding-top: calc(5rem + 4.4rem)
    }
    body.ios .page-inner-scroll.no-overscroll-y .container-component {
        padding-top: calc(5rem + 4.4rem)
    }
    body.ios .popup-dialog.ui-full .popup-group.mission-talisman:after {
        background-color: transparent
    }
    body.ios .popup-dialog.ui-full .popup-group.coin-full-wrap:after {
        background-color: transparent
    }
    body.ios .popup-dialog.ui-full .popup-group.transparent:after {
        background-color: transparent
    }
    body.ios .component-invest-calendar {
        top: calc(5rem + 4.4rem)
    }
    body.ios .page-inner-scroll.scrolling .component-tab.financial-scam {
        top: calc(5rem + 4.4rem)
    }
    body.ios .component-tab.sticky-logotab {
        top: calc(5rem + 4.4rem)
    }
    body.ios .tooltip-focus-group .tooltip-area.align-bottom.digit-signature {
        top: calc(2.2rem + 4.4rem)
    }
    body.ios .weekly-invest-main-bg {
        margin-top: calc(var(--header-height) * -1 - 4.4rem);
        height: calc(var(--weekly-invest-height) + 4.4rem)
    }
    body.ios .weekly-invest-main .extra-cash,
    body.ios .weekly-invest-main .gauge,
    body.ios .weekly-invest-main-inner {
        margin-top: 4.4rem
    }
    html.ios.statusExpension .content-savings.expired {
        height: calc(4.4rem + 53.9rem)
    }
    html.ios.statusExpension .content-savings.expired {
        height: calc(4.4rem + 53.9rem)
    }
    html.ios.statusExpension .content-savings {
        height: calc(4.4rem + 44.8rem)
    }
    html.ios.statusExpension .content-savings .img-area {
        top: 4.4rem
    }
    html.ios.statusExpension .content-savings .prodname-info {
        top: calc(4.4rem + 30.8rem)
    }
    html.ios.statusExpension .content-savings .kds-banner-card {
        top: calc(4.4rem + 42.1rem)
    }
    html.ios.statusExpension .savings-scroll .component-header::before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 4.4rem;
        background: var(--bg-pri-base)
    }
    html.ios.statusExpension .savings-scroll .component-fixed-bottom {
        min-height: calc(100vh - 5rem - 4.4rem - 4rem)
    }
    html.ios.statusExpension .container-component.ai-quiz.h-center .section-component {
        height: calc(100% - (16.2rem + 4.4rem + 4rem))
    }
    html.ios.statusExpension .container-component.view-center .section-component {
        height: calc(100% - (16.2rem + 4.4rem + 4rem))
    }
    html.ios.statusExpension .section-component.alarm-nodata {
        height: calc(100vh - (5rem + 4.4rem + 4rem))
    }
    html.ios.statusExpension .container-component.today-coupon.h-center .section-component {
        height: calc(100% - (20.2rem + 4.4rem + 4rem))
    }
    html.ios.statusExpension .section-component.stars-type2 {
        padding-top: calc(4.8rem + 4.4rem);
        padding-bottom: calc(8rem + 4rem)
    }
    html.ios.statusExpension .page-inner-scroll.scrolling .component-card-sticky {
        top: calc(4.4rem + 5rem)
    }
    body.ios .content-savings.expired {
        height: calc(4.4rem + 53.9rem)
    }
    body.ios .content-savings.expired {
        height: calc(4.4rem + 53.9rem)
    }
    body.ios .content-savings {
        height: calc(4.4rem + 44.8rem)
    }
    body.ios .content-savings .img-area {
        top: 4.4rem
    }
    body.ios .content-savings .prodname-info {
        top: calc(4.4rem + 30.8rem)
    }
    body.ios .content-savings .kds-banner-card {
        top: calc(4.4rem + 42.1rem)
    }
    body.ios .savings-scroll .component-header::before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 4.4rem;
        background: var(--bg-pri-base)
    }
    body.ios .savings-scroll .component-fixed-bottom {
        min-height: calc(100vh - 5rem - 4.4rem - 4rem)
    }
    body.ios .container-component.ai-quiz.h-center .section-component {
        height: calc(100% - (16.2rem + 4.4rem + 4rem))
    }
    body.ios .container-component.view-center .section-component {
        height: calc(100% - (16.2rem + 4.4rem + 4rem))
    }
    body.ios .section-component.alarm-nodata {
        height: calc(100vh - (5rem + 4.4rem + 4rem))
    }
    body.ios .container-component.today-coupon.h-center .section-component {
        height: calc(100% - (20.2rem + 4.4rem + 4rem))
    }
    body.ios .section-component.stars-type2 {
        padding-top: calc(4.8rem + 4.4rem);
        padding-bottom: calc(8rem + 4rem)
    }
    body.ios .page-inner-scroll.scrolling .component-card-sticky {
        top: calc(4.4rem + 5rem)
    }
}

/*!
* Status Bar top area android (상단바 영역과 컨텐츠 간격 컨트롤)
* 아이폰 일반 디바이스(노치(X)) : 20px;
*/

/*! 노치(X) 6+, 6s+, 7+, 8+ */

@media only screen and (device-width: 414px) and (device-height: 736px) and (-webkit-device-pixel-ratio: 3) {
    /*! mixin :공통 - 헤더영역 */
    html.ios.statusExpension .component-header {
        padding-top: 2rem
    }
    html.ios.statusExpension .popup-header .component-header {
        padding-top: 0
    }
    /*! 홈 - 일반 */
    html.ios.statusExpension .home-default .main-container-component.bg-main {
        padding-top: calc(2rem + 5.6rem)
    }
    /*! 홈 - 추천 */
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"].scrolling .component-tab.sticky-tab {
        top: calc(2rem + 0.2rem)
    }
    /*! 홈 - 혜택 */
    html.ios.statusExpension .page-inner-scroll.scrolling .component-tab.sticky-tab02 .tab-round-group {
        top: calc(2rem + 5rem)
    }
    /*! 홈 - 타임라인 */
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"].scrolling .component-form-date {
        top: calc(2rem + 5rem + 0.2rem)
    }
    /*! 홈 - 순서변경 */
    html.ios.statusExpension .page-inner-scroll.scrolling .component-text-simple.fixed-top {
        top: calc(2rem + 0.9rem)
    }
    /*! 공통 - 풀팝업일때 */
    html.ios.statusExpension .popup-dialog.ui-full .popup-group,
    html.ios.statusExpension .popup-dialog.ui-full-change .popup-group,
    html.ios.statusExpension .popup-dialog.ui-full-change.plus-box-event-pop .popup-group {
        padding-top: 2rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group:after {
        content: '';
        height: 2rem;
        background-color: var(--color-w100, #fff);
        position: fixed;
        top: 0;
        left: 0;
        width: 100%
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group:after {
        display: none
    }
    html.ios.statusExpension .popup-dialog.ui-full-change.plus-box-event-pop .interest-group-top .ani-step1-1 {
        margin-top: 8.2rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.shopping:after {
        background: var(--color-in700)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.shopping.bg-white:after {
        background-color: var(--color-w100, #fff)
    }
    /*! 홈 개편 */
    html.ios.statusExpension .component-header.main {
        padding-top: calc(2rem + 0.6rem)
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh {
        padding-top: 2rem
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh.pull-home {
        padding-top: 0;
        margin-top: 2rem
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: 0.6rem
    }
    html.ios.statusExpension .scrolling .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: calc(2rem + 0.6rem)
    }
    html.ios.statusExpension .component-tab.foru-tab-ver.scrollOn .tab-group.foru-type {
        top: calc(2rem)
    }
    html.ios.statusExpension .component-header.main+.component-tab.foru-tab-ver {
        top: calc(2rem + 5.6rem)
    }
    html.ios.statusExpension .component-main-bnf-tab {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .invest-home .tab-list-group.sticky-invest {
        top: calc(2rem + 5.6rem)
    }
    html.ios.statusExpension .component-ceo-calendar {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .component-ceo-my-account.type2 {
        padding-top: calc(2rem + 37rem)
    }
    html.ios.statusExpension .container-component-coach .coach-item01 {
        padding-top: 2rem
    }
    html.ios.statusExpension .component-header.search {
        padding-top: calc(2rem + 1.2rem);
        height: auto
    }
    html.ios.statusExpension .component-header.search.search-result {
        height: calc(2rem + 10.5rem)
    }
    html.ios.statusExpension .popup-inner .component-header.search.search-result {
        height: 10.5rem
    }
    html.ios.statusExpension .popup-inner .component-header.search.sticky {
        top: 2rem;
        padding-top: 1.2rem
    }
    html.ios.statusExpension .section-component.alarm .component-keyword {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .section-component.alarm .component-form-date {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .section-component.alarm.alarm-filter .component-form-date {
        top: calc(2rem + 10.6rem)
    }
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"] .component-main-refresh {
        top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: 2.2rem
    }
    html.ios.statusExpension .safe-camp-kv .safe-camp-inner {
        margin-top: 2rem
    }
    /*! mixin :공통 - 헤더영역 */
    body.ios.nonotch .component-header {
        padding-top: 2rem
    }
    body.ios.nonotch .popup-header .component-header {
        padding-top: 0
    }
    /*! 홈 - 일반 */
    body.ios.nonotch .home-default .main-container-component.bg-main {
        padding-top: calc(2rem + 5.6rem)
    }
    /*! 홈 - 추천 */
    body.ios.nonotch .main-tab-container [class^="main-tab-content0"].scrolling .component-tab.sticky-tab {
        top: calc(2rem + 0.2rem)
    }
    /*! 홈 - 혜택 */
    body.ios.nonotch .page-inner-scroll.scrolling .component-tab.sticky-tab02 .tab-round-group {
        top: calc(2rem + 5rem)
    }
    /*! 홈 - 타임라인 */
    body.ios.nonotch .main-tab-container [class^="main-tab-content0"].scrolling .component-form-date {
        top: calc(2rem + 5rem + 0.2rem)
    }
    /*! 홈 - 순서변경 */
    body.ios.nonotch .page-inner-scroll.scrolling .component-text-simple.fixed-top {
        top: calc(2rem + 0.9rem)
    }
    /*! 공통 - 풀팝업일때 */
    body.ios.nonotch .popup-dialog.ui-full .popup-group,
    body.ios.nonotch .popup-dialog.ui-full-change .popup-group,
    body.ios.nonotch .popup-dialog.ui-full-change.plus-box-event-pop .popup-group {
        padding-top: 2rem
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group:after {
        content: '';
        height: 2rem;
        background-color: var(--color-w100, #fff);
        position: fixed;
        top: 0;
        left: 0;
        width: 100%
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.popup-inandout-group:after {
        display: none
    }
    body.ios.nonotch .popup-dialog.ui-full-change.plus-box-event-pop .interest-group-top .ani-step1-1 {
        margin-top: 8.2rem
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.shopping:after {
        background: var(--color-in700)
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.shopping.bg-white:after {
        background-color: var(--color-w100, #fff)
    }
    /*! 홈 개편 */
    body.ios.nonotch .component-header.main {
        padding-top: calc(2rem + 0.6rem)
    }
    body.ios.nonotch .ptr--ptr.ptr--refresh {
        padding-top: 2rem
    }
    body.ios.nonotch .ptr--ptr.ptr--refresh.pull-home {
        padding-top: 0;
        margin-top: 2rem
    }
    body.ios.nonotch .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: 0.6rem
    }
    body.ios.nonotch .scrolling .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: calc(2rem + 0.6rem)
    }
    body.ios.nonotch .component-tab.foru-tab-ver.scrollOn .tab-group.foru-type {
        top: calc(2rem)
    }
    body.ios.nonotch .component-header.main+.component-tab.foru-tab-ver {
        top: calc(2rem + 5.6rem)
    }
    body.ios.nonotch .component-main-bnf-tab {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .invest-home .tab-list-group.sticky-invest {
        top: calc(2rem + 5.6rem)
    }
    body.ios.nonotch .component-ceo-calendar {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .component-ceo-my-account.type2 {
        padding-top: calc(2rem + 37rem)
    }
    body.ios.nonotch .container-component-coach .coach-item01 {
        padding-top: 2rem
    }
    body.ios.nonotch .component-header.search {
        padding-top: calc(2rem + 1.2rem);
        height: auto
    }
    body.ios.nonotch .component-header.search.search-result {
        height: calc(2rem + 10.5rem)
    }
    body.ios.nonotch .popup-inner .component-header.search.search-result {
        height: 10.5rem
    }
    body.ios.nonotch .popup-inner .component-header.search.sticky {
        top: 2rem;
        padding-top: 1.2rem
    }
    body.ios.nonotch .section-component.alarm .component-keyword {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .section-component.alarm .component-form-date {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .section-component.alarm.alarm-filter .component-form-date {
        top: calc(2rem + 10.6rem)
    }
    body.ios.nonotch .main-tab-container [class^="main-tab-content0"] .component-main-refresh {
        top: calc(5rem + 2rem)
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: 2.2rem
    }
    body.ios.nonotch .safe-camp-kv .safe-camp-inner {
        margin-top: 2rem
    }
    /*! mixin :공통 - 헤더영역 */
    /*! 검색 - 공통 */
    html.ios.statusExpension .component-list.fixed,
    html.ios.statusExpension .component-search[class*="fixed"] {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .component-gathering-selected.active {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .component-gathering-selected.active+.component-search {
        top: calc(2rem + 16.2rem)
    }
    /*! 모임통장 - 모임홈 */
    html.ios.statusExpension .component-meet-profile {
        margin-top: -2rem
    }
    html.ios.statusExpension .component-meethome-profile {
        margin-top: calc(-5rem - 2rem)
    }
    /*! 상단 tab 고정 */
    html.ios.statusExpension .component-tab.food-cate-sticky,
    html.ios.statusExpension .component-text-simple+.component-tab.sticky,
    html.ios.statusExpension .section-component .component-tab.sticky,
    html.ios.statusExpension .section-component.living-price-tab .component-tab.sticky {
        top: calc(2rem + 5rem)
    }
    /*! 이체 */
    html.ios.statusExpension .component-header+.component-keypad {
        padding-top: 2rem
    }
    html.ios.statusExpension .section-component-sticky {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .fixed-msg-card,
    html.ios.statusExpension .section-flex-colume {
        height: calc(100vh - calc(2rem + 5rem))
    }
    html.ios.statusExpension .section-flex-colume.type3 {
        height: calc(100vh - calc(2rem + 11rem))
    }
    html.ios.statusExpension .section-flex-colume.type4 {
        height: calc(100vh - calc(2rem + 19.4rem))
    }
    html.ios.statusExpension .component-card-sum-top.type2[class*="fixed"] {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .dim-moneytree-wrap {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .toast-wrap.ceo-type {
        bottom: auto;
        top: calc(2rem + 9.4rem)
    }
    html.ios.statusExpension .component-tab.sticky+.article-component .component-search[class*="fixed"] {
        top: calc(2rem + 11rem)
    }
    html.ios.statusExpension .container-component.shopping .component-text.sticky {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .container-component.shopping .component-text.sticky+.component-tab .tab-list-group.sticky {
        top: calc(2rem + 9rem)
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach {
        padding-top: 2rem
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach.active {
        padding-top: 2rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: calc(2rem + 8.6rem)
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach .coach-close {
        padding-top: 0
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .inandout-calendar-inner {
        top: 2rem
    }
    html.ios.statusExpension .inandout-tab-wrap {
        top: calc(5.5rem + 2rem)
    }
    html.ios.statusExpension .section-component.custom-policy .component-tab.sticky-chip {
        top: calc(2rem + 11rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group.popup-inandout-pre-group {
        padding-top: 2rem
    }
    html.ios.statusExpension .popup-inandout-group.pre-event .container-component-coach {
        top: 2rem
    }
    html.ios.statusExpension .ailive-today-quiz {
        padding-top: 2rem
    }
    html.ios.statusExpension .tab-list-group[data-sticky-item] {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .container-component.ai-quiz .section-component.type2 {
        margin-top: calc(-5rem - 2rem);
        padding-top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .container-component.ai-quiz .section-component.type4 {
        margin-top: calc(-5rem - 2rem);
        padding-top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .fortune2025 .component-iframe {
        height: calc(100vh - (14.4rem + 2rem))
    }
    html.ios.statusExpension .container-component.common-cert.h-center .section-component.cert-section {
        min-height: calc(100vh - 24rem)
    }
    html.ios.statusExpension .section-component.stars-type1 {
        height: calc(100vh - (5rem + 2rem))
    }
    html.ios.statusExpension .section-component.mission-top {
        top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .section-component.mission-rolling {
        top: calc(23.8rem + 2rem)
    }
    html.ios.statusExpension .page-inner-scroll.money-mission.first-lock-entry.scroll-top .section-component.mission-rolling {
        top: calc(24.3rem + 2rem)
    }
    html.ios.statusExpension .container-component.container-fixed {
        padding-top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .page-inner-scroll.no-overscroll-y .container-component {
        padding-top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.mission-talisman:after {
        background-color: transparent
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.coin-full-wrap:after {
        background-color: transparent
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.transparent:after {
        background-color: transparent
    }
    html.ios.statusExpension .component-invest-calendar {
        top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .page-inner-scroll.scrolling .component-tab.financial-scam {
        top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .component-tab.sticky-logotab {
        top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .tooltip-focus-group .tooltip-area.align-bottom.digit-signature {
        top: calc(2.2rem + 2rem)
    }
    html.ios.statusExpension .weekly-invest-main-bg {
        margin-top: calc(var(--header-height) * -1 - 2rem);
        height: calc(var(--weekly-invest-height) + 2rem)
    }
    html.ios.statusExpension .weekly-invest-main .extra-cash,
    html.ios.statusExpension .weekly-invest-main .gauge,
    html.ios.statusExpension .weekly-invest-main-inner {
        margin-top: 2rem
    }
    /*! mixin :공통 - 헤더영역 */
    /*! 검색 - 공통 */
    body.ios.nonotch .component-list.fixed,
    body.ios.nonotch .component-search[class*="fixed"] {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .component-gathering-selected.active {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .component-gathering-selected.active+.component-search {
        top: calc(2rem + 16.2rem)
    }
    /*! 모임통장 - 모임홈 */
    body.ios.nonotch .component-meet-profile {
        margin-top: -2rem
    }
    body.ios.nonotch .component-meethome-profile {
        margin-top: calc(-5rem - 2rem)
    }
    /*! 상단 tab 고정 */
    body.ios.nonotch .component-tab.food-cate-sticky,
    body.ios.nonotch .component-text-simple+.component-tab.sticky,
    body.ios.nonotch .section-component .component-tab.sticky,
    body.ios.nonotch .section-component.living-price-tab .component-tab.sticky {
        top: calc(2rem + 5rem)
    }
    /*! 이체 */
    body.ios.nonotch .component-header+.component-keypad {
        padding-top: 2rem
    }
    body.ios.nonotch .section-component-sticky {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .fixed-msg-card,
    body.ios.nonotch .section-flex-colume {
        height: calc(100vh - calc(2rem + 5rem))
    }
    body.ios.nonotch .section-flex-colume.type3 {
        height: calc(100vh - calc(2rem + 11rem))
    }
    body.ios.nonotch .section-flex-colume.type4 {
        height: calc(100vh - calc(2rem + 19.4rem))
    }
    body.ios.nonotch .component-card-sum-top.type2[class*="fixed"] {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .dim-moneytree-wrap {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .toast-wrap.ceo-type {
        bottom: auto;
        top: calc(2rem + 9.4rem)
    }
    body.ios.nonotch .component-tab.sticky+.article-component .component-search[class*="fixed"] {
        top: calc(2rem + 11rem)
    }
    body.ios.nonotch .container-component.shopping .component-text.sticky {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .container-component.shopping .component-text.sticky+.component-tab .tab-list-group.sticky {
        top: calc(2rem + 9rem)
    }
    body.ios.nonotch .page-inner-scroll.inandout-scroll .container-component-coach {
        padding-top: 2rem
    }
    body.ios.nonotch .page-inner-scroll.inandout-scroll .container-component-coach.active {
        padding-top: 2rem
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: calc(2rem + 8.6rem)
    }
    body.ios.nonotch .page-inner-scroll.inandout-scroll .container-component-coach .coach-close {
        padding-top: 0
    }
    body.ios.nonotch .page-inner-scroll.inandout-scroll .inandout-calendar-inner {
        top: 2rem
    }
    body.ios.nonotch .inandout-tab-wrap {
        top: calc(5.5rem + 2rem)
    }
    body.ios.nonotch .section-component.custom-policy .component-tab.sticky-chip {
        top: calc(2rem + 11rem)
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.popup-inandout-group.popup-inandout-pre-group {
        padding-top: 2rem
    }
    body.ios.nonotch .popup-inandout-group.pre-event .container-component-coach {
        top: 2rem
    }
    body.ios.nonotch .ailive-today-quiz {
        padding-top: 2rem
    }
    body.ios.nonotch .tab-list-group[data-sticky-item] {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .container-component.ai-quiz .section-component.type2 {
        margin-top: calc(-5rem - 2rem);
        padding-top: calc(5rem + 2rem)
    }
    body.ios.nonotch .container-component.ai-quiz .section-component.type4 {
        margin-top: calc(-5rem - 2rem);
        padding-top: calc(5rem + 2rem)
    }
    body.ios.nonotch .fortune2025 .component-iframe {
        height: calc(100vh - (14.4rem + 2rem))
    }
    body.ios.nonotch .container-component.common-cert.h-center .section-component.cert-section {
        min-height: calc(100vh - 24rem)
    }
    body.ios.nonotch .section-component.stars-type1 {
        height: calc(100vh - (5rem + 2rem))
    }
    body.ios.nonotch .section-component.mission-top {
        top: calc(5rem + 2rem)
    }
    body.ios.nonotch .section-component.mission-rolling {
        top: calc(23.8rem + 2rem)
    }
    body.ios.nonotch .page-inner-scroll.money-mission.first-lock-entry.scroll-top .section-component.mission-rolling {
        top: calc(24.3rem + 2rem)
    }
    body.ios.nonotch .container-component.container-fixed {
        padding-top: calc(5rem + 2rem)
    }
    body.ios.nonotch .page-inner-scroll.no-overscroll-y .container-component {
        padding-top: calc(5rem + 2rem)
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.mission-talisman:after {
        background-color: transparent
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.coin-full-wrap:after {
        background-color: transparent
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.transparent:after {
        background-color: transparent
    }
    body.ios.nonotch .component-invest-calendar {
        top: calc(5rem + 2rem)
    }
    body.ios.nonotch .page-inner-scroll.scrolling .component-tab.financial-scam {
        top: calc(5rem + 2rem)
    }
    body.ios.nonotch .component-tab.sticky-logotab {
        top: calc(5rem + 2rem)
    }
    body.ios.nonotch .tooltip-focus-group .tooltip-area.align-bottom.digit-signature {
        top: calc(2.2rem + 2rem)
    }
    body.ios.nonotch .weekly-invest-main-bg {
        margin-top: calc(var(--header-height) * -1 - 2rem);
        height: calc(var(--weekly-invest-height) + 2rem)
    }
    body.ios.nonotch .weekly-invest-main .extra-cash,
    body.ios.nonotch .weekly-invest-main .gauge,
    body.ios.nonotch .weekly-invest-main-inner {
        margin-top: 2rem
    }
    html.ios.statusExpension .content-savings.expired {
        height: calc(2rem + 53.9rem)
    }
    html.ios.statusExpension .content-savings.expired {
        height: calc(2rem + 53.9rem)
    }
    html.ios.statusExpension .content-savings {
        height: calc(2rem + 44.8rem)
    }
    html.ios.statusExpension .content-savings .img-area {
        top: 2rem
    }
    html.ios.statusExpension .content-savings .prodname-info {
        top: calc(2rem + 30.8rem)
    }
    html.ios.statusExpension .content-savings .kds-banner-card {
        top: calc(2rem + 42.1rem)
    }
    html.ios.statusExpension .savings-scroll .component-header::before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 2rem;
        background: var(--bg-pri-base)
    }
    html.ios.statusExpension .savings-scroll .component-fixed-bottom {
        min-height: calc(100vh - 5rem - 2rem)
    }
    html.ios.statusExpension .container-component.ai-quiz.h-center .section-component {
        height: calc(100% - (16.2rem + 2rem + 0))
    }
    html.ios.statusExpension .container-component.view-center .section-component {
        height: calc(100% - (16.2rem + 2rem + 0))
    }
    html.ios.statusExpension .section-component.alarm-nodata {
        height: calc(100vh - (5rem + 2rem + 0))
    }
    html.ios.statusExpension .container-component.today-coupon.h-center .section-component {
        height: calc(100% - (20.2rem + 2rem + 0))
    }
    html.ios.statusExpension .section-component.stars-type2 {
        padding-top: calc(4.8rem + 2rem);
        padding-bottom: calc(8rem + 0)
    }
    html.ios.statusExpension .page-inner-scroll.scrolling .component-card-sticky {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .content-savings.expired {
        height: calc(2rem + 53.9rem)
    }
    body.ios.nonotch .content-savings.expired {
        height: calc(2rem + 53.9rem)
    }
    body.ios.nonotch .content-savings {
        height: calc(2rem + 44.8rem)
    }
    body.ios.nonotch .content-savings .img-area {
        top: 2rem
    }
    body.ios.nonotch .content-savings .prodname-info {
        top: calc(2rem + 30.8rem)
    }
    body.ios.nonotch .content-savings .kds-banner-card {
        top: calc(2rem + 42.1rem)
    }
    body.ios.nonotch .savings-scroll .component-header::before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 2rem;
        background: var(--bg-pri-base)
    }
    body.ios.nonotch .savings-scroll .component-fixed-bottom {
        min-height: calc(100vh - 5rem - 2rem)
    }
    body.ios.nonotch .container-component.ai-quiz.h-center .section-component {
        height: calc(100% - (16.2rem + 2rem + 0))
    }
    body.ios.nonotch .container-component.view-center .section-component {
        height: calc(100% - (16.2rem + 2rem + 0))
    }
    body.ios.nonotch .section-component.alarm-nodata {
        height: calc(100vh - (5rem + 2rem + 0))
    }
    body.ios.nonotch .container-component.today-coupon.h-center .section-component {
        height: calc(100% - (20.2rem + 2rem + 0))
    }
    body.ios.nonotch .section-component.stars-type2 {
        padding-top: calc(4.8rem + 2rem);
        padding-bottom: calc(8rem + 0)
    }
    body.ios.nonotch .page-inner-scroll.scrolling .component-card-sticky {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: 2.2rem
    }
}

/*! 노치(X) 6+(확대), 6s+(확대), 7+(확대), 8+(확대) */

@media only screen and (device-width: 375px) and (device-height: 667px) and (-webkit-device-pixel-ratio: 3) {
    /*! mixin :공통 - 헤더영역 */
    html.ios.statusExpension .component-header {
        padding-top: 2rem
    }
    html.ios.statusExpension .popup-header .component-header {
        padding-top: 0
    }
    /*! 홈 - 일반 */
    html.ios.statusExpension .home-default .main-container-component.bg-main {
        padding-top: calc(2rem + 5.6rem)
    }
    /*! 홈 - 추천 */
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"].scrolling .component-tab.sticky-tab {
        top: calc(2rem + 0.2rem)
    }
    /*! 홈 - 혜택 */
    html.ios.statusExpension .page-inner-scroll.scrolling .component-tab.sticky-tab02 .tab-round-group {
        top: calc(2rem + 5rem)
    }
    /*! 홈 - 타임라인 */
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"].scrolling .component-form-date {
        top: calc(2rem + 5rem + 0.2rem)
    }
    /*! 홈 - 순서변경 */
    html.ios.statusExpension .page-inner-scroll.scrolling .component-text-simple.fixed-top {
        top: calc(2rem + 0.9rem)
    }
    /*! 공통 - 풀팝업일때 */
    html.ios.statusExpension .popup-dialog.ui-full .popup-group,
    html.ios.statusExpension .popup-dialog.ui-full-change .popup-group,
    html.ios.statusExpension .popup-dialog.ui-full-change.plus-box-event-pop .popup-group {
        padding-top: 2rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group:after {
        content: '';
        height: 2rem;
        background-color: var(--color-w100, #fff);
        position: fixed;
        top: 0;
        left: 0;
        width: 100%
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group:after {
        display: none
    }
    html.ios.statusExpension .popup-dialog.ui-full-change.plus-box-event-pop .interest-group-top .ani-step1-1 {
        margin-top: 8.2rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.shopping:after {
        background: var(--color-in700)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.shopping.bg-white:after {
        background-color: var(--color-w100, #fff)
    }
    /*! 홈 개편 */
    html.ios.statusExpension .component-header.main {
        padding-top: calc(2rem + 0.6rem)
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh {
        padding-top: 2rem
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh.pull-home {
        padding-top: 0;
        margin-top: 2rem
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: 0.6rem
    }
    html.ios.statusExpension .scrolling .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: calc(2rem + 0.6rem)
    }
    html.ios.statusExpension .component-tab.foru-tab-ver.scrollOn .tab-group.foru-type {
        top: calc(2rem)
    }
    html.ios.statusExpension .component-header.main+.component-tab.foru-tab-ver {
        top: calc(2rem + 5.6rem)
    }
    html.ios.statusExpension .component-main-bnf-tab {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .invest-home .tab-list-group.sticky-invest {
        top: calc(2rem + 5.6rem)
    }
    html.ios.statusExpension .component-ceo-calendar {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .component-ceo-my-account.type2 {
        padding-top: calc(2rem + 37rem)
    }
    html.ios.statusExpension .container-component-coach .coach-item01 {
        padding-top: 2rem
    }
    html.ios.statusExpension .component-header.search {
        padding-top: calc(2rem + 1.2rem);
        height: auto
    }
    html.ios.statusExpension .component-header.search.search-result {
        height: calc(2rem + 10.5rem)
    }
    html.ios.statusExpension .popup-inner .component-header.search.search-result {
        height: 10.5rem
    }
    html.ios.statusExpension .popup-inner .component-header.search.sticky {
        top: 2rem;
        padding-top: 1.2rem
    }
    html.ios.statusExpension .section-component.alarm .component-keyword {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .section-component.alarm .component-form-date {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .section-component.alarm.alarm-filter .component-form-date {
        top: calc(2rem + 10.6rem)
    }
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"] .component-main-refresh {
        top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: 2.2rem
    }
    html.ios.statusExpension .safe-camp-kv .safe-camp-inner {
        margin-top: 2rem
    }
    /*! mixin :공통 - 헤더영역 */
    body.ios.nonotch .component-header {
        padding-top: 2rem
    }
    body.ios.nonotch .popup-header .component-header {
        padding-top: 0
    }
    /*! 홈 - 일반 */
    body.ios.nonotch .home-default .main-container-component.bg-main {
        padding-top: calc(2rem + 5.6rem)
    }
    /*! 홈 - 추천 */
    body.ios.nonotch .main-tab-container [class^="main-tab-content0"].scrolling .component-tab.sticky-tab {
        top: calc(2rem + 0.2rem)
    }
    /*! 홈 - 혜택 */
    body.ios.nonotch .page-inner-scroll.scrolling .component-tab.sticky-tab02 .tab-round-group {
        top: calc(2rem + 5rem)
    }
    /*! 홈 - 타임라인 */
    body.ios.nonotch .main-tab-container [class^="main-tab-content0"].scrolling .component-form-date {
        top: calc(2rem + 5rem + 0.2rem)
    }
    /*! 홈 - 순서변경 */
    body.ios.nonotch .page-inner-scroll.scrolling .component-text-simple.fixed-top {
        top: calc(2rem + 0.9rem)
    }
    /*! 공통 - 풀팝업일때 */
    body.ios.nonotch .popup-dialog.ui-full .popup-group,
    body.ios.nonotch .popup-dialog.ui-full-change .popup-group,
    body.ios.nonotch .popup-dialog.ui-full-change.plus-box-event-pop .popup-group {
        padding-top: 2rem
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group:after {
        content: '';
        height: 2rem;
        background-color: var(--color-w100, #fff);
        position: fixed;
        top: 0;
        left: 0;
        width: 100%
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.popup-inandout-group:after {
        display: none
    }
    body.ios.nonotch .popup-dialog.ui-full-change.plus-box-event-pop .interest-group-top .ani-step1-1 {
        margin-top: 8.2rem
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.shopping:after {
        background: var(--color-in700)
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.shopping.bg-white:after {
        background-color: var(--color-w100, #fff)
    }
    /*! 홈 개편 */
    body.ios.nonotch .component-header.main {
        padding-top: calc(2rem + 0.6rem)
    }
    body.ios.nonotch .ptr--ptr.ptr--refresh {
        padding-top: 2rem
    }
    body.ios.nonotch .ptr--ptr.ptr--refresh.pull-home {
        padding-top: 0;
        margin-top: 2rem
    }
    body.ios.nonotch .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: 0.6rem
    }
    body.ios.nonotch .scrolling .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: calc(2rem + 0.6rem)
    }
    body.ios.nonotch .component-tab.foru-tab-ver.scrollOn .tab-group.foru-type {
        top: calc(2rem)
    }
    body.ios.nonotch .component-header.main+.component-tab.foru-tab-ver {
        top: calc(2rem + 5.6rem)
    }
    body.ios.nonotch .component-main-bnf-tab {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .invest-home .tab-list-group.sticky-invest {
        top: calc(2rem + 5.6rem)
    }
    body.ios.nonotch .component-ceo-calendar {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .component-ceo-my-account.type2 {
        padding-top: calc(2rem + 37rem)
    }
    body.ios.nonotch .container-component-coach .coach-item01 {
        padding-top: 2rem
    }
    body.ios.nonotch .component-header.search {
        padding-top: calc(2rem + 1.2rem);
        height: auto
    }
    body.ios.nonotch .component-header.search.search-result {
        height: calc(2rem + 10.5rem)
    }
    body.ios.nonotch .popup-inner .component-header.search.search-result {
        height: 10.5rem
    }
    body.ios.nonotch .popup-inner .component-header.search.sticky {
        top: 2rem;
        padding-top: 1.2rem
    }
    body.ios.nonotch .section-component.alarm .component-keyword {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .section-component.alarm .component-form-date {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .section-component.alarm.alarm-filter .component-form-date {
        top: calc(2rem + 10.6rem)
    }
    body.ios.nonotch .main-tab-container [class^="main-tab-content0"] .component-main-refresh {
        top: calc(5rem + 2rem)
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: 2.2rem
    }
    body.ios.nonotch .safe-camp-kv .safe-camp-inner {
        margin-top: 2rem
    }
    /*! mixin :공통 - 헤더영역 */
    /*! 검색 - 공통 */
    html.ios.statusExpension .component-list.fixed,
    html.ios.statusExpension .component-search[class*="fixed"] {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .component-gathering-selected.active {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .component-gathering-selected.active+.component-search {
        top: calc(2rem + 16.2rem)
    }
    /*! 모임통장 - 모임홈 */
    html.ios.statusExpension .component-meet-profile {
        margin-top: -2rem
    }
    html.ios.statusExpension .component-meethome-profile {
        margin-top: calc(-5rem - 2rem)
    }
    /*! 상단 tab 고정 */
    html.ios.statusExpension .component-tab.food-cate-sticky,
    html.ios.statusExpension .component-text-simple+.component-tab.sticky,
    html.ios.statusExpension .section-component .component-tab.sticky,
    html.ios.statusExpension .section-component.living-price-tab .component-tab.sticky {
        top: calc(2rem + 5rem)
    }
    /*! 이체 */
    html.ios.statusExpension .component-header+.component-keypad {
        padding-top: 2rem
    }
    html.ios.statusExpension .section-component-sticky {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .fixed-msg-card,
    html.ios.statusExpension .section-flex-colume {
        height: calc(100vh - calc(2rem + 5rem))
    }
    html.ios.statusExpension .section-flex-colume.type3 {
        height: calc(100vh - calc(2rem + 11rem))
    }
    html.ios.statusExpension .section-flex-colume.type4 {
        height: calc(100vh - calc(2rem + 19.4rem))
    }
    html.ios.statusExpension .component-card-sum-top.type2[class*="fixed"] {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .dim-moneytree-wrap {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .toast-wrap.ceo-type {
        bottom: auto;
        top: calc(2rem + 9.4rem)
    }
    html.ios.statusExpension .component-tab.sticky+.article-component .component-search[class*="fixed"] {
        top: calc(2rem + 11rem)
    }
    html.ios.statusExpension .container-component.shopping .component-text.sticky {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .container-component.shopping .component-text.sticky+.component-tab .tab-list-group.sticky {
        top: calc(2rem + 9rem)
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach {
        padding-top: 2rem
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach.active {
        padding-top: 2rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: calc(2rem + 8.6rem)
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach .coach-close {
        padding-top: 0
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .inandout-calendar-inner {
        top: 2rem
    }
    html.ios.statusExpension .inandout-tab-wrap {
        top: calc(5.5rem + 2rem)
    }
    html.ios.statusExpension .section-component.custom-policy .component-tab.sticky-chip {
        top: calc(2rem + 11rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group.popup-inandout-pre-group {
        padding-top: 2rem
    }
    html.ios.statusExpension .popup-inandout-group.pre-event .container-component-coach {
        top: 2rem
    }
    html.ios.statusExpension .ailive-today-quiz {
        padding-top: 2rem
    }
    html.ios.statusExpension .tab-list-group[data-sticky-item] {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .container-component.ai-quiz .section-component.type2 {
        margin-top: calc(-5rem - 2rem);
        padding-top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .container-component.ai-quiz .section-component.type4 {
        margin-top: calc(-5rem - 2rem);
        padding-top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .fortune2025 .component-iframe {
        height: calc(100vh - (14.4rem + 2rem))
    }
    html.ios.statusExpension .container-component.common-cert.h-center .section-component.cert-section {
        min-height: calc(100vh - 24rem)
    }
    html.ios.statusExpension .section-component.stars-type1 {
        height: calc(100vh - (5rem + 2rem))
    }
    html.ios.statusExpension .section-component.mission-top {
        top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .section-component.mission-rolling {
        top: calc(23.8rem + 2rem)
    }
    html.ios.statusExpension .page-inner-scroll.money-mission.first-lock-entry.scroll-top .section-component.mission-rolling {
        top: calc(24.3rem + 2rem)
    }
    html.ios.statusExpension .container-component.container-fixed {
        padding-top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .page-inner-scroll.no-overscroll-y .container-component {
        padding-top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.mission-talisman:after {
        background-color: transparent
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.coin-full-wrap:after {
        background-color: transparent
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.transparent:after {
        background-color: transparent
    }
    html.ios.statusExpension .component-invest-calendar {
        top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .page-inner-scroll.scrolling .component-tab.financial-scam {
        top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .component-tab.sticky-logotab {
        top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .tooltip-focus-group .tooltip-area.align-bottom.digit-signature {
        top: calc(2.2rem + 2rem)
    }
    html.ios.statusExpension .weekly-invest-main-bg {
        margin-top: calc(var(--header-height) * -1 - 2rem);
        height: calc(var(--weekly-invest-height) + 2rem)
    }
    html.ios.statusExpension .weekly-invest-main .extra-cash,
    html.ios.statusExpension .weekly-invest-main .gauge,
    html.ios.statusExpension .weekly-invest-main-inner {
        margin-top: 2rem
    }
    /*! mixin :공통 - 헤더영역 */
    /*! 검색 - 공통 */
    body.ios.nonotch .component-list.fixed,
    body.ios.nonotch .component-search[class*="fixed"] {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .component-gathering-selected.active {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .component-gathering-selected.active+.component-search {
        top: calc(2rem + 16.2rem)
    }
    /*! 모임통장 - 모임홈 */
    body.ios.nonotch .component-meet-profile {
        margin-top: -2rem
    }
    body.ios.nonotch .component-meethome-profile {
        margin-top: calc(-5rem - 2rem)
    }
    /*! 상단 tab 고정 */
    body.ios.nonotch .component-tab.food-cate-sticky,
    body.ios.nonotch .component-text-simple+.component-tab.sticky,
    body.ios.nonotch .section-component .component-tab.sticky,
    body.ios.nonotch .section-component.living-price-tab .component-tab.sticky {
        top: calc(2rem + 5rem)
    }
    /*! 이체 */
    body.ios.nonotch .component-header+.component-keypad {
        padding-top: 2rem
    }
    body.ios.nonotch .section-component-sticky {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .fixed-msg-card,
    body.ios.nonotch .section-flex-colume {
        height: calc(100vh - calc(2rem + 5rem))
    }
    body.ios.nonotch .section-flex-colume.type3 {
        height: calc(100vh - calc(2rem + 11rem))
    }
    body.ios.nonotch .section-flex-colume.type4 {
        height: calc(100vh - calc(2rem + 19.4rem))
    }
    body.ios.nonotch .component-card-sum-top.type2[class*="fixed"] {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .dim-moneytree-wrap {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .toast-wrap.ceo-type {
        bottom: auto;
        top: calc(2rem + 9.4rem)
    }
    body.ios.nonotch .component-tab.sticky+.article-component .component-search[class*="fixed"] {
        top: calc(2rem + 11rem)
    }
    body.ios.nonotch .container-component.shopping .component-text.sticky {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .container-component.shopping .component-text.sticky+.component-tab .tab-list-group.sticky {
        top: calc(2rem + 9rem)
    }
    body.ios.nonotch .page-inner-scroll.inandout-scroll .container-component-coach {
        padding-top: 2rem
    }
    body.ios.nonotch .page-inner-scroll.inandout-scroll .container-component-coach.active {
        padding-top: 2rem
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: calc(2rem + 8.6rem)
    }
    body.ios.nonotch .page-inner-scroll.inandout-scroll .container-component-coach .coach-close {
        padding-top: 0
    }
    body.ios.nonotch .page-inner-scroll.inandout-scroll .inandout-calendar-inner {
        top: 2rem
    }
    body.ios.nonotch .inandout-tab-wrap {
        top: calc(5.5rem + 2rem)
    }
    body.ios.nonotch .section-component.custom-policy .component-tab.sticky-chip {
        top: calc(2rem + 11rem)
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.popup-inandout-group.popup-inandout-pre-group {
        padding-top: 2rem
    }
    body.ios.nonotch .popup-inandout-group.pre-event .container-component-coach {
        top: 2rem
    }
    body.ios.nonotch .ailive-today-quiz {
        padding-top: 2rem
    }
    body.ios.nonotch .tab-list-group[data-sticky-item] {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .container-component.ai-quiz .section-component.type2 {
        margin-top: calc(-5rem - 2rem);
        padding-top: calc(5rem + 2rem)
    }
    body.ios.nonotch .container-component.ai-quiz .section-component.type4 {
        margin-top: calc(-5rem - 2rem);
        padding-top: calc(5rem + 2rem)
    }
    body.ios.nonotch .fortune2025 .component-iframe {
        height: calc(100vh - (14.4rem + 2rem))
    }
    body.ios.nonotch .container-component.common-cert.h-center .section-component.cert-section {
        min-height: calc(100vh - 24rem)
    }
    body.ios.nonotch .section-component.stars-type1 {
        height: calc(100vh - (5rem + 2rem))
    }
    body.ios.nonotch .section-component.mission-top {
        top: calc(5rem + 2rem)
    }
    body.ios.nonotch .section-component.mission-rolling {
        top: calc(23.8rem + 2rem)
    }
    body.ios.nonotch .page-inner-scroll.money-mission.first-lock-entry.scroll-top .section-component.mission-rolling {
        top: calc(24.3rem + 2rem)
    }
    body.ios.nonotch .container-component.container-fixed {
        padding-top: calc(5rem + 2rem)
    }
    body.ios.nonotch .page-inner-scroll.no-overscroll-y .container-component {
        padding-top: calc(5rem + 2rem)
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.mission-talisman:after {
        background-color: transparent
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.coin-full-wrap:after {
        background-color: transparent
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.transparent:after {
        background-color: transparent
    }
    body.ios.nonotch .component-invest-calendar {
        top: calc(5rem + 2rem)
    }
    body.ios.nonotch .page-inner-scroll.scrolling .component-tab.financial-scam {
        top: calc(5rem + 2rem)
    }
    body.ios.nonotch .component-tab.sticky-logotab {
        top: calc(5rem + 2rem)
    }
    body.ios.nonotch .tooltip-focus-group .tooltip-area.align-bottom.digit-signature {
        top: calc(2.2rem + 2rem)
    }
    body.ios.nonotch .weekly-invest-main-bg {
        margin-top: calc(var(--header-height) * -1 - 2rem);
        height: calc(var(--weekly-invest-height) + 2rem)
    }
    body.ios.nonotch .weekly-invest-main .extra-cash,
    body.ios.nonotch .weekly-invest-main .gauge,
    body.ios.nonotch .weekly-invest-main-inner {
        margin-top: 2rem
    }
    html.ios.statusExpension .content-savings.expired {
        height: calc(2rem + 53.9rem)
    }
    html.ios.statusExpension .content-savings.expired {
        height: calc(2rem + 53.9rem)
    }
    html.ios.statusExpension .content-savings {
        height: calc(2rem + 44.8rem)
    }
    html.ios.statusExpension .content-savings .img-area {
        top: 2rem
    }
    html.ios.statusExpension .content-savings .prodname-info {
        top: calc(2rem + 30.8rem)
    }
    html.ios.statusExpension .content-savings .kds-banner-card {
        top: calc(2rem + 42.1rem)
    }
    html.ios.statusExpension .savings-scroll .component-header::before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 2rem;
        background: var(--bg-pri-base)
    }
    html.ios.statusExpension .savings-scroll .component-fixed-bottom {
        min-height: calc(100vh - 5rem - 2rem)
    }
    html.ios.statusExpension .container-component.ai-quiz.h-center .section-component {
        height: calc(100% - (16.2rem + 2rem + 0))
    }
    html.ios.statusExpension .container-component.view-center .section-component {
        height: calc(100% - (16.2rem + 2rem + 0))
    }
    html.ios.statusExpension .section-component.alarm-nodata {
        height: calc(100vh - (5rem + 2rem + 0))
    }
    html.ios.statusExpension .container-component.today-coupon.h-center .section-component {
        height: calc(100% - (20.2rem + 2rem + 0))
    }
    html.ios.statusExpension .section-component.stars-type2 {
        padding-top: calc(4.8rem + 2rem);
        padding-bottom: calc(8rem + 0)
    }
    html.ios.statusExpension .page-inner-scroll.scrolling .component-card-sticky {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .content-savings.expired {
        height: calc(2rem + 53.9rem)
    }
    body.ios.nonotch .content-savings.expired {
        height: calc(2rem + 53.9rem)
    }
    body.ios.nonotch .content-savings {
        height: calc(2rem + 44.8rem)
    }
    body.ios.nonotch .content-savings .img-area {
        top: 2rem
    }
    body.ios.nonotch .content-savings .prodname-info {
        top: calc(2rem + 30.8rem)
    }
    body.ios.nonotch .content-savings .kds-banner-card {
        top: calc(2rem + 42.1rem)
    }
    body.ios.nonotch .savings-scroll .component-header::before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 2rem;
        background: var(--bg-pri-base)
    }
    body.ios.nonotch .savings-scroll .component-fixed-bottom {
        min-height: calc(100vh - 5rem - 2rem)
    }
    body.ios.nonotch .container-component.ai-quiz.h-center .section-component {
        height: calc(100% - (16.2rem + 2rem + 0))
    }
    body.ios.nonotch .container-component.view-center .section-component {
        height: calc(100% - (16.2rem + 2rem + 0))
    }
    body.ios.nonotch .section-component.alarm-nodata {
        height: calc(100vh - (5rem + 2rem + 0))
    }
    body.ios.nonotch .container-component.today-coupon.h-center .section-component {
        height: calc(100% - (20.2rem + 2rem + 0))
    }
    body.ios.nonotch .section-component.stars-type2 {
        padding-top: calc(4.8rem + 2rem);
        padding-bottom: calc(8rem + 0)
    }
    body.ios.nonotch .page-inner-scroll.scrolling .component-card-sticky {
        top: calc(2rem + 5rem)
    }
}

/*! 노치(X) 6, 6s, 7, 8, SE2세대 */

@media only screen and (device-width: 375px) and (device-height: 667px) and (-webkit-device-pixel-ratio: 2) {
    /*! mixin :공통 - 헤더영역 */
    html.ios.statusExpension .component-header {
        padding-top: 2rem
    }
    html.ios.statusExpension .popup-header .component-header {
        padding-top: 0
    }
    /*! 홈 - 일반 */
    html.ios.statusExpension .home-default .main-container-component.bg-main {
        padding-top: calc(2rem + 5.6rem)
    }
    /*! 홈 - 추천 */
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"].scrolling .component-tab.sticky-tab {
        top: calc(2rem + 0.2rem)
    }
    /*! 홈 - 혜택 */
    html.ios.statusExpension .page-inner-scroll.scrolling .component-tab.sticky-tab02 .tab-round-group {
        top: calc(2rem + 5rem)
    }
    /*! 홈 - 타임라인 */
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"].scrolling .component-form-date {
        top: calc(2rem + 5rem + 0.2rem)
    }
    /*! 홈 - 순서변경 */
    html.ios.statusExpension .page-inner-scroll.scrolling .component-text-simple.fixed-top {
        top: calc(2rem + 0.9rem)
    }
    /*! 공통 - 풀팝업일때 */
    html.ios.statusExpension .popup-dialog.ui-full .popup-group,
    html.ios.statusExpension .popup-dialog.ui-full-change .popup-group,
    html.ios.statusExpension .popup-dialog.ui-full-change.plus-box-event-pop .popup-group {
        padding-top: 2rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group:after {
        content: '';
        height: 2rem;
        background-color: var(--color-w100, #fff);
        position: fixed;
        top: 0;
        left: 0;
        width: 100%
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group:after {
        display: none
    }
    html.ios.statusExpension .popup-dialog.ui-full-change.plus-box-event-pop .interest-group-top .ani-step1-1 {
        margin-top: 8.2rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.shopping:after {
        background: var(--color-in700)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.shopping.bg-white:after {
        background-color: var(--color-w100, #fff)
    }
    /*! 홈 개편 */
    html.ios.statusExpension .component-header.main {
        padding-top: calc(2rem + 0.6rem)
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh {
        padding-top: 2rem
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh.pull-home {
        padding-top: 0;
        margin-top: 2rem
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: 0.6rem
    }
    html.ios.statusExpension .scrolling .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: calc(2rem + 0.6rem)
    }
    html.ios.statusExpension .component-tab.foru-tab-ver.scrollOn .tab-group.foru-type {
        top: calc(2rem)
    }
    html.ios.statusExpension .component-header.main+.component-tab.foru-tab-ver {
        top: calc(2rem + 5.6rem)
    }
    html.ios.statusExpension .component-main-bnf-tab {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .invest-home .tab-list-group.sticky-invest {
        top: calc(2rem + 5.6rem)
    }
    html.ios.statusExpension .component-ceo-calendar {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .component-ceo-my-account.type2 {
        padding-top: calc(2rem + 37rem)
    }
    html.ios.statusExpension .container-component-coach .coach-item01 {
        padding-top: 2rem
    }
    html.ios.statusExpension .component-header.search {
        padding-top: calc(2rem + 1.2rem);
        height: auto
    }
    html.ios.statusExpension .component-header.search.search-result {
        height: calc(2rem + 10.5rem)
    }
    html.ios.statusExpension .popup-inner .component-header.search.search-result {
        height: 10.5rem
    }
    html.ios.statusExpension .popup-inner .component-header.search.sticky {
        top: 2rem;
        padding-top: 1.2rem
    }
    html.ios.statusExpension .section-component.alarm .component-keyword {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .section-component.alarm .component-form-date {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .section-component.alarm.alarm-filter .component-form-date {
        top: calc(2rem + 10.6rem)
    }
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"] .component-main-refresh {
        top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: 2.2rem
    }
    html.ios.statusExpension .safe-camp-kv .safe-camp-inner {
        margin-top: 2rem
    }
    /*! mixin :공통 - 헤더영역 */
    body.ios.nonotch .component-header {
        padding-top: 2rem
    }
    body.ios.nonotch .popup-header .component-header {
        padding-top: 0
    }
    /*! 홈 - 일반 */
    body.ios.nonotch .home-default .main-container-component.bg-main {
        padding-top: calc(2rem + 5.6rem)
    }
    /*! 홈 - 추천 */
    body.ios.nonotch .main-tab-container [class^="main-tab-content0"].scrolling .component-tab.sticky-tab {
        top: calc(2rem + 0.2rem)
    }
    /*! 홈 - 혜택 */
    body.ios.nonotch .page-inner-scroll.scrolling .component-tab.sticky-tab02 .tab-round-group {
        top: calc(2rem + 5rem)
    }
    /*! 홈 - 타임라인 */
    body.ios.nonotch .main-tab-container [class^="main-tab-content0"].scrolling .component-form-date {
        top: calc(2rem + 5rem + 0.2rem)
    }
    /*! 홈 - 순서변경 */
    body.ios.nonotch .page-inner-scroll.scrolling .component-text-simple.fixed-top {
        top: calc(2rem + 0.9rem)
    }
    /*! 공통 - 풀팝업일때 */
    body.ios.nonotch .popup-dialog.ui-full .popup-group,
    body.ios.nonotch .popup-dialog.ui-full-change .popup-group,
    body.ios.nonotch .popup-dialog.ui-full-change.plus-box-event-pop .popup-group {
        padding-top: 2rem
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group:after {
        content: '';
        height: 2rem;
        background-color: var(--color-w100, #fff);
        position: fixed;
        top: 0;
        left: 0;
        width: 100%
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.popup-inandout-group:after {
        display: none
    }
    body.ios.nonotch .popup-dialog.ui-full-change.plus-box-event-pop .interest-group-top .ani-step1-1 {
        margin-top: 8.2rem
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.shopping:after {
        background: var(--color-in700)
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.shopping.bg-white:after {
        background-color: var(--color-w100, #fff)
    }
    /*! 홈 개편 */
    body.ios.nonotch .component-header.main {
        padding-top: calc(2rem + 0.6rem)
    }
    body.ios.nonotch .ptr--ptr.ptr--refresh {
        padding-top: 2rem
    }
    body.ios.nonotch .ptr--ptr.ptr--refresh.pull-home {
        padding-top: 0;
        margin-top: 2rem
    }
    body.ios.nonotch .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: 0.6rem
    }
    body.ios.nonotch .scrolling .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: calc(2rem + 0.6rem)
    }
    body.ios.nonotch .component-tab.foru-tab-ver.scrollOn .tab-group.foru-type {
        top: calc(2rem)
    }
    body.ios.nonotch .component-header.main+.component-tab.foru-tab-ver {
        top: calc(2rem + 5.6rem)
    }
    body.ios.nonotch .component-main-bnf-tab {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .invest-home .tab-list-group.sticky-invest {
        top: calc(2rem + 5.6rem)
    }
    body.ios.nonotch .component-ceo-calendar {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .component-ceo-my-account.type2 {
        padding-top: calc(2rem + 37rem)
    }
    body.ios.nonotch .container-component-coach .coach-item01 {
        padding-top: 2rem
    }
    body.ios.nonotch .component-header.search {
        padding-top: calc(2rem + 1.2rem);
        height: auto
    }
    body.ios.nonotch .component-header.search.search-result {
        height: calc(2rem + 10.5rem)
    }
    body.ios.nonotch .popup-inner .component-header.search.search-result {
        height: 10.5rem
    }
    body.ios.nonotch .popup-inner .component-header.search.sticky {
        top: 2rem;
        padding-top: 1.2rem
    }
    body.ios.nonotch .section-component.alarm .component-keyword {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .section-component.alarm .component-form-date {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .section-component.alarm.alarm-filter .component-form-date {
        top: calc(2rem + 10.6rem)
    }
    body.ios.nonotch .main-tab-container [class^="main-tab-content0"] .component-main-refresh {
        top: calc(5rem + 2rem)
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: 2.2rem
    }
    body.ios.nonotch .safe-camp-kv .safe-camp-inner {
        margin-top: 2rem
    }
    /*! mixin :공통 - 헤더영역 */
    /*! 검색 - 공통 */
    html.ios.statusExpension .component-list.fixed,
    html.ios.statusExpension .component-search[class*="fixed"] {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .component-gathering-selected.active {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .component-gathering-selected.active+.component-search {
        top: calc(2rem + 16.2rem)
    }
    /*! 모임통장 - 모임홈 */
    html.ios.statusExpension .component-meet-profile {
        margin-top: -2rem
    }
    html.ios.statusExpension .component-meethome-profile {
        margin-top: calc(-5rem - 2rem)
    }
    /*! 상단 tab 고정 */
    html.ios.statusExpension .component-tab.food-cate-sticky,
    html.ios.statusExpension .component-text-simple+.component-tab.sticky,
    html.ios.statusExpension .section-component .component-tab.sticky,
    html.ios.statusExpension .section-component.living-price-tab .component-tab.sticky {
        top: calc(2rem + 5rem)
    }
    /*! 이체 */
    html.ios.statusExpension .component-header+.component-keypad {
        padding-top: 2rem
    }
    html.ios.statusExpension .section-component-sticky {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .fixed-msg-card,
    html.ios.statusExpension .section-flex-colume {
        height: calc(100vh - calc(2rem + 5rem))
    }
    html.ios.statusExpension .section-flex-colume.type3 {
        height: calc(100vh - calc(2rem + 11rem))
    }
    html.ios.statusExpension .section-flex-colume.type4 {
        height: calc(100vh - calc(2rem + 19.4rem))
    }
    html.ios.statusExpension .component-card-sum-top.type2[class*="fixed"] {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .dim-moneytree-wrap {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .toast-wrap.ceo-type {
        bottom: auto;
        top: calc(2rem + 9.4rem)
    }
    html.ios.statusExpension .component-tab.sticky+.article-component .component-search[class*="fixed"] {
        top: calc(2rem + 11rem)
    }
    html.ios.statusExpension .container-component.shopping .component-text.sticky {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .container-component.shopping .component-text.sticky+.component-tab .tab-list-group.sticky {
        top: calc(2rem + 9rem)
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach {
        padding-top: 2rem
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach.active {
        padding-top: 2rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: calc(2rem + 8.6rem)
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach .coach-close {
        padding-top: 0
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .inandout-calendar-inner {
        top: 2rem
    }
    html.ios.statusExpension .inandout-tab-wrap {
        top: calc(5.5rem + 2rem)
    }
    html.ios.statusExpension .section-component.custom-policy .component-tab.sticky-chip {
        top: calc(2rem + 11rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group.popup-inandout-pre-group {
        padding-top: 2rem
    }
    html.ios.statusExpension .popup-inandout-group.pre-event .container-component-coach {
        top: 2rem
    }
    html.ios.statusExpension .ailive-today-quiz {
        padding-top: 2rem
    }
    html.ios.statusExpension .tab-list-group[data-sticky-item] {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .container-component.ai-quiz .section-component.type2 {
        margin-top: calc(-5rem - 2rem);
        padding-top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .container-component.ai-quiz .section-component.type4 {
        margin-top: calc(-5rem - 2rem);
        padding-top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .fortune2025 .component-iframe {
        height: calc(100vh - (14.4rem + 2rem))
    }
    html.ios.statusExpension .container-component.common-cert.h-center .section-component.cert-section {
        min-height: calc(100vh - 24rem)
    }
    html.ios.statusExpension .section-component.stars-type1 {
        height: calc(100vh - (5rem + 2rem))
    }
    html.ios.statusExpension .section-component.mission-top {
        top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .section-component.mission-rolling {
        top: calc(23.8rem + 2rem)
    }
    html.ios.statusExpension .page-inner-scroll.money-mission.first-lock-entry.scroll-top .section-component.mission-rolling {
        top: calc(24.3rem + 2rem)
    }
    html.ios.statusExpension .container-component.container-fixed {
        padding-top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .page-inner-scroll.no-overscroll-y .container-component {
        padding-top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.mission-talisman:after {
        background-color: transparent
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.coin-full-wrap:after {
        background-color: transparent
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.transparent:after {
        background-color: transparent
    }
    html.ios.statusExpension .component-invest-calendar {
        top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .page-inner-scroll.scrolling .component-tab.financial-scam {
        top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .component-tab.sticky-logotab {
        top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .tooltip-focus-group .tooltip-area.align-bottom.digit-signature {
        top: calc(2.2rem + 2rem)
    }
    html.ios.statusExpension .weekly-invest-main-bg {
        margin-top: calc(var(--header-height) * -1 - 2rem);
        height: calc(var(--weekly-invest-height) + 2rem)
    }
    html.ios.statusExpension .weekly-invest-main .extra-cash,
    html.ios.statusExpension .weekly-invest-main .gauge,
    html.ios.statusExpension .weekly-invest-main-inner {
        margin-top: 2rem
    }
    /*! mixin :공통 - 헤더영역 */
    /*! 검색 - 공통 */
    body.ios.nonotch .component-list.fixed,
    body.ios.nonotch .component-search[class*="fixed"] {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .component-gathering-selected.active {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .component-gathering-selected.active+.component-search {
        top: calc(2rem + 16.2rem)
    }
    /*! 모임통장 - 모임홈 */
    body.ios.nonotch .component-meet-profile {
        margin-top: -2rem
    }
    body.ios.nonotch .component-meethome-profile {
        margin-top: calc(-5rem - 2rem)
    }
    /*! 상단 tab 고정 */
    body.ios.nonotch .component-tab.food-cate-sticky,
    body.ios.nonotch .component-text-simple+.component-tab.sticky,
    body.ios.nonotch .section-component .component-tab.sticky,
    body.ios.nonotch .section-component.living-price-tab .component-tab.sticky {
        top: calc(2rem + 5rem)
    }
    /*! 이체 */
    body.ios.nonotch .component-header+.component-keypad {
        padding-top: 2rem
    }
    body.ios.nonotch .section-component-sticky {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .fixed-msg-card,
    body.ios.nonotch .section-flex-colume {
        height: calc(100vh - calc(2rem + 5rem))
    }
    body.ios.nonotch .section-flex-colume.type3 {
        height: calc(100vh - calc(2rem + 11rem))
    }
    body.ios.nonotch .section-flex-colume.type4 {
        height: calc(100vh - calc(2rem + 19.4rem))
    }
    body.ios.nonotch .component-card-sum-top.type2[class*="fixed"] {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .dim-moneytree-wrap {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .toast-wrap.ceo-type {
        bottom: auto;
        top: calc(2rem + 9.4rem)
    }
    body.ios.nonotch .component-tab.sticky+.article-component .component-search[class*="fixed"] {
        top: calc(2rem + 11rem)
    }
    body.ios.nonotch .container-component.shopping .component-text.sticky {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .container-component.shopping .component-text.sticky+.component-tab .tab-list-group.sticky {
        top: calc(2rem + 9rem)
    }
    body.ios.nonotch .page-inner-scroll.inandout-scroll .container-component-coach {
        padding-top: 2rem
    }
    body.ios.nonotch .page-inner-scroll.inandout-scroll .container-component-coach.active {
        padding-top: 2rem
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: calc(2rem + 8.6rem)
    }
    body.ios.nonotch .page-inner-scroll.inandout-scroll .container-component-coach .coach-close {
        padding-top: 0
    }
    body.ios.nonotch .page-inner-scroll.inandout-scroll .inandout-calendar-inner {
        top: 2rem
    }
    body.ios.nonotch .inandout-tab-wrap {
        top: calc(5.5rem + 2rem)
    }
    body.ios.nonotch .section-component.custom-policy .component-tab.sticky-chip {
        top: calc(2rem + 11rem)
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.popup-inandout-group.popup-inandout-pre-group {
        padding-top: 2rem
    }
    body.ios.nonotch .popup-inandout-group.pre-event .container-component-coach {
        top: 2rem
    }
    body.ios.nonotch .ailive-today-quiz {
        padding-top: 2rem
    }
    body.ios.nonotch .tab-list-group[data-sticky-item] {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .container-component.ai-quiz .section-component.type2 {
        margin-top: calc(-5rem - 2rem);
        padding-top: calc(5rem + 2rem)
    }
    body.ios.nonotch .container-component.ai-quiz .section-component.type4 {
        margin-top: calc(-5rem - 2rem);
        padding-top: calc(5rem + 2rem)
    }
    body.ios.nonotch .fortune2025 .component-iframe {
        height: calc(100vh - (14.4rem + 2rem))
    }
    body.ios.nonotch .container-component.common-cert.h-center .section-component.cert-section {
        min-height: calc(100vh - 24rem)
    }
    body.ios.nonotch .section-component.stars-type1 {
        height: calc(100vh - (5rem + 2rem))
    }
    body.ios.nonotch .section-component.mission-top {
        top: calc(5rem + 2rem)
    }
    body.ios.nonotch .section-component.mission-rolling {
        top: calc(23.8rem + 2rem)
    }
    body.ios.nonotch .page-inner-scroll.money-mission.first-lock-entry.scroll-top .section-component.mission-rolling {
        top: calc(24.3rem + 2rem)
    }
    body.ios.nonotch .container-component.container-fixed {
        padding-top: calc(5rem + 2rem)
    }
    body.ios.nonotch .page-inner-scroll.no-overscroll-y .container-component {
        padding-top: calc(5rem + 2rem)
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.mission-talisman:after {
        background-color: transparent
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.coin-full-wrap:after {
        background-color: transparent
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.transparent:after {
        background-color: transparent
    }
    body.ios.nonotch .component-invest-calendar {
        top: calc(5rem + 2rem)
    }
    body.ios.nonotch .page-inner-scroll.scrolling .component-tab.financial-scam {
        top: calc(5rem + 2rem)
    }
    body.ios.nonotch .component-tab.sticky-logotab {
        top: calc(5rem + 2rem)
    }
    body.ios.nonotch .tooltip-focus-group .tooltip-area.align-bottom.digit-signature {
        top: calc(2.2rem + 2rem)
    }
    body.ios.nonotch .weekly-invest-main-bg {
        margin-top: calc(var(--header-height) * -1 - 2rem);
        height: calc(var(--weekly-invest-height) + 2rem)
    }
    body.ios.nonotch .weekly-invest-main .extra-cash,
    body.ios.nonotch .weekly-invest-main .gauge,
    body.ios.nonotch .weekly-invest-main-inner {
        margin-top: 2rem
    }
    html.ios.statusExpension .content-savings.expired {
        height: calc(2rem + 53.9rem)
    }
    html.ios.statusExpension .content-savings.expired {
        height: calc(2rem + 53.9rem)
    }
    html.ios.statusExpension .content-savings {
        height: calc(2rem + 44.8rem)
    }
    html.ios.statusExpension .content-savings .img-area {
        top: 2rem
    }
    html.ios.statusExpension .content-savings .prodname-info {
        top: calc(2rem + 30.8rem)
    }
    html.ios.statusExpension .content-savings .kds-banner-card {
        top: calc(2rem + 42.1rem)
    }
    html.ios.statusExpension .savings-scroll .component-header::before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 2rem;
        background: var(--bg-pri-base)
    }
    html.ios.statusExpension .savings-scroll .component-fixed-bottom {
        min-height: calc(100vh - 5rem - 2rem)
    }
    html.ios.statusExpension .container-component.ai-quiz.h-center .section-component {
        height: calc(100% - (16.2rem + 2rem + 0))
    }
    html.ios.statusExpension .container-component.view-center .section-component {
        height: calc(100% - (16.2rem + 2rem + 0))
    }
    html.ios.statusExpension .section-component.alarm-nodata {
        height: calc(100vh - (5rem + 2rem + 0))
    }
    html.ios.statusExpension .container-component.today-coupon.h-center .section-component {
        height: calc(100% - (20.2rem + 2rem + 0))
    }
    html.ios.statusExpension .section-component.stars-type2 {
        padding-top: calc(4.8rem + 2rem);
        padding-bottom: calc(8rem + 0)
    }
    html.ios.statusExpension .page-inner-scroll.scrolling .component-card-sticky {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .content-savings.expired {
        height: calc(2rem + 53.9rem)
    }
    body.ios.nonotch .content-savings.expired {
        height: calc(2rem + 53.9rem)
    }
    body.ios.nonotch .content-savings {
        height: calc(2rem + 44.8rem)
    }
    body.ios.nonotch .content-savings .img-area {
        top: 2rem
    }
    body.ios.nonotch .content-savings .prodname-info {
        top: calc(2rem + 30.8rem)
    }
    body.ios.nonotch .content-savings .kds-banner-card {
        top: calc(2rem + 42.1rem)
    }
    body.ios.nonotch .savings-scroll .component-header::before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 2rem;
        background: var(--bg-pri-base)
    }
    body.ios.nonotch .savings-scroll .component-fixed-bottom {
        min-height: calc(100vh - 5rem - 2rem)
    }
    body.ios.nonotch .container-component.ai-quiz.h-center .section-component {
        height: calc(100% - (16.2rem + 2rem + 0))
    }
    body.ios.nonotch .container-component.view-center .section-component {
        height: calc(100% - (16.2rem + 2rem + 0))
    }
    body.ios.nonotch .section-component.alarm-nodata {
        height: calc(100vh - (5rem + 2rem + 0))
    }
    body.ios.nonotch .container-component.today-coupon.h-center .section-component {
        height: calc(100% - (20.2rem + 2rem + 0))
    }
    body.ios.nonotch .section-component.stars-type2 {
        padding-top: calc(4.8rem + 2rem);
        padding-bottom: calc(8rem + 0)
    }
    body.ios.nonotch .page-inner-scroll.scrolling .component-card-sticky {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: 2.2rem
    }
}

/*! 노치(X) 5, 5s, 5c, SE1세대 6(확대), 6s(확대), 7(확대), 8(확대), SE1세대 */

@media only screen and (device-width: 320px) and (device-height: 568px) and (-webkit-device-pixel-ratio: 2) {
    /*! mixin :공통 - 헤더영역 */
    html.ios.statusExpension .component-header {
        padding-top: 2rem
    }
    html.ios.statusExpension .popup-header .component-header {
        padding-top: 0
    }
    /*! 홈 - 일반 */
    html.ios.statusExpension .home-default .main-container-component.bg-main {
        padding-top: calc(2rem + 5.6rem)
    }
    /*! 홈 - 추천 */
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"].scrolling .component-tab.sticky-tab {
        top: calc(2rem + 0.2rem)
    }
    /*! 홈 - 혜택 */
    html.ios.statusExpension .page-inner-scroll.scrolling .component-tab.sticky-tab02 .tab-round-group {
        top: calc(2rem + 5rem)
    }
    /*! 홈 - 타임라인 */
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"].scrolling .component-form-date {
        top: calc(2rem + 5rem + 0.2rem)
    }
    /*! 홈 - 순서변경 */
    html.ios.statusExpension .page-inner-scroll.scrolling .component-text-simple.fixed-top {
        top: calc(2rem + 0.9rem)
    }
    /*! 공통 - 풀팝업일때 */
    html.ios.statusExpension .popup-dialog.ui-full .popup-group,
    html.ios.statusExpension .popup-dialog.ui-full-change .popup-group,
    html.ios.statusExpension .popup-dialog.ui-full-change.plus-box-event-pop .popup-group {
        padding-top: 2rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group:after {
        content: '';
        height: 2rem;
        background-color: var(--color-w100, #fff);
        position: fixed;
        top: 0;
        left: 0;
        width: 100%
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group:after {
        display: none
    }
    html.ios.statusExpension .popup-dialog.ui-full-change.plus-box-event-pop .interest-group-top .ani-step1-1 {
        margin-top: 8.2rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.shopping:after {
        background: var(--color-in700)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.shopping.bg-white:after {
        background-color: var(--color-w100, #fff)
    }
    /*! 홈 개편 */
    html.ios.statusExpension .component-header.main {
        padding-top: calc(2rem + 0.6rem)
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh {
        padding-top: 2rem
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh.pull-home {
        padding-top: 0;
        margin-top: 2rem
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: 0.6rem
    }
    html.ios.statusExpension .scrolling .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: calc(2rem + 0.6rem)
    }
    html.ios.statusExpension .component-tab.foru-tab-ver.scrollOn .tab-group.foru-type {
        top: calc(2rem)
    }
    html.ios.statusExpension .component-header.main+.component-tab.foru-tab-ver {
        top: calc(2rem + 5.6rem)
    }
    html.ios.statusExpension .component-main-bnf-tab {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .invest-home .tab-list-group.sticky-invest {
        top: calc(2rem + 5.6rem)
    }
    html.ios.statusExpension .component-ceo-calendar {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .component-ceo-my-account.type2 {
        padding-top: calc(2rem + 37rem)
    }
    html.ios.statusExpension .container-component-coach .coach-item01 {
        padding-top: 2rem
    }
    html.ios.statusExpension .component-header.search {
        padding-top: calc(2rem + 1.2rem);
        height: auto
    }
    html.ios.statusExpension .component-header.search.search-result {
        height: calc(2rem + 10.5rem)
    }
    html.ios.statusExpension .popup-inner .component-header.search.search-result {
        height: 10.5rem
    }
    html.ios.statusExpension .popup-inner .component-header.search.sticky {
        top: 2rem;
        padding-top: 1.2rem
    }
    html.ios.statusExpension .section-component.alarm .component-keyword {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .section-component.alarm .component-form-date {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .section-component.alarm.alarm-filter .component-form-date {
        top: calc(2rem + 10.6rem)
    }
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"] .component-main-refresh {
        top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: 2.2rem
    }
    html.ios.statusExpension .safe-camp-kv .safe-camp-inner {
        margin-top: 2rem
    }
    /*! mixin :공통 - 헤더영역 */
    body.ios.nonotch .component-header {
        padding-top: 2rem
    }
    body.ios.nonotch .popup-header .component-header {
        padding-top: 0
    }
    /*! 홈 - 일반 */
    body.ios.nonotch .home-default .main-container-component.bg-main {
        padding-top: calc(2rem + 5.6rem)
    }
    /*! 홈 - 추천 */
    body.ios.nonotch .main-tab-container [class^="main-tab-content0"].scrolling .component-tab.sticky-tab {
        top: calc(2rem + 0.2rem)
    }
    /*! 홈 - 혜택 */
    body.ios.nonotch .page-inner-scroll.scrolling .component-tab.sticky-tab02 .tab-round-group {
        top: calc(2rem + 5rem)
    }
    /*! 홈 - 타임라인 */
    body.ios.nonotch .main-tab-container [class^="main-tab-content0"].scrolling .component-form-date {
        top: calc(2rem + 5rem + 0.2rem)
    }
    /*! 홈 - 순서변경 */
    body.ios.nonotch .page-inner-scroll.scrolling .component-text-simple.fixed-top {
        top: calc(2rem + 0.9rem)
    }
    /*! 공통 - 풀팝업일때 */
    body.ios.nonotch .popup-dialog.ui-full .popup-group,
    body.ios.nonotch .popup-dialog.ui-full-change .popup-group,
    body.ios.nonotch .popup-dialog.ui-full-change.plus-box-event-pop .popup-group {
        padding-top: 2rem
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group:after {
        content: '';
        height: 2rem;
        background-color: var(--color-w100, #fff);
        position: fixed;
        top: 0;
        left: 0;
        width: 100%
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.popup-inandout-group:after {
        display: none
    }
    body.ios.nonotch .popup-dialog.ui-full-change.plus-box-event-pop .interest-group-top .ani-step1-1 {
        margin-top: 8.2rem
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.shopping:after {
        background: var(--color-in700)
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.shopping.bg-white:after {
        background-color: var(--color-w100, #fff)
    }
    /*! 홈 개편 */
    body.ios.nonotch .component-header.main {
        padding-top: calc(2rem + 0.6rem)
    }
    body.ios.nonotch .ptr--ptr.ptr--refresh {
        padding-top: 2rem
    }
    body.ios.nonotch .ptr--ptr.ptr--refresh.pull-home {
        padding-top: 0;
        margin-top: 2rem
    }
    body.ios.nonotch .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: 0.6rem
    }
    body.ios.nonotch .scrolling .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: calc(2rem + 0.6rem)
    }
    body.ios.nonotch .component-tab.foru-tab-ver.scrollOn .tab-group.foru-type {
        top: calc(2rem)
    }
    body.ios.nonotch .component-header.main+.component-tab.foru-tab-ver {
        top: calc(2rem + 5.6rem)
    }
    body.ios.nonotch .component-main-bnf-tab {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .invest-home .tab-list-group.sticky-invest {
        top: calc(2rem + 5.6rem)
    }
    body.ios.nonotch .component-ceo-calendar {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .component-ceo-my-account.type2 {
        padding-top: calc(2rem + 37rem)
    }
    body.ios.nonotch .container-component-coach .coach-item01 {
        padding-top: 2rem
    }
    body.ios.nonotch .component-header.search {
        padding-top: calc(2rem + 1.2rem);
        height: auto
    }
    body.ios.nonotch .component-header.search.search-result {
        height: calc(2rem + 10.5rem)
    }
    body.ios.nonotch .popup-inner .component-header.search.search-result {
        height: 10.5rem
    }
    body.ios.nonotch .popup-inner .component-header.search.sticky {
        top: 2rem;
        padding-top: 1.2rem
    }
    body.ios.nonotch .section-component.alarm .component-keyword {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .section-component.alarm .component-form-date {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .section-component.alarm.alarm-filter .component-form-date {
        top: calc(2rem + 10.6rem)
    }
    body.ios.nonotch .main-tab-container [class^="main-tab-content0"] .component-main-refresh {
        top: calc(5rem + 2rem)
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: 2.2rem
    }
    body.ios.nonotch .safe-camp-kv .safe-camp-inner {
        margin-top: 2rem
    }
    /*! mixin :공통 - 헤더영역 */
    /*! 검색 - 공통 */
    html.ios.statusExpension .component-list.fixed,
    html.ios.statusExpension .component-search[class*="fixed"] {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .component-gathering-selected.active {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .component-gathering-selected.active+.component-search {
        top: calc(2rem + 16.2rem)
    }
    /*! 모임통장 - 모임홈 */
    html.ios.statusExpension .component-meet-profile {
        margin-top: -2rem
    }
    html.ios.statusExpension .component-meethome-profile {
        margin-top: calc(-5rem - 2rem)
    }
    /*! 상단 tab 고정 */
    html.ios.statusExpension .component-tab.food-cate-sticky,
    html.ios.statusExpension .component-text-simple+.component-tab.sticky,
    html.ios.statusExpension .section-component .component-tab.sticky,
    html.ios.statusExpension .section-component.living-price-tab .component-tab.sticky {
        top: calc(2rem + 5rem)
    }
    /*! 이체 */
    html.ios.statusExpension .component-header+.component-keypad {
        padding-top: 2rem
    }
    html.ios.statusExpension .section-component-sticky {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .fixed-msg-card,
    html.ios.statusExpension .section-flex-colume {
        height: calc(100vh - calc(2rem + 5rem))
    }
    html.ios.statusExpension .section-flex-colume.type3 {
        height: calc(100vh - calc(2rem + 11rem))
    }
    html.ios.statusExpension .section-flex-colume.type4 {
        height: calc(100vh - calc(2rem + 19.4rem))
    }
    html.ios.statusExpension .component-card-sum-top.type2[class*="fixed"] {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .dim-moneytree-wrap {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .toast-wrap.ceo-type {
        bottom: auto;
        top: calc(2rem + 9.4rem)
    }
    html.ios.statusExpension .component-tab.sticky+.article-component .component-search[class*="fixed"] {
        top: calc(2rem + 11rem)
    }
    html.ios.statusExpension .container-component.shopping .component-text.sticky {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .container-component.shopping .component-text.sticky+.component-tab .tab-list-group.sticky {
        top: calc(2rem + 9rem)
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach {
        padding-top: 2rem
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach.active {
        padding-top: 2rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: calc(2rem + 8.6rem)
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach .coach-close {
        padding-top: 0
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .inandout-calendar-inner {
        top: 2rem
    }
    html.ios.statusExpension .inandout-tab-wrap {
        top: calc(5.5rem + 2rem)
    }
    html.ios.statusExpension .section-component.custom-policy .component-tab.sticky-chip {
        top: calc(2rem + 11rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group.popup-inandout-pre-group {
        padding-top: 2rem
    }
    html.ios.statusExpension .popup-inandout-group.pre-event .container-component-coach {
        top: 2rem
    }
    html.ios.statusExpension .ailive-today-quiz {
        padding-top: 2rem
    }
    html.ios.statusExpension .tab-list-group[data-sticky-item] {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .container-component.ai-quiz .section-component.type2 {
        margin-top: calc(-5rem - 2rem);
        padding-top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .container-component.ai-quiz .section-component.type4 {
        margin-top: calc(-5rem - 2rem);
        padding-top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .fortune2025 .component-iframe {
        height: calc(100vh - (14.4rem + 2rem))
    }
    html.ios.statusExpension .container-component.common-cert.h-center .section-component.cert-section {
        min-height: calc(100vh - 24rem)
    }
    html.ios.statusExpension .section-component.stars-type1 {
        height: calc(100vh - (5rem + 2rem))
    }
    html.ios.statusExpension .section-component.mission-top {
        top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .section-component.mission-rolling {
        top: calc(23.8rem + 2rem)
    }
    html.ios.statusExpension .page-inner-scroll.money-mission.first-lock-entry.scroll-top .section-component.mission-rolling {
        top: calc(24.3rem + 2rem)
    }
    html.ios.statusExpension .container-component.container-fixed {
        padding-top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .page-inner-scroll.no-overscroll-y .container-component {
        padding-top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.mission-talisman:after {
        background-color: transparent
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.coin-full-wrap:after {
        background-color: transparent
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.transparent:after {
        background-color: transparent
    }
    html.ios.statusExpension .component-invest-calendar {
        top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .page-inner-scroll.scrolling .component-tab.financial-scam {
        top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .component-tab.sticky-logotab {
        top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .tooltip-focus-group .tooltip-area.align-bottom.digit-signature {
        top: calc(2.2rem + 2rem)
    }
    html.ios.statusExpension .weekly-invest-main-bg {
        margin-top: calc(var(--header-height) * -1 - 2rem);
        height: calc(var(--weekly-invest-height) + 2rem)
    }
    html.ios.statusExpension .weekly-invest-main .extra-cash,
    html.ios.statusExpension .weekly-invest-main .gauge,
    html.ios.statusExpension .weekly-invest-main-inner {
        margin-top: 2rem
    }
    /*! mixin :공통 - 헤더영역 */
    /*! 검색 - 공통 */
    body.ios.nonotch .component-list.fixed,
    body.ios.nonotch .component-search[class*="fixed"] {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .component-gathering-selected.active {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .component-gathering-selected.active+.component-search {
        top: calc(2rem + 16.2rem)
    }
    /*! 모임통장 - 모임홈 */
    body.ios.nonotch .component-meet-profile {
        margin-top: -2rem
    }
    body.ios.nonotch .component-meethome-profile {
        margin-top: calc(-5rem - 2rem)
    }
    /*! 상단 tab 고정 */
    body.ios.nonotch .component-tab.food-cate-sticky,
    body.ios.nonotch .component-text-simple+.component-tab.sticky,
    body.ios.nonotch .section-component .component-tab.sticky,
    body.ios.nonotch .section-component.living-price-tab .component-tab.sticky {
        top: calc(2rem + 5rem)
    }
    /*! 이체 */
    body.ios.nonotch .component-header+.component-keypad {
        padding-top: 2rem
    }
    body.ios.nonotch .section-component-sticky {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .fixed-msg-card,
    body.ios.nonotch .section-flex-colume {
        height: calc(100vh - calc(2rem + 5rem))
    }
    body.ios.nonotch .section-flex-colume.type3 {
        height: calc(100vh - calc(2rem + 11rem))
    }
    body.ios.nonotch .section-flex-colume.type4 {
        height: calc(100vh - calc(2rem + 19.4rem))
    }
    body.ios.nonotch .component-card-sum-top.type2[class*="fixed"] {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .dim-moneytree-wrap {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .toast-wrap.ceo-type {
        bottom: auto;
        top: calc(2rem + 9.4rem)
    }
    body.ios.nonotch .component-tab.sticky+.article-component .component-search[class*="fixed"] {
        top: calc(2rem + 11rem)
    }
    body.ios.nonotch .container-component.shopping .component-text.sticky {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .container-component.shopping .component-text.sticky+.component-tab .tab-list-group.sticky {
        top: calc(2rem + 9rem)
    }
    body.ios.nonotch .page-inner-scroll.inandout-scroll .container-component-coach {
        padding-top: 2rem
    }
    body.ios.nonotch .page-inner-scroll.inandout-scroll .container-component-coach.active {
        padding-top: 2rem
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: calc(2rem + 8.6rem)
    }
    body.ios.nonotch .page-inner-scroll.inandout-scroll .container-component-coach .coach-close {
        padding-top: 0
    }
    body.ios.nonotch .page-inner-scroll.inandout-scroll .inandout-calendar-inner {
        top: 2rem
    }
    body.ios.nonotch .inandout-tab-wrap {
        top: calc(5.5rem + 2rem)
    }
    body.ios.nonotch .section-component.custom-policy .component-tab.sticky-chip {
        top: calc(2rem + 11rem)
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.popup-inandout-group.popup-inandout-pre-group {
        padding-top: 2rem
    }
    body.ios.nonotch .popup-inandout-group.pre-event .container-component-coach {
        top: 2rem
    }
    body.ios.nonotch .ailive-today-quiz {
        padding-top: 2rem
    }
    body.ios.nonotch .tab-list-group[data-sticky-item] {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .container-component.ai-quiz .section-component.type2 {
        margin-top: calc(-5rem - 2rem);
        padding-top: calc(5rem + 2rem)
    }
    body.ios.nonotch .container-component.ai-quiz .section-component.type4 {
        margin-top: calc(-5rem - 2rem);
        padding-top: calc(5rem + 2rem)
    }
    body.ios.nonotch .fortune2025 .component-iframe {
        height: calc(100vh - (14.4rem + 2rem))
    }
    body.ios.nonotch .container-component.common-cert.h-center .section-component.cert-section {
        min-height: calc(100vh - 24rem)
    }
    body.ios.nonotch .section-component.stars-type1 {
        height: calc(100vh - (5rem + 2rem))
    }
    body.ios.nonotch .section-component.mission-top {
        top: calc(5rem + 2rem)
    }
    body.ios.nonotch .section-component.mission-rolling {
        top: calc(23.8rem + 2rem)
    }
    body.ios.nonotch .page-inner-scroll.money-mission.first-lock-entry.scroll-top .section-component.mission-rolling {
        top: calc(24.3rem + 2rem)
    }
    body.ios.nonotch .container-component.container-fixed {
        padding-top: calc(5rem + 2rem)
    }
    body.ios.nonotch .page-inner-scroll.no-overscroll-y .container-component {
        padding-top: calc(5rem + 2rem)
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.mission-talisman:after {
        background-color: transparent
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.coin-full-wrap:after {
        background-color: transparent
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.transparent:after {
        background-color: transparent
    }
    body.ios.nonotch .component-invest-calendar {
        top: calc(5rem + 2rem)
    }
    body.ios.nonotch .page-inner-scroll.scrolling .component-tab.financial-scam {
        top: calc(5rem + 2rem)
    }
    body.ios.nonotch .component-tab.sticky-logotab {
        top: calc(5rem + 2rem)
    }
    body.ios.nonotch .tooltip-focus-group .tooltip-area.align-bottom.digit-signature {
        top: calc(2.2rem + 2rem)
    }
    body.ios.nonotch .weekly-invest-main-bg {
        margin-top: calc(var(--header-height) * -1 - 2rem);
        height: calc(var(--weekly-invest-height) + 2rem)
    }
    body.ios.nonotch .weekly-invest-main .extra-cash,
    body.ios.nonotch .weekly-invest-main .gauge,
    body.ios.nonotch .weekly-invest-main-inner {
        margin-top: 2rem
    }
    html.ios.statusExpension .content-savings.expired {
        height: calc(2rem + 53.9rem)
    }
    html.ios.statusExpension .content-savings.expired {
        height: calc(2rem + 53.9rem)
    }
    html.ios.statusExpension .content-savings {
        height: calc(2rem + 44.8rem)
    }
    html.ios.statusExpension .content-savings .img-area {
        top: 2rem
    }
    html.ios.statusExpension .content-savings .prodname-info {
        top: calc(2rem + 30.8rem)
    }
    html.ios.statusExpension .content-savings .kds-banner-card {
        top: calc(2rem + 42.1rem)
    }
    html.ios.statusExpension .savings-scroll .component-header::before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 2rem;
        background: var(--bg-pri-base)
    }
    html.ios.statusExpension .savings-scroll .component-fixed-bottom {
        min-height: calc(100vh - 5rem - 2rem)
    }
    html.ios.statusExpension .container-component.ai-quiz.h-center .section-component {
        height: calc(100% - (16.2rem + 2rem + 0))
    }
    html.ios.statusExpension .container-component.view-center .section-component {
        height: calc(100% - (16.2rem + 2rem + 0))
    }
    html.ios.statusExpension .section-component.alarm-nodata {
        height: calc(100vh - (5rem + 2rem + 0))
    }
    html.ios.statusExpension .container-component.today-coupon.h-center .section-component {
        height: calc(100% - (20.2rem + 2rem + 0))
    }
    html.ios.statusExpension .section-component.stars-type2 {
        padding-top: calc(4.8rem + 2rem);
        padding-bottom: calc(8rem + 0)
    }
    html.ios.statusExpension .page-inner-scroll.scrolling .component-card-sticky {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .content-savings.expired {
        height: calc(2rem + 53.9rem)
    }
    body.ios.nonotch .content-savings.expired {
        height: calc(2rem + 53.9rem)
    }
    body.ios.nonotch .content-savings {
        height: calc(2rem + 44.8rem)
    }
    body.ios.nonotch .content-savings .img-area {
        top: 2rem
    }
    body.ios.nonotch .content-savings .prodname-info {
        top: calc(2rem + 30.8rem)
    }
    body.ios.nonotch .content-savings .kds-banner-card {
        top: calc(2rem + 42.1rem)
    }
    body.ios.nonotch .savings-scroll .component-header::before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 2rem;
        background: var(--bg-pri-base)
    }
    body.ios.nonotch .savings-scroll .component-fixed-bottom {
        min-height: calc(100vh - 5rem - 2rem)
    }
    body.ios.nonotch .container-component.ai-quiz.h-center .section-component {
        height: calc(100% - (16.2rem + 2rem + 0))
    }
    body.ios.nonotch .container-component.view-center .section-component {
        height: calc(100% - (16.2rem + 2rem + 0))
    }
    body.ios.nonotch .section-component.alarm-nodata {
        height: calc(100vh - (5rem + 2rem + 0))
    }
    body.ios.nonotch .container-component.today-coupon.h-center .section-component {
        height: calc(100% - (20.2rem + 2rem + 0))
    }
    body.ios.nonotch .section-component.stars-type2 {
        padding-top: calc(4.8rem + 2rem);
        padding-bottom: calc(8rem + 0)
    }
    body.ios.nonotch .page-inner-scroll.scrolling .component-card-sticky {
        top: calc(2rem + 5rem)
    }
}

/*! 노치(X) 4, 4s */

@media only screen and (device-width: 320px) and (device-height: 480px) and (-webkit-device-pixel-ratio: 2) {
    /*! mixin :공통 - 헤더영역 */
    html.ios.statusExpension .component-header {
        padding-top: 2rem
    }
    html.ios.statusExpension .popup-header .component-header {
        padding-top: 0
    }
    /*! 홈 - 일반 */
    html.ios.statusExpension .home-default .main-container-component.bg-main {
        padding-top: calc(2rem + 5.6rem)
    }
    /*! 홈 - 추천 */
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"].scrolling .component-tab.sticky-tab {
        top: calc(2rem + 0.2rem)
    }
    /*! 홈 - 혜택 */
    html.ios.statusExpension .page-inner-scroll.scrolling .component-tab.sticky-tab02 .tab-round-group {
        top: calc(2rem + 5rem)
    }
    /*! 홈 - 타임라인 */
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"].scrolling .component-form-date {
        top: calc(2rem + 5rem + 0.2rem)
    }
    /*! 홈 - 순서변경 */
    html.ios.statusExpension .page-inner-scroll.scrolling .component-text-simple.fixed-top {
        top: calc(2rem + 0.9rem)
    }
    /*! 공통 - 풀팝업일때 */
    html.ios.statusExpension .popup-dialog.ui-full .popup-group,
    html.ios.statusExpension .popup-dialog.ui-full-change .popup-group,
    html.ios.statusExpension .popup-dialog.ui-full-change.plus-box-event-pop .popup-group {
        padding-top: 2rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group:after {
        content: '';
        height: 2rem;
        background-color: var(--color-w100, #fff);
        position: fixed;
        top: 0;
        left: 0;
        width: 100%
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group:after {
        display: none
    }
    html.ios.statusExpension .popup-dialog.ui-full-change.plus-box-event-pop .interest-group-top .ani-step1-1 {
        margin-top: 8.2rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.shopping:after {
        background: var(--color-in700)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.shopping.bg-white:after {
        background-color: var(--color-w100, #fff)
    }
    /*! 홈 개편 */
    html.ios.statusExpension .component-header.main {
        padding-top: calc(2rem + 0.6rem)
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh {
        padding-top: 2rem
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh.pull-home {
        padding-top: 0;
        margin-top: 2rem
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: 0.6rem
    }
    html.ios.statusExpension .scrolling .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: calc(2rem + 0.6rem)
    }
    html.ios.statusExpension .component-tab.foru-tab-ver.scrollOn .tab-group.foru-type {
        top: calc(2rem)
    }
    html.ios.statusExpension .component-header.main+.component-tab.foru-tab-ver {
        top: calc(2rem + 5.6rem)
    }
    html.ios.statusExpension .component-main-bnf-tab {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .invest-home .tab-list-group.sticky-invest {
        top: calc(2rem + 5.6rem)
    }
    html.ios.statusExpension .component-ceo-calendar {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .component-ceo-my-account.type2 {
        padding-top: calc(2rem + 37rem)
    }
    html.ios.statusExpension .container-component-coach .coach-item01 {
        padding-top: 2rem
    }
    html.ios.statusExpension .component-header.search {
        padding-top: calc(2rem + 1.2rem);
        height: auto
    }
    html.ios.statusExpension .component-header.search.search-result {
        height: calc(2rem + 10.5rem)
    }
    html.ios.statusExpension .popup-inner .component-header.search.search-result {
        height: 10.5rem
    }
    html.ios.statusExpension .popup-inner .component-header.search.sticky {
        top: 2rem;
        padding-top: 1.2rem
    }
    html.ios.statusExpension .section-component.alarm .component-keyword {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .section-component.alarm .component-form-date {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .section-component.alarm.alarm-filter .component-form-date {
        top: calc(2rem + 10.6rem)
    }
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"] .component-main-refresh {
        top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: 2.2rem
    }
    html.ios.statusExpension .safe-camp-kv .safe-camp-inner {
        margin-top: 2rem
    }
    /*! mixin :공통 - 헤더영역 */
    body.ios.nonotch .component-header {
        padding-top: 2rem
    }
    body.ios.nonotch .popup-header .component-header {
        padding-top: 0
    }
    /*! 홈 - 일반 */
    body.ios.nonotch .home-default .main-container-component.bg-main {
        padding-top: calc(2rem + 5.6rem)
    }
    /*! 홈 - 추천 */
    body.ios.nonotch .main-tab-container [class^="main-tab-content0"].scrolling .component-tab.sticky-tab {
        top: calc(2rem + 0.2rem)
    }
    /*! 홈 - 혜택 */
    body.ios.nonotch .page-inner-scroll.scrolling .component-tab.sticky-tab02 .tab-round-group {
        top: calc(2rem + 5rem)
    }
    /*! 홈 - 타임라인 */
    body.ios.nonotch .main-tab-container [class^="main-tab-content0"].scrolling .component-form-date {
        top: calc(2rem + 5rem + 0.2rem)
    }
    /*! 홈 - 순서변경 */
    body.ios.nonotch .page-inner-scroll.scrolling .component-text-simple.fixed-top {
        top: calc(2rem + 0.9rem)
    }
    /*! 공통 - 풀팝업일때 */
    body.ios.nonotch .popup-dialog.ui-full .popup-group,
    body.ios.nonotch .popup-dialog.ui-full-change .popup-group,
    body.ios.nonotch .popup-dialog.ui-full-change.plus-box-event-pop .popup-group {
        padding-top: 2rem
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group:after {
        content: '';
        height: 2rem;
        background-color: var(--color-w100, #fff);
        position: fixed;
        top: 0;
        left: 0;
        width: 100%
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.popup-inandout-group:after {
        display: none
    }
    body.ios.nonotch .popup-dialog.ui-full-change.plus-box-event-pop .interest-group-top .ani-step1-1 {
        margin-top: 8.2rem
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.shopping:after {
        background: var(--color-in700)
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.shopping.bg-white:after {
        background-color: var(--color-w100, #fff)
    }
    /*! 홈 개편 */
    body.ios.nonotch .component-header.main {
        padding-top: calc(2rem + 0.6rem)
    }
    body.ios.nonotch .ptr--ptr.ptr--refresh {
        padding-top: 2rem
    }
    body.ios.nonotch .ptr--ptr.ptr--refresh.pull-home {
        padding-top: 0;
        margin-top: 2rem
    }
    body.ios.nonotch .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: 0.6rem
    }
    body.ios.nonotch .scrolling .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: calc(2rem + 0.6rem)
    }
    body.ios.nonotch .component-tab.foru-tab-ver.scrollOn .tab-group.foru-type {
        top: calc(2rem)
    }
    body.ios.nonotch .component-header.main+.component-tab.foru-tab-ver {
        top: calc(2rem + 5.6rem)
    }
    body.ios.nonotch .component-main-bnf-tab {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .invest-home .tab-list-group.sticky-invest {
        top: calc(2rem + 5.6rem)
    }
    body.ios.nonotch .component-ceo-calendar {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .component-ceo-my-account.type2 {
        padding-top: calc(2rem + 37rem)
    }
    body.ios.nonotch .container-component-coach .coach-item01 {
        padding-top: 2rem
    }
    body.ios.nonotch .component-header.search {
        padding-top: calc(2rem + 1.2rem);
        height: auto
    }
    body.ios.nonotch .component-header.search.search-result {
        height: calc(2rem + 10.5rem)
    }
    body.ios.nonotch .popup-inner .component-header.search.search-result {
        height: 10.5rem
    }
    body.ios.nonotch .popup-inner .component-header.search.sticky {
        top: 2rem;
        padding-top: 1.2rem
    }
    body.ios.nonotch .section-component.alarm .component-keyword {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .section-component.alarm .component-form-date {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .section-component.alarm.alarm-filter .component-form-date {
        top: calc(2rem + 10.6rem)
    }
    body.ios.nonotch .main-tab-container [class^="main-tab-content0"] .component-main-refresh {
        top: calc(5rem + 2rem)
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: 2.2rem
    }
    body.ios.nonotch .safe-camp-kv .safe-camp-inner {
        margin-top: 2rem
    }
    /*! mixin :공통 - 헤더영역 */
    /*! 검색 - 공통 */
    html.ios.statusExpension .component-list.fixed,
    html.ios.statusExpension .component-search[class*="fixed"] {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .component-gathering-selected.active {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .component-gathering-selected.active+.component-search {
        top: calc(2rem + 16.2rem)
    }
    /*! 모임통장 - 모임홈 */
    html.ios.statusExpension .component-meet-profile {
        margin-top: -2rem
    }
    html.ios.statusExpension .component-meethome-profile {
        margin-top: calc(-5rem - 2rem)
    }
    /*! 상단 tab 고정 */
    html.ios.statusExpension .component-tab.food-cate-sticky,
    html.ios.statusExpension .component-text-simple+.component-tab.sticky,
    html.ios.statusExpension .section-component .component-tab.sticky,
    html.ios.statusExpension .section-component.living-price-tab .component-tab.sticky {
        top: calc(2rem + 5rem)
    }
    /*! 이체 */
    html.ios.statusExpension .component-header+.component-keypad {
        padding-top: 2rem
    }
    html.ios.statusExpension .section-component-sticky {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .fixed-msg-card,
    html.ios.statusExpension .section-flex-colume {
        height: calc(100vh - calc(2rem + 5rem))
    }
    html.ios.statusExpension .section-flex-colume.type3 {
        height: calc(100vh - calc(2rem + 11rem))
    }
    html.ios.statusExpension .section-flex-colume.type4 {
        height: calc(100vh - calc(2rem + 19.4rem))
    }
    html.ios.statusExpension .component-card-sum-top.type2[class*="fixed"] {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .dim-moneytree-wrap {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .toast-wrap.ceo-type {
        bottom: auto;
        top: calc(2rem + 9.4rem)
    }
    html.ios.statusExpension .component-tab.sticky+.article-component .component-search[class*="fixed"] {
        top: calc(2rem + 11rem)
    }
    html.ios.statusExpension .container-component.shopping .component-text.sticky {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .container-component.shopping .component-text.sticky+.component-tab .tab-list-group.sticky {
        top: calc(2rem + 9rem)
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach {
        padding-top: 2rem
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach.active {
        padding-top: 2rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: calc(2rem + 8.6rem)
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach .coach-close {
        padding-top: 0
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .inandout-calendar-inner {
        top: 2rem
    }
    html.ios.statusExpension .inandout-tab-wrap {
        top: calc(5.5rem + 2rem)
    }
    html.ios.statusExpension .section-component.custom-policy .component-tab.sticky-chip {
        top: calc(2rem + 11rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group.popup-inandout-pre-group {
        padding-top: 2rem
    }
    html.ios.statusExpension .popup-inandout-group.pre-event .container-component-coach {
        top: 2rem
    }
    html.ios.statusExpension .ailive-today-quiz {
        padding-top: 2rem
    }
    html.ios.statusExpension .tab-list-group[data-sticky-item] {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .container-component.ai-quiz .section-component.type2 {
        margin-top: calc(-5rem - 2rem);
        padding-top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .container-component.ai-quiz .section-component.type4 {
        margin-top: calc(-5rem - 2rem);
        padding-top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .fortune2025 .component-iframe {
        height: calc(100vh - (14.4rem + 2rem))
    }
    html.ios.statusExpension .container-component.common-cert.h-center .section-component.cert-section {
        min-height: calc(100vh - 24rem)
    }
    html.ios.statusExpension .section-component.stars-type1 {
        height: calc(100vh - (5rem + 2rem))
    }
    html.ios.statusExpension .section-component.mission-top {
        top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .section-component.mission-rolling {
        top: calc(23.8rem + 2rem)
    }
    html.ios.statusExpension .page-inner-scroll.money-mission.first-lock-entry.scroll-top .section-component.mission-rolling {
        top: calc(24.3rem + 2rem)
    }
    html.ios.statusExpension .container-component.container-fixed {
        padding-top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .page-inner-scroll.no-overscroll-y .container-component {
        padding-top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.mission-talisman:after {
        background-color: transparent
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.coin-full-wrap:after {
        background-color: transparent
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.transparent:after {
        background-color: transparent
    }
    html.ios.statusExpension .component-invest-calendar {
        top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .page-inner-scroll.scrolling .component-tab.financial-scam {
        top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .component-tab.sticky-logotab {
        top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .tooltip-focus-group .tooltip-area.align-bottom.digit-signature {
        top: calc(2.2rem + 2rem)
    }
    html.ios.statusExpension .weekly-invest-main-bg {
        margin-top: calc(var(--header-height) * -1 - 2rem);
        height: calc(var(--weekly-invest-height) + 2rem)
    }
    html.ios.statusExpension .weekly-invest-main .extra-cash,
    html.ios.statusExpension .weekly-invest-main .gauge,
    html.ios.statusExpension .weekly-invest-main-inner {
        margin-top: 2rem
    }
    /*! mixin :공통 - 헤더영역 */
    /*! 검색 - 공통 */
    body.ios.nonotch .component-list.fixed,
    body.ios.nonotch .component-search[class*="fixed"] {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .component-gathering-selected.active {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .component-gathering-selected.active+.component-search {
        top: calc(2rem + 16.2rem)
    }
    /*! 모임통장 - 모임홈 */
    body.ios.nonotch .component-meet-profile {
        margin-top: -2rem
    }
    body.ios.nonotch .component-meethome-profile {
        margin-top: calc(-5rem - 2rem)
    }
    /*! 상단 tab 고정 */
    body.ios.nonotch .component-tab.food-cate-sticky,
    body.ios.nonotch .component-text-simple+.component-tab.sticky,
    body.ios.nonotch .section-component .component-tab.sticky,
    body.ios.nonotch .section-component.living-price-tab .component-tab.sticky {
        top: calc(2rem + 5rem)
    }
    /*! 이체 */
    body.ios.nonotch .component-header+.component-keypad {
        padding-top: 2rem
    }
    body.ios.nonotch .section-component-sticky {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .fixed-msg-card,
    body.ios.nonotch .section-flex-colume {
        height: calc(100vh - calc(2rem + 5rem))
    }
    body.ios.nonotch .section-flex-colume.type3 {
        height: calc(100vh - calc(2rem + 11rem))
    }
    body.ios.nonotch .section-flex-colume.type4 {
        height: calc(100vh - calc(2rem + 19.4rem))
    }
    body.ios.nonotch .component-card-sum-top.type2[class*="fixed"] {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .dim-moneytree-wrap {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .toast-wrap.ceo-type {
        bottom: auto;
        top: calc(2rem + 9.4rem)
    }
    body.ios.nonotch .component-tab.sticky+.article-component .component-search[class*="fixed"] {
        top: calc(2rem + 11rem)
    }
    body.ios.nonotch .container-component.shopping .component-text.sticky {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .container-component.shopping .component-text.sticky+.component-tab .tab-list-group.sticky {
        top: calc(2rem + 9rem)
    }
    body.ios.nonotch .page-inner-scroll.inandout-scroll .container-component-coach {
        padding-top: 2rem
    }
    body.ios.nonotch .page-inner-scroll.inandout-scroll .container-component-coach.active {
        padding-top: 2rem
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: calc(2rem + 8.6rem)
    }
    body.ios.nonotch .page-inner-scroll.inandout-scroll .container-component-coach .coach-close {
        padding-top: 0
    }
    body.ios.nonotch .page-inner-scroll.inandout-scroll .inandout-calendar-inner {
        top: 2rem
    }
    body.ios.nonotch .inandout-tab-wrap {
        top: calc(5.5rem + 2rem)
    }
    body.ios.nonotch .section-component.custom-policy .component-tab.sticky-chip {
        top: calc(2rem + 11rem)
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.popup-inandout-group.popup-inandout-pre-group {
        padding-top: 2rem
    }
    body.ios.nonotch .popup-inandout-group.pre-event .container-component-coach {
        top: 2rem
    }
    body.ios.nonotch .ailive-today-quiz {
        padding-top: 2rem
    }
    body.ios.nonotch .tab-list-group[data-sticky-item] {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .container-component.ai-quiz .section-component.type2 {
        margin-top: calc(-5rem - 2rem);
        padding-top: calc(5rem + 2rem)
    }
    body.ios.nonotch .container-component.ai-quiz .section-component.type4 {
        margin-top: calc(-5rem - 2rem);
        padding-top: calc(5rem + 2rem)
    }
    body.ios.nonotch .fortune2025 .component-iframe {
        height: calc(100vh - (14.4rem + 2rem))
    }
    body.ios.nonotch .container-component.common-cert.h-center .section-component.cert-section {
        min-height: calc(100vh - 24rem)
    }
    body.ios.nonotch .section-component.stars-type1 {
        height: calc(100vh - (5rem + 2rem))
    }
    body.ios.nonotch .section-component.mission-top {
        top: calc(5rem + 2rem)
    }
    body.ios.nonotch .section-component.mission-rolling {
        top: calc(23.8rem + 2rem)
    }
    body.ios.nonotch .page-inner-scroll.money-mission.first-lock-entry.scroll-top .section-component.mission-rolling {
        top: calc(24.3rem + 2rem)
    }
    body.ios.nonotch .container-component.container-fixed {
        padding-top: calc(5rem + 2rem)
    }
    body.ios.nonotch .page-inner-scroll.no-overscroll-y .container-component {
        padding-top: calc(5rem + 2rem)
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.mission-talisman:after {
        background-color: transparent
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.coin-full-wrap:after {
        background-color: transparent
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.transparent:after {
        background-color: transparent
    }
    body.ios.nonotch .component-invest-calendar {
        top: calc(5rem + 2rem)
    }
    body.ios.nonotch .page-inner-scroll.scrolling .component-tab.financial-scam {
        top: calc(5rem + 2rem)
    }
    body.ios.nonotch .component-tab.sticky-logotab {
        top: calc(5rem + 2rem)
    }
    body.ios.nonotch .tooltip-focus-group .tooltip-area.align-bottom.digit-signature {
        top: calc(2.2rem + 2rem)
    }
    body.ios.nonotch .weekly-invest-main-bg {
        margin-top: calc(var(--header-height) * -1 - 2rem);
        height: calc(var(--weekly-invest-height) + 2rem)
    }
    body.ios.nonotch .weekly-invest-main .extra-cash,
    body.ios.nonotch .weekly-invest-main .gauge,
    body.ios.nonotch .weekly-invest-main-inner {
        margin-top: 2rem
    }
    html.ios.statusExpension .content-savings.expired {
        height: calc(2rem + 53.9rem)
    }
    html.ios.statusExpension .content-savings.expired {
        height: calc(2rem + 53.9rem)
    }
    html.ios.statusExpension .content-savings {
        height: calc(2rem + 44.8rem)
    }
    html.ios.statusExpension .content-savings .img-area {
        top: 2rem
    }
    html.ios.statusExpension .content-savings .prodname-info {
        top: calc(2rem + 30.8rem)
    }
    html.ios.statusExpension .content-savings .kds-banner-card {
        top: calc(2rem + 42.1rem)
    }
    html.ios.statusExpension .savings-scroll .component-header::before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 2rem;
        background: var(--bg-pri-base)
    }
    html.ios.statusExpension .savings-scroll .component-fixed-bottom {
        min-height: calc(100vh - 5rem - 2rem)
    }
    html.ios.statusExpension .container-component.ai-quiz.h-center .section-component {
        height: calc(100% - (16.2rem + 2rem + 0))
    }
    html.ios.statusExpension .container-component.view-center .section-component {
        height: calc(100% - (16.2rem + 2rem + 0))
    }
    html.ios.statusExpension .section-component.alarm-nodata {
        height: calc(100vh - (5rem + 2rem + 0))
    }
    html.ios.statusExpension .container-component.today-coupon.h-center .section-component {
        height: calc(100% - (20.2rem + 2rem + 0))
    }
    html.ios.statusExpension .section-component.stars-type2 {
        padding-top: calc(4.8rem + 2rem);
        padding-bottom: calc(8rem + 0)
    }
    html.ios.statusExpension .page-inner-scroll.scrolling .component-card-sticky {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .content-savings.expired {
        height: calc(2rem + 53.9rem)
    }
    body.ios.nonotch .content-savings.expired {
        height: calc(2rem + 53.9rem)
    }
    body.ios.nonotch .content-savings {
        height: calc(2rem + 44.8rem)
    }
    body.ios.nonotch .content-savings .img-area {
        top: 2rem
    }
    body.ios.nonotch .content-savings .prodname-info {
        top: calc(2rem + 30.8rem)
    }
    body.ios.nonotch .content-savings .kds-banner-card {
        top: calc(2rem + 42.1rem)
    }
    body.ios.nonotch .savings-scroll .component-header::before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 2rem;
        background: var(--bg-pri-base)
    }
    body.ios.nonotch .savings-scroll .component-fixed-bottom {
        min-height: calc(100vh - 5rem - 2rem)
    }
    body.ios.nonotch .container-component.ai-quiz.h-center .section-component {
        height: calc(100% - (16.2rem + 2rem + 0))
    }
    body.ios.nonotch .container-component.view-center .section-component {
        height: calc(100% - (16.2rem + 2rem + 0))
    }
    body.ios.nonotch .section-component.alarm-nodata {
        height: calc(100vh - (5rem + 2rem + 0))
    }
    body.ios.nonotch .container-component.today-coupon.h-center .section-component {
        height: calc(100% - (20.2rem + 2rem + 0))
    }
    body.ios.nonotch .section-component.stars-type2 {
        padding-top: calc(4.8rem + 2rem);
        padding-bottom: calc(8rem + 0)
    }
    body.ios.nonotch .page-inner-scroll.scrolling .component-card-sticky {
        top: calc(2rem + 5rem)
    }
}

/*! 노치(X) 2G, 3G, 3GS */

@media only screen and (device-width: 320px) and (device-height: 480px) and (-webkit-device-pixel-ratio: 1) {
    /*! mixin :공통 - 헤더영역 */
    html.ios.statusExpension .component-header {
        padding-top: 2rem
    }
    html.ios.statusExpension .popup-header .component-header {
        padding-top: 0
    }
    /*! 홈 - 일반 */
    html.ios.statusExpension .home-default .main-container-component.bg-main {
        padding-top: calc(2rem + 5.6rem)
    }
    /*! 홈 - 추천 */
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"].scrolling .component-tab.sticky-tab {
        top: calc(2rem + 0.2rem)
    }
    /*! 홈 - 혜택 */
    html.ios.statusExpension .page-inner-scroll.scrolling .component-tab.sticky-tab02 .tab-round-group {
        top: calc(2rem + 5rem)
    }
    /*! 홈 - 타임라인 */
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"].scrolling .component-form-date {
        top: calc(2rem + 5rem + 0.2rem)
    }
    /*! 홈 - 순서변경 */
    html.ios.statusExpension .page-inner-scroll.scrolling .component-text-simple.fixed-top {
        top: calc(2rem + 0.9rem)
    }
    /*! 공통 - 풀팝업일때 */
    html.ios.statusExpension .popup-dialog.ui-full .popup-group,
    html.ios.statusExpension .popup-dialog.ui-full-change .popup-group,
    html.ios.statusExpension .popup-dialog.ui-full-change.plus-box-event-pop .popup-group {
        padding-top: 2rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group:after {
        content: '';
        height: 2rem;
        background-color: var(--color-w100, #fff);
        position: fixed;
        top: 0;
        left: 0;
        width: 100%
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group:after {
        display: none
    }
    html.ios.statusExpension .popup-dialog.ui-full-change.plus-box-event-pop .interest-group-top .ani-step1-1 {
        margin-top: 8.2rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.shopping:after {
        background: var(--color-in700)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.shopping.bg-white:after {
        background-color: var(--color-w100, #fff)
    }
    /*! 홈 개편 */
    html.ios.statusExpension .component-header.main {
        padding-top: calc(2rem + 0.6rem)
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh {
        padding-top: 2rem
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh.pull-home {
        padding-top: 0;
        margin-top: 2rem
    }
    html.ios.statusExpension .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: 0.6rem
    }
    html.ios.statusExpension .scrolling .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: calc(2rem + 0.6rem)
    }
    html.ios.statusExpension .component-tab.foru-tab-ver.scrollOn .tab-group.foru-type {
        top: calc(2rem)
    }
    html.ios.statusExpension .component-header.main+.component-tab.foru-tab-ver {
        top: calc(2rem + 5.6rem)
    }
    html.ios.statusExpension .component-main-bnf-tab {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .invest-home .tab-list-group.sticky-invest {
        top: calc(2rem + 5.6rem)
    }
    html.ios.statusExpension .component-ceo-calendar {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .component-ceo-my-account.type2 {
        padding-top: calc(2rem + 37rem)
    }
    html.ios.statusExpension .container-component-coach .coach-item01 {
        padding-top: 2rem
    }
    html.ios.statusExpension .component-header.search {
        padding-top: calc(2rem + 1.2rem);
        height: auto
    }
    html.ios.statusExpension .component-header.search.search-result {
        height: calc(2rem + 10.5rem)
    }
    html.ios.statusExpension .popup-inner .component-header.search.search-result {
        height: 10.5rem
    }
    html.ios.statusExpension .popup-inner .component-header.search.sticky {
        top: 2rem;
        padding-top: 1.2rem
    }
    html.ios.statusExpension .section-component.alarm .component-keyword {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .section-component.alarm .component-form-date {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .section-component.alarm.alarm-filter .component-form-date {
        top: calc(2rem + 10.6rem)
    }
    html.ios.statusExpension .main-tab-container [class^="main-tab-content0"] .component-main-refresh {
        top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: 2.2rem
    }
    html.ios.statusExpension .safe-camp-kv .safe-camp-inner {
        margin-top: 2rem
    }
    /*! mixin :공통 - 헤더영역 */
    body.ios.nonotch .component-header {
        padding-top: 2rem
    }
    body.ios.nonotch .popup-header .component-header {
        padding-top: 0
    }
    /*! 홈 - 일반 */
    body.ios.nonotch .home-default .main-container-component.bg-main {
        padding-top: calc(2rem + 5.6rem)
    }
    /*! 홈 - 추천 */
    body.ios.nonotch .main-tab-container [class^="main-tab-content0"].scrolling .component-tab.sticky-tab {
        top: calc(2rem + 0.2rem)
    }
    /*! 홈 - 혜택 */
    body.ios.nonotch .page-inner-scroll.scrolling .component-tab.sticky-tab02 .tab-round-group {
        top: calc(2rem + 5rem)
    }
    /*! 홈 - 타임라인 */
    body.ios.nonotch .main-tab-container [class^="main-tab-content0"].scrolling .component-form-date {
        top: calc(2rem + 5rem + 0.2rem)
    }
    /*! 홈 - 순서변경 */
    body.ios.nonotch .page-inner-scroll.scrolling .component-text-simple.fixed-top {
        top: calc(2rem + 0.9rem)
    }
    /*! 공통 - 풀팝업일때 */
    body.ios.nonotch .popup-dialog.ui-full .popup-group,
    body.ios.nonotch .popup-dialog.ui-full-change .popup-group,
    body.ios.nonotch .popup-dialog.ui-full-change.plus-box-event-pop .popup-group {
        padding-top: 2rem
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group:after {
        content: '';
        height: 2rem;
        background-color: var(--color-w100, #fff);
        position: fixed;
        top: 0;
        left: 0;
        width: 100%
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.popup-inandout-group:after {
        display: none
    }
    body.ios.nonotch .popup-dialog.ui-full-change.plus-box-event-pop .interest-group-top .ani-step1-1 {
        margin-top: 8.2rem
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.shopping:after {
        background: var(--color-in700)
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.shopping.bg-white:after {
        background-color: var(--color-w100, #fff)
    }
    /*! 홈 개편 */
    body.ios.nonotch .component-header.main {
        padding-top: calc(2rem + 0.6rem)
    }
    body.ios.nonotch .ptr--ptr.ptr--refresh {
        padding-top: 2rem
    }
    body.ios.nonotch .ptr--ptr.ptr--refresh.pull-home {
        padding-top: 0;
        margin-top: 2rem
    }
    body.ios.nonotch .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: 0.6rem
    }
    body.ios.nonotch .scrolling .ptr--ptr.ptr--refresh+.component-header.main {
        padding-top: calc(2rem + 0.6rem)
    }
    body.ios.nonotch .component-tab.foru-tab-ver.scrollOn .tab-group.foru-type {
        top: calc(2rem)
    }
    body.ios.nonotch .component-header.main+.component-tab.foru-tab-ver {
        top: calc(2rem + 5.6rem)
    }
    body.ios.nonotch .component-main-bnf-tab {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .invest-home .tab-list-group.sticky-invest {
        top: calc(2rem + 5.6rem)
    }
    body.ios.nonotch .component-ceo-calendar {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .component-ceo-my-account.type2 {
        padding-top: calc(2rem + 37rem)
    }
    body.ios.nonotch .container-component-coach .coach-item01 {
        padding-top: 2rem
    }
    body.ios.nonotch .component-header.search {
        padding-top: calc(2rem + 1.2rem);
        height: auto
    }
    body.ios.nonotch .component-header.search.search-result {
        height: calc(2rem + 10.5rem)
    }
    body.ios.nonotch .popup-inner .component-header.search.search-result {
        height: 10.5rem
    }
    body.ios.nonotch .popup-inner .component-header.search.sticky {
        top: 2rem;
        padding-top: 1.2rem
    }
    body.ios.nonotch .section-component.alarm .component-keyword {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .section-component.alarm .component-form-date {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .section-component.alarm.alarm-filter .component-form-date {
        top: calc(2rem + 10.6rem)
    }
    body.ios.nonotch .main-tab-container [class^="main-tab-content0"] .component-main-refresh {
        top: calc(5rem + 2rem)
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: 2.2rem
    }
    body.ios.nonotch .safe-camp-kv .safe-camp-inner {
        margin-top: 2rem
    }
    /*! mixin :공통 - 헤더영역 */
    /*! 검색 - 공통 */
    html.ios.statusExpension .component-list.fixed,
    html.ios.statusExpension .component-search[class*="fixed"] {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .component-gathering-selected.active {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .component-gathering-selected.active+.component-search {
        top: calc(2rem + 16.2rem)
    }
    /*! 모임통장 - 모임홈 */
    html.ios.statusExpension .component-meet-profile {
        margin-top: -2rem
    }
    html.ios.statusExpension .component-meethome-profile {
        margin-top: calc(-5rem - 2rem)
    }
    /*! 상단 tab 고정 */
    html.ios.statusExpension .component-tab.food-cate-sticky,
    html.ios.statusExpension .component-text-simple+.component-tab.sticky,
    html.ios.statusExpension .section-component .component-tab.sticky,
    html.ios.statusExpension .section-component.living-price-tab .component-tab.sticky {
        top: calc(2rem + 5rem)
    }
    /*! 이체 */
    html.ios.statusExpension .component-header+.component-keypad {
        padding-top: 2rem
    }
    html.ios.statusExpension .section-component-sticky {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .fixed-msg-card,
    html.ios.statusExpension .section-flex-colume {
        height: calc(100vh - calc(2rem + 5rem))
    }
    html.ios.statusExpension .section-flex-colume.type3 {
        height: calc(100vh - calc(2rem + 11rem))
    }
    html.ios.statusExpension .section-flex-colume.type4 {
        height: calc(100vh - calc(2rem + 19.4rem))
    }
    html.ios.statusExpension .component-card-sum-top.type2[class*="fixed"] {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .dim-moneytree-wrap {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .toast-wrap.ceo-type {
        bottom: auto;
        top: calc(2rem + 9.4rem)
    }
    html.ios.statusExpension .component-tab.sticky+.article-component .component-search[class*="fixed"] {
        top: calc(2rem + 11rem)
    }
    html.ios.statusExpension .container-component.shopping .component-text.sticky {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .container-component.shopping .component-text.sticky+.component-tab .tab-list-group.sticky {
        top: calc(2rem + 9rem)
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach {
        padding-top: 2rem
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach.active {
        padding-top: 2rem
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: calc(2rem + 8.6rem)
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .container-component-coach .coach-close {
        padding-top: 0
    }
    html.ios.statusExpension .page-inner-scroll.inandout-scroll .inandout-calendar-inner {
        top: 2rem
    }
    html.ios.statusExpension .inandout-tab-wrap {
        top: calc(5.5rem + 2rem)
    }
    html.ios.statusExpension .section-component.custom-policy .component-tab.sticky-chip {
        top: calc(2rem + 11rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.popup-inandout-group.popup-inandout-pre-group {
        padding-top: 2rem
    }
    html.ios.statusExpension .popup-inandout-group.pre-event .container-component-coach {
        top: 2rem
    }
    html.ios.statusExpension .ailive-today-quiz {
        padding-top: 2rem
    }
    html.ios.statusExpension .tab-list-group[data-sticky-item] {
        top: calc(2rem + 5rem)
    }
    html.ios.statusExpension .container-component.ai-quiz .section-component.type2 {
        margin-top: calc(-5rem - 2rem);
        padding-top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .container-component.ai-quiz .section-component.type4 {
        margin-top: calc(-5rem - 2rem);
        padding-top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .fortune2025 .component-iframe {
        height: calc(100vh - (14.4rem + 2rem))
    }
    html.ios.statusExpension .container-component.common-cert.h-center .section-component.cert-section {
        min-height: calc(100vh - 24rem)
    }
    html.ios.statusExpension .section-component.stars-type1 {
        height: calc(100vh - (5rem + 2rem))
    }
    html.ios.statusExpension .section-component.mission-top {
        top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .section-component.mission-rolling {
        top: calc(23.8rem + 2rem)
    }
    html.ios.statusExpension .page-inner-scroll.money-mission.first-lock-entry.scroll-top .section-component.mission-rolling {
        top: calc(24.3rem + 2rem)
    }
    html.ios.statusExpension .container-component.container-fixed {
        padding-top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .page-inner-scroll.no-overscroll-y .container-component {
        padding-top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.mission-talisman:after {
        background-color: transparent
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.coin-full-wrap:after {
        background-color: transparent
    }
    html.ios.statusExpension .popup-dialog.ui-full .popup-group.transparent:after {
        background-color: transparent
    }
    html.ios.statusExpension .component-invest-calendar {
        top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .page-inner-scroll.scrolling .component-tab.financial-scam {
        top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .component-tab.sticky-logotab {
        top: calc(5rem + 2rem)
    }
    html.ios.statusExpension .tooltip-focus-group .tooltip-area.align-bottom.digit-signature {
        top: calc(2.2rem + 2rem)
    }
    html.ios.statusExpension .weekly-invest-main-bg {
        margin-top: calc(var(--header-height) * -1 - 2rem);
        height: calc(var(--weekly-invest-height) + 2rem)
    }
    html.ios.statusExpension .weekly-invest-main .extra-cash,
    html.ios.statusExpension .weekly-invest-main .gauge,
    html.ios.statusExpension .weekly-invest-main-inner {
        margin-top: 2rem
    }
    /*! mixin :공통 - 헤더영역 */
    /*! 검색 - 공통 */
    body.ios.nonotch .component-list.fixed,
    body.ios.nonotch .component-search[class*="fixed"] {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .component-gathering-selected.active {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .component-gathering-selected.active+.component-search {
        top: calc(2rem + 16.2rem)
    }
    /*! 모임통장 - 모임홈 */
    body.ios.nonotch .component-meet-profile {
        margin-top: -2rem
    }
    body.ios.nonotch .component-meethome-profile {
        margin-top: calc(-5rem - 2rem)
    }
    /*! 상단 tab 고정 */
    body.ios.nonotch .component-tab.food-cate-sticky,
    body.ios.nonotch .component-text-simple+.component-tab.sticky,
    body.ios.nonotch .section-component .component-tab.sticky,
    body.ios.nonotch .section-component.living-price-tab .component-tab.sticky {
        top: calc(2rem + 5rem)
    }
    /*! 이체 */
    body.ios.nonotch .component-header+.component-keypad {
        padding-top: 2rem
    }
    body.ios.nonotch .section-component-sticky {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .fixed-msg-card,
    body.ios.nonotch .section-flex-colume {
        height: calc(100vh - calc(2rem + 5rem))
    }
    body.ios.nonotch .section-flex-colume.type3 {
        height: calc(100vh - calc(2rem + 11rem))
    }
    body.ios.nonotch .section-flex-colume.type4 {
        height: calc(100vh - calc(2rem + 19.4rem))
    }
    body.ios.nonotch .component-card-sum-top.type2[class*="fixed"] {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .dim-moneytree-wrap {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .toast-wrap.ceo-type {
        bottom: auto;
        top: calc(2rem + 9.4rem)
    }
    body.ios.nonotch .component-tab.sticky+.article-component .component-search[class*="fixed"] {
        top: calc(2rem + 11rem)
    }
    body.ios.nonotch .container-component.shopping .component-text.sticky {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .container-component.shopping .component-text.sticky+.component-tab .tab-list-group.sticky {
        top: calc(2rem + 9rem)
    }
    body.ios.nonotch .page-inner-scroll.inandout-scroll .container-component-coach {
        padding-top: 2rem
    }
    body.ios.nonotch .page-inner-scroll.inandout-scroll .container-component-coach.active {
        padding-top: 2rem
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.popup-inandout-group {
        padding-top: calc(2rem + 8.6rem)
    }
    body.ios.nonotch .page-inner-scroll.inandout-scroll .container-component-coach .coach-close {
        padding-top: 0
    }
    body.ios.nonotch .page-inner-scroll.inandout-scroll .inandout-calendar-inner {
        top: 2rem
    }
    body.ios.nonotch .inandout-tab-wrap {
        top: calc(5.5rem + 2rem)
    }
    body.ios.nonotch .section-component.custom-policy .component-tab.sticky-chip {
        top: calc(2rem + 11rem)
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.popup-inandout-group.popup-inandout-pre-group {
        padding-top: 2rem
    }
    body.ios.nonotch .popup-inandout-group.pre-event .container-component-coach {
        top: 2rem
    }
    body.ios.nonotch .ailive-today-quiz {
        padding-top: 2rem
    }
    body.ios.nonotch .tab-list-group[data-sticky-item] {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .container-component.ai-quiz .section-component.type2 {
        margin-top: calc(-5rem - 2rem);
        padding-top: calc(5rem + 2rem)
    }
    body.ios.nonotch .container-component.ai-quiz .section-component.type4 {
        margin-top: calc(-5rem - 2rem);
        padding-top: calc(5rem + 2rem)
    }
    body.ios.nonotch .fortune2025 .component-iframe {
        height: calc(100vh - (14.4rem + 2rem))
    }
    body.ios.nonotch .container-component.common-cert.h-center .section-component.cert-section {
        min-height: calc(100vh - 24rem)
    }
    body.ios.nonotch .section-component.stars-type1 {
        height: calc(100vh - (5rem + 2rem))
    }
    body.ios.nonotch .section-component.mission-top {
        top: calc(5rem + 2rem)
    }
    body.ios.nonotch .section-component.mission-rolling {
        top: calc(23.8rem + 2rem)
    }
    body.ios.nonotch .page-inner-scroll.money-mission.first-lock-entry.scroll-top .section-component.mission-rolling {
        top: calc(24.3rem + 2rem)
    }
    body.ios.nonotch .container-component.container-fixed {
        padding-top: calc(5rem + 2rem)
    }
    body.ios.nonotch .page-inner-scroll.no-overscroll-y .container-component {
        padding-top: calc(5rem + 2rem)
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.mission-talisman:after {
        background-color: transparent
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.coin-full-wrap:after {
        background-color: transparent
    }
    body.ios.nonotch .popup-dialog.ui-full .popup-group.transparent:after {
        background-color: transparent
    }
    body.ios.nonotch .component-invest-calendar {
        top: calc(5rem + 2rem)
    }
    body.ios.nonotch .page-inner-scroll.scrolling .component-tab.financial-scam {
        top: calc(5rem + 2rem)
    }
    body.ios.nonotch .component-tab.sticky-logotab {
        top: calc(5rem + 2rem)
    }
    body.ios.nonotch .tooltip-focus-group .tooltip-area.align-bottom.digit-signature {
        top: calc(2.2rem + 2rem)
    }
    body.ios.nonotch .weekly-invest-main-bg {
        margin-top: calc(var(--header-height) * -1 - 2rem);
        height: calc(var(--weekly-invest-height) + 2rem)
    }
    body.ios.nonotch .weekly-invest-main .extra-cash,
    body.ios.nonotch .weekly-invest-main .gauge,
    body.ios.nonotch .weekly-invest-main-inner {
        margin-top: 2rem
    }
    html.ios.statusExpension .content-savings.expired {
        height: calc(2rem + 53.9rem)
    }
    html.ios.statusExpension .content-savings.expired {
        height: calc(2rem + 53.9rem)
    }
    html.ios.statusExpension .content-savings {
        height: calc(2rem + 44.8rem)
    }
    html.ios.statusExpension .content-savings .img-area {
        top: 2rem
    }
    html.ios.statusExpension .content-savings .prodname-info {
        top: calc(2rem + 30.8rem)
    }
    html.ios.statusExpension .content-savings .kds-banner-card {
        top: calc(2rem + 42.1rem)
    }
    html.ios.statusExpension .savings-scroll .component-header::before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 2rem;
        background: var(--bg-pri-base)
    }
    html.ios.statusExpension .savings-scroll .component-fixed-bottom {
        min-height: calc(100vh - 5rem - 2rem)
    }
    html.ios.statusExpension .container-component.ai-quiz.h-center .section-component {
        height: calc(100% - (16.2rem + 2rem + 0))
    }
    html.ios.statusExpension .container-component.view-center .section-component {
        height: calc(100% - (16.2rem + 2rem + 0))
    }
    html.ios.statusExpension .section-component.alarm-nodata {
        height: calc(100vh - (5rem + 2rem + 0))
    }
    html.ios.statusExpension .container-component.today-coupon.h-center .section-component {
        height: calc(100% - (20.2rem + 2rem + 0))
    }
    html.ios.statusExpension .section-component.stars-type2 {
        padding-top: calc(4.8rem + 2rem);
        padding-bottom: calc(8rem + 0)
    }
    html.ios.statusExpension .page-inner-scroll.scrolling .component-card-sticky {
        top: calc(2rem + 5rem)
    }
    body.ios.nonotch .content-savings.expired {
        height: calc(2rem + 53.9rem)
    }
    body.ios.nonotch .content-savings.expired {
        height: calc(2rem + 53.9rem)
    }
    body.ios.nonotch .content-savings {
        height: calc(2rem + 44.8rem)
    }
    body.ios.nonotch .content-savings .img-area {
        top: 2rem
    }
    body.ios.nonotch .content-savings .prodname-info {
        top: calc(2rem + 30.8rem)
    }
    body.ios.nonotch .content-savings .kds-banner-card {
        top: calc(2rem + 42.1rem)
    }
    body.ios.nonotch .savings-scroll .component-header::before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 2rem;
        background: var(--bg-pri-base)
    }
    body.ios.nonotch .savings-scroll .component-fixed-bottom {
        min-height: calc(100vh - 5rem - 2rem)
    }
    body.ios.nonotch .container-component.ai-quiz.h-center .section-component {
        height: calc(100% - (16.2rem + 2rem + 0))
    }
    body.ios.nonotch .container-component.view-center .section-component {
        height: calc(100% - (16.2rem + 2rem + 0))
    }
    body.ios.nonotch .section-component.alarm-nodata {
        height: calc(100vh - (5rem + 2rem + 0))
    }
    body.ios.nonotch .container-component.today-coupon.h-center .section-component {
        height: calc(100% - (20.2rem + 2rem + 0))
    }
    body.ios.nonotch .section-component.stars-type2 {
        padding-top: calc(4.8rem + 2rem);
        padding-bottom: calc(8rem + 0)
    }
    body.ios.nonotch .page-inner-scroll.scrolling .component-card-sticky {
        top: calc(2rem + 5rem)
    }
}

/*!
* Status Bar bottom area iphoneX (하단바 영역과 컨텐츠 간격 컨트롤)
* Status Bar 영역 확장 확장버전에는 body 에 statusExpension 클래스 추가되어 컨트롤함 (ios.statusExpension클래스와 iphoneX클래스 둘 다 붙기 때문에 하나로 통일해도 무방)
* 아이폰 노치 디자인 디바이스(인디케이터) : 하단 고정버튼 여백 40px;
*/

/*! iPhone 11 Pro(확대), X(확대), Xs(확대), 12(확대), 12 Pro(확대), 12 Mini(확대) */

@media only screen and (device-width: 320px) and (device-height: 693px) and (-webkit-device-pixel-ratio: 3) {
    /*! mixin :홈 - 하단 안전영역 대응 */
    /*! Status Bar bottom area iphoneX (하단바 영역과 컨텐츠 간격 컨트롤) Status Bar 영역 확장 확장버전에는 body 에 statusExpension 클래스 추가되어 컨트롤함 아이폰 노치 디자인 디바이스(인디케이터) : 하단 고정버튼 여백 40px; */
    /*! 공통 - 컴포넌트 컨테이너 하단 여백 */
    /*! 공통 - 하단 고정버튼 여백 */
    .iphoneX .component-btn.fixed-bottom.home-tab-menu {
        height: calc(4rem + 5.6rem)
    }
    .iphoneX .container-component:last-child {
        padding-bottom: calc(4rem + 15.4rem)
    }
    .iphoneX .container-component.type2:last-child {
        padding-bottom: calc(4rem + 20rem)
    }
    .iphoneX .container-component.type3:last-child {
        padding-bottom: calc(4rem + 8rem)
    }
    .iphoneX .container-component.type4:last-child {
        padding-bottom: calc(4rem + 2rem)
    }
    .iphoneX .container-component.type5:last-child {
        padding-bottom: calc(4rem + 7.2rem)
    }
    .iphoneX .container-component.type8:last-child {
        padding-bottom: calc(4rem + 8rem)
    }
    .iphoneX .container-component.type9:last-child {
        padding-bottom: calc(4rem + 6.4rem)
    }
    .iphoneX .container-component.type10:last-child {
        padding-bottom: calc(4rem + 10rem)
    }
    .iphoneX .container-component.coupon:last-child {
        padding-bottom: 0
    }
    .iphoneX .component-btn.fixed-bottom,
    .iphoneX .component-card-bottom,
    .iphoneX .keypad-group .keypad-row-btn,
    .iphoneX .popup-dialog.ui-bottom .popup-group,
    .iphoneX .popup-dialog.ui-bottom[data-type="calendar"] .popup-group,
    .iphoneX .popup-dialog.ui-full-change .popup-group {
        padding-bottom: 4rem
    }
    .iphoneX .pop-bot-shadow.popup-dialog.ui-bottom .popup-header+.popup-content:last-child:before,
    .iphoneX .pop-bot-shadow.popup-dialog.ui-bottom[data-type="select-bank"] .popup-header+.popup-content:last-child:before {
        bottom: 4rem
    }
    .iphoneX .btn-scroll-top {
        bottom: -4rem
    }
    .iphoneX .btn-scroll-top.active {
        bottom: calc(4rem + 2.4rem)
    }
    /*! s: 돈나무 키우기 */
    .iphoneX .toast-wrap.moneytree-toast {
        bottom: calc(4rem + 18rem)
    }
    .iphoneX .dim-moneytree-wrap {
        bottom: 8.4rem
    }
    /*! e: 돈나무 키우기 */
    .iphoneX .toast-wrap.withdraw-type {
        bottom: calc(4rem + 7.2rem)
    }
    .iphoneX [page-calendar-btn] {
        bottom: 4rem
    }
    .iphoneX .container-component-coach .coach-item06 {
        bottom: 4rem
    }
    .iphoneX .main-container-component {
        padding-bottom: calc(4rem + 15.4rem)
    }
    .iphoneX .main-container-component.bg-main {
        padding-bottom: calc(4rem + 20.2rem)
    }
    .iphoneX .main-container-component.bg-main.wide {
        padding-bottom: calc(4rem + 21rem)
    }
    .iphoneX .chatbot-wrap {
        bottom: calc(4rem + 7.6rem)
    }
    .iphoneX .chatbot-wrap.up {
        bottom: calc(4rem + 15.5rem)
    }
    .iphoneX .chatbot-wrap.up2 {
        bottom: calc(4rem + 14rem)
    }
    .iphoneX .container-component.no-space {
        padding-bottom: 4rem
    }
    .iphoneX .container-component.no-space-notch {
        padding-bottom: 4rem
    }
    .iphoneX .container-component.intro-login-shield {
        padding-bottom: 0
    }
    .iphoneX .activeSlide .quiz-entry-wrap.no-animation {
        bottom: calc(4rem + 7.2rem)
    }
    .iphoneX .activeSlide .quiz-entry-wrap {
        -webkit-animation: quiz-up-notch ease-out 0.15s 1s forwards;
        animation: quiz-up-notch ease-out 0.15s 1s forwards
    }
    @-webkit-keyframes quiz-up-notch {
        0% {
            opacity: 0;
            bottom: calc(-7.4rem - 4rem)
        }
        100% {
            opacity: 100%;
            bottom: calc(4rem + 7.2rem)
        }
    }
    @keyframes quiz-up-notch {
        0% {
            opacity: 0;
            bottom: calc(-7.4rem - 4rem)
        }
        100% {
            opacity: 100%;
            bottom: calc(4rem + 7.2rem)
        }
    }
    .iphoneX .aiquiz-today-wrap {
        bottom: calc(4rem + 17.2rem)
    }
    .iphoneX .insurance-landing-footer-wrap:last-child {
        padding-bottom: calc(4rem + 15.4rem)
    }
    .iphoneX .container-component.view-center.type1 {
        padding-bottom: calc(4rem)
    }
    .iphoneX .container-component.view-center.type1 .component-img {
        padding-bottom: calc(4rem + 11.2rem)
    }
    .iphoneX .page-inner-scroll.add-banner .container-component.moneytree {
        padding-bottom: calc(4rem + 26rem)
    }
    .iphoneX .page-inner-scroll.add-banner .container-component.moneytree-intro {
        padding-bottom: calc(4rem + 26rem)
    }
    .iphoneX .page-inner-scroll.add-banner .dim-moneytree-wrap {
        bottom: calc(4rem + 7.2rem)
    }
    .iphoneX .page-inner-scroll.add-banner .component-card-bottom {
        bottom: calc(4rem + 7.2rem)
    }
    .iphoneX .page-inner-scroll.add-banner .component-moneytree-banner {
        bottom: calc(4rem + 1rem)
    }
}

/*! iPhone XR(확대), 11(확대) */

@media only screen and (device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 2) {
    /*! mixin :홈 - 하단 안전영역 대응 */
    /*! Status Bar bottom area iphoneX (하단바 영역과 컨텐츠 간격 컨트롤) Status Bar 영역 확장 확장버전에는 body 에 statusExpension 클래스 추가되어 컨트롤함 아이폰 노치 디자인 디바이스(인디케이터) : 하단 고정버튼 여백 40px; */
    /*! 공통 - 컴포넌트 컨테이너 하단 여백 */
    /*! 공통 - 하단 고정버튼 여백 */
    .iphoneX .component-btn.fixed-bottom.home-tab-menu {
        height: calc(4rem + 5.6rem)
    }
    .iphoneX .container-component:last-child {
        padding-bottom: calc(4rem + 15.4rem)
    }
    .iphoneX .container-component.type2:last-child {
        padding-bottom: calc(4rem + 20rem)
    }
    .iphoneX .container-component.type3:last-child {
        padding-bottom: calc(4rem + 8rem)
    }
    .iphoneX .container-component.type4:last-child {
        padding-bottom: calc(4rem + 2rem)
    }
    .iphoneX .container-component.type5:last-child {
        padding-bottom: calc(4rem + 7.2rem)
    }
    .iphoneX .container-component.type8:last-child {
        padding-bottom: calc(4rem + 8rem)
    }
    .iphoneX .container-component.type9:last-child {
        padding-bottom: calc(4rem + 6.4rem)
    }
    .iphoneX .container-component.type10:last-child {
        padding-bottom: calc(4rem + 10rem)
    }
    .iphoneX .container-component.coupon:last-child {
        padding-bottom: 0
    }
    .iphoneX .component-btn.fixed-bottom,
    .iphoneX .component-card-bottom,
    .iphoneX .keypad-group .keypad-row-btn,
    .iphoneX .popup-dialog.ui-bottom .popup-group,
    .iphoneX .popup-dialog.ui-bottom[data-type="calendar"] .popup-group,
    .iphoneX .popup-dialog.ui-full-change .popup-group {
        padding-bottom: 4rem
    }
    .iphoneX .pop-bot-shadow.popup-dialog.ui-bottom .popup-header+.popup-content:last-child:before,
    .iphoneX .pop-bot-shadow.popup-dialog.ui-bottom[data-type="select-bank"] .popup-header+.popup-content:last-child:before {
        bottom: 4rem
    }
    .iphoneX .btn-scroll-top {
        bottom: -4rem
    }
    .iphoneX .btn-scroll-top.active {
        bottom: calc(4rem + 2.4rem)
    }
    /*! s: 돈나무 키우기 */
    .iphoneX .toast-wrap.moneytree-toast {
        bottom: calc(4rem + 18rem)
    }
    .iphoneX .dim-moneytree-wrap {
        bottom: 8.4rem
    }
    /*! e: 돈나무 키우기 */
    .iphoneX .toast-wrap.withdraw-type {
        bottom: calc(4rem + 7.2rem)
    }
    .iphoneX [page-calendar-btn] {
        bottom: 4rem
    }
    .iphoneX .container-component-coach .coach-item06 {
        bottom: 4rem
    }
    .iphoneX .main-container-component {
        padding-bottom: calc(4rem + 15.4rem)
    }
    .iphoneX .main-container-component.bg-main {
        padding-bottom: calc(4rem + 20.2rem)
    }
    .iphoneX .main-container-component.bg-main.wide {
        padding-bottom: calc(4rem + 21rem)
    }
    .iphoneX .chatbot-wrap {
        bottom: calc(4rem + 7.6rem)
    }
    .iphoneX .chatbot-wrap.up {
        bottom: calc(4rem + 15.5rem)
    }
    .iphoneX .chatbot-wrap.up2 {
        bottom: calc(4rem + 14rem)
    }
    .iphoneX .container-component.no-space {
        padding-bottom: 4rem
    }
    .iphoneX .container-component.no-space-notch {
        padding-bottom: 4rem
    }
    .iphoneX .container-component.intro-login-shield {
        padding-bottom: 0
    }
    .iphoneX .activeSlide .quiz-entry-wrap.no-animation {
        bottom: calc(4rem + 7.2rem)
    }
    .iphoneX .activeSlide .quiz-entry-wrap {
        -webkit-animation: quiz-up-notch ease-out 0.15s 1s forwards;
        animation: quiz-up-notch ease-out 0.15s 1s forwards
    }
    @-webkit-keyframes quiz-up-notch {
        0% {
            opacity: 0;
            bottom: calc(-7.4rem - 4rem)
        }
        100% {
            opacity: 100%;
            bottom: calc(4rem + 7.2rem)
        }
    }
    @keyframes quiz-up-notch {
        0% {
            opacity: 0;
            bottom: calc(-7.4rem - 4rem)
        }
        100% {
            opacity: 100%;
            bottom: calc(4rem + 7.2rem)
        }
    }
    .iphoneX .aiquiz-today-wrap {
        bottom: calc(4rem + 17.2rem)
    }
    .iphoneX .insurance-landing-footer-wrap:last-child {
        padding-bottom: calc(4rem + 15.4rem)
    }
    .iphoneX .container-component.view-center.type1 {
        padding-bottom: calc(4rem)
    }
    .iphoneX .container-component.view-center.type1 .component-img {
        padding-bottom: calc(4rem + 11.2rem)
    }
    .iphoneX .page-inner-scroll.add-banner .container-component.moneytree {
        padding-bottom: calc(4rem + 26rem)
    }
    .iphoneX .page-inner-scroll.add-banner .container-component.moneytree-intro {
        padding-bottom: calc(4rem + 26rem)
    }
    .iphoneX .page-inner-scroll.add-banner .dim-moneytree-wrap {
        bottom: calc(4rem + 7.2rem)
    }
    .iphoneX .page-inner-scroll.add-banner .component-card-bottom {
        bottom: calc(4rem + 7.2rem)
    }
    .iphoneX .page-inner-scroll.add-banner .component-moneytree-banner {
        bottom: calc(4rem + 1rem)
    }
}

/*! iPhone 11 Pro, X, Xs, 12 Mini(기본), 11 Pro Max(확대), Xs Max(확대), 12 pro max(확대) */

@media only screen and (device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 3) {
    /*! mixin :홈 - 하단 안전영역 대응 */
    /*! Status Bar bottom area iphoneX (하단바 영역과 컨텐츠 간격 컨트롤) Status Bar 영역 확장 확장버전에는 body 에 statusExpension 클래스 추가되어 컨트롤함 아이폰 노치 디자인 디바이스(인디케이터) : 하단 고정버튼 여백 40px; */
    /*! 공통 - 컴포넌트 컨테이너 하단 여백 */
    /*! 공통 - 하단 고정버튼 여백 */
    .iphoneX .component-btn.fixed-bottom.home-tab-menu {
        height: calc(4rem + 5.6rem)
    }
    .iphoneX .container-component:last-child {
        padding-bottom: calc(4rem + 15.4rem)
    }
    .iphoneX .container-component.type2:last-child {
        padding-bottom: calc(4rem + 20rem)
    }
    .iphoneX .container-component.type3:last-child {
        padding-bottom: calc(4rem + 8rem)
    }
    .iphoneX .container-component.type4:last-child {
        padding-bottom: calc(4rem + 2rem)
    }
    .iphoneX .container-component.type5:last-child {
        padding-bottom: calc(4rem + 7.2rem)
    }
    .iphoneX .container-component.type8:last-child {
        padding-bottom: calc(4rem + 8rem)
    }
    .iphoneX .container-component.type9:last-child {
        padding-bottom: calc(4rem + 6.4rem)
    }
    .iphoneX .container-component.type10:last-child {
        padding-bottom: calc(4rem + 10rem)
    }
    .iphoneX .container-component.coupon:last-child {
        padding-bottom: 0
    }
    .iphoneX .component-btn.fixed-bottom,
    .iphoneX .component-card-bottom,
    .iphoneX .keypad-group .keypad-row-btn,
    .iphoneX .popup-dialog.ui-bottom .popup-group,
    .iphoneX .popup-dialog.ui-bottom[data-type="calendar"] .popup-group,
    .iphoneX .popup-dialog.ui-full-change .popup-group {
        padding-bottom: 4rem
    }
    .iphoneX .pop-bot-shadow.popup-dialog.ui-bottom .popup-header+.popup-content:last-child:before,
    .iphoneX .pop-bot-shadow.popup-dialog.ui-bottom[data-type="select-bank"] .popup-header+.popup-content:last-child:before {
        bottom: 4rem
    }
    .iphoneX .btn-scroll-top {
        bottom: -4rem
    }
    .iphoneX .btn-scroll-top.active {
        bottom: calc(4rem + 2.4rem)
    }
    /*! s: 돈나무 키우기 */
    .iphoneX .toast-wrap.moneytree-toast {
        bottom: calc(4rem + 18rem)
    }
    .iphoneX .dim-moneytree-wrap {
        bottom: 8.4rem
    }
    /*! e: 돈나무 키우기 */
    .iphoneX .toast-wrap.withdraw-type {
        bottom: calc(4rem + 7.2rem)
    }
    .iphoneX [page-calendar-btn] {
        bottom: 4rem
    }
    .iphoneX .container-component-coach .coach-item06 {
        bottom: 4rem
    }
    .iphoneX .main-container-component {
        padding-bottom: calc(4rem + 15.4rem)
    }
    .iphoneX .main-container-component.bg-main {
        padding-bottom: calc(4rem + 20.2rem)
    }
    .iphoneX .main-container-component.bg-main.wide {
        padding-bottom: calc(4rem + 21rem)
    }
    .iphoneX .chatbot-wrap {
        bottom: calc(4rem + 7.6rem)
    }
    .iphoneX .chatbot-wrap.up {
        bottom: calc(4rem + 15.5rem)
    }
    .iphoneX .chatbot-wrap.up2 {
        bottom: calc(4rem + 14rem)
    }
    .iphoneX .container-component.no-space {
        padding-bottom: 4rem
    }
    .iphoneX .container-component.no-space-notch {
        padding-bottom: 4rem
    }
    .iphoneX .container-component.intro-login-shield {
        padding-bottom: 0
    }
    .iphoneX .activeSlide .quiz-entry-wrap.no-animation {
        bottom: calc(4rem + 7.2rem)
    }
    .iphoneX .activeSlide .quiz-entry-wrap {
        -webkit-animation: quiz-up-notch ease-out 0.15s 1s forwards;
        animation: quiz-up-notch ease-out 0.15s 1s forwards
    }
    @-webkit-keyframes quiz-up-notch {
        0% {
            opacity: 0;
            bottom: calc(-7.4rem - 4rem)
        }
        100% {
            opacity: 100%;
            bottom: calc(4rem + 7.2rem)
        }
    }
    @keyframes quiz-up-notch {
        0% {
            opacity: 0;
            bottom: calc(-7.4rem - 4rem)
        }
        100% {
            opacity: 100%;
            bottom: calc(4rem + 7.2rem)
        }
    }
    .iphoneX .aiquiz-today-wrap {
        bottom: calc(4rem + 17.2rem)
    }
    .iphoneX .insurance-landing-footer-wrap:last-child {
        padding-bottom: calc(4rem + 15.4rem)
    }
    .iphoneX .container-component.view-center.type1 {
        padding-bottom: calc(4rem)
    }
    .iphoneX .container-component.view-center.type1 .component-img {
        padding-bottom: calc(4rem + 11.2rem)
    }
    .iphoneX .page-inner-scroll.add-banner .container-component.moneytree {
        padding-bottom: calc(4rem + 26rem)
    }
    .iphoneX .page-inner-scroll.add-banner .container-component.moneytree-intro {
        padding-bottom: calc(4rem + 26rem)
    }
    .iphoneX .page-inner-scroll.add-banner .dim-moneytree-wrap {
        bottom: calc(4rem + 7.2rem)
    }
    .iphoneX .page-inner-scroll.add-banner .component-card-bottom {
        bottom: calc(4rem + 7.2rem)
    }
    .iphoneX .page-inner-scroll.add-banner .component-moneytree-banner {
        bottom: calc(4rem + 1rem)
    }
}

/*! iPhone 12, 12 Pro, 14 */

@media only screen and (device-width: 390px) and (device-height: 844px) and (-webkit-device-pixel-ratio: 3) {
    /*! mixin :홈 - 하단 안전영역 대응 */
    /*! Status Bar bottom area iphoneX (하단바 영역과 컨텐츠 간격 컨트롤) Status Bar 영역 확장 확장버전에는 body 에 statusExpension 클래스 추가되어 컨트롤함 아이폰 노치 디자인 디바이스(인디케이터) : 하단 고정버튼 여백 40px; */
    /*! 공통 - 컴포넌트 컨테이너 하단 여백 */
    /*! 공통 - 하단 고정버튼 여백 */
    .iphoneX .component-btn.fixed-bottom.home-tab-menu {
        height: calc(4rem + 5.6rem)
    }
    .iphoneX .container-component:last-child {
        padding-bottom: calc(4rem + 15.4rem)
    }
    .iphoneX .container-component.type2:last-child {
        padding-bottom: calc(4rem + 20rem)
    }
    .iphoneX .container-component.type3:last-child {
        padding-bottom: calc(4rem + 8rem)
    }
    .iphoneX .container-component.type4:last-child {
        padding-bottom: calc(4rem + 2rem)
    }
    .iphoneX .container-component.type5:last-child {
        padding-bottom: calc(4rem + 7.2rem)
    }
    .iphoneX .container-component.type8:last-child {
        padding-bottom: calc(4rem + 8rem)
    }
    .iphoneX .container-component.type9:last-child {
        padding-bottom: calc(4rem + 6.4rem)
    }
    .iphoneX .container-component.type10:last-child {
        padding-bottom: calc(4rem + 10rem)
    }
    .iphoneX .container-component.coupon:last-child {
        padding-bottom: 0
    }
    .iphoneX .component-btn.fixed-bottom,
    .iphoneX .component-card-bottom,
    .iphoneX .keypad-group .keypad-row-btn,
    .iphoneX .popup-dialog.ui-bottom .popup-group,
    .iphoneX .popup-dialog.ui-bottom[data-type="calendar"] .popup-group,
    .iphoneX .popup-dialog.ui-full-change .popup-group {
        padding-bottom: 4rem
    }
    .iphoneX .pop-bot-shadow.popup-dialog.ui-bottom .popup-header+.popup-content:last-child:before,
    .iphoneX .pop-bot-shadow.popup-dialog.ui-bottom[data-type="select-bank"] .popup-header+.popup-content:last-child:before {
        bottom: 4rem
    }
    .iphoneX .btn-scroll-top {
        bottom: -4rem
    }
    .iphoneX .btn-scroll-top.active {
        bottom: calc(4rem + 2.4rem)
    }
    /*! s: 돈나무 키우기 */
    .iphoneX .toast-wrap.moneytree-toast {
        bottom: calc(4rem + 18rem)
    }
    .iphoneX .dim-moneytree-wrap {
        bottom: 8.4rem
    }
    /*! e: 돈나무 키우기 */
    .iphoneX .toast-wrap.withdraw-type {
        bottom: calc(4rem + 7.2rem)
    }
    .iphoneX [page-calendar-btn] {
        bottom: 4rem
    }
    .iphoneX .container-component-coach .coach-item06 {
        bottom: 4rem
    }
    .iphoneX .main-container-component {
        padding-bottom: calc(4rem + 15.4rem)
    }
    .iphoneX .main-container-component.bg-main {
        padding-bottom: calc(4rem + 20.2rem)
    }
    .iphoneX .main-container-component.bg-main.wide {
        padding-bottom: calc(4rem + 21rem)
    }
    .iphoneX .chatbot-wrap {
        bottom: calc(4rem + 7.6rem)
    }
    .iphoneX .chatbot-wrap.up {
        bottom: calc(4rem + 15.5rem)
    }
    .iphoneX .chatbot-wrap.up2 {
        bottom: calc(4rem + 14rem)
    }
    .iphoneX .container-component.no-space {
        padding-bottom: 4rem
    }
    .iphoneX .container-component.no-space-notch {
        padding-bottom: 4rem
    }
    .iphoneX .container-component.intro-login-shield {
        padding-bottom: 0
    }
    .iphoneX .activeSlide .quiz-entry-wrap.no-animation {
        bottom: calc(4rem + 7.2rem)
    }
    .iphoneX .activeSlide .quiz-entry-wrap {
        -webkit-animation: quiz-up-notch ease-out 0.15s 1s forwards;
        animation: quiz-up-notch ease-out 0.15s 1s forwards
    }
    @-webkit-keyframes quiz-up-notch {
        0% {
            opacity: 0;
            bottom: calc(-7.4rem - 4rem)
        }
        100% {
            opacity: 100%;
            bottom: calc(4rem + 7.2rem)
        }
    }
    @keyframes quiz-up-notch {
        0% {
            opacity: 0;
            bottom: calc(-7.4rem - 4rem)
        }
        100% {
            opacity: 100%;
            bottom: calc(4rem + 7.2rem)
        }
    }
    .iphoneX .aiquiz-today-wrap {
        bottom: calc(4rem + 17.2rem)
    }
    .iphoneX .insurance-landing-footer-wrap:last-child {
        padding-bottom: calc(4rem + 15.4rem)
    }
    .iphoneX .container-component.view-center.type1 {
        padding-bottom: calc(4rem)
    }
    .iphoneX .container-component.view-center.type1 .component-img {
        padding-bottom: calc(4rem + 11.2rem)
    }
    .iphoneX .page-inner-scroll.add-banner .container-component.moneytree {
        padding-bottom: calc(4rem + 26rem)
    }
    .iphoneX .page-inner-scroll.add-banner .container-component.moneytree-intro {
        padding-bottom: calc(4rem + 26rem)
    }
    .iphoneX .page-inner-scroll.add-banner .dim-moneytree-wrap {
        bottom: calc(4rem + 7.2rem)
    }
    .iphoneX .page-inner-scroll.add-banner .component-card-bottom {
        bottom: calc(4rem + 7.2rem)
    }
    .iphoneX .page-inner-scroll.add-banner .component-moneytree-banner {
        bottom: calc(4rem + 1rem)
    }
}

/*! iPhone 14pro */

@media only screen and (device-width: 393px) and (device-height: 852px) and (-webkit-device-pixel-ratio: 3) {
    /*! mixin :홈 - 하단 안전영역 대응 */
    /*! Status Bar bottom area iphoneX (하단바 영역과 컨텐츠 간격 컨트롤) Status Bar 영역 확장 확장버전에는 body 에 statusExpension 클래스 추가되어 컨트롤함 아이폰 노치 디자인 디바이스(인디케이터) : 하단 고정버튼 여백 40px; */
    /*! 공통 - 컴포넌트 컨테이너 하단 여백 */
    /*! 공통 - 하단 고정버튼 여백 */
    .iphoneX .component-btn.fixed-bottom.home-tab-menu {
        height: calc(4rem + 5.6rem)
    }
    .iphoneX .container-component:last-child {
        padding-bottom: calc(4rem + 15.4rem)
    }
    .iphoneX .container-component.type2:last-child {
        padding-bottom: calc(4rem + 20rem)
    }
    .iphoneX .container-component.type3:last-child {
        padding-bottom: calc(4rem + 8rem)
    }
    .iphoneX .container-component.type4:last-child {
        padding-bottom: calc(4rem + 2rem)
    }
    .iphoneX .container-component.type5:last-child {
        padding-bottom: calc(4rem + 7.2rem)
    }
    .iphoneX .container-component.type8:last-child {
        padding-bottom: calc(4rem + 8rem)
    }
    .iphoneX .container-component.type9:last-child {
        padding-bottom: calc(4rem + 6.4rem)
    }
    .iphoneX .container-component.type10:last-child {
        padding-bottom: calc(4rem + 10rem)
    }
    .iphoneX .container-component.coupon:last-child {
        padding-bottom: 0
    }
    .iphoneX .component-btn.fixed-bottom,
    .iphoneX .component-card-bottom,
    .iphoneX .keypad-group .keypad-row-btn,
    .iphoneX .popup-dialog.ui-bottom .popup-group,
    .iphoneX .popup-dialog.ui-bottom[data-type="calendar"] .popup-group,
    .iphoneX .popup-dialog.ui-full-change .popup-group {
        padding-bottom: 4rem
    }
    .iphoneX .pop-bot-shadow.popup-dialog.ui-bottom .popup-header+.popup-content:last-child:before,
    .iphoneX .pop-bot-shadow.popup-dialog.ui-bottom[data-type="select-bank"] .popup-header+.popup-content:last-child:before {
        bottom: 4rem
    }
    .iphoneX .btn-scroll-top {
        bottom: -4rem
    }
    .iphoneX .btn-scroll-top.active {
        bottom: calc(4rem + 2.4rem)
    }
    /*! s: 돈나무 키우기 */
    .iphoneX .toast-wrap.moneytree-toast {
        bottom: calc(4rem + 18rem)
    }
    .iphoneX .dim-moneytree-wrap {
        bottom: 8.4rem
    }
    /*! e: 돈나무 키우기 */
    .iphoneX .toast-wrap.withdraw-type {
        bottom: calc(4rem + 7.2rem)
    }
    .iphoneX [page-calendar-btn] {
        bottom: 4rem
    }
    .iphoneX .container-component-coach .coach-item06 {
        bottom: 4rem
    }
    .iphoneX .main-container-component {
        padding-bottom: calc(4rem + 15.4rem)
    }
    .iphoneX .main-container-component.bg-main {
        padding-bottom: calc(4rem + 20.2rem)
    }
    .iphoneX .main-container-component.bg-main.wide {
        padding-bottom: calc(4rem + 21rem)
    }
    .iphoneX .chatbot-wrap {
        bottom: calc(4rem + 7.6rem)
    }
    .iphoneX .chatbot-wrap.up {
        bottom: calc(4rem + 15.5rem)
    }
    .iphoneX .chatbot-wrap.up2 {
        bottom: calc(4rem + 14rem)
    }
    .iphoneX .container-component.no-space {
        padding-bottom: 4rem
    }
    .iphoneX .container-component.no-space-notch {
        padding-bottom: 4rem
    }
    .iphoneX .container-component.intro-login-shield {
        padding-bottom: 0
    }
    .iphoneX .activeSlide .quiz-entry-wrap.no-animation {
        bottom: calc(4rem + 7.2rem)
    }
    .iphoneX .activeSlide .quiz-entry-wrap {
        -webkit-animation: quiz-up-notch ease-out 0.15s 1s forwards;
        animation: quiz-up-notch ease-out 0.15s 1s forwards
    }
    @-webkit-keyframes quiz-up-notch {
        0% {
            opacity: 0;
            bottom: calc(-7.4rem - 4rem)
        }
        100% {
            opacity: 100%;
            bottom: calc(4rem + 7.2rem)
        }
    }
    @keyframes quiz-up-notch {
        0% {
            opacity: 0;
            bottom: calc(-7.4rem - 4rem)
        }
        100% {
            opacity: 100%;
            bottom: calc(4rem + 7.2rem)
        }
    }
    .iphoneX .aiquiz-today-wrap {
        bottom: calc(4rem + 17.2rem)
    }
    .iphoneX .insurance-landing-footer-wrap:last-child {
        padding-bottom: calc(4rem + 15.4rem)
    }
    .iphoneX .container-component.view-center.type1 {
        padding-bottom: calc(4rem)
    }
    .iphoneX .container-component.view-center.type1 .component-img {
        padding-bottom: calc(4rem + 11.2rem)
    }
    .iphoneX .page-inner-scroll.add-banner .container-component.moneytree {
        padding-bottom: calc(4rem + 26rem)
    }
    .iphoneX .page-inner-scroll.add-banner .container-component.moneytree-intro {
        padding-bottom: calc(4rem + 26rem)
    }
    .iphoneX .page-inner-scroll.add-banner .dim-moneytree-wrap {
        bottom: calc(4rem + 7.2rem)
    }
    .iphoneX .page-inner-scroll.add-banner .component-card-bottom {
        bottom: calc(4rem + 7.2rem)
    }
    .iphoneX .page-inner-scroll.add-banner .component-moneytree-banner {
        bottom: calc(4rem + 1rem)
    }
}

/*! iPhone 11, Xr */

@media only screen and (device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 2) {
    /*! mixin :홈 - 하단 안전영역 대응 */
    /*! Status Bar bottom area iphoneX (하단바 영역과 컨텐츠 간격 컨트롤) Status Bar 영역 확장 확장버전에는 body 에 statusExpension 클래스 추가되어 컨트롤함 아이폰 노치 디자인 디바이스(인디케이터) : 하단 고정버튼 여백 40px; */
    /*! 공통 - 컴포넌트 컨테이너 하단 여백 */
    /*! 공통 - 하단 고정버튼 여백 */
    .iphoneX .component-btn.fixed-bottom.home-tab-menu {
        height: calc(4rem + 5.6rem)
    }
    .iphoneX .container-component:last-child {
        padding-bottom: calc(4rem + 15.4rem)
    }
    .iphoneX .container-component.type2:last-child {
        padding-bottom: calc(4rem + 20rem)
    }
    .iphoneX .container-component.type3:last-child {
        padding-bottom: calc(4rem + 8rem)
    }
    .iphoneX .container-component.type4:last-child {
        padding-bottom: calc(4rem + 2rem)
    }
    .iphoneX .container-component.type5:last-child {
        padding-bottom: calc(4rem + 7.2rem)
    }
    .iphoneX .container-component.type8:last-child {
        padding-bottom: calc(4rem + 8rem)
    }
    .iphoneX .container-component.type9:last-child {
        padding-bottom: calc(4rem + 6.4rem)
    }
    .iphoneX .container-component.type10:last-child {
        padding-bottom: calc(4rem + 10rem)
    }
    .iphoneX .container-component.coupon:last-child {
        padding-bottom: 0
    }
    .iphoneX .component-btn.fixed-bottom,
    .iphoneX .component-card-bottom,
    .iphoneX .keypad-group .keypad-row-btn,
    .iphoneX .popup-dialog.ui-bottom .popup-group,
    .iphoneX .popup-dialog.ui-bottom[data-type="calendar"] .popup-group,
    .iphoneX .popup-dialog.ui-full-change .popup-group {
        padding-bottom: 4rem
    }
    .iphoneX .pop-bot-shadow.popup-dialog.ui-bottom .popup-header+.popup-content:last-child:before,
    .iphoneX .pop-bot-shadow.popup-dialog.ui-bottom[data-type="select-bank"] .popup-header+.popup-content:last-child:before {
        bottom: 4rem
    }
    .iphoneX .btn-scroll-top {
        bottom: -4rem
    }
    .iphoneX .btn-scroll-top.active {
        bottom: calc(4rem + 2.4rem)
    }
    /*! s: 돈나무 키우기 */
    .iphoneX .toast-wrap.moneytree-toast {
        bottom: calc(4rem + 18rem)
    }
    .iphoneX .dim-moneytree-wrap {
        bottom: 8.4rem
    }
    /*! e: 돈나무 키우기 */
    .iphoneX .toast-wrap.withdraw-type {
        bottom: calc(4rem + 7.2rem)
    }
    .iphoneX [page-calendar-btn] {
        bottom: 4rem
    }
    .iphoneX .container-component-coach .coach-item06 {
        bottom: 4rem
    }
    .iphoneX .main-container-component {
        padding-bottom: calc(4rem + 15.4rem)
    }
    .iphoneX .main-container-component.bg-main {
        padding-bottom: calc(4rem + 20.2rem)
    }
    .iphoneX .main-container-component.bg-main.wide {
        padding-bottom: calc(4rem + 21rem)
    }
    .iphoneX .chatbot-wrap {
        bottom: calc(4rem + 7.6rem)
    }
    .iphoneX .chatbot-wrap.up {
        bottom: calc(4rem + 15.5rem)
    }
    .iphoneX .chatbot-wrap.up2 {
        bottom: calc(4rem + 14rem)
    }
    .iphoneX .container-component.no-space {
        padding-bottom: 4rem
    }
    .iphoneX .container-component.no-space-notch {
        padding-bottom: 4rem
    }
    .iphoneX .container-component.intro-login-shield {
        padding-bottom: 0
    }
    .iphoneX .activeSlide .quiz-entry-wrap.no-animation {
        bottom: calc(4rem + 7.2rem)
    }
    .iphoneX .activeSlide .quiz-entry-wrap {
        -webkit-animation: quiz-up-notch ease-out 0.15s 1s forwards;
        animation: quiz-up-notch ease-out 0.15s 1s forwards
    }
    @-webkit-keyframes quiz-up-notch {
        0% {
            opacity: 0;
            bottom: calc(-7.4rem - 4rem)
        }
        100% {
            opacity: 100%;
            bottom: calc(4rem + 7.2rem)
        }
    }
    @keyframes quiz-up-notch {
        0% {
            opacity: 0;
            bottom: calc(-7.4rem - 4rem)
        }
        100% {
            opacity: 100%;
            bottom: calc(4rem + 7.2rem)
        }
    }
    .iphoneX .aiquiz-today-wrap {
        bottom: calc(4rem + 17.2rem)
    }
    .iphoneX .insurance-landing-footer-wrap:last-child {
        padding-bottom: calc(4rem + 15.4rem)
    }
    .iphoneX .container-component.view-center.type1 {
        padding-bottom: calc(4rem)
    }
    .iphoneX .container-component.view-center.type1 .component-img {
        padding-bottom: calc(4rem + 11.2rem)
    }
    .iphoneX .page-inner-scroll.add-banner .container-component.moneytree {
        padding-bottom: calc(4rem + 26rem)
    }
    .iphoneX .page-inner-scroll.add-banner .container-component.moneytree-intro {
        padding-bottom: calc(4rem + 26rem)
    }
    .iphoneX .page-inner-scroll.add-banner .dim-moneytree-wrap {
        bottom: calc(4rem + 7.2rem)
    }
    .iphoneX .page-inner-scroll.add-banner .component-card-bottom {
        bottom: calc(4rem + 7.2rem)
    }
    .iphoneX .page-inner-scroll.add-banner .component-moneytree-banner {
        bottom: calc(4rem + 1rem)
    }
}

/*! iPhone 11 Pro Max, Xs Max */

@media only screen and (device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 3) {
    /*! mixin :홈 - 하단 안전영역 대응 */
    /*! Status Bar bottom area iphoneX (하단바 영역과 컨텐츠 간격 컨트롤) Status Bar 영역 확장 확장버전에는 body 에 statusExpension 클래스 추가되어 컨트롤함 아이폰 노치 디자인 디바이스(인디케이터) : 하단 고정버튼 여백 40px; */
    /*! 공통 - 컴포넌트 컨테이너 하단 여백 */
    /*! 공통 - 하단 고정버튼 여백 */
    .iphoneX .component-btn.fixed-bottom.home-tab-menu {
        height: calc(4rem + 5.6rem)
    }
    .iphoneX .container-component:last-child {
        padding-bottom: calc(4rem + 15.4rem)
    }
    .iphoneX .container-component.type2:last-child {
        padding-bottom: calc(4rem + 20rem)
    }
    .iphoneX .container-component.type3:last-child {
        padding-bottom: calc(4rem + 8rem)
    }
    .iphoneX .container-component.type4:last-child {
        padding-bottom: calc(4rem + 2rem)
    }
    .iphoneX .container-component.type5:last-child {
        padding-bottom: calc(4rem + 7.2rem)
    }
    .iphoneX .container-component.type8:last-child {
        padding-bottom: calc(4rem + 8rem)
    }
    .iphoneX .container-component.type9:last-child {
        padding-bottom: calc(4rem + 6.4rem)
    }
    .iphoneX .container-component.type10:last-child {
        padding-bottom: calc(4rem + 10rem)
    }
    .iphoneX .container-component.coupon:last-child {
        padding-bottom: 0
    }
    .iphoneX .component-btn.fixed-bottom,
    .iphoneX .component-card-bottom,
    .iphoneX .keypad-group .keypad-row-btn,
    .iphoneX .popup-dialog.ui-bottom .popup-group,
    .iphoneX .popup-dialog.ui-bottom[data-type="calendar"] .popup-group,
    .iphoneX .popup-dialog.ui-full-change .popup-group {
        padding-bottom: 4rem
    }
    .iphoneX .pop-bot-shadow.popup-dialog.ui-bottom .popup-header+.popup-content:last-child:before,
    .iphoneX .pop-bot-shadow.popup-dialog.ui-bottom[data-type="select-bank"] .popup-header+.popup-content:last-child:before {
        bottom: 4rem
    }
    .iphoneX .btn-scroll-top {
        bottom: -4rem
    }
    .iphoneX .btn-scroll-top.active {
        bottom: calc(4rem + 2.4rem)
    }
    /*! s: 돈나무 키우기 */
    .iphoneX .toast-wrap.moneytree-toast {
        bottom: calc(4rem + 18rem)
    }
    .iphoneX .dim-moneytree-wrap {
        bottom: 8.4rem
    }
    /*! e: 돈나무 키우기 */
    .iphoneX .toast-wrap.withdraw-type {
        bottom: calc(4rem + 7.2rem)
    }
    .iphoneX [page-calendar-btn] {
        bottom: 4rem
    }
    .iphoneX .container-component-coach .coach-item06 {
        bottom: 4rem
    }
    .iphoneX .main-container-component {
        padding-bottom: calc(4rem + 15.4rem)
    }
    .iphoneX .main-container-component.bg-main {
        padding-bottom: calc(4rem + 20.2rem)
    }
    .iphoneX .main-container-component.bg-main.wide {
        padding-bottom: calc(4rem + 21rem)
    }
    .iphoneX .chatbot-wrap {
        bottom: calc(4rem + 7.6rem)
    }
    .iphoneX .chatbot-wrap.up {
        bottom: calc(4rem + 15.5rem)
    }
    .iphoneX .chatbot-wrap.up2 {
        bottom: calc(4rem + 14rem)
    }
    .iphoneX .container-component.no-space {
        padding-bottom: 4rem
    }
    .iphoneX .container-component.no-space-notch {
        padding-bottom: 4rem
    }
    .iphoneX .container-component.intro-login-shield {
        padding-bottom: 0
    }
    .iphoneX .activeSlide .quiz-entry-wrap.no-animation {
        bottom: calc(4rem + 7.2rem)
    }
    .iphoneX .activeSlide .quiz-entry-wrap {
        -webkit-animation: quiz-up-notch ease-out 0.15s 1s forwards;
        animation: quiz-up-notch ease-out 0.15s 1s forwards
    }
    @-webkit-keyframes quiz-up-notch {
        0% {
            opacity: 0;
            bottom: calc(-7.4rem - 4rem)
        }
        100% {
            opacity: 100%;
            bottom: calc(4rem + 7.2rem)
        }
    }
    @keyframes quiz-up-notch {
        0% {
            opacity: 0;
            bottom: calc(-7.4rem - 4rem)
        }
        100% {
            opacity: 100%;
            bottom: calc(4rem + 7.2rem)
        }
    }
    .iphoneX .aiquiz-today-wrap {
        bottom: calc(4rem + 17.2rem)
    }
    .iphoneX .insurance-landing-footer-wrap:last-child {
        padding-bottom: calc(4rem + 15.4rem)
    }
    .iphoneX .container-component.view-center.type1 {
        padding-bottom: calc(4rem)
    }
    .iphoneX .container-component.view-center.type1 .component-img {
        padding-bottom: calc(4rem + 11.2rem)
    }
    .iphoneX .page-inner-scroll.add-banner .container-component.moneytree {
        padding-bottom: calc(4rem + 26rem)
    }
    .iphoneX .page-inner-scroll.add-banner .container-component.moneytree-intro {
        padding-bottom: calc(4rem + 26rem)
    }
    .iphoneX .page-inner-scroll.add-banner .dim-moneytree-wrap {
        bottom: calc(4rem + 7.2rem)
    }
    .iphoneX .page-inner-scroll.add-banner .component-card-bottom {
        bottom: calc(4rem + 7.2rem)
    }
    .iphoneX .page-inner-scroll.add-banner .component-moneytree-banner {
        bottom: calc(4rem + 1rem)
    }
}

/*! iPhone 12 Pro Max */

@media only screen and (device-width: 428px) and (device-height: 926px) and (-webkit-device-pixel-ratio: 3) {
    /*! mixin :홈 - 하단 안전영역 대응 */
    /*! Status Bar bottom area iphoneX (하단바 영역과 컨텐츠 간격 컨트롤) Status Bar 영역 확장 확장버전에는 body 에 statusExpension 클래스 추가되어 컨트롤함 아이폰 노치 디자인 디바이스(인디케이터) : 하단 고정버튼 여백 40px; */
    /*! 공통 - 컴포넌트 컨테이너 하단 여백 */
    /*! 공통 - 하단 고정버튼 여백 */
    .iphoneX .component-btn.fixed-bottom.home-tab-menu {
        height: calc(4rem + 5.6rem)
    }
    .iphoneX .container-component:last-child {
        padding-bottom: calc(4rem + 15.4rem)
    }
    .iphoneX .container-component.type2:last-child {
        padding-bottom: calc(4rem + 20rem)
    }
    .iphoneX .container-component.type3:last-child {
        padding-bottom: calc(4rem + 8rem)
    }
    .iphoneX .container-component.type4:last-child {
        padding-bottom: calc(4rem + 2rem)
    }
    .iphoneX .container-component.type5:last-child {
        padding-bottom: calc(4rem + 7.2rem)
    }
    .iphoneX .container-component.type8:last-child {
        padding-bottom: calc(4rem + 8rem)
    }
    .iphoneX .container-component.type9:last-child {
        padding-bottom: calc(4rem + 6.4rem)
    }
    .iphoneX .container-component.type10:last-child {
        padding-bottom: calc(4rem + 10rem)
    }
    .iphoneX .container-component.coupon:last-child {
        padding-bottom: 0
    }
    .iphoneX .component-btn.fixed-bottom,
    .iphoneX .component-card-bottom,
    .iphoneX .keypad-group .keypad-row-btn,
    .iphoneX .popup-dialog.ui-bottom .popup-group,
    .iphoneX .popup-dialog.ui-bottom[data-type="calendar"] .popup-group,
    .iphoneX .popup-dialog.ui-full-change .popup-group {
        padding-bottom: 4rem
    }
    .iphoneX .pop-bot-shadow.popup-dialog.ui-bottom .popup-header+.popup-content:last-child:before,
    .iphoneX .pop-bot-shadow.popup-dialog.ui-bottom[data-type="select-bank"] .popup-header+.popup-content:last-child:before {
        bottom: 4rem
    }
    .iphoneX .btn-scroll-top {
        bottom: -4rem
    }
    .iphoneX .btn-scroll-top.active {
        bottom: calc(4rem + 2.4rem)
    }
    /*! s: 돈나무 키우기 */
    .iphoneX .toast-wrap.moneytree-toast {
        bottom: calc(4rem + 18rem)
    }
    .iphoneX .dim-moneytree-wrap {
        bottom: 8.4rem
    }
    /*! e: 돈나무 키우기 */
    .iphoneX .toast-wrap.withdraw-type {
        bottom: calc(4rem + 7.2rem)
    }
    .iphoneX [page-calendar-btn] {
        bottom: 4rem
    }
    .iphoneX .container-component-coach .coach-item06 {
        bottom: 4rem
    }
    .iphoneX .main-container-component {
        padding-bottom: calc(4rem + 15.4rem)
    }
    .iphoneX .main-container-component.bg-main {
        padding-bottom: calc(4rem + 20.2rem)
    }
    .iphoneX .main-container-component.bg-main.wide {
        padding-bottom: calc(4rem + 21rem)
    }
    .iphoneX .chatbot-wrap {
        bottom: calc(4rem + 7.6rem)
    }
    .iphoneX .chatbot-wrap.up {
        bottom: calc(4rem + 15.5rem)
    }
    .iphoneX .chatbot-wrap.up2 {
        bottom: calc(4rem + 14rem)
    }
    .iphoneX .container-component.no-space {
        padding-bottom: 4rem
    }
    .iphoneX .container-component.no-space-notch {
        padding-bottom: 4rem
    }
    .iphoneX .container-component.intro-login-shield {
        padding-bottom: 0
    }
    .iphoneX .activeSlide .quiz-entry-wrap.no-animation {
        bottom: calc(4rem + 7.2rem)
    }
    .iphoneX .activeSlide .quiz-entry-wrap {
        -webkit-animation: quiz-up-notch ease-out 0.15s 1s forwards;
        animation: quiz-up-notch ease-out 0.15s 1s forwards
    }
    @-webkit-keyframes quiz-up-notch {
        0% {
            opacity: 0;
            bottom: calc(-7.4rem - 4rem)
        }
        100% {
            opacity: 100%;
            bottom: calc(4rem + 7.2rem)
        }
    }
    @keyframes quiz-up-notch {
        0% {
            opacity: 0;
            bottom: calc(-7.4rem - 4rem)
        }
        100% {
            opacity: 100%;
            bottom: calc(4rem + 7.2rem)
        }
    }
    .iphoneX .aiquiz-today-wrap {
        bottom: calc(4rem + 17.2rem)
    }
    .iphoneX .insurance-landing-footer-wrap:last-child {
        padding-bottom: calc(4rem + 15.4rem)
    }
    .iphoneX .container-component.view-center.type1 {
        padding-bottom: calc(4rem)
    }
    .iphoneX .container-component.view-center.type1 .component-img {
        padding-bottom: calc(4rem + 11.2rem)
    }
    .iphoneX .page-inner-scroll.add-banner .container-component.moneytree {
        padding-bottom: calc(4rem + 26rem)
    }
    .iphoneX .page-inner-scroll.add-banner .container-component.moneytree-intro {
        padding-bottom: calc(4rem + 26rem)
    }
    .iphoneX .page-inner-scroll.add-banner .dim-moneytree-wrap {
        bottom: calc(4rem + 7.2rem)
    }
    .iphoneX .page-inner-scroll.add-banner .component-card-bottom {
        bottom: calc(4rem + 7.2rem)
    }
    .iphoneX .page-inner-scroll.add-banner .component-moneytree-banner {
        bottom: calc(4rem + 1rem)
    }
}

/*! iPhone 14+ */

@media only screen and (device-width: 426px) and (device-height: 926px) and (-webkit-device-pixel-ratio: 3) {
    /*! mixin :홈 - 하단 안전영역 대응 */
    /*! Status Bar bottom area iphoneX (하단바 영역과 컨텐츠 간격 컨트롤) Status Bar 영역 확장 확장버전에는 body 에 statusExpension 클래스 추가되어 컨트롤함 아이폰 노치 디자인 디바이스(인디케이터) : 하단 고정버튼 여백 40px; */
    /*! 공통 - 컴포넌트 컨테이너 하단 여백 */
    /*! 공통 - 하단 고정버튼 여백 */
    .iphoneX .component-btn.fixed-bottom.home-tab-menu {
        height: calc(4rem + 5.6rem)
    }
    .iphoneX .container-component:last-child {
        padding-bottom: calc(4rem + 15.4rem)
    }
    .iphoneX .container-component.type2:last-child {
        padding-bottom: calc(4rem + 20rem)
    }
    .iphoneX .container-component.type3:last-child {
        padding-bottom: calc(4rem + 8rem)
    }
    .iphoneX .container-component.type4:last-child {
        padding-bottom: calc(4rem + 2rem)
    }
    .iphoneX .container-component.type5:last-child {
        padding-bottom: calc(4rem + 7.2rem)
    }
    .iphoneX .container-component.type8:last-child {
        padding-bottom: calc(4rem + 8rem)
    }
    .iphoneX .container-component.type9:last-child {
        padding-bottom: calc(4rem + 6.4rem)
    }
    .iphoneX .container-component.type10:last-child {
        padding-bottom: calc(4rem + 10rem)
    }
    .iphoneX .container-component.coupon:last-child {
        padding-bottom: 0
    }
    .iphoneX .component-btn.fixed-bottom,
    .iphoneX .component-card-bottom,
    .iphoneX .keypad-group .keypad-row-btn,
    .iphoneX .popup-dialog.ui-bottom .popup-group,
    .iphoneX .popup-dialog.ui-bottom[data-type="calendar"] .popup-group,
    .iphoneX .popup-dialog.ui-full-change .popup-group {
        padding-bottom: 4rem
    }
    .iphoneX .pop-bot-shadow.popup-dialog.ui-bottom .popup-header+.popup-content:last-child:before,
    .iphoneX .pop-bot-shadow.popup-dialog.ui-bottom[data-type="select-bank"] .popup-header+.popup-content:last-child:before {
        bottom: 4rem
    }
    .iphoneX .btn-scroll-top {
        bottom: -4rem
    }
    .iphoneX .btn-scroll-top.active {
        bottom: calc(4rem + 2.4rem)
    }
    /*! s: 돈나무 키우기 */
    .iphoneX .toast-wrap.moneytree-toast {
        bottom: calc(4rem + 18rem)
    }
    .iphoneX .dim-moneytree-wrap {
        bottom: 8.4rem
    }
    /*! e: 돈나무 키우기 */
    .iphoneX .toast-wrap.withdraw-type {
        bottom: calc(4rem + 7.2rem)
    }
    .iphoneX [page-calendar-btn] {
        bottom: 4rem
    }
    .iphoneX .container-component-coach .coach-item06 {
        bottom: 4rem
    }
    .iphoneX .main-container-component {
        padding-bottom: calc(4rem + 15.4rem)
    }
    .iphoneX .main-container-component.bg-main {
        padding-bottom: calc(4rem + 20.2rem)
    }
    .iphoneX .main-container-component.bg-main.wide {
        padding-bottom: calc(4rem + 21rem)
    }
    .iphoneX .chatbot-wrap {
        bottom: calc(4rem + 7.6rem)
    }
    .iphoneX .chatbot-wrap.up {
        bottom: calc(4rem + 15.5rem)
    }
    .iphoneX .chatbot-wrap.up2 {
        bottom: calc(4rem + 14rem)
    }
    .iphoneX .container-component.no-space {
        padding-bottom: 4rem
    }
    .iphoneX .container-component.no-space-notch {
        padding-bottom: 4rem
    }
    .iphoneX .container-component.intro-login-shield {
        padding-bottom: 0
    }
    .iphoneX .activeSlide .quiz-entry-wrap.no-animation {
        bottom: calc(4rem + 7.2rem)
    }
    .iphoneX .activeSlide .quiz-entry-wrap {
        -webkit-animation: quiz-up-notch ease-out 0.15s 1s forwards;
        animation: quiz-up-notch ease-out 0.15s 1s forwards
    }
    @-webkit-keyframes quiz-up-notch {
        0% {
            opacity: 0;
            bottom: calc(-7.4rem - 4rem)
        }
        100% {
            opacity: 100%;
            bottom: calc(4rem + 7.2rem)
        }
    }
    @keyframes quiz-up-notch {
        0% {
            opacity: 0;
            bottom: calc(-7.4rem - 4rem)
        }
        100% {
            opacity: 100%;
            bottom: calc(4rem + 7.2rem)
        }
    }
    .iphoneX .aiquiz-today-wrap {
        bottom: calc(4rem + 17.2rem)
    }
    .iphoneX .insurance-landing-footer-wrap:last-child {
        padding-bottom: calc(4rem + 15.4rem)
    }
    .iphoneX .container-component.view-center.type1 {
        padding-bottom: calc(4rem)
    }
    .iphoneX .container-component.view-center.type1 .component-img {
        padding-bottom: calc(4rem + 11.2rem)
    }
    .iphoneX .page-inner-scroll.add-banner .container-component.moneytree {
        padding-bottom: calc(4rem + 26rem)
    }
    .iphoneX .page-inner-scroll.add-banner .container-component.moneytree-intro {
        padding-bottom: calc(4rem + 26rem)
    }
    .iphoneX .page-inner-scroll.add-banner .dim-moneytree-wrap {
        bottom: calc(4rem + 7.2rem)
    }
    .iphoneX .page-inner-scroll.add-banner .component-card-bottom {
        bottom: calc(4rem + 7.2rem)
    }
    .iphoneX .page-inner-scroll.add-banner .component-moneytree-banner {
        bottom: calc(4rem + 1rem)
    }
}

/*! iPhone 14 Pro Max */

@media only screen and (device-width: 430px) and (device-height: 932px) and (-webkit-device-pixel-ratio: 3) {
    /*! mixin :홈 - 하단 안전영역 대응 */
    /*! Status Bar bottom area iphoneX (하단바 영역과 컨텐츠 간격 컨트롤) Status Bar 영역 확장 확장버전에는 body 에 statusExpension 클래스 추가되어 컨트롤함 아이폰 노치 디자인 디바이스(인디케이터) : 하단 고정버튼 여백 40px; */
    /*! 공통 - 컴포넌트 컨테이너 하단 여백 */
    /*! 공통 - 하단 고정버튼 여백 */
    .iphoneX .component-btn.fixed-bottom.home-tab-menu {
        height: calc(4rem + 5.6rem)
    }
    .iphoneX .container-component:last-child {
        padding-bottom: calc(4rem + 15.4rem)
    }
    .iphoneX .container-component.type2:last-child {
        padding-bottom: calc(4rem + 20rem)
    }
    .iphoneX .container-component.type3:last-child {
        padding-bottom: calc(4rem + 8rem)
    }
    .iphoneX .container-component.type4:last-child {
        padding-bottom: calc(4rem + 2rem)
    }
    .iphoneX .container-component.type5:last-child {
        padding-bottom: calc(4rem + 7.2rem)
    }
    .iphoneX .container-component.type8:last-child {
        padding-bottom: calc(4rem + 8rem)
    }
    .iphoneX .container-component.type9:last-child {
        padding-bottom: calc(4rem + 6.4rem)
    }
    .iphoneX .container-component.type10:last-child {
        padding-bottom: calc(4rem + 10rem)
    }
    .iphoneX .container-component.coupon:last-child {
        padding-bottom: 0
    }
    .iphoneX .component-btn.fixed-bottom,
    .iphoneX .component-card-bottom,
    .iphoneX .keypad-group .keypad-row-btn,
    .iphoneX .popup-dialog.ui-bottom .popup-group,
    .iphoneX .popup-dialog.ui-bottom[data-type="calendar"] .popup-group,
    .iphoneX .popup-dialog.ui-full-change .popup-group {
        padding-bottom: 4rem
    }
    .iphoneX .pop-bot-shadow.popup-dialog.ui-bottom .popup-header+.popup-content:last-child:before,
    .iphoneX .pop-bot-shadow.popup-dialog.ui-bottom[data-type="select-bank"] .popup-header+.popup-content:last-child:before {
        bottom: 4rem
    }
    .iphoneX .btn-scroll-top {
        bottom: -4rem
    }
    .iphoneX .btn-scroll-top.active {
        bottom: calc(4rem + 2.4rem)
    }
    /*! s: 돈나무 키우기 */
    .iphoneX .toast-wrap.moneytree-toast {
        bottom: calc(4rem + 18rem)
    }
    .iphoneX .dim-moneytree-wrap {
        bottom: 8.4rem
    }
    /*! e: 돈나무 키우기 */
    .iphoneX .toast-wrap.withdraw-type {
        bottom: calc(4rem + 7.2rem)
    }
    .iphoneX [page-calendar-btn] {
        bottom: 4rem
    }
    .iphoneX .container-component-coach .coach-item06 {
        bottom: 4rem
    }
    .iphoneX .main-container-component {
        padding-bottom: calc(4rem + 15.4rem)
    }
    .iphoneX .main-container-component.bg-main {
        padding-bottom: calc(4rem + 20.2rem)
    }
    .iphoneX .main-container-component.bg-main.wide {
        padding-bottom: calc(4rem + 21rem)
    }
    .iphoneX .chatbot-wrap {
        bottom: calc(4rem + 7.6rem)
    }
    .iphoneX .chatbot-wrap.up {
        bottom: calc(4rem + 15.5rem)
    }
    .iphoneX .chatbot-wrap.up2 {
        bottom: calc(4rem + 14rem)
    }
    .iphoneX .container-component.no-space {
        padding-bottom: 4rem
    }
    .iphoneX .container-component.no-space-notch {
        padding-bottom: 4rem
    }
    .iphoneX .container-component.intro-login-shield {
        padding-bottom: 0
    }
    .iphoneX .activeSlide .quiz-entry-wrap.no-animation {
        bottom: calc(4rem + 7.2rem)
    }
    .iphoneX .activeSlide .quiz-entry-wrap {
        -webkit-animation: quiz-up-notch ease-out 0.15s 1s forwards;
        animation: quiz-up-notch ease-out 0.15s 1s forwards
    }
    @-webkit-keyframes quiz-up-notch {
        0% {
            opacity: 0;
            bottom: calc(-7.4rem - 4rem)
        }
        100% {
            opacity: 100%;
            bottom: calc(4rem + 7.2rem)
        }
    }
    @keyframes quiz-up-notch {
        0% {
            opacity: 0;
            bottom: calc(-7.4rem - 4rem)
        }
        100% {
            opacity: 100%;
            bottom: calc(4rem + 7.2rem)
        }
    }
    .iphoneX .aiquiz-today-wrap {
        bottom: calc(4rem + 17.2rem)
    }
    .iphoneX .insurance-landing-footer-wrap:last-child {
        padding-bottom: calc(4rem + 15.4rem)
    }
    .iphoneX .container-component.view-center.type1 {
        padding-bottom: calc(4rem)
    }
    .iphoneX .container-component.view-center.type1 .component-img {
        padding-bottom: calc(4rem + 11.2rem)
    }
    .iphoneX .page-inner-scroll.add-banner .container-component.moneytree {
        padding-bottom: calc(4rem + 26rem)
    }
    .iphoneX .page-inner-scroll.add-banner .container-component.moneytree-intro {
        padding-bottom: calc(4rem + 26rem)
    }
    .iphoneX .page-inner-scroll.add-banner .dim-moneytree-wrap {
        bottom: calc(4rem + 7.2rem)
    }
    .iphoneX .page-inner-scroll.add-banner .component-card-bottom {
        bottom: calc(4rem + 7.2rem)
    }
    .iphoneX .page-inner-scroll.add-banner .component-moneytree-banner {
        bottom: calc(4rem + 1rem)
    }
}

/*! iPhone 16 Pro */

@media only screen and (device-width: 402px) and (device-height: 874px) and (-webkit-device-pixel-ratio: 3) {
    /*! mixin :홈 - 하단 안전영역 대응 */
    /*! Status Bar bottom area iphoneX (하단바 영역과 컨텐츠 간격 컨트롤) Status Bar 영역 확장 확장버전에는 body 에 statusExpension 클래스 추가되어 컨트롤함 아이폰 노치 디자인 디바이스(인디케이터) : 하단 고정버튼 여백 40px; */
    /*! 공통 - 컴포넌트 컨테이너 하단 여백 */
    /*! 공통 - 하단 고정버튼 여백 */
    .iphoneX .component-btn.fixed-bottom.home-tab-menu {
        height: calc(4rem + 5.6rem)
    }
    .iphoneX .container-component:last-child {
        padding-bottom: calc(4rem + 15.4rem)
    }
    .iphoneX .container-component.type2:last-child {
        padding-bottom: calc(4rem + 20rem)
    }
    .iphoneX .container-component.type3:last-child {
        padding-bottom: calc(4rem + 8rem)
    }
    .iphoneX .container-component.type4:last-child {
        padding-bottom: calc(4rem + 2rem)
    }
    .iphoneX .container-component.type5:last-child {
        padding-bottom: calc(4rem + 7.2rem)
    }
    .iphoneX .container-component.type8:last-child {
        padding-bottom: calc(4rem + 8rem)
    }
    .iphoneX .container-component.type9:last-child {
        padding-bottom: calc(4rem + 6.4rem)
    }
    .iphoneX .container-component.type10:last-child {
        padding-bottom: calc(4rem + 10rem)
    }
    .iphoneX .container-component.coupon:last-child {
        padding-bottom: 0
    }
    .iphoneX .component-btn.fixed-bottom,
    .iphoneX .component-card-bottom,
    .iphoneX .keypad-group .keypad-row-btn,
    .iphoneX .popup-dialog.ui-bottom .popup-group,
    .iphoneX .popup-dialog.ui-bottom[data-type="calendar"] .popup-group,
    .iphoneX .popup-dialog.ui-full-change .popup-group {
        padding-bottom: 4rem
    }
    .iphoneX .pop-bot-shadow.popup-dialog.ui-bottom .popup-header+.popup-content:last-child:before,
    .iphoneX .pop-bot-shadow.popup-dialog.ui-bottom[data-type="select-bank"] .popup-header+.popup-content:last-child:before {
        bottom: 4rem
    }
    .iphoneX .btn-scroll-top {
        bottom: -4rem
    }
    .iphoneX .btn-scroll-top.active {
        bottom: calc(4rem + 2.4rem)
    }
    /*! s: 돈나무 키우기 */
    .iphoneX .toast-wrap.moneytree-toast {
        bottom: calc(4rem + 18rem)
    }
    .iphoneX .dim-moneytree-wrap {
        bottom: 8.4rem
    }
    /*! e: 돈나무 키우기 */
    .iphoneX .toast-wrap.withdraw-type {
        bottom: calc(4rem + 7.2rem)
    }
    .iphoneX [page-calendar-btn] {
        bottom: 4rem
    }
    .iphoneX .container-component-coach .coach-item06 {
        bottom: 4rem
    }
    .iphoneX .main-container-component {
        padding-bottom: calc(4rem + 15.4rem)
    }
    .iphoneX .main-container-component.bg-main {
        padding-bottom: calc(4rem + 20.2rem)
    }
    .iphoneX .main-container-component.bg-main.wide {
        padding-bottom: calc(4rem + 21rem)
    }
    .iphoneX .chatbot-wrap {
        bottom: calc(4rem + 7.6rem)
    }
    .iphoneX .chatbot-wrap.up {
        bottom: calc(4rem + 15.5rem)
    }
    .iphoneX .chatbot-wrap.up2 {
        bottom: calc(4rem + 14rem)
    }
    .iphoneX .container-component.no-space {
        padding-bottom: 4rem
    }
    .iphoneX .container-component.no-space-notch {
        padding-bottom: 4rem
    }
    .iphoneX .container-component.intro-login-shield {
        padding-bottom: 0
    }
    .iphoneX .activeSlide .quiz-entry-wrap.no-animation {
        bottom: calc(4rem + 7.2rem)
    }
    .iphoneX .activeSlide .quiz-entry-wrap {
        -webkit-animation: quiz-up-notch ease-out 0.15s 1s forwards;
        animation: quiz-up-notch ease-out 0.15s 1s forwards
    }
    @-webkit-keyframes quiz-up-notch {
        0% {
            opacity: 0;
            bottom: calc(-7.4rem - 4rem)
        }
        100% {
            opacity: 100%;
            bottom: calc(4rem + 7.2rem)
        }
    }
    @keyframes quiz-up-notch {
        0% {
            opacity: 0;
            bottom: calc(-7.4rem - 4rem)
        }
        100% {
            opacity: 100%;
            bottom: calc(4rem + 7.2rem)
        }
    }
    .iphoneX .aiquiz-today-wrap {
        bottom: calc(4rem + 17.2rem)
    }
    .iphoneX .insurance-landing-footer-wrap:last-child {
        padding-bottom: calc(4rem + 15.4rem)
    }
    .iphoneX .container-component.view-center.type1 {
        padding-bottom: calc(4rem)
    }
    .iphoneX .container-component.view-center.type1 .component-img {
        padding-bottom: calc(4rem + 11.2rem)
    }
    .iphoneX .page-inner-scroll.add-banner .container-component.moneytree {
        padding-bottom: calc(4rem + 26rem)
    }
    .iphoneX .page-inner-scroll.add-banner .container-component.moneytree-intro {
        padding-bottom: calc(4rem + 26rem)
    }
    .iphoneX .page-inner-scroll.add-banner .dim-moneytree-wrap {
        bottom: calc(4rem + 7.2rem)
    }
    .iphoneX .page-inner-scroll.add-banner .component-card-bottom {
        bottom: calc(4rem + 7.2rem)
    }
    .iphoneX .page-inner-scroll.add-banner .component-moneytree-banner {
        bottom: calc(4rem + 1rem)
    }
}

/*! iPhone 16 Pro Max */

@media only screen and (device-width: 440px) and (device-height: 956px) and (-webkit-device-pixel-ratio: 3) {
    /*! mixin :홈 - 하단 안전영역 대응 */
    /*! Status Bar bottom area iphoneX (하단바 영역과 컨텐츠 간격 컨트롤) Status Bar 영역 확장 확장버전에는 body 에 statusExpension 클래스 추가되어 컨트롤함 아이폰 노치 디자인 디바이스(인디케이터) : 하단 고정버튼 여백 40px; */
    /*! 공통 - 컴포넌트 컨테이너 하단 여백 */
    /*! 공통 - 하단 고정버튼 여백 */
    .iphoneX .component-btn.fixed-bottom.home-tab-menu {
        height: calc(4rem + 5.6rem)
    }
    .iphoneX .container-component:last-child {
        padding-bottom: calc(4rem + 15.4rem)
    }
    .iphoneX .container-component.type2:last-child {
        padding-bottom: calc(4rem + 20rem)
    }
    .iphoneX .container-component.type3:last-child {
        padding-bottom: calc(4rem + 8rem)
    }
    .iphoneX .container-component.type4:last-child {
        padding-bottom: calc(4rem + 2rem)
    }
    .iphoneX .container-component.type5:last-child {
        padding-bottom: calc(4rem + 7.2rem)
    }
    .iphoneX .container-component.type8:last-child {
        padding-bottom: calc(4rem + 8rem)
    }
    .iphoneX .container-component.type9:last-child {
        padding-bottom: calc(4rem + 6.4rem)
    }
    .iphoneX .container-component.type10:last-child {
        padding-bottom: calc(4rem + 10rem)
    }
    .iphoneX .container-component.coupon:last-child {
        padding-bottom: 0
    }
    .iphoneX .component-btn.fixed-bottom,
    .iphoneX .component-card-bottom,
    .iphoneX .keypad-group .keypad-row-btn,
    .iphoneX .popup-dialog.ui-bottom .popup-group,
    .iphoneX .popup-dialog.ui-bottom[data-type="calendar"] .popup-group,
    .iphoneX .popup-dialog.ui-full-change .popup-group {
        padding-bottom: 4rem
    }
    .iphoneX .pop-bot-shadow.popup-dialog.ui-bottom .popup-header+.popup-content:last-child:before,
    .iphoneX .pop-bot-shadow.popup-dialog.ui-bottom[data-type="select-bank"] .popup-header+.popup-content:last-child:before {
        bottom: 4rem
    }
    .iphoneX .btn-scroll-top {
        bottom: -4rem
    }
    .iphoneX .btn-scroll-top.active {
        bottom: calc(4rem + 2.4rem)
    }
    /*! s: 돈나무 키우기 */
    .iphoneX .toast-wrap.moneytree-toast {
        bottom: calc(4rem + 18rem)
    }
    .iphoneX .dim-moneytree-wrap {
        bottom: 8.4rem
    }
    /*! e: 돈나무 키우기 */
    .iphoneX .toast-wrap.withdraw-type {
        bottom: calc(4rem + 7.2rem)
    }
    .iphoneX [page-calendar-btn] {
        bottom: 4rem
    }
    .iphoneX .container-component-coach .coach-item06 {
        bottom: 4rem
    }
    .iphoneX .main-container-component {
        padding-bottom: calc(4rem + 15.4rem)
    }
    .iphoneX .main-container-component.bg-main {
        padding-bottom: calc(4rem + 20.2rem)
    }
    .iphoneX .main-container-component.bg-main.wide {
        padding-bottom: calc(4rem + 21rem)
    }
    .iphoneX .chatbot-wrap {
        bottom: calc(4rem + 7.6rem)
    }
    .iphoneX .chatbot-wrap.up {
        bottom: calc(4rem + 15.5rem)
    }
    .iphoneX .chatbot-wrap.up2 {
        bottom: calc(4rem + 14rem)
    }
    .iphoneX .container-component.no-space {
        padding-bottom: 4rem
    }
    .iphoneX .container-component.no-space-notch {
        padding-bottom: 4rem
    }
    .iphoneX .container-component.intro-login-shield {
        padding-bottom: 0
    }
    .iphoneX .activeSlide .quiz-entry-wrap.no-animation {
        bottom: calc(4rem + 7.2rem)
    }
    .iphoneX .activeSlide .quiz-entry-wrap {
        -webkit-animation: quiz-up-notch ease-out 0.15s 1s forwards;
        animation: quiz-up-notch ease-out 0.15s 1s forwards
    }
    @-webkit-keyframes quiz-up-notch {
        0% {
            opacity: 0;
            bottom: calc(-7.4rem - 4rem)
        }
        100% {
            opacity: 100%;
            bottom: calc(4rem + 7.2rem)
        }
    }
    @keyframes quiz-up-notch {
        0% {
            opacity: 0;
            bottom: calc(-7.4rem - 4rem)
        }
        100% {
            opacity: 100%;
            bottom: calc(4rem + 7.2rem)
        }
    }
    .iphoneX .aiquiz-today-wrap {
        bottom: calc(4rem + 17.2rem)
    }
    .iphoneX .insurance-landing-footer-wrap:last-child {
        padding-bottom: calc(4rem + 15.4rem)
    }
    .iphoneX .container-component.view-center.type1 {
        padding-bottom: calc(4rem)
    }
    .iphoneX .container-component.view-center.type1 .component-img {
        padding-bottom: calc(4rem + 11.2rem)
    }
    .iphoneX .page-inner-scroll.add-banner .container-component.moneytree {
        padding-bottom: calc(4rem + 26rem)
    }
    .iphoneX .page-inner-scroll.add-banner .container-component.moneytree-intro {
        padding-bottom: calc(4rem + 26rem)
    }
    .iphoneX .page-inner-scroll.add-banner .dim-moneytree-wrap {
        bottom: calc(4rem + 7.2rem)
    }
    .iphoneX .page-inner-scroll.add-banner .component-card-bottom {
        bottom: calc(4rem + 7.2rem)
    }
    .iphoneX .page-inner-scroll.add-banner .component-moneytree-banner {
        bottom: calc(4rem + 1rem)
    }
}

/*! ui-bottom > 작은 해상도 max-height 분기  */

@media only screen and (device-width: 375px) and (device-height: 667px) {
    .popup-dialog.ui-bottom .popup-group {
        max-height: 88vh
    }
}

@media only screen and (device-width: 320px) and (device-height: 568px) {
    .popup-dialog.ui-bottom .popup-group {
        max-height: 88vh
    }
}

@media only screen and (max-height: 670px) {
    html.android .popup-dialog.ui-bottom .popup-group {
        max-height: 88vh
    }
}

@media only screen and (device-width: 320px) and (device-height: 693px) and (-webkit-device-pixel-ratio: 3) {
    html.ios.statusExpension .section-component[data-tab-content="investTab01"] {
        top: 4.4rem
    }
    html.ios.statusExpension .sticky-tab.move-up {
        top: calc(4.4rem + 4.4rem)
    }
    html.ios.statusExpension .component-header.main.invest-header {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .component-header.main.invest-header .btn-home-txt {
        padding-top: 0.6rem
    }
    html.ios.statusExpension .main-tab-container [class^="main-tab-content05"] .component-tab.sticky-tab.move-up {
        top: calc(4.4rem + 4.4rem)
    }
    html.ios.statusExpension .scrolling .component-header.main.invest-header:after {
        opacity: 1
    }
    body.ios.nonotch .section-component[data-tab-content="investTab01"] {
        top: 4.4rem
    }
    body.ios.nonotch .sticky-tab.move-up {
        top: calc(4.4rem + 4.4rem)
    }
    body.ios.nonotch .component-header.main.invest-header {
        padding-top: 4.4rem
    }
    body.ios.nonotch .component-header.main.invest-header .btn-home-txt {
        padding-top: 0.6rem
    }
    body.ios.nonotch .main-tab-container [class^="main-tab-content05"] .component-tab.sticky-tab.move-up {
        top: calc(4.4rem + 4.4rem)
    }
    body.ios.nonotch .scrolling .component-header.main.invest-header:after {
        opacity: 1
    }
}

@media only screen and (device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 2) {
    html.ios.statusExpension .section-component[data-tab-content="investTab01"] {
        top: 4.4rem
    }
    html.ios.statusExpension .sticky-tab.move-up {
        top: calc(4.4rem + 4.4rem)
    }
    html.ios.statusExpension .component-header.main.invest-header {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .component-header.main.invest-header .btn-home-txt {
        padding-top: 0.6rem
    }
    html.ios.statusExpension .main-tab-container [class^="main-tab-content05"] .component-tab.sticky-tab.move-up {
        top: calc(4.4rem + 4.4rem)
    }
    html.ios.statusExpension .scrolling .component-header.main.invest-header:after {
        opacity: 1
    }
    body.ios.nonotch .section-component[data-tab-content="investTab01"] {
        top: 4.4rem
    }
    body.ios.nonotch .sticky-tab.move-up {
        top: calc(4.4rem + 4.4rem)
    }
    body.ios.nonotch .component-header.main.invest-header {
        padding-top: 4.4rem
    }
    body.ios.nonotch .component-header.main.invest-header .btn-home-txt {
        padding-top: 0.6rem
    }
    body.ios.nonotch .main-tab-container [class^="main-tab-content05"] .component-tab.sticky-tab.move-up {
        top: calc(4.4rem + 4.4rem)
    }
    body.ios.nonotch .scrolling .component-header.main.invest-header:after {
        opacity: 1
    }
}

@media only screen and (device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 3) {
    html.ios.statusExpension .section-component[data-tab-content="investTab01"] {
        top: 4.4rem
    }
    html.ios.statusExpension .sticky-tab.move-up {
        top: calc(4.4rem + 4.4rem)
    }
    html.ios.statusExpension .component-header.main.invest-header {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .component-header.main.invest-header .btn-home-txt {
        padding-top: 0.6rem
    }
    html.ios.statusExpension .main-tab-container [class^="main-tab-content05"] .component-tab.sticky-tab.move-up {
        top: calc(4.4rem + 4.4rem)
    }
    html.ios.statusExpension .scrolling .component-header.main.invest-header:after {
        opacity: 1
    }
    body.ios.nonotch .section-component[data-tab-content="investTab01"] {
        top: 4.4rem
    }
    body.ios.nonotch .sticky-tab.move-up {
        top: calc(4.4rem + 4.4rem)
    }
    body.ios.nonotch .component-header.main.invest-header {
        padding-top: 4.4rem
    }
    body.ios.nonotch .component-header.main.invest-header .btn-home-txt {
        padding-top: 0.6rem
    }
    body.ios.nonotch .main-tab-container [class^="main-tab-content05"] .component-tab.sticky-tab.move-up {
        top: calc(4.4rem + 4.4rem)
    }
    body.ios.nonotch .scrolling .component-header.main.invest-header:after {
        opacity: 1
    }
}

@media only screen and (device-width: 390px) and (device-height: 844px) and (-webkit-device-pixel-ratio: 3) {
    html.ios.statusExpension .section-component[data-tab-content="investTab01"] {
        top: 4.4rem
    }
    html.ios.statusExpension .sticky-tab.move-up {
        top: calc(4.4rem + 4.4rem)
    }
    html.ios.statusExpension .component-header.main.invest-header {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .component-header.main.invest-header .btn-home-txt {
        padding-top: 0.6rem
    }
    html.ios.statusExpension .main-tab-container [class^="main-tab-content05"] .component-tab.sticky-tab.move-up {
        top: calc(4.4rem + 4.4rem)
    }
    html.ios.statusExpension .scrolling .component-header.main.invest-header:after {
        opacity: 1
    }
    body.ios.nonotch .section-component[data-tab-content="investTab01"] {
        top: 4.4rem
    }
    body.ios.nonotch .sticky-tab.move-up {
        top: calc(4.4rem + 4.4rem)
    }
    body.ios.nonotch .component-header.main.invest-header {
        padding-top: 4.4rem
    }
    body.ios.nonotch .component-header.main.invest-header .btn-home-txt {
        padding-top: 0.6rem
    }
    body.ios.nonotch .main-tab-container [class^="main-tab-content05"] .component-tab.sticky-tab.move-up {
        top: calc(4.4rem + 4.4rem)
    }
    body.ios.nonotch .scrolling .component-header.main.invest-header:after {
        opacity: 1
    }
}

@media only screen and (device-width: 393px) and (device-height: 852px) and (-webkit-device-pixel-ratio: 3) {
    html.ios.statusExpension .section-component[data-tab-content="investTab01"] {
        top: 4.4rem
    }
    html.ios.statusExpension .sticky-tab.move-up {
        top: calc(4.4rem + 4.4rem)
    }
    html.ios.statusExpension .component-header.main.invest-header {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .component-header.main.invest-header .btn-home-txt {
        padding-top: 0.6rem
    }
    html.ios.statusExpension .main-tab-container [class^="main-tab-content05"] .component-tab.sticky-tab.move-up {
        top: calc(4.4rem + 4.4rem)
    }
    html.ios.statusExpension .scrolling .component-header.main.invest-header:after {
        opacity: 1
    }
    body.ios.nonotch .section-component[data-tab-content="investTab01"] {
        top: 4.4rem
    }
    body.ios.nonotch .sticky-tab.move-up {
        top: calc(4.4rem + 4.4rem)
    }
    body.ios.nonotch .component-header.main.invest-header {
        padding-top: 4.4rem
    }
    body.ios.nonotch .component-header.main.invest-header .btn-home-txt {
        padding-top: 0.6rem
    }
    body.ios.nonotch .main-tab-container [class^="main-tab-content05"] .component-tab.sticky-tab.move-up {
        top: calc(4.4rem + 4.4rem)
    }
    body.ios.nonotch .scrolling .component-header.main.invest-header:after {
        opacity: 1
    }
}

@media only screen and (device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 2) {
    html.ios.statusExpension .section-component[data-tab-content="investTab01"] {
        top: 4.4rem
    }
    html.ios.statusExpension .sticky-tab.move-up {
        top: calc(4.4rem + 4.4rem)
    }
    html.ios.statusExpension .component-header.main.invest-header {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .component-header.main.invest-header .btn-home-txt {
        padding-top: 0.6rem
    }
    html.ios.statusExpension .main-tab-container [class^="main-tab-content05"] .component-tab.sticky-tab.move-up {
        top: calc(4.4rem + 4.4rem)
    }
    html.ios.statusExpension .scrolling .component-header.main.invest-header:after {
        opacity: 1
    }
    body.ios.nonotch .section-component[data-tab-content="investTab01"] {
        top: 4.4rem
    }
    body.ios.nonotch .sticky-tab.move-up {
        top: calc(4.4rem + 4.4rem)
    }
    body.ios.nonotch .component-header.main.invest-header {
        padding-top: 4.4rem
    }
    body.ios.nonotch .component-header.main.invest-header .btn-home-txt {
        padding-top: 0.6rem
    }
    body.ios.nonotch .main-tab-container [class^="main-tab-content05"] .component-tab.sticky-tab.move-up {
        top: calc(4.4rem + 4.4rem)
    }
    body.ios.nonotch .scrolling .component-header.main.invest-header:after {
        opacity: 1
    }
}

@media only screen and (device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 3) {
    html.ios.statusExpension .section-component[data-tab-content="investTab01"] {
        top: 4.4rem
    }
    html.ios.statusExpension .sticky-tab.move-up {
        top: calc(4.4rem + 4.4rem)
    }
    html.ios.statusExpension .component-header.main.invest-header {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .component-header.main.invest-header .btn-home-txt {
        padding-top: 0.6rem
    }
    html.ios.statusExpension .main-tab-container [class^="main-tab-content05"] .component-tab.sticky-tab.move-up {
        top: calc(4.4rem + 4.4rem)
    }
    html.ios.statusExpension .scrolling .component-header.main.invest-header:after {
        opacity: 1
    }
    body.ios.nonotch .section-component[data-tab-content="investTab01"] {
        top: 4.4rem
    }
    body.ios.nonotch .sticky-tab.move-up {
        top: calc(4.4rem + 4.4rem)
    }
    body.ios.nonotch .component-header.main.invest-header {
        padding-top: 4.4rem
    }
    body.ios.nonotch .component-header.main.invest-header .btn-home-txt {
        padding-top: 0.6rem
    }
    body.ios.nonotch .main-tab-container [class^="main-tab-content05"] .component-tab.sticky-tab.move-up {
        top: calc(4.4rem + 4.4rem)
    }
    body.ios.nonotch .scrolling .component-header.main.invest-header:after {
        opacity: 1
    }
}

@media only screen and (device-width: 428px) and (device-height: 926px) and (-webkit-device-pixel-ratio: 3) {
    html.ios.statusExpension .section-component[data-tab-content="investTab01"] {
        top: 4.4rem
    }
    html.ios.statusExpension .sticky-tab.move-up {
        top: calc(4.4rem + 4.4rem)
    }
    html.ios.statusExpension .component-header.main.invest-header {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .component-header.main.invest-header .btn-home-txt {
        padding-top: 0.6rem
    }
    html.ios.statusExpension .main-tab-container [class^="main-tab-content05"] .component-tab.sticky-tab.move-up {
        top: calc(4.4rem + 4.4rem)
    }
    html.ios.statusExpension .scrolling .component-header.main.invest-header:after {
        opacity: 1
    }
    body.ios.nonotch .section-component[data-tab-content="investTab01"] {
        top: 4.4rem
    }
    body.ios.nonotch .sticky-tab.move-up {
        top: calc(4.4rem + 4.4rem)
    }
    body.ios.nonotch .component-header.main.invest-header {
        padding-top: 4.4rem
    }
    body.ios.nonotch .component-header.main.invest-header .btn-home-txt {
        padding-top: 0.6rem
    }
    body.ios.nonotch .main-tab-container [class^="main-tab-content05"] .component-tab.sticky-tab.move-up {
        top: calc(4.4rem + 4.4rem)
    }
    body.ios.nonotch .scrolling .component-header.main.invest-header:after {
        opacity: 1
    }
}

@media only screen and (device-width: 426px) and (device-height: 926px) and (-webkit-device-pixel-ratio: 3) {
    html.ios.statusExpension .section-component[data-tab-content="investTab01"] {
        top: 4.4rem
    }
    html.ios.statusExpension .sticky-tab.move-up {
        top: calc(4.4rem + 4.4rem)
    }
    html.ios.statusExpension .component-header.main.invest-header {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .component-header.main.invest-header .btn-home-txt {
        padding-top: 0.6rem
    }
    html.ios.statusExpension .main-tab-container [class^="main-tab-content05"] .component-tab.sticky-tab.move-up {
        top: calc(4.4rem + 4.4rem)
    }
    html.ios.statusExpension .scrolling .component-header.main.invest-header:after {
        opacity: 1
    }
    body.ios.nonotch .section-component[data-tab-content="investTab01"] {
        top: 4.4rem
    }
    body.ios.nonotch .sticky-tab.move-up {
        top: calc(4.4rem + 4.4rem)
    }
    body.ios.nonotch .component-header.main.invest-header {
        padding-top: 4.4rem
    }
    body.ios.nonotch .component-header.main.invest-header .btn-home-txt {
        padding-top: 0.6rem
    }
    body.ios.nonotch .main-tab-container [class^="main-tab-content05"] .component-tab.sticky-tab.move-up {
        top: calc(4.4rem + 4.4rem)
    }
    body.ios.nonotch .scrolling .component-header.main.invest-header:after {
        opacity: 1
    }
}

@media only screen and (device-width: 430px) and (device-height: 932px) and (-webkit-device-pixel-ratio: 3) {
    html.ios.statusExpension .section-component[data-tab-content="investTab01"] {
        top: 4.4rem
    }
    html.ios.statusExpension .sticky-tab.move-up {
        top: calc(4.4rem + 4.4rem)
    }
    html.ios.statusExpension .component-header.main.invest-header {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .component-header.main.invest-header .btn-home-txt {
        padding-top: 0.6rem
    }
    html.ios.statusExpension .main-tab-container [class^="main-tab-content05"] .component-tab.sticky-tab.move-up {
        top: calc(4.4rem + 4.4rem)
    }
    html.ios.statusExpension .scrolling .component-header.main.invest-header:after {
        opacity: 1
    }
    body.ios.nonotch .section-component[data-tab-content="investTab01"] {
        top: 4.4rem
    }
    body.ios.nonotch .sticky-tab.move-up {
        top: calc(4.4rem + 4.4rem)
    }
    body.ios.nonotch .component-header.main.invest-header {
        padding-top: 4.4rem
    }
    body.ios.nonotch .component-header.main.invest-header .btn-home-txt {
        padding-top: 0.6rem
    }
    body.ios.nonotch .main-tab-container [class^="main-tab-content05"] .component-tab.sticky-tab.move-up {
        top: calc(4.4rem + 4.4rem)
    }
    body.ios.nonotch .scrolling .component-header.main.invest-header:after {
        opacity: 1
    }
}

/*! home iPhomne 16 Pro */

@media only screen and (device-width: 402px) and (device-height: 874px) and (-webkit-device-pixel-ratio: 3) {
    html.ios.statusExpension .section-component[data-tab-content="investTab01"] {
        top: 4.4rem
    }
    html.ios.statusExpension .sticky-tab.move-up {
        top: calc(4.4rem + 4.4rem)
    }
    html.ios.statusExpension .component-header.main.invest-header {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .component-header.main.invest-header .btn-home-txt {
        padding-top: 0.6rem
    }
    html.ios.statusExpension .main-tab-container [class^="main-tab-content05"] .component-tab.sticky-tab.move-up {
        top: calc(4.4rem + 4.4rem)
    }
    html.ios.statusExpension .scrolling .component-header.main.invest-header:after {
        opacity: 1
    }
    body.ios.nonotch .section-component[data-tab-content="investTab01"] {
        top: 4.4rem
    }
    body.ios.nonotch .sticky-tab.move-up {
        top: calc(4.4rem + 4.4rem)
    }
    body.ios.nonotch .component-header.main.invest-header {
        padding-top: 4.4rem
    }
    body.ios.nonotch .component-header.main.invest-header .btn-home-txt {
        padding-top: 0.6rem
    }
    body.ios.nonotch .main-tab-container [class^="main-tab-content05"] .component-tab.sticky-tab.move-up {
        top: calc(4.4rem + 4.4rem)
    }
    body.ios.nonotch .scrolling .component-header.main.invest-header:after {
        opacity: 1
    }
}

/*! home iPhomne 16 Pro Max */

@media only screen and (device-width: 440px) and (device-height: 956px) and (-webkit-device-pixel-ratio: 3) {
    html.ios.statusExpension .section-component[data-tab-content="investTab01"] {
        top: 4.4rem
    }
    html.ios.statusExpension .sticky-tab.move-up {
        top: calc(4.4rem + 4.4rem)
    }
    html.ios.statusExpension .component-header.main.invest-header {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .component-header.main.invest-header .btn-home-txt {
        padding-top: 0.6rem
    }
    html.ios.statusExpension .main-tab-container [class^="main-tab-content05"] .component-tab.sticky-tab.move-up {
        top: calc(4.4rem + 4.4rem)
    }
    html.ios.statusExpension .scrolling .component-header.main.invest-header:after {
        opacity: 1
    }
    body.ios.nonotch .section-component[data-tab-content="investTab01"] {
        top: 4.4rem
    }
    body.ios.nonotch .sticky-tab.move-up {
        top: calc(4.4rem + 4.4rem)
    }
    body.ios.nonotch .component-header.main.invest-header {
        padding-top: 4.4rem
    }
    body.ios.nonotch .component-header.main.invest-header .btn-home-txt {
        padding-top: 0.6rem
    }
    body.ios.nonotch .main-tab-container [class^="main-tab-content05"] .component-tab.sticky-tab.move-up {
        top: calc(4.4rem + 4.4rem)
    }
    body.ios.nonotch .scrolling .component-header.main.invest-header:after {
        opacity: 1
    }
}

@media only screen and (device-width: 414px) and (device-height: 736px) and (-webkit-device-pixel-ratio: 3) {
    html.ios.statusExpension .section-component[data-tab-content="investTab01"] {
        top: 2rem
    }
    html.ios.statusExpension .sticky-tab.move-up {
        top: calc(2rem + 4.4rem)
    }
    html.ios.statusExpension .component-header.main.invest-header {
        padding-top: 2rem
    }
    html.ios.statusExpension .component-header.main.invest-header .btn-home-txt {
        padding-top: 0.6rem
    }
    html.ios.statusExpension .main-tab-container [class^="main-tab-content05"] .component-tab.sticky-tab.move-up {
        top: calc(2rem + 4.4rem)
    }
    html.ios.statusExpension .scrolling .component-header.main.invest-header:after {
        opacity: 1
    }
    body.ios.nonotch .section-component[data-tab-content="investTab01"] {
        top: 2rem
    }
    body.ios.nonotch .sticky-tab.move-up {
        top: calc(2rem + 4.4rem)
    }
    body.ios.nonotch .component-header.main.invest-header {
        padding-top: 2rem
    }
    body.ios.nonotch .component-header.main.invest-header .btn-home-txt {
        padding-top: 0.6rem
    }
    body.ios.nonotch .main-tab-container [class^="main-tab-content05"] .component-tab.sticky-tab.move-up {
        top: calc(2rem + 4.4rem)
    }
    body.ios.nonotch .scrolling .component-header.main.invest-header:after {
        opacity: 1
    }
}

@media only screen and (device-width: 375px) and (device-height: 667px) and (-webkit-device-pixel-ratio: 3) {
    html.ios.statusExpension .section-component[data-tab-content="investTab01"] {
        top: 2rem
    }
    html.ios.statusExpension .sticky-tab.move-up {
        top: calc(2rem + 4.4rem)
    }
    html.ios.statusExpension .component-header.main.invest-header {
        padding-top: 2rem
    }
    html.ios.statusExpension .component-header.main.invest-header .btn-home-txt {
        padding-top: 0.6rem
    }
    html.ios.statusExpension .main-tab-container [class^="main-tab-content05"] .component-tab.sticky-tab.move-up {
        top: calc(2rem + 4.4rem)
    }
    html.ios.statusExpension .scrolling .component-header.main.invest-header:after {
        opacity: 1
    }
    body.ios.nonotch .section-component[data-tab-content="investTab01"] {
        top: 2rem
    }
    body.ios.nonotch .sticky-tab.move-up {
        top: calc(2rem + 4.4rem)
    }
    body.ios.nonotch .component-header.main.invest-header {
        padding-top: 2rem
    }
    body.ios.nonotch .component-header.main.invest-header .btn-home-txt {
        padding-top: 0.6rem
    }
    body.ios.nonotch .main-tab-container [class^="main-tab-content05"] .component-tab.sticky-tab.move-up {
        top: calc(2rem + 4.4rem)
    }
    body.ios.nonotch .scrolling .component-header.main.invest-header:after {
        opacity: 1
    }
}

@media only screen and (device-width: 375px) and (device-height: 667px) and (-webkit-device-pixel-ratio: 2) {
    html.ios.statusExpension .section-component[data-tab-content="investTab01"] {
        top: 2rem
    }
    html.ios.statusExpension .sticky-tab.move-up {
        top: calc(2rem + 4.4rem)
    }
    html.ios.statusExpension .component-header.main.invest-header {
        padding-top: 2rem
    }
    html.ios.statusExpension .component-header.main.invest-header .btn-home-txt {
        padding-top: 0.6rem
    }
    html.ios.statusExpension .main-tab-container [class^="main-tab-content05"] .component-tab.sticky-tab.move-up {
        top: calc(2rem + 4.4rem)
    }
    html.ios.statusExpension .scrolling .component-header.main.invest-header:after {
        opacity: 1
    }
    body.ios.nonotch .section-component[data-tab-content="investTab01"] {
        top: 2rem
    }
    body.ios.nonotch .sticky-tab.move-up {
        top: calc(2rem + 4.4rem)
    }
    body.ios.nonotch .component-header.main.invest-header {
        padding-top: 2rem
    }
    body.ios.nonotch .component-header.main.invest-header .btn-home-txt {
        padding-top: 0.6rem
    }
    body.ios.nonotch .main-tab-container [class^="main-tab-content05"] .component-tab.sticky-tab.move-up {
        top: calc(2rem + 4.4rem)
    }
    body.ios.nonotch .scrolling .component-header.main.invest-header:after {
        opacity: 1
    }
}

@media only screen and (device-width: 320px) and (device-height: 568px) and (-webkit-device-pixel-ratio: 2) {
    html.ios.statusExpension .section-component[data-tab-content="investTab01"] {
        top: 2rem
    }
    html.ios.statusExpension .sticky-tab.move-up {
        top: calc(2rem + 4.4rem)
    }
    html.ios.statusExpension .component-header.main.invest-header {
        padding-top: 2rem
    }
    html.ios.statusExpension .component-header.main.invest-header .btn-home-txt {
        padding-top: 0.6rem
    }
    html.ios.statusExpension .main-tab-container [class^="main-tab-content05"] .component-tab.sticky-tab.move-up {
        top: calc(2rem + 4.4rem)
    }
    html.ios.statusExpension .scrolling .component-header.main.invest-header:after {
        opacity: 1
    }
    body.ios.nonotch .section-component[data-tab-content="investTab01"] {
        top: 2rem
    }
    body.ios.nonotch .sticky-tab.move-up {
        top: calc(2rem + 4.4rem)
    }
    body.ios.nonotch .component-header.main.invest-header {
        padding-top: 2rem
    }
    body.ios.nonotch .component-header.main.invest-header .btn-home-txt {
        padding-top: 0.6rem
    }
    body.ios.nonotch .main-tab-container [class^="main-tab-content05"] .component-tab.sticky-tab.move-up {
        top: calc(2rem + 4.4rem)
    }
    body.ios.nonotch .scrolling .component-header.main.invest-header:after {
        opacity: 1
    }
}

@media only screen and (device-width: 320px) and (device-height: 480px) and (-webkit-device-pixel-ratio: 2) {
    html.ios.statusExpension .section-component[data-tab-content="investTab01"] {
        top: 2rem
    }
    html.ios.statusExpension .sticky-tab.move-up {
        top: calc(2rem + 4.4rem)
    }
    html.ios.statusExpension .component-header.main.invest-header {
        padding-top: 2rem
    }
    html.ios.statusExpension .component-header.main.invest-header .btn-home-txt {
        padding-top: 0.6rem
    }
    html.ios.statusExpension .main-tab-container [class^="main-tab-content05"] .component-tab.sticky-tab.move-up {
        top: calc(2rem + 4.4rem)
    }
    html.ios.statusExpension .scrolling .component-header.main.invest-header:after {
        opacity: 1
    }
    body.ios.nonotch .section-component[data-tab-content="investTab01"] {
        top: 2rem
    }
    body.ios.nonotch .sticky-tab.move-up {
        top: calc(2rem + 4.4rem)
    }
    body.ios.nonotch .component-header.main.invest-header {
        padding-top: 2rem
    }
    body.ios.nonotch .component-header.main.invest-header .btn-home-txt {
        padding-top: 0.6rem
    }
    body.ios.nonotch .main-tab-container [class^="main-tab-content05"] .component-tab.sticky-tab.move-up {
        top: calc(2rem + 4.4rem)
    }
    body.ios.nonotch .scrolling .component-header.main.invest-header:after {
        opacity: 1
    }
}

@media only screen and (device-width: 320px) and (device-height: 480px) and (-webkit-device-pixel-ratio: 1) {
    html.ios.statusExpension .section-component[data-tab-content="investTab01"] {
        top: 2rem
    }
    html.ios.statusExpension .sticky-tab.move-up {
        top: calc(2rem + 4.4rem)
    }
    html.ios.statusExpension .component-header.main.invest-header {
        padding-top: 2rem
    }
    html.ios.statusExpension .component-header.main.invest-header .btn-home-txt {
        padding-top: 0.6rem
    }
    html.ios.statusExpension .main-tab-container [class^="main-tab-content05"] .component-tab.sticky-tab.move-up {
        top: calc(2rem + 4.4rem)
    }
    html.ios.statusExpension .scrolling .component-header.main.invest-header:after {
        opacity: 1
    }
    body.ios.nonotch .section-component[data-tab-content="investTab01"] {
        top: 2rem
    }
    body.ios.nonotch .sticky-tab.move-up {
        top: calc(2rem + 4.4rem)
    }
    body.ios.nonotch .component-header.main.invest-header {
        padding-top: 2rem
    }
    body.ios.nonotch .component-header.main.invest-header .btn-home-txt {
        padding-top: 0.6rem
    }
    body.ios.nonotch .main-tab-container [class^="main-tab-content05"] .component-tab.sticky-tab.move-up {
        top: calc(2rem + 4.4rem)
    }
    body.ios.nonotch .scrolling .component-header.main.invest-header:after {
        opacity: 1
    }
}

/*! editor reset style 태그들의 기본 속성을 재리셋 합니다. (게시판 에디터 속성을 적용을 위하여) 필요한 곳에 editor-reset-style 클래스를 붙여 줍니다. */

.editor-reset-style a:line {
    color: internal value;
    text-decoration: underline;
    cursor: auto
}

.editor-reset-style a:visited {
    color: internal value;
    text-decoration: underline;
    cursor: auto
}

.editor-reset-style a:link:active {
    color: internal value
}

.editor-reset-style a:visited:active {
    color: internal value
}

.editor-reset-style address {
    display: block;
    font-style: italic
}

.editor-reset-style area {
    display: none
}

.editor-reset-style article {
    display: block
}

.editor-reset-style aside {
    display: block
}

.editor-reset-style b {
    font-weight: bold
}

.editor-reset-style bdo {
    unicode-bidi: bidi-override
}

.editor-reset-style blockquote {
    display: block;
    margin-top: 1em;
    margin-bottom: 1em;
    margin-left: 40px;
    margin-right: 40px
}

.editor-reset-style body {
    display: block;
    margin: 8px
}

.editor-reset-style body:focus {
    outline: none
}

.editor-reset-style caption {
    display: table-caption;
    text-align: center
}

.editor-reset-style cite {
    font-style: italic
}

.editor-reset-style code {
    font-family: monospace
}

.editor-reset-style col {
    display: table-column
}

.editor-reset-style colgroup {
    display: table-column-group
}

.editor-reset-style datalist {
    display: none
}

.editor-reset-style dd {
    display: block;
    margin-left: 40px
}

.editor-reset-style del {
    text-decoration: line-through
}

.editor-reset-style details {
    display: block
}

.editor-reset-style dfn {
    font-style: italic
}

.editor-reset-style div {
    display: block
}

.editor-reset-style dl {
    display: block;
    margin-top: 1em;
    margin-bottom: 1em;
    margin-left: 0;
    margin-right: 0
}

.editor-reset-style dt {
    display: block
}

.editor-reset-style em {
    font-style: italic
}

.editor-reset-style embed:focus {
    outline: none
}

.editor-reset-style fieldset {
    display: block;
    margin-left: 2px;
    margin-right: 2px;
    padding-top: 0.35em;
    padding-bottom: 0.625em;
    padding-left: 0.75em;
    padding-right: 0.75em;
    border: 2px groove internal value
}

.editor-reset-style figcaption {
    display: block
}

.editor-reset-style figure {
    display: block;
    margin-top: 1em;
    margin-bottom: 1em;
    margin-left: 40px;
    margin-right: 40px
}

.editor-reset-style footer {
    display: block
}

.editor-reset-style form {
    display: block;
    margin-top: 0
}

.editor-reset-style h1 {
    display: block;
    font-size: 2em;
    margin-top: 0.67em;
    margin-bottom: 0.67em;
    margin-left: 0;
    margin-right: 0;
    font-weight: bold
}

.editor-reset-style h2 {
    display: block;
    font-size: 1.5em;
    margin-top: 0.83em;
    margin-bottom: 0.83em;
    margin-left: 0;
    margin-right: 0;
    font-weight: bold
}

.editor-reset-style h3 {
    display: block;
    font-size: 1.17em;
    margin-top: 1em;
    margin-bottom: 1em;
    margin-left: 0;
    margin-right: 0;
    font-weight: bold
}

.editor-reset-style h4 {
    display: block;
    margin-top: 1.33em;
    margin-bottom: 1.33em;
    margin-left: 0;
    margin-right: 0;
    font-weight: bold
}

.editor-reset-style h5 {
    display: block;
    font-size: .83em;
    margin-top: 1.67em;
    margin-bottom: 1.67em;
    margin-left: 0;
    margin-right: 0;
    font-weight: bold
}

.editor-reset-style h6 {
    display: block;
    font-size: .67em;
    margin-top: 2.33em;
    margin-bottom: 2.33em;
    margin-left: 0;
    margin-right: 0;
    font-weight: bold
}

.editor-reset-style head {
    display: none
}

.editor-reset-style header {
    display: block
}

.editor-reset-style hr {
    display: block;
    margin-top: 0.5em;
    margin-bottom: 0.5em;
    margin-left: auto;
    margin-right: auto;
    border-style: inset;
    border-width: 1px
}

.editor-reset-style html {
    display: block
}

.editor-reset-style html:focus {
    outline: none
}

.editor-reset-style i {
    font-style: italic
}

.editor-reset-style iframe:focus {
    outline: none
}

.editor-reset-style iframe[seamless] {
    display: block
}

.editor-reset-style img {
    display: inline-block
}

.editor-reset-style ins {
    text-decoration: underline
}

.editor-reset-style kbd {
    font-family: monospace
}

.editor-reset-style label {
    cursor: default
}

.editor-reset-style legend {
    display: block;
    padding-left: 2px;
    padding-right: 2px;
    border: none
}

.editor-reset-style li {
    display: list-item
}

.editor-reset-style link {
    display: none
}

.editor-reset-style map {
    display: inline
}

.editor-reset-style mark {
    background-color: #ff0;
    color: var(--color-pb100, #000)
}

.editor-reset-style menu {
    display: block;
    list-style-type: disc;
    margin-top: 1em;
    margin-bottom: 1em;
    margin-left: 0;
    margin-right: 0;
    padding-left: 40px
}

.editor-reset-style nav {
    display: block
}

.editor-reset-style object:focus {
    outline: none
}

.editor-reset-style ol {
    display: block;
    list-style-type: decimal;
    margin-top: 1em;
    margin-bottom: 1em;
    margin-left: 0;
    margin-right: 0;
    padding-left: 40px
}

.editor-reset-style output {
    display: inline
}

.editor-reset-style p {
    display: block;
    margin-top: 1em;
    margin-bottom: 1em;
    margin-left: 0;
    margin-right: 0
}

.editor-reset-style param {
    display: none
}

.editor-reset-style pre {
    display: block;
    font-family: monospace;
    white-space: pre;
    margin: 1em 0
}

.editor-reset-style q {
    display: inline
}

.editor-reset-style q::before {
    content: open-quote
}

.editor-reset-style q::after {
    content: close-quote
}

.editor-reset-style rt {
    line-height: normal
}

.editor-reset-style s {
    text-decoration: line-through
}

.editor-reset-style samp {
    font-family: monospace
}

.editor-reset-style script {
    display: none
}

.editor-reset-style section {
    display: block
}

.editor-reset-style small {
    font-size: smaller
}

.editor-reset-style strike {
    text-decoration: line-through
}

.editor-reset-style strong {
    font-weight: bold
}

.editor-reset-style style {
    display: none
}

.editor-reset-style sub {
    vertical-align: sub;
    font-size: smaller
}

.editor-reset-style summary {
    display: block
}

.editor-reset-style sup {
    vertical-align: super;
    font-size: smaller
}

.editor-reset-style table {
    display: table;
    border-collapse: separate;
    border-spacing: 2px;
    border-color: gray
}

.editor-reset-style tbody {
    display: table-row-group;
    vertical-align: middle;
    border-color: inherit
}

.editor-reset-style td {
    display: table-cell;
    vertical-align: inherit
}

.editor-reset-style tfoot {
    display: table-footer-group;
    vertical-align: middle;
    border-color: inherit
}

.editor-reset-style th {
    display: table-cell;
    vertical-align: inherit;
    font-weight: bold;
    text-align: center
}

.editor-reset-style thead {
    display: table-header-group;
    vertical-align: middle;
    border-color: inherit
}

.editor-reset-style title {
    display: none
}

.editor-reset-style tr {
    display: table-row;
    vertical-align: inherit;
    border-color: inherit
}

.editor-reset-style u {
    text-decoration: underline
}

.editor-reset-style ul {
    display: block;
    list-style-type: disc;
    margin-top: 1em;
    margin-bottom: 1 em;
    margin-left: 0;
    margin-right: 0;
    padding-left: 40px
}

.editor-reset-style var {
    font-style: italic
}

/*! component element icon sprite icon 스프라이트 아이콘 컴포넌트 */

/*! component element icon sprite 로고 - 공통 */

[class*="ico-main-card"].w20,
[class*="logo-"].w20 {
    width: 2.0rem !important
}

[class*="ico-main-card"].w21,
[class*="logo-"].w21 {
    width: 2.1rem !important
}

[class*="ico-main-card"].w22,
[class*="logo-"].w22 {
    width: 2.2rem !important
}

[class*="ico-main-card"].w23,
[class*="logo-"].w23 {
    width: 2.3rem !important
}

[class*="ico-main-card"].w24,
[class*="logo-"].w24 {
    width: 2.4rem !important
}

[class*="ico-main-card"].w25,
[class*="logo-"].w25 {
    width: 2.5rem !important
}

[class*="ico-main-card"].w26,
[class*="logo-"].w26 {
    width: 2.6rem !important
}

[class*="ico-main-card"].w27,
[class*="logo-"].w27 {
    width: 2.7rem !important
}

[class*="ico-main-card"].w28,
[class*="logo-"].w28 {
    width: 2.8rem !important
}

[class*="ico-main-card"].w30,
[class*="logo-"].w30 {
    width: 3.0rem !important
}

[class*="ico-main-card"].w32,
[class*="logo-"].w32 {
    width: 3.2rem !important
}

[class*="ico-main-card"].w34,
[class*="logo-"].w34 {
    width: 3.4rem !important
}

[class*="ico-main-card"].w36,
[class*="logo-"].w36 {
    width: 3.6rem !important
}

[class*="ico-main-card"].w40,
[class*="logo-"].w40 {
    width: 4.0rem !important
}

[class*="ico-main-card"].w43,
[class*="logo-"].w43 {
    width: 4.3rem !important
}

[class*="ico-main-card"].w44,
[class*="logo-"].w44 {
    width: 4.4rem !important
}

[class*="ico-main-card"].w50,
[class*="logo-"].w50 {
    width: 5.0rem !important
}

[class*="ico-main-card"].w52,
[class*="logo-"].w52 {
    width: 5.2rem !important
}

[class*="ico-main-card"].w60,
[class*="logo-"].w60 {
    width: 6.0rem !important
}

[class*="ico-main-card"].w64,
[class*="logo-"].w64 {
    width: 6.4rem !important
}

[class*="ico-main-card"].w65,
[class*="logo-"].w65 {
    width: 6.5rem !important
}

[class*="ico-main-card"].w72,
[class*="logo-"].w72 {
    width: 7.2rem !important
}

[class*="ico-main-card"].w150,
[class*="logo-"].w150 {
    width: 15rem !important
}

[class*="ico-main-card"].w25 {
    width: 2.5rem !important;
    height: 3.9rem
}

[class*="ico-main-card"].w148 {
    width: 14.8rem !important;
    height: 23.384rem
}

[class*="ico-main-card-trfc"].w36 {
    width: 3.6rem !important;
    height: 2.267rem
}

[class*="ico-main-card-trfc"].w234 {
    width: 23.4rem !important;
    height: 14.742rem
}

/*! component element icon sprite 은행로고 - circle */

[class*="logo-card"]:after {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border: 0.5px solid rgba(0, 55, 138, 0.2);
    z-index: 3
}

[class*="logo-bank"]:after,
[class*="logo-cardandcapital"]:after,
[class*="logo-coin"]:after,
[class*="logo-insurance"]:after,
[class*="logo-kcb"]:after,
[class*="logo-kcis"]:after,
[class*="logo-msgr-sms"]:after,
[class*="logo-openbankingandcapital"]:after,
[class*="logo-partnerloan"]:after,
[class*="logo-pay"]:after {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 99rem;
    border: 0.5px solid rgba(0, 55, 138, 0.2);
    z-index: 3
}

[class*="logo-bank"].no-border:after {
    border: 0
}

[class*="logo-"]+[class*="logo-"] {
    z-index: 4
}

[class*="logo-bank"],
[class*="logo-cert-nav"],
[class*="logo-coin"],
[class*="logo-contact"],
[class*="logo-kcb"],
[class*="logo-kcis"],
[class*="logo-more"],
[class*="logo-msgr-sms"] {
    display: inline-block;
    overflow: hidden;
    border-radius: 50%;
    position: relative
}

[class*="logo-bank"].w16,
[class*="logo-cert-nav"].w16,
[class*="logo-coin"].w16,
[class*="logo-contact"].w16,
[class*="logo-kcb"].w16,
[class*="logo-kcis"].w16,
[class*="logo-more"].w16,
[class*="logo-msgr-sms"].w16 {
    background-image: url(../../img/mmk/common/sprite_logo.png?timestamp=1755485455560);
    width: 1.6rem;
    height: 1.6rem;
    background-size: 46.4rem 46.4rem
}

[class*="logo-bank"].w20,
[class*="logo-cert-nav"].w20,
[class*="logo-coin"].w20,
[class*="logo-contact"].w20,
[class*="logo-kcb"].w20,
[class*="logo-kcis"].w20,
[class*="logo-more"].w20,
[class*="logo-msgr-sms"].w20 {
    background-image: url(../../img/mmk/common/sprite_logo.png?timestamp=1755485455560);
    width: 2rem;
    height: 2rem;
    background-size: 58rem 58rem
}

[class*="logo-bank"].w22,
[class*="logo-cert-nav"].w22,
[class*="logo-coin"].w22,
[class*="logo-contact"].w22,
[class*="logo-kcb"].w22,
[class*="logo-kcis"].w22,
[class*="logo-more"].w22,
[class*="logo-msgr-sms"].w22 {
    background-image: url(../../img/mmk/common/sprite_logo.png?timestamp=1755485455560);
    width: 2.2rem;
    height: 2.2rem;
    background-size: 63.8rem 63.8rem
}

[class*="logo-bank"].w24,
[class*="logo-cert-nav"].w24,
[class*="logo-coin"].w24,
[class*="logo-contact"].w24,
[class*="logo-kcb"].w24,
[class*="logo-kcis"].w24,
[class*="logo-more"].w24,
[class*="logo-msgr-sms"].w24 {
    background-image: url(../../img/mmk/common/sprite_logo.png?timestamp=1755485455560);
    width: 2.4rem;
    height: 2.4rem;
    background-size: 69.6rem 69.6rem
}

[class*="logo-bank"].w28,
[class*="logo-cert-nav"].w28,
[class*="logo-coin"].w28,
[class*="logo-contact"].w28,
[class*="logo-kcb"].w28,
[class*="logo-kcis"].w28,
[class*="logo-more"].w28,
[class*="logo-msgr-sms"].w28 {
    background-image: url(../../img/mmk/common/sprite_logo.png?timestamp=1755485455560);
    width: 2.8rem;
    height: 2.8rem;
    background-size: 81.2rem 81.2rem
}

[class*="logo-bank"].w30,
[class*="logo-cert-nav"].w30,
[class*="logo-coin"].w30,
[class*="logo-contact"].w30,
[class*="logo-kcb"].w30,
[class*="logo-kcis"].w30,
[class*="logo-more"].w30,
[class*="logo-msgr-sms"].w30 {
    background-image: url(../../img/mmk/common/sprite_logo.png?timestamp=1755485455560);
    width: 3rem;
    height: 3rem;
    background-size: 87rem 87rem
}

[class*="logo-bank"].w32,
[class*="logo-cert-nav"].w32,
[class*="logo-coin"].w32,
[class*="logo-contact"].w32,
[class*="logo-kcb"].w32,
[class*="logo-kcis"].w32,
[class*="logo-more"].w32,
[class*="logo-msgr-sms"].w32 {
    background-image: url(../../img/mmk/common/sprite_logo.png?timestamp=1755485455560);
    width: 3.2rem;
    height: 3.2rem;
    background-size: 92.8rem 92.8rem
}

[class*="logo-bank"].w34,
[class*="logo-cert-nav"].w34,
[class*="logo-coin"].w34,
[class*="logo-contact"].w34,
[class*="logo-kcb"].w34,
[class*="logo-kcis"].w34,
[class*="logo-more"].w34,
[class*="logo-msgr-sms"].w34 {
    background-image: url(../../img/mmk/common/sprite_logo.png?timestamp=1755485455560);
    width: 3.4rem;
    height: 3.4rem;
    background-size: 98.6rem 98.6rem
}

[class*="logo-bank"].w36,
[class*="logo-cert-nav"].w36,
[class*="logo-coin"].w36,
[class*="logo-contact"].w36,
[class*="logo-kcb"].w36,
[class*="logo-kcis"].w36,
[class*="logo-more"].w36,
[class*="logo-msgr-sms"].w36 {
    background-image: url(../../img/mmk/common/sprite_logo.png?timestamp=1755485455560);
    width: 3.6rem;
    height: 3.6rem;
    background-size: 104.4rem 104.4rem
}

[class*="logo-bank"].w40,
[class*="logo-cert-nav"].w40,
[class*="logo-coin"].w40,
[class*="logo-contact"].w40,
[class*="logo-kcb"].w40,
[class*="logo-kcis"].w40,
[class*="logo-more"].w40,
[class*="logo-msgr-sms"].w40 {
    background-image: url(../../img/mmk/common/sprite_logo.png?timestamp=1755485455560);
    width: 4rem;
    height: 4rem;
    background-size: 116rem 116rem
}

[class*="logo-bank"].w44,
[class*="logo-cert-nav"].w44,
[class*="logo-coin"].w44,
[class*="logo-contact"].w44,
[class*="logo-kcb"].w44,
[class*="logo-kcis"].w44,
[class*="logo-more"].w44,
[class*="logo-msgr-sms"].w44 {
    background-image: url(../../img/mmk/common/sprite_logo.png?timestamp=1755485455560);
    width: 4.4rem;
    height: 4.4rem;
    background-size: 127.6rem 127.6rem
}

[class*="logo-bank"].w50,
[class*="logo-cert-nav"].w50,
[class*="logo-coin"].w50,
[class*="logo-contact"].w50,
[class*="logo-kcb"].w50,
[class*="logo-kcis"].w50,
[class*="logo-more"].w50,
[class*="logo-msgr-sms"].w50 {
    background-image: url(../../img/mmk/common/sprite_logo.png?timestamp=1755485455560);
    width: 5rem;
    height: 5rem;
    background-size: 145rem 145rem
}

[class*="logo-bank"].w52,
[class*="logo-cert-nav"].w52,
[class*="logo-coin"].w52,
[class*="logo-contact"].w52,
[class*="logo-kcb"].w52,
[class*="logo-kcis"].w52,
[class*="logo-more"].w52,
[class*="logo-msgr-sms"].w52 {
    background-image: url(../../img/mmk/common/sprite_logo.png?timestamp=1755485455560);
    width: 5.2rem;
    height: 5.2rem;
    background-size: 150.8rem 150.8rem
}

[class*="logo-bank"].w60,
[class*="logo-cert-nav"].w60,
[class*="logo-coin"].w60,
[class*="logo-contact"].w60,
[class*="logo-kcb"].w60,
[class*="logo-kcis"].w60,
[class*="logo-more"].w60,
[class*="logo-msgr-sms"].w60 {
    background-image: url(../../img/mmk/common/sprite_logo.png?timestamp=1755485455560);
    width: 6rem;
    height: 6rem;
    background-size: 174rem 174rem
}

[class*="logo-bank"].w64,
[class*="logo-cert-nav"].w64,
[class*="logo-coin"].w64,
[class*="logo-contact"].w64,
[class*="logo-kcb"].w64,
[class*="logo-kcis"].w64,
[class*="logo-more"].w64,
[class*="logo-msgr-sms"].w64 {
    background-image: url(../../img/mmk/common/sprite_logo.png?timestamp=1755485455560);
    width: 6.4rem;
    height: 6.4rem;
    background-size: 185.6rem 185.6rem
}

[class*="logo-bank"].w65,
[class*="logo-cert-nav"].w65,
[class*="logo-coin"].w65,
[class*="logo-contact"].w65,
[class*="logo-kcb"].w65,
[class*="logo-kcis"].w65,
[class*="logo-more"].w65,
[class*="logo-msgr-sms"].w65 {
    background-image: url(../../img/mmk/common/sprite_logo.png?timestamp=1755485455560);
    width: 6.5rem;
    height: 6.5rem;
    background-size: 188.5rem 188.5rem
}

[class*="logo-bank"].w72,
[class*="logo-cert-nav"].w72,
[class*="logo-coin"].w72,
[class*="logo-contact"].w72,
[class*="logo-kcb"].w72,
[class*="logo-kcis"].w72,
[class*="logo-more"].w72,
[class*="logo-msgr-sms"].w72 {
    background-image: url(../../img/mmk/common/sprite_logo.png?timestamp=1755485455560);
    width: 7.2rem;
    height: 7.2rem;
    background-size: 208.8rem 208.8rem
}

[class*="logo-bank"].w16,
[class*="logo-cert-nav"].w16,
[class*="logo-coin"].w16,
[class*="logo-contact"].w16,
[class*="logo-kcb"].w16,
[class*="logo-kcis"].w16,
[class*="logo-more"].w16,
[class*="logo-msgr-sms"].w16 {
    background-position: 0 -44.8rem
}

[class*="logo-bank"].w20,
[class*="logo-cert-nav"].w20,
[class*="logo-coin"].w20,
[class*="logo-contact"].w20,
[class*="logo-kcb"].w20,
[class*="logo-kcis"].w20,
[class*="logo-more"].w20,
[class*="logo-msgr-sms"].w20 {
    background-position: 0 -56rem
}

[class*="logo-bank"].w22,
[class*="logo-cert-nav"].w22,
[class*="logo-coin"].w22,
[class*="logo-contact"].w22,
[class*="logo-kcb"].w22,
[class*="logo-kcis"].w22,
[class*="logo-more"].w22,
[class*="logo-msgr-sms"].w22 {
    background-position: 0 -61.6rem
}

[class*="logo-bank"].w24,
[class*="logo-cert-nav"].w24,
[class*="logo-coin"].w24,
[class*="logo-contact"].w24,
[class*="logo-kcb"].w24,
[class*="logo-kcis"].w24,
[class*="logo-more"].w24,
[class*="logo-msgr-sms"].w24 {
    background-position: 0 -67.2rem
}

[class*="logo-bank"].w28,
[class*="logo-cert-nav"].w28,
[class*="logo-coin"].w28,
[class*="logo-contact"].w28,
[class*="logo-kcb"].w28,
[class*="logo-kcis"].w28,
[class*="logo-more"].w28,
[class*="logo-msgr-sms"].w28 {
    background-position: 0 -78.4rem
}

[class*="logo-bank"].w30,
[class*="logo-cert-nav"].w30,
[class*="logo-coin"].w30,
[class*="logo-contact"].w30,
[class*="logo-kcb"].w30,
[class*="logo-kcis"].w30,
[class*="logo-more"].w30,
[class*="logo-msgr-sms"].w30 {
    background-position: 0 -84rem
}

[class*="logo-bank"].w32,
[class*="logo-cert-nav"].w32,
[class*="logo-coin"].w32,
[class*="logo-contact"].w32,
[class*="logo-kcb"].w32,
[class*="logo-kcis"].w32,
[class*="logo-more"].w32,
[class*="logo-msgr-sms"].w32 {
    background-position: 0 -89.6rem
}

[class*="logo-bank"].w34,
[class*="logo-cert-nav"].w34,
[class*="logo-coin"].w34,
[class*="logo-contact"].w34,
[class*="logo-kcb"].w34,
[class*="logo-kcis"].w34,
[class*="logo-more"].w34,
[class*="logo-msgr-sms"].w34 {
    background-position: 0 -95.2rem
}

[class*="logo-bank"].w36,
[class*="logo-cert-nav"].w36,
[class*="logo-coin"].w36,
[class*="logo-contact"].w36,
[class*="logo-kcb"].w36,
[class*="logo-kcis"].w36,
[class*="logo-more"].w36,
[class*="logo-msgr-sms"].w36 {
    background-position: 0 -100.8rem
}

[class*="logo-bank"].w40,
[class*="logo-cert-nav"].w40,
[class*="logo-coin"].w40,
[class*="logo-contact"].w40,
[class*="logo-kcb"].w40,
[class*="logo-kcis"].w40,
[class*="logo-more"].w40,
[class*="logo-msgr-sms"].w40 {
    background-position: 0 -112rem
}

[class*="logo-bank"].w44,
[class*="logo-cert-nav"].w44,
[class*="logo-coin"].w44,
[class*="logo-contact"].w44,
[class*="logo-kcb"].w44,
[class*="logo-kcis"].w44,
[class*="logo-more"].w44,
[class*="logo-msgr-sms"].w44 {
    background-position: 0 -123.2rem
}

[class*="logo-bank"].w50,
[class*="logo-cert-nav"].w50,
[class*="logo-coin"].w50,
[class*="logo-contact"].w50,
[class*="logo-kcb"].w50,
[class*="logo-kcis"].w50,
[class*="logo-more"].w50,
[class*="logo-msgr-sms"].w50 {
    background-position: 0 -140rem
}

[class*="logo-bank"].w52,
[class*="logo-cert-nav"].w52,
[class*="logo-coin"].w52,
[class*="logo-contact"].w52,
[class*="logo-kcb"].w52,
[class*="logo-kcis"].w52,
[class*="logo-more"].w52,
[class*="logo-msgr-sms"].w52 {
    background-position: 0 -145.6rem
}

[class*="logo-bank"].w60,
[class*="logo-cert-nav"].w60,
[class*="logo-coin"].w60,
[class*="logo-contact"].w60,
[class*="logo-kcb"].w60,
[class*="logo-kcis"].w60,
[class*="logo-more"].w60,
[class*="logo-msgr-sms"].w60 {
    background-position: 0 -168rem
}

[class*="logo-bank"].w64,
[class*="logo-cert-nav"].w64,
[class*="logo-coin"].w64,
[class*="logo-contact"].w64,
[class*="logo-kcb"].w64,
[class*="logo-kcis"].w64,
[class*="logo-more"].w64,
[class*="logo-msgr-sms"].w64 {
    background-position: 0 -179.2rem
}

[class*="logo-bank"].w65,
[class*="logo-cert-nav"].w65,
[class*="logo-coin"].w65,
[class*="logo-contact"].w65,
[class*="logo-kcb"].w65,
[class*="logo-kcis"].w65,
[class*="logo-more"].w65,
[class*="logo-msgr-sms"].w65 {
    background-position: 0 -182rem
}

[class*="logo-bank"].w72,
[class*="logo-cert-nav"].w72,
[class*="logo-coin"].w72,
[class*="logo-contact"].w72,
[class*="logo-kcb"].w72,
[class*="logo-kcis"].w72,
[class*="logo-more"].w72,
[class*="logo-msgr-sms"].w72 {
    background-position: 0 -201.6rem
}

[class*="logo-bank"].more {
    background-color: var(--color-w100, #fff);
    background-image: var(--path-line-more-hori);
    background-position: center center;
    background-size: contain
}

[class*="logo-bank"].more[class*="w"] {
    background-position: inherit
}

/*! component element icon 은행 (총 33개) ======================================== */

/*! KDB산업은행 */

.logo-bank002.w16,
.logo-kcb10101.w16,
.logo-kcb20305.w16,
.logo-kcis0020.w16 {
    background-position: -3.2rem 0
}

.logo-bank002.w20,
.logo-kcb10101.w20,
.logo-kcb20305.w20,
.logo-kcis0020.w20 {
    background-position: -4rem 0
}

.logo-bank002.w22,
.logo-kcb10101.w22,
.logo-kcb20305.w22,
.logo-kcis0020.w22 {
    background-position: -4.4rem 0
}

.logo-bank002.w24,
.logo-kcb10101.w24,
.logo-kcb20305.w24,
.logo-kcis0020.w24 {
    background-position: -4.8rem 0
}

.logo-bank002.w28,
.logo-kcb10101.w28,
.logo-kcb20305.w28,
.logo-kcis0020.w28 {
    background-position: -5.6rem 0
}

.logo-bank002.w30,
.logo-kcb10101.w30,
.logo-kcb20305.w30,
.logo-kcis0020.w30 {
    background-position: -6rem 0
}

.logo-bank002.w32,
.logo-kcb10101.w32,
.logo-kcb20305.w32,
.logo-kcis0020.w32 {
    background-position: -6.4rem 0
}

.logo-bank002.w34,
.logo-kcb10101.w34,
.logo-kcb20305.w34,
.logo-kcis0020.w34 {
    background-position: -6.8rem 0
}

.logo-bank002.w36,
.logo-kcb10101.w36,
.logo-kcb20305.w36,
.logo-kcis0020.w36 {
    background-position: -7.2rem 0
}

.logo-bank002.w40,
.logo-kcb10101.w40,
.logo-kcb20305.w40,
.logo-kcis0020.w40 {
    background-position: -8rem 0
}

.logo-bank002.w44,
.logo-kcb10101.w44,
.logo-kcb20305.w44,
.logo-kcis0020.w44 {
    background-position: -8.8rem 0
}

.logo-bank002.w50,
.logo-kcb10101.w50,
.logo-kcb20305.w50,
.logo-kcis0020.w50 {
    background-position: -10rem 0
}

.logo-bank002.w52,
.logo-kcb10101.w52,
.logo-kcb20305.w52,
.logo-kcis0020.w52 {
    background-position: -10.4rem 0
}

.logo-bank002.w60,
.logo-kcb10101.w60,
.logo-kcb20305.w60,
.logo-kcis0020.w60 {
    background-position: -12rem 0
}

.logo-bank002.w64,
.logo-kcb10101.w64,
.logo-kcb20305.w64,
.logo-kcis0020.w64 {
    background-position: -12.8rem 0
}

.logo-bank002.w65,
.logo-kcb10101.w65,
.logo-kcb20305.w65,
.logo-kcis0020.w65 {
    background-position: -13rem 0
}

.logo-bank002.w72,
.logo-kcb10101.w72,
.logo-kcb20305.w72,
.logo-kcis0020.w72 {
    background-position: -14.4rem 0
}

/*! IBK기업은행 */

.logo-bank003.w16,
.logo-kcb10114.w16,
.logo-kcb20112.w16,
.logo-kcb20301.w16,
.logo-kcis0030.w16 {
    background-position: 0 -3.2rem
}

.logo-bank003.w20,
.logo-kcb10114.w20,
.logo-kcb20112.w20,
.logo-kcb20301.w20,
.logo-kcis0030.w20 {
    background-position: 0 -4rem
}

.logo-bank003.w22,
.logo-kcb10114.w22,
.logo-kcb20112.w22,
.logo-kcb20301.w22,
.logo-kcis0030.w22 {
    background-position: 0 -4.4rem
}

.logo-bank003.w24,
.logo-kcb10114.w24,
.logo-kcb20112.w24,
.logo-kcb20301.w24,
.logo-kcis0030.w24 {
    background-position: 0 -4.8rem
}

.logo-bank003.w28,
.logo-kcb10114.w28,
.logo-kcb20112.w28,
.logo-kcb20301.w28,
.logo-kcis0030.w28 {
    background-position: 0 -5.6rem
}

.logo-bank003.w30,
.logo-kcb10114.w30,
.logo-kcb20112.w30,
.logo-kcb20301.w30,
.logo-kcis0030.w30 {
    background-position: 0 -6rem
}

.logo-bank003.w32,
.logo-kcb10114.w32,
.logo-kcb20112.w32,
.logo-kcb20301.w32,
.logo-kcis0030.w32 {
    background-position: 0 -6.4rem
}

.logo-bank003.w34,
.logo-kcb10114.w34,
.logo-kcb20112.w34,
.logo-kcb20301.w34,
.logo-kcis0030.w34 {
    background-position: 0 -6.8rem
}

.logo-bank003.w36,
.logo-kcb10114.w36,
.logo-kcb20112.w36,
.logo-kcb20301.w36,
.logo-kcis0030.w36 {
    background-position: 0 -7.2rem
}

.logo-bank003.w40,
.logo-kcb10114.w40,
.logo-kcb20112.w40,
.logo-kcb20301.w40,
.logo-kcis0030.w40 {
    background-position: 0 -8rem
}

.logo-bank003.w44,
.logo-kcb10114.w44,
.logo-kcb20112.w44,
.logo-kcb20301.w44,
.logo-kcis0030.w44 {
    background-position: 0 -8.8rem
}

.logo-bank003.w50,
.logo-kcb10114.w50,
.logo-kcb20112.w50,
.logo-kcb20301.w50,
.logo-kcis0030.w50 {
    background-position: 0 -10rem
}

.logo-bank003.w52,
.logo-kcb10114.w52,
.logo-kcb20112.w52,
.logo-kcb20301.w52,
.logo-kcis0030.w52 {
    background-position: 0 -10.4rem
}

.logo-bank003.w60,
.logo-kcb10114.w60,
.logo-kcb20112.w60,
.logo-kcb20301.w60,
.logo-kcis0030.w60 {
    background-position: 0 -12rem
}

.logo-bank003.w64,
.logo-kcb10114.w64,
.logo-kcb20112.w64,
.logo-kcb20301.w64,
.logo-kcis0030.w64 {
    background-position: 0 -12.8rem
}

.logo-bank003.w65,
.logo-kcb10114.w65,
.logo-kcb20112.w65,
.logo-kcb20301.w65,
.logo-kcis0030.w65 {
    background-position: 0 -13rem
}

.logo-bank003.w72,
.logo-kcb10114.w72,
.logo-kcb20112.w72,
.logo-kcb20301.w72,
.logo-kcis0030.w72 {
    background-position: 0 -14.4rem
}

/*! KB국민은행 */

.logo-bank004.w16,
.logo-kcb10104.w16,
.logo-kcb20104.w16,
.logo-kcb20310.w16,
.logo-kcis0040.w16 {
    background-position: -3.2rem -3.2rem
}

.logo-bank004.w20,
.logo-kcb10104.w20,
.logo-kcb20104.w20,
.logo-kcb20310.w20,
.logo-kcis0040.w20 {
    background-position: -4rem -4rem
}

.logo-bank004.w22,
.logo-kcb10104.w22,
.logo-kcb20104.w22,
.logo-kcb20310.w22,
.logo-kcis0040.w22 {
    background-position: -4.4rem -4.4rem
}

.logo-bank004.w24,
.logo-kcb10104.w24,
.logo-kcb20104.w24,
.logo-kcb20310.w24,
.logo-kcis0040.w24 {
    background-position: -4.8rem -4.8rem
}

.logo-bank004.w28,
.logo-kcb10104.w28,
.logo-kcb20104.w28,
.logo-kcb20310.w28,
.logo-kcis0040.w28 {
    background-position: -5.6rem -5.6rem
}

.logo-bank004.w30,
.logo-kcb10104.w30,
.logo-kcb20104.w30,
.logo-kcb20310.w30,
.logo-kcis0040.w30 {
    background-position: -6rem -6rem
}

.logo-bank004.w32,
.logo-kcb10104.w32,
.logo-kcb20104.w32,
.logo-kcb20310.w32,
.logo-kcis0040.w32 {
    background-position: -6.4rem -6.4rem
}

.logo-bank004.w34,
.logo-kcb10104.w34,
.logo-kcb20104.w34,
.logo-kcb20310.w34,
.logo-kcis0040.w34 {
    background-position: -6.8rem -6.8rem
}

.logo-bank004.w36,
.logo-kcb10104.w36,
.logo-kcb20104.w36,
.logo-kcb20310.w36,
.logo-kcis0040.w36 {
    background-position: -7.2rem -7.2rem
}

.logo-bank004.w40,
.logo-kcb10104.w40,
.logo-kcb20104.w40,
.logo-kcb20310.w40,
.logo-kcis0040.w40 {
    background-position: -8rem -8rem
}

.logo-bank004.w44,
.logo-kcb10104.w44,
.logo-kcb20104.w44,
.logo-kcb20310.w44,
.logo-kcis0040.w44 {
    background-position: -8.8rem -8.8rem
}

.logo-bank004.w50,
.logo-kcb10104.w50,
.logo-kcb20104.w50,
.logo-kcb20310.w50,
.logo-kcis0040.w50 {
    background-position: -10rem -10rem
}

.logo-bank004.w52,
.logo-kcb10104.w52,
.logo-kcb20104.w52,
.logo-kcb20310.w52,
.logo-kcis0040.w52 {
    background-position: -10.4rem -10.4rem
}

.logo-bank004.w60,
.logo-kcb10104.w60,
.logo-kcb20104.w60,
.logo-kcb20310.w60,
.logo-kcis0040.w60 {
    background-position: -12rem -12rem
}

.logo-bank004.w64,
.logo-kcb10104.w64,
.logo-kcb20104.w64,
.logo-kcb20310.w64,
.logo-kcis0040.w64 {
    background-position: -12.8rem -12.8rem
}

.logo-bank004.w65,
.logo-kcb10104.w65,
.logo-kcb20104.w65,
.logo-kcb20310.w65,
.logo-kcis0040.w65 {
    background-position: -13rem -13rem
}

.logo-bank004.w72,
.logo-kcb10104.w72,
.logo-kcb20104.w72,
.logo-kcb20310.w72,
.logo-kcis0040.w72 {
    background-position: -14.4rem -14.4rem
}

/*! KB국민카드 */

.logo-bank381.w16,
.logo-kcb20103.w16 {
    background-position: -3.2rem -3.2rem
}

.logo-bank381.w20,
.logo-kcb20103.w20 {
    background-position: -4rem -4rem
}

.logo-bank381.w22,
.logo-kcb20103.w22 {
    background-position: -4.4rem -4.4rem
}

.logo-bank381.w24,
.logo-kcb20103.w24 {
    background-position: -4.8rem -4.8rem
}

.logo-bank381.w28,
.logo-kcb20103.w28 {
    background-position: -5.6rem -5.6rem
}

.logo-bank381.w30,
.logo-kcb20103.w30 {
    background-position: -6rem -6rem
}

.logo-bank381.w32,
.logo-kcb20103.w32 {
    background-position: -6.4rem -6.4rem
}

.logo-bank381.w34,
.logo-kcb20103.w34 {
    background-position: -6.8rem -6.8rem
}

.logo-bank381.w36,
.logo-kcb20103.w36 {
    background-position: -7.2rem -7.2rem
}

.logo-bank381.w40,
.logo-kcb20103.w40 {
    background-position: -8rem -8rem
}

.logo-bank381.w44,
.logo-kcb20103.w44 {
    background-position: -8.8rem -8.8rem
}

.logo-bank381.w50,
.logo-kcb20103.w50 {
    background-position: -10rem -10rem
}

.logo-bank381.w52,
.logo-kcb20103.w52 {
    background-position: -10.4rem -10.4rem
}

.logo-bank381.w60,
.logo-kcb20103.w60 {
    background-position: -12rem -12rem
}

.logo-bank381.w64,
.logo-kcb20103.w64 {
    background-position: -12.8rem -12.8rem
}

.logo-bank381.w65,
.logo-kcb20103.w65 {
    background-position: -13rem -13rem
}

.logo-bank381.w72,
.logo-kcb20103.w72 {
    background-position: -14.4rem -14.4rem
}

/*! 수협은행 */

.logo-bank007.w16,
.logo-kcb10108.w16,
.logo-kcb20107.w16,
.logo-kcis0070.w16 {
    background-position: -6.4rem 0
}

.logo-bank007.w20,
.logo-kcb10108.w20,
.logo-kcb20107.w20,
.logo-kcis0070.w20 {
    background-position: -8rem 0
}

.logo-bank007.w22,
.logo-kcb10108.w22,
.logo-kcb20107.w22,
.logo-kcis0070.w22 {
    background-position: -8.8rem 0
}

.logo-bank007.w24,
.logo-kcb10108.w24,
.logo-kcb20107.w24,
.logo-kcis0070.w24 {
    background-position: -9.6rem 0
}

.logo-bank007.w28,
.logo-kcb10108.w28,
.logo-kcb20107.w28,
.logo-kcis0070.w28 {
    background-position: -11.2rem 0
}

.logo-bank007.w30,
.logo-kcb10108.w30,
.logo-kcb20107.w30,
.logo-kcis0070.w30 {
    background-position: -12rem 0
}

.logo-bank007.w32,
.logo-kcb10108.w32,
.logo-kcb20107.w32,
.logo-kcis0070.w32 {
    background-position: -12.8rem 0
}

.logo-bank007.w34,
.logo-kcb10108.w34,
.logo-kcb20107.w34,
.logo-kcis0070.w34 {
    background-position: -13.6rem 0
}

.logo-bank007.w36,
.logo-kcb10108.w36,
.logo-kcb20107.w36,
.logo-kcis0070.w36 {
    background-position: -14.4rem 0
}

.logo-bank007.w40,
.logo-kcb10108.w40,
.logo-kcb20107.w40,
.logo-kcis0070.w40 {
    background-position: -16rem 0
}

.logo-bank007.w44,
.logo-kcb10108.w44,
.logo-kcb20107.w44,
.logo-kcis0070.w44 {
    background-position: -17.6rem 0
}

.logo-bank007.w50,
.logo-kcb10108.w50,
.logo-kcb20107.w50,
.logo-kcis0070.w50 {
    background-position: -20rem 0
}

.logo-bank007.w52,
.logo-kcb10108.w52,
.logo-kcb20107.w52,
.logo-kcis0070.w52 {
    background-position: -20.8rem 0
}

.logo-bank007.w60,
.logo-kcb10108.w60,
.logo-kcb20107.w60,
.logo-kcis0070.w60 {
    background-position: -24rem 0
}

.logo-bank007.w64,
.logo-kcb10108.w64,
.logo-kcb20107.w64,
.logo-kcis0070.w64 {
    background-position: -25.6rem 0
}

.logo-bank007.w65,
.logo-kcb10108.w65,
.logo-kcb20107.w65,
.logo-kcis0070.w65 {
    background-position: -26rem 0
}

.logo-bank007.w72,
.logo-kcb10108.w72,
.logo-kcb20107.w72,
.logo-kcis0070.w72 {
    background-position: -28.8rem 0
}

/*! 수협중앙회 */

.logo-bank030.w16,
.logo-kcis0300.w16 {
    background-position: -9.6rem -3.2rem
}

.logo-bank030.w20,
.logo-kcis0300.w20 {
    background-position: -12rem -4rem
}

.logo-bank030.w22,
.logo-kcis0300.w22 {
    background-position: -13.2rem -4.4rem
}

.logo-bank030.w24,
.logo-kcis0300.w24 {
    background-position: -14.4rem -4.8rem
}

.logo-bank030.w28,
.logo-kcis0300.w28 {
    background-position: -16.8rem -5.6rem
}

.logo-bank030.w30,
.logo-kcis0300.w30 {
    background-position: -18rem -6rem
}

.logo-bank030.w32,
.logo-kcis0300.w32 {
    background-position: -19.2rem -6.4rem
}

.logo-bank030.w34,
.logo-kcis0300.w34 {
    background-position: -20.4rem -6.8rem
}

.logo-bank030.w36,
.logo-kcis0300.w36 {
    background-position: -21.6rem -7.2rem
}

.logo-bank030.w40,
.logo-kcis0300.w40 {
    background-position: -24rem -8rem
}

.logo-bank030.w44,
.logo-kcis0300.w44 {
    background-position: -26.4rem -8.8rem
}

.logo-bank030.w50,
.logo-kcis0300.w50 {
    background-position: -30rem -10rem
}

.logo-bank030.w52,
.logo-kcis0300.w52 {
    background-position: -31.2rem -10.4rem
}

.logo-bank030.w60,
.logo-kcis0300.w60 {
    background-position: -36rem -12rem
}

.logo-bank030.w64,
.logo-kcis0300.w64 {
    background-position: -38.4rem -12.8rem
}

.logo-bank030.w65,
.logo-kcis0300.w65 {
    background-position: -39rem -13rem
}

.logo-bank030.w72,
.logo-kcis0300.w72 {
    background-position: -43.2rem -14.4rem
}

/*! NH농협은행 */

.logo-bank011.w16,
.logo-kcb10105.w16,
.logo-kcb20104.w16,
.logo-kcb20317.w16,
.logo-kcb20407.w16,
.logo-kcb20415.w16,
.logo-kcb20503.w16,
.logo-kcb20601.w16,
.logo-kcis0100.w16 {
    background-position: -6.4rem -3.2rem
}

.logo-bank011.w20,
.logo-kcb10105.w20,
.logo-kcb20104.w20,
.logo-kcb20317.w20,
.logo-kcb20407.w20,
.logo-kcb20415.w20,
.logo-kcb20503.w20,
.logo-kcb20601.w20,
.logo-kcis0100.w20 {
    background-position: -8rem -4rem
}

.logo-bank011.w22,
.logo-kcb10105.w22,
.logo-kcb20104.w22,
.logo-kcb20317.w22,
.logo-kcb20407.w22,
.logo-kcb20415.w22,
.logo-kcb20503.w22,
.logo-kcb20601.w22,
.logo-kcis0100.w22 {
    background-position: -8.8rem -4.4rem
}

.logo-bank011.w24,
.logo-kcb10105.w24,
.logo-kcb20104.w24,
.logo-kcb20317.w24,
.logo-kcb20407.w24,
.logo-kcb20415.w24,
.logo-kcb20503.w24,
.logo-kcb20601.w24,
.logo-kcis0100.w24 {
    background-position: -9.6rem -4.8rem
}

.logo-bank011.w28,
.logo-kcb10105.w28,
.logo-kcb20104.w28,
.logo-kcb20317.w28,
.logo-kcb20407.w28,
.logo-kcb20415.w28,
.logo-kcb20503.w28,
.logo-kcb20601.w28,
.logo-kcis0100.w28 {
    background-position: -11.2rem -5.6rem
}

.logo-bank011.w30,
.logo-kcb10105.w30,
.logo-kcb20104.w30,
.logo-kcb20317.w30,
.logo-kcb20407.w30,
.logo-kcb20415.w30,
.logo-kcb20503.w30,
.logo-kcb20601.w30,
.logo-kcis0100.w30 {
    background-position: -12rem -6rem
}

.logo-bank011.w32,
.logo-kcb10105.w32,
.logo-kcb20104.w32,
.logo-kcb20317.w32,
.logo-kcb20407.w32,
.logo-kcb20415.w32,
.logo-kcb20503.w32,
.logo-kcb20601.w32,
.logo-kcis0100.w32 {
    background-position: -12.8rem -6.4rem
}

.logo-bank011.w34,
.logo-kcb10105.w34,
.logo-kcb20104.w34,
.logo-kcb20317.w34,
.logo-kcb20407.w34,
.logo-kcb20415.w34,
.logo-kcb20503.w34,
.logo-kcb20601.w34,
.logo-kcis0100.w34 {
    background-position: -13.6rem -6.8rem
}

.logo-bank011.w36,
.logo-kcb10105.w36,
.logo-kcb20104.w36,
.logo-kcb20317.w36,
.logo-kcb20407.w36,
.logo-kcb20415.w36,
.logo-kcb20503.w36,
.logo-kcb20601.w36,
.logo-kcis0100.w36 {
    background-position: -14.4rem -7.2rem
}

.logo-bank011.w40,
.logo-kcb10105.w40,
.logo-kcb20104.w40,
.logo-kcb20317.w40,
.logo-kcb20407.w40,
.logo-kcb20415.w40,
.logo-kcb20503.w40,
.logo-kcb20601.w40,
.logo-kcis0100.w40 {
    background-position: -16rem -8rem
}

.logo-bank011.w44,
.logo-kcb10105.w44,
.logo-kcb20104.w44,
.logo-kcb20317.w44,
.logo-kcb20407.w44,
.logo-kcb20415.w44,
.logo-kcb20503.w44,
.logo-kcb20601.w44,
.logo-kcis0100.w44 {
    background-position: -17.6rem -8.8rem
}

.logo-bank011.w50,
.logo-kcb10105.w50,
.logo-kcb20104.w50,
.logo-kcb20317.w50,
.logo-kcb20407.w50,
.logo-kcb20415.w50,
.logo-kcb20503.w50,
.logo-kcb20601.w50,
.logo-kcis0100.w50 {
    background-position: -20rem -10rem
}

.logo-bank011.w52,
.logo-kcb10105.w52,
.logo-kcb20104.w52,
.logo-kcb20317.w52,
.logo-kcb20407.w52,
.logo-kcb20415.w52,
.logo-kcb20503.w52,
.logo-kcb20601.w52,
.logo-kcis0100.w52 {
    background-position: -20.8rem -10.4rem
}

.logo-bank011.w60,
.logo-kcb10105.w60,
.logo-kcb20104.w60,
.logo-kcb20317.w60,
.logo-kcb20407.w60,
.logo-kcb20415.w60,
.logo-kcb20503.w60,
.logo-kcb20601.w60,
.logo-kcis0100.w60 {
    background-position: -24rem -12rem
}

.logo-bank011.w64,
.logo-kcb10105.w64,
.logo-kcb20104.w64,
.logo-kcb20317.w64,
.logo-kcb20407.w64,
.logo-kcb20415.w64,
.logo-kcb20503.w64,
.logo-kcb20601.w64,
.logo-kcis0100.w64 {
    background-position: -25.6rem -12.8rem
}

.logo-bank011.w65,
.logo-kcb10105.w65,
.logo-kcb20104.w65,
.logo-kcb20317.w65,
.logo-kcb20407.w65,
.logo-kcb20415.w65,
.logo-kcb20503.w65,
.logo-kcb20601.w65,
.logo-kcis0100.w65 {
    background-position: -26rem -13rem
}

.logo-bank011.w72,
.logo-kcb10105.w72,
.logo-kcb20104.w72,
.logo-kcb20317.w72,
.logo-kcb20407.w72,
.logo-kcb20415.w72,
.logo-kcb20503.w72,
.logo-kcb20601.w72,
.logo-kcis0100.w72 {
    background-position: -28.8rem -14.4rem
}

/*! 농협중앙회 */

.logo-bank012.w16,
.logo-kcb20605.w16,
.logo-kcis0120.w16 {
    background-position: 0 -6.4rem
}

.logo-bank012.w20,
.logo-kcb20605.w20,
.logo-kcis0120.w20 {
    background-position: 0 -8rem
}

.logo-bank012.w22,
.logo-kcb20605.w22,
.logo-kcis0120.w22 {
    background-position: 0 -8.8rem
}

.logo-bank012.w24,
.logo-kcb20605.w24,
.logo-kcis0120.w24 {
    background-position: 0 -9.6rem
}

.logo-bank012.w28,
.logo-kcb20605.w28,
.logo-kcis0120.w28 {
    background-position: 0 -11.2rem
}

.logo-bank012.w30,
.logo-kcb20605.w30,
.logo-kcis0120.w30 {
    background-position: 0 -12rem
}

.logo-bank012.w32,
.logo-kcb20605.w32,
.logo-kcis0120.w32 {
    background-position: 0 -12.8rem
}

.logo-bank012.w34,
.logo-kcb20605.w34,
.logo-kcis0120.w34 {
    background-position: 0 -13.6rem
}

.logo-bank012.w36,
.logo-kcb20605.w36,
.logo-kcis0120.w36 {
    background-position: 0 -14.4rem
}

.logo-bank012.w40,
.logo-kcb20605.w40,
.logo-kcis0120.w40 {
    background-position: 0 -16rem
}

.logo-bank012.w44,
.logo-kcb20605.w44,
.logo-kcis0120.w44 {
    background-position: 0 -17.6rem
}

.logo-bank012.w50,
.logo-kcb20605.w50,
.logo-kcis0120.w50 {
    background-position: 0 -20rem
}

.logo-bank012.w52,
.logo-kcb20605.w52,
.logo-kcis0120.w52 {
    background-position: 0 -20.8rem
}

.logo-bank012.w60,
.logo-kcb20605.w60,
.logo-kcis0120.w60 {
    background-position: 0 -24rem
}

.logo-bank012.w64,
.logo-kcb20605.w64,
.logo-kcis0120.w64 {
    background-position: 0 -25.6rem
}

.logo-bank012.w65,
.logo-kcb20605.w65,
.logo-kcis0120.w65 {
    background-position: 0 -26rem
}

.logo-bank012.w72,
.logo-kcb20605.w72,
.logo-kcis0120.w72 {
    background-position: 0 -28.8rem
}

/*! 우리은행 */

.logo-bank020.w16,
.logo-kcb10110.w16,
.logo-kcb20108.w16,
.logo-kcb20201.w16,
.logo-kcb20303.w16,
.logo-kcb20541.w16,
.logo-kcis0200.w16 {
    background-position: -3.2rem -6.4rem
}

.logo-bank020.w20,
.logo-kcb10110.w20,
.logo-kcb20108.w20,
.logo-kcb20201.w20,
.logo-kcb20303.w20,
.logo-kcb20541.w20,
.logo-kcis0200.w20 {
    background-position: -4rem -8rem
}

.logo-bank020.w22,
.logo-kcb10110.w22,
.logo-kcb20108.w22,
.logo-kcb20201.w22,
.logo-kcb20303.w22,
.logo-kcb20541.w22,
.logo-kcis0200.w22 {
    background-position: -4.4rem -8.8rem
}

.logo-bank020.w24,
.logo-kcb10110.w24,
.logo-kcb20108.w24,
.logo-kcb20201.w24,
.logo-kcb20303.w24,
.logo-kcb20541.w24,
.logo-kcis0200.w24 {
    background-position: -4.8rem -9.6rem
}

.logo-bank020.w28,
.logo-kcb10110.w28,
.logo-kcb20108.w28,
.logo-kcb20201.w28,
.logo-kcb20303.w28,
.logo-kcb20541.w28,
.logo-kcis0200.w28 {
    background-position: -5.6rem -11.2rem
}

.logo-bank020.w30,
.logo-kcb10110.w30,
.logo-kcb20108.w30,
.logo-kcb20201.w30,
.logo-kcb20303.w30,
.logo-kcb20541.w30,
.logo-kcis0200.w30 {
    background-position: -6rem -12rem
}

.logo-bank020.w32,
.logo-kcb10110.w32,
.logo-kcb20108.w32,
.logo-kcb20201.w32,
.logo-kcb20303.w32,
.logo-kcb20541.w32,
.logo-kcis0200.w32 {
    background-position: -6.4rem -12.8rem
}

.logo-bank020.w34,
.logo-kcb10110.w34,
.logo-kcb20108.w34,
.logo-kcb20201.w34,
.logo-kcb20303.w34,
.logo-kcb20541.w34,
.logo-kcis0200.w34 {
    background-position: -6.8rem -13.6rem
}

.logo-bank020.w36,
.logo-kcb10110.w36,
.logo-kcb20108.w36,
.logo-kcb20201.w36,
.logo-kcb20303.w36,
.logo-kcb20541.w36,
.logo-kcis0200.w36 {
    background-position: -7.2rem -14.4rem
}

.logo-bank020.w40,
.logo-kcb10110.w40,
.logo-kcb20108.w40,
.logo-kcb20201.w40,
.logo-kcb20303.w40,
.logo-kcb20541.w40,
.logo-kcis0200.w40 {
    background-position: -8rem -16rem
}

.logo-bank020.w44,
.logo-kcb10110.w44,
.logo-kcb20108.w44,
.logo-kcb20201.w44,
.logo-kcb20303.w44,
.logo-kcb20541.w44,
.logo-kcis0200.w44 {
    background-position: -8.8rem -17.6rem
}

.logo-bank020.w50,
.logo-kcb10110.w50,
.logo-kcb20108.w50,
.logo-kcb20201.w50,
.logo-kcb20303.w50,
.logo-kcb20541.w50,
.logo-kcis0200.w50 {
    background-position: -10rem -20rem
}

.logo-bank020.w52,
.logo-kcb10110.w52,
.logo-kcb20108.w52,
.logo-kcb20201.w52,
.logo-kcb20303.w52,
.logo-kcb20541.w52,
.logo-kcis0200.w52 {
    background-position: -10.4rem -20.8rem
}

.logo-bank020.w60,
.logo-kcb10110.w60,
.logo-kcb20108.w60,
.logo-kcb20201.w60,
.logo-kcb20303.w60,
.logo-kcb20541.w60,
.logo-kcis0200.w60 {
    background-position: -12rem -24rem
}

.logo-bank020.w64,
.logo-kcb10110.w64,
.logo-kcb20108.w64,
.logo-kcb20201.w64,
.logo-kcb20303.w64,
.logo-kcb20541.w64,
.logo-kcis0200.w64 {
    background-position: -12.8rem -25.6rem
}

.logo-bank020.w65,
.logo-kcb10110.w65,
.logo-kcb20108.w65,
.logo-kcb20201.w65,
.logo-kcb20303.w65,
.logo-kcb20541.w65,
.logo-kcis0200.w65 {
    background-position: -13rem -26rem
}

.logo-bank020.w72,
.logo-kcb10110.w72,
.logo-kcb20108.w72,
.logo-kcb20201.w72,
.logo-kcb20303.w72,
.logo-kcb20541.w72,
.logo-kcis0200.w72 {
    background-position: -14.4rem -28.8rem
}

/*! SC제일은행 */

.logo-bank023.w16,
.logo-kcb10112.w16,
.logo-kcb10119.w16,
.logo-kcb20110.w16,
.logo-kcis0230.w16 {
    background-position: -6.4rem -6.4rem
}

.logo-bank023.w20,
.logo-kcb10112.w20,
.logo-kcb10119.w20,
.logo-kcb20110.w20,
.logo-kcis0230.w20 {
    background-position: -8rem -8rem
}

.logo-bank023.w22,
.logo-kcb10112.w22,
.logo-kcb10119.w22,
.logo-kcb20110.w22,
.logo-kcis0230.w22 {
    background-position: -8.8rem -8.8rem
}

.logo-bank023.w24,
.logo-kcb10112.w24,
.logo-kcb10119.w24,
.logo-kcb20110.w24,
.logo-kcis0230.w24 {
    background-position: -9.6rem -9.6rem
}

.logo-bank023.w28,
.logo-kcb10112.w28,
.logo-kcb10119.w28,
.logo-kcb20110.w28,
.logo-kcis0230.w28 {
    background-position: -11.2rem -11.2rem
}

.logo-bank023.w30,
.logo-kcb10112.w30,
.logo-kcb10119.w30,
.logo-kcb20110.w30,
.logo-kcis0230.w30 {
    background-position: -12rem -12rem
}

.logo-bank023.w32,
.logo-kcb10112.w32,
.logo-kcb10119.w32,
.logo-kcb20110.w32,
.logo-kcis0230.w32 {
    background-position: -12.8rem -12.8rem
}

.logo-bank023.w34,
.logo-kcb10112.w34,
.logo-kcb10119.w34,
.logo-kcb20110.w34,
.logo-kcis0230.w34 {
    background-position: -13.6rem -13.6rem
}

.logo-bank023.w36,
.logo-kcb10112.w36,
.logo-kcb10119.w36,
.logo-kcb20110.w36,
.logo-kcis0230.w36 {
    background-position: -14.4rem -14.4rem
}

.logo-bank023.w40,
.logo-kcb10112.w40,
.logo-kcb10119.w40,
.logo-kcb20110.w40,
.logo-kcis0230.w40 {
    background-position: -16rem -16rem
}

.logo-bank023.w44,
.logo-kcb10112.w44,
.logo-kcb10119.w44,
.logo-kcb20110.w44,
.logo-kcis0230.w44 {
    background-position: -17.6rem -17.6rem
}

.logo-bank023.w50,
.logo-kcb10112.w50,
.logo-kcb10119.w50,
.logo-kcb20110.w50,
.logo-kcis0230.w50 {
    background-position: -20rem -20rem
}

.logo-bank023.w52,
.logo-kcb10112.w52,
.logo-kcb10119.w52,
.logo-kcb20110.w52,
.logo-kcis0230.w52 {
    background-position: -20.8rem -20.8rem
}

.logo-bank023.w60,
.logo-kcb10112.w60,
.logo-kcb10119.w60,
.logo-kcb20110.w60,
.logo-kcis0230.w60 {
    background-position: -24rem -24rem
}

.logo-bank023.w64,
.logo-kcb10112.w64,
.logo-kcb10119.w64,
.logo-kcb20110.w64,
.logo-kcis0230.w64 {
    background-position: -25.6rem -25.6rem
}

.logo-bank023.w65,
.logo-kcb10112.w65,
.logo-kcb10119.w65,
.logo-kcb20110.w65,
.logo-kcis0230.w65 {
    background-position: -26rem -26rem
}

.logo-bank023.w72,
.logo-kcb10112.w72,
.logo-kcb10119.w72,
.logo-kcb20110.w72,
.logo-kcis0230.w72 {
    background-position: -28.8rem -28.8rem
}

/*! 한국씨티은행 */

.logo-bank027.w16,
.logo-kcb10116.w16,
.logo-kcb20114.w16,
.logo-kcis0270.w16 {
    background-position: -9.6rem 0
}

.logo-bank027.w20,
.logo-kcb10116.w20,
.logo-kcb20114.w20,
.logo-kcis0270.w20 {
    background-position: -12rem 0
}

.logo-bank027.w22,
.logo-kcb10116.w22,
.logo-kcb20114.w22,
.logo-kcis0270.w22 {
    background-position: -13.2rem 0
}

.logo-bank027.w24,
.logo-kcb10116.w24,
.logo-kcb20114.w24,
.logo-kcis0270.w24 {
    background-position: -14.4rem 0
}

.logo-bank027.w28,
.logo-kcb10116.w28,
.logo-kcb20114.w28,
.logo-kcis0270.w28 {
    background-position: -16.8rem 0
}

.logo-bank027.w30,
.logo-kcb10116.w30,
.logo-kcb20114.w30,
.logo-kcis0270.w30 {
    background-position: -18rem 0
}

.logo-bank027.w32,
.logo-kcb10116.w32,
.logo-kcb20114.w32,
.logo-kcis0270.w32 {
    background-position: -19.2rem 0
}

.logo-bank027.w34,
.logo-kcb10116.w34,
.logo-kcb20114.w34,
.logo-kcis0270.w34 {
    background-position: -20.4rem 0
}

.logo-bank027.w36,
.logo-kcb10116.w36,
.logo-kcb20114.w36,
.logo-kcis0270.w36 {
    background-position: -21.6rem 0
}

.logo-bank027.w40,
.logo-kcb10116.w40,
.logo-kcb20114.w40,
.logo-kcis0270.w40 {
    background-position: -24rem 0
}

.logo-bank027.w44,
.logo-kcb10116.w44,
.logo-kcb20114.w44,
.logo-kcis0270.w44 {
    background-position: -26.4rem 0
}

.logo-bank027.w50,
.logo-kcb10116.w50,
.logo-kcb20114.w50,
.logo-kcis0270.w50 {
    background-position: -30rem 0
}

.logo-bank027.w52,
.logo-kcb10116.w52,
.logo-kcb20114.w52,
.logo-kcis0270.w52 {
    background-position: -31.2rem 0
}

.logo-bank027.w60,
.logo-kcb10116.w60,
.logo-kcb20114.w60,
.logo-kcis0270.w60 {
    background-position: -36rem 0
}

.logo-bank027.w64,
.logo-kcb10116.w64,
.logo-kcb20114.w64,
.logo-kcis0270.w64 {
    background-position: -38.4rem 0
}

.logo-bank027.w65,
.logo-kcb10116.w65,
.logo-kcb20114.w65,
.logo-kcis0270.w65 {
    background-position: -39rem 0
}

.logo-bank027.w72,
.logo-kcb10116.w72,
.logo-kcb20114.w72,
.logo-kcis0270.w72 {
    background-position: -43.2rem 0
}

/*! 아이엠뱅크 */

.logo-bank031.w16,
.logo-kcb10106.w16,
.logo-kcb20105.w16,
.logo-kcis0310.w16 {
    background-position: -9.6rem -6.4rem
}

.logo-bank031.w20,
.logo-kcb10106.w20,
.logo-kcb20105.w20,
.logo-kcis0310.w20 {
    background-position: -12rem -8rem
}

.logo-bank031.w22,
.logo-kcb10106.w22,
.logo-kcb20105.w22,
.logo-kcis0310.w22 {
    background-position: -13.2rem -8.8rem
}

.logo-bank031.w24,
.logo-kcb10106.w24,
.logo-kcb20105.w24,
.logo-kcis0310.w24 {
    background-position: -14.4rem -9.6rem
}

.logo-bank031.w28,
.logo-kcb10106.w28,
.logo-kcb20105.w28,
.logo-kcis0310.w28 {
    background-position: -16.8rem -11.2rem
}

.logo-bank031.w30,
.logo-kcb10106.w30,
.logo-kcb20105.w30,
.logo-kcis0310.w30 {
    background-position: -18rem -12rem
}

.logo-bank031.w32,
.logo-kcb10106.w32,
.logo-kcb20105.w32,
.logo-kcis0310.w32 {
    background-position: -19.2rem -12.8rem
}

.logo-bank031.w34,
.logo-kcb10106.w34,
.logo-kcb20105.w34,
.logo-kcis0310.w34 {
    background-position: -20.4rem -13.6rem
}

.logo-bank031.w36,
.logo-kcb10106.w36,
.logo-kcb20105.w36,
.logo-kcis0310.w36 {
    background-position: -21.6rem -14.4rem
}

.logo-bank031.w40,
.logo-kcb10106.w40,
.logo-kcb20105.w40,
.logo-kcis0310.w40 {
    background-position: -24rem -16rem
}

.logo-bank031.w44,
.logo-kcb10106.w44,
.logo-kcb20105.w44,
.logo-kcis0310.w44 {
    background-position: -26.4rem -17.6rem
}

.logo-bank031.w50,
.logo-kcb10106.w50,
.logo-kcb20105.w50,
.logo-kcis0310.w50 {
    background-position: -30rem -20rem
}

.logo-bank031.w52,
.logo-kcb10106.w52,
.logo-kcb20105.w52,
.logo-kcis0310.w52 {
    background-position: -31.2rem -20.8rem
}

.logo-bank031.w60,
.logo-kcb10106.w60,
.logo-kcb20105.w60,
.logo-kcis0310.w60 {
    background-position: -36rem -24rem
}

.logo-bank031.w64,
.logo-kcb10106.w64,
.logo-kcb20105.w64,
.logo-kcis0310.w64 {
    background-position: -38.4rem -25.6rem
}

.logo-bank031.w65,
.logo-kcb10106.w65,
.logo-kcb20105.w65,
.logo-kcis0310.w65 {
    background-position: -39rem -26rem
}

.logo-bank031.w72,
.logo-kcb10106.w72,
.logo-kcb20105.w72,
.logo-kcis0310.w72 {
    background-position: -43.2rem -28.8rem
}

/*! 부산은행 */

.logo-bank032.w16,
.logo-kcb10107.w16,
.logo-kcb20106.w16,
.logo-kcb20319.w16,
.logo-kcb20507.w16,
.logo-kcis0320.w16 {
    background-position: 0 -9.6rem
}

.logo-bank032.w20,
.logo-kcb10107.w20,
.logo-kcb20106.w20,
.logo-kcb20319.w20,
.logo-kcb20507.w20,
.logo-kcis0320.w20 {
    background-position: 0 -12rem
}

.logo-bank032.w22,
.logo-kcb10107.w22,
.logo-kcb20106.w22,
.logo-kcb20319.w22,
.logo-kcb20507.w22,
.logo-kcis0320.w22 {
    background-position: 0 -13.2rem
}

.logo-bank032.w24,
.logo-kcb10107.w24,
.logo-kcb20106.w24,
.logo-kcb20319.w24,
.logo-kcb20507.w24,
.logo-kcis0320.w24 {
    background-position: 0 -14.4rem
}

.logo-bank032.w28,
.logo-kcb10107.w28,
.logo-kcb20106.w28,
.logo-kcb20319.w28,
.logo-kcb20507.w28,
.logo-kcis0320.w28 {
    background-position: 0 -16.8rem
}

.logo-bank032.w30,
.logo-kcb10107.w30,
.logo-kcb20106.w30,
.logo-kcb20319.w30,
.logo-kcb20507.w30,
.logo-kcis0320.w30 {
    background-position: 0 -18rem
}

.logo-bank032.w32,
.logo-kcb10107.w32,
.logo-kcb20106.w32,
.logo-kcb20319.w32,
.logo-kcb20507.w32,
.logo-kcis0320.w32 {
    background-position: 0 -19.2rem
}

.logo-bank032.w34,
.logo-kcb10107.w34,
.logo-kcb20106.w34,
.logo-kcb20319.w34,
.logo-kcb20507.w34,
.logo-kcis0320.w34 {
    background-position: 0 -20.4rem
}

.logo-bank032.w36,
.logo-kcb10107.w36,
.logo-kcb20106.w36,
.logo-kcb20319.w36,
.logo-kcb20507.w36,
.logo-kcis0320.w36 {
    background-position: 0 -21.6rem
}

.logo-bank032.w40,
.logo-kcb10107.w40,
.logo-kcb20106.w40,
.logo-kcb20319.w40,
.logo-kcb20507.w40,
.logo-kcis0320.w40 {
    background-position: 0 -24rem
}

.logo-bank032.w44,
.logo-kcb10107.w44,
.logo-kcb20106.w44,
.logo-kcb20319.w44,
.logo-kcb20507.w44,
.logo-kcis0320.w44 {
    background-position: 0 -26.4rem
}

.logo-bank032.w50,
.logo-kcb10107.w50,
.logo-kcb20106.w50,
.logo-kcb20319.w50,
.logo-kcb20507.w50,
.logo-kcis0320.w50 {
    background-position: 0 -30rem
}

.logo-bank032.w52,
.logo-kcb10107.w52,
.logo-kcb20106.w52,
.logo-kcb20319.w52,
.logo-kcb20507.w52,
.logo-kcis0320.w52 {
    background-position: 0 -31.2rem
}

.logo-bank032.w60,
.logo-kcb10107.w60,
.logo-kcb20106.w60,
.logo-kcb20319.w60,
.logo-kcb20507.w60,
.logo-kcis0320.w60 {
    background-position: 0 -36rem
}

.logo-bank032.w64,
.logo-kcb10107.w64,
.logo-kcb20106.w64,
.logo-kcb20319.w64,
.logo-kcb20507.w64,
.logo-kcis0320.w64 {
    background-position: 0 -38.4rem
}

.logo-bank032.w65,
.logo-kcb10107.w65,
.logo-kcb20106.w65,
.logo-kcb20319.w65,
.logo-kcb20507.w65,
.logo-kcis0320.w65 {
    background-position: 0 -39rem
}

.logo-bank032.w72,
.logo-kcb10107.w72,
.logo-kcb20106.w72,
.logo-kcb20319.w72,
.logo-kcb20507.w72,
.logo-kcis0320.w72 {
    background-position: 0 -43.2rem
}

/*! 광주은행 */

.logo-bank034.w16,
.logo-kcb10103.w16,
.logo-kcb20102.w16,
.logo-kcis0340.w16 {
    background-position: -3.2rem -9.6rem
}

.logo-bank034.w20,
.logo-kcb10103.w20,
.logo-kcb20102.w20,
.logo-kcis0340.w20 {
    background-position: -4rem -12rem
}

.logo-bank034.w22,
.logo-kcb10103.w22,
.logo-kcb20102.w22,
.logo-kcis0340.w22 {
    background-position: -4.4rem -13.2rem
}

.logo-bank034.w24,
.logo-kcb10103.w24,
.logo-kcb20102.w24,
.logo-kcis0340.w24 {
    background-position: -4.8rem -14.4rem
}

.logo-bank034.w28,
.logo-kcb10103.w28,
.logo-kcb20102.w28,
.logo-kcis0340.w28 {
    background-position: -5.6rem -16.8rem
}

.logo-bank034.w30,
.logo-kcb10103.w30,
.logo-kcb20102.w30,
.logo-kcis0340.w30 {
    background-position: -6rem -18rem
}

.logo-bank034.w32,
.logo-kcb10103.w32,
.logo-kcb20102.w32,
.logo-kcis0340.w32 {
    background-position: -6.4rem -19.2rem
}

.logo-bank034.w34,
.logo-kcb10103.w34,
.logo-kcb20102.w34,
.logo-kcis0340.w34 {
    background-position: -6.8rem -20.4rem
}

.logo-bank034.w36,
.logo-kcb10103.w36,
.logo-kcb20102.w36,
.logo-kcis0340.w36 {
    background-position: -7.2rem -21.6rem
}

.logo-bank034.w40,
.logo-kcb10103.w40,
.logo-kcb20102.w40,
.logo-kcis0340.w40 {
    background-position: -8rem -24rem
}

.logo-bank034.w44,
.logo-kcb10103.w44,
.logo-kcb20102.w44,
.logo-kcis0340.w44 {
    background-position: -8.8rem -26.4rem
}

.logo-bank034.w50,
.logo-kcb10103.w50,
.logo-kcb20102.w50,
.logo-kcis0340.w50 {
    background-position: -10rem -30rem
}

.logo-bank034.w52,
.logo-kcb10103.w52,
.logo-kcb20102.w52,
.logo-kcis0340.w52 {
    background-position: -10.4rem -31.2rem
}

.logo-bank034.w60,
.logo-kcb10103.w60,
.logo-kcb20102.w60,
.logo-kcis0340.w60 {
    background-position: -12rem -36rem
}

.logo-bank034.w64,
.logo-kcb10103.w64,
.logo-kcb20102.w64,
.logo-kcis0340.w64 {
    background-position: -12.8rem -38.4rem
}

.logo-bank034.w65,
.logo-kcb10103.w65,
.logo-kcb20102.w65,
.logo-kcis0340.w65 {
    background-position: -13rem -39rem
}

.logo-bank034.w72,
.logo-kcb10103.w72,
.logo-kcb20102.w72,
.logo-kcis0340.w72 {
    background-position: -14.4rem -43.2rem
}

/*! 제주은행 */

.logo-bank035.w16,
.logo-kcb10113.w16,
.logo-kcb20111.w16,
.logo-kcis0350.w16 {
    background-position: -6.4rem -9.6rem
}

.logo-bank035.w20,
.logo-kcb10113.w20,
.logo-kcb20111.w20,
.logo-kcis0350.w20 {
    background-position: -8rem -12rem
}

.logo-bank035.w22,
.logo-kcb10113.w22,
.logo-kcb20111.w22,
.logo-kcis0350.w22 {
    background-position: -8.8rem -13.2rem
}

.logo-bank035.w24,
.logo-kcb10113.w24,
.logo-kcb20111.w24,
.logo-kcis0350.w24 {
    background-position: -9.6rem -14.4rem
}

.logo-bank035.w28,
.logo-kcb10113.w28,
.logo-kcb20111.w28,
.logo-kcis0350.w28 {
    background-position: -11.2rem -16.8rem
}

.logo-bank035.w30,
.logo-kcb10113.w30,
.logo-kcb20111.w30,
.logo-kcis0350.w30 {
    background-position: -12rem -18rem
}

.logo-bank035.w32,
.logo-kcb10113.w32,
.logo-kcb20111.w32,
.logo-kcis0350.w32 {
    background-position: -12.8rem -19.2rem
}

.logo-bank035.w34,
.logo-kcb10113.w34,
.logo-kcb20111.w34,
.logo-kcis0350.w34 {
    background-position: -13.6rem -20.4rem
}

.logo-bank035.w36,
.logo-kcb10113.w36,
.logo-kcb20111.w36,
.logo-kcis0350.w36 {
    background-position: -14.4rem -21.6rem
}

.logo-bank035.w40,
.logo-kcb10113.w40,
.logo-kcb20111.w40,
.logo-kcis0350.w40 {
    background-position: -16rem -24rem
}

.logo-bank035.w44,
.logo-kcb10113.w44,
.logo-kcb20111.w44,
.logo-kcis0350.w44 {
    background-position: -17.6rem -26.4rem
}

.logo-bank035.w50,
.logo-kcb10113.w50,
.logo-kcb20111.w50,
.logo-kcis0350.w50 {
    background-position: -20rem -30rem
}

.logo-bank035.w52,
.logo-kcb10113.w52,
.logo-kcb20111.w52,
.logo-kcis0350.w52 {
    background-position: -20.8rem -31.2rem
}

.logo-bank035.w60,
.logo-kcb10113.w60,
.logo-kcb20111.w60,
.logo-kcis0350.w60 {
    background-position: -24rem -36rem
}

.logo-bank035.w64,
.logo-kcb10113.w64,
.logo-kcb20111.w64,
.logo-kcis0350.w64 {
    background-position: -25.6rem -38.4rem
}

.logo-bank035.w65,
.logo-kcb10113.w65,
.logo-kcb20111.w65,
.logo-kcis0350.w65 {
    background-position: -26rem -39rem
}

.logo-bank035.w72,
.logo-kcb10113.w72,
.logo-kcb20111.w72,
.logo-kcis0350.w72 {
    background-position: -28.8rem -43.2rem
}

/*! 전북은행 */

.logo-bank037.w16,
.logo-kcb10111.w16,
.logo-kcb20109.w16,
.logo-kcb20307.w16,
.logo-kcb20535.w16,
.logo-kcis0370.w16 {
    background-position: -9.6rem -9.6rem
}

.logo-bank037.w20,
.logo-kcb10111.w20,
.logo-kcb20109.w20,
.logo-kcb20307.w20,
.logo-kcb20535.w20,
.logo-kcis0370.w20 {
    background-position: -12rem -12rem
}

.logo-bank037.w22,
.logo-kcb10111.w22,
.logo-kcb20109.w22,
.logo-kcb20307.w22,
.logo-kcb20535.w22,
.logo-kcis0370.w22 {
    background-position: -13.2rem -13.2rem
}

.logo-bank037.w24,
.logo-kcb10111.w24,
.logo-kcb20109.w24,
.logo-kcb20307.w24,
.logo-kcb20535.w24,
.logo-kcis0370.w24 {
    background-position: -14.4rem -14.4rem
}

.logo-bank037.w28,
.logo-kcb10111.w28,
.logo-kcb20109.w28,
.logo-kcb20307.w28,
.logo-kcb20535.w28,
.logo-kcis0370.w28 {
    background-position: -16.8rem -16.8rem
}

.logo-bank037.w30,
.logo-kcb10111.w30,
.logo-kcb20109.w30,
.logo-kcb20307.w30,
.logo-kcb20535.w30,
.logo-kcis0370.w30 {
    background-position: -18rem -18rem
}

.logo-bank037.w32,
.logo-kcb10111.w32,
.logo-kcb20109.w32,
.logo-kcb20307.w32,
.logo-kcb20535.w32,
.logo-kcis0370.w32 {
    background-position: -19.2rem -19.2rem
}

.logo-bank037.w34,
.logo-kcb10111.w34,
.logo-kcb20109.w34,
.logo-kcb20307.w34,
.logo-kcb20535.w34,
.logo-kcis0370.w34 {
    background-position: -20.4rem -20.4rem
}

.logo-bank037.w36,
.logo-kcb10111.w36,
.logo-kcb20109.w36,
.logo-kcb20307.w36,
.logo-kcb20535.w36,
.logo-kcis0370.w36 {
    background-position: -21.6rem -21.6rem
}

.logo-bank037.w40,
.logo-kcb10111.w40,
.logo-kcb20109.w40,
.logo-kcb20307.w40,
.logo-kcb20535.w40,
.logo-kcis0370.w40 {
    background-position: -24rem -24rem
}

.logo-bank037.w44,
.logo-kcb10111.w44,
.logo-kcb20109.w44,
.logo-kcb20307.w44,
.logo-kcb20535.w44,
.logo-kcis0370.w44 {
    background-position: -26.4rem -26.4rem
}

.logo-bank037.w50,
.logo-kcb10111.w50,
.logo-kcb20109.w50,
.logo-kcb20307.w50,
.logo-kcb20535.w50,
.logo-kcis0370.w50 {
    background-position: -30rem -30rem
}

.logo-bank037.w52,
.logo-kcb10111.w52,
.logo-kcb20109.w52,
.logo-kcb20307.w52,
.logo-kcb20535.w52,
.logo-kcis0370.w52 {
    background-position: -31.2rem -31.2rem
}

.logo-bank037.w60,
.logo-kcb10111.w60,
.logo-kcb20109.w60,
.logo-kcb20307.w60,
.logo-kcb20535.w60,
.logo-kcis0370.w60 {
    background-position: -36rem -36rem
}

.logo-bank037.w64,
.logo-kcb10111.w64,
.logo-kcb20109.w64,
.logo-kcb20307.w64,
.logo-kcb20535.w64,
.logo-kcis0370.w64 {
    background-position: -38.4rem -38.4rem
}

.logo-bank037.w65,
.logo-kcb10111.w65,
.logo-kcb20109.w65,
.logo-kcb20307.w65,
.logo-kcb20535.w65,
.logo-kcis0370.w65 {
    background-position: -39rem -39rem
}

.logo-bank037.w72,
.logo-kcb10111.w72,
.logo-kcb20109.w72,
.logo-kcb20307.w72,
.logo-kcb20535.w72,
.logo-kcis0370.w72 {
    background-position: -43.2rem -43.2rem
}

/*! 경남은행 */

.logo-bank039.w16,
.logo-kcb10102.w16,
.logo-kcb20101.w16,
.logo-kcis0390.w16 {
    background-position: -12.8rem 0
}

.logo-bank039.w20,
.logo-kcb10102.w20,
.logo-kcb20101.w20,
.logo-kcis0390.w20 {
    background-position: -16rem 0
}

.logo-bank039.w22,
.logo-kcb10102.w22,
.logo-kcb20101.w22,
.logo-kcis0390.w22 {
    background-position: -17.6rem 0
}

.logo-bank039.w24,
.logo-kcb10102.w24,
.logo-kcb20101.w24,
.logo-kcis0390.w24 {
    background-position: -19.2rem 0
}

.logo-bank039.w28,
.logo-kcb10102.w28,
.logo-kcb20101.w28,
.logo-kcis0390.w28 {
    background-position: -22.4rem 0
}

.logo-bank039.w30,
.logo-kcb10102.w30,
.logo-kcb20101.w30,
.logo-kcis0390.w30 {
    background-position: -24rem 0
}

.logo-bank039.w32,
.logo-kcb10102.w32,
.logo-kcb20101.w32,
.logo-kcis0390.w32 {
    background-position: -25.6rem 0
}

.logo-bank039.w34,
.logo-kcb10102.w34,
.logo-kcb20101.w34,
.logo-kcis0390.w34 {
    background-position: -27.2rem 0
}

.logo-bank039.w36,
.logo-kcb10102.w36,
.logo-kcb20101.w36,
.logo-kcis0390.w36 {
    background-position: -28.8rem 0
}

.logo-bank039.w40,
.logo-kcb10102.w40,
.logo-kcb20101.w40,
.logo-kcis0390.w40 {
    background-position: -32rem 0
}

.logo-bank039.w44,
.logo-kcb10102.w44,
.logo-kcb20101.w44,
.logo-kcis0390.w44 {
    background-position: -35.2rem 0
}

.logo-bank039.w50,
.logo-kcb10102.w50,
.logo-kcb20101.w50,
.logo-kcis0390.w50 {
    background-position: -40rem 0
}

.logo-bank039.w52,
.logo-kcb10102.w52,
.logo-kcb20101.w52,
.logo-kcis0390.w52 {
    background-position: -41.6rem 0
}

.logo-bank039.w60,
.logo-kcb10102.w60,
.logo-kcb20101.w60,
.logo-kcis0390.w60 {
    background-position: -48rem 0
}

.logo-bank039.w64,
.logo-kcb10102.w64,
.logo-kcb20101.w64,
.logo-kcis0390.w64 {
    background-position: -51.2rem 0
}

.logo-bank039.w65,
.logo-kcb10102.w65,
.logo-kcb20101.w65,
.logo-kcis0390.w65 {
    background-position: -52rem 0
}

.logo-bank039.w72,
.logo-kcb10102.w72,
.logo-kcb20101.w72,
.logo-kcis0390.w72 {
    background-position: -57.6rem 0
}

/*! 새마을금고중앙회 */

.logo-bank045.w16,
.logo-kcb20120.w16,
.logo-kcb20126.w16,
.logo-kcb20604.w16,
.logo-kcis8000.w16 {
    background-position: 0 -12.8rem
}

.logo-bank045.w20,
.logo-kcb20120.w20,
.logo-kcb20126.w20,
.logo-kcb20604.w20,
.logo-kcis8000.w20 {
    background-position: 0 -16rem
}

.logo-bank045.w22,
.logo-kcb20120.w22,
.logo-kcb20126.w22,
.logo-kcb20604.w22,
.logo-kcis8000.w22 {
    background-position: 0 -17.6rem
}

.logo-bank045.w24,
.logo-kcb20120.w24,
.logo-kcb20126.w24,
.logo-kcb20604.w24,
.logo-kcis8000.w24 {
    background-position: 0 -19.2rem
}

.logo-bank045.w28,
.logo-kcb20120.w28,
.logo-kcb20126.w28,
.logo-kcb20604.w28,
.logo-kcis8000.w28 {
    background-position: 0 -22.4rem
}

.logo-bank045.w30,
.logo-kcb20120.w30,
.logo-kcb20126.w30,
.logo-kcb20604.w30,
.logo-kcis8000.w30 {
    background-position: 0 -24rem
}

.logo-bank045.w32,
.logo-kcb20120.w32,
.logo-kcb20126.w32,
.logo-kcb20604.w32,
.logo-kcis8000.w32 {
    background-position: 0 -25.6rem
}

.logo-bank045.w34,
.logo-kcb20120.w34,
.logo-kcb20126.w34,
.logo-kcb20604.w34,
.logo-kcis8000.w34 {
    background-position: 0 -27.2rem
}

.logo-bank045.w36,
.logo-kcb20120.w36,
.logo-kcb20126.w36,
.logo-kcb20604.w36,
.logo-kcis8000.w36 {
    background-position: 0 -28.8rem
}

.logo-bank045.w40,
.logo-kcb20120.w40,
.logo-kcb20126.w40,
.logo-kcb20604.w40,
.logo-kcis8000.w40 {
    background-position: 0 -32rem
}

.logo-bank045.w44,
.logo-kcb20120.w44,
.logo-kcb20126.w44,
.logo-kcb20604.w44,
.logo-kcis8000.w44 {
    background-position: 0 -35.2rem
}

.logo-bank045.w50,
.logo-kcb20120.w50,
.logo-kcb20126.w50,
.logo-kcb20604.w50,
.logo-kcis8000.w50 {
    background-position: 0 -40rem
}

.logo-bank045.w52,
.logo-kcb20120.w52,
.logo-kcb20126.w52,
.logo-kcb20604.w52,
.logo-kcis8000.w52 {
    background-position: 0 -41.6rem
}

.logo-bank045.w60,
.logo-kcb20120.w60,
.logo-kcb20126.w60,
.logo-kcb20604.w60,
.logo-kcis8000.w60 {
    background-position: 0 -48rem
}

.logo-bank045.w64,
.logo-kcb20120.w64,
.logo-kcb20126.w64,
.logo-kcb20604.w64,
.logo-kcis8000.w64 {
    background-position: 0 -51.2rem
}

.logo-bank045.w65,
.logo-kcb20120.w65,
.logo-kcb20126.w65,
.logo-kcb20604.w65,
.logo-kcis8000.w65 {
    background-position: 0 -52rem
}

.logo-bank045.w72,
.logo-kcb20120.w72,
.logo-kcb20126.w72,
.logo-kcb20604.w72,
.logo-kcis8000.w72 {
    background-position: 0 -57.6rem
}

/*! 신협중앙회 */

.logo-bank048.w16,
.logo-kcb20119.w16,
.logo-kcb20603.w16,
.logo-kcis7000.w16 {
    background-position: -3.2rem -12.8rem
}

.logo-bank048.w20,
.logo-kcb20119.w20,
.logo-kcb20603.w20,
.logo-kcis7000.w20 {
    background-position: -4rem -16rem
}

.logo-bank048.w22,
.logo-kcb20119.w22,
.logo-kcb20603.w22,
.logo-kcis7000.w22 {
    background-position: -4.4rem -17.6rem
}

.logo-bank048.w24,
.logo-kcb20119.w24,
.logo-kcb20603.w24,
.logo-kcis7000.w24 {
    background-position: -4.8rem -19.2rem
}

.logo-bank048.w28,
.logo-kcb20119.w28,
.logo-kcb20603.w28,
.logo-kcis7000.w28 {
    background-position: -5.6rem -22.4rem
}

.logo-bank048.w30,
.logo-kcb20119.w30,
.logo-kcb20603.w30,
.logo-kcis7000.w30 {
    background-position: -6rem -24rem
}

.logo-bank048.w32,
.logo-kcb20119.w32,
.logo-kcb20603.w32,
.logo-kcis7000.w32 {
    background-position: -6.4rem -25.6rem
}

.logo-bank048.w34,
.logo-kcb20119.w34,
.logo-kcb20603.w34,
.logo-kcis7000.w34 {
    background-position: -6.8rem -27.2rem
}

.logo-bank048.w36,
.logo-kcb20119.w36,
.logo-kcb20603.w36,
.logo-kcis7000.w36 {
    background-position: -7.2rem -28.8rem
}

.logo-bank048.w40,
.logo-kcb20119.w40,
.logo-kcb20603.w40,
.logo-kcis7000.w40 {
    background-position: -8rem -32rem
}

.logo-bank048.w44,
.logo-kcb20119.w44,
.logo-kcb20603.w44,
.logo-kcis7000.w44 {
    background-position: -8.8rem -35.2rem
}

.logo-bank048.w50,
.logo-kcb20119.w50,
.logo-kcb20603.w50,
.logo-kcis7000.w50 {
    background-position: -10rem -40rem
}

.logo-bank048.w52,
.logo-kcb20119.w52,
.logo-kcb20603.w52,
.logo-kcis7000.w52 {
    background-position: -10.4rem -41.6rem
}

.logo-bank048.w60,
.logo-kcb20119.w60,
.logo-kcb20603.w60,
.logo-kcis7000.w60 {
    background-position: -12rem -48rem
}

.logo-bank048.w64,
.logo-kcb20119.w64,
.logo-kcb20603.w64,
.logo-kcis7000.w64 {
    background-position: -12.8rem -51.2rem
}

.logo-bank048.w65,
.logo-kcb20119.w65,
.logo-kcb20603.w65,
.logo-kcis7000.w65 {
    background-position: -13rem -52rem
}

.logo-bank048.w72,
.logo-kcb20119.w72,
.logo-kcb20603.w72,
.logo-kcis7000.w72 {
    background-position: -14.4rem -57.6rem
}

/*! 저축은행중앙회 */

.logo-bank050.w16 {
    background-position: -6.4rem -12.8rem
}

.logo-bank050.w20 {
    background-position: -8rem -16rem
}

.logo-bank050.w22 {
    background-position: -8.8rem -17.6rem
}

.logo-bank050.w24 {
    background-position: -9.6rem -19.2rem
}

.logo-bank050.w28 {
    background-position: -11.2rem -22.4rem
}

.logo-bank050.w30 {
    background-position: -12rem -24rem
}

.logo-bank050.w32 {
    background-position: -12.8rem -25.6rem
}

.logo-bank050.w34 {
    background-position: -13.6rem -27.2rem
}

.logo-bank050.w36 {
    background-position: -14.4rem -28.8rem
}

.logo-bank050.w40 {
    background-position: -16rem -32rem
}

.logo-bank050.w44 {
    background-position: -17.6rem -35.2rem
}

.logo-bank050.w50 {
    background-position: -20rem -40rem
}

.logo-bank050.w52 {
    background-position: -20.8rem -41.6rem
}

.logo-bank050.w60 {
    background-position: -24rem -48rem
}

.logo-bank050.w64 {
    background-position: -25.6rem -51.2rem
}

.logo-bank050.w65 {
    background-position: -26rem -52rem
}

.logo-bank050.w72 {
    background-position: -28.8rem -57.6rem
}

/*! HSBC */

.logo-bank054.w16,
.logo-kcis0540.w16 {
    background-position: -32rem -6.4rem
}

.logo-bank054.w20,
.logo-kcis0540.w20 {
    background-position: -40rem -8rem
}

.logo-bank054.w22,
.logo-kcis0540.w22 {
    background-position: -44rem -8.8rem
}

.logo-bank054.w24,
.logo-kcis0540.w24 {
    background-position: -48rem -9.6rem
}

.logo-bank054.w28,
.logo-kcis0540.w28 {
    background-position: -56rem -11.2rem
}

.logo-bank054.w30,
.logo-kcis0540.w30 {
    background-position: -60rem -12rem
}

.logo-bank054.w32,
.logo-kcis0540.w32 {
    background-position: -64rem -12.8rem
}

.logo-bank054.w34,
.logo-kcis0540.w34 {
    background-position: -68rem -13.6rem
}

.logo-bank054.w36,
.logo-kcis0540.w36 {
    background-position: -72rem -14.4rem
}

.logo-bank054.w40,
.logo-kcis0540.w40 {
    background-position: -80rem -16rem
}

.logo-bank054.w44,
.logo-kcis0540.w44 {
    background-position: -88rem -17.6rem
}

.logo-bank054.w50,
.logo-kcis0540.w50 {
    background-position: -100rem -20rem
}

.logo-bank054.w52,
.logo-kcis0540.w52 {
    background-position: -104rem -20.8rem
}

.logo-bank054.w60,
.logo-kcis0540.w60 {
    background-position: -120rem -24rem
}

.logo-bank054.w64,
.logo-kcis0540.w64 {
    background-position: -128rem -25.6rem
}

.logo-bank054.w65,
.logo-kcis0540.w65 {
    background-position: -130rem -26rem
}

.logo-bank054.w72,
.logo-kcis0540.w72 {
    background-position: -144rem -28.8rem
}

/*! 도이치 */

.logo-bank055.w16,
.logo-kcis0550.w16 {
    background-position: -32rem -9.6rem
}

.logo-bank055.w20,
.logo-kcis0550.w20 {
    background-position: -40rem -12rem
}

.logo-bank055.w22,
.logo-kcis0550.w22 {
    background-position: -44rem -13.2rem
}

.logo-bank055.w24,
.logo-kcis0550.w24 {
    background-position: -48rem -14.4rem
}

.logo-bank055.w28,
.logo-kcis0550.w28 {
    background-position: -56rem -16.8rem
}

.logo-bank055.w30,
.logo-kcis0550.w30 {
    background-position: -60rem -18rem
}

.logo-bank055.w32,
.logo-kcis0550.w32 {
    background-position: -64rem -19.2rem
}

.logo-bank055.w34,
.logo-kcis0550.w34 {
    background-position: -68rem -20.4rem
}

.logo-bank055.w36,
.logo-kcis0550.w36 {
    background-position: -72rem -21.6rem
}

.logo-bank055.w40,
.logo-kcis0550.w40 {
    background-position: -80rem -24rem
}

.logo-bank055.w44,
.logo-kcis0550.w44 {
    background-position: -88rem -26.4rem
}

.logo-bank055.w50,
.logo-kcis0550.w50 {
    background-position: -100rem -30rem
}

.logo-bank055.w52,
.logo-kcis0550.w52 {
    background-position: -104rem -31.2rem
}

.logo-bank055.w60,
.logo-kcis0550.w60 {
    background-position: -120rem -36rem
}

.logo-bank055.w64,
.logo-kcis0550.w64 {
    background-position: -128rem -38.4rem
}

.logo-bank055.w65,
.logo-kcis0550.w65 {
    background-position: -130rem -39rem
}

.logo-bank055.w72,
.logo-kcis0550.w72 {
    background-position: -144rem -43.2rem
}

/*! JP모간 */

.logo-bank057.w16,
.logo-kcis0570.w16 {
    background-position: -32rem -12.8rem
}

.logo-bank057.w20,
.logo-kcis0570.w20 {
    background-position: -40rem -16rem
}

.logo-bank057.w22,
.logo-kcis0570.w22 {
    background-position: -44rem -17.6rem
}

.logo-bank057.w24,
.logo-kcis0570.w24 {
    background-position: -48rem -19.2rem
}

.logo-bank057.w28,
.logo-kcis0570.w28 {
    background-position: -56rem -22.4rem
}

.logo-bank057.w30,
.logo-kcis0570.w30 {
    background-position: -60rem -24rem
}

.logo-bank057.w32,
.logo-kcis0570.w32 {
    background-position: -64rem -25.6rem
}

.logo-bank057.w34,
.logo-kcis0570.w34 {
    background-position: -68rem -27.2rem
}

.logo-bank057.w36,
.logo-kcis0570.w36 {
    background-position: -72rem -28.8rem
}

.logo-bank057.w40,
.logo-kcis0570.w40 {
    background-position: -80rem -32rem
}

.logo-bank057.w44,
.logo-kcis0570.w44 {
    background-position: -88rem -35.2rem
}

.logo-bank057.w50,
.logo-kcis0570.w50 {
    background-position: -100rem -40rem
}

.logo-bank057.w52,
.logo-kcis0570.w52 {
    background-position: -104rem -41.6rem
}

.logo-bank057.w60,
.logo-kcis0570.w60 {
    background-position: -120rem -48rem
}

.logo-bank057.w64,
.logo-kcis0570.w64 {
    background-position: -128rem -51.2rem
}

.logo-bank057.w65,
.logo-kcis0570.w65 {
    background-position: -130rem -52rem
}

.logo-bank057.w72,
.logo-kcis0570.w72 {
    background-position: -144rem -57.6rem
}

/*! BOA */

.logo-bank060.w16,
.logo-kcis0600.w16 {
    background-position: -32rem -16rem
}

.logo-bank060.w20,
.logo-kcis0600.w20 {
    background-position: -40rem -20rem
}

.logo-bank060.w22,
.logo-kcis0600.w22 {
    background-position: -44rem -22rem
}

.logo-bank060.w24,
.logo-kcis0600.w24 {
    background-position: -48rem -24rem
}

.logo-bank060.w28,
.logo-kcis0600.w28 {
    background-position: -56rem -28rem
}

.logo-bank060.w30,
.logo-kcis0600.w30 {
    background-position: -60rem -30rem
}

.logo-bank060.w32,
.logo-kcis0600.w32 {
    background-position: -64rem -32rem
}

.logo-bank060.w34,
.logo-kcis0600.w34 {
    background-position: -68rem -34rem
}

.logo-bank060.w36,
.logo-kcis0600.w36 {
    background-position: -72rem -36rem
}

.logo-bank060.w40,
.logo-kcis0600.w40 {
    background-position: -80rem -40rem
}

.logo-bank060.w44,
.logo-kcis0600.w44 {
    background-position: -88rem -44rem
}

.logo-bank060.w50,
.logo-kcis0600.w50 {
    background-position: -100rem -50rem
}

.logo-bank060.w52,
.logo-kcis0600.w52 {
    background-position: -104rem -52rem
}

.logo-bank060.w60,
.logo-kcis0600.w60 {
    background-position: -120rem -60rem
}

.logo-bank060.w64,
.logo-kcis0600.w64 {
    background-position: -128rem -64rem
}

.logo-bank060.w65,
.logo-kcis0600.w65 {
    background-position: -130rem -65rem
}

.logo-bank060.w72,
.logo-kcis0600.w72 {
    background-position: -144rem -72rem
}

/*! BNP파리바 */

.logo-bank061.w16,
.logo-kcis0610.w16 {
    background-position: -32rem -19.2rem
}

.logo-bank061.w20,
.logo-kcis0610.w20 {
    background-position: -40rem -24rem
}

.logo-bank061.w22,
.logo-kcis0610.w22 {
    background-position: -44rem -26.4rem
}

.logo-bank061.w24,
.logo-kcis0610.w24 {
    background-position: -48rem -28.8rem
}

.logo-bank061.w28,
.logo-kcis0610.w28 {
    background-position: -56rem -33.6rem
}

.logo-bank061.w30,
.logo-kcis0610.w30 {
    background-position: -60rem -36rem
}

.logo-bank061.w32,
.logo-kcis0610.w32 {
    background-position: -64rem -38.4rem
}

.logo-bank061.w34,
.logo-kcis0610.w34 {
    background-position: -68rem -40.8rem
}

.logo-bank061.w36,
.logo-kcis0610.w36 {
    background-position: -72rem -43.2rem
}

.logo-bank061.w40,
.logo-kcis0610.w40 {
    background-position: -80rem -48rem
}

.logo-bank061.w44,
.logo-kcis0610.w44 {
    background-position: -88rem -52.8rem
}

.logo-bank061.w50,
.logo-kcis0610.w50 {
    background-position: -100rem -60rem
}

.logo-bank061.w52,
.logo-kcis0610.w52 {
    background-position: -104rem -62.4rem
}

.logo-bank061.w60,
.logo-kcis0610.w60 {
    background-position: -120rem -72rem
}

.logo-bank061.w64,
.logo-kcis0610.w64 {
    background-position: -128rem -76.8rem
}

.logo-bank061.w65,
.logo-kcis0610.w65 {
    background-position: -130rem -78rem
}

.logo-bank061.w72,
.logo-kcis0610.w72 {
    background-position: -144rem -86.4rem
}

/*! 중국공상 */

.logo-bank062.w16,
.logo-kcis0621.w16 {
    background-position: -32rem -22.4rem
}

.logo-bank062.w20,
.logo-kcis0621.w20 {
    background-position: -40rem -28rem
}

.logo-bank062.w22,
.logo-kcis0621.w22 {
    background-position: -44rem -30.8rem
}

.logo-bank062.w24,
.logo-kcis0621.w24 {
    background-position: -48rem -33.6rem
}

.logo-bank062.w28,
.logo-kcis0621.w28 {
    background-position: -56rem -39.2rem
}

.logo-bank062.w30,
.logo-kcis0621.w30 {
    background-position: -60rem -42rem
}

.logo-bank062.w32,
.logo-kcis0621.w32 {
    background-position: -64rem -44.8rem
}

.logo-bank062.w34,
.logo-kcis0621.w34 {
    background-position: -68rem -47.6rem
}

.logo-bank062.w36,
.logo-kcis0621.w36 {
    background-position: -72rem -50.4rem
}

.logo-bank062.w40,
.logo-kcis0621.w40 {
    background-position: -80rem -56rem
}

.logo-bank062.w44,
.logo-kcis0621.w44 {
    background-position: -88rem -61.6rem
}

.logo-bank062.w50,
.logo-kcis0621.w50 {
    background-position: -100rem -70rem
}

.logo-bank062.w52,
.logo-kcis0621.w52 {
    background-position: -104rem -72.8rem
}

.logo-bank062.w60,
.logo-kcis0621.w60 {
    background-position: -120rem -84rem
}

.logo-bank062.w64,
.logo-kcis0621.w64 {
    background-position: -128rem -89.6rem
}

.logo-bank062.w65,
.logo-kcis0621.w65 {
    background-position: -130rem -91rem
}

.logo-bank062.w72,
.logo-kcis0621.w72 {
    background-position: -144rem -100.8rem
}

/*! 중국은행 */

.logo-bank063.w16,
.logo-kcis0630.w16 {
    background-position: -32rem -25.6rem
}

.logo-bank063.w20,
.logo-kcis0630.w20 {
    background-position: -40rem -32rem
}

.logo-bank063.w22,
.logo-kcis0630.w22 {
    background-position: -44rem -35.2rem
}

.logo-bank063.w24,
.logo-kcis0630.w24 {
    background-position: -48rem -38.4rem
}

.logo-bank063.w28,
.logo-kcis0630.w28 {
    background-position: -56rem -44.8rem
}

.logo-bank063.w30,
.logo-kcis0630.w30 {
    background-position: -60rem -48rem
}

.logo-bank063.w32,
.logo-kcis0630.w32 {
    background-position: -64rem -51.2rem
}

.logo-bank063.w34,
.logo-kcis0630.w34 {
    background-position: -68rem -54.4rem
}

.logo-bank063.w36,
.logo-kcis0630.w36 {
    background-position: -72rem -57.6rem
}

.logo-bank063.w40,
.logo-kcis0630.w40 {
    background-position: -80rem -64rem
}

.logo-bank063.w44,
.logo-kcis0630.w44 {
    background-position: -88rem -70.4rem
}

.logo-bank063.w50,
.logo-kcis0630.w50 {
    background-position: -100rem -80rem
}

.logo-bank063.w52,
.logo-kcis0630.w52 {
    background-position: -104rem -83.2rem
}

.logo-bank063.w60,
.logo-kcis0630.w60 {
    background-position: -120rem -96rem
}

.logo-bank063.w64,
.logo-kcis0630.w64 {
    background-position: -128rem -102.4rem
}

.logo-bank063.w65,
.logo-kcis0630.w65 {
    background-position: -130rem -104rem
}

.logo-bank063.w72,
.logo-kcis0630.w72 {
    background-position: -144rem -115.2rem
}

/*! 산림조합중앙회 */

.logo-bank064.w16,
.logo-kcb20602.w16,
.logo-kcis5010.w16 {
    background-position: -32rem -28.8rem
}

.logo-bank064.w20,
.logo-kcb20602.w20,
.logo-kcis5010.w20 {
    background-position: -40rem -36rem
}

.logo-bank064.w22,
.logo-kcb20602.w22,
.logo-kcis5010.w22 {
    background-position: -44rem -39.6rem
}

.logo-bank064.w24,
.logo-kcb20602.w24,
.logo-kcis5010.w24 {
    background-position: -48rem -43.2rem
}

.logo-bank064.w28,
.logo-kcb20602.w28,
.logo-kcis5010.w28 {
    background-position: -56rem -50.4rem
}

.logo-bank064.w30,
.logo-kcb20602.w30,
.logo-kcis5010.w30 {
    background-position: -60rem -54rem
}

.logo-bank064.w32,
.logo-kcb20602.w32,
.logo-kcis5010.w32 {
    background-position: -64rem -57.6rem
}

.logo-bank064.w34,
.logo-kcb20602.w34,
.logo-kcis5010.w34 {
    background-position: -68rem -61.2rem
}

.logo-bank064.w36,
.logo-kcb20602.w36,
.logo-kcis5010.w36 {
    background-position: -72rem -64.8rem
}

.logo-bank064.w40,
.logo-kcb20602.w40,
.logo-kcis5010.w40 {
    background-position: -80rem -72rem
}

.logo-bank064.w44,
.logo-kcb20602.w44,
.logo-kcis5010.w44 {
    background-position: -88rem -79.2rem
}

.logo-bank064.w50,
.logo-kcb20602.w50,
.logo-kcis5010.w50 {
    background-position: -100rem -90rem
}

.logo-bank064.w52,
.logo-kcb20602.w52,
.logo-kcis5010.w52 {
    background-position: -104rem -93.6rem
}

.logo-bank064.w60,
.logo-kcb20602.w60,
.logo-kcis5010.w60 {
    background-position: -120rem -108rem
}

.logo-bank064.w64,
.logo-kcb20602.w64,
.logo-kcis5010.w64 {
    background-position: -128rem -115.2rem
}

.logo-bank064.w65,
.logo-kcb20602.w65,
.logo-kcis5010.w65 {
    background-position: -130rem -117rem
}

.logo-bank064.w72,
.logo-kcb20602.w72,
.logo-kcis5010.w72 {
    background-position: -144rem -129.6rem
}

/*! 중국건설 */

.logo-bank067.w16 {
    background-position: 0 -32rem
}

.logo-bank067.w20 {
    background-position: 0 -40rem
}

.logo-bank067.w22 {
    background-position: 0 -44rem
}

.logo-bank067.w24 {
    background-position: 0 -48rem
}

.logo-bank067.w28 {
    background-position: 0 -56rem
}

.logo-bank067.w30 {
    background-position: 0 -60rem
}

.logo-bank067.w32 {
    background-position: 0 -64rem
}

.logo-bank067.w34 {
    background-position: 0 -68rem
}

.logo-bank067.w36 {
    background-position: 0 -72rem
}

.logo-bank067.w40 {
    background-position: 0 -80rem
}

.logo-bank067.w44 {
    background-position: 0 -88rem
}

.logo-bank067.w50 {
    background-position: 0 -100rem
}

.logo-bank067.w52 {
    background-position: 0 -104rem
}

.logo-bank067.w60 {
    background-position: 0 -120rem
}

.logo-bank067.w64 {
    background-position: 0 -128rem
}

.logo-bank067.w65 {
    background-position: 0 -130rem
}

.logo-bank067.w72 {
    background-position: 0 -144rem
}

/*! 우정사업본부 */

.logo-bank071.w16,
.logo-kcb20121.w16,
.logo-kcb30101.w16,
.logo-kcis0710.w16 {
    background-position: -3.2rem -32rem
}

.logo-bank071.w20,
.logo-kcb20121.w20,
.logo-kcb30101.w20,
.logo-kcis0710.w20 {
    background-position: -4rem -40rem
}

.logo-bank071.w22,
.logo-kcb20121.w22,
.logo-kcb30101.w22,
.logo-kcis0710.w22 {
    background-position: -4.4rem -44rem
}

.logo-bank071.w24,
.logo-kcb20121.w24,
.logo-kcb30101.w24,
.logo-kcis0710.w24 {
    background-position: -4.8rem -48rem
}

.logo-bank071.w28,
.logo-kcb20121.w28,
.logo-kcb30101.w28,
.logo-kcis0710.w28 {
    background-position: -5.6rem -56rem
}

.logo-bank071.w30,
.logo-kcb20121.w30,
.logo-kcb30101.w30,
.logo-kcis0710.w30 {
    background-position: -6rem -60rem
}

.logo-bank071.w32,
.logo-kcb20121.w32,
.logo-kcb30101.w32,
.logo-kcis0710.w32 {
    background-position: -6.4rem -64rem
}

.logo-bank071.w34,
.logo-kcb20121.w34,
.logo-kcb30101.w34,
.logo-kcis0710.w34 {
    background-position: -6.8rem -68rem
}

.logo-bank071.w36,
.logo-kcb20121.w36,
.logo-kcb30101.w36,
.logo-kcis0710.w36 {
    background-position: -7.2rem -72rem
}

.logo-bank071.w40,
.logo-kcb20121.w40,
.logo-kcb30101.w40,
.logo-kcis0710.w40 {
    background-position: -8rem -80rem
}

.logo-bank071.w44,
.logo-kcb20121.w44,
.logo-kcb30101.w44,
.logo-kcis0710.w44 {
    background-position: -8.8rem -88rem
}

.logo-bank071.w50,
.logo-kcb20121.w50,
.logo-kcb30101.w50,
.logo-kcis0710.w50 {
    background-position: -10rem -100rem
}

.logo-bank071.w52,
.logo-kcb20121.w52,
.logo-kcb30101.w52,
.logo-kcis0710.w52 {
    background-position: -10.4rem -104rem
}

.logo-bank071.w60,
.logo-kcb20121.w60,
.logo-kcb30101.w60,
.logo-kcis0710.w60 {
    background-position: -12rem -120rem
}

.logo-bank071.w64,
.logo-kcb20121.w64,
.logo-kcb30101.w64,
.logo-kcis0710.w64 {
    background-position: -12.8rem -128rem
}

.logo-bank071.w65,
.logo-kcb20121.w65,
.logo-kcb30101.w65,
.logo-kcis0710.w65 {
    background-position: -13rem -130rem
}

.logo-bank071.w72,
.logo-kcb20121.w72,
.logo-kcb30101.w72,
.logo-kcis0710.w72 {
    background-position: -14.4rem -144rem
}

/*! 하나은행 */

.logo-bank081.w16,
.logo-kcb10115.w16,
.logo-kcb20113.w16,
.logo-kcb20309.w16,
.logo-kcb20506.w16,
.logo-kcis0810.w16 {
    background-position: -6.4rem -32rem
}

.logo-bank081.w20,
.logo-kcb10115.w20,
.logo-kcb20113.w20,
.logo-kcb20309.w20,
.logo-kcb20506.w20,
.logo-kcis0810.w20 {
    background-position: -8rem -40rem
}

.logo-bank081.w22,
.logo-kcb10115.w22,
.logo-kcb20113.w22,
.logo-kcb20309.w22,
.logo-kcb20506.w22,
.logo-kcis0810.w22 {
    background-position: -8.8rem -44rem
}

.logo-bank081.w24,
.logo-kcb10115.w24,
.logo-kcb20113.w24,
.logo-kcb20309.w24,
.logo-kcb20506.w24,
.logo-kcis0810.w24 {
    background-position: -9.6rem -48rem
}

.logo-bank081.w28,
.logo-kcb10115.w28,
.logo-kcb20113.w28,
.logo-kcb20309.w28,
.logo-kcb20506.w28,
.logo-kcis0810.w28 {
    background-position: -11.2rem -56rem
}

.logo-bank081.w30,
.logo-kcb10115.w30,
.logo-kcb20113.w30,
.logo-kcb20309.w30,
.logo-kcb20506.w30,
.logo-kcis0810.w30 {
    background-position: -12rem -60rem
}

.logo-bank081.w32,
.logo-kcb10115.w32,
.logo-kcb20113.w32,
.logo-kcb20309.w32,
.logo-kcb20506.w32,
.logo-kcis0810.w32 {
    background-position: -12.8rem -64rem
}

.logo-bank081.w34,
.logo-kcb10115.w34,
.logo-kcb20113.w34,
.logo-kcb20309.w34,
.logo-kcb20506.w34,
.logo-kcis0810.w34 {
    background-position: -13.6rem -68rem
}

.logo-bank081.w36,
.logo-kcb10115.w36,
.logo-kcb20113.w36,
.logo-kcb20309.w36,
.logo-kcb20506.w36,
.logo-kcis0810.w36 {
    background-position: -14.4rem -72rem
}

.logo-bank081.w40,
.logo-kcb10115.w40,
.logo-kcb20113.w40,
.logo-kcb20309.w40,
.logo-kcb20506.w40,
.logo-kcis0810.w40 {
    background-position: -16rem -80rem
}

.logo-bank081.w44,
.logo-kcb10115.w44,
.logo-kcb20113.w44,
.logo-kcb20309.w44,
.logo-kcb20506.w44,
.logo-kcis0810.w44 {
    background-position: -17.6rem -88rem
}

.logo-bank081.w50,
.logo-kcb10115.w50,
.logo-kcb20113.w50,
.logo-kcb20309.w50,
.logo-kcb20506.w50,
.logo-kcis0810.w50 {
    background-position: -20rem -100rem
}

.logo-bank081.w52,
.logo-kcb10115.w52,
.logo-kcb20113.w52,
.logo-kcb20309.w52,
.logo-kcb20506.w52,
.logo-kcis0810.w52 {
    background-position: -20.8rem -104rem
}

.logo-bank081.w60,
.logo-kcb10115.w60,
.logo-kcb20113.w60,
.logo-kcb20309.w60,
.logo-kcb20506.w60,
.logo-kcis0810.w60 {
    background-position: -24rem -120rem
}

.logo-bank081.w64,
.logo-kcb10115.w64,
.logo-kcb20113.w64,
.logo-kcb20309.w64,
.logo-kcb20506.w64,
.logo-kcis0810.w64 {
    background-position: -25.6rem -128rem
}

.logo-bank081.w65,
.logo-kcb10115.w65,
.logo-kcb20113.w65,
.logo-kcb20309.w65,
.logo-kcb20506.w65,
.logo-kcis0810.w65 {
    background-position: -26rem -130rem
}

.logo-bank081.w72,
.logo-kcb10115.w72,
.logo-kcb20113.w72,
.logo-kcb20309.w72,
.logo-kcb20506.w72,
.logo-kcis0810.w72 {
    background-position: -28.8rem -144rem
}

/*! 신한은행 */

.logo-bank088.w16,
.logo-kcb10109.w16,
.logo-kcb20118.w16,
.logo-kcb20204.w16,
.logo-kcb20306.w16,
.logo-kcb20405.w16,
.logo-kcb20504.w16,
.logo-kcis0260.w16 {
    background-position: -9.6rem -32rem
}

.logo-bank088.w20,
.logo-kcb10109.w20,
.logo-kcb20118.w20,
.logo-kcb20204.w20,
.logo-kcb20306.w20,
.logo-kcb20405.w20,
.logo-kcb20504.w20,
.logo-kcis0260.w20 {
    background-position: -12rem -40rem
}

.logo-bank088.w22,
.logo-kcb10109.w22,
.logo-kcb20118.w22,
.logo-kcb20204.w22,
.logo-kcb20306.w22,
.logo-kcb20405.w22,
.logo-kcb20504.w22,
.logo-kcis0260.w22 {
    background-position: -13.2rem -44rem
}

.logo-bank088.w24,
.logo-kcb10109.w24,
.logo-kcb20118.w24,
.logo-kcb20204.w24,
.logo-kcb20306.w24,
.logo-kcb20405.w24,
.logo-kcb20504.w24,
.logo-kcis0260.w24 {
    background-position: -14.4rem -48rem
}

.logo-bank088.w28,
.logo-kcb10109.w28,
.logo-kcb20118.w28,
.logo-kcb20204.w28,
.logo-kcb20306.w28,
.logo-kcb20405.w28,
.logo-kcb20504.w28,
.logo-kcis0260.w28 {
    background-position: -16.8rem -56rem
}

.logo-bank088.w30,
.logo-kcb10109.w30,
.logo-kcb20118.w30,
.logo-kcb20204.w30,
.logo-kcb20306.w30,
.logo-kcb20405.w30,
.logo-kcb20504.w30,
.logo-kcis0260.w30 {
    background-position: -18rem -60rem
}

.logo-bank088.w32,
.logo-kcb10109.w32,
.logo-kcb20118.w32,
.logo-kcb20204.w32,
.logo-kcb20306.w32,
.logo-kcb20405.w32,
.logo-kcb20504.w32,
.logo-kcis0260.w32 {
    background-position: -19.2rem -64rem
}

.logo-bank088.w34,
.logo-kcb10109.w34,
.logo-kcb20118.w34,
.logo-kcb20204.w34,
.logo-kcb20306.w34,
.logo-kcb20405.w34,
.logo-kcb20504.w34,
.logo-kcis0260.w34 {
    background-position: -20.4rem -68rem
}

.logo-bank088.w36,
.logo-kcb10109.w36,
.logo-kcb20118.w36,
.logo-kcb20204.w36,
.logo-kcb20306.w36,
.logo-kcb20405.w36,
.logo-kcb20504.w36,
.logo-kcis0260.w36 {
    background-position: -21.6rem -72rem
}

.logo-bank088.w40,
.logo-kcb10109.w40,
.logo-kcb20118.w40,
.logo-kcb20204.w40,
.logo-kcb20306.w40,
.logo-kcb20405.w40,
.logo-kcb20504.w40,
.logo-kcis0260.w40 {
    background-position: -24rem -80rem
}

.logo-bank088.w44,
.logo-kcb10109.w44,
.logo-kcb20118.w44,
.logo-kcb20204.w44,
.logo-kcb20306.w44,
.logo-kcb20405.w44,
.logo-kcb20504.w44,
.logo-kcis0260.w44 {
    background-position: -26.4rem -88rem
}

.logo-bank088.w50,
.logo-kcb10109.w50,
.logo-kcb20118.w50,
.logo-kcb20204.w50,
.logo-kcb20306.w50,
.logo-kcb20405.w50,
.logo-kcb20504.w50,
.logo-kcis0260.w50 {
    background-position: -30rem -100rem
}

.logo-bank088.w52,
.logo-kcb10109.w52,
.logo-kcb20118.w52,
.logo-kcb20204.w52,
.logo-kcb20306.w52,
.logo-kcb20405.w52,
.logo-kcb20504.w52,
.logo-kcis0260.w52 {
    background-position: -31.2rem -104rem
}

.logo-bank088.w60,
.logo-kcb10109.w60,
.logo-kcb20118.w60,
.logo-kcb20204.w60,
.logo-kcb20306.w60,
.logo-kcb20405.w60,
.logo-kcb20504.w60,
.logo-kcis0260.w60 {
    background-position: -36rem -120rem
}

.logo-bank088.w64,
.logo-kcb10109.w64,
.logo-kcb20118.w64,
.logo-kcb20204.w64,
.logo-kcb20306.w64,
.logo-kcb20405.w64,
.logo-kcb20504.w64,
.logo-kcis0260.w64 {
    background-position: -38.4rem -128rem
}

.logo-bank088.w65,
.logo-kcb10109.w65,
.logo-kcb20118.w65,
.logo-kcb20204.w65,
.logo-kcb20306.w65,
.logo-kcb20405.w65,
.logo-kcb20504.w65,
.logo-kcis0260.w65 {
    background-position: -39rem -130rem
}

.logo-bank088.w72,
.logo-kcb10109.w72,
.logo-kcb20118.w72,
.logo-kcb20204.w72,
.logo-kcb20306.w72,
.logo-kcb20405.w72,
.logo-kcb20504.w72,
.logo-kcis0260.w72 {
    background-position: -43.2rem -144rem
}

/*! 케이뱅크 */

.logo-bank089.w16,
.logo-kcb10117.w16,
.logo-kcb20122.w16,
.logo-kcis0890.w16 {
    background-position: -12.8rem -32rem
}

.logo-bank089.w20,
.logo-kcb10117.w20,
.logo-kcb20122.w20,
.logo-kcis0890.w20 {
    background-position: -16rem -40rem
}

.logo-bank089.w22,
.logo-kcb10117.w22,
.logo-kcb20122.w22,
.logo-kcis0890.w22 {
    background-position: -17.6rem -44rem
}

.logo-bank089.w24,
.logo-kcb10117.w24,
.logo-kcb20122.w24,
.logo-kcis0890.w24 {
    background-position: -19.2rem -48rem
}

.logo-bank089.w28,
.logo-kcb10117.w28,
.logo-kcb20122.w28,
.logo-kcis0890.w28 {
    background-position: -22.4rem -56rem
}

.logo-bank089.w30,
.logo-kcb10117.w30,
.logo-kcb20122.w30,
.logo-kcis0890.w30 {
    background-position: -24rem -60rem
}

.logo-bank089.w32,
.logo-kcb10117.w32,
.logo-kcb20122.w32,
.logo-kcis0890.w32 {
    background-position: -25.6rem -64rem
}

.logo-bank089.w34,
.logo-kcb10117.w34,
.logo-kcb20122.w34,
.logo-kcis0890.w34 {
    background-position: -27.2rem -68rem
}

.logo-bank089.w36,
.logo-kcb10117.w36,
.logo-kcb20122.w36,
.logo-kcis0890.w36 {
    background-position: -28.8rem -72rem
}

.logo-bank089.w40,
.logo-kcb10117.w40,
.logo-kcb20122.w40,
.logo-kcis0890.w40 {
    background-position: -32rem -80rem
}

.logo-bank089.w44,
.logo-kcb10117.w44,
.logo-kcb20122.w44,
.logo-kcis0890.w44 {
    background-position: -35.2rem -88rem
}

.logo-bank089.w50,
.logo-kcb10117.w50,
.logo-kcb20122.w50,
.logo-kcis0890.w50 {
    background-position: -40rem -100rem
}

.logo-bank089.w52,
.logo-kcb10117.w52,
.logo-kcb20122.w52,
.logo-kcis0890.w52 {
    background-position: -41.6rem -104rem
}

.logo-bank089.w60,
.logo-kcb10117.w60,
.logo-kcb20122.w60,
.logo-kcis0890.w60 {
    background-position: -48rem -120rem
}

.logo-bank089.w64,
.logo-kcb10117.w64,
.logo-kcb20122.w64,
.logo-kcis0890.w64 {
    background-position: -51.2rem -128rem
}

.logo-bank089.w65,
.logo-kcb10117.w65,
.logo-kcb20122.w65,
.logo-kcis0890.w65 {
    background-position: -52rem -130rem
}

.logo-bank089.w72,
.logo-kcb10117.w72,
.logo-kcb20122.w72,
.logo-kcis0890.w72 {
    background-position: -57.6rem -144rem
}

/*! 카카오뱅크 */

.logo-bank090.w16,
.logo-kcb10118.w16,
.logo-kcb20123.w16,
.logo-kcis0900.w16 {
    background-position: -16rem -32rem
}

.logo-bank090.w20,
.logo-kcb10118.w20,
.logo-kcb20123.w20,
.logo-kcis0900.w20 {
    background-position: -20rem -40rem
}

.logo-bank090.w22,
.logo-kcb10118.w22,
.logo-kcb20123.w22,
.logo-kcis0900.w22 {
    background-position: -22rem -44rem
}

.logo-bank090.w24,
.logo-kcb10118.w24,
.logo-kcb20123.w24,
.logo-kcis0900.w24 {
    background-position: -24rem -48rem
}

.logo-bank090.w28,
.logo-kcb10118.w28,
.logo-kcb20123.w28,
.logo-kcis0900.w28 {
    background-position: -28rem -56rem
}

.logo-bank090.w30,
.logo-kcb10118.w30,
.logo-kcb20123.w30,
.logo-kcis0900.w30 {
    background-position: -30rem -60rem
}

.logo-bank090.w32,
.logo-kcb10118.w32,
.logo-kcb20123.w32,
.logo-kcis0900.w32 {
    background-position: -32rem -64rem
}

.logo-bank090.w34,
.logo-kcb10118.w34,
.logo-kcb20123.w34,
.logo-kcis0900.w34 {
    background-position: -34rem -68rem
}

.logo-bank090.w36,
.logo-kcb10118.w36,
.logo-kcb20123.w36,
.logo-kcis0900.w36 {
    background-position: -36rem -72rem
}

.logo-bank090.w40,
.logo-kcb10118.w40,
.logo-kcb20123.w40,
.logo-kcis0900.w40 {
    background-position: -40rem -80rem
}

.logo-bank090.w44,
.logo-kcb10118.w44,
.logo-kcb20123.w44,
.logo-kcis0900.w44 {
    background-position: -44rem -88rem
}

.logo-bank090.w50,
.logo-kcb10118.w50,
.logo-kcb20123.w50,
.logo-kcis0900.w50 {
    background-position: -50rem -100rem
}

.logo-bank090.w52,
.logo-kcb10118.w52,
.logo-kcb20123.w52,
.logo-kcis0900.w52 {
    background-position: -52rem -104rem
}

.logo-bank090.w60,
.logo-kcb10118.w60,
.logo-kcb20123.w60,
.logo-kcis0900.w60 {
    background-position: -60rem -120rem
}

.logo-bank090.w64,
.logo-kcb10118.w64,
.logo-kcb20123.w64,
.logo-kcis0900.w64 {
    background-position: -64rem -128rem
}

.logo-bank090.w65,
.logo-kcb10118.w65,
.logo-kcb20123.w65,
.logo-kcis0900.w65 {
    background-position: -65rem -130rem
}

.logo-bank090.w72,
.logo-kcb10118.w72,
.logo-kcb20123.w72,
.logo-kcis0900.w72 {
    background-position: -72rem -144rem
}

/*! 토스뱅크 */

.logo-bank092.w16,
.logo-kcb10120.w16,
.logo-kcb20125.w16,
.logo-kcis0920.w16 {
    background-position: -22.4rem -32rem
}

.logo-bank092.w20,
.logo-kcb10120.w20,
.logo-kcb20125.w20,
.logo-kcis0920.w20 {
    background-position: -28rem -40rem
}

.logo-bank092.w22,
.logo-kcb10120.w22,
.logo-kcb20125.w22,
.logo-kcis0920.w22 {
    background-position: -30.8rem -44rem
}

.logo-bank092.w24,
.logo-kcb10120.w24,
.logo-kcb20125.w24,
.logo-kcis0920.w24 {
    background-position: -33.6rem -48rem
}

.logo-bank092.w28,
.logo-kcb10120.w28,
.logo-kcb20125.w28,
.logo-kcis0920.w28 {
    background-position: -39.2rem -56rem
}

.logo-bank092.w30,
.logo-kcb10120.w30,
.logo-kcb20125.w30,
.logo-kcis0920.w30 {
    background-position: -42rem -60rem
}

.logo-bank092.w32,
.logo-kcb10120.w32,
.logo-kcb20125.w32,
.logo-kcis0920.w32 {
    background-position: -44.8rem -64rem
}

.logo-bank092.w34,
.logo-kcb10120.w34,
.logo-kcb20125.w34,
.logo-kcis0920.w34 {
    background-position: -47.6rem -68rem
}

.logo-bank092.w36,
.logo-kcb10120.w36,
.logo-kcb20125.w36,
.logo-kcis0920.w36 {
    background-position: -50.4rem -72rem
}

.logo-bank092.w40,
.logo-kcb10120.w40,
.logo-kcb20125.w40,
.logo-kcis0920.w40 {
    background-position: -56rem -80rem
}

.logo-bank092.w44,
.logo-kcb10120.w44,
.logo-kcb20125.w44,
.logo-kcis0920.w44 {
    background-position: -61.6rem -88rem
}

.logo-bank092.w50,
.logo-kcb10120.w50,
.logo-kcb20125.w50,
.logo-kcis0920.w50 {
    background-position: -70rem -100rem
}

.logo-bank092.w52,
.logo-kcb10120.w52,
.logo-kcb20125.w52,
.logo-kcis0920.w52 {
    background-position: -72.8rem -104rem
}

.logo-bank092.w60,
.logo-kcb10120.w60,
.logo-kcb20125.w60,
.logo-kcis0920.w60 {
    background-position: -84rem -120rem
}

.logo-bank092.w64,
.logo-kcb10120.w64,
.logo-kcb20125.w64,
.logo-kcis0920.w64 {
    background-position: -89.6rem -128rem
}

.logo-bank092.w65,
.logo-kcb10120.w65,
.logo-kcb20125.w65,
.logo-kcis0920.w65 {
    background-position: -91rem -130rem
}

.logo-bank092.w72,
.logo-kcb10120.w72,
.logo-kcb20125.w72,
.logo-kcis0920.w72 {
    background-position: -100.8rem -144rem
}

/*! CHPFMTASK-2105 서민금융진흥원 */

.logo-bank091.w16 {
    background-position: -19.2rem -32rem
}

.logo-bank091.w20 {
    background-position: -24rem -40rem
}

.logo-bank091.w22 {
    background-position: -26.4rem -44rem
}

.logo-bank091.w24 {
    background-position: -28.8rem -48rem
}

.logo-bank091.w28 {
    background-position: -33.6rem -56rem
}

.logo-bank091.w30 {
    background-position: -36rem -60rem
}

.logo-bank091.w32 {
    background-position: -38.4rem -64rem
}

.logo-bank091.w34 {
    background-position: -40.8rem -68rem
}

.logo-bank091.w36 {
    background-position: -43.2rem -72rem
}

.logo-bank091.w40 {
    background-position: -48rem -80rem
}

.logo-bank091.w44 {
    background-position: -52.8rem -88rem
}

.logo-bank091.w50 {
    background-position: -60rem -100rem
}

.logo-bank091.w52 {
    background-position: -62.4rem -104rem
}

.logo-bank091.w60 {
    background-position: -72rem -120rem
}

.logo-bank091.w64 {
    background-position: -76.8rem -128rem
}

.logo-bank091.w65 {
    background-position: -78rem -130rem
}

.logo-bank091.w72 {
    background-position: -86.4rem -144rem
}

/*! CHPFMTASK-2030 */

.logo-bank050687.w16 {
    background-position: -32rem -3.2rem
}

.logo-bank050687.w20 {
    background-position: -40rem -4rem
}

.logo-bank050687.w22 {
    background-position: -44rem -4.4rem
}

.logo-bank050687.w24 {
    background-position: -48rem -4.8rem
}

.logo-bank050687.w28 {
    background-position: -56rem -5.6rem
}

.logo-bank050687.w30 {
    background-position: -60rem -6rem
}

.logo-bank050687.w32 {
    background-position: -64rem -6.4rem
}

.logo-bank050687.w34 {
    background-position: -68rem -6.8rem
}

.logo-bank050687.w36 {
    background-position: -72rem -7.2rem
}

.logo-bank050687.w40 {
    background-position: -80rem -8rem
}

.logo-bank050687.w44 {
    background-position: -88rem -8.8rem
}

.logo-bank050687.w50 {
    background-position: -100rem -10rem
}

.logo-bank050687.w52 {
    background-position: -104rem -10.4rem
}

.logo-bank050687.w60 {
    background-position: -120rem -12rem
}

.logo-bank050687.w64 {
    background-position: -128rem -12.8rem
}

.logo-bank050687.w65 {
    background-position: -130rem -13rem
}

.logo-bank050687.w72 {
    background-position: -144rem -14.4rem
}

/*! CHPFMTASK-2030 */

/*! CHPFMTASK-2030 */

/*! CHPFMTASK-2374 */

/*! CHPFMTASK-2559 */

/*! component element icon 금투사 (총 28개) ======================================== */

/*! 유안타증권 */

.logo-bank209.w16,
.logo-kcis3250.w16 {
    background-position: -25.6rem -32rem
}

.logo-bank209.w20,
.logo-kcis3250.w20 {
    background-position: -32rem -40rem
}

.logo-bank209.w22,
.logo-kcis3250.w22 {
    background-position: -35.2rem -44rem
}

.logo-bank209.w24,
.logo-kcis3250.w24 {
    background-position: -38.4rem -48rem
}

.logo-bank209.w28,
.logo-kcis3250.w28 {
    background-position: -44.8rem -56rem
}

.logo-bank209.w30,
.logo-kcis3250.w30 {
    background-position: -48rem -60rem
}

.logo-bank209.w32,
.logo-kcis3250.w32 {
    background-position: -51.2rem -64rem
}

.logo-bank209.w34,
.logo-kcis3250.w34 {
    background-position: -54.4rem -68rem
}

.logo-bank209.w36,
.logo-kcis3250.w36 {
    background-position: -57.6rem -72rem
}

.logo-bank209.w40,
.logo-kcis3250.w40 {
    background-position: -64rem -80rem
}

.logo-bank209.w44,
.logo-kcis3250.w44 {
    background-position: -70.4rem -88rem
}

.logo-bank209.w50,
.logo-kcis3250.w50 {
    background-position: -80rem -100rem
}

.logo-bank209.w52,
.logo-kcis3250.w52 {
    background-position: -83.2rem -104rem
}

.logo-bank209.w60,
.logo-kcis3250.w60 {
    background-position: -96rem -120rem
}

.logo-bank209.w64,
.logo-kcis3250.w64 {
    background-position: -102.4rem -128rem
}

.logo-bank209.w65,
.logo-kcis3250.w65 {
    background-position: -104rem -130rem
}

.logo-bank209.w72,
.logo-kcis3250.w72 {
    background-position: -115.2rem -144rem
}

/*! KB증권 */

.logo-bank218.w16,
.logo-kcis3110.w16 {
    background-position: -28.8rem -32rem
}

.logo-bank218.w20,
.logo-kcis3110.w20 {
    background-position: -36rem -40rem
}

.logo-bank218.w22,
.logo-kcis3110.w22 {
    background-position: -39.6rem -44rem
}

.logo-bank218.w24,
.logo-kcis3110.w24 {
    background-position: -43.2rem -48rem
}

.logo-bank218.w28,
.logo-kcis3110.w28 {
    background-position: -50.4rem -56rem
}

.logo-bank218.w30,
.logo-kcis3110.w30 {
    background-position: -54rem -60rem
}

.logo-bank218.w32,
.logo-kcis3110.w32 {
    background-position: -57.6rem -64rem
}

.logo-bank218.w34,
.logo-kcis3110.w34 {
    background-position: -61.2rem -68rem
}

.logo-bank218.w36,
.logo-kcis3110.w36 {
    background-position: -64.8rem -72rem
}

.logo-bank218.w40,
.logo-kcis3110.w40 {
    background-position: -72rem -80rem
}

.logo-bank218.w44,
.logo-kcis3110.w44 {
    background-position: -79.2rem -88rem
}

.logo-bank218.w50,
.logo-kcis3110.w50 {
    background-position: -90rem -100rem
}

.logo-bank218.w52,
.logo-kcis3110.w52 {
    background-position: -93.6rem -104rem
}

.logo-bank218.w60,
.logo-kcis3110.w60 {
    background-position: -108rem -120rem
}

.logo-bank218.w64,
.logo-kcis3110.w64 {
    background-position: -115.2rem -128rem
}

.logo-bank218.w65,
.logo-kcis3110.w65 {
    background-position: -117rem -130rem
}

.logo-bank218.w72,
.logo-kcis3110.w72 {
    background-position: -129.6rem -144rem
}

/*! 상상인증권 */

.logo-bank221.w16,
.logo-kcis3410.w16 {
    background-position: -32rem -32rem
}

.logo-bank221.w20,
.logo-kcis3410.w20 {
    background-position: -40rem -40rem
}

.logo-bank221.w22,
.logo-kcis3410.w22 {
    background-position: -44rem -44rem
}

.logo-bank221.w24,
.logo-kcis3410.w24 {
    background-position: -48rem -48rem
}

.logo-bank221.w28,
.logo-kcis3410.w28 {
    background-position: -56rem -56rem
}

.logo-bank221.w30,
.logo-kcis3410.w30 {
    background-position: -60rem -60rem
}

.logo-bank221.w32,
.logo-kcis3410.w32 {
    background-position: -64rem -64rem
}

.logo-bank221.w34,
.logo-kcis3410.w34 {
    background-position: -68rem -68rem
}

.logo-bank221.w36,
.logo-kcis3410.w36 {
    background-position: -72rem -72rem
}

.logo-bank221.w40,
.logo-kcis3410.w40 {
    background-position: -80rem -80rem
}

.logo-bank221.w44,
.logo-kcis3410.w44 {
    background-position: -88rem -88rem
}

.logo-bank221.w50,
.logo-kcis3410.w50 {
    background-position: -100rem -100rem
}

.logo-bank221.w52,
.logo-kcis3410.w52 {
    background-position: -104rem -104rem
}

.logo-bank221.w60,
.logo-kcis3410.w60 {
    background-position: -120rem -120rem
}

.logo-bank221.w64,
.logo-kcis3410.w64 {
    background-position: -128rem -128rem
}

.logo-bank221.w65,
.logo-kcis3410.w65 {
    background-position: -130rem -130rem
}

.logo-bank221.w72,
.logo-kcis3410.w72 {
    background-position: -144rem -144rem
}

/*! BNK투자증권 */

.logo-bank224.w16,
.logo-kcis4580.w16 {
    background-position: -35.2rem 0
}

.logo-bank224.w20,
.logo-kcis4580.w20 {
    background-position: -44rem 0
}

.logo-bank224.w22,
.logo-kcis4580.w22 {
    background-position: -48.4rem 0
}

.logo-bank224.w24,
.logo-kcis4580.w24 {
    background-position: -52.8rem 0
}

.logo-bank224.w28,
.logo-kcis4580.w28 {
    background-position: -61.6rem 0
}

.logo-bank224.w30,
.logo-kcis4580.w30 {
    background-position: -66rem 0
}

.logo-bank224.w32,
.logo-kcis4580.w32 {
    background-position: -70.4rem 0
}

.logo-bank224.w34,
.logo-kcis4580.w34 {
    background-position: -74.8rem 0
}

.logo-bank224.w36,
.logo-kcis4580.w36 {
    background-position: -79.2rem 0
}

.logo-bank224.w40,
.logo-kcis4580.w40 {
    background-position: -88rem 0
}

.logo-bank224.w44,
.logo-kcis4580.w44 {
    background-position: -96.8rem 0
}

.logo-bank224.w50,
.logo-kcis4580.w50 {
    background-position: -110rem 0
}

.logo-bank224.w52,
.logo-kcis4580.w52 {
    background-position: -114.4rem 0
}

.logo-bank224.w60,
.logo-kcis4580.w60 {
    background-position: -132rem 0
}

.logo-bank224.w64,
.logo-kcis4580.w64 {
    background-position: -140.8rem 0
}

.logo-bank224.w65,
.logo-kcis4580.w65 {
    background-position: -143rem 0
}

.logo-bank224.w72,
.logo-kcis4580.w72 {
    background-position: -158.4rem 0
}

/*! IBK투자증권 */

.logo-bank225.w16,
.logo-kcis4540.w16 {
    background-position: -35.2rem -3.2rem
}

.logo-bank225.w20,
.logo-kcis4540.w20 {
    background-position: -44rem -4rem
}

.logo-bank225.w22,
.logo-kcis4540.w22 {
    background-position: -48.4rem -4.4rem
}

.logo-bank225.w24,
.logo-kcis4540.w24 {
    background-position: -52.8rem -4.8rem
}

.logo-bank225.w28,
.logo-kcis4540.w28 {
    background-position: -61.6rem -5.6rem
}

.logo-bank225.w30,
.logo-kcis4540.w30 {
    background-position: -66rem -6rem
}

.logo-bank225.w32,
.logo-kcis4540.w32 {
    background-position: -70.4rem -6.4rem
}

.logo-bank225.w34,
.logo-kcis4540.w34 {
    background-position: -74.8rem -6.8rem
}

.logo-bank225.w36,
.logo-kcis4540.w36 {
    background-position: -79.2rem -7.2rem
}

.logo-bank225.w40,
.logo-kcis4540.w40 {
    background-position: -88rem -8rem
}

.logo-bank225.w44,
.logo-kcis4540.w44 {
    background-position: -96.8rem -8.8rem
}

.logo-bank225.w50,
.logo-kcis4540.w50 {
    background-position: -110rem -10rem
}

.logo-bank225.w52,
.logo-kcis4540.w52 {
    background-position: -114.4rem -10.4rem
}

.logo-bank225.w60,
.logo-kcis4540.w60 {
    background-position: -132rem -12rem
}

.logo-bank225.w64,
.logo-kcis4540.w64 {
    background-position: -140.8rem -12.8rem
}

.logo-bank225.w65,
.logo-kcis4540.w65 {
    background-position: -143rem -13rem
}

.logo-bank225.w72,
.logo-kcis4540.w72 {
    background-position: -158.4rem -14.4rem
}

/*! 다올투자증권 ㅣ 다올저축은행 로고 같이 사용 */

.logo-bank050048.w16,
.logo-bank227.w16,
.logo-kcb20549.w16,
.logo-kcis4560.w16,
.logo-kcis6048.w16 {
    background-position: -35.2rem -6.4rem
}

.logo-bank050048.w20,
.logo-bank227.w20,
.logo-kcb20549.w20,
.logo-kcis4560.w20,
.logo-kcis6048.w20 {
    background-position: -44rem -8rem
}

.logo-bank050048.w22,
.logo-bank227.w22,
.logo-kcb20549.w22,
.logo-kcis4560.w22,
.logo-kcis6048.w22 {
    background-position: -48.4rem -8.8rem
}

.logo-bank050048.w24,
.logo-bank227.w24,
.logo-kcb20549.w24,
.logo-kcis4560.w24,
.logo-kcis6048.w24 {
    background-position: -52.8rem -9.6rem
}

.logo-bank050048.w28,
.logo-bank227.w28,
.logo-kcb20549.w28,
.logo-kcis4560.w28,
.logo-kcis6048.w28 {
    background-position: -61.6rem -11.2rem
}

.logo-bank050048.w30,
.logo-bank227.w30,
.logo-kcb20549.w30,
.logo-kcis4560.w30,
.logo-kcis6048.w30 {
    background-position: -66rem -12rem
}

.logo-bank050048.w32,
.logo-bank227.w32,
.logo-kcb20549.w32,
.logo-kcis4560.w32,
.logo-kcis6048.w32 {
    background-position: -70.4rem -12.8rem
}

.logo-bank050048.w34,
.logo-bank227.w34,
.logo-kcb20549.w34,
.logo-kcis4560.w34,
.logo-kcis6048.w34 {
    background-position: -74.8rem -13.6rem
}

.logo-bank050048.w36,
.logo-bank227.w36,
.logo-kcb20549.w36,
.logo-kcis4560.w36,
.logo-kcis6048.w36 {
    background-position: -79.2rem -14.4rem
}

.logo-bank050048.w40,
.logo-bank227.w40,
.logo-kcb20549.w40,
.logo-kcis4560.w40,
.logo-kcis6048.w40 {
    background-position: -88rem -16rem
}

.logo-bank050048.w44,
.logo-bank227.w44,
.logo-kcb20549.w44,
.logo-kcis4560.w44,
.logo-kcis6048.w44 {
    background-position: -96.8rem -17.6rem
}

.logo-bank050048.w50,
.logo-bank227.w50,
.logo-kcb20549.w50,
.logo-kcis4560.w50,
.logo-kcis6048.w50 {
    background-position: -110rem -20rem
}

.logo-bank050048.w52,
.logo-bank227.w52,
.logo-kcb20549.w52,
.logo-kcis4560.w52,
.logo-kcis6048.w52 {
    background-position: -114.4rem -20.8rem
}

.logo-bank050048.w60,
.logo-bank227.w60,
.logo-kcb20549.w60,
.logo-kcis4560.w60,
.logo-kcis6048.w60 {
    background-position: -132rem -24rem
}

.logo-bank050048.w64,
.logo-bank227.w64,
.logo-kcb20549.w64,
.logo-kcis4560.w64,
.logo-kcis6048.w64 {
    background-position: -140.8rem -25.6rem
}

.logo-bank050048.w65,
.logo-bank227.w65,
.logo-kcb20549.w65,
.logo-kcis4560.w65,
.logo-kcis6048.w65 {
    background-position: -143rem -26rem
}

.logo-bank050048.w72,
.logo-bank227.w72,
.logo-kcb20549.w72,
.logo-kcis4560.w72,
.logo-kcis6048.w72 {
    background-position: -158.4rem -28.8rem
}

/*! 미래에셋증권 */

.logo-bank238.w16,
.logo-kcis3210.w16 {
    background-position: -35.2rem -9.6rem
}

.logo-bank238.w20,
.logo-kcis3210.w20 {
    background-position: -44rem -12rem
}

.logo-bank238.w22,
.logo-kcis3210.w22 {
    background-position: -48.4rem -13.2rem
}

.logo-bank238.w24,
.logo-kcis3210.w24 {
    background-position: -52.8rem -14.4rem
}

.logo-bank238.w28,
.logo-kcis3210.w28 {
    background-position: -61.6rem -16.8rem
}

.logo-bank238.w30,
.logo-kcis3210.w30 {
    background-position: -66rem -18rem
}

.logo-bank238.w32,
.logo-kcis3210.w32 {
    background-position: -70.4rem -19.2rem
}

.logo-bank238.w34,
.logo-kcis3210.w34 {
    background-position: -74.8rem -20.4rem
}

.logo-bank238.w36,
.logo-kcis3210.w36 {
    background-position: -79.2rem -21.6rem
}

.logo-bank238.w40,
.logo-kcis3210.w40 {
    background-position: -88rem -24rem
}

.logo-bank238.w44,
.logo-kcis3210.w44 {
    background-position: -96.8rem -26.4rem
}

.logo-bank238.w50,
.logo-kcis3210.w50 {
    background-position: -110rem -30rem
}

.logo-bank238.w52,
.logo-kcis3210.w52 {
    background-position: -114.4rem -31.2rem
}

.logo-bank238.w60,
.logo-kcis3210.w60 {
    background-position: -132rem -36rem
}

.logo-bank238.w64,
.logo-kcis3210.w64 {
    background-position: -140.8rem -38.4rem
}

.logo-bank238.w65,
.logo-kcis3210.w65 {
    background-position: -143rem -39rem
}

.logo-bank238.w72,
.logo-kcis3210.w72 {
    background-position: -158.4rem -43.2rem
}

/*! 삼성증권 */

.logo-bank240.w16,
.logo-kcb20203.w16,
.logo-kcb20404.w16,
.logo-kcb20411.w16,
.logo-kcis3310.w16 {
    background-position: -35.2rem -12.8rem
}

.logo-bank240.w20,
.logo-kcb20203.w20,
.logo-kcb20404.w20,
.logo-kcb20411.w20,
.logo-kcis3310.w20 {
    background-position: -44rem -16rem
}

.logo-bank240.w22,
.logo-kcb20203.w22,
.logo-kcb20404.w22,
.logo-kcb20411.w22,
.logo-kcis3310.w22 {
    background-position: -48.4rem -17.6rem
}

.logo-bank240.w24,
.logo-kcb20203.w24,
.logo-kcb20404.w24,
.logo-kcb20411.w24,
.logo-kcis3310.w24 {
    background-position: -52.8rem -19.2rem
}

.logo-bank240.w28,
.logo-kcb20203.w28,
.logo-kcb20404.w28,
.logo-kcb20411.w28,
.logo-kcis3310.w28 {
    background-position: -61.6rem -22.4rem
}

.logo-bank240.w30,
.logo-kcb20203.w30,
.logo-kcb20404.w30,
.logo-kcb20411.w30,
.logo-kcis3310.w30 {
    background-position: -66rem -24rem
}

.logo-bank240.w32,
.logo-kcb20203.w32,
.logo-kcb20404.w32,
.logo-kcb20411.w32,
.logo-kcis3310.w32 {
    background-position: -70.4rem -25.6rem
}

.logo-bank240.w34,
.logo-kcb20203.w34,
.logo-kcb20404.w34,
.logo-kcb20411.w34,
.logo-kcis3310.w34 {
    background-position: -74.8rem -27.2rem
}

.logo-bank240.w36,
.logo-kcb20203.w36,
.logo-kcb20404.w36,
.logo-kcb20411.w36,
.logo-kcis3310.w36 {
    background-position: -79.2rem -28.8rem
}

.logo-bank240.w40,
.logo-kcb20203.w40,
.logo-kcb20404.w40,
.logo-kcb20411.w40,
.logo-kcis3310.w40 {
    background-position: -88rem -32rem
}

.logo-bank240.w44,
.logo-kcb20203.w44,
.logo-kcb20404.w44,
.logo-kcb20411.w44,
.logo-kcis3310.w44 {
    background-position: -96.8rem -35.2rem
}

.logo-bank240.w50,
.logo-kcb20203.w50,
.logo-kcb20404.w50,
.logo-kcb20411.w50,
.logo-kcis3310.w50 {
    background-position: -110rem -40rem
}

.logo-bank240.w52,
.logo-kcb20203.w52,
.logo-kcb20404.w52,
.logo-kcb20411.w52,
.logo-kcis3310.w52 {
    background-position: -114.4rem -41.6rem
}

.logo-bank240.w60,
.logo-kcb20203.w60,
.logo-kcb20404.w60,
.logo-kcb20411.w60,
.logo-kcis3310.w60 {
    background-position: -132rem -48rem
}

.logo-bank240.w64,
.logo-kcb20203.w64,
.logo-kcb20404.w64,
.logo-kcb20411.w64,
.logo-kcis3310.w64 {
    background-position: -140.8rem -51.2rem
}

.logo-bank240.w65,
.logo-kcb20203.w65,
.logo-kcb20404.w65,
.logo-kcb20411.w65,
.logo-kcis3310.w65 {
    background-position: -143rem -52rem
}

.logo-bank240.w72,
.logo-kcb20203.w72,
.logo-kcb20404.w72,
.logo-kcb20411.w72,
.logo-kcis3310.w72 {
    background-position: -158.4rem -57.6rem
}

/*! 한국투자증권 */

.logo-bank243.w16,
.logo-kcb20542.w16,
.logo-kcis3450.w16 {
    background-position: -35.2rem -16rem
}

.logo-bank243.w20,
.logo-kcb20542.w20,
.logo-kcis3450.w20 {
    background-position: -44rem -20rem
}

.logo-bank243.w22,
.logo-kcb20542.w22,
.logo-kcis3450.w22 {
    background-position: -48.4rem -22rem
}

.logo-bank243.w24,
.logo-kcb20542.w24,
.logo-kcis3450.w24 {
    background-position: -52.8rem -24rem
}

.logo-bank243.w28,
.logo-kcb20542.w28,
.logo-kcis3450.w28 {
    background-position: -61.6rem -28rem
}

.logo-bank243.w30,
.logo-kcb20542.w30,
.logo-kcis3450.w30 {
    background-position: -66rem -30rem
}

.logo-bank243.w32,
.logo-kcb20542.w32,
.logo-kcis3450.w32 {
    background-position: -70.4rem -32rem
}

.logo-bank243.w34,
.logo-kcb20542.w34,
.logo-kcis3450.w34 {
    background-position: -74.8rem -34rem
}

.logo-bank243.w36,
.logo-kcb20542.w36,
.logo-kcis3450.w36 {
    background-position: -79.2rem -36rem
}

.logo-bank243.w40,
.logo-kcb20542.w40,
.logo-kcis3450.w40 {
    background-position: -88rem -40rem
}

.logo-bank243.w44,
.logo-kcb20542.w44,
.logo-kcis3450.w44 {
    background-position: -96.8rem -44rem
}

.logo-bank243.w50,
.logo-kcb20542.w50,
.logo-kcis3450.w50 {
    background-position: -110rem -50rem
}

.logo-bank243.w52,
.logo-kcb20542.w52,
.logo-kcis3450.w52 {
    background-position: -114.4rem -52rem
}

.logo-bank243.w60,
.logo-kcb20542.w60,
.logo-kcis3450.w60 {
    background-position: -132rem -60rem
}

.logo-bank243.w64,
.logo-kcb20542.w64,
.logo-kcis3450.w64 {
    background-position: -140.8rem -64rem
}

.logo-bank243.w65,
.logo-kcb20542.w65,
.logo-kcis3450.w65 {
    background-position: -143rem -65rem
}

.logo-bank243.w72,
.logo-kcb20542.w72,
.logo-kcis3450.w72 {
    background-position: -158.4rem -72rem
}

/*! NH투자증권 */

.logo-bank247.w16,
.logo-kcis3470.w16 {
    background-position: -35.2rem -19.2rem
}

.logo-bank247.w20,
.logo-kcis3470.w20 {
    background-position: -44rem -24rem
}

.logo-bank247.w22,
.logo-kcis3470.w22 {
    background-position: -48.4rem -26.4rem
}

.logo-bank247.w24,
.logo-kcis3470.w24 {
    background-position: -52.8rem -28.8rem
}

.logo-bank247.w28,
.logo-kcis3470.w28 {
    background-position: -61.6rem -33.6rem
}

.logo-bank247.w30,
.logo-kcis3470.w30 {
    background-position: -66rem -36rem
}

.logo-bank247.w32,
.logo-kcis3470.w32 {
    background-position: -70.4rem -38.4rem
}

.logo-bank247.w34,
.logo-kcis3470.w34 {
    background-position: -74.8rem -40.8rem
}

.logo-bank247.w36,
.logo-kcis3470.w36 {
    background-position: -79.2rem -43.2rem
}

.logo-bank247.w40,
.logo-kcis3470.w40 {
    background-position: -88rem -48rem
}

.logo-bank247.w44,
.logo-kcis3470.w44 {
    background-position: -96.8rem -52.8rem
}

.logo-bank247.w50,
.logo-kcis3470.w50 {
    background-position: -110rem -60rem
}

.logo-bank247.w52,
.logo-kcis3470.w52 {
    background-position: -114.4rem -62.4rem
}

.logo-bank247.w60,
.logo-kcis3470.w60 {
    background-position: -132rem -72rem
}

.logo-bank247.w64,
.logo-kcis3470.w64 {
    background-position: -140.8rem -76.8rem
}

.logo-bank247.w65,
.logo-kcis3470.w65 {
    background-position: -143rem -78rem
}

.logo-bank247.w72,
.logo-kcis3470.w72 {
    background-position: -158.4rem -86.4rem
}

/*! 교보증권 */

.logo-bank261.w16,
.logo-kcb20401.w16,
.logo-kcis3460.w16 {
    background-position: -35.2rem -22.4rem
}

.logo-bank261.w20,
.logo-kcb20401.w20,
.logo-kcis3460.w20 {
    background-position: -44rem -28rem
}

.logo-bank261.w22,
.logo-kcb20401.w22,
.logo-kcis3460.w22 {
    background-position: -48.4rem -30.8rem
}

.logo-bank261.w24,
.logo-kcb20401.w24,
.logo-kcis3460.w24 {
    background-position: -52.8rem -33.6rem
}

.logo-bank261.w28,
.logo-kcb20401.w28,
.logo-kcis3460.w28 {
    background-position: -61.6rem -39.2rem
}

.logo-bank261.w30,
.logo-kcb20401.w30,
.logo-kcis3460.w30 {
    background-position: -66rem -42rem
}

.logo-bank261.w32,
.logo-kcb20401.w32,
.logo-kcis3460.w32 {
    background-position: -70.4rem -44.8rem
}

.logo-bank261.w34,
.logo-kcb20401.w34,
.logo-kcis3460.w34 {
    background-position: -74.8rem -47.6rem
}

.logo-bank261.w36,
.logo-kcb20401.w36,
.logo-kcis3460.w36 {
    background-position: -79.2rem -50.4rem
}

.logo-bank261.w40,
.logo-kcb20401.w40,
.logo-kcis3460.w40 {
    background-position: -88rem -56rem
}

.logo-bank261.w44,
.logo-kcb20401.w44,
.logo-kcis3460.w44 {
    background-position: -96.8rem -61.6rem
}

.logo-bank261.w50,
.logo-kcb20401.w50,
.logo-kcis3460.w50 {
    background-position: -110rem -70rem
}

.logo-bank261.w52,
.logo-kcb20401.w52,
.logo-kcis3460.w52 {
    background-position: -114.4rem -72.8rem
}

.logo-bank261.w60,
.logo-kcb20401.w60,
.logo-kcis3460.w60 {
    background-position: -132rem -84rem
}

.logo-bank261.w64,
.logo-kcb20401.w64,
.logo-kcis3460.w64 {
    background-position: -140.8rem -89.6rem
}

.logo-bank261.w65,
.logo-kcb20401.w65,
.logo-kcis3460.w65 {
    background-position: -143rem -91rem
}

.logo-bank261.w72,
.logo-kcb20401.w72,
.logo-kcis3460.w72 {
    background-position: -158.4rem -100.8rem
}

/*! 아이엠증권 */

.logo-bank262.w16,
.logo-kcis3120.w16 {
    background-position: -35.2rem -25.6rem
}

.logo-bank262.w20,
.logo-kcis3120.w20 {
    background-position: -44rem -32rem
}

.logo-bank262.w22,
.logo-kcis3120.w22 {
    background-position: -48.4rem -35.2rem
}

.logo-bank262.w24,
.logo-kcis3120.w24 {
    background-position: -52.8rem -38.4rem
}

.logo-bank262.w28,
.logo-kcis3120.w28 {
    background-position: -61.6rem -44.8rem
}

.logo-bank262.w30,
.logo-kcis3120.w30 {
    background-position: -66rem -48rem
}

.logo-bank262.w32,
.logo-kcis3120.w32 {
    background-position: -70.4rem -51.2rem
}

.logo-bank262.w34,
.logo-kcis3120.w34 {
    background-position: -74.8rem -54.4rem
}

.logo-bank262.w36,
.logo-kcis3120.w36 {
    background-position: -79.2rem -57.6rem
}

.logo-bank262.w40,
.logo-kcis3120.w40 {
    background-position: -88rem -64rem
}

.logo-bank262.w44,
.logo-kcis3120.w44 {
    background-position: -96.8rem -70.4rem
}

.logo-bank262.w50,
.logo-kcis3120.w50 {
    background-position: -110rem -80rem
}

.logo-bank262.w52,
.logo-kcis3120.w52 {
    background-position: -114.4rem -83.2rem
}

.logo-bank262.w60,
.logo-kcis3120.w60 {
    background-position: -132rem -96rem
}

.logo-bank262.w64,
.logo-kcis3120.w64 {
    background-position: -140.8rem -102.4rem
}

.logo-bank262.w65,
.logo-kcis3120.w65 {
    background-position: -143rem -104rem
}

.logo-bank262.w72,
.logo-kcis3120.w72 {
    background-position: -158.4rem -115.2rem
}

/*! 현대차증권 */

.logo-bank263.w16,
.logo-kcis3140.w16 {
    background-position: -35.2rem -28.8rem
}

.logo-bank263.w20,
.logo-kcis3140.w20 {
    background-position: -44rem -36rem
}

.logo-bank263.w22,
.logo-kcis3140.w22 {
    background-position: -48.4rem -39.6rem
}

.logo-bank263.w24,
.logo-kcis3140.w24 {
    background-position: -52.8rem -43.2rem
}

.logo-bank263.w28,
.logo-kcis3140.w28 {
    background-position: -61.6rem -50.4rem
}

.logo-bank263.w30,
.logo-kcis3140.w30 {
    background-position: -66rem -54rem
}

.logo-bank263.w32,
.logo-kcis3140.w32 {
    background-position: -70.4rem -57.6rem
}

.logo-bank263.w34,
.logo-kcis3140.w34 {
    background-position: -74.8rem -61.2rem
}

.logo-bank263.w36,
.logo-kcis3140.w36 {
    background-position: -79.2rem -64.8rem
}

.logo-bank263.w40,
.logo-kcis3140.w40 {
    background-position: -88rem -72rem
}

.logo-bank263.w44,
.logo-kcis3140.w44 {
    background-position: -96.8rem -79.2rem
}

.logo-bank263.w50,
.logo-kcis3140.w50 {
    background-position: -110rem -90rem
}

.logo-bank263.w52,
.logo-kcis3140.w52 {
    background-position: -114.4rem -93.6rem
}

.logo-bank263.w60,
.logo-kcis3140.w60 {
    background-position: -132rem -108rem
}

.logo-bank263.w64,
.logo-kcis3140.w64 {
    background-position: -140.8rem -115.2rem
}

.logo-bank263.w65,
.logo-kcis3140.w65 {
    background-position: -143rem -117rem
}

.logo-bank263.w72,
.logo-kcis3140.w72 {
    background-position: -158.4rem -129.6rem
}

/*! 키움증권 */

.logo-bank264.w16,
.logo-kcb20522.w16,
.logo-kcb20523.w16,
.logo-kcis3480.w16 {
    background-position: -35.2rem -32rem
}

.logo-bank264.w20,
.logo-kcb20522.w20,
.logo-kcb20523.w20,
.logo-kcis3480.w20 {
    background-position: -44rem -40rem
}

.logo-bank264.w22,
.logo-kcb20522.w22,
.logo-kcb20523.w22,
.logo-kcis3480.w22 {
    background-position: -48.4rem -44rem
}

.logo-bank264.w24,
.logo-kcb20522.w24,
.logo-kcb20523.w24,
.logo-kcis3480.w24 {
    background-position: -52.8rem -48rem
}

.logo-bank264.w28,
.logo-kcb20522.w28,
.logo-kcb20523.w28,
.logo-kcis3480.w28 {
    background-position: -61.6rem -56rem
}

.logo-bank264.w30,
.logo-kcb20522.w30,
.logo-kcb20523.w30,
.logo-kcis3480.w30 {
    background-position: -66rem -60rem
}

.logo-bank264.w32,
.logo-kcb20522.w32,
.logo-kcb20523.w32,
.logo-kcis3480.w32 {
    background-position: -70.4rem -64rem
}

.logo-bank264.w34,
.logo-kcb20522.w34,
.logo-kcb20523.w34,
.logo-kcis3480.w34 {
    background-position: -74.8rem -68rem
}

.logo-bank264.w36,
.logo-kcb20522.w36,
.logo-kcb20523.w36,
.logo-kcis3480.w36 {
    background-position: -79.2rem -72rem
}

.logo-bank264.w40,
.logo-kcb20522.w40,
.logo-kcb20523.w40,
.logo-kcis3480.w40 {
    background-position: -88rem -80rem
}

.logo-bank264.w44,
.logo-kcb20522.w44,
.logo-kcb20523.w44,
.logo-kcis3480.w44 {
    background-position: -96.8rem -88rem
}

.logo-bank264.w50,
.logo-kcb20522.w50,
.logo-kcb20523.w50,
.logo-kcis3480.w50 {
    background-position: -110rem -100rem
}

.logo-bank264.w52,
.logo-kcb20522.w52,
.logo-kcb20523.w52,
.logo-kcis3480.w52 {
    background-position: -114.4rem -104rem
}

.logo-bank264.w60,
.logo-kcb20522.w60,
.logo-kcb20523.w60,
.logo-kcis3480.w60 {
    background-position: -132rem -120rem
}

.logo-bank264.w64,
.logo-kcb20522.w64,
.logo-kcb20523.w64,
.logo-kcis3480.w64 {
    background-position: -140.8rem -128rem
}

.logo-bank264.w65,
.logo-kcb20522.w65,
.logo-kcb20523.w65,
.logo-kcis3480.w65 {
    background-position: -143rem -130rem
}

.logo-bank264.w72,
.logo-kcb20522.w72,
.logo-kcb20523.w72,
.logo-kcis3480.w72 {
    background-position: -158.4rem -144rem
}

/*! LS증권 */

.logo-bank265.w16,
.logo-kcis3080.w16 {
    background-position: 0 -35.2rem
}

.logo-bank265.w20,
.logo-kcis3080.w20 {
    background-position: 0 -44rem
}

.logo-bank265.w22,
.logo-kcis3080.w22 {
    background-position: 0 -48.4rem
}

.logo-bank265.w24,
.logo-kcis3080.w24 {
    background-position: 0 -52.8rem
}

.logo-bank265.w28,
.logo-kcis3080.w28 {
    background-position: 0 -61.6rem
}

.logo-bank265.w30,
.logo-kcis3080.w30 {
    background-position: 0 -66rem
}

.logo-bank265.w32,
.logo-kcis3080.w32 {
    background-position: 0 -70.4rem
}

.logo-bank265.w34,
.logo-kcis3080.w34 {
    background-position: 0 -74.8rem
}

.logo-bank265.w36,
.logo-kcis3080.w36 {
    background-position: 0 -79.2rem
}

.logo-bank265.w40,
.logo-kcis3080.w40 {
    background-position: 0 -88rem
}

.logo-bank265.w44,
.logo-kcis3080.w44 {
    background-position: 0 -96.8rem
}

.logo-bank265.w50,
.logo-kcis3080.w50 {
    background-position: 0 -110rem
}

.logo-bank265.w52,
.logo-kcis3080.w52 {
    background-position: 0 -114.4rem
}

.logo-bank265.w60,
.logo-kcis3080.w60 {
    background-position: 0 -132rem
}

.logo-bank265.w64,
.logo-kcis3080.w64 {
    background-position: 0 -140.8rem
}

.logo-bank265.w65,
.logo-kcis3080.w65 {
    background-position: 0 -143rem
}

.logo-bank265.w72,
.logo-kcis3080.w72 {
    background-position: 0 -158.4rem
}

/*! SK증권 */

.logo-bank266.w16,
.logo-kcis3400.w16 {
    background-position: -3.2rem -35.2rem
}

.logo-bank266.w20,
.logo-kcis3400.w20 {
    background-position: -4rem -44rem
}

.logo-bank266.w22,
.logo-kcis3400.w22 {
    background-position: -4.4rem -48.4rem
}

.logo-bank266.w24,
.logo-kcis3400.w24 {
    background-position: -4.8rem -52.8rem
}

.logo-bank266.w28,
.logo-kcis3400.w28 {
    background-position: -5.6rem -61.6rem
}

.logo-bank266.w30,
.logo-kcis3400.w30 {
    background-position: -6rem -66rem
}

.logo-bank266.w32,
.logo-kcis3400.w32 {
    background-position: -6.4rem -70.4rem
}

.logo-bank266.w34,
.logo-kcis3400.w34 {
    background-position: -6.8rem -74.8rem
}

.logo-bank266.w36,
.logo-kcis3400.w36 {
    background-position: -7.2rem -79.2rem
}

.logo-bank266.w40,
.logo-kcis3400.w40 {
    background-position: -8rem -88rem
}

.logo-bank266.w44,
.logo-kcis3400.w44 {
    background-position: -8.8rem -96.8rem
}

.logo-bank266.w50,
.logo-kcis3400.w50 {
    background-position: -10rem -110rem
}

.logo-bank266.w52,
.logo-kcis3400.w52 {
    background-position: -10.4rem -114.4rem
}

.logo-bank266.w60,
.logo-kcis3400.w60 {
    background-position: -12rem -132rem
}

.logo-bank266.w64,
.logo-kcis3400.w64 {
    background-position: -12.8rem -140.8rem
}

.logo-bank266.w65,
.logo-kcis3400.w65 {
    background-position: -13rem -143rem
}

.logo-bank266.w72,
.logo-kcis3400.w72 {
    background-position: -14.4rem -158.4rem
}

/*! 대신증권 */

.logo-bank267.w16,
.logo-kcb20510.w16,
.logo-kcis3230.w16 {
    background-position: -6.4rem -35.2rem
}

.logo-bank267.w20,
.logo-kcb20510.w20,
.logo-kcis3230.w20 {
    background-position: -8rem -44rem
}

.logo-bank267.w22,
.logo-kcb20510.w22,
.logo-kcis3230.w22 {
    background-position: -8.8rem -48.4rem
}

.logo-bank267.w24,
.logo-kcb20510.w24,
.logo-kcis3230.w24 {
    background-position: -9.6rem -52.8rem
}

.logo-bank267.w28,
.logo-kcb20510.w28,
.logo-kcis3230.w28 {
    background-position: -11.2rem -61.6rem
}

.logo-bank267.w30,
.logo-kcb20510.w30,
.logo-kcis3230.w30 {
    background-position: -12rem -66rem
}

.logo-bank267.w32,
.logo-kcb20510.w32,
.logo-kcis3230.w32 {
    background-position: -12.8rem -70.4rem
}

.logo-bank267.w34,
.logo-kcb20510.w34,
.logo-kcis3230.w34 {
    background-position: -13.6rem -74.8rem
}

.logo-bank267.w36,
.logo-kcb20510.w36,
.logo-kcis3230.w36 {
    background-position: -14.4rem -79.2rem
}

.logo-bank267.w40,
.logo-kcb20510.w40,
.logo-kcis3230.w40 {
    background-position: -16rem -88rem
}

.logo-bank267.w44,
.logo-kcb20510.w44,
.logo-kcis3230.w44 {
    background-position: -17.6rem -96.8rem
}

.logo-bank267.w50,
.logo-kcb20510.w50,
.logo-kcis3230.w50 {
    background-position: -20rem -110rem
}

.logo-bank267.w52,
.logo-kcb20510.w52,
.logo-kcis3230.w52 {
    background-position: -20.8rem -114.4rem
}

.logo-bank267.w60,
.logo-kcb20510.w60,
.logo-kcis3230.w60 {
    background-position: -24rem -132rem
}

.logo-bank267.w64,
.logo-kcb20510.w64,
.logo-kcis3230.w64 {
    background-position: -25.6rem -140.8rem
}

.logo-bank267.w65,
.logo-kcb20510.w65,
.logo-kcis3230.w65 {
    background-position: -26rem -143rem
}

.logo-bank267.w72,
.logo-kcb20510.w72,
.logo-kcis3230.w72 {
    background-position: -28.8rem -158.4rem
}

/*! 한화투자증권 */

.logo-bank269.w16,
.logo-kcb20402.w16,
.logo-kcb20524.w16,
.logo-kcis3330.w16 {
    background-position: -9.6rem -35.2rem
}

.logo-bank269.w20,
.logo-kcb20402.w20,
.logo-kcb20524.w20,
.logo-kcis3330.w20 {
    background-position: -12rem -44rem
}

.logo-bank269.w22,
.logo-kcb20402.w22,
.logo-kcb20524.w22,
.logo-kcis3330.w22 {
    background-position: -13.2rem -48.4rem
}

.logo-bank269.w24,
.logo-kcb20402.w24,
.logo-kcb20524.w24,
.logo-kcis3330.w24 {
    background-position: -14.4rem -52.8rem
}

.logo-bank269.w28,
.logo-kcb20402.w28,
.logo-kcb20524.w28,
.logo-kcis3330.w28 {
    background-position: -16.8rem -61.6rem
}

.logo-bank269.w30,
.logo-kcb20402.w30,
.logo-kcb20524.w30,
.logo-kcis3330.w30 {
    background-position: -18rem -66rem
}

.logo-bank269.w32,
.logo-kcb20402.w32,
.logo-kcb20524.w32,
.logo-kcis3330.w32 {
    background-position: -19.2rem -70.4rem
}

.logo-bank269.w34,
.logo-kcb20402.w34,
.logo-kcb20524.w34,
.logo-kcis3330.w34 {
    background-position: -20.4rem -74.8rem
}

.logo-bank269.w36,
.logo-kcb20402.w36,
.logo-kcb20524.w36,
.logo-kcis3330.w36 {
    background-position: -21.6rem -79.2rem
}

.logo-bank269.w40,
.logo-kcb20402.w40,
.logo-kcb20524.w40,
.logo-kcis3330.w40 {
    background-position: -24rem -88rem
}

.logo-bank269.w44,
.logo-kcb20402.w44,
.logo-kcb20524.w44,
.logo-kcis3330.w44 {
    background-position: -26.4rem -96.8rem
}

.logo-bank269.w50,
.logo-kcb20402.w50,
.logo-kcb20524.w50,
.logo-kcis3330.w50 {
    background-position: -30rem -110rem
}

.logo-bank269.w52,
.logo-kcb20402.w52,
.logo-kcb20524.w52,
.logo-kcis3330.w52 {
    background-position: -31.2rem -114.4rem
}

.logo-bank269.w60,
.logo-kcb20402.w60,
.logo-kcb20524.w60,
.logo-kcis3330.w60 {
    background-position: -36rem -132rem
}

.logo-bank269.w64,
.logo-kcb20402.w64,
.logo-kcb20524.w64,
.logo-kcis3330.w64 {
    background-position: -38.4rem -140.8rem
}

.logo-bank269.w65,
.logo-kcb20402.w65,
.logo-kcb20524.w65,
.logo-kcis3330.w65 {
    background-position: -39rem -143rem
}

.logo-bank269.w72,
.logo-kcb20402.w72,
.logo-kcb20524.w72,
.logo-kcis3330.w72 {
    background-position: -43.2rem -158.4rem
}

/*! 하나증권 */

.logo-bank270.w16,
.logo-kcis3130.w16 {
    background-position: -12.8rem -35.2rem
}

.logo-bank270.w20,
.logo-kcis3130.w20 {
    background-position: -16rem -44rem
}

.logo-bank270.w22,
.logo-kcis3130.w22 {
    background-position: -17.6rem -48.4rem
}

.logo-bank270.w24,
.logo-kcis3130.w24 {
    background-position: -19.2rem -52.8rem
}

.logo-bank270.w28,
.logo-kcis3130.w28 {
    background-position: -22.4rem -61.6rem
}

.logo-bank270.w30,
.logo-kcis3130.w30 {
    background-position: -24rem -66rem
}

.logo-bank270.w32,
.logo-kcis3130.w32 {
    background-position: -25.6rem -70.4rem
}

.logo-bank270.w34,
.logo-kcis3130.w34 {
    background-position: -27.2rem -74.8rem
}

.logo-bank270.w36,
.logo-kcis3130.w36 {
    background-position: -28.8rem -79.2rem
}

.logo-bank270.w40,
.logo-kcis3130.w40 {
    background-position: -32rem -88rem
}

.logo-bank270.w44,
.logo-kcis3130.w44 {
    background-position: -35.2rem -96.8rem
}

.logo-bank270.w50,
.logo-kcis3130.w50 {
    background-position: -40rem -110rem
}

.logo-bank270.w52,
.logo-kcis3130.w52 {
    background-position: -41.6rem -114.4rem
}

.logo-bank270.w60,
.logo-kcis3130.w60 {
    background-position: -48rem -132rem
}

.logo-bank270.w64,
.logo-kcis3130.w64 {
    background-position: -51.2rem -140.8rem
}

.logo-bank270.w65,
.logo-kcis3130.w65 {
    background-position: -52rem -143rem
}

.logo-bank270.w72,
.logo-kcis3130.w72 {
    background-position: -57.6rem -158.4rem
}

/*! 토스증권 */

.logo-bank271.w16,
.logo-kcis4320.w16 {
    background-position: -16rem -35.2rem
}

.logo-bank271.w20,
.logo-kcis4320.w20 {
    background-position: -20rem -44rem
}

.logo-bank271.w22,
.logo-kcis4320.w22 {
    background-position: -22rem -48.4rem
}

.logo-bank271.w24,
.logo-kcis4320.w24 {
    background-position: -24rem -52.8rem
}

.logo-bank271.w28,
.logo-kcis4320.w28 {
    background-position: -28rem -61.6rem
}

.logo-bank271.w30,
.logo-kcis4320.w30 {
    background-position: -30rem -66rem
}

.logo-bank271.w32,
.logo-kcis4320.w32 {
    background-position: -32rem -70.4rem
}

.logo-bank271.w34,
.logo-kcis4320.w34 {
    background-position: -34rem -74.8rem
}

.logo-bank271.w36,
.logo-kcis4320.w36 {
    background-position: -36rem -79.2rem
}

.logo-bank271.w40,
.logo-kcis4320.w40 {
    background-position: -40rem -88rem
}

.logo-bank271.w44,
.logo-kcis4320.w44 {
    background-position: -44rem -96.8rem
}

.logo-bank271.w50,
.logo-kcis4320.w50 {
    background-position: -50rem -110rem
}

.logo-bank271.w52,
.logo-kcis4320.w52 {
    background-position: -52rem -114.4rem
}

.logo-bank271.w60,
.logo-kcis4320.w60 {
    background-position: -60rem -132rem
}

.logo-bank271.w64,
.logo-kcis4320.w64 {
    background-position: -64rem -140.8rem
}

.logo-bank271.w65,
.logo-kcis4320.w65 {
    background-position: -65rem -143rem
}

.logo-bank271.w72,
.logo-kcis4320.w72 {
    background-position: -72rem -158.4rem
}

/*! 신한금융투자 */

.logo-bank278.w16,
.logo-kcis3260.w16 {
    background-position: -19.2rem -35.2rem
}

.logo-bank278.w20,
.logo-kcis3260.w20 {
    background-position: -24rem -44rem
}

.logo-bank278.w22,
.logo-kcis3260.w22 {
    background-position: -26.4rem -48.4rem
}

.logo-bank278.w24,
.logo-kcis3260.w24 {
    background-position: -28.8rem -52.8rem
}

.logo-bank278.w28,
.logo-kcis3260.w28 {
    background-position: -33.6rem -61.6rem
}

.logo-bank278.w30,
.logo-kcis3260.w30 {
    background-position: -36rem -66rem
}

.logo-bank278.w32,
.logo-kcis3260.w32 {
    background-position: -38.4rem -70.4rem
}

.logo-bank278.w34,
.logo-kcis3260.w34 {
    background-position: -40.8rem -74.8rem
}

.logo-bank278.w36,
.logo-kcis3260.w36 {
    background-position: -43.2rem -79.2rem
}

.logo-bank278.w40,
.logo-kcis3260.w40 {
    background-position: -48rem -88rem
}

.logo-bank278.w44,
.logo-kcis3260.w44 {
    background-position: -52.8rem -96.8rem
}

.logo-bank278.w50,
.logo-kcis3260.w50 {
    background-position: -60rem -110rem
}

.logo-bank278.w52,
.logo-kcis3260.w52 {
    background-position: -62.4rem -114.4rem
}

.logo-bank278.w60,
.logo-kcis3260.w60 {
    background-position: -72rem -132rem
}

.logo-bank278.w64,
.logo-kcis3260.w64 {
    background-position: -76.8rem -140.8rem
}

.logo-bank278.w65,
.logo-kcis3260.w65 {
    background-position: -78rem -143rem
}

.logo-bank278.w72,
.logo-kcis3260.w72 {
    background-position: -86.4rem -158.4rem
}

/*! CHPFMTASK-2096 ::: DB금융투자 사명 및 CI 변경에 따른 대응 작업 요청 */

/*! DB금융투자 DB금융투자 */

/*! DB손해보험 */

.logo-kcb20410.w16 {
    background-position: -22.4rem -35.2rem
}

.logo-kcb20410.w20 {
    background-position: -28rem -44rem
}

.logo-kcb20410.w22 {
    background-position: -30.8rem -48.4rem
}

.logo-kcb20410.w24 {
    background-position: -33.6rem -52.8rem
}

.logo-kcb20410.w28 {
    background-position: -39.2rem -61.6rem
}

.logo-kcb20410.w30 {
    background-position: -42rem -66rem
}

.logo-kcb20410.w32 {
    background-position: -44.8rem -70.4rem
}

.logo-kcb20410.w34 {
    background-position: -47.6rem -74.8rem
}

.logo-kcb20410.w36 {
    background-position: -50.4rem -79.2rem
}

.logo-kcb20410.w40 {
    background-position: -56rem -88rem
}

.logo-kcb20410.w44 {
    background-position: -61.6rem -96.8rem
}

.logo-kcb20410.w50 {
    background-position: -70rem -110rem
}

.logo-kcb20410.w52 {
    background-position: -72.8rem -114.4rem
}

.logo-kcb20410.w60 {
    background-position: -84rem -132rem
}

.logo-kcb20410.w64 {
    background-position: -89.6rem -140.8rem
}

.logo-kcb20410.w65 {
    background-position: -91rem -143rem
}

.logo-kcb20410.w72 {
    background-position: -100.8rem -158.4rem
}

/*! DB금융투자 DB금융투자 */

.logo-bank279.w16,
.logo-kcis3370.w16 {
    background-position: -28.8rem -35.2rem
}

.logo-bank279.w20,
.logo-kcis3370.w20 {
    background-position: -36rem -44rem
}

.logo-bank279.w22,
.logo-kcis3370.w22 {
    background-position: -39.6rem -48.4rem
}

.logo-bank279.w24,
.logo-kcis3370.w24 {
    background-position: -43.2rem -52.8rem
}

.logo-bank279.w28,
.logo-kcis3370.w28 {
    background-position: -50.4rem -61.6rem
}

.logo-bank279.w30,
.logo-kcis3370.w30 {
    background-position: -54rem -66rem
}

.logo-bank279.w32,
.logo-kcis3370.w32 {
    background-position: -57.6rem -70.4rem
}

.logo-bank279.w34,
.logo-kcis3370.w34 {
    background-position: -61.2rem -74.8rem
}

.logo-bank279.w36,
.logo-kcis3370.w36 {
    background-position: -64.8rem -79.2rem
}

.logo-bank279.w40,
.logo-kcis3370.w40 {
    background-position: -72rem -88rem
}

.logo-bank279.w44,
.logo-kcis3370.w44 {
    background-position: -79.2rem -96.8rem
}

.logo-bank279.w50,
.logo-kcis3370.w50 {
    background-position: -90rem -110rem
}

.logo-bank279.w52,
.logo-kcis3370.w52 {
    background-position: -93.6rem -114.4rem
}

.logo-bank279.w60,
.logo-kcis3370.w60 {
    background-position: -108rem -132rem
}

.logo-bank279.w64,
.logo-kcis3370.w64 {
    background-position: -115.2rem -140.8rem
}

.logo-bank279.w65,
.logo-kcis3370.w65 {
    background-position: -117rem -143rem
}

.logo-bank279.w72,
.logo-kcis3370.w72 {
    background-position: -129.6rem -158.4rem
}

/*! //CHPFMTASK-2096 ::: DB금융투자 사명 및 CI 변경에 따른 대응 작업 요청 */

/*! 유진투자증권 */

.logo-bank280.w16,
.logo-kcis3290.w16 {
    background-position: -25.6rem -35.2rem
}

.logo-bank280.w20,
.logo-kcis3290.w20 {
    background-position: -32rem -44rem
}

.logo-bank280.w22,
.logo-kcis3290.w22 {
    background-position: -35.2rem -48.4rem
}

.logo-bank280.w24,
.logo-kcis3290.w24 {
    background-position: -38.4rem -52.8rem
}

.logo-bank280.w28,
.logo-kcis3290.w28 {
    background-position: -44.8rem -61.6rem
}

.logo-bank280.w30,
.logo-kcis3290.w30 {
    background-position: -48rem -66rem
}

.logo-bank280.w32,
.logo-kcis3290.w32 {
    background-position: -51.2rem -70.4rem
}

.logo-bank280.w34,
.logo-kcis3290.w34 {
    background-position: -54.4rem -74.8rem
}

.logo-bank280.w36,
.logo-kcis3290.w36 {
    background-position: -57.6rem -79.2rem
}

.logo-bank280.w40,
.logo-kcis3290.w40 {
    background-position: -64rem -88rem
}

.logo-bank280.w44,
.logo-kcis3290.w44 {
    background-position: -70.4rem -96.8rem
}

.logo-bank280.w50,
.logo-kcis3290.w50 {
    background-position: -80rem -110rem
}

.logo-bank280.w52,
.logo-kcis3290.w52 {
    background-position: -83.2rem -114.4rem
}

.logo-bank280.w60,
.logo-kcis3290.w60 {
    background-position: -96rem -132rem
}

.logo-bank280.w64,
.logo-kcis3290.w64 {
    background-position: -102.4rem -140.8rem
}

.logo-bank280.w65,
.logo-kcis3290.w65 {
    background-position: -104rem -143rem
}

.logo-bank280.w72,
.logo-kcis3290.w72 {
    background-position: -115.2rem -158.4rem
}

/*! 메리츠증권 */

.logo-bank287.w16,
.logo-kcb20322.w16,
.logo-kcis3350.w16 {
    background-position: -32rem -35.2rem
}

.logo-bank287.w20,
.logo-kcb20322.w20,
.logo-kcis3350.w20 {
    background-position: -40rem -44rem
}

.logo-bank287.w22,
.logo-kcb20322.w22,
.logo-kcis3350.w22 {
    background-position: -44rem -48.4rem
}

.logo-bank287.w24,
.logo-kcb20322.w24,
.logo-kcis3350.w24 {
    background-position: -48rem -52.8rem
}

.logo-bank287.w28,
.logo-kcb20322.w28,
.logo-kcis3350.w28 {
    background-position: -56rem -61.6rem
}

.logo-bank287.w30,
.logo-kcb20322.w30,
.logo-kcis3350.w30 {
    background-position: -60rem -66rem
}

.logo-bank287.w32,
.logo-kcb20322.w32,
.logo-kcis3350.w32 {
    background-position: -64rem -70.4rem
}

.logo-bank287.w34,
.logo-kcb20322.w34,
.logo-kcis3350.w34 {
    background-position: -68rem -74.8rem
}

.logo-bank287.w36,
.logo-kcb20322.w36,
.logo-kcis3350.w36 {
    background-position: -72rem -79.2rem
}

.logo-bank287.w40,
.logo-kcb20322.w40,
.logo-kcis3350.w40 {
    background-position: -80rem -88rem
}

.logo-bank287.w44,
.logo-kcb20322.w44,
.logo-kcis3350.w44 {
    background-position: -88rem -96.8rem
}

.logo-bank287.w50,
.logo-kcb20322.w50,
.logo-kcis3350.w50 {
    background-position: -100rem -110rem
}

.logo-bank287.w52,
.logo-kcb20322.w52,
.logo-kcis3350.w52 {
    background-position: -104rem -114.4rem
}

.logo-bank287.w60,
.logo-kcb20322.w60,
.logo-kcis3350.w60 {
    background-position: -120rem -132rem
}

.logo-bank287.w64,
.logo-kcb20322.w64,
.logo-kcis3350.w64 {
    background-position: -128rem -140.8rem
}

.logo-bank287.w65,
.logo-kcb20322.w65,
.logo-kcis3350.w65 {
    background-position: -130rem -143rem
}

.logo-bank287.w72,
.logo-kcb20322.w72,
.logo-kcis3350.w72 {
    background-position: -144rem -158.4rem
}

/*! 카카오페이증권 */

.logo-bank288.w16,
.logo-kcis3056.w16 {
    background-position: -35.2rem -35.2rem
}

.logo-bank288.w20,
.logo-kcis3056.w20 {
    background-position: -44rem -44rem
}

.logo-bank288.w22,
.logo-kcis3056.w22 {
    background-position: -48.4rem -48.4rem
}

.logo-bank288.w24,
.logo-kcis3056.w24 {
    background-position: -52.8rem -52.8rem
}

.logo-bank288.w28,
.logo-kcis3056.w28 {
    background-position: -61.6rem -61.6rem
}

.logo-bank288.w30,
.logo-kcis3056.w30 {
    background-position: -66rem -66rem
}

.logo-bank288.w32,
.logo-kcis3056.w32 {
    background-position: -70.4rem -70.4rem
}

.logo-bank288.w34,
.logo-kcis3056.w34 {
    background-position: -74.8rem -74.8rem
}

.logo-bank288.w36,
.logo-kcis3056.w36 {
    background-position: -79.2rem -79.2rem
}

.logo-bank288.w40,
.logo-kcis3056.w40 {
    background-position: -88rem -88rem
}

.logo-bank288.w44,
.logo-kcis3056.w44 {
    background-position: -96.8rem -96.8rem
}

.logo-bank288.w50,
.logo-kcis3056.w50 {
    background-position: -110rem -110rem
}

.logo-bank288.w52,
.logo-kcis3056.w52 {
    background-position: -114.4rem -114.4rem
}

.logo-bank288.w60,
.logo-kcis3056.w60 {
    background-position: -132rem -132rem
}

.logo-bank288.w64,
.logo-kcis3056.w64 {
    background-position: -140.8rem -140.8rem
}

.logo-bank288.w65,
.logo-kcis3056.w65 {
    background-position: -143rem -143rem
}

.logo-bank288.w72,
.logo-kcis3056.w72 {
    background-position: -158.4rem -158.4rem
}

/*! 부국증권 */

.logo-bank290.w16,
.logo-kcis3420.w16 {
    background-position: -38.4rem 0
}

.logo-bank290.w20,
.logo-kcis3420.w20 {
    background-position: -48rem 0
}

.logo-bank290.w22,
.logo-kcis3420.w22 {
    background-position: -52.8rem 0
}

.logo-bank290.w24,
.logo-kcis3420.w24 {
    background-position: -57.6rem 0
}

.logo-bank290.w28,
.logo-kcis3420.w28 {
    background-position: -67.2rem 0
}

.logo-bank290.w30,
.logo-kcis3420.w30 {
    background-position: -72rem 0
}

.logo-bank290.w32,
.logo-kcis3420.w32 {
    background-position: -76.8rem 0
}

.logo-bank290.w34,
.logo-kcis3420.w34 {
    background-position: -81.6rem 0
}

.logo-bank290.w36,
.logo-kcis3420.w36 {
    background-position: -86.4rem 0
}

.logo-bank290.w40,
.logo-kcis3420.w40 {
    background-position: -96rem 0
}

.logo-bank290.w44,
.logo-kcis3420.w44 {
    background-position: -105.6rem 0
}

.logo-bank290.w50,
.logo-kcis3420.w50 {
    background-position: -120rem 0
}

.logo-bank290.w52,
.logo-kcis3420.w52 {
    background-position: -124.8rem 0
}

.logo-bank290.w60,
.logo-kcis3420.w60 {
    background-position: -144rem 0
}

.logo-bank290.w64,
.logo-kcis3420.w64 {
    background-position: -153.6rem 0
}

.logo-bank290.w65,
.logo-kcis3420.w65 {
    background-position: -156rem 0
}

.logo-bank290.w72,
.logo-kcis3420.w72 {
    background-position: -172.8rem 0
}

/*! 신영증권 */

.logo-bank291.w16,
.logo-kcis3390.w16 {
    background-position: -38.4rem -3.2rem
}

.logo-bank291.w20,
.logo-kcis3390.w20 {
    background-position: -48rem -4rem
}

.logo-bank291.w22,
.logo-kcis3390.w22 {
    background-position: -52.8rem -4.4rem
}

.logo-bank291.w24,
.logo-kcis3390.w24 {
    background-position: -57.6rem -4.8rem
}

.logo-bank291.w28,
.logo-kcis3390.w28 {
    background-position: -67.2rem -5.6rem
}

.logo-bank291.w30,
.logo-kcis3390.w30 {
    background-position: -72rem -6rem
}

.logo-bank291.w32,
.logo-kcis3390.w32 {
    background-position: -76.8rem -6.4rem
}

.logo-bank291.w34,
.logo-kcis3390.w34 {
    background-position: -81.6rem -6.8rem
}

.logo-bank291.w36,
.logo-kcis3390.w36 {
    background-position: -86.4rem -7.2rem
}

.logo-bank291.w40,
.logo-kcis3390.w40 {
    background-position: -96rem -8rem
}

.logo-bank291.w44,
.logo-kcis3390.w44 {
    background-position: -105.6rem -8.8rem
}

.logo-bank291.w50,
.logo-kcis3390.w50 {
    background-position: -120rem -10rem
}

.logo-bank291.w52,
.logo-kcis3390.w52 {
    background-position: -124.8rem -10.4rem
}

.logo-bank291.w60,
.logo-kcis3390.w60 {
    background-position: -144rem -12rem
}

.logo-bank291.w64,
.logo-kcis3390.w64 {
    background-position: -153.6rem -12.8rem
}

.logo-bank291.w65,
.logo-kcis3390.w65 {
    background-position: -156rem -13rem
}

.logo-bank291.w72,
.logo-kcis3390.w72 {
    background-position: -172.8rem -14.4rem
}

/*! 케이프투자증권 */

.logo-bank292.w16,
.logo-kcis3500.w16 {
    background-position: -38.4rem -6.4rem
}

.logo-bank292.w20,
.logo-kcis3500.w20 {
    background-position: -48rem -8rem
}

.logo-bank292.w22,
.logo-kcis3500.w22 {
    background-position: -52.8rem -8.8rem
}

.logo-bank292.w24,
.logo-kcis3500.w24 {
    background-position: -57.6rem -9.6rem
}

.logo-bank292.w28,
.logo-kcis3500.w28 {
    background-position: -67.2rem -11.2rem
}

.logo-bank292.w30,
.logo-kcis3500.w30 {
    background-position: -72rem -12rem
}

.logo-bank292.w32,
.logo-kcis3500.w32 {
    background-position: -76.8rem -12.8rem
}

.logo-bank292.w34,
.logo-kcis3500.w34 {
    background-position: -81.6rem -13.6rem
}

.logo-bank292.w36,
.logo-kcis3500.w36 {
    background-position: -86.4rem -14.4rem
}

.logo-bank292.w40,
.logo-kcis3500.w40 {
    background-position: -96rem -16rem
}

.logo-bank292.w44,
.logo-kcis3500.w44 {
    background-position: -105.6rem -17.6rem
}

.logo-bank292.w50,
.logo-kcis3500.w50 {
    background-position: -120rem -20rem
}

.logo-bank292.w52,
.logo-kcis3500.w52 {
    background-position: -124.8rem -20.8rem
}

.logo-bank292.w60,
.logo-kcis3500.w60 {
    background-position: -144rem -24rem
}

.logo-bank292.w64,
.logo-kcis3500.w64 {
    background-position: -153.6rem -25.6rem
}

.logo-bank292.w65,
.logo-kcis3500.w65 {
    background-position: -156rem -26rem
}

.logo-bank292.w72,
.logo-kcis3500.w72 {
    background-position: -172.8rem -28.8rem
}

/*! 우리투자증권 */

.logo-bank294.w16,
.logo-kcis3560.w16 {
    background-position: -38.4rem -9.6rem
}

.logo-bank294.w20,
.logo-kcis3560.w20 {
    background-position: -48rem -12rem
}

.logo-bank294.w22,
.logo-kcis3560.w22 {
    background-position: -52.8rem -13.2rem
}

.logo-bank294.w24,
.logo-kcis3560.w24 {
    background-position: -57.6rem -14.4rem
}

.logo-bank294.w28,
.logo-kcis3560.w28 {
    background-position: -67.2rem -16.8rem
}

.logo-bank294.w30,
.logo-kcis3560.w30 {
    background-position: -72rem -18rem
}

.logo-bank294.w32,
.logo-kcis3560.w32 {
    background-position: -76.8rem -19.2rem
}

.logo-bank294.w34,
.logo-kcis3560.w34 {
    background-position: -81.6rem -20.4rem
}

.logo-bank294.w36,
.logo-kcis3560.w36 {
    background-position: -86.4rem -21.6rem
}

.logo-bank294.w40,
.logo-kcis3560.w40 {
    background-position: -96rem -24rem
}

.logo-bank294.w44,
.logo-kcis3560.w44 {
    background-position: -105.6rem -26.4rem
}

.logo-bank294.w50,
.logo-kcis3560.w50 {
    background-position: -120rem -30rem
}

.logo-bank294.w52,
.logo-kcis3560.w52 {
    background-position: -124.8rem -31.2rem
}

.logo-bank294.w60,
.logo-kcis3560.w60 {
    background-position: -144rem -36rem
}

.logo-bank294.w64,
.logo-kcis3560.w64 {
    background-position: -153.6rem -38.4rem
}

.logo-bank294.w65,
.logo-kcis3560.w65 {
    background-position: -156rem -39rem
}

.logo-bank294.w72,
.logo-kcis3560.w72 {
    background-position: -172.8rem -43.2rem
}

/*! component element icon 보험 ======================================== */

/*! 하나생명보험 */

.logo-bank401.w16,
.logo-kcis2073.w16 {
    background-position: -41.6rem -19.2rem
}

.logo-bank401.w20,
.logo-kcis2073.w20 {
    background-position: -52rem -24rem
}

.logo-bank401.w22,
.logo-kcis2073.w22 {
    background-position: -57.2rem -26.4rem
}

.logo-bank401.w24,
.logo-kcis2073.w24 {
    background-position: -62.4rem -28.8rem
}

.logo-bank401.w28,
.logo-kcis2073.w28 {
    background-position: -72.8rem -33.6rem
}

.logo-bank401.w30,
.logo-kcis2073.w30 {
    background-position: -78rem -36rem
}

.logo-bank401.w32,
.logo-kcis2073.w32 {
    background-position: -83.2rem -38.4rem
}

.logo-bank401.w34,
.logo-kcis2073.w34 {
    background-position: -88.4rem -40.8rem
}

.logo-bank401.w36,
.logo-kcis2073.w36 {
    background-position: -93.6rem -43.2rem
}

.logo-bank401.w40,
.logo-kcis2073.w40 {
    background-position: -104rem -48rem
}

.logo-bank401.w44,
.logo-kcis2073.w44 {
    background-position: -114.4rem -52.8rem
}

.logo-bank401.w50,
.logo-kcis2073.w50 {
    background-position: -130rem -60rem
}

.logo-bank401.w52,
.logo-kcis2073.w52 {
    background-position: -135.2rem -62.4rem
}

.logo-bank401.w60,
.logo-kcis2073.w60 {
    background-position: -156rem -72rem
}

.logo-bank401.w64,
.logo-kcis2073.w64 {
    background-position: -166.4rem -76.8rem
}

.logo-bank401.w65,
.logo-kcis2073.w65 {
    background-position: -169rem -78rem
}

.logo-bank401.w72,
.logo-kcis2073.w72 {
    background-position: -187.2rem -86.4rem
}

/*! 동양생명 */

.logo-bank402.w16,
.logo-bankL74.w16,
.logo-kcb20403.w16,
.logo-kcis2053.w16 {
    background-position: -41.6rem -22.4rem
}

.logo-bank402.w20,
.logo-bankL74.w20,
.logo-kcb20403.w20,
.logo-kcis2053.w20 {
    background-position: -52rem -28rem
}

.logo-bank402.w22,
.logo-bankL74.w22,
.logo-kcb20403.w22,
.logo-kcis2053.w22 {
    background-position: -57.2rem -30.8rem
}

.logo-bank402.w24,
.logo-bankL74.w24,
.logo-kcb20403.w24,
.logo-kcis2053.w24 {
    background-position: -62.4rem -33.6rem
}

.logo-bank402.w28,
.logo-bankL74.w28,
.logo-kcb20403.w28,
.logo-kcis2053.w28 {
    background-position: -72.8rem -39.2rem
}

.logo-bank402.w30,
.logo-bankL74.w30,
.logo-kcb20403.w30,
.logo-kcis2053.w30 {
    background-position: -78rem -42rem
}

.logo-bank402.w32,
.logo-bankL74.w32,
.logo-kcb20403.w32,
.logo-kcis2053.w32 {
    background-position: -83.2rem -44.8rem
}

.logo-bank402.w34,
.logo-bankL74.w34,
.logo-kcb20403.w34,
.logo-kcis2053.w34 {
    background-position: -88.4rem -47.6rem
}

.logo-bank402.w36,
.logo-bankL74.w36,
.logo-kcb20403.w36,
.logo-kcis2053.w36 {
    background-position: -93.6rem -50.4rem
}

.logo-bank402.w40,
.logo-bankL74.w40,
.logo-kcb20403.w40,
.logo-kcis2053.w40 {
    background-position: -104rem -56rem
}

.logo-bank402.w44,
.logo-bankL74.w44,
.logo-kcb20403.w44,
.logo-kcis2053.w44 {
    background-position: -114.4rem -61.6rem
}

.logo-bank402.w50,
.logo-bankL74.w50,
.logo-kcb20403.w50,
.logo-kcis2053.w50 {
    background-position: -130rem -70rem
}

.logo-bank402.w52,
.logo-bankL74.w52,
.logo-kcb20403.w52,
.logo-kcis2053.w52 {
    background-position: -135.2rem -72.8rem
}

.logo-bank402.w60,
.logo-bankL74.w60,
.logo-kcb20403.w60,
.logo-kcis2053.w60 {
    background-position: -156rem -84rem
}

.logo-bank402.w64,
.logo-bankL74.w64,
.logo-kcb20403.w64,
.logo-kcis2053.w64 {
    background-position: -166.4rem -89.6rem
}

.logo-bank402.w65,
.logo-bankL74.w65,
.logo-kcb20403.w65,
.logo-kcis2053.w65 {
    background-position: -169rem -91rem
}

.logo-bank402.w72,
.logo-bankL74.w72,
.logo-kcb20403.w72,
.logo-kcis2053.w72 {
    background-position: -187.2rem -100.8rem
}

/*! 흥국화재 */

.logo-bank403.w16,
.logo-bankN05.w16,
.logo-kcis2015.w16 {
    background-position: -41.6rem -25.6rem
}

.logo-bank403.w20,
.logo-bankN05.w20,
.logo-kcis2015.w20 {
    background-position: -52rem -32rem
}

.logo-bank403.w22,
.logo-bankN05.w22,
.logo-kcis2015.w22 {
    background-position: -57.2rem -35.2rem
}

.logo-bank403.w24,
.logo-bankN05.w24,
.logo-kcis2015.w24 {
    background-position: -62.4rem -38.4rem
}

.logo-bank403.w28,
.logo-bankN05.w28,
.logo-kcis2015.w28 {
    background-position: -72.8rem -44.8rem
}

.logo-bank403.w30,
.logo-bankN05.w30,
.logo-kcis2015.w30 {
    background-position: -78rem -48rem
}

.logo-bank403.w32,
.logo-bankN05.w32,
.logo-kcis2015.w32 {
    background-position: -83.2rem -51.2rem
}

.logo-bank403.w34,
.logo-bankN05.w34,
.logo-kcis2015.w34 {
    background-position: -88.4rem -54.4rem
}

.logo-bank403.w36,
.logo-bankN05.w36,
.logo-kcis2015.w36 {
    background-position: -93.6rem -57.6rem
}

.logo-bank403.w40,
.logo-bankN05.w40,
.logo-kcis2015.w40 {
    background-position: -104rem -64rem
}

.logo-bank403.w44,
.logo-bankN05.w44,
.logo-kcis2015.w44 {
    background-position: -114.4rem -70.4rem
}

.logo-bank403.w50,
.logo-bankN05.w50,
.logo-kcis2015.w50 {
    background-position: -130rem -80rem
}

.logo-bank403.w52,
.logo-bankN05.w52,
.logo-kcis2015.w52 {
    background-position: -135.2rem -83.2rem
}

.logo-bank403.w60,
.logo-bankN05.w60,
.logo-kcis2015.w60 {
    background-position: -156rem -96rem
}

.logo-bank403.w64,
.logo-bankN05.w64,
.logo-kcis2015.w64 {
    background-position: -166.4rem -102.4rem
}

.logo-bank403.w65,
.logo-bankN05.w65,
.logo-kcis2015.w65 {
    background-position: -169rem -104rem
}

.logo-bank403.w72,
.logo-bankN05.w72,
.logo-kcis2015.w72 {
    background-position: -187.2rem -115.2rem
}

/*! BNP파리바 카디프 생명 */

.logo-bank404.w16,
.logo-bankL78.w16,
.logo-kcis2035.w16,
.logo-kcis2072.w16 {
    background-position: -41.6rem -28.8rem
}

.logo-bank404.w20,
.logo-bankL78.w20,
.logo-kcis2035.w20,
.logo-kcis2072.w20 {
    background-position: -52rem -36rem
}

.logo-bank404.w22,
.logo-bankL78.w22,
.logo-kcis2035.w22,
.logo-kcis2072.w22 {
    background-position: -57.2rem -39.6rem
}

.logo-bank404.w24,
.logo-bankL78.w24,
.logo-kcis2035.w24,
.logo-kcis2072.w24 {
    background-position: -62.4rem -43.2rem
}

.logo-bank404.w28,
.logo-bankL78.w28,
.logo-kcis2035.w28,
.logo-kcis2072.w28 {
    background-position: -72.8rem -50.4rem
}

.logo-bank404.w30,
.logo-bankL78.w30,
.logo-kcis2035.w30,
.logo-kcis2072.w30 {
    background-position: -78rem -54rem
}

.logo-bank404.w32,
.logo-bankL78.w32,
.logo-kcis2035.w32,
.logo-kcis2072.w32 {
    background-position: -83.2rem -57.6rem
}

.logo-bank404.w34,
.logo-bankL78.w34,
.logo-kcis2035.w34,
.logo-kcis2072.w34 {
    background-position: -88.4rem -61.2rem
}

.logo-bank404.w36,
.logo-bankL78.w36,
.logo-kcis2035.w36,
.logo-kcis2072.w36 {
    background-position: -93.6rem -64.8rem
}

.logo-bank404.w40,
.logo-bankL78.w40,
.logo-kcis2035.w40,
.logo-kcis2072.w40 {
    background-position: -104rem -72rem
}

.logo-bank404.w44,
.logo-bankL78.w44,
.logo-kcis2035.w44,
.logo-kcis2072.w44 {
    background-position: -114.4rem -79.2rem
}

.logo-bank404.w50,
.logo-bankL78.w50,
.logo-kcis2035.w50,
.logo-kcis2072.w50 {
    background-position: -130rem -90rem
}

.logo-bank404.w52,
.logo-bankL78.w52,
.logo-kcis2035.w52,
.logo-kcis2072.w52 {
    background-position: -135.2rem -93.6rem
}

.logo-bank404.w60,
.logo-bankL78.w60,
.logo-kcis2035.w60,
.logo-kcis2072.w60 {
    background-position: -156rem -108rem
}

.logo-bank404.w64,
.logo-bankL78.w64,
.logo-kcis2035.w64,
.logo-kcis2072.w64 {
    background-position: -166.4rem -115.2rem
}

.logo-bank404.w65,
.logo-bankL78.w65,
.logo-kcis2035.w65,
.logo-kcis2072.w65 {
    background-position: -169rem -117rem
}

.logo-bank404.w72,
.logo-bankL78.w72,
.logo-kcis2035.w72,
.logo-kcis2072.w72 {
    background-position: -187.2rem -129.6rem
}

/*! AIG손해보험 */

.logo-bank405.w16,
.logo-bankN17.w16,
.logo-kcis2025.w16 {
    background-position: -41.6rem -32rem
}

.logo-bank405.w20,
.logo-bankN17.w20,
.logo-kcis2025.w20 {
    background-position: -52rem -40rem
}

.logo-bank405.w22,
.logo-bankN17.w22,
.logo-kcis2025.w22 {
    background-position: -57.2rem -44rem
}

.logo-bank405.w24,
.logo-bankN17.w24,
.logo-kcis2025.w24 {
    background-position: -62.4rem -48rem
}

.logo-bank405.w28,
.logo-bankN17.w28,
.logo-kcis2025.w28 {
    background-position: -72.8rem -56rem
}

.logo-bank405.w30,
.logo-bankN17.w30,
.logo-kcis2025.w30 {
    background-position: -78rem -60rem
}

.logo-bank405.w32,
.logo-bankN17.w32,
.logo-kcis2025.w32 {
    background-position: -83.2rem -64rem
}

.logo-bank405.w34,
.logo-bankN17.w34,
.logo-kcis2025.w34 {
    background-position: -88.4rem -68rem
}

.logo-bank405.w36,
.logo-bankN17.w36,
.logo-kcis2025.w36 {
    background-position: -93.6rem -72rem
}

.logo-bank405.w40,
.logo-bankN17.w40,
.logo-kcis2025.w40 {
    background-position: -104rem -80rem
}

.logo-bank405.w44,
.logo-bankN17.w44,
.logo-kcis2025.w44 {
    background-position: -114.4rem -88rem
}

.logo-bank405.w50,
.logo-bankN17.w50,
.logo-kcis2025.w50 {
    background-position: -130rem -100rem
}

.logo-bank405.w52,
.logo-bankN17.w52,
.logo-kcis2025.w52 {
    background-position: -135.2rem -104rem
}

.logo-bank405.w60,
.logo-bankN17.w60,
.logo-kcis2025.w60 {
    background-position: -156rem -120rem
}

.logo-bank405.w64,
.logo-bankN17.w64,
.logo-kcis2025.w64 {
    background-position: -166.4rem -128rem
}

.logo-bank405.w65,
.logo-bankN17.w65,
.logo-kcis2025.w65 {
    background-position: -169rem -130rem
}

.logo-bank405.w72,
.logo-bankN17.w72,
.logo-kcis2025.w72 {
    background-position: -187.2rem -144rem
}

/*! 하나손해보험 */

.logo-bank406.w16,
.logo-kcis2032.w16 {
    background-position: -41.6rem -35.2rem
}

.logo-bank406.w20,
.logo-kcis2032.w20 {
    background-position: -52rem -44rem
}

.logo-bank406.w22,
.logo-kcis2032.w22 {
    background-position: -57.2rem -48.4rem
}

.logo-bank406.w24,
.logo-kcis2032.w24 {
    background-position: -62.4rem -52.8rem
}

.logo-bank406.w28,
.logo-kcis2032.w28 {
    background-position: -72.8rem -61.6rem
}

.logo-bank406.w30,
.logo-kcis2032.w30 {
    background-position: -78rem -66rem
}

.logo-bank406.w32,
.logo-kcis2032.w32 {
    background-position: -83.2rem -70.4rem
}

.logo-bank406.w34,
.logo-kcis2032.w34 {
    background-position: -88.4rem -74.8rem
}

.logo-bank406.w36,
.logo-kcis2032.w36 {
    background-position: -93.6rem -79.2rem
}

.logo-bank406.w40,
.logo-kcis2032.w40 {
    background-position: -104rem -88rem
}

.logo-bank406.w44,
.logo-kcis2032.w44 {
    background-position: -114.4rem -96.8rem
}

.logo-bank406.w50,
.logo-kcis2032.w50 {
    background-position: -130rem -110rem
}

.logo-bank406.w52,
.logo-kcis2032.w52 {
    background-position: -135.2rem -114.4rem
}

.logo-bank406.w60,
.logo-kcis2032.w60 {
    background-position: -156rem -132rem
}

.logo-bank406.w64,
.logo-kcis2032.w64 {
    background-position: -166.4rem -140.8rem
}

.logo-bank406.w65,
.logo-kcis2032.w65 {
    background-position: -169rem -143rem
}

.logo-bank406.w72,
.logo-kcis2032.w72 {
    background-position: -187.2rem -158.4rem
}

/*! 미래에셋생명 */

.logo-bank431.w16,
.logo-bankL34.w16,
.logo-kcb20409.w16,
.logo-kcis2057.w16 {
    background-position: -41.6rem -38.4rem
}

.logo-bank431.w20,
.logo-bankL34.w20,
.logo-kcb20409.w20,
.logo-kcis2057.w20 {
    background-position: -52rem -48rem
}

.logo-bank431.w22,
.logo-bankL34.w22,
.logo-kcb20409.w22,
.logo-kcis2057.w22 {
    background-position: -57.2rem -52.8rem
}

.logo-bank431.w24,
.logo-bankL34.w24,
.logo-kcb20409.w24,
.logo-kcis2057.w24 {
    background-position: -62.4rem -57.6rem
}

.logo-bank431.w28,
.logo-bankL34.w28,
.logo-kcb20409.w28,
.logo-kcis2057.w28 {
    background-position: -72.8rem -67.2rem
}

.logo-bank431.w30,
.logo-bankL34.w30,
.logo-kcb20409.w30,
.logo-kcis2057.w30 {
    background-position: -78rem -72rem
}

.logo-bank431.w32,
.logo-bankL34.w32,
.logo-kcb20409.w32,
.logo-kcis2057.w32 {
    background-position: -83.2rem -76.8rem
}

.logo-bank431.w34,
.logo-bankL34.w34,
.logo-kcb20409.w34,
.logo-kcis2057.w34 {
    background-position: -88.4rem -81.6rem
}

.logo-bank431.w36,
.logo-bankL34.w36,
.logo-kcb20409.w36,
.logo-kcis2057.w36 {
    background-position: -93.6rem -86.4rem
}

.logo-bank431.w40,
.logo-bankL34.w40,
.logo-kcb20409.w40,
.logo-kcis2057.w40 {
    background-position: -104rem -96rem
}

.logo-bank431.w44,
.logo-bankL34.w44,
.logo-kcb20409.w44,
.logo-kcis2057.w44 {
    background-position: -114.4rem -105.6rem
}

.logo-bank431.w50,
.logo-bankL34.w50,
.logo-kcb20409.w50,
.logo-kcis2057.w50 {
    background-position: -130rem -120rem
}

.logo-bank431.w52,
.logo-bankL34.w52,
.logo-kcb20409.w52,
.logo-kcis2057.w52 {
    background-position: -135.2rem -124.8rem
}

.logo-bank431.w60,
.logo-bankL34.w60,
.logo-kcb20409.w60,
.logo-kcis2057.w60 {
    background-position: -156rem -144rem
}

.logo-bank431.w64,
.logo-bankL34.w64,
.logo-kcb20409.w64,
.logo-kcis2057.w64 {
    background-position: -166.4rem -153.6rem
}

.logo-bank431.w65,
.logo-bankL34.w65,
.logo-kcb20409.w65,
.logo-kcis2057.w65 {
    background-position: -169rem -156rem
}

.logo-bank431.w72,
.logo-bankL34.w72,
.logo-kcb20409.w72,
.logo-kcis2057.w72 {
    background-position: -187.2rem -172.8rem
}

/*! 한화생명 */

.logo-bank432.w16,
.logo-bankL01.w16,
.logo-kcis2040.w16 {
    background-position: 0 -41.6rem
}

.logo-bank432.w20,
.logo-bankL01.w20,
.logo-kcis2040.w20 {
    background-position: 0 -52rem
}

.logo-bank432.w22,
.logo-bankL01.w22,
.logo-kcis2040.w22 {
    background-position: 0 -57.2rem
}

.logo-bank432.w24,
.logo-bankL01.w24,
.logo-kcis2040.w24 {
    background-position: 0 -62.4rem
}

.logo-bank432.w28,
.logo-bankL01.w28,
.logo-kcis2040.w28 {
    background-position: 0 -72.8rem
}

.logo-bank432.w30,
.logo-bankL01.w30,
.logo-kcis2040.w30 {
    background-position: 0 -78rem
}

.logo-bank432.w32,
.logo-bankL01.w32,
.logo-kcis2040.w32 {
    background-position: 0 -83.2rem
}

.logo-bank432.w34,
.logo-bankL01.w34,
.logo-kcis2040.w34 {
    background-position: 0 -88.4rem
}

.logo-bank432.w36,
.logo-bankL01.w36,
.logo-kcis2040.w36 {
    background-position: 0 -93.6rem
}

.logo-bank432.w40,
.logo-bankL01.w40,
.logo-kcis2040.w40 {
    background-position: 0 -104rem
}

.logo-bank432.w44,
.logo-bankL01.w44,
.logo-kcis2040.w44 {
    background-position: 0 -114.4rem
}

.logo-bank432.w50,
.logo-bankL01.w50,
.logo-kcis2040.w50 {
    background-position: 0 -130rem
}

.logo-bank432.w52,
.logo-bankL01.w52,
.logo-kcis2040.w52 {
    background-position: 0 -135.2rem
}

.logo-bank432.w60,
.logo-bankL01.w60,
.logo-kcis2040.w60 {
    background-position: 0 -156rem
}

.logo-bank432.w64,
.logo-bankL01.w64,
.logo-kcis2040.w64 {
    background-position: 0 -166.4rem
}

.logo-bank432.w65,
.logo-bankL01.w65,
.logo-kcis2040.w65 {
    background-position: 0 -169rem
}

.logo-bank432.w72,
.logo-bankL01.w72,
.logo-kcis2040.w72 {
    background-position: 0 -187.2rem
}

/*! 교보라이프플래닛생명 */

.logo-bank433.w16,
.logo-bankL43.w16,
.logo-kcis2082.w16 {
    background-position: -3.2rem -41.6rem
}

.logo-bank433.w20,
.logo-bankL43.w20,
.logo-kcis2082.w20 {
    background-position: -4rem -52rem
}

.logo-bank433.w22,
.logo-bankL43.w22,
.logo-kcis2082.w22 {
    background-position: -4.4rem -57.2rem
}

.logo-bank433.w24,
.logo-bankL43.w24,
.logo-kcis2082.w24 {
    background-position: -4.8rem -62.4rem
}

.logo-bank433.w28,
.logo-bankL43.w28,
.logo-kcis2082.w28 {
    background-position: -5.6rem -72.8rem
}

.logo-bank433.w30,
.logo-bankL43.w30,
.logo-kcis2082.w30 {
    background-position: -6rem -78rem
}

.logo-bank433.w32,
.logo-bankL43.w32,
.logo-kcis2082.w32 {
    background-position: -6.4rem -83.2rem
}

.logo-bank433.w34,
.logo-bankL43.w34,
.logo-kcis2082.w34 {
    background-position: -6.8rem -88.4rem
}

.logo-bank433.w36,
.logo-bankL43.w36,
.logo-kcis2082.w36 {
    background-position: -7.2rem -93.6rem
}

.logo-bank433.w40,
.logo-bankL43.w40,
.logo-kcis2082.w40 {
    background-position: -8rem -104rem
}

.logo-bank433.w44,
.logo-bankL43.w44,
.logo-kcis2082.w44 {
    background-position: -8.8rem -114.4rem
}

.logo-bank433.w50,
.logo-bankL43.w50,
.logo-kcis2082.w50 {
    background-position: -10rem -130rem
}

.logo-bank433.w52,
.logo-bankL43.w52,
.logo-kcis2082.w52 {
    background-position: -10.4rem -135.2rem
}

.logo-bank433.w60,
.logo-bankL43.w60,
.logo-kcis2082.w60 {
    background-position: -12rem -156rem
}

.logo-bank433.w64,
.logo-bankL43.w64,
.logo-kcis2082.w64 {
    background-position: -12.8rem -166.4rem
}

.logo-bank433.w65,
.logo-bankL43.w65,
.logo-kcis2082.w65 {
    background-position: -13rem -169rem
}

.logo-bank433.w72,
.logo-bankL43.w72,
.logo-kcis2082.w72 {
    background-position: -14.4rem -187.2rem
}

/*! 푸본현대생명 */

.logo-bank434.w16,
.logo-kcb20408.w16,
.logo-kcis2074.w16 {
    background-position: -6.4rem -41.6rem
}

.logo-bank434.w20,
.logo-kcb20408.w20,
.logo-kcis2074.w20 {
    background-position: -8rem -52rem
}

.logo-bank434.w22,
.logo-kcb20408.w22,
.logo-kcis2074.w22 {
    background-position: -8.8rem -57.2rem
}

.logo-bank434.w24,
.logo-kcb20408.w24,
.logo-kcis2074.w24 {
    background-position: -9.6rem -62.4rem
}

.logo-bank434.w28,
.logo-kcb20408.w28,
.logo-kcis2074.w28 {
    background-position: -11.2rem -72.8rem
}

.logo-bank434.w30,
.logo-kcb20408.w30,
.logo-kcis2074.w30 {
    background-position: -12rem -78rem
}

.logo-bank434.w32,
.logo-kcb20408.w32,
.logo-kcis2074.w32 {
    background-position: -12.8rem -83.2rem
}

.logo-bank434.w34,
.logo-kcb20408.w34,
.logo-kcis2074.w34 {
    background-position: -13.6rem -88.4rem
}

.logo-bank434.w36,
.logo-kcb20408.w36,
.logo-kcis2074.w36 {
    background-position: -14.4rem -93.6rem
}

.logo-bank434.w40,
.logo-kcb20408.w40,
.logo-kcis2074.w40 {
    background-position: -16rem -104rem
}

.logo-bank434.w44,
.logo-kcb20408.w44,
.logo-kcis2074.w44 {
    background-position: -17.6rem -114.4rem
}

.logo-bank434.w50,
.logo-kcb20408.w50,
.logo-kcis2074.w50 {
    background-position: -20rem -130rem
}

.logo-bank434.w52,
.logo-kcb20408.w52,
.logo-kcis2074.w52 {
    background-position: -20.8rem -135.2rem
}

.logo-bank434.w60,
.logo-kcb20408.w60,
.logo-kcis2074.w60 {
    background-position: -24rem -156rem
}

.logo-bank434.w64,
.logo-kcb20408.w64,
.logo-kcis2074.w64 {
    background-position: -25.6rem -166.4rem
}

.logo-bank434.w65,
.logo-kcb20408.w65,
.logo-kcis2074.w65 {
    background-position: -26rem -169rem
}

.logo-bank434.w72,
.logo-kcb20408.w72,
.logo-kcis2074.w72 {
    background-position: -28.8rem -187.2rem
}

/*! 라이나생명 */

.logo-bank435.w16,
.logo-bankL51.w16,
.logo-kcis2070.w16 {
    background-position: -9.6rem -41.6rem
}

.logo-bank435.w20,
.logo-bankL51.w20,
.logo-kcis2070.w20 {
    background-position: -12rem -52rem
}

.logo-bank435.w22,
.logo-bankL51.w22,
.logo-kcis2070.w22 {
    background-position: -13.2rem -57.2rem
}

.logo-bank435.w24,
.logo-bankL51.w24,
.logo-kcis2070.w24 {
    background-position: -14.4rem -62.4rem
}

.logo-bank435.w28,
.logo-bankL51.w28,
.logo-kcis2070.w28 {
    background-position: -16.8rem -72.8rem
}

.logo-bank435.w30,
.logo-bankL51.w30,
.logo-kcis2070.w30 {
    background-position: -18rem -78rem
}

.logo-bank435.w32,
.logo-bankL51.w32,
.logo-kcis2070.w32 {
    background-position: -19.2rem -83.2rem
}

.logo-bank435.w34,
.logo-bankL51.w34,
.logo-kcis2070.w34 {
    background-position: -20.4rem -88.4rem
}

.logo-bank435.w36,
.logo-bankL51.w36,
.logo-kcis2070.w36 {
    background-position: -21.6rem -93.6rem
}

.logo-bank435.w40,
.logo-bankL51.w40,
.logo-kcis2070.w40 {
    background-position: -24rem -104rem
}

.logo-bank435.w44,
.logo-bankL51.w44,
.logo-kcis2070.w44 {
    background-position: -26.4rem -114.4rem
}

.logo-bank435.w50,
.logo-bankL51.w50,
.logo-kcis2070.w50 {
    background-position: -30rem -130rem
}

.logo-bank435.w52,
.logo-bankL51.w52,
.logo-kcis2070.w52 {
    background-position: -31.2rem -135.2rem
}

.logo-bank435.w60,
.logo-bankL51.w60,
.logo-kcis2070.w60 {
    background-position: -36rem -156rem
}

.logo-bank435.w64,
.logo-bankL51.w64,
.logo-kcis2070.w64 {
    background-position: -38.4rem -166.4rem
}

.logo-bank435.w65,
.logo-bankL51.w65,
.logo-kcis2070.w65 {
    background-position: -39rem -169rem
}

.logo-bank435.w72,
.logo-bankL51.w72,
.logo-kcis2070.w72 {
    background-position: -43.2rem -187.2rem
}

/*! 교보생명 */

.logo-bank436.w16,
.logo-bankL05.w16,
.logo-kcis2044.w16 {
    background-position: -12.8rem -41.6rem
}

.logo-bank436.w20,
.logo-bankL05.w20,
.logo-kcis2044.w20 {
    background-position: -16rem -52rem
}

.logo-bank436.w22,
.logo-bankL05.w22,
.logo-kcis2044.w22 {
    background-position: -17.6rem -57.2rem
}

.logo-bank436.w24,
.logo-bankL05.w24,
.logo-kcis2044.w24 {
    background-position: -19.2rem -62.4rem
}

.logo-bank436.w28,
.logo-bankL05.w28,
.logo-kcis2044.w28 {
    background-position: -22.4rem -72.8rem
}

.logo-bank436.w30,
.logo-bankL05.w30,
.logo-kcis2044.w30 {
    background-position: -24rem -78rem
}

.logo-bank436.w32,
.logo-bankL05.w32,
.logo-kcis2044.w32 {
    background-position: -25.6rem -83.2rem
}

.logo-bank436.w34,
.logo-bankL05.w34,
.logo-kcis2044.w34 {
    background-position: -27.2rem -88.4rem
}

.logo-bank436.w36,
.logo-bankL05.w36,
.logo-kcis2044.w36 {
    background-position: -28.8rem -93.6rem
}

.logo-bank436.w40,
.logo-bankL05.w40,
.logo-kcis2044.w40 {
    background-position: -32rem -104rem
}

.logo-bank436.w44,
.logo-bankL05.w44,
.logo-kcis2044.w44 {
    background-position: -35.2rem -114.4rem
}

.logo-bank436.w50,
.logo-bankL05.w50,
.logo-kcis2044.w50 {
    background-position: -40rem -130rem
}

.logo-bank436.w52,
.logo-bankL05.w52,
.logo-kcis2044.w52 {
    background-position: -41.6rem -135.2rem
}

.logo-bank436.w60,
.logo-bankL05.w60,
.logo-kcis2044.w60 {
    background-position: -48rem -156rem
}

.logo-bank436.w64,
.logo-bankL05.w64,
.logo-kcis2044.w64 {
    background-position: -51.2rem -166.4rem
}

.logo-bank436.w65,
.logo-bankL05.w65,
.logo-kcis2044.w65 {
    background-position: -52rem -169rem
}

.logo-bank436.w72,
.logo-bankL05.w72,
.logo-kcis2044.w72 {
    background-position: -57.6rem -187.2rem
}

/*! 에이비엘생명 */

.logo-bank437.w16,
.logo-bankL02.w16,
.logo-kcis2041.w16 {
    background-position: -16rem -41.6rem
}

.logo-bank437.w20,
.logo-bankL02.w20,
.logo-kcis2041.w20 {
    background-position: -20rem -52rem
}

.logo-bank437.w22,
.logo-bankL02.w22,
.logo-kcis2041.w22 {
    background-position: -22rem -57.2rem
}

.logo-bank437.w24,
.logo-bankL02.w24,
.logo-kcis2041.w24 {
    background-position: -24rem -62.4rem
}

.logo-bank437.w28,
.logo-bankL02.w28,
.logo-kcis2041.w28 {
    background-position: -28rem -72.8rem
}

.logo-bank437.w30,
.logo-bankL02.w30,
.logo-kcis2041.w30 {
    background-position: -30rem -78rem
}

.logo-bank437.w32,
.logo-bankL02.w32,
.logo-kcis2041.w32 {
    background-position: -32rem -83.2rem
}

.logo-bank437.w34,
.logo-bankL02.w34,
.logo-kcis2041.w34 {
    background-position: -34rem -88.4rem
}

.logo-bank437.w36,
.logo-bankL02.w36,
.logo-kcis2041.w36 {
    background-position: -36rem -93.6rem
}

.logo-bank437.w40,
.logo-bankL02.w40,
.logo-kcis2041.w40 {
    background-position: -40rem -104rem
}

.logo-bank437.w44,
.logo-bankL02.w44,
.logo-kcis2041.w44 {
    background-position: -44rem -114.4rem
}

.logo-bank437.w50,
.logo-bankL02.w50,
.logo-kcis2041.w50 {
    background-position: -50rem -130rem
}

.logo-bank437.w52,
.logo-bankL02.w52,
.logo-kcis2041.w52 {
    background-position: -52rem -135.2rem
}

.logo-bank437.w60,
.logo-bankL02.w60,
.logo-kcis2041.w60 {
    background-position: -60rem -156rem
}

.logo-bank437.w64,
.logo-bankL02.w64,
.logo-kcis2041.w64 {
    background-position: -64rem -166.4rem
}

.logo-bank437.w65,
.logo-bankL02.w65,
.logo-kcis2041.w65 {
    background-position: -65rem -169rem
}

.logo-bank437.w72,
.logo-bankL02.w72,
.logo-kcis2041.w72 {
    background-position: -72rem -187.2rem
}

/*! 신한라이프생명보험 */

.logo-bank438.w16,
.logo-kcis2051.w16 {
    background-position: -19.2rem -41.6rem
}

.logo-bank438.w20,
.logo-kcis2051.w20 {
    background-position: -24rem -52rem
}

.logo-bank438.w22,
.logo-kcis2051.w22 {
    background-position: -26.4rem -57.2rem
}

.logo-bank438.w24,
.logo-kcis2051.w24 {
    background-position: -28.8rem -62.4rem
}

.logo-bank438.w28,
.logo-kcis2051.w28 {
    background-position: -33.6rem -72.8rem
}

.logo-bank438.w30,
.logo-kcis2051.w30 {
    background-position: -36rem -78rem
}

.logo-bank438.w32,
.logo-kcis2051.w32 {
    background-position: -38.4rem -83.2rem
}

.logo-bank438.w34,
.logo-kcis2051.w34 {
    background-position: -40.8rem -88.4rem
}

.logo-bank438.w36,
.logo-kcis2051.w36 {
    background-position: -43.2rem -93.6rem
}

.logo-bank438.w40,
.logo-kcis2051.w40 {
    background-position: -48rem -104rem
}

.logo-bank438.w44,
.logo-kcis2051.w44 {
    background-position: -52.8rem -114.4rem
}

.logo-bank438.w50,
.logo-kcis2051.w50 {
    background-position: -60rem -130rem
}

.logo-bank438.w52,
.logo-kcis2051.w52 {
    background-position: -62.4rem -135.2rem
}

.logo-bank438.w60,
.logo-kcis2051.w60 {
    background-position: -72rem -156rem
}

.logo-bank438.w64,
.logo-kcis2051.w64 {
    background-position: -76.8rem -166.4rem
}

.logo-bank438.w65,
.logo-kcis2051.w65 {
    background-position: -78rem -169rem
}

.logo-bank438.w72,
.logo-kcis2051.w72 {
    background-position: -86.4rem -187.2rem
}

/*! KB생명보험 */

.logo-bank439.w16,
.logo-bankL39.w16,
.logo-kcis2080.w16 {
    background-position: -22.4rem -41.6rem
}

.logo-bank439.w20,
.logo-bankL39.w20,
.logo-kcis2080.w20 {
    background-position: -28rem -52rem
}

.logo-bank439.w22,
.logo-bankL39.w22,
.logo-kcis2080.w22 {
    background-position: -30.8rem -57.2rem
}

.logo-bank439.w24,
.logo-bankL39.w24,
.logo-kcis2080.w24 {
    background-position: -33.6rem -62.4rem
}

.logo-bank439.w28,
.logo-bankL39.w28,
.logo-kcis2080.w28 {
    background-position: -39.2rem -72.8rem
}

.logo-bank439.w30,
.logo-bankL39.w30,
.logo-kcis2080.w30 {
    background-position: -42rem -78rem
}

.logo-bank439.w32,
.logo-bankL39.w32,
.logo-kcis2080.w32 {
    background-position: -44.8rem -83.2rem
}

.logo-bank439.w34,
.logo-bankL39.w34,
.logo-kcis2080.w34 {
    background-position: -47.6rem -88.4rem
}

.logo-bank439.w36,
.logo-bankL39.w36,
.logo-kcis2080.w36 {
    background-position: -50.4rem -93.6rem
}

.logo-bank439.w40,
.logo-bankL39.w40,
.logo-kcis2080.w40 {
    background-position: -56rem -104rem
}

.logo-bank439.w44,
.logo-bankL39.w44,
.logo-kcis2080.w44 {
    background-position: -61.6rem -114.4rem
}

.logo-bank439.w50,
.logo-bankL39.w50,
.logo-kcis2080.w50 {
    background-position: -70rem -130rem
}

.logo-bank439.w52,
.logo-bankL39.w52,
.logo-kcis2080.w52 {
    background-position: -72.8rem -135.2rem
}

.logo-bank439.w60,
.logo-bankL39.w60,
.logo-kcis2080.w60 {
    background-position: -84rem -156rem
}

.logo-bank439.w64,
.logo-bankL39.w64,
.logo-kcis2080.w64 {
    background-position: -89.6rem -166.4rem
}

.logo-bank439.w65,
.logo-bankL39.w65,
.logo-kcis2080.w65 {
    background-position: -91rem -169rem
}

.logo-bank439.w72,
.logo-bankL39.w72,
.logo-kcis2080.w72 {
    background-position: -100.8rem -187.2rem
}

/*! NH농협생명 */

.logo-bank440.w16,
.logo-kcis2076.w16 {
    background-position: -25.6rem -41.6rem
}

.logo-bank440.w20,
.logo-kcis2076.w20 {
    background-position: -32rem -52rem
}

.logo-bank440.w22,
.logo-kcis2076.w22 {
    background-position: -35.2rem -57.2rem
}

.logo-bank440.w24,
.logo-kcis2076.w24 {
    background-position: -38.4rem -62.4rem
}

.logo-bank440.w28,
.logo-kcis2076.w28 {
    background-position: -44.8rem -72.8rem
}

.logo-bank440.w30,
.logo-kcis2076.w30 {
    background-position: -48rem -78rem
}

.logo-bank440.w32,
.logo-kcis2076.w32 {
    background-position: -51.2rem -83.2rem
}

.logo-bank440.w34,
.logo-kcis2076.w34 {
    background-position: -54.4rem -88.4rem
}

.logo-bank440.w36,
.logo-kcis2076.w36 {
    background-position: -57.6rem -93.6rem
}

.logo-bank440.w40,
.logo-kcis2076.w40 {
    background-position: -64rem -104rem
}

.logo-bank440.w44,
.logo-kcis2076.w44 {
    background-position: -70.4rem -114.4rem
}

.logo-bank440.w50,
.logo-kcis2076.w50 {
    background-position: -80rem -130rem
}

.logo-bank440.w52,
.logo-kcis2076.w52 {
    background-position: -83.2rem -135.2rem
}

.logo-bank440.w60,
.logo-kcis2076.w60 {
    background-position: -96rem -156rem
}

.logo-bank440.w64,
.logo-kcis2076.w64 {
    background-position: -102.4rem -166.4rem
}

.logo-bank440.w65,
.logo-kcis2076.w65 {
    background-position: -104rem -169rem
}

.logo-bank440.w72,
.logo-kcis2076.w72 {
    background-position: -115.2rem -187.2rem
}

/*! 삼성화재 */

.logo-bank441.w16,
.logo-bankN08.w16,
.logo-kcb20411.w16,
.logo-kcis2018.w16 {
    background-position: -28.8rem -41.6rem
}

.logo-bank441.w20,
.logo-bankN08.w20,
.logo-kcb20411.w20,
.logo-kcis2018.w20 {
    background-position: -36rem -52rem
}

.logo-bank441.w22,
.logo-bankN08.w22,
.logo-kcb20411.w22,
.logo-kcis2018.w22 {
    background-position: -39.6rem -57.2rem
}

.logo-bank441.w24,
.logo-bankN08.w24,
.logo-kcb20411.w24,
.logo-kcis2018.w24 {
    background-position: -43.2rem -62.4rem
}

.logo-bank441.w28,
.logo-bankN08.w28,
.logo-kcb20411.w28,
.logo-kcis2018.w28 {
    background-position: -50.4rem -72.8rem
}

.logo-bank441.w30,
.logo-bankN08.w30,
.logo-kcb20411.w30,
.logo-kcis2018.w30 {
    background-position: -54rem -78rem
}

.logo-bank441.w32,
.logo-bankN08.w32,
.logo-kcb20411.w32,
.logo-kcis2018.w32 {
    background-position: -57.6rem -83.2rem
}

.logo-bank441.w34,
.logo-bankN08.w34,
.logo-kcb20411.w34,
.logo-kcis2018.w34 {
    background-position: -61.2rem -88.4rem
}

.logo-bank441.w36,
.logo-bankN08.w36,
.logo-kcb20411.w36,
.logo-kcis2018.w36 {
    background-position: -64.8rem -93.6rem
}

.logo-bank441.w40,
.logo-bankN08.w40,
.logo-kcb20411.w40,
.logo-kcis2018.w40 {
    background-position: -72rem -104rem
}

.logo-bank441.w44,
.logo-bankN08.w44,
.logo-kcb20411.w44,
.logo-kcis2018.w44 {
    background-position: -79.2rem -114.4rem
}

.logo-bank441.w50,
.logo-bankN08.w50,
.logo-kcb20411.w50,
.logo-kcis2018.w50 {
    background-position: -90rem -130rem
}

.logo-bank441.w52,
.logo-bankN08.w52,
.logo-kcb20411.w52,
.logo-kcis2018.w52 {
    background-position: -93.6rem -135.2rem
}

.logo-bank441.w60,
.logo-bankN08.w60,
.logo-kcb20411.w60,
.logo-kcis2018.w60 {
    background-position: -108rem -156rem
}

.logo-bank441.w64,
.logo-bankN08.w64,
.logo-kcb20411.w64,
.logo-kcis2018.w64 {
    background-position: -115.2rem -166.4rem
}

.logo-bank441.w65,
.logo-bankN08.w65,
.logo-kcb20411.w65,
.logo-kcis2018.w65 {
    background-position: -117rem -169rem
}

.logo-bank441.w72,
.logo-bankN08.w72,
.logo-kcb20411.w72,
.logo-kcis2018.w72 {
    background-position: -129.6rem -187.2rem
}

/*! 현대해상 */

.logo-bank442.w16,
.logo-bankN09.w16,
.logo-kcis2019.w16 {
    background-position: -32rem -41.6rem
}

.logo-bank442.w20,
.logo-bankN09.w20,
.logo-kcis2019.w20 {
    background-position: -40rem -52rem
}

.logo-bank442.w22,
.logo-bankN09.w22,
.logo-kcis2019.w22 {
    background-position: -44rem -57.2rem
}

.logo-bank442.w24,
.logo-bankN09.w24,
.logo-kcis2019.w24 {
    background-position: -48rem -62.4rem
}

.logo-bank442.w28,
.logo-bankN09.w28,
.logo-kcis2019.w28 {
    background-position: -56rem -72.8rem
}

.logo-bank442.w30,
.logo-bankN09.w30,
.logo-kcis2019.w30 {
    background-position: -60rem -78rem
}

.logo-bank442.w32,
.logo-bankN09.w32,
.logo-kcis2019.w32 {
    background-position: -64rem -83.2rem
}

.logo-bank442.w34,
.logo-bankN09.w34,
.logo-kcis2019.w34 {
    background-position: -68rem -88.4rem
}

.logo-bank442.w36,
.logo-bankN09.w36,
.logo-kcis2019.w36 {
    background-position: -72rem -93.6rem
}

.logo-bank442.w40,
.logo-bankN09.w40,
.logo-kcis2019.w40 {
    background-position: -80rem -104rem
}

.logo-bank442.w44,
.logo-bankN09.w44,
.logo-kcis2019.w44 {
    background-position: -88rem -114.4rem
}

.logo-bank442.w50,
.logo-bankN09.w50,
.logo-kcis2019.w50 {
    background-position: -100rem -130rem
}

.logo-bank442.w52,
.logo-bankN09.w52,
.logo-kcis2019.w52 {
    background-position: -104rem -135.2rem
}

.logo-bank442.w60,
.logo-bankN09.w60,
.logo-kcis2019.w60 {
    background-position: -120rem -156rem
}

.logo-bank442.w64,
.logo-bankN09.w64,
.logo-kcis2019.w64 {
    background-position: -128rem -166.4rem
}

.logo-bank442.w65,
.logo-bankN09.w65,
.logo-kcis2019.w65 {
    background-position: -130rem -169rem
}

.logo-bank442.w72,
.logo-bankN09.w72,
.logo-kcis2019.w72 {
    background-position: -144rem -187.2rem
}

/*! DB손해보험 */

.logo-bank443.w16,
.logo-bankN13.w16,
.logo-kcis2022.w16 {
    background-position: -35.2rem -41.6rem
}

.logo-bank443.w20,
.logo-bankN13.w20,
.logo-kcis2022.w20 {
    background-position: -44rem -52rem
}

.logo-bank443.w22,
.logo-bankN13.w22,
.logo-kcis2022.w22 {
    background-position: -48.4rem -57.2rem
}

.logo-bank443.w24,
.logo-bankN13.w24,
.logo-kcis2022.w24 {
    background-position: -52.8rem -62.4rem
}

.logo-bank443.w28,
.logo-bankN13.w28,
.logo-kcis2022.w28 {
    background-position: -61.6rem -72.8rem
}

.logo-bank443.w30,
.logo-bankN13.w30,
.logo-kcis2022.w30 {
    background-position: -66rem -78rem
}

.logo-bank443.w32,
.logo-bankN13.w32,
.logo-kcis2022.w32 {
    background-position: -70.4rem -83.2rem
}

.logo-bank443.w34,
.logo-bankN13.w34,
.logo-kcis2022.w34 {
    background-position: -74.8rem -88.4rem
}

.logo-bank443.w36,
.logo-bankN13.w36,
.logo-kcis2022.w36 {
    background-position: -79.2rem -93.6rem
}

.logo-bank443.w40,
.logo-bankN13.w40,
.logo-kcis2022.w40 {
    background-position: -88rem -104rem
}

.logo-bank443.w44,
.logo-bankN13.w44,
.logo-kcis2022.w44 {
    background-position: -96.8rem -114.4rem
}

.logo-bank443.w50,
.logo-bankN13.w50,
.logo-kcis2022.w50 {
    background-position: -110rem -130rem
}

.logo-bank443.w52,
.logo-bankN13.w52,
.logo-kcis2022.w52 {
    background-position: -114.4rem -135.2rem
}

.logo-bank443.w60,
.logo-bankN13.w60,
.logo-kcis2022.w60 {
    background-position: -132rem -156rem
}

.logo-bank443.w64,
.logo-bankN13.w64,
.logo-kcis2022.w64 {
    background-position: -140.8rem -166.4rem
}

.logo-bank443.w65,
.logo-bankN13.w65,
.logo-kcis2022.w65 {
    background-position: -143rem -169rem
}

.logo-bank443.w72,
.logo-bankN13.w72,
.logo-kcis2022.w72 {
    background-position: -158.4rem -187.2rem
}

/*! KB손해보험 */

.logo-bank444.w16,
.logo-bankN10.w16,
.logo-kcb20413.w16,
.logo-kcis2020.w16 {
    background-position: -38.4rem -41.6rem
}

.logo-bank444.w20,
.logo-bankN10.w20,
.logo-kcb20413.w20,
.logo-kcis2020.w20 {
    background-position: -48rem -52rem
}

.logo-bank444.w22,
.logo-bankN10.w22,
.logo-kcb20413.w22,
.logo-kcis2020.w22 {
    background-position: -52.8rem -57.2rem
}

.logo-bank444.w24,
.logo-bankN10.w24,
.logo-kcb20413.w24,
.logo-kcis2020.w24 {
    background-position: -57.6rem -62.4rem
}

.logo-bank444.w28,
.logo-bankN10.w28,
.logo-kcb20413.w28,
.logo-kcis2020.w28 {
    background-position: -67.2rem -72.8rem
}

.logo-bank444.w30,
.logo-bankN10.w30,
.logo-kcb20413.w30,
.logo-kcis2020.w30 {
    background-position: -72rem -78rem
}

.logo-bank444.w32,
.logo-bankN10.w32,
.logo-kcb20413.w32,
.logo-kcis2020.w32 {
    background-position: -76.8rem -83.2rem
}

.logo-bank444.w34,
.logo-bankN10.w34,
.logo-kcb20413.w34,
.logo-kcis2020.w34 {
    background-position: -81.6rem -88.4rem
}

.logo-bank444.w36,
.logo-bankN10.w36,
.logo-kcb20413.w36,
.logo-kcis2020.w36 {
    background-position: -86.4rem -93.6rem
}

.logo-bank444.w40,
.logo-bankN10.w40,
.logo-kcb20413.w40,
.logo-kcis2020.w40 {
    background-position: -96rem -104rem
}

.logo-bank444.w44,
.logo-bankN10.w44,
.logo-kcb20413.w44,
.logo-kcis2020.w44 {
    background-position: -105.6rem -114.4rem
}

.logo-bank444.w50,
.logo-bankN10.w50,
.logo-kcb20413.w50,
.logo-kcis2020.w50 {
    background-position: -120rem -130rem
}

.logo-bank444.w52,
.logo-bankN10.w52,
.logo-kcb20413.w52,
.logo-kcis2020.w52 {
    background-position: -124.8rem -135.2rem
}

.logo-bank444.w60,
.logo-bankN10.w60,
.logo-kcb20413.w60,
.logo-kcis2020.w60 {
    background-position: -144rem -156rem
}

.logo-bank444.w64,
.logo-bankN10.w64,
.logo-kcb20413.w64,
.logo-kcis2020.w64 {
    background-position: -153.6rem -166.4rem
}

.logo-bank444.w65,
.logo-bankN10.w65,
.logo-kcb20413.w65,
.logo-kcis2020.w65 {
    background-position: -156rem -169rem
}

.logo-bank444.w72,
.logo-bankN10.w72,
.logo-kcb20413.w72,
.logo-kcis2020.w72 {
    background-position: -172.8rem -187.2rem
}

/*! 롯데손해보험 */

.logo-bank445.w16,
.logo-bankN03.w16,
.logo-kcis2013.w16 {
    background-position: -41.6rem -41.6rem
}

.logo-bank445.w20,
.logo-bankN03.w20,
.logo-kcis2013.w20 {
    background-position: -52rem -52rem
}

.logo-bank445.w22,
.logo-bankN03.w22,
.logo-kcis2013.w22 {
    background-position: -57.2rem -57.2rem
}

.logo-bank445.w24,
.logo-bankN03.w24,
.logo-kcis2013.w24 {
    background-position: -62.4rem -62.4rem
}

.logo-bank445.w28,
.logo-bankN03.w28,
.logo-kcis2013.w28 {
    background-position: -72.8rem -72.8rem
}

.logo-bank445.w30,
.logo-bankN03.w30,
.logo-kcis2013.w30 {
    background-position: -78rem -78rem
}

.logo-bank445.w32,
.logo-bankN03.w32,
.logo-kcis2013.w32 {
    background-position: -83.2rem -83.2rem
}

.logo-bank445.w34,
.logo-bankN03.w34,
.logo-kcis2013.w34 {
    background-position: -88.4rem -88.4rem
}

.logo-bank445.w36,
.logo-bankN03.w36,
.logo-kcis2013.w36 {
    background-position: -93.6rem -93.6rem
}

.logo-bank445.w40,
.logo-bankN03.w40,
.logo-kcis2013.w40 {
    background-position: -104rem -104rem
}

.logo-bank445.w44,
.logo-bankN03.w44,
.logo-kcis2013.w44 {
    background-position: -114.4rem -114.4rem
}

.logo-bank445.w50,
.logo-bankN03.w50,
.logo-kcis2013.w50 {
    background-position: -130rem -130rem
}

.logo-bank445.w52,
.logo-bankN03.w52,
.logo-kcis2013.w52 {
    background-position: -135.2rem -135.2rem
}

.logo-bank445.w60,
.logo-bankN03.w60,
.logo-kcis2013.w60 {
    background-position: -156rem -156rem
}

.logo-bank445.w64,
.logo-bankN03.w64,
.logo-kcis2013.w64 {
    background-position: -166.4rem -166.4rem
}

.logo-bank445.w65,
.logo-bankN03.w65,
.logo-kcis2013.w65 {
    background-position: -169rem -169rem
}

.logo-bank445.w72,
.logo-bankN03.w72,
.logo-kcis2013.w72 {
    background-position: -187.2rem -187.2rem
}

/*! 신한라이프생명보험 */

.logo-bank446.w16,
.logo-bankL11.w16 {
    background-position: -44.8rem 0
}

.logo-bank446.w20,
.logo-bankL11.w20 {
    background-position: -56rem 0
}

.logo-bank446.w22,
.logo-bankL11.w22 {
    background-position: -61.6rem 0
}

.logo-bank446.w24,
.logo-bankL11.w24 {
    background-position: -67.2rem 0
}

.logo-bank446.w28,
.logo-bankL11.w28 {
    background-position: -78.4rem 0
}

.logo-bank446.w30,
.logo-bankL11.w30 {
    background-position: -84rem 0
}

.logo-bank446.w32,
.logo-bankL11.w32 {
    background-position: -89.6rem 0
}

.logo-bank446.w34,
.logo-bankL11.w34 {
    background-position: -95.2rem 0
}

.logo-bank446.w36,
.logo-bankL11.w36 {
    background-position: -100.8rem 0
}

.logo-bank446.w40,
.logo-bankL11.w40 {
    background-position: -112rem 0
}

.logo-bank446.w44,
.logo-bankL11.w44 {
    background-position: -123.2rem 0
}

.logo-bank446.w50,
.logo-bankL11.w50 {
    background-position: -140rem 0
}

.logo-bank446.w52,
.logo-bankL11.w52 {
    background-position: -145.6rem 0
}

.logo-bank446.w60,
.logo-bankL11.w60 {
    background-position: -168rem 0
}

.logo-bank446.w64,
.logo-bankL11.w64 {
    background-position: -179.2rem 0
}

.logo-bank446.w65,
.logo-bankL11.w65 {
    background-position: -182rem 0
}

.logo-bank446.w72,
.logo-bankL11.w72 {
    background-position: -201.6rem 0
}

/*! 악사손해보험 */

.logo-bank447.w16,
.logo-kcis2024.w16 {
    background-position: -44.8rem -3.2rem
}

.logo-bank447.w20,
.logo-kcis2024.w20 {
    background-position: -56rem -4rem
}

.logo-bank447.w22,
.logo-kcis2024.w22 {
    background-position: -61.6rem -4.4rem
}

.logo-bank447.w24,
.logo-kcis2024.w24 {
    background-position: -67.2rem -4.8rem
}

.logo-bank447.w28,
.logo-kcis2024.w28 {
    background-position: -78.4rem -5.6rem
}

.logo-bank447.w30,
.logo-kcis2024.w30 {
    background-position: -84rem -6rem
}

.logo-bank447.w32,
.logo-kcis2024.w32 {
    background-position: -89.6rem -6.4rem
}

.logo-bank447.w34,
.logo-kcis2024.w34 {
    background-position: -95.2rem -6.8rem
}

.logo-bank447.w36,
.logo-kcis2024.w36 {
    background-position: -100.8rem -7.2rem
}

.logo-bank447.w40,
.logo-kcis2024.w40 {
    background-position: -112rem -8rem
}

.logo-bank447.w44,
.logo-kcis2024.w44 {
    background-position: -123.2rem -8.8rem
}

.logo-bank447.w50,
.logo-kcis2024.w50 {
    background-position: -140rem -10rem
}

.logo-bank447.w52,
.logo-kcis2024.w52 {
    background-position: -145.6rem -10.4rem
}

.logo-bank447.w60,
.logo-kcis2024.w60 {
    background-position: -168rem -12rem
}

.logo-bank447.w64,
.logo-kcis2024.w64 {
    background-position: -179.2rem -12.8rem
}

.logo-bank447.w65,
.logo-kcis2024.w65 {
    background-position: -182rem -13rem
}

.logo-bank447.w72,
.logo-kcis2024.w72 {
    background-position: -201.6rem -14.4rem
}

/*! 메리츠화재 */

.logo-bank448.w16,
.logo-bankN01.w16,
.logo-kcis2011.w16 {
    background-position: -44.8rem -6.4rem
}

.logo-bank448.w20,
.logo-bankN01.w20,
.logo-kcis2011.w20 {
    background-position: -56rem -8rem
}

.logo-bank448.w22,
.logo-bankN01.w22,
.logo-kcis2011.w22 {
    background-position: -61.6rem -8.8rem
}

.logo-bank448.w24,
.logo-bankN01.w24,
.logo-kcis2011.w24 {
    background-position: -67.2rem -9.6rem
}

.logo-bank448.w28,
.logo-bankN01.w28,
.logo-kcis2011.w28 {
    background-position: -78.4rem -11.2rem
}

.logo-bank448.w30,
.logo-bankN01.w30,
.logo-kcis2011.w30 {
    background-position: -84rem -12rem
}

.logo-bank448.w32,
.logo-bankN01.w32,
.logo-kcis2011.w32 {
    background-position: -89.6rem -12.8rem
}

.logo-bank448.w34,
.logo-bankN01.w34,
.logo-kcis2011.w34 {
    background-position: -95.2rem -13.6rem
}

.logo-bank448.w36,
.logo-bankN01.w36,
.logo-kcis2011.w36 {
    background-position: -100.8rem -14.4rem
}

.logo-bank448.w40,
.logo-bankN01.w40,
.logo-kcis2011.w40 {
    background-position: -112rem -16rem
}

.logo-bank448.w44,
.logo-bankN01.w44,
.logo-kcis2011.w44 {
    background-position: -123.2rem -17.6rem
}

.logo-bank448.w50,
.logo-bankN01.w50,
.logo-kcis2011.w50 {
    background-position: -140rem -20rem
}

.logo-bank448.w52,
.logo-bankN01.w52,
.logo-kcis2011.w52 {
    background-position: -145.6rem -20.8rem
}

.logo-bank448.w60,
.logo-bankN01.w60,
.logo-kcis2011.w60 {
    background-position: -168rem -24rem
}

.logo-bank448.w64,
.logo-bankN01.w64,
.logo-kcis2011.w64 {
    background-position: -179.2rem -25.6rem
}

.logo-bank448.w65,
.logo-bankN01.w65,
.logo-kcis2011.w65 {
    background-position: -182rem -26rem
}

.logo-bank448.w72,
.logo-bankN01.w72,
.logo-kcis2011.w72 {
    background-position: -201.6rem -28.8rem
}

/*! NH농협손해보험 */

.logo-bank449.w16,
.logo-kcis2033.w16 {
    background-position: -44.8rem -9.6rem
}

.logo-bank449.w20,
.logo-kcis2033.w20 {
    background-position: -56rem -12rem
}

.logo-bank449.w22,
.logo-kcis2033.w22 {
    background-position: -61.6rem -13.2rem
}

.logo-bank449.w24,
.logo-kcis2033.w24 {
    background-position: -67.2rem -14.4rem
}

.logo-bank449.w28,
.logo-kcis2033.w28 {
    background-position: -78.4rem -16.8rem
}

.logo-bank449.w30,
.logo-kcis2033.w30 {
    background-position: -84rem -18rem
}

.logo-bank449.w32,
.logo-kcis2033.w32 {
    background-position: -89.6rem -19.2rem
}

.logo-bank449.w34,
.logo-kcis2033.w34 {
    background-position: -95.2rem -20.4rem
}

.logo-bank449.w36,
.logo-kcis2033.w36 {
    background-position: -100.8rem -21.6rem
}

.logo-bank449.w40,
.logo-kcis2033.w40 {
    background-position: -112rem -24rem
}

.logo-bank449.w44,
.logo-kcis2033.w44 {
    background-position: -123.2rem -26.4rem
}

.logo-bank449.w50,
.logo-kcis2033.w50 {
    background-position: -140rem -30rem
}

.logo-bank449.w52,
.logo-kcis2033.w52 {
    background-position: -145.6rem -31.2rem
}

.logo-bank449.w60,
.logo-kcis2033.w60 {
    background-position: -168rem -36rem
}

.logo-bank449.w64,
.logo-kcis2033.w64 {
    background-position: -179.2rem -38.4rem
}

.logo-bank449.w65,
.logo-kcis2033.w65 {
    background-position: -182rem -39rem
}

.logo-bank449.w72,
.logo-kcis2033.w72 {
    background-position: -201.6rem -43.2rem
}

/*! 푸르덴셜생명보험 */

.logo-bank450.w16,
.logo-bankL61.w16,
.logo-kcis2069.w16 {
    background-position: -44.8rem -12.8rem
}

.logo-bank450.w20,
.logo-bankL61.w20,
.logo-kcis2069.w20 {
    background-position: -56rem -16rem
}

.logo-bank450.w22,
.logo-bankL61.w22,
.logo-kcis2069.w22 {
    background-position: -61.6rem -17.6rem
}

.logo-bank450.w24,
.logo-bankL61.w24,
.logo-kcis2069.w24 {
    background-position: -67.2rem -19.2rem
}

.logo-bank450.w28,
.logo-bankL61.w28,
.logo-kcis2069.w28 {
    background-position: -78.4rem -22.4rem
}

.logo-bank450.w30,
.logo-bankL61.w30,
.logo-kcis2069.w30 {
    background-position: -84rem -24rem
}

.logo-bank450.w32,
.logo-bankL61.w32,
.logo-kcis2069.w32 {
    background-position: -89.6rem -25.6rem
}

.logo-bank450.w34,
.logo-bankL61.w34,
.logo-kcis2069.w34 {
    background-position: -95.2rem -27.2rem
}

.logo-bank450.w36,
.logo-bankL61.w36,
.logo-kcis2069.w36 {
    background-position: -100.8rem -28.8rem
}

.logo-bank450.w40,
.logo-bankL61.w40,
.logo-kcis2069.w40 {
    background-position: -112rem -32rem
}

.logo-bank450.w44,
.logo-bankL61.w44,
.logo-kcis2069.w44 {
    background-position: -123.2rem -35.2rem
}

.logo-bank450.w50,
.logo-bankL61.w50,
.logo-kcis2069.w50 {
    background-position: -140rem -40rem
}

.logo-bank450.w52,
.logo-bankL61.w52,
.logo-kcis2069.w52 {
    background-position: -145.6rem -41.6rem
}

.logo-bank450.w60,
.logo-bankL61.w60,
.logo-kcis2069.w60 {
    background-position: -168rem -48rem
}

.logo-bank450.w64,
.logo-bankL61.w64,
.logo-kcis2069.w64 {
    background-position: -179.2rem -51.2rem
}

.logo-bank450.w65,
.logo-bankL61.w65,
.logo-kcis2069.w65 {
    background-position: -182rem -52rem
}

.logo-bank450.w72,
.logo-bankL61.w72,
.logo-kcis2069.w72 {
    background-position: -201.6rem -57.6rem
}

/*! 삼성생명 */

.logo-bank452.w16,
.logo-bankL03.w16,
.logo-kcb20404.w16,
.logo-kcis2042.w16 {
    background-position: -44.8rem -16rem
}

.logo-bank452.w20,
.logo-bankL03.w20,
.logo-kcb20404.w20,
.logo-kcis2042.w20 {
    background-position: -56rem -20rem
}

.logo-bank452.w22,
.logo-bankL03.w22,
.logo-kcb20404.w22,
.logo-kcis2042.w22 {
    background-position: -61.6rem -22rem
}

.logo-bank452.w24,
.logo-bankL03.w24,
.logo-kcb20404.w24,
.logo-kcis2042.w24 {
    background-position: -67.2rem -24rem
}

.logo-bank452.w28,
.logo-bankL03.w28,
.logo-kcb20404.w28,
.logo-kcis2042.w28 {
    background-position: -78.4rem -28rem
}

.logo-bank452.w30,
.logo-bankL03.w30,
.logo-kcb20404.w30,
.logo-kcis2042.w30 {
    background-position: -84rem -30rem
}

.logo-bank452.w32,
.logo-bankL03.w32,
.logo-kcb20404.w32,
.logo-kcis2042.w32 {
    background-position: -89.6rem -32rem
}

.logo-bank452.w34,
.logo-bankL03.w34,
.logo-kcb20404.w34,
.logo-kcis2042.w34 {
    background-position: -95.2rem -34rem
}

.logo-bank452.w36,
.logo-bankL03.w36,
.logo-kcb20404.w36,
.logo-kcis2042.w36 {
    background-position: -100.8rem -36rem
}

.logo-bank452.w40,
.logo-bankL03.w40,
.logo-kcb20404.w40,
.logo-kcis2042.w40 {
    background-position: -112rem -40rem
}

.logo-bank452.w44,
.logo-bankL03.w44,
.logo-kcb20404.w44,
.logo-kcis2042.w44 {
    background-position: -123.2rem -44rem
}

.logo-bank452.w50,
.logo-bankL03.w50,
.logo-kcb20404.w50,
.logo-kcis2042.w50 {
    background-position: -140rem -50rem
}

.logo-bank452.w52,
.logo-bankL03.w52,
.logo-kcb20404.w52,
.logo-kcis2042.w52 {
    background-position: -145.6rem -52rem
}

.logo-bank452.w60,
.logo-bankL03.w60,
.logo-kcb20404.w60,
.logo-kcis2042.w60 {
    background-position: -168rem -60rem
}

.logo-bank452.w64,
.logo-bankL03.w64,
.logo-kcb20404.w64,
.logo-kcis2042.w64 {
    background-position: -179.2rem -64rem
}

.logo-bank452.w65,
.logo-bankL03.w65,
.logo-kcb20404.w65,
.logo-kcis2042.w65 {
    background-position: -182rem -65rem
}

.logo-bank452.w72,
.logo-bankL03.w72,
.logo-kcb20404.w72,
.logo-kcis2042.w72 {
    background-position: -201.6rem -72rem
}

/*! 흥국생명 */

.logo-bank453.w16,
.logo-bankL04.w16,
.logo-kcb20406.w16,
.logo-kcis2043.w16 {
    background-position: -44.8rem -19.2rem
}

.logo-bank453.w20,
.logo-bankL04.w20,
.logo-kcb20406.w20,
.logo-kcis2043.w20 {
    background-position: -56rem -24rem
}

.logo-bank453.w22,
.logo-bankL04.w22,
.logo-kcb20406.w22,
.logo-kcis2043.w22 {
    background-position: -61.6rem -26.4rem
}

.logo-bank453.w24,
.logo-bankL04.w24,
.logo-kcb20406.w24,
.logo-kcis2043.w24 {
    background-position: -67.2rem -28.8rem
}

.logo-bank453.w28,
.logo-bankL04.w28,
.logo-kcb20406.w28,
.logo-kcis2043.w28 {
    background-position: -78.4rem -33.6rem
}

.logo-bank453.w30,
.logo-bankL04.w30,
.logo-kcb20406.w30,
.logo-kcis2043.w30 {
    background-position: -84rem -36rem
}

.logo-bank453.w32,
.logo-bankL04.w32,
.logo-kcb20406.w32,
.logo-kcis2043.w32 {
    background-position: -89.6rem -38.4rem
}

.logo-bank453.w34,
.logo-bankL04.w34,
.logo-kcb20406.w34,
.logo-kcis2043.w34 {
    background-position: -95.2rem -40.8rem
}

.logo-bank453.w36,
.logo-bankL04.w36,
.logo-kcb20406.w36,
.logo-kcis2043.w36 {
    background-position: -100.8rem -43.2rem
}

.logo-bank453.w40,
.logo-bankL04.w40,
.logo-kcb20406.w40,
.logo-kcis2043.w40 {
    background-position: -112rem -48rem
}

.logo-bank453.w44,
.logo-bankL04.w44,
.logo-kcb20406.w44,
.logo-kcis2043.w44 {
    background-position: -123.2rem -52.8rem
}

.logo-bank453.w50,
.logo-bankL04.w50,
.logo-kcb20406.w50,
.logo-kcis2043.w50 {
    background-position: -140rem -60rem
}

.logo-bank453.w52,
.logo-bankL04.w52,
.logo-kcb20406.w52,
.logo-kcis2043.w52 {
    background-position: -145.6rem -62.4rem
}

.logo-bank453.w60,
.logo-bankL04.w60,
.logo-kcb20406.w60,
.logo-kcis2043.w60 {
    background-position: -168rem -72rem
}

.logo-bank453.w64,
.logo-bankL04.w64,
.logo-kcb20406.w64,
.logo-kcis2043.w64 {
    background-position: -179.2rem -76.8rem
}

.logo-bank453.w65,
.logo-bankL04.w65,
.logo-kcb20406.w65,
.logo-kcis2043.w65 {
    background-position: -182rem -78rem
}

.logo-bank453.w72,
.logo-bankL04.w72,
.logo-kcb20406.w72,
.logo-kcis2043.w72 {
    background-position: -201.6rem -86.4rem
}

/*! 한화손해보험 */

.logo-bank454.w16,
.logo-bankN02.w16,
.logo-kcis2012.w16 {
    background-position: -44.8rem -22.4rem
}

.logo-bank454.w20,
.logo-bankN02.w20,
.logo-kcis2012.w20 {
    background-position: -56rem -28rem
}

.logo-bank454.w22,
.logo-bankN02.w22,
.logo-kcis2012.w22 {
    background-position: -61.6rem -30.8rem
}

.logo-bank454.w24,
.logo-bankN02.w24,
.logo-kcis2012.w24 {
    background-position: -67.2rem -33.6rem
}

.logo-bank454.w28,
.logo-bankN02.w28,
.logo-kcis2012.w28 {
    background-position: -78.4rem -39.2rem
}

.logo-bank454.w30,
.logo-bankN02.w30,
.logo-kcis2012.w30 {
    background-position: -84rem -42rem
}

.logo-bank454.w32,
.logo-bankN02.w32,
.logo-kcis2012.w32 {
    background-position: -89.6rem -44.8rem
}

.logo-bank454.w34,
.logo-bankN02.w34,
.logo-kcis2012.w34 {
    background-position: -95.2rem -47.6rem
}

.logo-bank454.w36,
.logo-bankN02.w36,
.logo-kcis2012.w36 {
    background-position: -100.8rem -50.4rem
}

.logo-bank454.w40,
.logo-bankN02.w40,
.logo-kcis2012.w40 {
    background-position: -112rem -56rem
}

.logo-bank454.w44,
.logo-bankN02.w44,
.logo-kcis2012.w44 {
    background-position: -123.2rem -61.6rem
}

.logo-bank454.w50,
.logo-bankN02.w50,
.logo-kcis2012.w50 {
    background-position: -140rem -70rem
}

.logo-bank454.w52,
.logo-bankN02.w52,
.logo-kcis2012.w52 {
    background-position: -145.6rem -72.8rem
}

.logo-bank454.w60,
.logo-bankN02.w60,
.logo-kcis2012.w60 {
    background-position: -168rem -84rem
}

.logo-bank454.w64,
.logo-bankN02.w64,
.logo-kcis2012.w64 {
    background-position: -179.2rem -89.6rem
}

.logo-bank454.w65,
.logo-bankN02.w65,
.logo-kcis2012.w65 {
    background-position: -182rem -91rem
}

.logo-bank454.w72,
.logo-bankN02.w72,
.logo-kcis2012.w72 {
    background-position: -201.6rem -100.8rem
}

/*! AIA생명보험 */

.logo-bank455.w16,
.logo-bankL52.w16,
.logo-kcis2071.w16 {
    background-position: -44.8rem -25.6rem
}

.logo-bank455.w20,
.logo-bankL52.w20,
.logo-kcis2071.w20 {
    background-position: -56rem -32rem
}

.logo-bank455.w22,
.logo-bankL52.w22,
.logo-kcis2071.w22 {
    background-position: -61.6rem -35.2rem
}

.logo-bank455.w24,
.logo-bankL52.w24,
.logo-kcis2071.w24 {
    background-position: -67.2rem -38.4rem
}

.logo-bank455.w28,
.logo-bankL52.w28,
.logo-kcis2071.w28 {
    background-position: -78.4rem -44.8rem
}

.logo-bank455.w30,
.logo-bankL52.w30,
.logo-kcis2071.w30 {
    background-position: -84rem -48rem
}

.logo-bank455.w32,
.logo-bankL52.w32,
.logo-kcis2071.w32 {
    background-position: -89.6rem -51.2rem
}

.logo-bank455.w34,
.logo-bankL52.w34,
.logo-kcis2071.w34 {
    background-position: -95.2rem -54.4rem
}

.logo-bank455.w36,
.logo-bankL52.w36,
.logo-kcis2071.w36 {
    background-position: -100.8rem -57.6rem
}

.logo-bank455.w40,
.logo-bankL52.w40,
.logo-kcis2071.w40 {
    background-position: -112rem -64rem
}

.logo-bank455.w44,
.logo-bankL52.w44,
.logo-kcis2071.w44 {
    background-position: -123.2rem -70.4rem
}

.logo-bank455.w50,
.logo-bankL52.w50,
.logo-kcis2071.w50 {
    background-position: -140rem -80rem
}

.logo-bank455.w52,
.logo-bankL52.w52,
.logo-kcis2071.w52 {
    background-position: -145.6rem -83.2rem
}

.logo-bank455.w60,
.logo-bankL52.w60,
.logo-kcis2071.w60 {
    background-position: -168rem -96rem
}

.logo-bank455.w64,
.logo-bankL52.w64,
.logo-kcis2071.w64 {
    background-position: -179.2rem -102.4rem
}

.logo-bank455.w65,
.logo-bankL52.w65,
.logo-kcis2071.w65 {
    background-position: -182rem -104rem
}

.logo-bank455.w72,
.logo-bankL52.w72,
.logo-kcis2071.w72 {
    background-position: -201.6rem -115.2rem
}

/*! DGB생명보험 */

.logo-bank456.w16,
.logo-bankL31.w16,
.logo-kcis2059.w16 {
    background-position: -44.8rem -28.8rem
}

.logo-bank456.w20,
.logo-bankL31.w20,
.logo-kcis2059.w20 {
    background-position: -56rem -36rem
}

.logo-bank456.w22,
.logo-bankL31.w22,
.logo-kcis2059.w22 {
    background-position: -61.6rem -39.6rem
}

.logo-bank456.w24,
.logo-bankL31.w24,
.logo-kcis2059.w24 {
    background-position: -67.2rem -43.2rem
}

.logo-bank456.w28,
.logo-bankL31.w28,
.logo-kcis2059.w28 {
    background-position: -78.4rem -50.4rem
}

.logo-bank456.w30,
.logo-bankL31.w30,
.logo-kcis2059.w30 {
    background-position: -84rem -54rem
}

.logo-bank456.w32,
.logo-bankL31.w32,
.logo-kcis2059.w32 {
    background-position: -89.6rem -57.6rem
}

.logo-bank456.w34,
.logo-bankL31.w34,
.logo-kcis2059.w34 {
    background-position: -95.2rem -61.2rem
}

.logo-bank456.w36,
.logo-bankL31.w36,
.logo-kcis2059.w36 {
    background-position: -100.8rem -64.8rem
}

.logo-bank456.w40,
.logo-bankL31.w40,
.logo-kcis2059.w40 {
    background-position: -112rem -72rem
}

.logo-bank456.w44,
.logo-bankL31.w44,
.logo-kcis2059.w44 {
    background-position: -123.2rem -79.2rem
}

.logo-bank456.w50,
.logo-bankL31.w50,
.logo-kcis2059.w50 {
    background-position: -140rem -90rem
}

.logo-bank456.w52,
.logo-bankL31.w52,
.logo-kcis2059.w52 {
    background-position: -145.6rem -93.6rem
}

.logo-bank456.w60,
.logo-bankL31.w60,
.logo-kcis2059.w60 {
    background-position: -168rem -108rem
}

.logo-bank456.w64,
.logo-bankL31.w64,
.logo-kcis2059.w64 {
    background-position: -179.2rem -115.2rem
}

.logo-bank456.w65,
.logo-bankL31.w65,
.logo-kcis2059.w65 {
    background-position: -182rem -117rem
}

.logo-bank456.w72,
.logo-bankL31.w72,
.logo-kcis2059.w72 {
    background-position: -201.6rem -129.6rem
}

/*! DB생명보험 */

.logo-bank457.w16,
.logo-bankL71.w16,
.logo-kcis2052.w16 {
    background-position: -44.8rem -32rem
}

.logo-bank457.w20,
.logo-bankL71.w20,
.logo-kcis2052.w20 {
    background-position: -56rem -40rem
}

.logo-bank457.w22,
.logo-bankL71.w22,
.logo-kcis2052.w22 {
    background-position: -61.6rem -44rem
}

.logo-bank457.w24,
.logo-bankL71.w24,
.logo-kcis2052.w24 {
    background-position: -67.2rem -48rem
}

.logo-bank457.w28,
.logo-bankL71.w28,
.logo-kcis2052.w28 {
    background-position: -78.4rem -56rem
}

.logo-bank457.w30,
.logo-bankL71.w30,
.logo-kcis2052.w30 {
    background-position: -84rem -60rem
}

.logo-bank457.w32,
.logo-bankL71.w32,
.logo-kcis2052.w32 {
    background-position: -89.6rem -64rem
}

.logo-bank457.w34,
.logo-bankL71.w34,
.logo-kcis2052.w34 {
    background-position: -95.2rem -68rem
}

.logo-bank457.w36,
.logo-bankL71.w36,
.logo-kcis2052.w36 {
    background-position: -100.8rem -72rem
}

.logo-bank457.w40,
.logo-bankL71.w40,
.logo-kcis2052.w40 {
    background-position: -112rem -80rem
}

.logo-bank457.w44,
.logo-bankL71.w44,
.logo-kcis2052.w44 {
    background-position: -123.2rem -88rem
}

.logo-bank457.w50,
.logo-bankL71.w50,
.logo-kcis2052.w50 {
    background-position: -140rem -100rem
}

.logo-bank457.w52,
.logo-bankL71.w52,
.logo-kcis2052.w52 {
    background-position: -145.6rem -104rem
}

.logo-bank457.w60,
.logo-bankL71.w60,
.logo-kcis2052.w60 {
    background-position: -168rem -120rem
}

.logo-bank457.w64,
.logo-bankL71.w64,
.logo-kcis2052.w64 {
    background-position: -179.2rem -128rem
}

.logo-bank457.w65,
.logo-bankL71.w65,
.logo-kcis2052.w65 {
    background-position: -182rem -130rem
}

.logo-bank457.w72,
.logo-bankL71.w72,
.logo-kcis2052.w72 {
    background-position: -201.6rem -144rem
}

/*! KDB생명보험 */

.logo-bank458.w16,
.logo-bankL33.w16,
.logo-kcis2061.w16 {
    background-position: -44.8rem -35.2rem
}

.logo-bank458.w20,
.logo-bankL33.w20,
.logo-kcis2061.w20 {
    background-position: -56rem -44rem
}

.logo-bank458.w22,
.logo-bankL33.w22,
.logo-kcis2061.w22 {
    background-position: -61.6rem -48.4rem
}

.logo-bank458.w24,
.logo-bankL33.w24,
.logo-kcis2061.w24 {
    background-position: -67.2rem -52.8rem
}

.logo-bank458.w28,
.logo-bankL33.w28,
.logo-kcis2061.w28 {
    background-position: -78.4rem -61.6rem
}

.logo-bank458.w30,
.logo-bankL33.w30,
.logo-kcis2061.w30 {
    background-position: -84rem -66rem
}

.logo-bank458.w32,
.logo-bankL33.w32,
.logo-kcis2061.w32 {
    background-position: -89.6rem -70.4rem
}

.logo-bank458.w34,
.logo-bankL33.w34,
.logo-kcis2061.w34 {
    background-position: -95.2rem -74.8rem
}

.logo-bank458.w36,
.logo-bankL33.w36,
.logo-kcis2061.w36 {
    background-position: -100.8rem -79.2rem
}

.logo-bank458.w40,
.logo-bankL33.w40,
.logo-kcis2061.w40 {
    background-position: -112rem -88rem
}

.logo-bank458.w44,
.logo-bankL33.w44,
.logo-kcis2061.w44 {
    background-position: -123.2rem -96.8rem
}

.logo-bank458.w50,
.logo-bankL33.w50,
.logo-kcis2061.w50 {
    background-position: -140rem -110rem
}

.logo-bank458.w52,
.logo-bankL33.w52,
.logo-kcis2061.w52 {
    background-position: -145.6rem -114.4rem
}

.logo-bank458.w60,
.logo-bankL33.w60,
.logo-kcis2061.w60 {
    background-position: -168rem -132rem
}

.logo-bank458.w64,
.logo-bankL33.w64,
.logo-kcis2061.w64 {
    background-position: -179.2rem -140.8rem
}

.logo-bank458.w65,
.logo-bankL33.w65,
.logo-kcis2061.w65 {
    background-position: -182rem -143rem
}

.logo-bank458.w72,
.logo-bankL33.w72,
.logo-kcis2061.w72 {
    background-position: -201.6rem -158.4rem
}

/*! 에이스아메리칸화재해상보험 */

.logo-bank459.w16,
.logo-bankN18.w16,
.logo-kcis2036.w16 {
    background-position: -44.8rem -38.4rem
}

.logo-bank459.w20,
.logo-bankN18.w20,
.logo-kcis2036.w20 {
    background-position: -56rem -48rem
}

.logo-bank459.w22,
.logo-bankN18.w22,
.logo-kcis2036.w22 {
    background-position: -61.6rem -52.8rem
}

.logo-bank459.w24,
.logo-bankN18.w24,
.logo-kcis2036.w24 {
    background-position: -67.2rem -57.6rem
}

.logo-bank459.w28,
.logo-bankN18.w28,
.logo-kcis2036.w28 {
    background-position: -78.4rem -67.2rem
}

.logo-bank459.w30,
.logo-bankN18.w30,
.logo-kcis2036.w30 {
    background-position: -84rem -72rem
}

.logo-bank459.w32,
.logo-bankN18.w32,
.logo-kcis2036.w32 {
    background-position: -89.6rem -76.8rem
}

.logo-bank459.w34,
.logo-bankN18.w34,
.logo-kcis2036.w34 {
    background-position: -95.2rem -81.6rem
}

.logo-bank459.w36,
.logo-bankN18.w36,
.logo-kcis2036.w36 {
    background-position: -100.8rem -86.4rem
}

.logo-bank459.w40,
.logo-bankN18.w40,
.logo-kcis2036.w40 {
    background-position: -112rem -96rem
}

.logo-bank459.w44,
.logo-bankN18.w44,
.logo-kcis2036.w44 {
    background-position: -123.2rem -105.6rem
}

.logo-bank459.w50,
.logo-bankN18.w50,
.logo-kcis2036.w50 {
    background-position: -140rem -120rem
}

.logo-bank459.w52,
.logo-bankN18.w52,
.logo-kcis2036.w52 {
    background-position: -145.6rem -124.8rem
}

.logo-bank459.w60,
.logo-bankN18.w60,
.logo-kcis2036.w60 {
    background-position: -168rem -144rem
}

.logo-bank459.w64,
.logo-bankN18.w64,
.logo-kcis2036.w64 {
    background-position: -179.2rem -153.6rem
}

.logo-bank459.w65,
.logo-bankN18.w65,
.logo-kcis2036.w65 {
    background-position: -182rem -156rem
}

.logo-bank459.w72,
.logo-bankN18.w72,
.logo-kcis2036.w72 {
    background-position: -201.6rem -172.8rem
}

/*! 처브라이프생명보험 */

.logo-bank460.w16,
.logo-bankN20.w16,
.logo-kcis2058.w16 {
    background-position: -44.8rem -41.6rem
}

.logo-bank460.w20,
.logo-bankN20.w20,
.logo-kcis2058.w20 {
    background-position: -56rem -52rem
}

.logo-bank460.w22,
.logo-bankN20.w22,
.logo-kcis2058.w22 {
    background-position: -61.6rem -57.2rem
}

.logo-bank460.w24,
.logo-bankN20.w24,
.logo-kcis2058.w24 {
    background-position: -67.2rem -62.4rem
}

.logo-bank460.w28,
.logo-bankN20.w28,
.logo-kcis2058.w28 {
    background-position: -78.4rem -72.8rem
}

.logo-bank460.w30,
.logo-bankN20.w30,
.logo-kcis2058.w30 {
    background-position: -84rem -78rem
}

.logo-bank460.w32,
.logo-bankN20.w32,
.logo-kcis2058.w32 {
    background-position: -89.6rem -83.2rem
}

.logo-bank460.w34,
.logo-bankN20.w34,
.logo-kcis2058.w34 {
    background-position: -95.2rem -88.4rem
}

.logo-bank460.w36,
.logo-bankN20.w36,
.logo-kcis2058.w36 {
    background-position: -100.8rem -93.6rem
}

.logo-bank460.w40,
.logo-bankN20.w40,
.logo-kcis2058.w40 {
    background-position: -112rem -104rem
}

.logo-bank460.w44,
.logo-bankN20.w44,
.logo-kcis2058.w44 {
    background-position: -123.2rem -114.4rem
}

.logo-bank460.w50,
.logo-bankN20.w50,
.logo-kcis2058.w50 {
    background-position: -140rem -130rem
}

.logo-bank460.w52,
.logo-bankN20.w52,
.logo-kcis2058.w52 {
    background-position: -145.6rem -135.2rem
}

.logo-bank460.w60,
.logo-bankN20.w60,
.logo-kcis2058.w60 {
    background-position: -168rem -156rem
}

.logo-bank460.w64,
.logo-bankN20.w64,
.logo-kcis2058.w64 {
    background-position: -179.2rem -166.4rem
}

.logo-bank460.w65,
.logo-bankN20.w65,
.logo-kcis2058.w65 {
    background-position: -182rem -169rem
}

.logo-bank460.w72,
.logo-bankN20.w72,
.logo-kcis2058.w72 {
    background-position: -201.6rem -187.2rem
}

/*! 캐롯손해보험 */

.logo-bankCGI.w16,
.logo-bankN69.w16 {
    background-position: -3.2rem -44.8rem
}

.logo-bankCGI.w20,
.logo-bankN69.w20 {
    background-position: -4rem -56rem
}

.logo-bankCGI.w22,
.logo-bankN69.w22 {
    background-position: -4.4rem -61.6rem
}

.logo-bankCGI.w24,
.logo-bankN69.w24 {
    background-position: -4.8rem -67.2rem
}

.logo-bankCGI.w28,
.logo-bankN69.w28 {
    background-position: -5.6rem -78.4rem
}

.logo-bankCGI.w30,
.logo-bankN69.w30 {
    background-position: -6rem -84rem
}

.logo-bankCGI.w32,
.logo-bankN69.w32 {
    background-position: -6.4rem -89.6rem
}

.logo-bankCGI.w34,
.logo-bankN69.w34 {
    background-position: -6.8rem -95.2rem
}

.logo-bankCGI.w36,
.logo-bankN69.w36 {
    background-position: -7.2rem -100.8rem
}

.logo-bankCGI.w40,
.logo-bankN69.w40 {
    background-position: -8rem -112rem
}

.logo-bankCGI.w44,
.logo-bankN69.w44 {
    background-position: -8.8rem -123.2rem
}

.logo-bankCGI.w50,
.logo-bankN69.w50 {
    background-position: -10rem -140rem
}

.logo-bankCGI.w52,
.logo-bankN69.w52 {
    background-position: -10.4rem -145.6rem
}

.logo-bankCGI.w60,
.logo-bankN69.w60 {
    background-position: -12rem -168rem
}

.logo-bankCGI.w64,
.logo-bankN69.w64 {
    background-position: -12.8rem -179.2rem
}

.logo-bankCGI.w65,
.logo-bankN69.w65 {
    background-position: -13rem -182rem
}

.logo-bankCGI.w72,
.logo-bankN69.w72 {
    background-position: -14.4rem -201.6rem
}

/*! mgi_MG손해보험 */

.logo-bankMGI.w16,
.logo-bankN04.w16,
.logo-kcis2034.w16 {
    background-position: -6.4rem -44.8rem
}

.logo-bankMGI.w20,
.logo-bankN04.w20,
.logo-kcis2034.w20 {
    background-position: -8rem -56rem
}

.logo-bankMGI.w22,
.logo-bankN04.w22,
.logo-kcis2034.w22 {
    background-position: -8.8rem -61.6rem
}

.logo-bankMGI.w24,
.logo-bankN04.w24,
.logo-kcis2034.w24 {
    background-position: -9.6rem -67.2rem
}

.logo-bankMGI.w28,
.logo-bankN04.w28,
.logo-kcis2034.w28 {
    background-position: -11.2rem -78.4rem
}

.logo-bankMGI.w30,
.logo-bankN04.w30,
.logo-kcis2034.w30 {
    background-position: -12rem -84rem
}

.logo-bankMGI.w32,
.logo-bankN04.w32,
.logo-kcis2034.w32 {
    background-position: -12.8rem -89.6rem
}

.logo-bankMGI.w34,
.logo-bankN04.w34,
.logo-kcis2034.w34 {
    background-position: -13.6rem -95.2rem
}

.logo-bankMGI.w36,
.logo-bankN04.w36,
.logo-kcis2034.w36 {
    background-position: -14.4rem -100.8rem
}

.logo-bankMGI.w40,
.logo-bankN04.w40,
.logo-kcis2034.w40 {
    background-position: -16rem -112rem
}

.logo-bankMGI.w44,
.logo-bankN04.w44,
.logo-kcis2034.w44 {
    background-position: -17.6rem -123.2rem
}

.logo-bankMGI.w50,
.logo-bankN04.w50,
.logo-kcis2034.w50 {
    background-position: -20rem -140rem
}

.logo-bankMGI.w52,
.logo-bankN04.w52,
.logo-kcis2034.w52 {
    background-position: -20.8rem -145.6rem
}

.logo-bankMGI.w60,
.logo-bankN04.w60,
.logo-kcis2034.w60 {
    background-position: -24rem -168rem
}

.logo-bankMGI.w64,
.logo-bankN04.w64,
.logo-kcis2034.w64 {
    background-position: -25.6rem -179.2rem
}

.logo-bankMGI.w65,
.logo-bankN04.w65,
.logo-kcis2034.w65 {
    background-position: -26rem -182rem
}

.logo-bankMGI.w72,
.logo-bankN04.w72,
.logo-kcis2034.w72 {
    background-position: -28.8rem -201.6rem
}

/*! MLI_메트라이프생명 */

.logo-bankL72.w16,
.logo-bankMLI.w16,
.logo-kcis2054.w16 {
    background-position: -9.6rem -44.8rem
}

.logo-bankL72.w20,
.logo-bankMLI.w20,
.logo-kcis2054.w20 {
    background-position: -12rem -56rem
}

.logo-bankL72.w22,
.logo-bankMLI.w22,
.logo-kcis2054.w22 {
    background-position: -13.2rem -61.6rem
}

.logo-bankL72.w24,
.logo-bankMLI.w24,
.logo-kcis2054.w24 {
    background-position: -14.4rem -67.2rem
}

.logo-bankL72.w28,
.logo-bankMLI.w28,
.logo-kcis2054.w28 {
    background-position: -16.8rem -78.4rem
}

.logo-bankL72.w30,
.logo-bankMLI.w30,
.logo-kcis2054.w30 {
    background-position: -18rem -84rem
}

.logo-bankL72.w32,
.logo-bankMLI.w32,
.logo-kcis2054.w32 {
    background-position: -19.2rem -89.6rem
}

.logo-bankL72.w34,
.logo-bankMLI.w34,
.logo-kcis2054.w34 {
    background-position: -20.4rem -95.2rem
}

.logo-bankL72.w36,
.logo-bankMLI.w36,
.logo-kcis2054.w36 {
    background-position: -21.6rem -100.8rem
}

.logo-bankL72.w40,
.logo-bankMLI.w40,
.logo-kcis2054.w40 {
    background-position: -24rem -112rem
}

.logo-bankL72.w44,
.logo-bankMLI.w44,
.logo-kcis2054.w44 {
    background-position: -26.4rem -123.2rem
}

.logo-bankL72.w50,
.logo-bankMLI.w50,
.logo-kcis2054.w50 {
    background-position: -30rem -140rem
}

.logo-bankL72.w52,
.logo-bankMLI.w52,
.logo-kcis2054.w52 {
    background-position: -31.2rem -145.6rem
}

.logo-bankL72.w60,
.logo-bankMLI.w60,
.logo-kcis2054.w60 {
    background-position: -36rem -168rem
}

.logo-bankL72.w64,
.logo-bankMLI.w64,
.logo-kcis2054.w64 {
    background-position: -38.4rem -179.2rem
}

.logo-bankL72.w65,
.logo-bankMLI.w65,
.logo-kcis2054.w65 {
    background-position: -39rem -182rem
}

.logo-bankL72.w72,
.logo-bankMLI.w72,
.logo-kcis2054.w72 {
    background-position: -43.2rem -201.6rem
}

/*! SEI_신한Ez손해보험 */

.logo-bankSEI.w16 {
    background-position: -12.8rem -44.8rem
}

.logo-bankSEI.w20 {
    background-position: -16rem -56rem
}

.logo-bankSEI.w22 {
    background-position: -17.6rem -61.6rem
}

.logo-bankSEI.w24 {
    background-position: -19.2rem -67.2rem
}

.logo-bankSEI.w28 {
    background-position: -22.4rem -78.4rem
}

.logo-bankSEI.w30 {
    background-position: -24rem -84rem
}

.logo-bankSEI.w32 {
    background-position: -25.6rem -89.6rem
}

.logo-bankSEI.w34 {
    background-position: -27.2rem -95.2rem
}

.logo-bankSEI.w36 {
    background-position: -28.8rem -100.8rem
}

.logo-bankSEI.w40 {
    background-position: -32rem -112rem
}

.logo-bankSEI.w44 {
    background-position: -35.2rem -123.2rem
}

.logo-bankSEI.w50 {
    background-position: -40rem -140rem
}

.logo-bankSEI.w52 {
    background-position: -41.6rem -145.6rem
}

.logo-bankSEI.w60 {
    background-position: -48rem -168rem
}

.logo-bankSEI.w64 {
    background-position: -51.2rem -179.2rem
}

.logo-bankSEI.w65 {
    background-position: -52rem -182rem
}

.logo-bankSEI.w72 {
    background-position: -57.6rem -201.6rem
}

/*! component element icon 카드 (총 15개) ======================================== */

/*! 우리카드 */

.logo-bank041.w16,
.logo-kcis1900.w16 {
    background-position: -12.8rem -3.2rem
}

.logo-bank041.w20,
.logo-kcis1900.w20 {
    background-position: -16rem -4rem
}

.logo-bank041.w22,
.logo-kcis1900.w22 {
    background-position: -17.6rem -4.4rem
}

.logo-bank041.w24,
.logo-kcis1900.w24 {
    background-position: -19.2rem -4.8rem
}

.logo-bank041.w28,
.logo-kcis1900.w28 {
    background-position: -22.4rem -5.6rem
}

.logo-bank041.w30,
.logo-kcis1900.w30 {
    background-position: -24rem -6rem
}

.logo-bank041.w32,
.logo-kcis1900.w32 {
    background-position: -25.6rem -6.4rem
}

.logo-bank041.w34,
.logo-kcis1900.w34 {
    background-position: -27.2rem -6.8rem
}

.logo-bank041.w36,
.logo-kcis1900.w36 {
    background-position: -28.8rem -7.2rem
}

.logo-bank041.w40,
.logo-kcis1900.w40 {
    background-position: -32rem -8rem
}

.logo-bank041.w44,
.logo-kcis1900.w44 {
    background-position: -35.2rem -8.8rem
}

.logo-bank041.w50,
.logo-kcis1900.w50 {
    background-position: -40rem -10rem
}

.logo-bank041.w52,
.logo-kcis1900.w52 {
    background-position: -41.6rem -10.4rem
}

.logo-bank041.w60,
.logo-kcis1900.w60 {
    background-position: -48rem -12rem
}

.logo-bank041.w64,
.logo-kcis1900.w64 {
    background-position: -51.2rem -12.8rem
}

.logo-bank041.w65,
.logo-kcis1900.w65 {
    background-position: -52rem -13rem
}

.logo-bank041.w72,
.logo-kcis1900.w72 {
    background-position: -57.6rem -14.4rem
}

/*! 하나카드 */

.logo-bank044.w16,
.logo-kcis1880.w16 {
    background-position: -12.8rem -9.6rem
}

.logo-bank044.w20,
.logo-kcis1880.w20 {
    background-position: -16rem -12rem
}

.logo-bank044.w22,
.logo-kcis1880.w22 {
    background-position: -17.6rem -13.2rem
}

.logo-bank044.w24,
.logo-kcis1880.w24 {
    background-position: -19.2rem -14.4rem
}

.logo-bank044.w28,
.logo-kcis1880.w28 {
    background-position: -22.4rem -16.8rem
}

.logo-bank044.w30,
.logo-kcis1880.w30 {
    background-position: -24rem -18rem
}

.logo-bank044.w32,
.logo-kcis1880.w32 {
    background-position: -25.6rem -19.2rem
}

.logo-bank044.w34,
.logo-kcis1880.w34 {
    background-position: -27.2rem -20.4rem
}

.logo-bank044.w36,
.logo-kcis1880.w36 {
    background-position: -28.8rem -21.6rem
}

.logo-bank044.w40,
.logo-kcis1880.w40 {
    background-position: -32rem -24rem
}

.logo-bank044.w44,
.logo-kcis1880.w44 {
    background-position: -35.2rem -26.4rem
}

.logo-bank044.w50,
.logo-kcis1880.w50 {
    background-position: -40rem -30rem
}

.logo-bank044.w52,
.logo-kcis1880.w52 {
    background-position: -41.6rem -31.2rem
}

.logo-bank044.w60,
.logo-kcis1880.w60 {
    background-position: -48rem -36rem
}

.logo-bank044.w64,
.logo-kcis1880.w64 {
    background-position: -51.2rem -38.4rem
}

.logo-bank044.w65,
.logo-kcis1880.w65 {
    background-position: -52rem -39rem
}

.logo-bank044.w72,
.logo-kcis1880.w72 {
    background-position: -57.6rem -43.2rem
}

/*! BC카드 */

.logo-bank361.w16,
.logo-kcb20124.w16,
.logo-kcis1920.w16 {
    background-position: -19.2rem -38.4rem
}

.logo-bank361.w20,
.logo-kcb20124.w20,
.logo-kcis1920.w20 {
    background-position: -24rem -48rem
}

.logo-bank361.w22,
.logo-kcb20124.w22,
.logo-kcis1920.w22 {
    background-position: -26.4rem -52.8rem
}

.logo-bank361.w24,
.logo-kcb20124.w24,
.logo-kcis1920.w24 {
    background-position: -28.8rem -57.6rem
}

.logo-bank361.w28,
.logo-kcb20124.w28,
.logo-kcis1920.w28 {
    background-position: -33.6rem -67.2rem
}

.logo-bank361.w30,
.logo-kcb20124.w30,
.logo-kcis1920.w30 {
    background-position: -36rem -72rem
}

.logo-bank361.w32,
.logo-kcb20124.w32,
.logo-kcis1920.w32 {
    background-position: -38.4rem -76.8rem
}

.logo-bank361.w34,
.logo-kcb20124.w34,
.logo-kcis1920.w34 {
    background-position: -40.8rem -81.6rem
}

.logo-bank361.w36,
.logo-kcb20124.w36,
.logo-kcis1920.w36 {
    background-position: -43.2rem -86.4rem
}

.logo-bank361.w40,
.logo-kcb20124.w40,
.logo-kcis1920.w40 {
    background-position: -48rem -96rem
}

.logo-bank361.w44,
.logo-kcb20124.w44,
.logo-kcis1920.w44 {
    background-position: -52.8rem -105.6rem
}

.logo-bank361.w50,
.logo-kcb20124.w50,
.logo-kcis1920.w50 {
    background-position: -60rem -120rem
}

.logo-bank361.w52,
.logo-kcb20124.w52,
.logo-kcis1920.w52 {
    background-position: -62.4rem -124.8rem
}

.logo-bank361.w60,
.logo-kcb20124.w60,
.logo-kcis1920.w60 {
    background-position: -72rem -144rem
}

.logo-bank361.w64,
.logo-kcb20124.w64,
.logo-kcis1920.w64 {
    background-position: -76.8rem -153.6rem
}

.logo-bank361.w65,
.logo-kcb20124.w65,
.logo-kcis1920.w65 {
    background-position: -78rem -156rem
}

.logo-bank361.w72,
.logo-kcb20124.w72,
.logo-kcis1920.w72 {
    background-position: -86.4rem -172.8rem
}

/*! 광주카드 */

.logo-bank364.w16 {
    background-position: -22.4rem -38.4rem
}

.logo-bank364.w20 {
    background-position: -28rem -48rem
}

.logo-bank364.w22 {
    background-position: -30.8rem -52.8rem
}

.logo-bank364.w24 {
    background-position: -33.6rem -57.6rem
}

.logo-bank364.w28 {
    background-position: -39.2rem -67.2rem
}

.logo-bank364.w30 {
    background-position: -42rem -72rem
}

.logo-bank364.w32 {
    background-position: -44.8rem -76.8rem
}

.logo-bank364.w34 {
    background-position: -47.6rem -81.6rem
}

.logo-bank364.w36 {
    background-position: -50.4rem -86.4rem
}

.logo-bank364.w40 {
    background-position: -56rem -96rem
}

.logo-bank364.w44 {
    background-position: -61.6rem -105.6rem
}

.logo-bank364.w50 {
    background-position: -70rem -120rem
}

.logo-bank364.w52 {
    background-position: -72.8rem -124.8rem
}

.logo-bank364.w60 {
    background-position: -84rem -144rem
}

.logo-bank364.w64 {
    background-position: -89.6rem -153.6rem
}

.logo-bank364.w65 {
    background-position: -91rem -156rem
}

.logo-bank364.w72 {
    background-position: -100.8rem -172.8rem
}

/*! 삼성카드 */

.logo-bank365.w16,
.logo-kcb20203.w16,
.logo-kcis1930.w16 {
    background-position: -25.6rem -38.4rem
}

.logo-bank365.w20,
.logo-kcb20203.w20,
.logo-kcis1930.w20 {
    background-position: -32rem -48rem
}

.logo-bank365.w22,
.logo-kcb20203.w22,
.logo-kcis1930.w22 {
    background-position: -35.2rem -52.8rem
}

.logo-bank365.w24,
.logo-kcb20203.w24,
.logo-kcis1930.w24 {
    background-position: -38.4rem -57.6rem
}

.logo-bank365.w28,
.logo-kcb20203.w28,
.logo-kcis1930.w28 {
    background-position: -44.8rem -67.2rem
}

.logo-bank365.w30,
.logo-kcb20203.w30,
.logo-kcis1930.w30 {
    background-position: -48rem -72rem
}

.logo-bank365.w32,
.logo-kcb20203.w32,
.logo-kcis1930.w32 {
    background-position: -51.2rem -76.8rem
}

.logo-bank365.w34,
.logo-kcb20203.w34,
.logo-kcis1930.w34 {
    background-position: -54.4rem -81.6rem
}

.logo-bank365.w36,
.logo-kcb20203.w36,
.logo-kcis1930.w36 {
    background-position: -57.6rem -86.4rem
}

.logo-bank365.w40,
.logo-kcb20203.w40,
.logo-kcis1930.w40 {
    background-position: -64rem -96rem
}

.logo-bank365.w44,
.logo-kcb20203.w44,
.logo-kcis1930.w44 {
    background-position: -70.4rem -105.6rem
}

.logo-bank365.w50,
.logo-kcb20203.w50,
.logo-kcis1930.w50 {
    background-position: -80rem -120rem
}

.logo-bank365.w52,
.logo-kcb20203.w52,
.logo-kcis1930.w52 {
    background-position: -83.2rem -124.8rem
}

.logo-bank365.w60,
.logo-kcb20203.w60,
.logo-kcis1930.w60 {
    background-position: -96rem -144rem
}

.logo-bank365.w64,
.logo-kcb20203.w64,
.logo-kcis1930.w64 {
    background-position: -102.4rem -153.6rem
}

.logo-bank365.w65,
.logo-kcb20203.w65,
.logo-kcis1930.w65 {
    background-position: -104rem -156rem
}

.logo-bank365.w72,
.logo-kcb20203.w72,
.logo-kcis1930.w72 {
    background-position: -115.2rem -172.8rem
}

/*! 신한카드 */

.logo-bank366.w16,
.logo-kcis1890.w16,
.logo-kcis1940.w16,
.logo-kcis1990.w16 {
    background-position: -28.8rem -38.4rem
}

.logo-bank366.w20,
.logo-kcis1890.w20,
.logo-kcis1940.w20,
.logo-kcis1990.w20 {
    background-position: -36rem -48rem
}

.logo-bank366.w22,
.logo-kcis1890.w22,
.logo-kcis1940.w22,
.logo-kcis1990.w22 {
    background-position: -39.6rem -52.8rem
}

.logo-bank366.w24,
.logo-kcis1890.w24,
.logo-kcis1940.w24,
.logo-kcis1990.w24 {
    background-position: -43.2rem -57.6rem
}

.logo-bank366.w28,
.logo-kcis1890.w28,
.logo-kcis1940.w28,
.logo-kcis1990.w28 {
    background-position: -50.4rem -67.2rem
}

.logo-bank366.w30,
.logo-kcis1890.w30,
.logo-kcis1940.w30,
.logo-kcis1990.w30 {
    background-position: -54rem -72rem
}

.logo-bank366.w32,
.logo-kcis1890.w32,
.logo-kcis1940.w32,
.logo-kcis1990.w32 {
    background-position: -57.6rem -76.8rem
}

.logo-bank366.w34,
.logo-kcis1890.w34,
.logo-kcis1940.w34,
.logo-kcis1990.w34 {
    background-position: -61.2rem -81.6rem
}

.logo-bank366.w36,
.logo-kcis1890.w36,
.logo-kcis1940.w36,
.logo-kcis1990.w36 {
    background-position: -64.8rem -86.4rem
}

.logo-bank366.w40,
.logo-kcis1890.w40,
.logo-kcis1940.w40,
.logo-kcis1990.w40 {
    background-position: -72rem -96rem
}

.logo-bank366.w44,
.logo-kcis1890.w44,
.logo-kcis1940.w44,
.logo-kcis1990.w44 {
    background-position: -79.2rem -105.6rem
}

.logo-bank366.w50,
.logo-kcis1890.w50,
.logo-kcis1940.w50,
.logo-kcis1990.w50 {
    background-position: -90rem -120rem
}

.logo-bank366.w52,
.logo-kcis1890.w52,
.logo-kcis1940.w52,
.logo-kcis1990.w52 {
    background-position: -93.6rem -124.8rem
}

.logo-bank366.w60,
.logo-kcis1890.w60,
.logo-kcis1940.w60,
.logo-kcis1990.w60 {
    background-position: -108rem -144rem
}

.logo-bank366.w64,
.logo-kcis1890.w64,
.logo-kcis1940.w64,
.logo-kcis1990.w64 {
    background-position: -115.2rem -153.6rem
}

.logo-bank366.w65,
.logo-kcis1890.w65,
.logo-kcis1940.w65,
.logo-kcis1990.w65 {
    background-position: -117rem -156rem
}

.logo-bank366.w72,
.logo-kcis1890.w72,
.logo-kcis1940.w72,
.logo-kcis1990.w72 {
    background-position: -129.6rem -172.8rem
}

/*! 현대카드 */

.logo-bank367.w16,
.logo-kcis1970.w16 {
    background-position: -32rem -38.4rem
}

.logo-bank367.w20,
.logo-kcis1970.w20 {
    background-position: -40rem -48rem
}

.logo-bank367.w22,
.logo-kcis1970.w22 {
    background-position: -44rem -52.8rem
}

.logo-bank367.w24,
.logo-kcis1970.w24 {
    background-position: -48rem -57.6rem
}

.logo-bank367.w28,
.logo-kcis1970.w28 {
    background-position: -56rem -67.2rem
}

.logo-bank367.w30,
.logo-kcis1970.w30 {
    background-position: -60rem -72rem
}

.logo-bank367.w32,
.logo-kcis1970.w32 {
    background-position: -64rem -76.8rem
}

.logo-bank367.w34,
.logo-kcis1970.w34 {
    background-position: -68rem -81.6rem
}

.logo-bank367.w36,
.logo-kcis1970.w36 {
    background-position: -72rem -86.4rem
}

.logo-bank367.w40,
.logo-kcis1970.w40 {
    background-position: -80rem -96rem
}

.logo-bank367.w44,
.logo-kcis1970.w44 {
    background-position: -88rem -105.6rem
}

.logo-bank367.w50,
.logo-kcis1970.w50 {
    background-position: -100rem -120rem
}

.logo-bank367.w52,
.logo-kcis1970.w52 {
    background-position: -104rem -124.8rem
}

.logo-bank367.w60,
.logo-kcis1970.w60 {
    background-position: -120rem -144rem
}

.logo-bank367.w64,
.logo-kcis1970.w64 {
    background-position: -128rem -153.6rem
}

.logo-bank367.w65,
.logo-kcis1970.w65 {
    background-position: -130rem -156rem
}

.logo-bank367.w72,
.logo-kcis1970.w72 {
    background-position: -144rem -172.8rem
}

/*! 롯데카드 */

.logo-bank368.w16,
.logo-kcb20202.w16,
.logo-kcis1980.w16 {
    background-position: -35.2rem -38.4rem
}

.logo-bank368.w20,
.logo-kcb20202.w20,
.logo-kcis1980.w20 {
    background-position: -44rem -48rem
}

.logo-bank368.w22,
.logo-kcb20202.w22,
.logo-kcis1980.w22 {
    background-position: -48.4rem -52.8rem
}

.logo-bank368.w24,
.logo-kcb20202.w24,
.logo-kcis1980.w24 {
    background-position: -52.8rem -57.6rem
}

.logo-bank368.w28,
.logo-kcb20202.w28,
.logo-kcis1980.w28 {
    background-position: -61.6rem -67.2rem
}

.logo-bank368.w30,
.logo-kcb20202.w30,
.logo-kcis1980.w30 {
    background-position: -66rem -72rem
}

.logo-bank368.w32,
.logo-kcb20202.w32,
.logo-kcis1980.w32 {
    background-position: -70.4rem -76.8rem
}

.logo-bank368.w34,
.logo-kcb20202.w34,
.logo-kcis1980.w34 {
    background-position: -74.8rem -81.6rem
}

.logo-bank368.w36,
.logo-kcb20202.w36,
.logo-kcis1980.w36 {
    background-position: -79.2rem -86.4rem
}

.logo-bank368.w40,
.logo-kcb20202.w40,
.logo-kcis1980.w40 {
    background-position: -88rem -96rem
}

.logo-bank368.w44,
.logo-kcb20202.w44,
.logo-kcis1980.w44 {
    background-position: -96.8rem -105.6rem
}

.logo-bank368.w50,
.logo-kcb20202.w50,
.logo-kcis1980.w50 {
    background-position: -110rem -120rem
}

.logo-bank368.w52,
.logo-kcb20202.w52,
.logo-kcis1980.w52 {
    background-position: -114.4rem -124.8rem
}

.logo-bank368.w60,
.logo-kcb20202.w60,
.logo-kcis1980.w60 {
    background-position: -132rem -144rem
}

.logo-bank368.w64,
.logo-kcb20202.w64,
.logo-kcis1980.w64 {
    background-position: -140.8rem -153.6rem
}

.logo-bank368.w65,
.logo-kcb20202.w65,
.logo-kcis1980.w65 {
    background-position: -143rem -156rem
}

.logo-bank368.w72,
.logo-kcb20202.w72,
.logo-kcis1980.w72 {
    background-position: -158.4rem -172.8rem
}

/*! 수협카드 */

.logo-bank369.w16 {
    background-position: -38.4rem -38.4rem
}

.logo-bank369.w20 {
    background-position: -48rem -48rem
}

.logo-bank369.w22 {
    background-position: -52.8rem -52.8rem
}

.logo-bank369.w24 {
    background-position: -57.6rem -57.6rem
}

.logo-bank369.w28 {
    background-position: -67.2rem -67.2rem
}

.logo-bank369.w30 {
    background-position: -72rem -72rem
}

.logo-bank369.w32 {
    background-position: -76.8rem -76.8rem
}

.logo-bank369.w34 {
    background-position: -81.6rem -81.6rem
}

.logo-bank369.w36 {
    background-position: -86.4rem -86.4rem
}

.logo-bank369.w40 {
    background-position: -96rem -96rem
}

.logo-bank369.w44 {
    background-position: -105.6rem -105.6rem
}

.logo-bank369.w50 {
    background-position: -120rem -120rem
}

.logo-bank369.w52 {
    background-position: -124.8rem -124.8rem
}

.logo-bank369.w60 {
    background-position: -144rem -144rem
}

.logo-bank369.w64 {
    background-position: -153.6rem -153.6rem
}

.logo-bank369.w65 {
    background-position: -156rem -156rem
}

.logo-bank369.w72 {
    background-position: -172.8rem -172.8rem
}

/*! 씨티카드 */

.logo-bank370.w16 {
    background-position: -41.6rem 0
}

.logo-bank370.w20 {
    background-position: -52rem 0
}

.logo-bank370.w22 {
    background-position: -57.2rem 0
}

.logo-bank370.w24 {
    background-position: -62.4rem 0
}

.logo-bank370.w28 {
    background-position: -72.8rem 0
}

.logo-bank370.w30 {
    background-position: -78rem 0
}

.logo-bank370.w32 {
    background-position: -83.2rem 0
}

.logo-bank370.w34 {
    background-position: -88.4rem 0
}

.logo-bank370.w36 {
    background-position: -93.6rem 0
}

.logo-bank370.w40 {
    background-position: -104rem 0
}

.logo-bank370.w44 {
    background-position: -114.4rem 0
}

.logo-bank370.w50 {
    background-position: -130rem 0
}

.logo-bank370.w52 {
    background-position: -135.2rem 0
}

.logo-bank370.w60 {
    background-position: -156rem 0
}

.logo-bank370.w64 {
    background-position: -166.4rem 0
}

.logo-bank370.w65 {
    background-position: -169rem 0
}

.logo-bank370.w72 {
    background-position: -187.2rem 0
}

/*! NH농협카드 */

.logo-bank371.w16 {
    background-position: -41.6rem -3.2rem
}

.logo-bank371.w20 {
    background-position: -52rem -4rem
}

.logo-bank371.w22 {
    background-position: -57.2rem -4.4rem
}

.logo-bank371.w24 {
    background-position: -62.4rem -4.8rem
}

.logo-bank371.w28 {
    background-position: -72.8rem -5.6rem
}

.logo-bank371.w30 {
    background-position: -78rem -6rem
}

.logo-bank371.w32 {
    background-position: -83.2rem -6.4rem
}

.logo-bank371.w34 {
    background-position: -88.4rem -6.8rem
}

.logo-bank371.w36 {
    background-position: -93.6rem -7.2rem
}

.logo-bank371.w40 {
    background-position: -104rem -8rem
}

.logo-bank371.w44 {
    background-position: -114.4rem -8.8rem
}

.logo-bank371.w50 {
    background-position: -130rem -10rem
}

.logo-bank371.w52 {
    background-position: -135.2rem -10.4rem
}

.logo-bank371.w60 {
    background-position: -156rem -12rem
}

.logo-bank371.w64 {
    background-position: -166.4rem -12.8rem
}

.logo-bank371.w65 {
    background-position: -169rem -13rem
}

.logo-bank371.w72 {
    background-position: -187.2rem -14.4rem
}

/*! 전북카드 */

.logo-bank372.w16 {
    background-position: -41.6rem -6.4rem
}

.logo-bank372.w20 {
    background-position: -52rem -8rem
}

.logo-bank372.w22 {
    background-position: -57.2rem -8.8rem
}

.logo-bank372.w24 {
    background-position: -62.4rem -9.6rem
}

.logo-bank372.w28 {
    background-position: -72.8rem -11.2rem
}

.logo-bank372.w30 {
    background-position: -78rem -12rem
}

.logo-bank372.w32 {
    background-position: -83.2rem -12.8rem
}

.logo-bank372.w34 {
    background-position: -88.4rem -13.6rem
}

.logo-bank372.w36 {
    background-position: -93.6rem -14.4rem
}

.logo-bank372.w40 {
    background-position: -104rem -16rem
}

.logo-bank372.w44 {
    background-position: -114.4rem -17.6rem
}

.logo-bank372.w50 {
    background-position: -130rem -20rem
}

.logo-bank372.w52 {
    background-position: -135.2rem -20.8rem
}

.logo-bank372.w60 {
    background-position: -156rem -24rem
}

.logo-bank372.w64 {
    background-position: -166.4rem -25.6rem
}

.logo-bank372.w65 {
    background-position: -169rem -26rem
}

.logo-bank372.w72 {
    background-position: -187.2rem -28.8rem
}

/*! 제주카드 */

.logo-bank373.w16 {
    background-position: -41.6rem -9.6rem
}

.logo-bank373.w20 {
    background-position: -52rem -12rem
}

.logo-bank373.w22 {
    background-position: -57.2rem -13.2rem
}

.logo-bank373.w24 {
    background-position: -62.4rem -14.4rem
}

.logo-bank373.w28 {
    background-position: -72.8rem -16.8rem
}

.logo-bank373.w30 {
    background-position: -78rem -18rem
}

.logo-bank373.w32 {
    background-position: -83.2rem -19.2rem
}

.logo-bank373.w34 {
    background-position: -88.4rem -20.4rem
}

.logo-bank373.w36 {
    background-position: -93.6rem -21.6rem
}

.logo-bank373.w40 {
    background-position: -104rem -24rem
}

.logo-bank373.w44 {
    background-position: -114.4rem -26.4rem
}

.logo-bank373.w50 {
    background-position: -130rem -30rem
}

.logo-bank373.w52 {
    background-position: -135.2rem -31.2rem
}

.logo-bank373.w60 {
    background-position: -156rem -36rem
}

.logo-bank373.w64 {
    background-position: -166.4rem -38.4rem
}

.logo-bank373.w65 {
    background-position: -169rem -39rem
}

.logo-bank373.w72 {
    background-position: -187.2rem -43.2rem
}

/*! 하나카드 */

.logo-bank374.w16 {
    background-position: -41.6rem -12.8rem
}

.logo-bank374.w20 {
    background-position: -52rem -16rem
}

.logo-bank374.w22 {
    background-position: -57.2rem -17.6rem
}

.logo-bank374.w24 {
    background-position: -62.4rem -19.2rem
}

.logo-bank374.w28 {
    background-position: -72.8rem -22.4rem
}

.logo-bank374.w30 {
    background-position: -78rem -24rem
}

.logo-bank374.w32 {
    background-position: -83.2rem -25.6rem
}

.logo-bank374.w34 {
    background-position: -88.4rem -27.2rem
}

.logo-bank374.w36 {
    background-position: -93.6rem -28.8rem
}

.logo-bank374.w40 {
    background-position: -104rem -32rem
}

.logo-bank374.w44 {
    background-position: -114.4rem -35.2rem
}

.logo-bank374.w50 {
    background-position: -130rem -40rem
}

.logo-bank374.w52 {
    background-position: -135.2rem -41.6rem
}

.logo-bank374.w60 {
    background-position: -156rem -48rem
}

.logo-bank374.w64 {
    background-position: -166.4rem -51.2rem
}

.logo-bank374.w65 {
    background-position: -169rem -52rem
}

.logo-bank374.w72 {
    background-position: -187.2rem -57.6rem
}

/*! 국민카드 */

.logo-bank381.w16,
.logo-kcis1870.w16 {
    background-position: -41.6rem -16rem
}

.logo-bank381.w20,
.logo-kcis1870.w20 {
    background-position: -52rem -20rem
}

.logo-bank381.w22,
.logo-kcis1870.w22 {
    background-position: -57.2rem -22rem
}

.logo-bank381.w24,
.logo-kcis1870.w24 {
    background-position: -62.4rem -24rem
}

.logo-bank381.w28,
.logo-kcis1870.w28 {
    background-position: -72.8rem -28rem
}

.logo-bank381.w30,
.logo-kcis1870.w30 {
    background-position: -78rem -30rem
}

.logo-bank381.w32,
.logo-kcis1870.w32 {
    background-position: -83.2rem -32rem
}

.logo-bank381.w34,
.logo-kcis1870.w34 {
    background-position: -88.4rem -34rem
}

.logo-bank381.w36,
.logo-kcis1870.w36 {
    background-position: -93.6rem -36rem
}

.logo-bank381.w40,
.logo-kcis1870.w40 {
    background-position: -104rem -40rem
}

.logo-bank381.w44,
.logo-kcis1870.w44 {
    background-position: -114.4rem -44rem
}

.logo-bank381.w50,
.logo-kcis1870.w50 {
    background-position: -130rem -50rem
}

.logo-bank381.w52,
.logo-kcis1870.w52 {
    background-position: -135.2rem -52rem
}

.logo-bank381.w60,
.logo-kcis1870.w60 {
    background-position: -156rem -60rem
}

.logo-bank381.w64,
.logo-kcis1870.w64 {
    background-position: -166.4rem -64rem
}

.logo-bank381.w65,
.logo-kcis1870.w65 {
    background-position: -169rem -65rem
}

.logo-bank381.w72,
.logo-kcis1870.w72 {
    background-position: -187.2rem -72rem
}

/*! component element   !-- FETASK-1868 [KDS 3.47459] 03_logo capital 14종 추가 2023-12-06 --! icon 캐피탈 (총 14개) ======================================== */

/*! 우리금융캐피탈 */

.logo-bank299.w16,
.logo-kcis3620.w16 {
    background-position: -38.4rem -12.8rem
}

.logo-bank299.w20,
.logo-kcis3620.w20 {
    background-position: -48rem -16rem
}

.logo-bank299.w22,
.logo-kcis3620.w22 {
    background-position: -52.8rem -17.6rem
}

.logo-bank299.w24,
.logo-kcis3620.w24 {
    background-position: -57.6rem -19.2rem
}

.logo-bank299.w28,
.logo-kcis3620.w28 {
    background-position: -67.2rem -22.4rem
}

.logo-bank299.w30,
.logo-kcis3620.w30 {
    background-position: -72rem -24rem
}

.logo-bank299.w32,
.logo-kcis3620.w32 {
    background-position: -76.8rem -25.6rem
}

.logo-bank299.w34,
.logo-kcis3620.w34 {
    background-position: -81.6rem -27.2rem
}

.logo-bank299.w36,
.logo-kcis3620.w36 {
    background-position: -86.4rem -28.8rem
}

.logo-bank299.w40,
.logo-kcis3620.w40 {
    background-position: -96rem -32rem
}

.logo-bank299.w44,
.logo-kcis3620.w44 {
    background-position: -105.6rem -35.2rem
}

.logo-bank299.w50,
.logo-kcis3620.w50 {
    background-position: -120rem -40rem
}

.logo-bank299.w52,
.logo-kcis3620.w52 {
    background-position: -124.8rem -41.6rem
}

.logo-bank299.w60,
.logo-kcis3620.w60 {
    background-position: -144rem -48rem
}

.logo-bank299.w64,
.logo-kcis3620.w64 {
    background-position: -153.6rem -51.2rem
}

.logo-bank299.w65,
.logo-kcis3620.w65 {
    background-position: -156rem -52rem
}

.logo-bank299.w72,
.logo-kcis3620.w72 {
    background-position: -172.8rem -57.6rem
}

/*! DGB캐피탈 > iM캐피탈 사명 변경 CHPFMTASK-2030 */

.logo-bank301.w16,
.logo-kcb20318.w16,
.logo-kcis3980.w16 {
    background-position: -38.4rem -16rem
}

.logo-bank301.w20,
.logo-kcb20318.w20,
.logo-kcis3980.w20 {
    background-position: -48rem -20rem
}

.logo-bank301.w22,
.logo-kcb20318.w22,
.logo-kcis3980.w22 {
    background-position: -52.8rem -22rem
}

.logo-bank301.w24,
.logo-kcb20318.w24,
.logo-kcis3980.w24 {
    background-position: -57.6rem -24rem
}

.logo-bank301.w28,
.logo-kcb20318.w28,
.logo-kcis3980.w28 {
    background-position: -67.2rem -28rem
}

.logo-bank301.w30,
.logo-kcb20318.w30,
.logo-kcis3980.w30 {
    background-position: -72rem -30rem
}

.logo-bank301.w32,
.logo-kcb20318.w32,
.logo-kcis3980.w32 {
    background-position: -76.8rem -32rem
}

.logo-bank301.w34,
.logo-kcb20318.w34,
.logo-kcis3980.w34 {
    background-position: -81.6rem -34rem
}

.logo-bank301.w36,
.logo-kcb20318.w36,
.logo-kcis3980.w36 {
    background-position: -86.4rem -36rem
}

.logo-bank301.w40,
.logo-kcb20318.w40,
.logo-kcis3980.w40 {
    background-position: -96rem -40rem
}

.logo-bank301.w44,
.logo-kcb20318.w44,
.logo-kcis3980.w44 {
    background-position: -105.6rem -44rem
}

.logo-bank301.w50,
.logo-kcb20318.w50,
.logo-kcis3980.w50 {
    background-position: -120rem -50rem
}

.logo-bank301.w52,
.logo-kcb20318.w52,
.logo-kcis3980.w52 {
    background-position: -124.8rem -52rem
}

.logo-bank301.w60,
.logo-kcb20318.w60,
.logo-kcis3980.w60 {
    background-position: -144rem -60rem
}

.logo-bank301.w64,
.logo-kcb20318.w64,
.logo-kcis3980.w64 {
    background-position: -153.6rem -64rem
}

.logo-bank301.w65,
.logo-kcb20318.w65,
.logo-kcis3980.w65 {
    background-position: -156rem -65rem
}

.logo-bank301.w72,
.logo-kcb20318.w72,
.logo-kcis3980.w72 {
    background-position: -172.8rem -72rem
}

/*! BNK캐피탈 */

.logo-bank302.w16,
.logo-kcis3548.w16 {
    background-position: -35.2rem 0
}

.logo-bank302.w20,
.logo-kcis3548.w20 {
    background-position: -44rem 0
}

.logo-bank302.w22,
.logo-kcis3548.w22 {
    background-position: -48.4rem 0
}

.logo-bank302.w24,
.logo-kcis3548.w24 {
    background-position: -52.8rem 0
}

.logo-bank302.w28,
.logo-kcis3548.w28 {
    background-position: -61.6rem 0
}

.logo-bank302.w30,
.logo-kcis3548.w30 {
    background-position: -66rem 0
}

.logo-bank302.w32,
.logo-kcis3548.w32 {
    background-position: -70.4rem 0
}

.logo-bank302.w34,
.logo-kcis3548.w34 {
    background-position: -74.8rem 0
}

.logo-bank302.w36,
.logo-kcis3548.w36 {
    background-position: -79.2rem 0
}

.logo-bank302.w40,
.logo-kcis3548.w40 {
    background-position: -88rem 0
}

.logo-bank302.w44,
.logo-kcis3548.w44 {
    background-position: -96.8rem 0
}

.logo-bank302.w50,
.logo-kcis3548.w50 {
    background-position: -110rem 0
}

.logo-bank302.w52,
.logo-kcis3548.w52 {
    background-position: -114.4rem 0
}

.logo-bank302.w60,
.logo-kcis3548.w60 {
    background-position: -132rem 0
}

.logo-bank302.w64,
.logo-kcis3548.w64 {
    background-position: -140.8rem 0
}

.logo-bank302.w65,
.logo-kcis3548.w65 {
    background-position: -143rem 0
}

.logo-bank302.w72,
.logo-kcis3548.w72 {
    background-position: -158.4rem 0
}

/*! 롯데캐피탈 */

.logo-bank303.w16,
.logo-kcis3700.w16 {
    background-position: -38.4rem -22.4rem
}

.logo-bank303.w20,
.logo-kcis3700.w20 {
    background-position: -48rem -28rem
}

.logo-bank303.w22,
.logo-kcis3700.w22 {
    background-position: -52.8rem -30.8rem
}

.logo-bank303.w24,
.logo-kcis3700.w24 {
    background-position: -57.6rem -33.6rem
}

.logo-bank303.w28,
.logo-kcis3700.w28 {
    background-position: -67.2rem -39.2rem
}

.logo-bank303.w30,
.logo-kcis3700.w30 {
    background-position: -72rem -42rem
}

.logo-bank303.w32,
.logo-kcis3700.w32 {
    background-position: -76.8rem -44.8rem
}

.logo-bank303.w34,
.logo-kcis3700.w34 {
    background-position: -81.6rem -47.6rem
}

.logo-bank303.w36,
.logo-kcis3700.w36 {
    background-position: -86.4rem -50.4rem
}

.logo-bank303.w40,
.logo-kcis3700.w40 {
    background-position: -96rem -56rem
}

.logo-bank303.w44,
.logo-kcis3700.w44 {
    background-position: -105.6rem -61.6rem
}

.logo-bank303.w50,
.logo-kcis3700.w50 {
    background-position: -120rem -70rem
}

.logo-bank303.w52,
.logo-kcis3700.w52 {
    background-position: -124.8rem -72.8rem
}

.logo-bank303.w60,
.logo-kcis3700.w60 {
    background-position: -144rem -84rem
}

.logo-bank303.w64,
.logo-kcis3700.w64 {
    background-position: -153.6rem -89.6rem
}

.logo-bank303.w65,
.logo-kcis3700.w65 {
    background-position: -156rem -91rem
}

.logo-bank303.w72,
.logo-kcis3700.w72 {
    background-position: -172.8rem -100.8rem
}

/*! 현대캐피탈 */

.logo-bank304.w16,
.logo-kcis3610.w16 {
    background-position: -38.4rem -25.6rem
}

.logo-bank304.w20,
.logo-kcis3610.w20 {
    background-position: -48rem -32rem
}

.logo-bank304.w22,
.logo-kcis3610.w22 {
    background-position: -52.8rem -35.2rem
}

.logo-bank304.w24,
.logo-kcis3610.w24 {
    background-position: -57.6rem -38.4rem
}

.logo-bank304.w28,
.logo-kcis3610.w28 {
    background-position: -67.2rem -44.8rem
}

.logo-bank304.w30,
.logo-kcis3610.w30 {
    background-position: -72rem -48rem
}

.logo-bank304.w32,
.logo-kcis3610.w32 {
    background-position: -76.8rem -51.2rem
}

.logo-bank304.w34,
.logo-kcis3610.w34 {
    background-position: -81.6rem -54.4rem
}

.logo-bank304.w36,
.logo-kcis3610.w36 {
    background-position: -86.4rem -57.6rem
}

.logo-bank304.w40,
.logo-kcis3610.w40 {
    background-position: -96rem -64rem
}

.logo-bank304.w44,
.logo-kcis3610.w44 {
    background-position: -105.6rem -70.4rem
}

.logo-bank304.w50,
.logo-kcis3610.w50 {
    background-position: -120rem -80rem
}

.logo-bank304.w52,
.logo-kcis3610.w52 {
    background-position: -124.8rem -83.2rem
}

.logo-bank304.w60,
.logo-kcis3610.w60 {
    background-position: -144rem -96rem
}

.logo-bank304.w64,
.logo-kcis3610.w64 {
    background-position: -153.6rem -102.4rem
}

.logo-bank304.w65,
.logo-kcis3610.w65 {
    background-position: -156rem -104rem
}

.logo-bank304.w72,
.logo-kcis3610.w72 {
    background-position: -172.8rem -115.2rem
}

/*! JB우리캐피탈 */

.logo-bank305.w16,
.logo-kcis3730.w16 {
    background-position: -38.4rem -28.8rem
}

.logo-bank305.w20,
.logo-kcis3730.w20 {
    background-position: -48rem -36rem
}

.logo-bank305.w22,
.logo-kcis3730.w22 {
    background-position: -52.8rem -39.6rem
}

.logo-bank305.w24,
.logo-kcis3730.w24 {
    background-position: -57.6rem -43.2rem
}

.logo-bank305.w28,
.logo-kcis3730.w28 {
    background-position: -67.2rem -50.4rem
}

.logo-bank305.w30,
.logo-kcis3730.w30 {
    background-position: -72rem -54rem
}

.logo-bank305.w32,
.logo-kcis3730.w32 {
    background-position: -76.8rem -57.6rem
}

.logo-bank305.w34,
.logo-kcis3730.w34 {
    background-position: -81.6rem -61.2rem
}

.logo-bank305.w36,
.logo-kcis3730.w36 {
    background-position: -86.4rem -64.8rem
}

.logo-bank305.w40,
.logo-kcis3730.w40 {
    background-position: -96rem -72rem
}

.logo-bank305.w44,
.logo-kcis3730.w44 {
    background-position: -105.6rem -79.2rem
}

.logo-bank305.w50,
.logo-kcis3730.w50 {
    background-position: -120rem -90rem
}

.logo-bank305.w52,
.logo-kcis3730.w52 {
    background-position: -124.8rem -93.6rem
}

.logo-bank305.w60,
.logo-kcis3730.w60 {
    background-position: -144rem -108rem
}

.logo-bank305.w64,
.logo-kcis3730.w64 {
    background-position: -153.6rem -115.2rem
}

.logo-bank305.w65,
.logo-kcis3730.w65 {
    background-position: -156rem -117rem
}

.logo-bank305.w72,
.logo-kcis3730.w72 {
    background-position: -172.8rem -129.6rem
}

/*! NH캐피탈 */

.logo-bank306.w16,
.logo-kcis3900.w16 {
    background-position: -38.4rem -32rem
}

.logo-bank306.w20,
.logo-kcis3900.w20 {
    background-position: -48rem -40rem
}

.logo-bank306.w22,
.logo-kcis3900.w22 {
    background-position: -52.8rem -44rem
}

.logo-bank306.w24,
.logo-kcis3900.w24 {
    background-position: -57.6rem -48rem
}

.logo-bank306.w28,
.logo-kcis3900.w28 {
    background-position: -67.2rem -56rem
}

.logo-bank306.w30,
.logo-kcis3900.w30 {
    background-position: -72rem -60rem
}

.logo-bank306.w32,
.logo-kcis3900.w32 {
    background-position: -76.8rem -64rem
}

.logo-bank306.w34,
.logo-kcis3900.w34 {
    background-position: -81.6rem -68rem
}

.logo-bank306.w36,
.logo-kcis3900.w36 {
    background-position: -86.4rem -72rem
}

.logo-bank306.w40,
.logo-kcis3900.w40 {
    background-position: -96rem -80rem
}

.logo-bank306.w44,
.logo-kcis3900.w44 {
    background-position: -105.6rem -88rem
}

.logo-bank306.w50,
.logo-kcis3900.w50 {
    background-position: -120rem -100rem
}

.logo-bank306.w52,
.logo-kcis3900.w52 {
    background-position: -124.8rem -104rem
}

.logo-bank306.w60,
.logo-kcis3900.w60 {
    background-position: -144rem -120rem
}

.logo-bank306.w64,
.logo-kcis3900.w64 {
    background-position: -153.6rem -128rem
}

.logo-bank306.w65,
.logo-kcis3900.w65 {
    background-position: -156rem -130rem
}

.logo-bank306.w72,
.logo-kcis3900.w72 {
    background-position: -172.8rem -144rem
}

/*! 에큐온캐피탈 */

.logo-bank307.w16,
.logo-kcis3541.w16 {
    background-position: -38.4rem -35.2rem
}

.logo-bank307.w20,
.logo-kcis3541.w20 {
    background-position: -48rem -44rem
}

.logo-bank307.w22,
.logo-kcis3541.w22 {
    background-position: -52.8rem -48.4rem
}

.logo-bank307.w24,
.logo-kcis3541.w24 {
    background-position: -57.6rem -52.8rem
}

.logo-bank307.w28,
.logo-kcis3541.w28 {
    background-position: -67.2rem -61.6rem
}

.logo-bank307.w30,
.logo-kcis3541.w30 {
    background-position: -72rem -66rem
}

.logo-bank307.w32,
.logo-kcis3541.w32 {
    background-position: -76.8rem -70.4rem
}

.logo-bank307.w34,
.logo-kcis3541.w34 {
    background-position: -81.6rem -74.8rem
}

.logo-bank307.w36,
.logo-kcis3541.w36 {
    background-position: -86.4rem -79.2rem
}

.logo-bank307.w40,
.logo-kcis3541.w40 {
    background-position: -96rem -88rem
}

.logo-bank307.w44,
.logo-kcis3541.w44 {
    background-position: -105.6rem -96.8rem
}

.logo-bank307.w50,
.logo-kcis3541.w50 {
    background-position: -120rem -110rem
}

.logo-bank307.w52,
.logo-kcis3541.w52 {
    background-position: -124.8rem -114.4rem
}

.logo-bank307.w60,
.logo-kcis3541.w60 {
    background-position: -144rem -132rem
}

.logo-bank307.w64,
.logo-kcis3541.w64 {
    background-position: -153.6rem -140.8rem
}

.logo-bank307.w65,
.logo-kcis3541.w65 {
    background-position: -156rem -143rem
}

.logo-bank307.w72,
.logo-kcis3541.w72 {
    background-position: -172.8rem -158.4rem
}

/*! KB캐피탈 */

.logo-bank308.w16,
.logo-kcis3524.w16 {
    background-position: 0 -38.4rem
}

.logo-bank308.w20,
.logo-kcis3524.w20 {
    background-position: 0 -48rem
}

.logo-bank308.w22,
.logo-kcis3524.w22 {
    background-position: 0 -52.8rem
}

.logo-bank308.w24,
.logo-kcis3524.w24 {
    background-position: 0 -57.6rem
}

.logo-bank308.w28,
.logo-kcis3524.w28 {
    background-position: 0 -67.2rem
}

.logo-bank308.w30,
.logo-kcis3524.w30 {
    background-position: 0 -72rem
}

.logo-bank308.w32,
.logo-kcis3524.w32 {
    background-position: 0 -76.8rem
}

.logo-bank308.w34,
.logo-kcis3524.w34 {
    background-position: 0 -81.6rem
}

.logo-bank308.w36,
.logo-kcis3524.w36 {
    background-position: 0 -86.4rem
}

.logo-bank308.w40,
.logo-kcis3524.w40 {
    background-position: 0 -96rem
}

.logo-bank308.w44,
.logo-kcis3524.w44 {
    background-position: 0 -105.6rem
}

.logo-bank308.w50,
.logo-kcis3524.w50 {
    background-position: 0 -120rem
}

.logo-bank308.w52,
.logo-kcis3524.w52 {
    background-position: 0 -124.8rem
}

.logo-bank308.w60,
.logo-kcis3524.w60 {
    background-position: 0 -144rem
}

.logo-bank308.w64,
.logo-kcis3524.w64 {
    background-position: 0 -153.6rem
}

.logo-bank308.w65,
.logo-kcis3524.w65 {
    background-position: 0 -156rem
}

.logo-bank308.w72,
.logo-kcis3524.w72 {
    background-position: 0 -172.8rem
}

/*! 한국캐피탈 */

.logo-bank309.w16,
.logo-kcb20320.w16,
.logo-kcis3550.w16 {
    background-position: -3.2rem -38.4rem
}

.logo-bank309.w20,
.logo-kcb20320.w20,
.logo-kcis3550.w20 {
    background-position: -4rem -48rem
}

.logo-bank309.w22,
.logo-kcb20320.w22,
.logo-kcis3550.w22 {
    background-position: -4.4rem -52.8rem
}

.logo-bank309.w24,
.logo-kcb20320.w24,
.logo-kcis3550.w24 {
    background-position: -4.8rem -57.6rem
}

.logo-bank309.w28,
.logo-kcb20320.w28,
.logo-kcis3550.w28 {
    background-position: -5.6rem -67.2rem
}

.logo-bank309.w30,
.logo-kcb20320.w30,
.logo-kcis3550.w30 {
    background-position: -6rem -72rem
}

.logo-bank309.w32,
.logo-kcb20320.w32,
.logo-kcis3550.w32 {
    background-position: -6.4rem -76.8rem
}

.logo-bank309.w34,
.logo-kcb20320.w34,
.logo-kcis3550.w34 {
    background-position: -6.8rem -81.6rem
}

.logo-bank309.w36,
.logo-kcb20320.w36,
.logo-kcis3550.w36 {
    background-position: -7.2rem -86.4rem
}

.logo-bank309.w40,
.logo-kcb20320.w40,
.logo-kcis3550.w40 {
    background-position: -8rem -96rem
}

.logo-bank309.w44,
.logo-kcb20320.w44,
.logo-kcis3550.w44 {
    background-position: -8.8rem -105.6rem
}

.logo-bank309.w50,
.logo-kcb20320.w50,
.logo-kcis3550.w50 {
    background-position: -10rem -120rem
}

.logo-bank309.w52,
.logo-kcb20320.w52,
.logo-kcis3550.w52 {
    background-position: -10.4rem -124.8rem
}

.logo-bank309.w60,
.logo-kcb20320.w60,
.logo-kcis3550.w60 {
    background-position: -12rem -144rem
}

.logo-bank309.w64,
.logo-kcb20320.w64,
.logo-kcis3550.w64 {
    background-position: -12.8rem -153.6rem
}

.logo-bank309.w65,
.logo-kcb20320.w65,
.logo-kcis3550.w65 {
    background-position: -13rem -156rem
}

.logo-bank309.w72,
.logo-kcb20320.w72,
.logo-kcis3550.w72 {
    background-position: -14.4rem -172.8rem
}

/*! 하나캐피탈 */

.logo-bank310.w16,
.logo-kcis3750.w16 {
    background-position: -6.4rem -38.4rem
}

.logo-bank310.w20,
.logo-kcis3750.w20 {
    background-position: -8rem -48rem
}

.logo-bank310.w22,
.logo-kcis3750.w22 {
    background-position: -8.8rem -52.8rem
}

.logo-bank310.w24,
.logo-kcis3750.w24 {
    background-position: -9.6rem -57.6rem
}

.logo-bank310.w28,
.logo-kcis3750.w28 {
    background-position: -11.2rem -67.2rem
}

.logo-bank310.w30,
.logo-kcis3750.w30 {
    background-position: -12rem -72rem
}

.logo-bank310.w32,
.logo-kcis3750.w32 {
    background-position: -12.8rem -76.8rem
}

.logo-bank310.w34,
.logo-kcis3750.w34 {
    background-position: -13.6rem -81.6rem
}

.logo-bank310.w36,
.logo-kcis3750.w36 {
    background-position: -14.4rem -86.4rem
}

.logo-bank310.w40,
.logo-kcis3750.w40 {
    background-position: -16rem -96rem
}

.logo-bank310.w44,
.logo-kcis3750.w44 {
    background-position: -17.6rem -105.6rem
}

.logo-bank310.w50,
.logo-kcis3750.w50 {
    background-position: -20rem -120rem
}

.logo-bank310.w52,
.logo-kcis3750.w52 {
    background-position: -20.8rem -124.8rem
}

.logo-bank310.w60,
.logo-kcis3750.w60 {
    background-position: -24rem -144rem
}

.logo-bank310.w64,
.logo-kcis3750.w64 {
    background-position: -25.6rem -153.6rem
}

.logo-bank310.w65,
.logo-kcis3750.w65 {
    background-position: -26rem -156rem
}

.logo-bank310.w72,
.logo-kcis3750.w72 {
    background-position: -28.8rem -172.8rem
}

/*! 미래에셋캐피탈 */

.logo-bank311.w16 {
    background-position: -9.6rem -38.4rem
}

.logo-bank311.w20 {
    background-position: -12rem -48rem
}

.logo-bank311.w22 {
    background-position: -13.2rem -52.8rem
}

.logo-bank311.w24 {
    background-position: -14.4rem -57.6rem
}

.logo-bank311.w28 {
    background-position: -16.8rem -67.2rem
}

.logo-bank311.w30 {
    background-position: -18rem -72rem
}

.logo-bank311.w32 {
    background-position: -19.2rem -76.8rem
}

.logo-bank311.w34 {
    background-position: -20.4rem -81.6rem
}

.logo-bank311.w36 {
    background-position: -21.6rem -86.4rem
}

.logo-bank311.w40 {
    background-position: -24rem -96rem
}

.logo-bank311.w44 {
    background-position: -26.4rem -105.6rem
}

.logo-bank311.w50 {
    background-position: -30rem -120rem
}

.logo-bank311.w52 {
    background-position: -31.2rem -124.8rem
}

.logo-bank311.w60 {
    background-position: -36rem -144rem
}

.logo-bank311.w64 {
    background-position: -38.4rem -153.6rem
}

.logo-bank311.w65 {
    background-position: -39rem -156rem
}

.logo-bank311.w72 {
    background-position: -43.2rem -172.8rem
}

/*! 오케이캐피탈 */

.logo-bank312.w16,
.logo-kcb20315.w16,
.logo-kcis3920.w16 {
    background-position: -12.8rem -38.4rem
}

.logo-bank312.w20,
.logo-kcb20315.w20,
.logo-kcis3920.w20 {
    background-position: -16rem -48rem
}

.logo-bank312.w22,
.logo-kcb20315.w22,
.logo-kcis3920.w22 {
    background-position: -17.6rem -52.8rem
}

.logo-bank312.w24,
.logo-kcb20315.w24,
.logo-kcis3920.w24 {
    background-position: -19.2rem -57.6rem
}

.logo-bank312.w28,
.logo-kcb20315.w28,
.logo-kcis3920.w28 {
    background-position: -22.4rem -67.2rem
}

.logo-bank312.w30,
.logo-kcb20315.w30,
.logo-kcis3920.w30 {
    background-position: -24rem -72rem
}

.logo-bank312.w32,
.logo-kcb20315.w32,
.logo-kcis3920.w32 {
    background-position: -25.6rem -76.8rem
}

.logo-bank312.w34,
.logo-kcb20315.w34,
.logo-kcis3920.w34 {
    background-position: -27.2rem -81.6rem
}

.logo-bank312.w36,
.logo-kcb20315.w36,
.logo-kcis3920.w36 {
    background-position: -28.8rem -86.4rem
}

.logo-bank312.w40,
.logo-kcb20315.w40,
.logo-kcis3920.w40 {
    background-position: -32rem -96rem
}

.logo-bank312.w44,
.logo-kcb20315.w44,
.logo-kcis3920.w44 {
    background-position: -35.2rem -105.6rem
}

.logo-bank312.w50,
.logo-kcb20315.w50,
.logo-kcis3920.w50 {
    background-position: -40rem -120rem
}

.logo-bank312.w52,
.logo-kcb20315.w52,
.logo-kcis3920.w52 {
    background-position: -41.6rem -124.8rem
}

.logo-bank312.w60,
.logo-kcb20315.w60,
.logo-kcis3920.w60 {
    background-position: -48rem -144rem
}

.logo-bank312.w64,
.logo-kcb20315.w64,
.logo-kcis3920.w64 {
    background-position: -51.2rem -153.6rem
}

.logo-bank312.w65,
.logo-kcb20315.w65,
.logo-kcis3920.w65 {
    background-position: -52rem -156rem
}

.logo-bank312.w72,
.logo-kcb20315.w72,
.logo-kcis3920.w72 {
    background-position: -57.6rem -172.8rem
}

/*! 한국투자캐피탈 */

.logo-bank313.w16 {
    background-position: -16rem -38.4rem
}

.logo-bank313.w20 {
    background-position: -20rem -48rem
}

.logo-bank313.w22 {
    background-position: -22rem -52.8rem
}

.logo-bank313.w24 {
    background-position: -24rem -57.6rem
}

.logo-bank313.w28 {
    background-position: -28rem -67.2rem
}

.logo-bank313.w30 {
    background-position: -30rem -72rem
}

.logo-bank313.w32 {
    background-position: -32rem -76.8rem
}

.logo-bank313.w34 {
    background-position: -34rem -81.6rem
}

.logo-bank313.w36 {
    background-position: -36rem -86.4rem
}

.logo-bank313.w40 {
    background-position: -40rem -96rem
}

.logo-bank313.w44 {
    background-position: -44rem -105.6rem
}

.logo-bank313.w50 {
    background-position: -50rem -120rem
}

.logo-bank313.w52 {
    background-position: -52rem -124.8rem
}

.logo-bank313.w60 {
    background-position: -60rem -144rem
}

.logo-bank313.w64 {
    background-position: -64rem -153.6rem
}

.logo-bank313.w65 {
    background-position: -65rem -156rem
}

.logo-bank313.w72 {
    background-position: -72rem -172.8rem
}

/*! component element   FETASK-875 대출이동시스템_기관추가 2023-04-18 ======================================== */

/*! 우리카드 */

.logo-bank041000.w16 {
    background-position: -12.8rem -6.4rem
}

.logo-bank041000.w20 {
    background-position: -16rem -8rem
}

.logo-bank041000.w22 {
    background-position: -17.6rem -8.8rem
}

.logo-bank041000.w24 {
    background-position: -19.2rem -9.6rem
}

.logo-bank041000.w28 {
    background-position: -22.4rem -11.2rem
}

.logo-bank041000.w30 {
    background-position: -24rem -12rem
}

.logo-bank041000.w32 {
    background-position: -25.6rem -12.8rem
}

.logo-bank041000.w34 {
    background-position: -27.2rem -13.6rem
}

.logo-bank041000.w36 {
    background-position: -28.8rem -14.4rem
}

.logo-bank041000.w40 {
    background-position: -32rem -16rem
}

.logo-bank041000.w44 {
    background-position: -35.2rem -17.6rem
}

.logo-bank041000.w50 {
    background-position: -40rem -20rem
}

.logo-bank041000.w52 {
    background-position: -41.6rem -20.8rem
}

.logo-bank041000.w60 {
    background-position: -48rem -24rem
}

.logo-bank041000.w64 {
    background-position: -51.2rem -25.6rem
}

.logo-bank041000.w65 {
    background-position: -52rem -26rem
}

.logo-bank041000.w72 {
    background-position: -57.6rem -28.8rem
}

/*! 우리카드 */

.logo-bank041001.w16 {
    background-position: -12.8rem -6.4rem
}

.logo-bank041001.w20 {
    background-position: -16rem -8rem
}

.logo-bank041001.w22 {
    background-position: -17.6rem -8.8rem
}

.logo-bank041001.w24 {
    background-position: -19.2rem -9.6rem
}

.logo-bank041001.w28 {
    background-position: -22.4rem -11.2rem
}

.logo-bank041001.w30 {
    background-position: -24rem -12rem
}

.logo-bank041001.w32 {
    background-position: -25.6rem -12.8rem
}

.logo-bank041001.w34 {
    background-position: -27.2rem -13.6rem
}

.logo-bank041001.w36 {
    background-position: -28.8rem -14.4rem
}

.logo-bank041001.w40 {
    background-position: -32rem -16rem
}

.logo-bank041001.w44 {
    background-position: -35.2rem -17.6rem
}

.logo-bank041001.w50 {
    background-position: -40rem -20rem
}

.logo-bank041001.w52 {
    background-position: -41.6rem -20.8rem
}

.logo-bank041001.w60 {
    background-position: -48rem -24rem
}

.logo-bank041001.w64 {
    background-position: -51.2rem -25.6rem
}

.logo-bank041001.w65 {
    background-position: -52rem -26rem
}

.logo-bank041001.w72 {
    background-position: -57.6rem -28.8rem
}

/*! 우리카드 */

.logo-bank041002.w16 {
    background-position: -12.8rem -6.4rem
}

.logo-bank041002.w20 {
    background-position: -16rem -8rem
}

.logo-bank041002.w22 {
    background-position: -17.6rem -8.8rem
}

.logo-bank041002.w24 {
    background-position: -19.2rem -9.6rem
}

.logo-bank041002.w28 {
    background-position: -22.4rem -11.2rem
}

.logo-bank041002.w30 {
    background-position: -24rem -12rem
}

.logo-bank041002.w32 {
    background-position: -25.6rem -12.8rem
}

.logo-bank041002.w34 {
    background-position: -27.2rem -13.6rem
}

.logo-bank041002.w36 {
    background-position: -28.8rem -14.4rem
}

.logo-bank041002.w40 {
    background-position: -32rem -16rem
}

.logo-bank041002.w44 {
    background-position: -35.2rem -17.6rem
}

.logo-bank041002.w50 {
    background-position: -40rem -20rem
}

.logo-bank041002.w52 {
    background-position: -41.6rem -20.8rem
}

.logo-bank041002.w60 {
    background-position: -48rem -24rem
}

.logo-bank041002.w64 {
    background-position: -51.2rem -25.6rem
}

.logo-bank041002.w65 {
    background-position: -52rem -26rem
}

.logo-bank041002.w72 {
    background-position: -57.6rem -28.8rem
}

/*! 롯데카드 */

.logo-bank368000.w16 {
    background-position: -35.2rem -38.4rem
}

.logo-bank368000.w20 {
    background-position: -44rem -48rem
}

.logo-bank368000.w22 {
    background-position: -48.4rem -52.8rem
}

.logo-bank368000.w24 {
    background-position: -52.8rem -57.6rem
}

.logo-bank368000.w28 {
    background-position: -61.6rem -67.2rem
}

.logo-bank368000.w30 {
    background-position: -66rem -72rem
}

.logo-bank368000.w32 {
    background-position: -70.4rem -76.8rem
}

.logo-bank368000.w34 {
    background-position: -74.8rem -81.6rem
}

.logo-bank368000.w36 {
    background-position: -79.2rem -86.4rem
}

.logo-bank368000.w40 {
    background-position: -88rem -96rem
}

.logo-bank368000.w44 {
    background-position: -96.8rem -105.6rem
}

.logo-bank368000.w50 {
    background-position: -110rem -120rem
}

.logo-bank368000.w52 {
    background-position: -114.4rem -124.8rem
}

.logo-bank368000.w60 {
    background-position: -132rem -144rem
}

.logo-bank368000.w64 {
    background-position: -140.8rem -153.6rem
}

.logo-bank368000.w65 {
    background-position: -143rem -156rem
}

.logo-bank368000.w72 {
    background-position: -158.4rem -172.8rem
}

/*! 롯데카드 */

.logo-bank368001.w16 {
    background-position: -35.2rem -38.4rem
}

.logo-bank368001.w20 {
    background-position: -44rem -48rem
}

.logo-bank368001.w22 {
    background-position: -48.4rem -52.8rem
}

.logo-bank368001.w24 {
    background-position: -52.8rem -57.6rem
}

.logo-bank368001.w28 {
    background-position: -61.6rem -67.2rem
}

.logo-bank368001.w30 {
    background-position: -66rem -72rem
}

.logo-bank368001.w32 {
    background-position: -70.4rem -76.8rem
}

.logo-bank368001.w34 {
    background-position: -74.8rem -81.6rem
}

.logo-bank368001.w36 {
    background-position: -79.2rem -86.4rem
}

.logo-bank368001.w40 {
    background-position: -88rem -96rem
}

.logo-bank368001.w44 {
    background-position: -96.8rem -105.6rem
}

.logo-bank368001.w50 {
    background-position: -110rem -120rem
}

.logo-bank368001.w52 {
    background-position: -114.4rem -124.8rem
}

.logo-bank368001.w60 {
    background-position: -132rem -144rem
}

.logo-bank368001.w64 {
    background-position: -140.8rem -153.6rem
}

.logo-bank368001.w65 {
    background-position: -143rem -156rem
}

.logo-bank368001.w72 {
    background-position: -158.4rem -172.8rem
}

/*! 롯데카드 */

.logo-bank368002.w16 {
    background-position: -35.2rem -38.4rem
}

.logo-bank368002.w20 {
    background-position: -44rem -48rem
}

.logo-bank368002.w22 {
    background-position: -48.4rem -52.8rem
}

.logo-bank368002.w24 {
    background-position: -52.8rem -57.6rem
}

.logo-bank368002.w28 {
    background-position: -61.6rem -67.2rem
}

.logo-bank368002.w30 {
    background-position: -66rem -72rem
}

.logo-bank368002.w32 {
    background-position: -70.4rem -76.8rem
}

.logo-bank368002.w34 {
    background-position: -74.8rem -81.6rem
}

.logo-bank368002.w36 {
    background-position: -79.2rem -86.4rem
}

.logo-bank368002.w40 {
    background-position: -88rem -96rem
}

.logo-bank368002.w44 {
    background-position: -96.8rem -105.6rem
}

.logo-bank368002.w50 {
    background-position: -110rem -120rem
}

.logo-bank368002.w52 {
    background-position: -114.4rem -124.8rem
}

.logo-bank368002.w60 {
    background-position: -132rem -144rem
}

.logo-bank368002.w64 {
    background-position: -140.8rem -153.6rem
}

.logo-bank368002.w65 {
    background-position: -143rem -156rem
}

.logo-bank368002.w72 {
    background-position: -158.4rem -172.8rem
}

/*! component element icon 2금융 (총 79개) ======================================== */

/*! 애큐온 */

.logo-bank050002.w16,
.logo-kcb20502.w16,
.logo-kcis6010.w16 {
    background-position: -9.6rem -12.8rem
}

.logo-bank050002.w20,
.logo-kcb20502.w20,
.logo-kcis6010.w20 {
    background-position: -12rem -16rem
}

.logo-bank050002.w22,
.logo-kcb20502.w22,
.logo-kcis6010.w22 {
    background-position: -13.2rem -17.6rem
}

.logo-bank050002.w24,
.logo-kcb20502.w24,
.logo-kcis6010.w24 {
    background-position: -14.4rem -19.2rem
}

.logo-bank050002.w28,
.logo-kcb20502.w28,
.logo-kcis6010.w28 {
    background-position: -16.8rem -22.4rem
}

.logo-bank050002.w30,
.logo-kcb20502.w30,
.logo-kcis6010.w30 {
    background-position: -18rem -24rem
}

.logo-bank050002.w32,
.logo-kcb20502.w32,
.logo-kcis6010.w32 {
    background-position: -19.2rem -25.6rem
}

.logo-bank050002.w34,
.logo-kcb20502.w34,
.logo-kcis6010.w34 {
    background-position: -20.4rem -27.2rem
}

.logo-bank050002.w36,
.logo-kcb20502.w36,
.logo-kcis6010.w36 {
    background-position: -21.6rem -28.8rem
}

.logo-bank050002.w40,
.logo-kcb20502.w40,
.logo-kcis6010.w40 {
    background-position: -24rem -32rem
}

.logo-bank050002.w44,
.logo-kcb20502.w44,
.logo-kcis6010.w44 {
    background-position: -26.4rem -35.2rem
}

.logo-bank050002.w50,
.logo-kcb20502.w50,
.logo-kcis6010.w50 {
    background-position: -30rem -40rem
}

.logo-bank050002.w52,
.logo-kcb20502.w52,
.logo-kcis6010.w52 {
    background-position: -31.2rem -41.6rem
}

.logo-bank050002.w60,
.logo-kcb20502.w60,
.logo-kcis6010.w60 {
    background-position: -36rem -48rem
}

.logo-bank050002.w64,
.logo-kcb20502.w64,
.logo-kcis6010.w64 {
    background-position: -38.4rem -51.2rem
}

.logo-bank050002.w65,
.logo-kcb20502.w65,
.logo-kcis6010.w65 {
    background-position: -39rem -52rem
}

.logo-bank050002.w72,
.logo-kcb20502.w72,
.logo-kcis6010.w72 {
    background-position: -43.2rem -57.6rem
}

/*! 오에스비 */

.logo-bank050003.w16,
.logo-kcb20509.w16,
.logo-kcis6003.w16 {
    background-position: -12.8rem -12.8rem
}

.logo-bank050003.w20,
.logo-kcb20509.w20,
.logo-kcis6003.w20 {
    background-position: -16rem -16rem
}

.logo-bank050003.w22,
.logo-kcb20509.w22,
.logo-kcis6003.w22 {
    background-position: -17.6rem -17.6rem
}

.logo-bank050003.w24,
.logo-kcb20509.w24,
.logo-kcis6003.w24 {
    background-position: -19.2rem -19.2rem
}

.logo-bank050003.w28,
.logo-kcb20509.w28,
.logo-kcis6003.w28 {
    background-position: -22.4rem -22.4rem
}

.logo-bank050003.w30,
.logo-kcb20509.w30,
.logo-kcis6003.w30 {
    background-position: -24rem -24rem
}

.logo-bank050003.w32,
.logo-kcb20509.w32,
.logo-kcis6003.w32 {
    background-position: -25.6rem -25.6rem
}

.logo-bank050003.w34,
.logo-kcb20509.w34,
.logo-kcis6003.w34 {
    background-position: -27.2rem -27.2rem
}

.logo-bank050003.w36,
.logo-kcb20509.w36,
.logo-kcis6003.w36 {
    background-position: -28.8rem -28.8rem
}

.logo-bank050003.w40,
.logo-kcb20509.w40,
.logo-kcis6003.w40 {
    background-position: -32rem -32rem
}

.logo-bank050003.w44,
.logo-kcb20509.w44,
.logo-kcis6003.w44 {
    background-position: -35.2rem -35.2rem
}

.logo-bank050003.w50,
.logo-kcb20509.w50,
.logo-kcis6003.w50 {
    background-position: -40rem -40rem
}

.logo-bank050003.w52,
.logo-kcb20509.w52,
.logo-kcis6003.w52 {
    background-position: -41.6rem -41.6rem
}

.logo-bank050003.w60,
.logo-kcb20509.w60,
.logo-kcis6003.w60 {
    background-position: -48rem -48rem
}

.logo-bank050003.w64,
.logo-kcb20509.w64,
.logo-kcis6003.w64 {
    background-position: -51.2rem -51.2rem
}

.logo-bank050003.w65,
.logo-kcb20509.w65,
.logo-kcis6003.w65 {
    background-position: -52rem -52rem
}

.logo-bank050003.w72,
.logo-kcb20509.w72,
.logo-kcis6003.w72 {
    background-position: -57.6rem -57.6rem
}

/*! DB */

.logo-bank050007.w16,
.logo-kcis6007.w16 {
    background-position: -16rem 0
}

.logo-bank050007.w20,
.logo-kcis6007.w20 {
    background-position: -20rem 0
}

.logo-bank050007.w22,
.logo-kcis6007.w22 {
    background-position: -22rem 0
}

.logo-bank050007.w24,
.logo-kcis6007.w24 {
    background-position: -24rem 0
}

.logo-bank050007.w28,
.logo-kcis6007.w28 {
    background-position: -28rem 0
}

.logo-bank050007.w30,
.logo-kcis6007.w30 {
    background-position: -30rem 0
}

.logo-bank050007.w32,
.logo-kcis6007.w32 {
    background-position: -32rem 0
}

.logo-bank050007.w34,
.logo-kcis6007.w34 {
    background-position: -34rem 0
}

.logo-bank050007.w36,
.logo-kcis6007.w36 {
    background-position: -36rem 0
}

.logo-bank050007.w40,
.logo-kcis6007.w40 {
    background-position: -40rem 0
}

.logo-bank050007.w44,
.logo-kcis6007.w44 {
    background-position: -44rem 0
}

.logo-bank050007.w50,
.logo-kcis6007.w50 {
    background-position: -50rem 0
}

.logo-bank050007.w52,
.logo-kcis6007.w52 {
    background-position: -52rem 0
}

.logo-bank050007.w60,
.logo-kcis6007.w60 {
    background-position: -60rem 0
}

.logo-bank050007.w64,
.logo-kcis6007.w64 {
    background-position: -64rem 0
}

.logo-bank050007.w65,
.logo-kcis6007.w65 {
    background-position: -65rem 0
}

.logo-bank050007.w72,
.logo-kcis6007.w72 {
    background-position: -72rem 0
}

/*! 스카이 */

.logo-bank050008.w16,
.logo-kcb20527.w16,
.logo-kcis6008.w16 {
    background-position: -16rem -3.2rem
}

.logo-bank050008.w20,
.logo-kcb20527.w20,
.logo-kcis6008.w20 {
    background-position: -20rem -4rem
}

.logo-bank050008.w22,
.logo-kcb20527.w22,
.logo-kcis6008.w22 {
    background-position: -22rem -4.4rem
}

.logo-bank050008.w24,
.logo-kcb20527.w24,
.logo-kcis6008.w24 {
    background-position: -24rem -4.8rem
}

.logo-bank050008.w28,
.logo-kcb20527.w28,
.logo-kcis6008.w28 {
    background-position: -28rem -5.6rem
}

.logo-bank050008.w30,
.logo-kcb20527.w30,
.logo-kcis6008.w30 {
    background-position: -30rem -6rem
}

.logo-bank050008.w32,
.logo-kcb20527.w32,
.logo-kcis6008.w32 {
    background-position: -32rem -6.4rem
}

.logo-bank050008.w34,
.logo-kcb20527.w34,
.logo-kcis6008.w34 {
    background-position: -34rem -6.8rem
}

.logo-bank050008.w36,
.logo-kcb20527.w36,
.logo-kcis6008.w36 {
    background-position: -36rem -7.2rem
}

.logo-bank050008.w40,
.logo-kcb20527.w40,
.logo-kcis6008.w40 {
    background-position: -40rem -8rem
}

.logo-bank050008.w44,
.logo-kcb20527.w44,
.logo-kcis6008.w44 {
    background-position: -44rem -8.8rem
}

.logo-bank050008.w50,
.logo-kcb20527.w50,
.logo-kcis6008.w50 {
    background-position: -50rem -10rem
}

.logo-bank050008.w52,
.logo-kcb20527.w52,
.logo-kcis6008.w52 {
    background-position: -52rem -10.4rem
}

.logo-bank050008.w60,
.logo-kcb20527.w60,
.logo-kcis6008.w60 {
    background-position: -60rem -12rem
}

.logo-bank050008.w64,
.logo-kcb20527.w64,
.logo-kcis6008.w64 {
    background-position: -64rem -12.8rem
}

.logo-bank050008.w65,
.logo-kcb20527.w65,
.logo-kcis6008.w65 {
    background-position: -65rem -13rem
}

.logo-bank050008.w72,
.logo-kcb20527.w72,
.logo-kcis6008.w72 {
    background-position: -72rem -14.4rem
}

/*! 민국 */

.logo-bank050012.w16,
.logo-kcb20520.w16,
.logo-kcis6012.w16 {
    background-position: -16rem -6.4rem
}

.logo-bank050012.w20,
.logo-kcb20520.w20,
.logo-kcis6012.w20 {
    background-position: -20rem -8rem
}

.logo-bank050012.w22,
.logo-kcb20520.w22,
.logo-kcis6012.w22 {
    background-position: -22rem -8.8rem
}

.logo-bank050012.w24,
.logo-kcb20520.w24,
.logo-kcis6012.w24 {
    background-position: -24rem -9.6rem
}

.logo-bank050012.w28,
.logo-kcb20520.w28,
.logo-kcis6012.w28 {
    background-position: -28rem -11.2rem
}

.logo-bank050012.w30,
.logo-kcb20520.w30,
.logo-kcis6012.w30 {
    background-position: -30rem -12rem
}

.logo-bank050012.w32,
.logo-kcb20520.w32,
.logo-kcis6012.w32 {
    background-position: -32rem -12.8rem
}

.logo-bank050012.w34,
.logo-kcb20520.w34,
.logo-kcis6012.w34 {
    background-position: -34rem -13.6rem
}

.logo-bank050012.w36,
.logo-kcb20520.w36,
.logo-kcis6012.w36 {
    background-position: -36rem -14.4rem
}

.logo-bank050012.w40,
.logo-kcb20520.w40,
.logo-kcis6012.w40 {
    background-position: -40rem -16rem
}

.logo-bank050012.w44,
.logo-kcb20520.w44,
.logo-kcis6012.w44 {
    background-position: -44rem -17.6rem
}

.logo-bank050012.w50,
.logo-kcb20520.w50,
.logo-kcis6012.w50 {
    background-position: -50rem -20rem
}

.logo-bank050012.w52,
.logo-kcb20520.w52,
.logo-kcis6012.w52 {
    background-position: -52rem -20.8rem
}

.logo-bank050012.w60,
.logo-kcb20520.w60,
.logo-kcis6012.w60 {
    background-position: -60rem -24rem
}

.logo-bank050012.w64,
.logo-kcb20520.w64,
.logo-kcis6012.w64 {
    background-position: -64rem -25.6rem
}

.logo-bank050012.w65,
.logo-kcb20520.w65,
.logo-kcis6012.w65 {
    background-position: -65rem -26rem
}

.logo-bank050012.w72,
.logo-kcb20520.w72,
.logo-kcis6012.w72 {
    background-position: -72rem -28.8rem
}

/*! 푸른 */

.logo-bank050014.w16,
.logo-kcis6014.w16 {
    background-position: -16rem -9.6rem
}

.logo-bank050014.w20,
.logo-kcis6014.w20 {
    background-position: -20rem -12rem
}

.logo-bank050014.w22,
.logo-kcis6014.w22 {
    background-position: -22rem -13.2rem
}

.logo-bank050014.w24,
.logo-kcis6014.w24 {
    background-position: -24rem -14.4rem
}

.logo-bank050014.w28,
.logo-kcis6014.w28 {
    background-position: -28rem -16.8rem
}

.logo-bank050014.w30,
.logo-kcis6014.w30 {
    background-position: -30rem -18rem
}

.logo-bank050014.w32,
.logo-kcis6014.w32 {
    background-position: -32rem -19.2rem
}

.logo-bank050014.w34,
.logo-kcis6014.w34 {
    background-position: -34rem -20.4rem
}

.logo-bank050014.w36,
.logo-kcis6014.w36 {
    background-position: -36rem -21.6rem
}

.logo-bank050014.w40,
.logo-kcis6014.w40 {
    background-position: -40rem -24rem
}

.logo-bank050014.w44,
.logo-kcis6014.w44 {
    background-position: -44rem -26.4rem
}

.logo-bank050014.w50,
.logo-kcis6014.w50 {
    background-position: -50rem -30rem
}

.logo-bank050014.w52,
.logo-kcis6014.w52 {
    background-position: -52rem -31.2rem
}

.logo-bank050014.w60,
.logo-kcis6014.w60 {
    background-position: -60rem -36rem
}

.logo-bank050014.w64,
.logo-kcis6014.w64 {
    background-position: -64rem -38.4rem
}

.logo-bank050014.w65,
.logo-kcis6014.w65 {
    background-position: -65rem -39rem
}

.logo-bank050014.w72,
.logo-kcis6014.w72 {
    background-position: -72rem -43.2rem
}

/*! ES */

.logo-bank050016.w16,
.logo-kcb20521.w16 {
    background-position: -16rem -12.8rem
}

.logo-bank050016.w20,
.logo-kcb20521.w20 {
    background-position: -20rem -16rem
}

.logo-bank050016.w22,
.logo-kcb20521.w22 {
    background-position: -22rem -17.6rem
}

.logo-bank050016.w24,
.logo-kcb20521.w24 {
    background-position: -24rem -19.2rem
}

.logo-bank050016.w28,
.logo-kcb20521.w28 {
    background-position: -28rem -22.4rem
}

.logo-bank050016.w30,
.logo-kcb20521.w30 {
    background-position: -30rem -24rem
}

.logo-bank050016.w32,
.logo-kcb20521.w32 {
    background-position: -32rem -25.6rem
}

.logo-bank050016.w34,
.logo-kcb20521.w34 {
    background-position: -34rem -27.2rem
}

.logo-bank050016.w36,
.logo-kcb20521.w36 {
    background-position: -36rem -28.8rem
}

.logo-bank050016.w40,
.logo-kcb20521.w40 {
    background-position: -40rem -32rem
}

.logo-bank050016.w44,
.logo-kcb20521.w44 {
    background-position: -44rem -35.2rem
}

.logo-bank050016.w50,
.logo-kcb20521.w50 {
    background-position: -50rem -40rem
}

.logo-bank050016.w52,
.logo-kcb20521.w52 {
    background-position: -52rem -41.6rem
}

.logo-bank050016.w60,
.logo-kcb20521.w60 {
    background-position: -60rem -48rem
}

.logo-bank050016.w64,
.logo-kcb20521.w64 {
    background-position: -64rem -51.2rem
}

.logo-bank050016.w65,
.logo-kcb20521.w65 {
    background-position: -65rem -52rem
}

.logo-bank050016.w72,
.logo-kcb20521.w72 {
    background-position: -72rem -57.6rem
}

/*! 키움예스 */

.logo-bank050017.w16,
.logo-kcb20522.w16,
.logo-kcis6017.w16 {
    background-position: 0 -16rem
}

.logo-bank050017.w20,
.logo-kcb20522.w20,
.logo-kcis6017.w20 {
    background-position: 0 -20rem
}

.logo-bank050017.w22,
.logo-kcb20522.w22,
.logo-kcis6017.w22 {
    background-position: 0 -22rem
}

.logo-bank050017.w24,
.logo-kcb20522.w24,
.logo-kcis6017.w24 {
    background-position: 0 -24rem
}

.logo-bank050017.w28,
.logo-kcb20522.w28,
.logo-kcis6017.w28 {
    background-position: 0 -28rem
}

.logo-bank050017.w30,
.logo-kcb20522.w30,
.logo-kcis6017.w30 {
    background-position: 0 -30rem
}

.logo-bank050017.w32,
.logo-kcb20522.w32,
.logo-kcis6017.w32 {
    background-position: 0 -32rem
}

.logo-bank050017.w34,
.logo-kcb20522.w34,
.logo-kcis6017.w34 {
    background-position: 0 -34rem
}

.logo-bank050017.w36,
.logo-kcb20522.w36,
.logo-kcis6017.w36 {
    background-position: 0 -36rem
}

.logo-bank050017.w40,
.logo-kcb20522.w40,
.logo-kcis6017.w40 {
    background-position: 0 -40rem
}

.logo-bank050017.w44,
.logo-kcb20522.w44,
.logo-kcis6017.w44 {
    background-position: 0 -44rem
}

.logo-bank050017.w50,
.logo-kcb20522.w50,
.logo-kcis6017.w50 {
    background-position: 0 -50rem
}

.logo-bank050017.w52,
.logo-kcb20522.w52,
.logo-kcis6017.w52 {
    background-position: 0 -52rem
}

.logo-bank050017.w60,
.logo-kcb20522.w60,
.logo-kcis6017.w60 {
    background-position: 0 -60rem
}

.logo-bank050017.w64,
.logo-kcb20522.w64,
.logo-kcis6017.w64 {
    background-position: 0 -64rem
}

.logo-bank050017.w65,
.logo-kcb20522.w65,
.logo-kcis6017.w65 {
    background-position: 0 -65rem
}

.logo-bank050017.w72,
.logo-kcb20522.w72,
.logo-kcis6017.w72 {
    background-position: 0 -72rem
}

/*! 더케이 */

.logo-bank050021.w16,
.logo-kcis6021.w16 {
    background-position: -3.2rem -16rem
}

.logo-bank050021.w20,
.logo-kcis6021.w20 {
    background-position: -4rem -20rem
}

.logo-bank050021.w22,
.logo-kcis6021.w22 {
    background-position: -4.4rem -22rem
}

.logo-bank050021.w24,
.logo-kcis6021.w24 {
    background-position: -4.8rem -24rem
}

.logo-bank050021.w28,
.logo-kcis6021.w28 {
    background-position: -5.6rem -28rem
}

.logo-bank050021.w30,
.logo-kcis6021.w30 {
    background-position: -6rem -30rem
}

.logo-bank050021.w32,
.logo-kcis6021.w32 {
    background-position: -6.4rem -32rem
}

.logo-bank050021.w34,
.logo-kcis6021.w34 {
    background-position: -6.8rem -34rem
}

.logo-bank050021.w36,
.logo-kcis6021.w36 {
    background-position: -7.2rem -36rem
}

.logo-bank050021.w40,
.logo-kcis6021.w40 {
    background-position: -8rem -40rem
}

.logo-bank050021.w44,
.logo-kcis6021.w44 {
    background-position: -8.8rem -44rem
}

.logo-bank050021.w50,
.logo-kcis6021.w50 {
    background-position: -10rem -50rem
}

.logo-bank050021.w52,
.logo-kcis6021.w52 {
    background-position: -10.4rem -52rem
}

.logo-bank050021.w60,
.logo-kcis6021.w60 {
    background-position: -12rem -60rem
}

.logo-bank050021.w64,
.logo-kcis6021.w64 {
    background-position: -12.8rem -64rem
}

.logo-bank050021.w65,
.logo-kcis6021.w65 {
    background-position: -13rem -65rem
}

.logo-bank050021.w72,
.logo-kcis6021.w72 {
    background-position: -14.4rem -72rem
}

/*! 조은 */

.logo-bank05.w16,
.logo-kcb20529.w16,
.logo-kcis6024.w16 {
    background-position: -6.4rem -16rem
}

.logo-bank05.w20,
.logo-kcb20529.w20,
.logo-kcis6024.w20 {
    background-position: -8rem -20rem
}

.logo-bank05.w22,
.logo-kcb20529.w22,
.logo-kcis6024.w22 {
    background-position: -8.8rem -22rem
}

.logo-bank05.w24,
.logo-kcb20529.w24,
.logo-kcis6024.w24 {
    background-position: -9.6rem -24rem
}

.logo-bank05.w28,
.logo-kcb20529.w28,
.logo-kcis6024.w28 {
    background-position: -11.2rem -28rem
}

.logo-bank05.w30,
.logo-kcb20529.w30,
.logo-kcis6024.w30 {
    background-position: -12rem -30rem
}

.logo-bank05.w32,
.logo-kcb20529.w32,
.logo-kcis6024.w32 {
    background-position: -12.8rem -32rem
}

.logo-bank05.w34,
.logo-kcb20529.w34,
.logo-kcis6024.w34 {
    background-position: -13.6rem -34rem
}

.logo-bank05.w36,
.logo-kcb20529.w36,
.logo-kcis6024.w36 {
    background-position: -14.4rem -36rem
}

.logo-bank05.w40,
.logo-kcb20529.w40,
.logo-kcis6024.w40 {
    background-position: -16rem -40rem
}

.logo-bank05.w44,
.logo-kcb20529.w44,
.logo-kcis6024.w44 {
    background-position: -17.6rem -44rem
}

.logo-bank05.w50,
.logo-kcb20529.w50,
.logo-kcis6024.w50 {
    background-position: -20rem -50rem
}

.logo-bank05.w52,
.logo-kcb20529.w52,
.logo-kcis6024.w52 {
    background-position: -20.8rem -52rem
}

.logo-bank05.w60,
.logo-kcb20529.w60,
.logo-kcis6024.w60 {
    background-position: -24rem -60rem
}

.logo-bank05.w64,
.logo-kcb20529.w64,
.logo-kcis6024.w64 {
    background-position: -25.6rem -64rem
}

.logo-bank05.w65,
.logo-kcb20529.w65,
.logo-kcis6024.w65 {
    background-position: -26rem -65rem
}

.logo-bank05.w72,
.logo-kcb20529.w72,
.logo-kcis6024.w72 {
    background-position: -28.8rem -72rem
}

/*! SBI */

.logo-bank050028.w16,
.logo-kcb20501.w16,
.logo-kcis6028.w16 {
    background-position: -9.6rem -16rem
}

.logo-bank050028.w20,
.logo-kcb20501.w20,
.logo-kcis6028.w20 {
    background-position: -12rem -20rem
}

.logo-bank050028.w22,
.logo-kcb20501.w22,
.logo-kcis6028.w22 {
    background-position: -13.2rem -22rem
}

.logo-bank050028.w24,
.logo-kcb20501.w24,
.logo-kcis6028.w24 {
    background-position: -14.4rem -24rem
}

.logo-bank050028.w28,
.logo-kcb20501.w28,
.logo-kcis6028.w28 {
    background-position: -16.8rem -28rem
}

.logo-bank050028.w30,
.logo-kcb20501.w30,
.logo-kcis6028.w30 {
    background-position: -18rem -30rem
}

.logo-bank050028.w32,
.logo-kcb20501.w32,
.logo-kcis6028.w32 {
    background-position: -19.2rem -32rem
}

.logo-bank050028.w34,
.logo-kcb20501.w34,
.logo-kcis6028.w34 {
    background-position: -20.4rem -34rem
}

.logo-bank050028.w36,
.logo-kcb20501.w36,
.logo-kcis6028.w36 {
    background-position: -21.6rem -36rem
}

.logo-bank050028.w40,
.logo-kcb20501.w40,
.logo-kcis6028.w40 {
    background-position: -24rem -40rem
}

.logo-bank050028.w44,
.logo-kcb20501.w44,
.logo-kcis6028.w44 {
    background-position: -26.4rem -44rem
}

.logo-bank050028.w50,
.logo-kcb20501.w50,
.logo-kcis6028.w50 {
    background-position: -30rem -50rem
}

.logo-bank050028.w52,
.logo-kcb20501.w52,
.logo-kcis6028.w52 {
    background-position: -31.2rem -52rem
}

.logo-bank050028.w60,
.logo-kcb20501.w60,
.logo-kcis6028.w60 {
    background-position: -36rem -60rem
}

.logo-bank050028.w64,
.logo-kcb20501.w64,
.logo-kcis6028.w64 {
    background-position: -38.4rem -64rem
}

.logo-bank050028.w65,
.logo-kcb20501.w65,
.logo-kcis6028.w65 {
    background-position: -39rem -65rem
}

.logo-bank050028.w72,
.logo-kcb20501.w72,
.logo-kcis6028.w72 {
    background-position: -43.2rem -72rem
}

/*! 유안타 */

.logo-bank050036.w16,
.logo-kcis6036.w16 {
    background-position: -12.8rem -16rem
}

.logo-bank050036.w20,
.logo-kcis6036.w20 {
    background-position: -16rem -20rem
}

.logo-bank050036.w22,
.logo-kcis6036.w22 {
    background-position: -17.6rem -22rem
}

.logo-bank050036.w24,
.logo-kcis6036.w24 {
    background-position: -19.2rem -24rem
}

.logo-bank050036.w28,
.logo-kcis6036.w28 {
    background-position: -22.4rem -28rem
}

.logo-bank050036.w30,
.logo-kcis6036.w30 {
    background-position: -24rem -30rem
}

.logo-bank050036.w32,
.logo-kcis6036.w32 {
    background-position: -25.6rem -32rem
}

.logo-bank050036.w34,
.logo-kcis6036.w34 {
    background-position: -27.2rem -34rem
}

.logo-bank050036.w36,
.logo-kcis6036.w36 {
    background-position: -28.8rem -36rem
}

.logo-bank050036.w40,
.logo-kcis6036.w40 {
    background-position: -32rem -40rem
}

.logo-bank050036.w44,
.logo-kcis6036.w44 {
    background-position: -35.2rem -44rem
}

.logo-bank050036.w50,
.logo-kcis6036.w50 {
    background-position: -40rem -50rem
}

.logo-bank050036.w52,
.logo-kcis6036.w52 {
    background-position: -41.6rem -52rem
}

.logo-bank050036.w60,
.logo-kcis6036.w60 {
    background-position: -48rem -60rem
}

.logo-bank050036.w64,
.logo-kcis6036.w64 {
    background-position: -51.2rem -64rem
}

.logo-bank050036.w65,
.logo-kcis6036.w65 {
    background-position: -52rem -65rem
}

.logo-bank050036.w72,
.logo-kcis6036.w72 {
    background-position: -57.6rem -72rem
}

/*! 바로 */

.logo-bank050038.w16,
.logo-kcis6038.w16 {
    background-position: -16rem -16rem
}

.logo-bank050038.w20,
.logo-kcis6038.w20 {
    background-position: -20rem -20rem
}

.logo-bank050038.w22,
.logo-kcis6038.w22 {
    background-position: -22rem -22rem
}

.logo-bank050038.w24,
.logo-kcis6038.w24 {
    background-position: -24rem -24rem
}

.logo-bank050038.w28,
.logo-kcis6038.w28 {
    background-position: -28rem -28rem
}

.logo-bank050038.w30,
.logo-kcis6038.w30 {
    background-position: -30rem -30rem
}

.logo-bank050038.w32,
.logo-kcis6038.w32 {
    background-position: -32rem -32rem
}

.logo-bank050038.w34,
.logo-kcis6038.w34 {
    background-position: -34rem -34rem
}

.logo-bank050038.w36,
.logo-kcis6038.w36 {
    background-position: -36rem -36rem
}

.logo-bank050038.w40,
.logo-kcis6038.w40 {
    background-position: -40rem -40rem
}

.logo-bank050038.w44,
.logo-kcis6038.w44 {
    background-position: -44rem -44rem
}

.logo-bank050038.w50,
.logo-kcis6038.w50 {
    background-position: -50rem -50rem
}

.logo-bank050038.w52,
.logo-kcis6038.w52 {
    background-position: -52rem -52rem
}

.logo-bank050038.w60,
.logo-kcis6038.w60 {
    background-position: -60rem -60rem
}

.logo-bank050038.w64,
.logo-kcis6038.w64 {
    background-position: -64rem -64rem
}

.logo-bank050038.w65,
.logo-kcis6038.w65 {
    background-position: -65rem -65rem
}

.logo-bank050038.w72,
.logo-kcis6038.w72 {
    background-position: -72rem -72rem
}

/*! 예가람 */

.logo-bank050049.w16,
.logo-kcb20532.w16,
.logo-kcis6707.w16 {
    background-position: -19.2rem 0
}

.logo-bank050049.w20,
.logo-kcb20532.w20,
.logo-kcis6707.w20 {
    background-position: -24rem 0
}

.logo-bank050049.w22,
.logo-kcb20532.w22,
.logo-kcis6707.w22 {
    background-position: -26.4rem 0
}

.logo-bank050049.w24,
.logo-kcb20532.w24,
.logo-kcis6707.w24 {
    background-position: -28.8rem 0
}

.logo-bank050049.w28,
.logo-kcb20532.w28,
.logo-kcis6707.w28 {
    background-position: -33.6rem 0
}

.logo-bank050049.w30,
.logo-kcb20532.w30,
.logo-kcis6707.w30 {
    background-position: -36rem 0
}

.logo-bank050049.w32,
.logo-kcb20532.w32,
.logo-kcis6707.w32 {
    background-position: -38.4rem 0
}

.logo-bank050049.w34,
.logo-kcb20532.w34,
.logo-kcis6707.w34 {
    background-position: -40.8rem 0
}

.logo-bank050049.w36,
.logo-kcb20532.w36,
.logo-kcis6707.w36 {
    background-position: -43.2rem 0
}

.logo-bank050049.w40,
.logo-kcb20532.w40,
.logo-kcis6707.w40 {
    background-position: -48rem 0
}

.logo-bank050049.w44,
.logo-kcb20532.w44,
.logo-kcis6707.w44 {
    background-position: -52.8rem 0
}

.logo-bank050049.w50,
.logo-kcb20532.w50,
.logo-kcis6707.w50 {
    background-position: -60rem 0
}

.logo-bank050049.w52,
.logo-kcb20532.w52,
.logo-kcis6707.w52 {
    background-position: -62.4rem 0
}

.logo-bank050049.w60,
.logo-kcb20532.w60,
.logo-kcis6707.w60 {
    background-position: -72rem 0
}

.logo-bank050049.w64,
.logo-kcb20532.w64,
.logo-kcis6707.w64 {
    background-position: -76.8rem 0
}

.logo-bank050049.w65,
.logo-kcb20532.w65,
.logo-kcis6707.w65 {
    background-position: -78rem 0
}

.logo-bank050049.w72,
.logo-kcb20532.w72,
.logo-kcis6707.w72 {
    background-position: -86.4rem 0
}

/*! NH */

.logo-bank050062.w16,
.logo-kcis6049.w16 {
    background-position: -19.2rem -3.2rem
}

.logo-bank050062.w20,
.logo-kcis6049.w20 {
    background-position: -24rem -4rem
}

.logo-bank050062.w22,
.logo-kcis6049.w22 {
    background-position: -26.4rem -4.4rem
}

.logo-bank050062.w24,
.logo-kcis6049.w24 {
    background-position: -28.8rem -4.8rem
}

.logo-bank050062.w28,
.logo-kcis6049.w28 {
    background-position: -33.6rem -5.6rem
}

.logo-bank050062.w30,
.logo-kcis6049.w30 {
    background-position: -36rem -6rem
}

.logo-bank050062.w32,
.logo-kcis6049.w32 {
    background-position: -38.4rem -6.4rem
}

.logo-bank050062.w34,
.logo-kcis6049.w34 {
    background-position: -40.8rem -6.8rem
}

.logo-bank050062.w36,
.logo-kcis6049.w36 {
    background-position: -43.2rem -7.2rem
}

.logo-bank050062.w40,
.logo-kcis6049.w40 {
    background-position: -48rem -8rem
}

.logo-bank050062.w44,
.logo-kcis6049.w44 {
    background-position: -52.8rem -8.8rem
}

.logo-bank050062.w50,
.logo-kcis6049.w50 {
    background-position: -60rem -10rem
}

.logo-bank050062.w52,
.logo-kcis6049.w52 {
    background-position: -62.4rem -10.4rem
}

.logo-bank050062.w60,
.logo-kcis6049.w60 {
    background-position: -72rem -12rem
}

.logo-bank050062.w64,
.logo-kcis6049.w64 {
    background-position: -76.8rem -12.8rem
}

.logo-bank050062.w65,
.logo-kcis6049.w65 {
    background-position: -78rem -13rem
}

.logo-bank050062.w72,
.logo-kcis6049.w72 {
    background-position: -86.4rem -14.4rem
}

/*! 대신 */

.logo-bank050063.w16,
.logo-kcis6800.w16 {
    background-position: -19.2rem -6.4rem
}

.logo-bank050063.w20,
.logo-kcis6800.w20 {
    background-position: -24rem -8rem
}

.logo-bank050063.w22,
.logo-kcis6800.w22 {
    background-position: -26.4rem -8.8rem
}

.logo-bank050063.w24,
.logo-kcis6800.w24 {
    background-position: -28.8rem -9.6rem
}

.logo-bank050063.w28,
.logo-kcis6800.w28 {
    background-position: -33.6rem -11.2rem
}

.logo-bank050063.w30,
.logo-kcis6800.w30 {
    background-position: -36rem -12rem
}

.logo-bank050063.w32,
.logo-kcis6800.w32 {
    background-position: -38.4rem -12.8rem
}

.logo-bank050063.w34,
.logo-kcis6800.w34 {
    background-position: -40.8rem -13.6rem
}

.logo-bank050063.w36,
.logo-kcis6800.w36 {
    background-position: -43.2rem -14.4rem
}

.logo-bank050063.w40,
.logo-kcis6800.w40 {
    background-position: -48rem -16rem
}

.logo-bank050063.w44,
.logo-kcis6800.w44 {
    background-position: -52.8rem -17.6rem
}

.logo-bank050063.w50,
.logo-kcis6800.w50 {
    background-position: -60rem -20rem
}

.logo-bank050063.w52,
.logo-kcis6800.w52 {
    background-position: -62.4rem -20.8rem
}

.logo-bank050063.w60,
.logo-kcis6800.w60 {
    background-position: -72rem -24rem
}

.logo-bank050063.w64,
.logo-kcis6800.w64 {
    background-position: -76.8rem -25.6rem
}

.logo-bank050063.w65,
.logo-kcis6800.w65 {
    background-position: -78rem -26rem
}

.logo-bank050063.w72,
.logo-kcis6800.w72 {
    background-position: -86.4rem -28.8rem
}

/*! OK */

.logo-bank050064.w16,
.logo-kcb20551.w16,
.logo-kcis6360.w16 {
    background-position: -19.2rem -9.6rem
}

.logo-bank050064.w20,
.logo-kcb20551.w20,
.logo-kcis6360.w20 {
    background-position: -24rem -12rem
}

.logo-bank050064.w22,
.logo-kcb20551.w22,
.logo-kcis6360.w22 {
    background-position: -26.4rem -13.2rem
}

.logo-bank050064.w24,
.logo-kcb20551.w24,
.logo-kcis6360.w24 {
    background-position: -28.8rem -14.4rem
}

.logo-bank050064.w28,
.logo-kcb20551.w28,
.logo-kcis6360.w28 {
    background-position: -33.6rem -16.8rem
}

.logo-bank050064.w30,
.logo-kcb20551.w30,
.logo-kcis6360.w30 {
    background-position: -36rem -18rem
}

.logo-bank050064.w32,
.logo-kcb20551.w32,
.logo-kcis6360.w32 {
    background-position: -38.4rem -19.2rem
}

.logo-bank050064.w34,
.logo-kcb20551.w34,
.logo-kcis6360.w34 {
    background-position: -40.8rem -20.4rem
}

.logo-bank050064.w36,
.logo-kcb20551.w36,
.logo-kcis6360.w36 {
    background-position: -43.2rem -21.6rem
}

.logo-bank050064.w40,
.logo-kcb20551.w40,
.logo-kcis6360.w40 {
    background-position: -48rem -24rem
}

.logo-bank050064.w44,
.logo-kcb20551.w44,
.logo-kcis6360.w44 {
    background-position: -52.8rem -26.4rem
}

.logo-bank050064.w50,
.logo-kcb20551.w50,
.logo-kcis6360.w50 {
    background-position: -60rem -30rem
}

.logo-bank050064.w52,
.logo-kcb20551.w52,
.logo-kcis6360.w52 {
    background-position: -62.4rem -31.2rem
}

.logo-bank050064.w60,
.logo-kcb20551.w60,
.logo-kcis6360.w60 {
    background-position: -72rem -36rem
}

.logo-bank050064.w64,
.logo-kcb20551.w64,
.logo-kcis6360.w64 {
    background-position: -76.8rem -38.4rem
}

.logo-bank050064.w65,
.logo-kcb20551.w65,
.logo-kcis6360.w65 {
    background-position: -78rem -39rem
}

.logo-bank050064.w72,
.logo-kcb20551.w72,
.logo-kcis6360.w72 {
    background-position: -86.4rem -43.2rem
}

/*! KB */

.logo-bank050065.w16,
.logo-kcb20505.w16,
.logo-kcis6060.w16 {
    background-position: -19.2rem -12.8rem
}

.logo-bank050065.w20,
.logo-kcb20505.w20,
.logo-kcis6060.w20 {
    background-position: -24rem -16rem
}

.logo-bank050065.w22,
.logo-kcb20505.w22,
.logo-kcis6060.w22 {
    background-position: -26.4rem -17.6rem
}

.logo-bank050065.w24,
.logo-kcb20505.w24,
.logo-kcis6060.w24 {
    background-position: -28.8rem -19.2rem
}

.logo-bank050065.w28,
.logo-kcb20505.w28,
.logo-kcis6060.w28 {
    background-position: -33.6rem -22.4rem
}

.logo-bank050065.w30,
.logo-kcb20505.w30,
.logo-kcis6060.w30 {
    background-position: -36rem -24rem
}

.logo-bank050065.w32,
.logo-kcb20505.w32,
.logo-kcis6060.w32 {
    background-position: -38.4rem -25.6rem
}

.logo-bank050065.w34,
.logo-kcb20505.w34,
.logo-kcis6060.w34 {
    background-position: -40.8rem -27.2rem
}

.logo-bank050065.w36,
.logo-kcb20505.w36,
.logo-kcis6060.w36 {
    background-position: -43.2rem -28.8rem
}

.logo-bank050065.w40,
.logo-kcb20505.w40,
.logo-kcis6060.w40 {
    background-position: -48rem -32rem
}

.logo-bank050065.w44,
.logo-kcb20505.w44,
.logo-kcis6060.w44 {
    background-position: -52.8rem -35.2rem
}

.logo-bank050065.w50,
.logo-kcb20505.w50,
.logo-kcis6060.w50 {
    background-position: -60rem -40rem
}

.logo-bank050065.w52,
.logo-kcb20505.w52,
.logo-kcis6060.w52 {
    background-position: -62.4rem -41.6rem
}

.logo-bank050065.w60,
.logo-kcb20505.w60,
.logo-kcis6060.w60 {
    background-position: -72rem -48rem
}

.logo-bank050065.w64,
.logo-kcb20505.w64,
.logo-kcis6060.w64 {
    background-position: -76.8rem -51.2rem
}

.logo-bank050065.w65,
.logo-kcb20505.w65,
.logo-kcis6060.w65 {
    background-position: -78rem -52rem
}

.logo-bank050065.w72,
.logo-kcb20505.w72,
.logo-kcis6060.w72 {
    background-position: -86.4rem -57.6rem
}

/*! 웰컴 */

.logo-bank050066.w16,
.logo-kcb20508.w16,
.logo-kcis6340.w16 {
    background-position: -19.2rem -16rem
}

.logo-bank050066.w20,
.logo-kcb20508.w20,
.logo-kcis6340.w20 {
    background-position: -24rem -20rem
}

.logo-bank050066.w22,
.logo-kcb20508.w22,
.logo-kcis6340.w22 {
    background-position: -26.4rem -22rem
}

.logo-bank050066.w24,
.logo-kcb20508.w24,
.logo-kcis6340.w24 {
    background-position: -28.8rem -24rem
}

.logo-bank050066.w28,
.logo-kcb20508.w28,
.logo-kcis6340.w28 {
    background-position: -33.6rem -28rem
}

.logo-bank050066.w30,
.logo-kcb20508.w30,
.logo-kcis6340.w30 {
    background-position: -36rem -30rem
}

.logo-bank050066.w32,
.logo-kcb20508.w32,
.logo-kcis6340.w32 {
    background-position: -38.4rem -32rem
}

.logo-bank050066.w34,
.logo-kcb20508.w34,
.logo-kcis6340.w34 {
    background-position: -40.8rem -34rem
}

.logo-bank050066.w36,
.logo-kcb20508.w36,
.logo-kcis6340.w36 {
    background-position: -43.2rem -36rem
}

.logo-bank050066.w40,
.logo-kcb20508.w40,
.logo-kcis6340.w40 {
    background-position: -48rem -40rem
}

.logo-bank050066.w44,
.logo-kcb20508.w44,
.logo-kcis6340.w44 {
    background-position: -52.8rem -44rem
}

.logo-bank050066.w50,
.logo-kcb20508.w50,
.logo-kcis6340.w50 {
    background-position: -60rem -50rem
}

.logo-bank050066.w52,
.logo-kcb20508.w52,
.logo-kcis6340.w52 {
    background-position: -62.4rem -52rem
}

.logo-bank050066.w60,
.logo-kcb20508.w60,
.logo-kcis6340.w60 {
    background-position: -72rem -60rem
}

.logo-bank050066.w64,
.logo-kcb20508.w64,
.logo-kcis6340.w64 {
    background-position: -76.8rem -64rem
}

.logo-bank050066.w65,
.logo-kcb20508.w65,
.logo-kcis6340.w65 {
    background-position: -78rem -65rem
}

.logo-bank050066.w72,
.logo-kcb20508.w72,
.logo-kcis6340.w72 {
    background-position: -86.4rem -72rem
}

/*! 하나 */

.logo-bank050067.w16,
.logo-kcis6090.w16 {
    background-position: 0 -19.2rem
}

.logo-bank050067.w20,
.logo-kcis6090.w20 {
    background-position: 0 -24rem
}

.logo-bank050067.w22,
.logo-kcis6090.w22 {
    background-position: 0 -26.4rem
}

.logo-bank050067.w24,
.logo-kcis6090.w24 {
    background-position: 0 -28.8rem
}

.logo-bank050067.w28,
.logo-kcis6090.w28 {
    background-position: 0 -33.6rem
}

.logo-bank050067.w30,
.logo-kcis6090.w30 {
    background-position: 0 -36rem
}

.logo-bank050067.w32,
.logo-kcis6090.w32 {
    background-position: 0 -38.4rem
}

.logo-bank050067.w34,
.logo-kcis6090.w34 {
    background-position: 0 -40.8rem
}

.logo-bank050067.w36,
.logo-kcis6090.w36 {
    background-position: 0 -43.2rem
}

.logo-bank050067.w40,
.logo-kcis6090.w40 {
    background-position: 0 -48rem
}

.logo-bank050067.w44,
.logo-kcis6090.w44 {
    background-position: 0 -52.8rem
}

.logo-bank050067.w50,
.logo-kcis6090.w50 {
    background-position: 0 -60rem
}

.logo-bank050067.w52,
.logo-kcis6090.w52 {
    background-position: 0 -62.4rem
}

.logo-bank050067.w60,
.logo-kcis6090.w60 {
    background-position: 0 -72rem
}

.logo-bank050067.w64,
.logo-kcis6090.w64 {
    background-position: 0 -76.8rem
}

.logo-bank050067.w65,
.logo-kcis6090.w65 {
    background-position: 0 -78rem
}

.logo-bank050067.w72,
.logo-kcis6090.w72 {
    background-position: 0 -86.4rem
}

/*! 제이티친애 */

.logo-bank050068.w16,
.logo-kcb20550.w16,
.logo-kcis6140.w16 {
    background-position: -3.2rem -19.2rem
}

.logo-bank050068.w20,
.logo-kcb20550.w20,
.logo-kcis6140.w20 {
    background-position: -4rem -24rem
}

.logo-bank050068.w22,
.logo-kcb20550.w22,
.logo-kcis6140.w22 {
    background-position: -4.4rem -26.4rem
}

.logo-bank050068.w24,
.logo-kcb20550.w24,
.logo-kcis6140.w24 {
    background-position: -4.8rem -28.8rem
}

.logo-bank050068.w28,
.logo-kcb20550.w28,
.logo-kcis6140.w28 {
    background-position: -5.6rem -33.6rem
}

.logo-bank050068.w30,
.logo-kcb20550.w30,
.logo-kcis6140.w30 {
    background-position: -6rem -36rem
}

.logo-bank050068.w32,
.logo-kcb20550.w32,
.logo-kcis6140.w32 {
    background-position: -6.4rem -38.4rem
}

.logo-bank050068.w34,
.logo-kcb20550.w34,
.logo-kcis6140.w34 {
    background-position: -6.8rem -40.8rem
}

.logo-bank050068.w36,
.logo-kcb20550.w36,
.logo-kcis6140.w36 {
    background-position: -7.2rem -43.2rem
}

.logo-bank050068.w40,
.logo-kcb20550.w40,
.logo-kcis6140.w40 {
    background-position: -8rem -48rem
}

.logo-bank050068.w44,
.logo-kcb20550.w44,
.logo-kcis6140.w44 {
    background-position: -8.8rem -52.8rem
}

.logo-bank050068.w50,
.logo-kcb20550.w50,
.logo-kcis6140.w50 {
    background-position: -10rem -60rem
}

.logo-bank050068.w52,
.logo-kcb20550.w52,
.logo-kcis6140.w52 {
    background-position: -10.4rem -62.4rem
}

.logo-bank050068.w60,
.logo-kcb20550.w60,
.logo-kcis6140.w60 {
    background-position: -12rem -72rem
}

.logo-bank050068.w64,
.logo-kcb20550.w64,
.logo-kcis6140.w64 {
    background-position: -12.8rem -76.8rem
}

.logo-bank050068.w65,
.logo-kcb20550.w65,
.logo-kcis6140.w65 {
    background-position: -13rem -78rem
}

.logo-bank050068.w72,
.logo-kcb20550.w72,
.logo-kcis6140.w72 {
    background-position: -14.4rem -86.4rem
}

/*! 고려 */

.logo-bank050101.w16,
.logo-kcis6101.w16 {
    background-position: -6.4rem -19.2rem
}

.logo-bank050101.w20,
.logo-kcis6101.w20 {
    background-position: -8rem -24rem
}

.logo-bank050101.w22,
.logo-kcis6101.w22 {
    background-position: -8.8rem -26.4rem
}

.logo-bank050101.w24,
.logo-kcis6101.w24 {
    background-position: -9.6rem -28.8rem
}

.logo-bank050101.w28,
.logo-kcis6101.w28 {
    background-position: -11.2rem -33.6rem
}

.logo-bank050101.w30,
.logo-kcis6101.w30 {
    background-position: -12rem -36rem
}

.logo-bank050101.w32,
.logo-kcis6101.w32 {
    background-position: -12.8rem -38.4rem
}

.logo-bank050101.w34,
.logo-kcis6101.w34 {
    background-position: -13.6rem -40.8rem
}

.logo-bank050101.w36,
.logo-kcis6101.w36 {
    background-position: -14.4rem -43.2rem
}

.logo-bank050101.w40,
.logo-kcis6101.w40 {
    background-position: -16rem -48rem
}

.logo-bank050101.w44,
.logo-kcis6101.w44 {
    background-position: -17.6rem -52.8rem
}

.logo-bank050101.w50,
.logo-kcis6101.w50 {
    background-position: -20rem -60rem
}

.logo-bank050101.w52,
.logo-kcis6101.w52 {
    background-position: -20.8rem -62.4rem
}

.logo-bank050101.w60,
.logo-kcis6101.w60 {
    background-position: -24rem -72rem
}

.logo-bank050101.w64,
.logo-kcis6101.w64 {
    background-position: -25.6rem -76.8rem
}

.logo-bank050101.w65,
.logo-kcis6101.w65 {
    background-position: -26rem -78rem
}

.logo-bank050101.w72,
.logo-kcis6101.w72 {
    background-position: -28.8rem -86.4rem
}

/*! 국제 */

.logo-bank050102.w16,
.logo-kcis6102.w16 {
    background-position: -9.6rem -19.2rem
}

.logo-bank050102.w20,
.logo-kcis6102.w20 {
    background-position: -12rem -24rem
}

.logo-bank050102.w22,
.logo-kcis6102.w22 {
    background-position: -13.2rem -26.4rem
}

.logo-bank050102.w24,
.logo-kcis6102.w24 {
    background-position: -14.4rem -28.8rem
}

.logo-bank050102.w28,
.logo-kcis6102.w28 {
    background-position: -16.8rem -33.6rem
}

.logo-bank050102.w30,
.logo-kcis6102.w30 {
    background-position: -18rem -36rem
}

.logo-bank050102.w32,
.logo-kcis6102.w32 {
    background-position: -19.2rem -38.4rem
}

.logo-bank050102.w34,
.logo-kcis6102.w34 {
    background-position: -20.4rem -40.8rem
}

.logo-bank050102.w36,
.logo-kcis6102.w36 {
    background-position: -21.6rem -43.2rem
}

.logo-bank050102.w40,
.logo-kcis6102.w40 {
    background-position: -24rem -48rem
}

.logo-bank050102.w44,
.logo-kcis6102.w44 {
    background-position: -26.4rem -52.8rem
}

.logo-bank050102.w50,
.logo-kcis6102.w50 {
    background-position: -30rem -60rem
}

.logo-bank050102.w52,
.logo-kcis6102.w52 {
    background-position: -31.2rem -62.4rem
}

.logo-bank050102.w60,
.logo-kcis6102.w60 {
    background-position: -36rem -72rem
}

.logo-bank050102.w64,
.logo-kcis6102.w64 {
    background-position: -38.4rem -76.8rem
}

.logo-bank050102.w65,
.logo-kcis6102.w65 {
    background-position: -39rem -78rem
}

.logo-bank050102.w72,
.logo-kcis6102.w72 {
    background-position: -43.2rem -86.4rem
}

/*! DH */

.logo-bank050115.w16,
.logo-kcis6115.w16 {
    background-position: -12.8rem -19.2rem
}

.logo-bank050115.w20,
.logo-kcis6115.w20 {
    background-position: -16rem -24rem
}

.logo-bank050115.w22,
.logo-kcis6115.w22 {
    background-position: -17.6rem -26.4rem
}

.logo-bank050115.w24,
.logo-kcis6115.w24 {
    background-position: -19.2rem -28.8rem
}

.logo-bank050115.w28,
.logo-kcis6115.w28 {
    background-position: -22.4rem -33.6rem
}

.logo-bank050115.w30,
.logo-kcis6115.w30 {
    background-position: -24rem -36rem
}

.logo-bank050115.w32,
.logo-kcis6115.w32 {
    background-position: -25.6rem -38.4rem
}

.logo-bank050115.w34,
.logo-kcis6115.w34 {
    background-position: -27.2rem -40.8rem
}

.logo-bank050115.w36,
.logo-kcis6115.w36 {
    background-position: -28.8rem -43.2rem
}

.logo-bank050115.w40,
.logo-kcis6115.w40 {
    background-position: -32rem -48rem
}

.logo-bank050115.w44,
.logo-kcis6115.w44 {
    background-position: -35.2rem -52.8rem
}

.logo-bank050115.w50,
.logo-kcis6115.w50 {
    background-position: -40rem -60rem
}

.logo-bank050115.w52,
.logo-kcis6115.w52 {
    background-position: -41.6rem -62.4rem
}

.logo-bank050115.w60,
.logo-kcis6115.w60 {
    background-position: -48rem -72rem
}

.logo-bank050115.w64,
.logo-kcis6115.w64 {
    background-position: -51.2rem -76.8rem
}

.logo-bank050115.w65,
.logo-kcis6115.w65 {
    background-position: -52rem -78rem
}

.logo-bank050115.w72,
.logo-kcis6115.w72 {
    background-position: -57.6rem -86.4rem
}

/*! 우리 */

.logo-bank050120.w16,
.logo-kcis6120.w16 {
    background-position: -16rem -19.2rem
}

.logo-bank050120.w20,
.logo-kcis6120.w20 {
    background-position: -20rem -24rem
}

.logo-bank050120.w22,
.logo-kcis6120.w22 {
    background-position: -22rem -26.4rem
}

.logo-bank050120.w24,
.logo-kcis6120.w24 {
    background-position: -24rem -28.8rem
}

.logo-bank050120.w28,
.logo-kcis6120.w28 {
    background-position: -28rem -33.6rem
}

.logo-bank050120.w30,
.logo-kcis6120.w30 {
    background-position: -30rem -36rem
}

.logo-bank050120.w32,
.logo-kcis6120.w32 {
    background-position: -32rem -38.4rem
}

.logo-bank050120.w34,
.logo-kcis6120.w34 {
    background-position: -34rem -40.8rem
}

.logo-bank050120.w36,
.logo-kcis6120.w36 {
    background-position: -36rem -43.2rem
}

.logo-bank050120.w40,
.logo-kcis6120.w40 {
    background-position: -40rem -48rem
}

.logo-bank050120.w44,
.logo-kcis6120.w44 {
    background-position: -44rem -52.8rem
}

.logo-bank050120.w50,
.logo-kcis6120.w50 {
    background-position: -50rem -60rem
}

.logo-bank050120.w52,
.logo-kcis6120.w52 {
    background-position: -52rem -62.4rem
}

.logo-bank050120.w60,
.logo-kcis6120.w60 {
    background-position: -60rem -72rem
}

.logo-bank050120.w64,
.logo-kcis6120.w64 {
    background-position: -64rem -76.8rem
}

.logo-bank050120.w65,
.logo-kcis6120.w65 {
    background-position: -65rem -78rem
}

.logo-bank050120.w72,
.logo-kcis6120.w72 {
    background-position: -72rem -86.4rem
}

/*! 흥국 */

.logo-bank050127.w16,
.logo-kcis6127.w16 {
    background-position: -19.2rem -19.2rem
}

.logo-bank050127.w20,
.logo-kcis6127.w20 {
    background-position: -24rem -24rem
}

.logo-bank050127.w22,
.logo-kcis6127.w22 {
    background-position: -26.4rem -26.4rem
}

.logo-bank050127.w24,
.logo-kcis6127.w24 {
    background-position: -28.8rem -28.8rem
}

.logo-bank050127.w28,
.logo-kcis6127.w28 {
    background-position: -33.6rem -33.6rem
}

.logo-bank050127.w30,
.logo-kcis6127.w30 {
    background-position: -36rem -36rem
}

.logo-bank050127.w32,
.logo-kcis6127.w32 {
    background-position: -38.4rem -38.4rem
}

.logo-bank050127.w34,
.logo-kcis6127.w34 {
    background-position: -40.8rem -40.8rem
}

.logo-bank050127.w36,
.logo-kcis6127.w36 {
    background-position: -43.2rem -43.2rem
}

.logo-bank050127.w40,
.logo-kcis6127.w40 {
    background-position: -48rem -48rem
}

.logo-bank050127.w44,
.logo-kcis6127.w44 {
    background-position: -52.8rem -52.8rem
}

.logo-bank050127.w50,
.logo-kcis6127.w50 {
    background-position: -60rem -60rem
}

.logo-bank050127.w52,
.logo-kcis6127.w52 {
    background-position: -62.4rem -62.4rem
}

.logo-bank050127.w60,
.logo-kcis6127.w60 {
    background-position: -72rem -72rem
}

.logo-bank050127.w64,
.logo-kcis6127.w64 {
    background-position: -76.8rem -76.8rem
}

.logo-bank050127.w65,
.logo-kcis6127.w65 {
    background-position: -78rem -78rem
}

.logo-bank050127.w72,
.logo-kcis6127.w72 {
    background-position: -86.4rem -86.4rem
}

/*! BNK */

.logo-bank050130.w16,
.logo-kcis6070.w16 {
    background-position: -22.4rem 0
}

.logo-bank050130.w20,
.logo-kcis6070.w20 {
    background-position: -28rem 0
}

.logo-bank050130.w22,
.logo-kcis6070.w22 {
    background-position: -30.8rem 0
}

.logo-bank050130.w24,
.logo-kcis6070.w24 {
    background-position: -33.6rem 0
}

.logo-bank050130.w28,
.logo-kcis6070.w28 {
    background-position: -39.2rem 0
}

.logo-bank050130.w30,
.logo-kcis6070.w30 {
    background-position: -42rem 0
}

.logo-bank050130.w32,
.logo-kcis6070.w32 {
    background-position: -44.8rem 0
}

.logo-bank050130.w34,
.logo-kcis6070.w34 {
    background-position: -47.6rem 0
}

.logo-bank050130.w36,
.logo-kcis6070.w36 {
    background-position: -50.4rem 0
}

.logo-bank050130.w40,
.logo-kcis6070.w40 {
    background-position: -56rem 0
}

.logo-bank050130.w44,
.logo-kcis6070.w44 {
    background-position: -61.6rem 0
}

.logo-bank050130.w50,
.logo-kcis6070.w50 {
    background-position: -70rem 0
}

.logo-bank050130.w52,
.logo-kcis6070.w52 {
    background-position: -72.8rem 0
}

.logo-bank050130.w60,
.logo-kcis6070.w60 {
    background-position: -84rem 0
}

.logo-bank050130.w64,
.logo-kcis6070.w64 {
    background-position: -89.6rem 0
}

.logo-bank050130.w65,
.logo-kcis6070.w65 {
    background-position: -91rem 0
}

.logo-bank050130.w72,
.logo-kcis6070.w72 {
    background-position: -100.8rem 0
}

/*! 인성 */

.logo-bank050151.w16,
.logo-kcis6151.w16 {
    background-position: -22.4rem -3.2rem
}

.logo-bank050151.w20,
.logo-kcis6151.w20 {
    background-position: -28rem -4rem
}

.logo-bank050151.w22,
.logo-kcis6151.w22 {
    background-position: -30.8rem -4.4rem
}

.logo-bank050151.w24,
.logo-kcis6151.w24 {
    background-position: -33.6rem -4.8rem
}

.logo-bank050151.w28,
.logo-kcis6151.w28 {
    background-position: -39.2rem -5.6rem
}

.logo-bank050151.w30,
.logo-kcis6151.w30 {
    background-position: -42rem -6rem
}

.logo-bank050151.w32,
.logo-kcis6151.w32 {
    background-position: -44.8rem -6.4rem
}

.logo-bank050151.w34,
.logo-kcis6151.w34 {
    background-position: -47.6rem -6.8rem
}

.logo-bank050151.w36,
.logo-kcis6151.w36 {
    background-position: -50.4rem -7.2rem
}

.logo-bank050151.w40,
.logo-kcis6151.w40 {
    background-position: -56rem -8rem
}

.logo-bank050151.w44,
.logo-kcis6151.w44 {
    background-position: -61.6rem -8.8rem
}

.logo-bank050151.w50,
.logo-kcis6151.w50 {
    background-position: -70rem -10rem
}

.logo-bank050151.w52,
.logo-kcis6151.w52 {
    background-position: -72.8rem -10.4rem
}

.logo-bank050151.w60,
.logo-kcis6151.w60 {
    background-position: -84rem -12rem
}

.logo-bank050151.w64,
.logo-kcis6151.w64 {
    background-position: -89.6rem -12.8rem
}

.logo-bank050151.w65,
.logo-kcis6151.w65 {
    background-position: -91rem -13rem
}

.logo-bank050151.w72,
.logo-kcis6151.w72 {
    background-position: -100.8rem -14.4rem
}

/*! 금화 */

.logo-bank050153.w16,
.logo-kcis6153.w16 {
    background-position: -22.4rem -6.4rem
}

.logo-bank050153.w20,
.logo-kcis6153.w20 {
    background-position: -28rem -8rem
}

.logo-bank050153.w22,
.logo-kcis6153.w22 {
    background-position: -30.8rem -8.8rem
}

.logo-bank050153.w24,
.logo-kcis6153.w24 {
    background-position: -33.6rem -9.6rem
}

.logo-bank050153.w28,
.logo-kcis6153.w28 {
    background-position: -39.2rem -11.2rem
}

.logo-bank050153.w30,
.logo-kcis6153.w30 {
    background-position: -42rem -12rem
}

.logo-bank050153.w32,
.logo-kcis6153.w32 {
    background-position: -44.8rem -12.8rem
}

.logo-bank050153.w34,
.logo-kcis6153.w34 {
    background-position: -47.6rem -13.6rem
}

.logo-bank050153.w36,
.logo-kcis6153.w36 {
    background-position: -50.4rem -14.4rem
}

.logo-bank050153.w40,
.logo-kcis6153.w40 {
    background-position: -56rem -16rem
}

.logo-bank050153.w44,
.logo-kcis6153.w44 {
    background-position: -61.6rem -17.6rem
}

.logo-bank050153.w50,
.logo-kcis6153.w50 {
    background-position: -70rem -20rem
}

.logo-bank050153.w52,
.logo-kcis6153.w52 {
    background-position: -72.8rem -20.8rem
}

.logo-bank050153.w60,
.logo-kcis6153.w60 {
    background-position: -84rem -24rem
}

.logo-bank050153.w64,
.logo-kcis6153.w64 {
    background-position: -89.6rem -25.6rem
}

.logo-bank050153.w65,
.logo-kcis6153.w65 {
    background-position: -91rem -26rem
}

.logo-bank050153.w72,
.logo-kcis6153.w72 {
    background-position: -100.8rem -28.8rem
}

/*! 인천 */

.logo-bank050158.w16,
.logo-kcis6158.w16 {
    background-position: -22.4rem -9.6rem
}

.logo-bank050158.w20,
.logo-kcis6158.w20 {
    background-position: -28rem -12rem
}

.logo-bank050158.w22,
.logo-kcis6158.w22 {
    background-position: -30.8rem -13.2rem
}

.logo-bank050158.w24,
.logo-kcis6158.w24 {
    background-position: -33.6rem -14.4rem
}

.logo-bank050158.w28,
.logo-kcis6158.w28 {
    background-position: -39.2rem -16.8rem
}

.logo-bank050158.w30,
.logo-kcis6158.w30 {
    background-position: -42rem -18rem
}

.logo-bank050158.w32,
.logo-kcis6158.w32 {
    background-position: -44.8rem -19.2rem
}

.logo-bank050158.w34,
.logo-kcis6158.w34 {
    background-position: -47.6rem -20.4rem
}

.logo-bank050158.w36,
.logo-kcis6158.w36 {
    background-position: -50.4rem -21.6rem
}

.logo-bank050158.w40,
.logo-kcis6158.w40 {
    background-position: -56rem -24rem
}

.logo-bank050158.w44,
.logo-kcis6158.w44 {
    background-position: -61.6rem -26.4rem
}

.logo-bank050158.w50,
.logo-kcis6158.w50 {
    background-position: -70rem -30rem
}

.logo-bank050158.w52,
.logo-kcis6158.w52 {
    background-position: -72.8rem -31.2rem
}

.logo-bank050158.w60,
.logo-kcis6158.w60 {
    background-position: -84rem -36rem
}

.logo-bank050158.w64,
.logo-kcis6158.w64 {
    background-position: -89.6rem -38.4rem
}

.logo-bank050158.w65,
.logo-kcis6158.w65 {
    background-position: -91rem -39rem
}

.logo-bank050158.w72,
.logo-kcis6158.w72 {
    background-position: -100.8rem -43.2rem
}

/*! 모아 */

.logo-bank050162.w16,
.logo-kcb20543.w16,
.logo-kcis6162.w16 {
    background-position: -22.4rem -12.8rem
}

.logo-bank050162.w20,
.logo-kcb20543.w20,
.logo-kcis6162.w20 {
    background-position: -28rem -16rem
}

.logo-bank050162.w22,
.logo-kcb20543.w22,
.logo-kcis6162.w22 {
    background-position: -30.8rem -17.6rem
}

.logo-bank050162.w24,
.logo-kcb20543.w24,
.logo-kcis6162.w24 {
    background-position: -33.6rem -19.2rem
}

.logo-bank050162.w28,
.logo-kcb20543.w28,
.logo-kcis6162.w28 {
    background-position: -39.2rem -22.4rem
}

.logo-bank050162.w30,
.logo-kcb20543.w30,
.logo-kcis6162.w30 {
    background-position: -42rem -24rem
}

.logo-bank050162.w32,
.logo-kcb20543.w32,
.logo-kcis6162.w32 {
    background-position: -44.8rem -25.6rem
}

.logo-bank050162.w34,
.logo-kcb20543.w34,
.logo-kcis6162.w34 {
    background-position: -47.6rem -27.2rem
}

.logo-bank050162.w36,
.logo-kcb20543.w36,
.logo-kcis6162.w36 {
    background-position: -50.4rem -28.8rem
}

.logo-bank050162.w40,
.logo-kcb20543.w40,
.logo-kcis6162.w40 {
    background-position: -56rem -32rem
}

.logo-bank050162.w44,
.logo-kcb20543.w44,
.logo-kcis6162.w44 {
    background-position: -61.6rem -35.2rem
}

.logo-bank050162.w50,
.logo-kcb20543.w50,
.logo-kcis6162.w50 {
    background-position: -70rem -40rem
}

.logo-bank050162.w52,
.logo-kcb20543.w52,
.logo-kcis6162.w52 {
    background-position: -72.8rem -41.6rem
}

.logo-bank050162.w60,
.logo-kcb20543.w60,
.logo-kcis6162.w60 {
    background-position: -84rem -48rem
}

.logo-bank050162.w64,
.logo-kcb20543.w64,
.logo-kcis6162.w64 {
    background-position: -89.6rem -51.2rem
}

.logo-bank050162.w65,
.logo-kcb20543.w65,
.logo-kcis6162.w65 {
    background-position: -91rem -52rem
}

.logo-bank050162.w72,
.logo-kcb20543.w72,
.logo-kcis6162.w72 {
    background-position: -100.8rem -57.6rem
}

/*! 대백 */

.logo-bank050207.w16,
.logo-kcis6207.w16 {
    background-position: -22.4rem -16rem
}

.logo-bank050207.w20,
.logo-kcis6207.w20 {
    background-position: -28rem -20rem
}

.logo-bank050207.w22,
.logo-kcis6207.w22 {
    background-position: -30.8rem -22rem
}

.logo-bank050207.w24,
.logo-kcis6207.w24 {
    background-position: -33.6rem -24rem
}

.logo-bank050207.w28,
.logo-kcis6207.w28 {
    background-position: -39.2rem -28rem
}

.logo-bank050207.w30,
.logo-kcis6207.w30 {
    background-position: -42rem -30rem
}

.logo-bank050207.w32,
.logo-kcis6207.w32 {
    background-position: -44.8rem -32rem
}

.logo-bank050207.w34,
.logo-kcis6207.w34 {
    background-position: -47.6rem -34rem
}

.logo-bank050207.w36,
.logo-kcis6207.w36 {
    background-position: -50.4rem -36rem
}

.logo-bank050207.w40,
.logo-kcis6207.w40 {
    background-position: -56rem -40rem
}

.logo-bank050207.w44,
.logo-kcis6207.w44 {
    background-position: -61.6rem -44rem
}

.logo-bank050207.w50,
.logo-kcis6207.w50 {
    background-position: -70rem -50rem
}

.logo-bank050207.w52,
.logo-kcis6207.w52 {
    background-position: -72.8rem -52rem
}

.logo-bank050207.w60,
.logo-kcis6207.w60 {
    background-position: -84rem -60rem
}

.logo-bank050207.w64,
.logo-kcis6207.w64 {
    background-position: -89.6rem -64rem
}

.logo-bank050207.w65,
.logo-kcis6207.w65 {
    background-position: -91rem -65rem
}

.logo-bank050207.w72,
.logo-kcis6207.w72 {
    background-position: -100.8rem -72rem
}

/*! 유니온 */

.logo-bank050208.w16,
.logo-kcb20533.w16,
.logo-kcis6208.w16 {
    background-position: -22.4rem -19.2rem
}

.logo-bank050208.w20,
.logo-kcb20533.w20,
.logo-kcis6208.w20 {
    background-position: -28rem -24rem
}

.logo-bank050208.w22,
.logo-kcb20533.w22,
.logo-kcis6208.w22 {
    background-position: -30.8rem -26.4rem
}

.logo-bank050208.w24,
.logo-kcb20533.w24,
.logo-kcis6208.w24 {
    background-position: -33.6rem -28.8rem
}

.logo-bank050208.w28,
.logo-kcb20533.w28,
.logo-kcis6208.w28 {
    background-position: -39.2rem -33.6rem
}

.logo-bank050208.w30,
.logo-kcb20533.w30,
.logo-kcis6208.w30 {
    background-position: -42rem -36rem
}

.logo-bank050208.w32,
.logo-kcb20533.w32,
.logo-kcis6208.w32 {
    background-position: -44.8rem -38.4rem
}

.logo-bank050208.w34,
.logo-kcb20533.w34,
.logo-kcis6208.w34 {
    background-position: -47.6rem -40.8rem
}

.logo-bank050208.w36,
.logo-kcb20533.w36,
.logo-kcis6208.w36 {
    background-position: -50.4rem -43.2rem
}

.logo-bank050208.w40,
.logo-kcb20533.w40,
.logo-kcis6208.w40 {
    background-position: -56rem -48rem
}

.logo-bank050208.w44,
.logo-kcb20533.w44,
.logo-kcis6208.w44 {
    background-position: -61.6rem -52.8rem
}

.logo-bank050208.w50,
.logo-kcb20533.w50,
.logo-kcis6208.w50 {
    background-position: -70rem -60rem
}

.logo-bank050208.w52,
.logo-kcb20533.w52,
.logo-kcis6208.w52 {
    background-position: -72.8rem -62.4rem
}

.logo-bank050208.w60,
.logo-kcb20533.w60,
.logo-kcis6208.w60 {
    background-position: -84rem -72rem
}

.logo-bank050208.w64,
.logo-kcb20533.w64,
.logo-kcis6208.w64 {
    background-position: -89.6rem -76.8rem
}

.logo-bank050208.w65,
.logo-kcb20533.w65,
.logo-kcis6208.w65 {
    background-position: -91rem -78rem
}

.logo-bank050208.w72,
.logo-kcb20533.w72,
.logo-kcis6208.w72 {
    background-position: -100.8rem -86.4rem
}

/*! 엠에스 */

.logo-bank050209.w16,
.logo-kcb20547.w16,
.logo-kcis6209.w16 {
    background-position: 0 -22.4rem
}

.logo-bank050209.w20,
.logo-kcb20547.w20,
.logo-kcis6209.w20 {
    background-position: 0 -28rem
}

.logo-bank050209.w22,
.logo-kcb20547.w22,
.logo-kcis6209.w22 {
    background-position: 0 -30.8rem
}

.logo-bank050209.w24,
.logo-kcb20547.w24,
.logo-kcis6209.w24 {
    background-position: 0 -33.6rem
}

.logo-bank050209.w28,
.logo-kcb20547.w28,
.logo-kcis6209.w28 {
    background-position: 0 -39.2rem
}

.logo-bank050209.w30,
.logo-kcb20547.w30,
.logo-kcis6209.w30 {
    background-position: 0 -42rem
}

.logo-bank050209.w32,
.logo-kcb20547.w32,
.logo-kcis6209.w32 {
    background-position: 0 -44.8rem
}

.logo-bank050209.w34,
.logo-kcb20547.w34,
.logo-kcis6209.w34 {
    background-position: 0 -47.6rem
}

.logo-bank050209.w36,
.logo-kcb20547.w36,
.logo-kcis6209.w36 {
    background-position: 0 -50.4rem
}

.logo-bank050209.w40,
.logo-kcb20547.w40,
.logo-kcis6209.w40 {
    background-position: 0 -56rem
}

.logo-bank050209.w44,
.logo-kcb20547.w44,
.logo-kcis6209.w44 {
    background-position: 0 -61.6rem
}

.logo-bank050209.w50,
.logo-kcb20547.w50,
.logo-kcis6209.w50 {
    background-position: 0 -70rem
}

.logo-bank050209.w52,
.logo-kcb20547.w52,
.logo-kcis6209.w52 {
    background-position: 0 -72.8rem
}

.logo-bank050209.w60,
.logo-kcb20547.w60,
.logo-kcis6209.w60 {
    background-position: 0 -84rem
}

.logo-bank050209.w64,
.logo-kcb20547.w64,
.logo-kcis6209.w64 {
    background-position: 0 -89.6rem
}

.logo-bank050209.w65,
.logo-kcb20547.w65,
.logo-kcis6209.w65 {
    background-position: 0 -91rem
}

.logo-bank050209.w72,
.logo-kcb20547.w72,
.logo-kcis6209.w72 {
    background-position: 0 -100.8rem
}

/*! 안국 */

.logo-bank050304.w16,
.logo-kcis6304.w16 {
    background-position: -3.2rem -22.4rem
}

.logo-bank050304.w20,
.logo-kcis6304.w20 {
    background-position: -4rem -28rem
}

.logo-bank050304.w22,
.logo-kcis6304.w22 {
    background-position: -4.4rem -30.8rem
}

.logo-bank050304.w24,
.logo-kcis6304.w24 {
    background-position: -4.8rem -33.6rem
}

.logo-bank050304.w28,
.logo-kcis6304.w28 {
    background-position: -5.6rem -39.2rem
}

.logo-bank050304.w30,
.logo-kcis6304.w30 {
    background-position: -6rem -42rem
}

.logo-bank050304.w32,
.logo-kcis6304.w32 {
    background-position: -6.4rem -44.8rem
}

.logo-bank050304.w34,
.logo-kcis6304.w34 {
    background-position: -6.8rem -47.6rem
}

.logo-bank050304.w36,
.logo-kcis6304.w36 {
    background-position: -7.2rem -50.4rem
}

.logo-bank050304.w40,
.logo-kcis6304.w40 {
    background-position: -8rem -56rem
}

.logo-bank050304.w44,
.logo-kcis6304.w44 {
    background-position: -8.8rem -61.6rem
}

.logo-bank050304.w50,
.logo-kcis6304.w50 {
    background-position: -10rem -70rem
}

.logo-bank050304.w52,
.logo-kcis6304.w52 {
    background-position: -10.4rem -72.8rem
}

.logo-bank050304.w60,
.logo-kcis6304.w60 {
    background-position: -12rem -84rem
}

.logo-bank050304.w64,
.logo-kcis6304.w64 {
    background-position: -12.8rem -89.6rem
}

.logo-bank050304.w65,
.logo-kcis6304.w65 {
    background-position: -13rem -91rem
}

.logo-bank050304.w72,
.logo-kcis6304.w72 {
    background-position: -14.4rem -100.8rem
}

/*! 남양 */

.logo-bank050305.w16,
.logo-kcb20513.w16,
.logo-kcis6305.w16 {
    background-position: -6.4rem -22.4rem
}

.logo-bank050305.w20,
.logo-kcb20513.w20,
.logo-kcis6305.w20 {
    background-position: -8rem -28rem
}

.logo-bank050305.w22,
.logo-kcb20513.w22,
.logo-kcis6305.w22 {
    background-position: -8.8rem -30.8rem
}

.logo-bank050305.w24,
.logo-kcb20513.w24,
.logo-kcis6305.w24 {
    background-position: -9.6rem -33.6rem
}

.logo-bank050305.w28,
.logo-kcb20513.w28,
.logo-kcis6305.w28 {
    background-position: -11.2rem -39.2rem
}

.logo-bank050305.w30,
.logo-kcb20513.w30,
.logo-kcis6305.w30 {
    background-position: -12rem -42rem
}

.logo-bank050305.w32,
.logo-kcb20513.w32,
.logo-kcis6305.w32 {
    background-position: -12.8rem -44.8rem
}

.logo-bank050305.w34,
.logo-kcb20513.w34,
.logo-kcis6305.w34 {
    background-position: -13.6rem -47.6rem
}

.logo-bank050305.w36,
.logo-kcb20513.w36,
.logo-kcis6305.w36 {
    background-position: -14.4rem -50.4rem
}

.logo-bank050305.w40,
.logo-kcb20513.w40,
.logo-kcis6305.w40 {
    background-position: -16rem -56rem
}

.logo-bank050305.w44,
.logo-kcb20513.w44,
.logo-kcis6305.w44 {
    background-position: -17.6rem -61.6rem
}

.logo-bank050305.w50,
.logo-kcb20513.w50,
.logo-kcis6305.w50 {
    background-position: -20rem -70rem
}

.logo-bank050305.w52,
.logo-kcb20513.w52,
.logo-kcis6305.w52 {
    background-position: -20.8rem -72.8rem
}

.logo-bank050305.w60,
.logo-kcb20513.w60,
.logo-kcis6305.w60 {
    background-position: -24rem -84rem
}

.logo-bank050305.w64,
.logo-kcb20513.w64,
.logo-kcis6305.w64 {
    background-position: -25.6rem -89.6rem
}

.logo-bank050305.w65,
.logo-kcb20513.w65,
.logo-kcis6305.w65 {
    background-position: -26rem -91rem
}

.logo-bank050305.w72,
.logo-kcb20513.w72,
.logo-kcis6305.w72 {
    background-position: -28.8rem -100.8rem
}

/*! 부림 */

.logo-bank050310.w16,
.logo-kcis6310.w16 {
    background-position: -9.6rem -22.4rem
}

.logo-bank050310.w20,
.logo-kcis6310.w20 {
    background-position: -12rem -28rem
}

.logo-bank050310.w22,
.logo-kcis6310.w22 {
    background-position: -13.2rem -30.8rem
}

.logo-bank050310.w24,
.logo-kcis6310.w24 {
    background-position: -14.4rem -33.6rem
}

.logo-bank050310.w28,
.logo-kcis6310.w28 {
    background-position: -16.8rem -39.2rem
}

.logo-bank050310.w30,
.logo-kcis6310.w30 {
    background-position: -18rem -42rem
}

.logo-bank050310.w32,
.logo-kcis6310.w32 {
    background-position: -19.2rem -44.8rem
}

.logo-bank050310.w34,
.logo-kcis6310.w34 {
    background-position: -20.4rem -47.6rem
}

.logo-bank050310.w36,
.logo-kcis6310.w36 {
    background-position: -21.6rem -50.4rem
}

.logo-bank050310.w40,
.logo-kcis6310.w40 {
    background-position: -24rem -56rem
}

.logo-bank050310.w44,
.logo-kcis6310.w44 {
    background-position: -26.4rem -61.6rem
}

.logo-bank050310.w50,
.logo-kcis6310.w50 {
    background-position: -30rem -70rem
}

.logo-bank050310.w52,
.logo-kcis6310.w52 {
    background-position: -31.2rem -72.8rem
}

.logo-bank050310.w60,
.logo-kcis6310.w60 {
    background-position: -36rem -84rem
}

.logo-bank050310.w64,
.logo-kcis6310.w64 {
    background-position: -38.4rem -89.6rem
}

.logo-bank050310.w65,
.logo-kcis6310.w65 {
    background-position: -39rem -91rem
}

.logo-bank050310.w72,
.logo-kcis6310.w72 {
    background-position: -43.2rem -100.8rem
}

/*! 키움 */

.logo-bank050313.w16,
.logo-kcis6313.w16 {
    background-position: -12.8rem -22.4rem
}

.logo-bank050313.w20,
.logo-kcis6313.w20 {
    background-position: -16rem -28rem
}

.logo-bank050313.w22,
.logo-kcis6313.w22 {
    background-position: -17.6rem -30.8rem
}

.logo-bank050313.w24,
.logo-kcis6313.w24 {
    background-position: -19.2rem -33.6rem
}

.logo-bank050313.w28,
.logo-kcis6313.w28 {
    background-position: -22.4rem -39.2rem
}

.logo-bank050313.w30,
.logo-kcis6313.w30 {
    background-position: -24rem -42rem
}

.logo-bank050313.w32,
.logo-kcis6313.w32 {
    background-position: -25.6rem -44.8rem
}

.logo-bank050313.w34,
.logo-kcis6313.w34 {
    background-position: -27.2rem -47.6rem
}

.logo-bank050313.w36,
.logo-kcis6313.w36 {
    background-position: -28.8rem -50.4rem
}

.logo-bank050313.w40,
.logo-kcis6313.w40 {
    background-position: -32rem -56rem
}

.logo-bank050313.w44,
.logo-kcis6313.w44 {
    background-position: -35.2rem -61.6rem
}

.logo-bank050313.w50,
.logo-kcis6313.w50 {
    background-position: -40rem -70rem
}

.logo-bank050313.w52,
.logo-kcis6313.w52 {
    background-position: -41.6rem -72.8rem
}

.logo-bank050313.w60,
.logo-kcis6313.w60 {
    background-position: -48rem -84rem
}

.logo-bank050313.w64,
.logo-kcis6313.w64 {
    background-position: -51.2rem -89.6rem
}

.logo-bank050313.w65,
.logo-kcis6313.w65 {
    background-position: -52rem -91rem
}

.logo-bank050313.w72,
.logo-kcis6313.w72 {
    background-position: -57.6rem -100.8rem
}

/*! 삼정 */

.logo-bank050314.w16,
.logo-kcis6314.w16 {
    background-position: -16rem -22.4rem
}

.logo-bank050314.w20,
.logo-kcis6314.w20 {
    background-position: -20rem -28rem
}

.logo-bank050314.w22,
.logo-kcis6314.w22 {
    background-position: -22rem -30.8rem
}

.logo-bank050314.w24,
.logo-kcis6314.w24 {
    background-position: -24rem -33.6rem
}

.logo-bank050314.w28,
.logo-kcis6314.w28 {
    background-position: -28rem -39.2rem
}

.logo-bank050314.w30,
.logo-kcis6314.w30 {
    background-position: -30rem -42rem
}

.logo-bank050314.w32,
.logo-kcis6314.w32 {
    background-position: -32rem -44.8rem
}

.logo-bank050314.w34,
.logo-kcis6314.w34 {
    background-position: -34rem -47.6rem
}

.logo-bank050314.w36,
.logo-kcis6314.w36 {
    background-position: -36rem -50.4rem
}

.logo-bank050314.w40,
.logo-kcis6314.w40 {
    background-position: -40rem -56rem
}

.logo-bank050314.w44,
.logo-kcis6314.w44 {
    background-position: -44rem -61.6rem
}

.logo-bank050314.w50,
.logo-kcis6314.w50 {
    background-position: -50rem -70rem
}

.logo-bank050314.w52,
.logo-kcis6314.w52 {
    background-position: -52rem -72.8rem
}

.logo-bank050314.w60,
.logo-kcis6314.w60 {
    background-position: -60rem -84rem
}

.logo-bank050314.w64,
.logo-kcis6314.w64 {
    background-position: -64rem -89.6rem
}

.logo-bank050314.w65,
.logo-kcis6314.w65 {
    background-position: -65rem -91rem
}

.logo-bank050314.w72,
.logo-kcis6314.w72 {
    background-position: -72rem -100.8rem
}

/*! 평택 */

.logo-bank.w16,
.logo-kcb20540.w16,
.logo-kcis6317.w16 {
    background-position: -19.2rem -22.4rem
}

.logo-bank.w20,
.logo-kcb20540.w20,
.logo-kcis6317.w20 {
    background-position: -24rem -28rem
}

.logo-bank.w22,
.logo-kcb20540.w22,
.logo-kcis6317.w22 {
    background-position: -26.4rem -30.8rem
}

.logo-bank.w24,
.logo-kcb20540.w24,
.logo-kcis6317.w24 {
    background-position: -28.8rem -33.6rem
}

.logo-bank.w28,
.logo-kcb20540.w28,
.logo-kcis6317.w28 {
    background-position: -33.6rem -39.2rem
}

.logo-bank.w30,
.logo-kcb20540.w30,
.logo-kcis6317.w30 {
    background-position: -36rem -42rem
}

.logo-bank.w32,
.logo-kcb20540.w32,
.logo-kcis6317.w32 {
    background-position: -38.4rem -44.8rem
}

.logo-bank.w34,
.logo-kcb20540.w34,
.logo-kcis6317.w34 {
    background-position: -40.8rem -47.6rem
}

.logo-bank.w36,
.logo-kcb20540.w36,
.logo-kcis6317.w36 {
    background-position: -43.2rem -50.4rem
}

.logo-bank.w40,
.logo-kcb20540.w40,
.logo-kcis6317.w40 {
    background-position: -48rem -56rem
}

.logo-bank.w44,
.logo-kcb20540.w44,
.logo-kcis6317.w44 {
    background-position: -52.8rem -61.6rem
}

.logo-bank.w50,
.logo-kcb20540.w50,
.logo-kcis6317.w50 {
    background-position: -60rem -70rem
}

.logo-bank.w52,
.logo-kcb20540.w52,
.logo-kcis6317.w52 {
    background-position: -62.4rem -72.8rem
}

.logo-bank.w60,
.logo-kcb20540.w60,
.logo-kcis6317.w60 {
    background-position: -72rem -84rem
}

.logo-bank.w64,
.logo-kcb20540.w64,
.logo-kcis6317.w64 {
    background-position: -76.8rem -89.6rem
}

.logo-bank.w65,
.logo-kcb20540.w65,
.logo-kcis6317.w65 {
    background-position: -78rem -91rem
}

.logo-bank.w72,
.logo-kcb20540.w72,
.logo-kcis6317.w72 {
    background-position: -86.4rem -100.8rem
}

/*! 안양 */

.logo-bank050320.w16,
.logo-kcb20530.w16,
.logo-kcis6320.w16 {
    background-position: -22.4rem -22.4rem
}

.logo-bank050320.w20,
.logo-kcb20530.w20,
.logo-kcis6320.w20 {
    background-position: -28rem -28rem
}

.logo-bank050320.w22,
.logo-kcb20530.w22,
.logo-kcis6320.w22 {
    background-position: -30.8rem -30.8rem
}

.logo-bank050320.w24,
.logo-kcb20530.w24,
.logo-kcis6320.w24 {
    background-position: -33.6rem -33.6rem
}

.logo-bank050320.w28,
.logo-kcb20530.w28,
.logo-kcis6320.w28 {
    background-position: -39.2rem -39.2rem
}

.logo-bank050320.w30,
.logo-kcb20530.w30,
.logo-kcis6320.w30 {
    background-position: -42rem -42rem
}

.logo-bank050320.w32,
.logo-kcb20530.w32,
.logo-kcis6320.w32 {
    background-position: -44.8rem -44.8rem
}

.logo-bank050320.w34,
.logo-kcb20530.w34,
.logo-kcis6320.w34 {
    background-position: -47.6rem -47.6rem
}

.logo-bank050320.w36,
.logo-kcb20530.w36,
.logo-kcis6320.w36 {
    background-position: -50.4rem -50.4rem
}

.logo-bank050320.w40,
.logo-kcb20530.w40,
.logo-kcis6320.w40 {
    background-position: -56rem -56rem
}

.logo-bank050320.w44,
.logo-kcb20530.w44,
.logo-kcis6320.w44 {
    background-position: -61.6rem -61.6rem
}

.logo-bank050320.w50,
.logo-kcb20530.w50,
.logo-kcis6320.w50 {
    background-position: -70rem -70rem
}

.logo-bank050320.w52,
.logo-kcb20530.w52,
.logo-kcis6320.w52 {
    background-position: -72.8rem -72.8rem
}

.logo-bank050320.w60,
.logo-kcb20530.w60,
.logo-kcis6320.w60 {
    background-position: -84rem -84rem
}

.logo-bank050320.w64,
.logo-kcb20530.w64,
.logo-kcis6320.w64 {
    background-position: -89.6rem -89.6rem
}

.logo-bank050320.w65,
.logo-kcb20530.w65,
.logo-kcis6320.w65 {
    background-position: -91rem -91rem
}

.logo-bank050320.w72,
.logo-kcb20530.w72,
.logo-kcis6320.w72 {
    background-position: -100.8rem -100.8rem
}

/*! 영진 */

.logo-bank050321.w16,
.logo-kcb20531.w16,
.logo-kcis6321.w16 {
    background-position: -25.6rem 0
}

.logo-bank050321.w20,
.logo-kcb20531.w20,
.logo-kcis6321.w20 {
    background-position: -32rem 0
}

.logo-bank050321.w22,
.logo-kcb20531.w22,
.logo-kcis6321.w22 {
    background-position: -35.2rem 0
}

.logo-bank050321.w24,
.logo-kcb20531.w24,
.logo-kcis6321.w24 {
    background-position: -38.4rem 0
}

.logo-bank050321.w28,
.logo-kcb20531.w28,
.logo-kcis6321.w28 {
    background-position: -44.8rem 0
}

.logo-bank050321.w30,
.logo-kcb20531.w30,
.logo-kcis6321.w30 {
    background-position: -48rem 0
}

.logo-bank050321.w32,
.logo-kcb20531.w32,
.logo-kcis6321.w32 {
    background-position: -51.2rem 0
}

.logo-bank050321.w34,
.logo-kcb20531.w34,
.logo-kcis6321.w34 {
    background-position: -54.4rem 0
}

.logo-bank050321.w36,
.logo-kcb20531.w36,
.logo-kcis6321.w36 {
    background-position: -57.6rem 0
}

.logo-bank050321.w40,
.logo-kcb20531.w40,
.logo-kcis6321.w40 {
    background-position: -64rem 0
}

.logo-bank050321.w44,
.logo-kcb20531.w44,
.logo-kcis6321.w44 {
    background-position: -70.4rem 0
}

.logo-bank050321.w50,
.logo-kcb20531.w50,
.logo-kcis6321.w50 {
    background-position: -80rem 0
}

.logo-bank050321.w52,
.logo-kcb20531.w52,
.logo-kcis6321.w52 {
    background-position: -83.2rem 0
}

.logo-bank050321.w60,
.logo-kcb20531.w60,
.logo-kcis6321.w60 {
    background-position: -96rem 0
}

.logo-bank050321.w64,
.logo-kcb20531.w64,
.logo-kcis6321.w64 {
    background-position: -102.4rem 0
}

.logo-bank050321.w65,
.logo-kcb20531.w65,
.logo-kcis6321.w65 {
    background-position: -104rem 0
}

.logo-bank050321.w72,
.logo-kcb20531.w72,
.logo-kcis6321.w72 {
    background-position: -115.2rem 0
}

/*! 융창 */

.logo-bank050324.w16,
.logo-kcb20534.w16,
.logo-kcis6324.w16 {
    background-position: -25.6rem -3.2rem
}

.logo-bank050324.w20,
.logo-kcb20534.w20,
.logo-kcis6324.w20 {
    background-position: -32rem -4rem
}

.logo-bank050324.w22,
.logo-kcb20534.w22,
.logo-kcis6324.w22 {
    background-position: -35.2rem -4.4rem
}

.logo-bank050324.w24,
.logo-kcb20534.w24,
.logo-kcis6324.w24 {
    background-position: -38.4rem -4.8rem
}

.logo-bank050324.w28,
.logo-kcb20534.w28,
.logo-kcis6324.w28 {
    background-position: -44.8rem -5.6rem
}

.logo-bank050324.w30,
.logo-kcb20534.w30,
.logo-kcis6324.w30 {
    background-position: -48rem -6rem
}

.logo-bank050324.w32,
.logo-kcb20534.w32,
.logo-kcis6324.w32 {
    background-position: -51.2rem -6.4rem
}

.logo-bank050324.w34,
.logo-kcb20534.w34,
.logo-kcis6324.w34 {
    background-position: -54.4rem -6.8rem
}

.logo-bank050324.w36,
.logo-kcb20534.w36,
.logo-kcis6324.w36 {
    background-position: -57.6rem -7.2rem
}

.logo-bank050324.w40,
.logo-kcb20534.w40,
.logo-kcis6324.w40 {
    background-position: -64rem -8rem
}

.logo-bank050324.w44,
.logo-kcb20534.w44,
.logo-kcis6324.w44 {
    background-position: -70.4rem -8.8rem
}

.logo-bank050324.w50,
.logo-kcb20534.w50,
.logo-kcis6324.w50 {
    background-position: -80rem -10rem
}

.logo-bank050324.w52,
.logo-kcb20534.w52,
.logo-kcis6324.w52 {
    background-position: -83.2rem -10.4rem
}

.logo-bank050324.w60,
.logo-kcb20534.w60,
.logo-kcis6324.w60 {
    background-position: -96rem -12rem
}

.logo-bank050324.w64,
.logo-kcb20534.w64,
.logo-kcis6324.w64 {
    background-position: -102.4rem -12.8rem
}

.logo-bank050324.w65,
.logo-kcb20534.w65,
.logo-kcis6324.w65 {
    background-position: -104rem -13rem
}

.logo-bank050324.w72,
.logo-kcb20534.w72,
.logo-kcis6324.w72 {
    background-position: -115.2rem -14.4rem
}

/*! 세람 */

.logo-bank050325.w16,
.logo-kcb20525.w16,
.logo-kcis6325.w16 {
    background-position: -25.6rem -6.4rem
}

.logo-bank050325.w20,
.logo-kcb20525.w20,
.logo-kcis6325.w20 {
    background-position: -32rem -8rem
}

.logo-bank050325.w22,
.logo-kcb20525.w22,
.logo-kcis6325.w22 {
    background-position: -35.2rem -8.8rem
}

.logo-bank050325.w24,
.logo-kcb20525.w24,
.logo-kcis6325.w24 {
    background-position: -38.4rem -9.6rem
}

.logo-bank050325.w28,
.logo-kcb20525.w28,
.logo-kcis6325.w28 {
    background-position: -44.8rem -11.2rem
}

.logo-bank050325.w30,
.logo-kcb20525.w30,
.logo-kcis6325.w30 {
    background-position: -48rem -12rem
}

.logo-bank050325.w32,
.logo-kcb20525.w32,
.logo-kcis6325.w32 {
    background-position: -51.2rem -12.8rem
}

.logo-bank050325.w34,
.logo-kcb20525.w34,
.logo-kcis6325.w34 {
    background-position: -54.4rem -13.6rem
}

.logo-bank050325.w36,
.logo-kcb20525.w36,
.logo-kcis6325.w36 {
    background-position: -57.6rem -14.4rem
}

.logo-bank050325.w40,
.logo-kcb20525.w40,
.logo-kcis6325.w40 {
    background-position: -64rem -16rem
}

.logo-bank050325.w44,
.logo-kcb20525.w44,
.logo-kcis6325.w44 {
    background-position: -70.4rem -17.6rem
}

.logo-bank050325.w50,
.logo-kcb20525.w50,
.logo-kcis6325.w50 {
    background-position: -80rem -20rem
}

.logo-bank050325.w52,
.logo-kcb20525.w52,
.logo-kcis6325.w52 {
    background-position: -83.2rem -20.8rem
}

.logo-bank050325.w60,
.logo-kcb20525.w60,
.logo-kcis6325.w60 {
    background-position: -96rem -24rem
}

.logo-bank050325.w64,
.logo-kcb20525.w64,
.logo-kcis6325.w64 {
    background-position: -102.4rem -25.6rem
}

.logo-bank050325.w65,
.logo-kcb20525.w65,
.logo-kcis6325.w65 {
    background-position: -104rem -26rem
}

.logo-bank050325.w72,
.logo-kcb20525.w72,
.logo-kcis6325.w72 {
    background-position: -115.2rem -28.8rem
}

/*! 페퍼 */

.logo-bank050328.w16,
.logo-kcb20514.w16,
.logo-kcis6328.w16 {
    background-position: -25.6rem -9.6rem
}

.logo-bank050328.w20,
.logo-kcb20514.w20,
.logo-kcis6328.w20 {
    background-position: -32rem -12rem
}

.logo-bank050328.w22,
.logo-kcb20514.w22,
.logo-kcis6328.w22 {
    background-position: -35.2rem -13.2rem
}

.logo-bank050328.w24,
.logo-kcb20514.w24,
.logo-kcis6328.w24 {
    background-position: -38.4rem -14.4rem
}

.logo-bank050328.w28,
.logo-kcb20514.w28,
.logo-kcis6328.w28 {
    background-position: -44.8rem -16.8rem
}

.logo-bank050328.w30,
.logo-kcb20514.w30,
.logo-kcis6328.w30 {
    background-position: -48rem -18rem
}

.logo-bank050328.w32,
.logo-kcb20514.w32,
.logo-kcis6328.w32 {
    background-position: -51.2rem -19.2rem
}

.logo-bank050328.w34,
.logo-kcb20514.w34,
.logo-kcis6328.w34 {
    background-position: -54.4rem -20.4rem
}

.logo-bank050328.w36,
.logo-kcb20514.w36,
.logo-kcis6328.w36 {
    background-position: -57.6rem -21.6rem
}

.logo-bank050328.w40,
.logo-kcb20514.w40,
.logo-kcis6328.w40 {
    background-position: -64rem -24rem
}

.logo-bank050328.w44,
.logo-kcb20514.w44,
.logo-kcis6328.w44 {
    background-position: -70.4rem -26.4rem
}

.logo-bank050328.w50,
.logo-kcb20514.w50,
.logo-kcis6328.w50 {
    background-position: -80rem -30rem
}

.logo-bank050328.w52,
.logo-kcb20514.w52,
.logo-kcis6328.w52 {
    background-position: -83.2rem -31.2rem
}

.logo-bank050328.w60,
.logo-kcb20514.w60,
.logo-kcis6328.w60 {
    background-position: -96rem -36rem
}

.logo-bank050328.w64,
.logo-kcb20514.w64,
.logo-kcis6328.w64 {
    background-position: -102.4rem -38.4rem
}

.logo-bank050328.w65,
.logo-kcb20514.w65,
.logo-kcis6328.w65 {
    background-position: -104rem -39rem
}

.logo-bank050328.w72,
.logo-kcb20514.w72,
.logo-kcis6328.w72 {
    background-position: -115.2rem -43.2rem
}

/*! 상상인 */

.logo-bank050330.w16,
.logo-kcis6330.w16 {
    background-position: -25.6rem -12.8rem
}

.logo-bank050330.w20,
.logo-kcis6330.w20 {
    background-position: -32rem -16rem
}

.logo-bank050330.w22,
.logo-kcis6330.w22 {
    background-position: -35.2rem -17.6rem
}

.logo-bank050330.w24,
.logo-kcis6330.w24 {
    background-position: -38.4rem -19.2rem
}

.logo-bank050330.w28,
.logo-kcis6330.w28 {
    background-position: -44.8rem -22.4rem
}

.logo-bank050330.w30,
.logo-kcis6330.w30 {
    background-position: -48rem -24rem
}

.logo-bank050330.w32,
.logo-kcis6330.w32 {
    background-position: -51.2rem -25.6rem
}

.logo-bank050330.w34,
.logo-kcis6330.w34 {
    background-position: -54.4rem -27.2rem
}

.logo-bank050330.w36,
.logo-kcis6330.w36 {
    background-position: -57.6rem -28.8rem
}

.logo-bank050330.w40,
.logo-kcis6330.w40 {
    background-position: -64rem -32rem
}

.logo-bank050330.w44,
.logo-kcis6330.w44 {
    background-position: -70.4rem -35.2rem
}

.logo-bank050330.w50,
.logo-kcis6330.w50 {
    background-position: -80rem -40rem
}

.logo-bank050330.w52,
.logo-kcis6330.w52 {
    background-position: -83.2rem -41.6rem
}

.logo-bank050330.w60,
.logo-kcis6330.w60 {
    background-position: -96rem -48rem
}

.logo-bank050330.w64,
.logo-kcis6330.w64 {
    background-position: -102.4rem -51.2rem
}

.logo-bank050330.w65,
.logo-kcis6330.w65 {
    background-position: -104rem -52rem
}

.logo-bank050330.w72,
.logo-kcis6330.w72 {
    background-position: -115.2rem -57.6rem
}

/*!JT */

.logo-bank050332.w16,
.logo-kcb20548.w16,
.logo-kcis6164.w16 {
    background-position: -25.6rem -16rem
}

.logo-bank050332.w20,
.logo-kcb20548.w20,
.logo-kcis6164.w20 {
    background-position: -32rem -20rem
}

.logo-bank050332.w22,
.logo-kcb20548.w22,
.logo-kcis6164.w22 {
    background-position: -35.2rem -22rem
}

.logo-bank050332.w24,
.logo-kcb20548.w24,
.logo-kcis6164.w24 {
    background-position: -38.4rem -24rem
}

.logo-bank050332.w28,
.logo-kcb20548.w28,
.logo-kcis6164.w28 {
    background-position: -44.8rem -28rem
}

.logo-bank050332.w30,
.logo-kcb20548.w30,
.logo-kcis6164.w30 {
    background-position: -48rem -30rem
}

.logo-bank050332.w32,
.logo-kcb20548.w32,
.logo-kcis6164.w32 {
    background-position: -51.2rem -32rem
}

.logo-bank050332.w34,
.logo-kcb20548.w34,
.logo-kcis6164.w34 {
    background-position: -54.4rem -34rem
}

.logo-bank050332.w36,
.logo-kcb20548.w36,
.logo-kcis6164.w36 {
    background-position: -57.6rem -36rem
}

.logo-bank050332.w40,
.logo-kcb20548.w40,
.logo-kcis6164.w40 {
    background-position: -64rem -40rem
}

.logo-bank050332.w44,
.logo-kcb20548.w44,
.logo-kcis6164.w44 {
    background-position: -70.4rem -44rem
}

.logo-bank050332.w50,
.logo-kcb20548.w50,
.logo-kcis6164.w50 {
    background-position: -80rem -50rem
}

.logo-bank050332.w52,
.logo-kcb20548.w52,
.logo-kcis6164.w52 {
    background-position: -83.2rem -52rem
}

.logo-bank050332.w60,
.logo-kcb20548.w60,
.logo-kcis6164.w60 {
    background-position: -96rem -60rem
}

.logo-bank050332.w64,
.logo-kcb20548.w64,
.logo-kcis6164.w64 {
    background-position: -102.4rem -64rem
}

.logo-bank050332.w65,
.logo-kcb20548.w65,
.logo-kcis6164.w65 {
    background-position: -104rem -65rem
}

.logo-bank050332.w72,
.logo-kcb20548.w72,
.logo-kcis6164.w72 {
    background-position: -115.2rem -72rem
}

/*! 한화 */

.logo-bank050334.w16,
.logo-kcis6315.w16 {
    background-position: -25.6rem -19.2rem
}

.logo-bank050334.w20,
.logo-kcis6315.w20 {
    background-position: -32rem -24rem
}

.logo-bank050334.w22,
.logo-kcis6315.w22 {
    background-position: -35.2rem -26.4rem
}

.logo-bank050334.w24,
.logo-kcis6315.w24 {
    background-position: -38.4rem -28.8rem
}

.logo-bank050334.w28,
.logo-kcis6315.w28 {
    background-position: -44.8rem -33.6rem
}

.logo-bank050334.w30,
.logo-kcis6315.w30 {
    background-position: -48rem -36rem
}

.logo-bank050334.w32,
.logo-kcis6315.w32 {
    background-position: -51.2rem -38.4rem
}

.logo-bank050334.w34,
.logo-kcis6315.w34 {
    background-position: -54.4rem -40.8rem
}

.logo-bank050334.w36,
.logo-kcis6315.w36 {
    background-position: -57.6rem -43.2rem
}

.logo-bank050334.w40,
.logo-kcis6315.w40 {
    background-position: -64rem -48rem
}

.logo-bank050334.w44,
.logo-kcis6315.w44 {
    background-position: -70.4rem -52.8rem
}

.logo-bank050334.w50,
.logo-kcis6315.w50 {
    background-position: -80rem -60rem
}

.logo-bank050334.w52,
.logo-kcis6315.w52 {
    background-position: -83.2rem -62.4rem
}

.logo-bank050334.w60,
.logo-kcis6315.w60 {
    background-position: -96rem -72rem
}

.logo-bank050334.w64,
.logo-kcis6315.w64 {
    background-position: -102.4rem -76.8rem
}

.logo-bank050334.w65,
.logo-kcis6315.w65 {
    background-position: -104rem -78rem
}

.logo-bank050334.w72,
.logo-kcis6315.w72 {
    background-position: -115.2rem -86.4rem
}

/*! 신한 */

.logo-bank050347.w16,
.logo-kcis6080.w16 {
    background-position: -25.6rem -22.4rem
}

.logo-bank050347.w20,
.logo-kcis6080.w20 {
    background-position: -32rem -28rem
}

.logo-bank050347.w22,
.logo-kcis6080.w22 {
    background-position: -35.2rem -30.8rem
}

.logo-bank050347.w24,
.logo-kcis6080.w24 {
    background-position: -38.4rem -33.6rem
}

.logo-bank050347.w28,
.logo-kcis6080.w28 {
    background-position: -44.8rem -39.2rem
}

.logo-bank050347.w30,
.logo-kcis6080.w30 {
    background-position: -48rem -42rem
}

.logo-bank050347.w32,
.logo-kcis6080.w32 {
    background-position: -51.2rem -44.8rem
}

.logo-bank050347.w34,
.logo-kcis6080.w34 {
    background-position: -54.4rem -47.6rem
}

.logo-bank050347.w36,
.logo-kcis6080.w36 {
    background-position: -57.6rem -50.4rem
}

.logo-bank050347.w40,
.logo-kcis6080.w40 {
    background-position: -64rem -56rem
}

.logo-bank050347.w44,
.logo-kcis6080.w44 {
    background-position: -70.4rem -61.6rem
}

.logo-bank050347.w50,
.logo-kcis6080.w50 {
    background-position: -80rem -70rem
}

.logo-bank050347.w52,
.logo-kcis6080.w52 {
    background-position: -83.2rem -72.8rem
}

.logo-bank050347.w60,
.logo-kcis6080.w60 {
    background-position: -96rem -84rem
}

.logo-bank050347.w64,
.logo-kcis6080.w64 {
    background-position: -102.4rem -89.6rem
}

.logo-bank050347.w65,
.logo-kcis6080.w65 {
    background-position: -104rem -91rem
}

.logo-bank050347.w72,
.logo-kcis6080.w72 {
    background-position: -115.2rem -100.8rem
}

/*! CK */

.logo-bank050351.w16 {
    background-position: 0 -25.6rem
}

.logo-bank050351.w20 {
    background-position: 0 -32rem
}

.logo-bank050351.w22 {
    background-position: 0 -35.2rem
}

.logo-bank050351.w24 {
    background-position: 0 -38.4rem
}

.logo-bank050351.w28 {
    background-position: 0 -44.8rem
}

.logo-bank050351.w30 {
    background-position: 0 -48rem
}

.logo-bank050351.w32 {
    background-position: 0 -51.2rem
}

.logo-bank050351.w34 {
    background-position: 0 -54.4rem
}

.logo-bank050351.w36 {
    background-position: 0 -57.6rem
}

.logo-bank050351.w40 {
    background-position: 0 -64rem
}

.logo-bank050351.w44 {
    background-position: 0 -70.4rem
}

.logo-bank050351.w50 {
    background-position: 0 -80rem
}

.logo-bank050351.w52 {
    background-position: 0 -83.2rem
}

.logo-bank050351.w60 {
    background-position: 0 -96rem
}

.logo-bank050351.w64 {
    background-position: 0 -102.4rem
}

.logo-bank050351.w65 {
    background-position: 0 -104rem
}

.logo-bank050351.w72 {
    background-position: 0 -115.2rem
}

/*! 대명 */

.logo-bank050401.w16,
.logo-kcis6401.w16 {
    background-position: -3.2rem -25.6rem
}

.logo-bank050401.w20,
.logo-kcis6401.w20 {
    background-position: -4rem -32rem
}

.logo-bank050401.w22,
.logo-kcis6401.w22 {
    background-position: -4.4rem -35.2rem
}

.logo-bank050401.w24,
.logo-kcis6401.w24 {
    background-position: -4.8rem -38.4rem
}

.logo-bank050401.w28,
.logo-kcis6401.w28 {
    background-position: -5.6rem -44.8rem
}

.logo-bank050401.w30,
.logo-kcis6401.w30 {
    background-position: -6rem -48rem
}

.logo-bank050401.w32,
.logo-kcis6401.w32 {
    background-position: -6.4rem -51.2rem
}

.logo-bank050401.w34,
.logo-kcis6401.w34 {
    background-position: -6.8rem -54.4rem
}

.logo-bank050401.w36,
.logo-kcis6401.w36 {
    background-position: -7.2rem -57.6rem
}

.logo-bank050401.w40,
.logo-kcis6401.w40 {
    background-position: -8rem -64rem
}

.logo-bank050401.w44,
.logo-kcis6401.w44 {
    background-position: -8.8rem -70.4rem
}

.logo-bank050401.w50,
.logo-kcis6401.w50 {
    background-position: -10rem -80rem
}

.logo-bank050401.w52,
.logo-kcis6401.w52 {
    background-position: -10.4rem -83.2rem
}

.logo-bank050401.w60,
.logo-kcis6401.w60 {
    background-position: -12rem -96rem
}

.logo-bank050401.w64,
.logo-kcis6401.w64 {
    background-position: -12.8rem -102.4rem
}

.logo-bank050401.w65,
.logo-kcis6401.w65 {
    background-position: -13rem -104rem
}

.logo-bank050401.w72,
.logo-kcis6401.w72 {
    background-position: -14.4rem -115.2rem
}

/*! 우리금융 */

.logo-bank050403.w16,
.logo-kcis6403.w16 {
    background-position: -6.4rem -25.6rem
}

.logo-bank050403.w20,
.logo-kcis6403.w20 {
    background-position: -8rem -32rem
}

.logo-bank050403.w22,
.logo-kcis6403.w22 {
    background-position: -8.8rem -35.2rem
}

.logo-bank050403.w24,
.logo-kcis6403.w24 {
    background-position: -9.6rem -38.4rem
}

.logo-bank050403.w28,
.logo-kcis6403.w28 {
    background-position: -11.2rem -44.8rem
}

.logo-bank050403.w30,
.logo-kcis6403.w30 {
    background-position: -12rem -48rem
}

.logo-bank050403.w32,
.logo-kcis6403.w32 {
    background-position: -12.8rem -51.2rem
}

.logo-bank050403.w34,
.logo-kcis6403.w34 {
    background-position: -13.6rem -54.4rem
}

.logo-bank050403.w36,
.logo-kcis6403.w36 {
    background-position: -14.4rem -57.6rem
}

.logo-bank050403.w40,
.logo-kcis6403.w40 {
    background-position: -16rem -64rem
}

.logo-bank050403.w44,
.logo-kcis6403.w44 {
    background-position: -17.6rem -70.4rem
}

.logo-bank050403.w50,
.logo-kcis6403.w50 {
    background-position: -20rem -80rem
}

.logo-bank050403.w52,
.logo-kcis6403.w52 {
    background-position: -20.8rem -83.2rem
}

.logo-bank050403.w60,
.logo-kcis6403.w60 {
    background-position: -24rem -96rem
}

.logo-bank050403.w64,
.logo-kcis6403.w64 {
    background-position: -25.6rem -102.4rem
}

.logo-bank050403.w65,
.logo-kcis6403.w65 {
    background-position: -26rem -104rem
}

.logo-bank050403.w72,
.logo-kcis6403.w72 {
    background-position: -28.8rem -115.2rem
}

/*! 청주 */

.logo-bank050405.w16,
.logo-kcb20539.w16,
.logo-kcis6405.w16 {
    background-position: -9.6rem -25.6rem
}

.logo-bank050405.w20,
.logo-kcb20539.w20,
.logo-kcis6405.w20 {
    background-position: -12rem -32rem
}

.logo-bank050405.w22,
.logo-kcb20539.w22,
.logo-kcis6405.w22 {
    background-position: -13.2rem -35.2rem
}

.logo-bank050405.w24,
.logo-kcb20539.w24,
.logo-kcis6405.w24 {
    background-position: -14.4rem -38.4rem
}

.logo-bank050405.w28,
.logo-kcb20539.w28,
.logo-kcis6405.w28 {
    background-position: -16.8rem -44.8rem
}

.logo-bank050405.w30,
.logo-kcb20539.w30,
.logo-kcis6405.w30 {
    background-position: -18rem -48rem
}

.logo-bank050405.w32,
.logo-kcb20539.w32,
.logo-kcis6405.w32 {
    background-position: -19.2rem -51.2rem
}

.logo-bank050405.w34,
.logo-kcb20539.w34,
.logo-kcis6405.w34 {
    background-position: -20.4rem -54.4rem
}

.logo-bank050405.w36,
.logo-kcb20539.w36,
.logo-kcis6405.w36 {
    background-position: -21.6rem -57.6rem
}

.logo-bank050405.w40,
.logo-kcb20539.w40,
.logo-kcis6405.w40 {
    background-position: -24rem -64rem
}

.logo-bank050405.w44,
.logo-kcb20539.w44,
.logo-kcis6405.w44 {
    background-position: -26.4rem -70.4rem
}

.logo-bank050405.w50,
.logo-kcb20539.w50,
.logo-kcis6405.w50 {
    background-position: -30rem -80rem
}

.logo-bank050405.w52,
.logo-kcb20539.w52,
.logo-kcis6405.w52 {
    background-position: -31.2rem -83.2rem
}

.logo-bank050405.w60,
.logo-kcb20539.w60,
.logo-kcis6405.w60 {
    background-position: -36rem -96rem
}

.logo-bank050405.w64,
.logo-kcb20539.w64,
.logo-kcis6405.w64 {
    background-position: -38.4rem -102.4rem
}

.logo-bank050405.w65,
.logo-kcb20539.w65,
.logo-kcis6405.w65 {
    background-position: -39rem -104rem
}

.logo-bank050405.w72,
.logo-kcb20539.w72,
.logo-kcis6405.w72 {
    background-position: -43.2rem -115.2rem
}

/*! 한성 */

.logo-bank050408.w16,
.logo-kcb20544.w16,
.logo-kcis6408.w16 {
    background-position: -12.8rem -25.6rem
}

.logo-bank050408.w20,
.logo-kcb20544.w20,
.logo-kcis6408.w20 {
    background-position: -16rem -32rem
}

.logo-bank050408.w22,
.logo-kcb20544.w22,
.logo-kcis6408.w22 {
    background-position: -17.6rem -35.2rem
}

.logo-bank050408.w24,
.logo-kcb20544.w24,
.logo-kcis6408.w24 {
    background-position: -19.2rem -38.4rem
}

.logo-bank050408.w28,
.logo-kcb20544.w28,
.logo-kcis6408.w28 {
    background-position: -22.4rem -44.8rem
}

.logo-bank050408.w30,
.logo-kcb20544.w30,
.logo-kcis6408.w30 {
    background-position: -24rem -48rem
}

.logo-bank050408.w32,
.logo-kcb20544.w32,
.logo-kcis6408.w32 {
    background-position: -25.6rem -51.2rem
}

.logo-bank050408.w34,
.logo-kcb20544.w34,
.logo-kcis6408.w34 {
    background-position: -27.2rem -54.4rem
}

.logo-bank050408.w36,
.logo-kcb20544.w36,
.logo-kcis6408.w36 {
    background-position: -28.8rem -57.6rem
}

.logo-bank050408.w40,
.logo-kcb20544.w40,
.logo-kcis6408.w40 {
    background-position: -32rem -64rem
}

.logo-bank050408.w44,
.logo-kcb20544.w44,
.logo-kcis6408.w44 {
    background-position: -35.2rem -70.4rem
}

.logo-bank050408.w50,
.logo-kcb20544.w50,
.logo-kcis6408.w50 {
    background-position: -40rem -80rem
}

.logo-bank050408.w52,
.logo-kcb20544.w52,
.logo-kcis6408.w52 {
    background-position: -41.6rem -83.2rem
}

.logo-bank050408.w60,
.logo-kcb20544.w60,
.logo-kcis6408.w60 {
    background-position: -48rem -96rem
}

.logo-bank050408.w64,
.logo-kcb20544.w64,
.logo-kcis6408.w64 {
    background-position: -51.2rem -102.4rem
}

.logo-bank050408.w65,
.logo-kcb20544.w65,
.logo-kcis6408.w65 {
    background-position: -52rem -104rem
}

.logo-bank050408.w72,
.logo-kcb20544.w72,
.logo-kcis6408.w72 {
    background-position: -57.6rem -115.2rem
}

/*! 상상인플러스 */

.logo-bank050459.w16,
.logo-kcb20538.w16,
.logo-kcb20545.w16,
.logo-kcis6459.w16 {
    background-position: -16rem -25.6rem
}

.logo-bank050459.w20,
.logo-kcb20538.w20,
.logo-kcb20545.w20,
.logo-kcis6459.w20 {
    background-position: -20rem -32rem
}

.logo-bank050459.w22,
.logo-kcb20538.w22,
.logo-kcb20545.w22,
.logo-kcis6459.w22 {
    background-position: -22rem -35.2rem
}

.logo-bank050459.w24,
.logo-kcb20538.w24,
.logo-kcb20545.w24,
.logo-kcis6459.w24 {
    background-position: -24rem -38.4rem
}

.logo-bank050459.w28,
.logo-kcb20538.w28,
.logo-kcb20545.w28,
.logo-kcis6459.w28 {
    background-position: -28rem -44.8rem
}

.logo-bank050459.w30,
.logo-kcb20538.w30,
.logo-kcb20545.w30,
.logo-kcis6459.w30 {
    background-position: -30rem -48rem
}

.logo-bank050459.w32,
.logo-kcb20538.w32,
.logo-kcb20545.w32,
.logo-kcis6459.w32 {
    background-position: -32rem -51.2rem
}

.logo-bank050459.w34,
.logo-kcb20538.w34,
.logo-kcb20545.w34,
.logo-kcis6459.w34 {
    background-position: -34rem -54.4rem
}

.logo-bank050459.w36,
.logo-kcb20538.w36,
.logo-kcb20545.w36,
.logo-kcis6459.w36 {
    background-position: -36rem -57.6rem
}

.logo-bank050459.w40,
.logo-kcb20538.w40,
.logo-kcb20545.w40,
.logo-kcis6459.w40 {
    background-position: -40rem -64rem
}

.logo-bank050459.w44,
.logo-kcb20538.w44,
.logo-kcb20545.w44,
.logo-kcis6459.w44 {
    background-position: -44rem -70.4rem
}

.logo-bank050459.w50,
.logo-kcb20538.w50,
.logo-kcb20545.w50,
.logo-kcis6459.w50 {
    background-position: -50rem -80rem
}

.logo-bank050459.w52,
.logo-kcb20538.w52,
.logo-kcb20545.w52,
.logo-kcis6459.w52 {
    background-position: -52rem -83.2rem
}

.logo-bank050459.w60,
.logo-kcb20538.w60,
.logo-kcb20545.w60,
.logo-kcis6459.w60 {
    background-position: -60rem -96rem
}

.logo-bank050459.w64,
.logo-kcb20538.w64,
.logo-kcb20545.w64,
.logo-kcis6459.w64 {
    background-position: -64rem -102.4rem
}

.logo-bank050459.w65,
.logo-kcb20538.w65,
.logo-kcb20545.w65,
.logo-kcis6459.w65 {
    background-position: -65rem -104rem
}

.logo-bank050459.w72,
.logo-kcb20538.w72,
.logo-kcb20545.w72,
.logo-kcis6459.w72 {
    background-position: -72rem -115.2rem
}

/*! 아산 */

.logo-bank050460.w16,
.logo-kcis6460.w16 {
    background-position: -19.2rem -25.6rem
}

.logo-bank050460.w20,
.logo-kcis6460.w20 {
    background-position: -24rem -32rem
}

.logo-bank050460.w22,
.logo-kcis6460.w22 {
    background-position: -26.4rem -35.2rem
}

.logo-bank050460.w24,
.logo-kcis6460.w24 {
    background-position: -28.8rem -38.4rem
}

.logo-bank050460.w28,
.logo-kcis6460.w28 {
    background-position: -33.6rem -44.8rem
}

.logo-bank050460.w30,
.logo-kcis6460.w30 {
    background-position: -36rem -48rem
}

.logo-bank050460.w32,
.logo-kcis6460.w32 {
    background-position: -38.4rem -51.2rem
}

.logo-bank050460.w34,
.logo-kcis6460.w34 {
    background-position: -40.8rem -54.4rem
}

.logo-bank050460.w36,
.logo-kcis6460.w36 {
    background-position: -43.2rem -57.6rem
}

.logo-bank050460.w40,
.logo-kcis6460.w40 {
    background-position: -48rem -64rem
}

.logo-bank050460.w44,
.logo-kcis6460.w44 {
    background-position: -52.8rem -70.4rem
}

.logo-bank050460.w50,
.logo-kcis6460.w50 {
    background-position: -60rem -80rem
}

.logo-bank050460.w52,
.logo-kcis6460.w52 {
    background-position: -62.4rem -83.2rem
}

.logo-bank050460.w60,
.logo-kcis6460.w60 {
    background-position: -72rem -96rem
}

.logo-bank050460.w64,
.logo-kcis6460.w64 {
    background-position: -76.8rem -102.4rem
}

.logo-bank050460.w65,
.logo-kcis6460.w65 {
    background-position: -78rem -104rem
}

.logo-bank050460.w72,
.logo-kcis6460.w72 {
    background-position: -86.4rem -115.2rem
}

/*! 오투 */

.logo-bank050461.w16,
.logo-kcb20515.w16,
.logo-kcis6461.w16 {
    background-position: -22.4rem -25.6rem
}

.logo-bank050461.w20,
.logo-kcb20515.w20,
.logo-kcis6461.w20 {
    background-position: -28rem -32rem
}

.logo-bank050461.w22,
.logo-kcb20515.w22,
.logo-kcis6461.w22 {
    background-position: -30.8rem -35.2rem
}

.logo-bank050461.w24,
.logo-kcb20515.w24,
.logo-kcis6461.w24 {
    background-position: -33.6rem -38.4rem
}

.logo-bank050461.w28,
.logo-kcb20515.w28,
.logo-kcis6461.w28 {
    background-position: -39.2rem -44.8rem
}

.logo-bank050461.w30,
.logo-kcb20515.w30,
.logo-kcis6461.w30 {
    background-position: -42rem -48rem
}

.logo-bank050461.w32,
.logo-kcb20515.w32,
.logo-kcis6461.w32 {
    background-position: -44.8rem -51.2rem
}

.logo-bank050461.w34,
.logo-kcb20515.w34,
.logo-kcis6461.w34 {
    background-position: -47.6rem -54.4rem
}

.logo-bank050461.w36,
.logo-kcb20515.w36,
.logo-kcis6461.w36 {
    background-position: -50.4rem -57.6rem
}

.logo-bank050461.w40,
.logo-kcb20515.w40,
.logo-kcis6461.w40 {
    background-position: -56rem -64rem
}

.logo-bank050461.w44,
.logo-kcb20515.w44,
.logo-kcis6461.w44 {
    background-position: -61.6rem -70.4rem
}

.logo-bank050461.w50,
.logo-kcb20515.w50,
.logo-kcis6461.w50 {
    background-position: -70rem -80rem
}

.logo-bank050461.w52,
.logo-kcb20515.w52,
.logo-kcis6461.w52 {
    background-position: -72.8rem -83.2rem
}

.logo-bank050461.w60,
.logo-kcb20515.w60,
.logo-kcis6461.w60 {
    background-position: -84rem -96rem
}

.logo-bank050461.w64,
.logo-kcb20515.w64,
.logo-kcis6461.w64 {
    background-position: -89.6rem -102.4rem
}

.logo-bank050461.w65,
.logo-kcb20515.w65,
.logo-kcis6461.w65 {
    background-position: -91rem -104rem
}

.logo-bank050461.w72,
.logo-kcb20515.w72,
.logo-kcis6461.w72 {
    background-position: -100.8rem -115.2rem
}

/*! 스타 */

.logo-bank050506.w16,
.logo-kcb20528.w16,
.logo-kcis6506.w16 {
    background-position: -25.6rem -25.6rem
}

.logo-bank050506.w20,
.logo-kcb20528.w20,
.logo-kcis6506.w20 {
    background-position: -32rem -32rem
}

.logo-bank050506.w22,
.logo-kcb20528.w22,
.logo-kcis6506.w22 {
    background-position: -35.2rem -35.2rem
}

.logo-bank050506.w24,
.logo-kcb20528.w24,
.logo-kcis6506.w24 {
    background-position: -38.4rem -38.4rem
}

.logo-bank050506.w28,
.logo-kcb20528.w28,
.logo-kcis6506.w28 {
    background-position: -44.8rem -44.8rem
}

.logo-bank050506.w30,
.logo-kcb20528.w30,
.logo-kcis6506.w30 {
    background-position: -48rem -48rem
}

.logo-bank050506.w32,
.logo-kcb20528.w32,
.logo-kcis6506.w32 {
    background-position: -51.2rem -51.2rem
}

.logo-bank050506.w34,
.logo-kcb20528.w34,
.logo-kcis6506.w34 {
    background-position: -54.4rem -54.4rem
}

.logo-bank050506.w36,
.logo-kcb20528.w36,
.logo-kcis6506.w36 {
    background-position: -57.6rem -57.6rem
}

.logo-bank050506.w40,
.logo-kcb20528.w40,
.logo-kcis6506.w40 {
    background-position: -64rem -64rem
}

.logo-bank050506.w44,
.logo-kcb20528.w44,
.logo-kcis6506.w44 {
    background-position: -70.4rem -70.4rem
}

.logo-bank050506.w50,
.logo-kcb20528.w50,
.logo-kcis6506.w50 {
    background-position: -80rem -80rem
}

.logo-bank050506.w52,
.logo-kcb20528.w52,
.logo-kcis6506.w52 {
    background-position: -83.2rem -83.2rem
}

.logo-bank050506.w60,
.logo-kcb20528.w60,
.logo-kcis6506.w60 {
    background-position: -96rem -96rem
}

.logo-bank050506.w64,
.logo-kcb20528.w64,
.logo-kcis6506.w64 {
    background-position: -102.4rem -102.4rem
}

.logo-bank050506.w65,
.logo-kcb20528.w65,
.logo-kcis6506.w65 {
    background-position: -104rem -104rem
}

.logo-bank050506.w72,
.logo-kcb20528.w72,
.logo-kcis6506.w72 {
    background-position: -115.2rem -115.2rem
}

/*! 삼호 */

.logo-bank050510.w16,
.logo-kcb20552.w16,
.logo-kcis6510.w16 {
    background-position: -28.8rem 0
}

.logo-bank050510.w20,
.logo-kcb20552.w20,
.logo-kcis6510.w20 {
    background-position: -36rem 0
}

.logo-bank050510.w22,
.logo-kcb20552.w22,
.logo-kcis6510.w22 {
    background-position: -39.6rem 0
}

.logo-bank050510.w24,
.logo-kcb20552.w24,
.logo-kcis6510.w24 {
    background-position: -43.2rem 0
}

.logo-bank050510.w28,
.logo-kcb20552.w28,
.logo-kcis6510.w28 {
    background-position: -50.4rem 0
}

.logo-bank050510.w30,
.logo-kcb20552.w30,
.logo-kcis6510.w30 {
    background-position: -54rem 0
}

.logo-bank050510.w32,
.logo-kcb20552.w32,
.logo-kcis6510.w32 {
    background-position: -57.6rem 0
}

.logo-bank050510.w34,
.logo-kcb20552.w34,
.logo-kcis6510.w34 {
    background-position: -61.2rem 0
}

.logo-bank050510.w36,
.logo-kcb20552.w36,
.logo-kcis6510.w36 {
    background-position: -64.8rem 0
}

.logo-bank050510.w40,
.logo-kcb20552.w40,
.logo-kcis6510.w40 {
    background-position: -72rem 0
}

.logo-bank050510.w44,
.logo-kcb20552.w44,
.logo-kcis6510.w44 {
    background-position: -79.2rem 0
}

.logo-bank050510.w50,
.logo-kcb20552.w50,
.logo-kcis6510.w50 {
    background-position: -90rem 0
}

.logo-bank050510.w52,
.logo-kcb20552.w52,
.logo-kcis6510.w52 {
    background-position: -93.6rem 0
}

.logo-bank050510.w60,
.logo-kcb20552.w60,
.logo-kcis6510.w60 {
    background-position: -108rem 0
}

.logo-bank050510.w64,
.logo-kcb20552.w64,
.logo-kcis6510.w64 {
    background-position: -115.2rem 0
}

.logo-bank050510.w65,
.logo-kcb20552.w65,
.logo-kcis6510.w65 {
    background-position: -117rem 0
}

.logo-bank050510.w72,
.logo-kcb20552.w72,
.logo-kcis6510.w72 {
    background-position: -129.6rem 0
}

/*! 한국투자 */

.logo-bank050551.w16,
.logo-kcis6157.w16 {
    background-position: -28.8rem -3.2rem
}

.logo-bank050551.w20,
.logo-kcis6157.w20 {
    background-position: -36rem -4rem
}

.logo-bank050551.w22,
.logo-kcis6157.w22 {
    background-position: -39.6rem -4.4rem
}

.logo-bank050551.w24,
.logo-kcis6157.w24 {
    background-position: -43.2rem -4.8rem
}

.logo-bank050551.w28,
.logo-kcis6157.w28 {
    background-position: -50.4rem -5.6rem
}

.logo-bank050551.w30,
.logo-kcis6157.w30 {
    background-position: -54rem -6rem
}

.logo-bank050551.w32,
.logo-kcis6157.w32 {
    background-position: -57.6rem -6.4rem
}

.logo-bank050551.w34,
.logo-kcis6157.w34 {
    background-position: -61.2rem -6.8rem
}

.logo-bank050551.w36,
.logo-kcis6157.w36 {
    background-position: -64.8rem -7.2rem
}

.logo-bank050551.w40,
.logo-kcis6157.w40 {
    background-position: -72rem -8rem
}

.logo-bank050551.w44,
.logo-kcis6157.w44 {
    background-position: -79.2rem -8.8rem
}

.logo-bank050551.w50,
.logo-kcis6157.w50 {
    background-position: -90rem -10rem
}

.logo-bank050551.w52,
.logo-kcis6157.w52 {
    background-position: -93.6rem -10.4rem
}

.logo-bank050551.w60,
.logo-kcis6157.w60 {
    background-position: -108rem -12rem
}

.logo-bank050551.w64,
.logo-kcis6157.w64 {
    background-position: -115.2rem -12.8rem
}

.logo-bank050551.w65,
.logo-kcis6157.w65 {
    background-position: -117rem -13rem
}

.logo-bank050551.w72,
.logo-kcis6157.w72 {
    background-position: -129.6rem -14.4rem
}

/*! 대한 */

.logo-bank050554.w16,
.logo-kcb20517.w16,
.logo-kcis6554.w16 {
    background-position: -28.8rem -6.4rem
}

.logo-bank050554.w20,
.logo-kcb20517.w20,
.logo-kcis6554.w20 {
    background-position: -36rem -8rem
}

.logo-bank050554.w22,
.logo-kcb20517.w22,
.logo-kcis6554.w22 {
    background-position: -39.6rem -8.8rem
}

.logo-bank050554.w24,
.logo-kcb20517.w24,
.logo-kcis6554.w24 {
    background-position: -43.2rem -9.6rem
}

.logo-bank050554.w28,
.logo-kcb20517.w28,
.logo-kcis6554.w28 {
    background-position: -50.4rem -11.2rem
}

.logo-bank050554.w30,
.logo-kcb20517.w30,
.logo-kcis6554.w30 {
    background-position: -54rem -12rem
}

.logo-bank050554.w32,
.logo-kcb20517.w32,
.logo-kcis6554.w32 {
    background-position: -57.6rem -12.8rem
}

.logo-bank050554.w34,
.logo-kcb20517.w34,
.logo-kcis6554.w34 {
    background-position: -61.2rem -13.6rem
}

.logo-bank050554.w36,
.logo-kcb20517.w36,
.logo-kcis6554.w36 {
    background-position: -64.8rem -14.4rem
}

.logo-bank050554.w40,
.logo-kcb20517.w40,
.logo-kcis6554.w40 {
    background-position: -72rem -16rem
}

.logo-bank050554.w44,
.logo-kcb20517.w44,
.logo-kcis6554.w44 {
    background-position: -79.2rem -17.6rem
}

.logo-bank050554.w50,
.logo-kcb20517.w50,
.logo-kcis6554.w50 {
    background-position: -90rem -20rem
}

.logo-bank050554.w52,
.logo-kcb20517.w52,
.logo-kcis6554.w52 {
    background-position: -93.6rem -20.8rem
}

.logo-bank050554.w60,
.logo-kcb20517.w60,
.logo-kcis6554.w60 {
    background-position: -108rem -24rem
}

.logo-bank050554.w64,
.logo-kcb20517.w64,
.logo-kcis6554.w64 {
    background-position: -115.2rem -25.6rem
}

.logo-bank050554.w65,
.logo-kcb20517.w65,
.logo-kcis6554.w65 {
    background-position: -117rem -26rem
}

.logo-bank050554.w72,
.logo-kcb20517.w72,
.logo-kcis6554.w72 {
    background-position: -129.6rem -28.8rem
}

/*! 동양 */

.logo-bank050556.w16,
.logo-kcb20518.w16,
.logo-kcis6556.w16 {
    background-position: -28.8rem -9.6rem
}

.logo-bank050556.w20,
.logo-kcb20518.w20,
.logo-kcis6556.w20 {
    background-position: -36rem -12rem
}

.logo-bank050556.w22,
.logo-kcb20518.w22,
.logo-kcis6556.w22 {
    background-position: -39.6rem -13.2rem
}

.logo-bank050556.w24,
.logo-kcb20518.w24,
.logo-kcis6556.w24 {
    background-position: -43.2rem -14.4rem
}

.logo-bank050556.w28,
.logo-kcb20518.w28,
.logo-kcis6556.w28 {
    background-position: -50.4rem -16.8rem
}

.logo-bank050556.w30,
.logo-kcb20518.w30,
.logo-kcis6556.w30 {
    background-position: -54rem -18rem
}

.logo-bank050556.w32,
.logo-kcb20518.w32,
.logo-kcis6556.w32 {
    background-position: -57.6rem -19.2rem
}

.logo-bank050556.w34,
.logo-kcb20518.w34,
.logo-kcis6556.w34 {
    background-position: -61.2rem -20.4rem
}

.logo-bank050556.w36,
.logo-kcb20518.w36,
.logo-kcis6556.w36 {
    background-position: -64.8rem -21.6rem
}

.logo-bank050556.w40,
.logo-kcb20518.w40,
.logo-kcis6556.w40 {
    background-position: -72rem -24rem
}

.logo-bank050556.w44,
.logo-kcb20518.w44,
.logo-kcis6556.w44 {
    background-position: -79.2rem -26.4rem
}

.logo-bank050556.w50,
.logo-kcb20518.w50,
.logo-kcis6556.w50 {
    background-position: -90rem -30rem
}

.logo-bank050556.w52,
.logo-kcb20518.w52,
.logo-kcis6556.w52 {
    background-position: -93.6rem -31.2rem
}

.logo-bank050556.w60,
.logo-kcb20518.w60,
.logo-kcis6556.w60 {
    background-position: -108rem -36rem
}

.logo-bank050556.w64,
.logo-kcb20518.w64,
.logo-kcis6556.w64 {
    background-position: -115.2rem -38.4rem
}

.logo-bank050556.w65,
.logo-kcb20518.w65,
.logo-kcis6556.w65 {
    background-position: -117rem -39rem
}

.logo-bank050556.w72,
.logo-kcb20518.w72,
.logo-kcis6556.w72 {
    background-position: -129.6rem -43.2rem
}

/*! 더블 */

.logo-bank050557.w16,
.logo-kcb20519.w16,
.logo-kcis6557.w16 {
    background-position: -28.8rem -12.8rem
}

.logo-bank050557.w20,
.logo-kcb20519.w20,
.logo-kcis6557.w20 {
    background-position: -36rem -16rem
}

.logo-bank050557.w22,
.logo-kcb20519.w22,
.logo-kcis6557.w22 {
    background-position: -39.6rem -17.6rem
}

.logo-bank050557.w24,
.logo-kcb20519.w24,
.logo-kcis6557.w24 {
    background-position: -43.2rem -19.2rem
}

.logo-bank050557.w28,
.logo-kcb20519.w28,
.logo-kcis6557.w28 {
    background-position: -50.4rem -22.4rem
}

.logo-bank050557.w30,
.logo-kcb20519.w30,
.logo-kcis6557.w30 {
    background-position: -54rem -24rem
}

.logo-bank050557.w32,
.logo-kcb20519.w32,
.logo-kcis6557.w32 {
    background-position: -57.6rem -25.6rem
}

.logo-bank050557.w34,
.logo-kcb20519.w34,
.logo-kcis6557.w34 {
    background-position: -61.2rem -27.2rem
}

.logo-bank050557.w36,
.logo-kcb20519.w36,
.logo-kcis6557.w36 {
    background-position: -64.8rem -28.8rem
}

.logo-bank050557.w40,
.logo-kcb20519.w40,
.logo-kcis6557.w40 {
    background-position: -72rem -32rem
}

.logo-bank050557.w44,
.logo-kcb20519.w44,
.logo-kcis6557.w44 {
    background-position: -79.2rem -35.2rem
}

.logo-bank050557.w50,
.logo-kcb20519.w50,
.logo-kcis6557.w50 {
    background-position: -90rem -40rem
}

.logo-bank050557.w52,
.logo-kcb20519.w52,
.logo-kcis6557.w52 {
    background-position: -93.6rem -41.6rem
}

.logo-bank050557.w60,
.logo-kcb20519.w60,
.logo-kcis6557.w60 {
    background-position: -108rem -48rem
}

.logo-bank050557.w64,
.logo-kcb20519.w64,
.logo-kcis6557.w64 {
    background-position: -115.2rem -51.2rem
}

.logo-bank050557.w65,
.logo-kcb20519.w65,
.logo-kcis6557.w65 {
    background-position: -117rem -52rem
}

.logo-bank050557.w72,
.logo-kcb20519.w72,
.logo-kcis6557.w72 {
    background-position: -129.6rem -57.6rem
}

/*! 센트럴 */

.logo-bank050565.w16,
.logo-kcis6565.w16 {
    background-position: -28.8rem -16rem
}

.logo-bank050565.w20,
.logo-kcis6565.w20 {
    background-position: -36rem -20rem
}

.logo-bank050565.w22,
.logo-kcis6565.w22 {
    background-position: -39.6rem -22rem
}

.logo-bank050565.w24,
.logo-kcis6565.w24 {
    background-position: -43.2rem -24rem
}

.logo-bank050565.w28,
.logo-kcis6565.w28 {
    background-position: -50.4rem -28rem
}

.logo-bank050565.w30,
.logo-kcis6565.w30 {
    background-position: -54rem -30rem
}

.logo-bank050565.w32,
.logo-kcis6565.w32 {
    background-position: -57.6rem -32rem
}

.logo-bank050565.w34,
.logo-kcis6565.w34 {
    background-position: -61.2rem -34rem
}

.logo-bank050565.w36,
.logo-kcis6565.w36 {
    background-position: -64.8rem -36rem
}

.logo-bank050565.w40,
.logo-kcis6565.w40 {
    background-position: -72rem -40rem
}

.logo-bank050565.w44,
.logo-kcis6565.w44 {
    background-position: -79.2rem -44rem
}

.logo-bank050565.w50,
.logo-kcis6565.w50 {
    background-position: -90rem -50rem
}

.logo-bank050565.w52,
.logo-kcis6565.w52 {
    background-position: -93.6rem -52rem
}

.logo-bank050565.w60,
.logo-kcis6565.w60 {
    background-position: -108rem -60rem
}

.logo-bank050565.w64,
.logo-kcis6565.w64 {
    background-position: -115.2rem -64rem
}

.logo-bank050565.w65,
.logo-kcis6565.w65 {
    background-position: -117rem -65rem
}

.logo-bank050565.w72,
.logo-kcis6565.w72 {
    background-position: -129.6rem -72rem
}

/*! 스마트 */

.logo-bank050566.w16,
.logo-kcb20537.w16,
.logo-kcis6566.w16 {
    background-position: -28.8rem -19.2rem
}

.logo-bank050566.w20,
.logo-kcb20537.w20,
.logo-kcis6566.w20 {
    background-position: -36rem -24rem
}

.logo-bank050566.w22,
.logo-kcb20537.w22,
.logo-kcis6566.w22 {
    background-position: -39.6rem -26.4rem
}

.logo-bank050566.w24,
.logo-kcb20537.w24,
.logo-kcis6566.w24 {
    background-position: -43.2rem -28.8rem
}

.logo-bank050566.w28,
.logo-kcb20537.w28,
.logo-kcis6566.w28 {
    background-position: -50.4rem -33.6rem
}

.logo-bank050566.w30,
.logo-kcb20537.w30,
.logo-kcis6566.w30 {
    background-position: -54rem -36rem
}

.logo-bank050566.w32,
.logo-kcb20537.w32,
.logo-kcis6566.w32 {
    background-position: -57.6rem -38.4rem
}

.logo-bank050566.w34,
.logo-kcb20537.w34,
.logo-kcis6566.w34 {
    background-position: -61.2rem -40.8rem
}

.logo-bank050566.w36,
.logo-kcb20537.w36,
.logo-kcis6566.w36 {
    background-position: -64.8rem -43.2rem
}

.logo-bank050566.w40,
.logo-kcb20537.w40,
.logo-kcis6566.w40 {
    background-position: -72rem -48rem
}

.logo-bank050566.w44,
.logo-kcb20537.w44,
.logo-kcis6566.w44 {
    background-position: -79.2rem -52.8rem
}

.logo-bank050566.w50,
.logo-kcb20537.w50,
.logo-kcis6566.w50 {
    background-position: -90rem -60rem
}

.logo-bank050566.w52,
.logo-kcb20537.w52,
.logo-kcis6566.w52 {
    background-position: -93.6rem -62.4rem
}

.logo-bank050566.w60,
.logo-kcb20537.w60,
.logo-kcis6566.w60 {
    background-position: -108rem -72rem
}

.logo-bank050566.w64,
.logo-kcb20537.w64,
.logo-kcis6566.w64 {
    background-position: -115.2rem -76.8rem
}

.logo-bank050566.w65,
.logo-kcb20537.w65,
.logo-kcis6566.w65 {
    background-position: -117rem -78rem
}

.logo-bank050566.w72,
.logo-kcb20537.w72,
.logo-kcis6566.w72 {
    background-position: -129.6rem -86.4rem
}

/*! 라온 */

.logo-bank050604.w16,
.logo-kcis6604.w16 {
    background-position: -28.8rem -22.4rem
}

.logo-bank050604.w20,
.logo-kcis6604.w20 {
    background-position: -36rem -28rem
}

.logo-bank050604.w22,
.logo-kcis6604.w22 {
    background-position: -39.6rem -30.8rem
}

.logo-bank050604.w24,
.logo-kcis6604.w24 {
    background-position: -43.2rem -33.6rem
}

.logo-bank050604.w28,
.logo-kcis6604.w28 {
    background-position: -50.4rem -39.2rem
}

.logo-bank050604.w30,
.logo-kcis6604.w30 {
    background-position: -54rem -42rem
}

.logo-bank050604.w32,
.logo-kcis6604.w32 {
    background-position: -57.6rem -44.8rem
}

.logo-bank050604.w34,
.logo-kcis6604.w34 {
    background-position: -61.2rem -47.6rem
}

.logo-bank050604.w36,
.logo-kcis6604.w36 {
    background-position: -64.8rem -50.4rem
}

.logo-bank050604.w40,
.logo-kcis6604.w40 {
    background-position: -72rem -56rem
}

.logo-bank050604.w44,
.logo-kcis6604.w44 {
    background-position: -79.2rem -61.6rem
}

.logo-bank050604.w50,
.logo-kcis6604.w50 {
    background-position: -90rem -70rem
}

.logo-bank050604.w52,
.logo-kcis6604.w52 {
    background-position: -93.6rem -72.8rem
}

.logo-bank050604.w60,
.logo-kcis6604.w60 {
    background-position: -108rem -84rem
}

.logo-bank050604.w64,
.logo-kcis6604.w64 {
    background-position: -115.2rem -89.6rem
}

.logo-bank050604.w65,
.logo-kcis6604.w65 {
    background-position: -117rem -91rem
}

.logo-bank050604.w72,
.logo-kcis6604.w72 {
    background-position: -129.6rem -100.8rem
}

/*! 드림 */

.logo-bank050605.w16,
.logo-kcb20526.w16,
.logo-kcis6605.w16 {
    background-position: -28.8rem -25.6rem
}

.logo-bank050605.w20,
.logo-kcb20526.w20,
.logo-kcis6605.w20 {
    background-position: -36rem -32rem
}

.logo-bank050605.w22,
.logo-kcb20526.w22,
.logo-kcis6605.w22 {
    background-position: -39.6rem -35.2rem
}

.logo-bank050605.w24,
.logo-kcb20526.w24,
.logo-kcis6605.w24 {
    background-position: -43.2rem -38.4rem
}

.logo-bank050605.w28,
.logo-kcb20526.w28,
.logo-kcis6605.w28 {
    background-position: -50.4rem -44.8rem
}

.logo-bank050605.w30,
.logo-kcb20526.w30,
.logo-kcis6605.w30 {
    background-position: -54rem -48rem
}

.logo-bank050605.w32,
.logo-kcb20526.w32,
.logo-kcis6605.w32 {
    background-position: -57.6rem -51.2rem
}

.logo-bank050605.w34,
.logo-kcb20526.w34,
.logo-kcis6605.w34 {
    background-position: -61.2rem -54.4rem
}

.logo-bank050605.w36,
.logo-kcb20526.w36,
.logo-kcis6605.w36 {
    background-position: -64.8rem -57.6rem
}

.logo-bank050605.w40,
.logo-kcb20526.w40,
.logo-kcis6605.w40 {
    background-position: -72rem -64rem
}

.logo-bank050605.w44,
.logo-kcb20526.w44,
.logo-kcis6605.w44 {
    background-position: -79.2rem -70.4rem
}

.logo-bank050605.w50,
.logo-kcb20526.w50,
.logo-kcis6605.w50 {
    background-position: -90rem -80rem
}

.logo-bank050605.w52,
.logo-kcb20526.w52,
.logo-kcis6605.w52 {
    background-position: -93.6rem -83.2rem
}

.logo-bank050605.w60,
.logo-kcb20526.w60,
.logo-kcis6605.w60 {
    background-position: -108rem -96rem
}

.logo-bank050605.w64,
.logo-kcb20526.w64,
.logo-kcis6605.w64 {
    background-position: -115.2rem -102.4rem
}

.logo-bank050605.w65,
.logo-kcb20526.w65,
.logo-kcis6605.w65 {
    background-position: -117rem -104rem
}

.logo-bank050605.w72,
.logo-kcb20526.w72,
.logo-kcis6605.w72 {
    background-position: -129.6rem -115.2rem
}

/*! 대아 */

.logo-bank050607.w16,
.logo-kcis6607.w16 {
    background-position: 0 -28.8rem
}

.logo-bank050607.w20,
.logo-kcis6607.w20 {
    background-position: 0 -36rem
}

.logo-bank050607.w22,
.logo-kcis6607.w22 {
    background-position: 0 -39.6rem
}

.logo-bank050607.w24,
.logo-kcis6607.w24 {
    background-position: 0 -43.2rem
}

.logo-bank050607.w28,
.logo-kcis6607.w28 {
    background-position: 0 -50.4rem
}

.logo-bank050607.w30,
.logo-kcis6607.w30 {
    background-position: 0 -54rem
}

.logo-bank050607.w32,
.logo-kcis6607.w32 {
    background-position: 0 -57.6rem
}

.logo-bank050607.w34,
.logo-kcis6607.w34 {
    background-position: 0 -61.2rem
}

.logo-bank050607.w36,
.logo-kcis6607.w36 {
    background-position: 0 -64.8rem
}

.logo-bank050607.w40,
.logo-kcis6607.w40 {
    background-position: 0 -72rem
}

.logo-bank050607.w44,
.logo-kcis6607.w44 {
    background-position: 0 -79.2rem
}

.logo-bank050607.w50,
.logo-kcis6607.w50 {
    background-position: 0 -90rem
}

.logo-bank050607.w52,
.logo-kcis6607.w52 {
    background-position: 0 -93.6rem
}

.logo-bank050607.w60,
.logo-kcis6607.w60 {
    background-position: 0 -108rem
}

.logo-bank050607.w64,
.logo-kcis6607.w64 {
    background-position: 0 -115.2rem
}

.logo-bank050607.w65,
.logo-kcis6607.w65 {
    background-position: 0 -117rem
}

.logo-bank050607.w72,
.logo-kcis6607.w72 {
    background-position: 0 -129.6rem
}

/*! 머스트삼일 */

.logo-bank050610.w16,
.logo-kcis6610.w16 {
    background-position: -3.2rem -28.8rem
}

.logo-bank050610.w20,
.logo-kcis6610.w20 {
    background-position: -4rem -36rem
}

.logo-bank050610.w22,
.logo-kcis6610.w22 {
    background-position: -4.4rem -39.6rem
}

.logo-bank050610.w24,
.logo-kcis6610.w24 {
    background-position: -4.8rem -43.2rem
}

.logo-bank050610.w28,
.logo-kcis6610.w28 {
    background-position: -5.6rem -50.4rem
}

.logo-bank050610.w30,
.logo-kcis6610.w30 {
    background-position: -6rem -54rem
}

.logo-bank050610.w32,
.logo-kcis6610.w32 {
    background-position: -6.4rem -57.6rem
}

.logo-bank050610.w34,
.logo-kcis6610.w34 {
    background-position: -6.8rem -61.2rem
}

.logo-bank050610.w36,
.logo-kcis6610.w36 {
    background-position: -7.2rem -64.8rem
}

.logo-bank050610.w40,
.logo-kcis6610.w40 {
    background-position: -8rem -72rem
}

.logo-bank050610.w44,
.logo-kcis6610.w44 {
    background-position: -8.8rem -79.2rem
}

.logo-bank050610.w50,
.logo-kcis6610.w50 {
    background-position: -10rem -90rem
}

.logo-bank050610.w52,
.logo-kcis6610.w52 {
    background-position: -10.4rem -93.6rem
}

.logo-bank050610.w60,
.logo-kcis6610.w60 {
    background-position: -12rem -108rem
}

.logo-bank050610.w64,
.logo-kcis6610.w64 {
    background-position: -12.8rem -115.2rem
}

.logo-bank050610.w65,
.logo-kcis6610.w65 {
    background-position: -13rem -117rem
}

.logo-bank050610.w72,
.logo-kcis6610.w72 {
    background-position: -14.4rem -129.6rem
}

/*! 참 */

.logo-bank050614.w16,
.logo-kcb20516.w16,
.logo-kcis6614.w16 {
    background-position: -6.4rem -28.8rem
}

.logo-bank050614.w20,
.logo-kcb20516.w20,
.logo-kcis6614.w20 {
    background-position: -8rem -36rem
}

.logo-bank050614.w22,
.logo-kcb20516.w22,
.logo-kcis6614.w22 {
    background-position: -8.8rem -39.6rem
}

.logo-bank050614.w24,
.logo-kcb20516.w24,
.logo-kcis6614.w24 {
    background-position: -9.6rem -43.2rem
}

.logo-bank050614.w28,
.logo-kcb20516.w28,
.logo-kcis6614.w28 {
    background-position: -11.2rem -50.4rem
}

.logo-bank050614.w30,
.logo-kcb20516.w30,
.logo-kcis6614.w30 {
    background-position: -12rem -54rem
}

.logo-bank050614.w32,
.logo-kcb20516.w32,
.logo-kcis6614.w32 {
    background-position: -12.8rem -57.6rem
}

.logo-bank050614.w34,
.logo-kcb20516.w34,
.logo-kcis6614.w34 {
    background-position: -13.6rem -61.2rem
}

.logo-bank050614.w36,
.logo-kcb20516.w36,
.logo-kcis6614.w36 {
    background-position: -14.4rem -64.8rem
}

.logo-bank050614.w40,
.logo-kcb20516.w40,
.logo-kcis6614.w40 {
    background-position: -16rem -72rem
}

.logo-bank050614.w44,
.logo-kcb20516.w44,
.logo-kcis6614.w44 {
    background-position: -17.6rem -79.2rem
}

.logo-bank050614.w50,
.logo-kcb20516.w50,
.logo-kcis6614.w50 {
    background-position: -20rem -90rem
}

.logo-bank050614.w52,
.logo-kcb20516.w52,
.logo-kcis6614.w52 {
    background-position: -20.8rem -93.6rem
}

.logo-bank050614.w60,
.logo-kcb20516.w60,
.logo-kcis6614.w60 {
    background-position: -24rem -108rem
}

.logo-bank050614.w64,
.logo-kcb20516.w64,
.logo-kcis6614.w64 {
    background-position: -25.6rem -115.2rem
}

.logo-bank050614.w65,
.logo-kcb20516.w65,
.logo-kcis6614.w65 {
    background-position: -26rem -117rem
}

.logo-bank050614.w72,
.logo-kcb20516.w72,
.logo-kcis6614.w72 {
    background-position: -28.8rem -129.6rem
}

/*! 오성 */

.logo-bank050616.w16,
.logo-kcis6616.w16 {
    background-position: -9.6rem -28.8rem
}

.logo-bank050616.w20,
.logo-kcis6616.w20 {
    background-position: -12rem -36rem
}

.logo-bank050616.w22,
.logo-kcis6616.w22 {
    background-position: -13.2rem -39.6rem
}

.logo-bank050616.w24,
.logo-kcis6616.w24 {
    background-position: -14.4rem -43.2rem
}

.logo-bank050616.w28,
.logo-kcis6616.w28 {
    background-position: -16.8rem -50.4rem
}

.logo-bank050616.w30,
.logo-kcis6616.w30 {
    background-position: -18rem -54rem
}

.logo-bank050616.w32,
.logo-kcis6616.w32 {
    background-position: -19.2rem -57.6rem
}

.logo-bank050616.w34,
.logo-kcis6616.w34 {
    background-position: -20.4rem -61.2rem
}

.logo-bank050616.w36,
.logo-kcis6616.w36 {
    background-position: -21.6rem -64.8rem
}

.logo-bank050616.w40,
.logo-kcis6616.w40 {
    background-position: -24rem -72rem
}

.logo-bank050616.w44,
.logo-kcis6616.w44 {
    background-position: -26.4rem -79.2rem
}

.logo-bank050616.w50,
.logo-kcis6616.w50 {
    background-position: -30rem -90rem
}

.logo-bank050616.w52,
.logo-kcis6616.w52 {
    background-position: -31.2rem -93.6rem
}

.logo-bank050616.w60,
.logo-kcis6616.w60 {
    background-position: -36rem -108rem
}

.logo-bank050616.w64,
.logo-kcis6616.w64 {
    background-position: -38.4rem -115.2rem
}

.logo-bank050616.w65,
.logo-kcis6616.w65 {
    background-position: -39rem -117rem
}

.logo-bank050616.w72,
.logo-kcis6616.w72 {
    background-position: -43.2rem -129.6rem
}

/*! 대원 */

.logo-bank050617.w16,
.logo-kcis6617.w16 {
    background-position: -12.8rem -28.8rem
}

.logo-bank050617.w20,
.logo-kcis6617.w20 {
    background-position: -16rem -36rem
}

.logo-bank050617.w22,
.logo-kcis6617.w22 {
    background-position: -17.6rem -39.6rem
}

.logo-bank050617.w24,
.logo-kcis6617.w24 {
    background-position: -19.2rem -43.2rem
}

.logo-bank050617.w28,
.logo-kcis6617.w28 {
    background-position: -22.4rem -50.4rem
}

.logo-bank050617.w30,
.logo-kcis6617.w30 {
    background-position: -24rem -54rem
}

.logo-bank050617.w32,
.logo-kcis6617.w32 {
    background-position: -25.6rem -57.6rem
}

.logo-bank050617.w34,
.logo-kcis6617.w34 {
    background-position: -27.2rem -61.2rem
}

.logo-bank050617.w36,
.logo-kcis6617.w36 {
    background-position: -28.8rem -64.8rem
}

.logo-bank050617.w40,
.logo-kcis6617.w40 {
    background-position: -32rem -72rem
}

.logo-bank050617.w44,
.logo-kcis6617.w44 {
    background-position: -35.2rem -79.2rem
}

.logo-bank050617.w50,
.logo-kcis6617.w50 {
    background-position: -40rem -90rem
}

.logo-bank050617.w52,
.logo-kcis6617.w52 {
    background-position: -41.6rem -93.6rem
}

.logo-bank050617.w60,
.logo-kcis6617.w60 {
    background-position: -48rem -108rem
}

.logo-bank050617.w64,
.logo-kcis6617.w64 {
    background-position: -51.2rem -115.2rem
}

.logo-bank050617.w65,
.logo-kcis6617.w65 {
    background-position: -52rem -117rem
}

.logo-bank050617.w72,
.logo-kcis6617.w72 {
    background-position: -57.6rem -129.6rem
}

/*! IBK */

.logo-bank050650.w16,
.logo-kcis6050.w16 {
    background-position: -16rem -28.8rem
}

.logo-bank050650.w20,
.logo-kcis6050.w20 {
    background-position: -20rem -36rem
}

.logo-bank050650.w22,
.logo-kcis6050.w22 {
    background-position: -22rem -39.6rem
}

.logo-bank050650.w24,
.logo-kcis6050.w24 {
    background-position: -24rem -43.2rem
}

.logo-bank050650.w28,
.logo-kcis6050.w28 {
    background-position: -28rem -50.4rem
}

.logo-bank050650.w30,
.logo-kcis6050.w30 {
    background-position: -30rem -54rem
}

.logo-bank050650.w32,
.logo-kcis6050.w32 {
    background-position: -32rem -57.6rem
}

.logo-bank050650.w34,
.logo-kcis6050.w34 {
    background-position: -34rem -61.2rem
}

.logo-bank050650.w36,
.logo-kcis6050.w36 {
    background-position: -36rem -64.8rem
}

.logo-bank050650.w40,
.logo-kcis6050.w40 {
    background-position: -40rem -72rem
}

.logo-bank050650.w44,
.logo-kcis6050.w44 {
    background-position: -44rem -79.2rem
}

.logo-bank050650.w50,
.logo-kcis6050.w50 {
    background-position: -50rem -90rem
}

.logo-bank050650.w52,
.logo-kcis6050.w52 {
    background-position: -52rem -93.6rem
}

.logo-bank050650.w60,
.logo-kcis6050.w60 {
    background-position: -60rem -108rem
}

.logo-bank050650.w64,
.logo-kcis6050.w64 {
    background-position: -64rem -115.2rem
}

.logo-bank050650.w65,
.logo-kcis6050.w65 {
    background-position: -65rem -117rem
}

.logo-bank050650.w72,
.logo-kcis6050.w72 {
    background-position: -72rem -129.6rem
}

/*! 에스앤티 */

.logo-bank050651.w16,
.logo-kcb20546.w16,
.logo-kcis6651.w16 {
    background-position: -19.2rem -28.8rem
}

.logo-bank050651.w20,
.logo-kcb20546.w20,
.logo-kcis6651.w20 {
    background-position: -24rem -36rem
}

.logo-bank050651.w22,
.logo-kcb20546.w22,
.logo-kcis6651.w22 {
    background-position: -26.4rem -39.6rem
}

.logo-bank050651.w24,
.logo-kcb20546.w24,
.logo-kcis6651.w24 {
    background-position: -28.8rem -43.2rem
}

.logo-bank050651.w28,
.logo-kcb20546.w28,
.logo-kcis6651.w28 {
    background-position: -33.6rem -50.4rem
}

.logo-bank050651.w30,
.logo-kcb20546.w30,
.logo-kcis6651.w30 {
    background-position: -36rem -54rem
}

.logo-bank050651.w32,
.logo-kcb20546.w32,
.logo-kcis6651.w32 {
    background-position: -38.4rem -57.6rem
}

.logo-bank050651.w34,
.logo-kcb20546.w34,
.logo-kcis6651.w34 {
    background-position: -40.8rem -61.2rem
}

.logo-bank050651.w36,
.logo-kcb20546.w36,
.logo-kcis6651.w36 {
    background-position: -43.2rem -64.8rem
}

.logo-bank050651.w40,
.logo-kcb20546.w40,
.logo-kcis6651.w40 {
    background-position: -48rem -72rem
}

.logo-bank050651.w44,
.logo-kcb20546.w44,
.logo-kcis6651.w44 {
    background-position: -52.8rem -79.2rem
}

.logo-bank050651.w50,
.logo-kcb20546.w50,
.logo-kcis6651.w50 {
    background-position: -60rem -90rem
}

.logo-bank050651.w52,
.logo-kcb20546.w52,
.logo-kcis6651.w52 {
    background-position: -62.4rem -93.6rem
}

.logo-bank050651.w60,
.logo-kcb20546.w60,
.logo-kcis6651.w60 {
    background-position: -72rem -108rem
}

.logo-bank050651.w64,
.logo-kcb20546.w64,
.logo-kcis6651.w64 {
    background-position: -76.8rem -115.2rem
}

.logo-bank050651.w65,
.logo-kcb20546.w65,
.logo-kcis6651.w65 {
    background-position: -78rem -117rem
}

.logo-bank050651.w72,
.logo-kcb20546.w72,
.logo-kcis6651.w72 {
    background-position: -86.4rem -129.6rem
}

/*! 솔브레인 */

.logo-bank050654.w16,
.logo-kcis6654.w16 {
    background-position: -22.4rem -28.8rem
}

.logo-bank050654.w20,
.logo-kcis6654.w20 {
    background-position: -28rem -36rem
}

.logo-bank050654.w22,
.logo-kcis6654.w22 {
    background-position: -30.8rem -39.6rem
}

.logo-bank050654.w24,
.logo-kcis6654.w24 {
    background-position: -33.6rem -43.2rem
}

.logo-bank050654.w28,
.logo-kcis6654.w28 {
    background-position: -39.2rem -50.4rem
}

.logo-bank050654.w30,
.logo-kcis6654.w30 {
    background-position: -42rem -54rem
}

.logo-bank050654.w32,
.logo-kcis6654.w32 {
    background-position: -44.8rem -57.6rem
}

.logo-bank050654.w34,
.logo-kcis6654.w34 {
    background-position: -47.6rem -61.2rem
}

.logo-bank050654.w36,
.logo-kcis6654.w36 {
    background-position: -50.4rem -64.8rem
}

.logo-bank050654.w40,
.logo-kcis6654.w40 {
    background-position: -56rem -72rem
}

.logo-bank050654.w44,
.logo-kcis6654.w44 {
    background-position: -61.6rem -79.2rem
}

.logo-bank050654.w50,
.logo-kcis6654.w50 {
    background-position: -70rem -90rem
}

.logo-bank050654.w52,
.logo-kcis6654.w52 {
    background-position: -72.8rem -93.6rem
}

.logo-bank050654.w60,
.logo-kcis6654.w60 {
    background-position: -84rem -108rem
}

.logo-bank050654.w64,
.logo-kcis6654.w64 {
    background-position: -89.6rem -115.2rem
}

.logo-bank050654.w65,
.logo-kcis6654.w65 {
    background-position: -91rem -117rem
}

.logo-bank050654.w72,
.logo-kcis6654.w72 {
    background-position: -100.8rem -129.6rem
}

/*! 동원제일 */

.logo-bank050656.w16,
.logo-kcb20511.w16,
.logo-kcis6656.w16 {
    background-position: -25.6rem -28.8rem
}

.logo-bank050656.w20,
.logo-kcb20511.w20,
.logo-kcis6656.w20 {
    background-position: -32rem -36rem
}

.logo-bank050656.w22,
.logo-kcb20511.w22,
.logo-kcis6656.w22 {
    background-position: -35.2rem -39.6rem
}

.logo-bank050656.w24,
.logo-kcb20511.w24,
.logo-kcis6656.w24 {
    background-position: -38.4rem -43.2rem
}

.logo-bank050656.w28,
.logo-kcb20511.w28,
.logo-kcis6656.w28 {
    background-position: -44.8rem -50.4rem
}

.logo-bank050656.w30,
.logo-kcb20511.w30,
.logo-kcis6656.w30 {
    background-position: -48rem -54rem
}

.logo-bank050656.w32,
.logo-kcb20511.w32,
.logo-kcis6656.w32 {
    background-position: -51.2rem -57.6rem
}

.logo-bank050656.w34,
.logo-kcb20511.w34,
.logo-kcis6656.w34 {
    background-position: -54.4rem -61.2rem
}

.logo-bank050656.w36,
.logo-kcb20511.w36,
.logo-kcis6656.w36 {
    background-position: -57.6rem -64.8rem
}

.logo-bank050656.w40,
.logo-kcb20511.w40,
.logo-kcis6656.w40 {
    background-position: -64rem -72rem
}

.logo-bank050656.w44,
.logo-kcb20511.w44,
.logo-kcis6656.w44 {
    background-position: -70.4rem -79.2rem
}

.logo-bank050656.w50,
.logo-kcb20511.w50,
.logo-kcis6656.w50 {
    background-position: -80rem -90rem
}

.logo-bank050656.w52,
.logo-kcb20511.w52,
.logo-kcis6656.w52 {
    background-position: -83.2rem -93.6rem
}

.logo-bank050656.w60,
.logo-kcb20511.w60,
.logo-kcis6656.w60 {
    background-position: -96rem -108rem
}

.logo-bank050656.w64,
.logo-kcb20511.w64,
.logo-kcis6656.w64 {
    background-position: -102.4rem -115.2rem
}

.logo-bank050656.w65,
.logo-kcb20511.w65,
.logo-kcis6656.w65 {
    background-position: -104rem -117rem
}

.logo-bank050656.w72,
.logo-kcb20511.w72,
.logo-kcis6656.w72 {
    background-position: -115.2rem -129.6rem
}

/*! 조흥 */

.logo-bank050657.w16,
.logo-kcis6657.w16 {
    background-position: -28.8rem -28.8rem
}

.logo-bank050657.w20,
.logo-kcis6657.w20 {
    background-position: -36rem -36rem
}

.logo-bank050657.w22,
.logo-kcis6657.w22 {
    background-position: -39.6rem -39.6rem
}

.logo-bank050657.w24,
.logo-kcis6657.w24 {
    background-position: -43.2rem -43.2rem
}

.logo-bank050657.w28,
.logo-kcis6657.w28 {
    background-position: -50.4rem -50.4rem
}

.logo-bank050657.w30,
.logo-kcis6657.w30 {
    background-position: -54rem -54rem
}

.logo-bank050657.w32,
.logo-kcis6657.w32 {
    background-position: -57.6rem -57.6rem
}

.logo-bank050657.w34,
.logo-kcis6657.w34 {
    background-position: -61.2rem -61.2rem
}

.logo-bank050657.w36,
.logo-kcis6657.w36 {
    background-position: -64.8rem -64.8rem
}

.logo-bank050657.w40,
.logo-kcis6657.w40 {
    background-position: -72rem -72rem
}

.logo-bank050657.w44,
.logo-kcis6657.w44 {
    background-position: -79.2rem -79.2rem
}

.logo-bank050657.w50,
.logo-kcis6657.w50 {
    background-position: -90rem -90rem
}

.logo-bank050657.w52,
.logo-kcis6657.w52 {
    background-position: -93.6rem -93.6rem
}

.logo-bank050657.w60,
.logo-kcis6657.w60 {
    background-position: -108rem -108rem
}

.logo-bank050657.w64,
.logo-kcis6657.w64 {
    background-position: -115.2rem -115.2rem
}

.logo-bank050657.w65,
.logo-kcis6657.w65 {
    background-position: -117rem -117rem
}

.logo-bank050657.w72,
.logo-kcis6657.w72 {
    background-position: -129.6rem -129.6rem
}

/*! 진주 */

.logo-bank050658.w16,
.logo-kcb20536.w16,
.logo-kcis6658.w16 {
    background-position: -32rem 0
}

.logo-bank050658.w20,
.logo-kcb20536.w20,
.logo-kcis6658.w20 {
    background-position: -40rem 0
}

.logo-bank050658.w22,
.logo-kcb20536.w22,
.logo-kcis6658.w22 {
    background-position: -44rem 0
}

.logo-bank050658.w24,
.logo-kcb20536.w24,
.logo-kcis6658.w24 {
    background-position: -48rem 0
}

.logo-bank050658.w28,
.logo-kcb20536.w28,
.logo-kcis6658.w28 {
    background-position: -56rem 0
}

.logo-bank050658.w30,
.logo-kcb20536.w30,
.logo-kcis6658.w30 {
    background-position: -60rem 0
}

.logo-bank050658.w32,
.logo-kcb20536.w32,
.logo-kcis6658.w32 {
    background-position: -64rem 0
}

.logo-bank050658.w34,
.logo-kcb20536.w34,
.logo-kcis6658.w34 {
    background-position: -68rem 0
}

.logo-bank050658.w36,
.logo-kcb20536.w36,
.logo-kcis6658.w36 {
    background-position: -72rem 0
}

.logo-bank050658.w40,
.logo-kcb20536.w40,
.logo-kcis6658.w40 {
    background-position: -80rem 0
}

.logo-bank050658.w44,
.logo-kcb20536.w44,
.logo-kcis6658.w44 {
    background-position: -88rem 0
}

.logo-bank050658.w50,
.logo-kcb20536.w50,
.logo-kcis6658.w50 {
    background-position: -100rem 0
}

.logo-bank050658.w52,
.logo-kcb20536.w52,
.logo-kcis6658.w52 {
    background-position: -104rem 0
}

.logo-bank050658.w60,
.logo-kcb20536.w60,
.logo-kcis6658.w60 {
    background-position: -120rem 0
}

.logo-bank050658.w64,
.logo-kcb20536.w64,
.logo-kcis6658.w64 {
    background-position: -128rem 0
}

.logo-bank050658.w65,
.logo-kcb20536.w65,
.logo-kcis6658.w65 {
    background-position: -130rem 0
}

.logo-bank050658.w72,
.logo-kcb20536.w72,
.logo-kcis6658.w72 {
    background-position: -144rem 0
}

/*! etc */

.logo-bank000001.w16 {
    background-position: 0 0
}

.logo-bank000001.w20 {
    background-position: 0 0
}

.logo-bank000001.w22 {
    background-position: 0 0
}

.logo-bank000001.w24 {
    background-position: 0 0
}

.logo-bank000001.w28 {
    background-position: 0 0
}

.logo-bank000001.w30 {
    background-position: 0 0
}

.logo-bank000001.w32 {
    background-position: 0 0
}

.logo-bank000001.w34 {
    background-position: 0 0
}

.logo-bank000001.w36 {
    background-position: 0 0
}

.logo-bank000001.w40 {
    background-position: 0 0
}

.logo-bank000001.w44 {
    background-position: 0 0
}

.logo-bank000001.w50 {
    background-position: 0 0
}

.logo-bank000001.w52 {
    background-position: 0 0
}

.logo-bank000001.w60 {
    background-position: 0 0
}

.logo-bank000001.w64 {
    background-position: 0 0
}

.logo-bank000001.w65 {
    background-position: 0 0
}

.logo-bank000001.w72 {
    background-position: 0 0
}

.logo-banknone.w16 {
    background-position: 0 -44.8rem
}

.logo-banknone.w20 {
    background-position: 0 -56rem
}

.logo-banknone.w22 {
    background-position: 0 -61.6rem
}

.logo-banknone.w24 {
    background-position: 0 -67.2rem
}

.logo-banknone.w28 {
    background-position: 0 -78.4rem
}

.logo-banknone.w30 {
    background-position: 0 -84rem
}

.logo-banknone.w32 {
    background-position: 0 -89.6rem
}

.logo-banknone.w34 {
    background-position: 0 -95.2rem
}

.logo-banknone.w36 {
    background-position: 0 -100.8rem
}

.logo-banknone.w40 {
    background-position: 0 -112rem
}

.logo-banknone.w44 {
    background-position: 0 -123.2rem
}

.logo-banknone.w50 {
    background-position: 0 -140rem
}

.logo-banknone.w52 {
    background-position: 0 -145.6rem
}

.logo-banknone.w60 {
    background-position: 0 -168rem
}

.logo-banknone.w64 {
    background-position: 0 -179.2rem
}

.logo-banknone.w65 {
    background-position: 0 -182rem
}

.logo-banknone.w72 {
    background-position: 0 -201.6rem
}

/*! 로고없을경우 - 디폴트 */

.logo-contact.w16 {
    background-position: -19.2rem -44.8rem
}

.logo-contact.w20 {
    background-position: -24rem -56rem
}

.logo-contact.w22 {
    background-position: -26.4rem -61.6rem
}

.logo-contact.w24 {
    background-position: -28.8rem -67.2rem
}

.logo-contact.w28 {
    background-position: -33.6rem -78.4rem
}

.logo-contact.w30 {
    background-position: -36rem -84rem
}

.logo-contact.w32 {
    background-position: -38.4rem -89.6rem
}

.logo-contact.w34 {
    background-position: -40.8rem -95.2rem
}

.logo-contact.w36 {
    background-position: -43.2rem -100.8rem
}

.logo-contact.w40 {
    background-position: -48rem -112rem
}

.logo-contact.w44 {
    background-position: -52.8rem -123.2rem
}

.logo-contact.w50 {
    background-position: -60rem -140rem
}

.logo-contact.w52 {
    background-position: -62.4rem -145.6rem
}

.logo-contact.w60 {
    background-position: -72rem -168rem
}

.logo-contact.w64 {
    background-position: -76.8rem -179.2rem
}

.logo-contact.w65 {
    background-position: -78rem -182rem
}

.logo-contact.w72 {
    background-position: -86.4rem -201.6rem
}

.logo-more.w16 {
    background-position: -22.4rem -44.8rem
}

.logo-more.w20 {
    background-position: -28rem -56rem
}

.logo-more.w22 {
    background-position: -30.8rem -61.6rem
}

.logo-more.w24 {
    background-position: -33.6rem -67.2rem
}

.logo-more.w28 {
    background-position: -39.2rem -78.4rem
}

.logo-more.w30 {
    background-position: -42rem -84rem
}

.logo-more.w32 {
    background-position: -44.8rem -89.6rem
}

.logo-more.w34 {
    background-position: -47.6rem -95.2rem
}

.logo-more.w36 {
    background-position: -50.4rem -100.8rem
}

.logo-more.w40 {
    background-position: -56rem -112rem
}

.logo-more.w44 {
    background-position: -61.6rem -123.2rem
}

.logo-more.w50 {
    background-position: -70rem -140rem
}

.logo-more.w52 {
    background-position: -72.8rem -145.6rem
}

.logo-more.w60 {
    background-position: -84rem -168rem
}

.logo-more.w64 {
    background-position: -89.6rem -179.2rem
}

.logo-more.w65 {
    background-position: -91rem -182rem
}

.logo-more.w72 {
    background-position: -100.8rem -201.6rem
}

.logo-cert-nav.w16 {
    background-position: -16rem -44.8rem
}

.logo-cert-nav.w20 {
    background-position: -20rem -56rem
}

.logo-cert-nav.w22 {
    background-position: -22rem -61.6rem
}

.logo-cert-nav.w24 {
    background-position: -24rem -67.2rem
}

.logo-cert-nav.w28 {
    background-position: -28rem -78.4rem
}

.logo-cert-nav.w30 {
    background-position: -30rem -84rem
}

.logo-cert-nav.w32 {
    background-position: -32rem -89.6rem
}

.logo-cert-nav.w34 {
    background-position: -34rem -95.2rem
}

.logo-cert-nav.w36 {
    background-position: -36rem -100.8rem
}

.logo-cert-nav.w40 {
    background-position: -40rem -112rem
}

.logo-cert-nav.w44 {
    background-position: -44rem -123.2rem
}

.logo-cert-nav.w50 {
    background-position: -50rem -140rem
}

.logo-cert-nav.w52 {
    background-position: -52rem -145.6rem
}

.logo-cert-nav.w60 {
    background-position: -60rem -168rem
}

.logo-cert-nav.w64 {
    background-position: -64rem -179.2rem
}

.logo-cert-nav.w65 {
    background-position: -65rem -182rem
}

.logo-cert-nav.w72 {
    background-position: -72rem -201.6rem
}

.logo-msgr-sms.w16 {
    background-position: -25.6rem -44.8rem
}

.logo-msgr-sms.w20 {
    background-position: -32rem -56rem
}

.logo-msgr-sms.w22 {
    background-position: -35.2rem -61.6rem
}

.logo-msgr-sms.w24 {
    background-position: -38.4rem -67.2rem
}

.logo-msgr-sms.w28 {
    background-position: -44.8rem -78.4rem
}

.logo-msgr-sms.w30 {
    background-position: -48rem -84rem
}

.logo-msgr-sms.w32 {
    background-position: -51.2rem -89.6rem
}

.logo-msgr-sms.w34 {
    background-position: -54.4rem -95.2rem
}

.logo-msgr-sms.w36 {
    background-position: -57.6rem -100.8rem
}

.logo-msgr-sms.w40 {
    background-position: -64rem -112rem
}

.logo-msgr-sms.w44 {
    background-position: -70.4rem -123.2rem
}

.logo-msgr-sms.w50 {
    background-position: -80rem -140rem
}

.logo-msgr-sms.w52 {
    background-position: -83.2rem -145.6rem
}

.logo-msgr-sms.w60 {
    background-position: -96rem -168rem
}

.logo-msgr-sms.w64 {
    background-position: -102.4rem -179.2rem
}

.logo-msgr-sms.w65 {
    background-position: -104rem -182rem
}

.logo-msgr-sms.w72 {
    background-position: -115.2rem -201.6rem
}

/*! CHPFMTASK-705 [KDS] 99_asset 동기화 2024-03-14 by pko */

/*! component element icon sprite 연계대출 기관로고 - circle SR-2043 */

[class*="logo-partnerloan"] {
    display: inline-block;
    overflow: hidden;
    border-radius: 50%;
    position: relative
}

[class*="logo-partnerloan"].w20 {
    background-image: url(../../img/mmk/common/sprite_logo_partnerloan.png?timestamp=1728263860983);
    width: 2rem;
    height: 2rem;
    background-size: 21.81818rem 16.86364rem
}

[class*="logo-partnerloan"].w22 {
    background-image: url(../../img/mmk/common/sprite_logo_partnerloan.png?timestamp=1728263860983);
    width: 2.2rem;
    height: 2.2rem;
    background-size: 24rem 18.55rem
}

[class*="logo-partnerloan"].w24 {
    background-image: url(../../img/mmk/common/sprite_logo_partnerloan.png?timestamp=1728263860983);
    width: 2.4rem;
    height: 2.4rem;
    background-size: 26.18182rem 20.23636rem
}

[class*="logo-partnerloan"].w34 {
    background-image: url(../../img/mmk/common/sprite_logo_partnerloan.png?timestamp=1728263860983);
    width: 3.4rem;
    height: 3.4rem;
    background-size: 37.09091rem 28.66818rem
}

[class*="logo-partnerloan"].w44 {
    background-image: url(../../img/mmk/common/sprite_logo_partnerloan.png?timestamp=1728263860983);
    width: 4.4rem;
    height: 4.4rem;
    background-size: 48rem 37.1rem
}

[class*="logo-partnerloan"].w60 {
    background-image: url(../../img/mmk/common/sprite_logo_partnerloan.png?timestamp=1728263860983);
    width: 6rem;
    height: 6rem;
    background-size: 65.45455rem 50.59091rem
}

[class*="logo-partnerloan"].w65 {
    background-image: url(../../img/mmk/common/sprite_logo_partnerloan.png?timestamp=1728263860983);
    width: 6.5rem;
    height: 6.5rem;
    background-size: 70.90909rem 54.80682rem
}

[class*="logo-partnerloan"].w72 {
    background-image: url(../../img/mmk/common/sprite_logo_partnerloan.png?timestamp=1728263860983);
    width: 7.2rem;
    height: 7.2rem;
    background-size: 78.54545rem 60.70909rem
}

[class*="logo-partnerloan"].w20 {
    background-position: -4.95455rem -14.86364rem
}

[class*="logo-partnerloan"].w22 {
    background-position: -5.45rem -16.35rem
}

[class*="logo-partnerloan"].w24 {
    background-position: -5.94545rem -17.83636rem
}

[class*="logo-partnerloan"].w34 {
    background-position: -8.42273rem -25.26818rem
}

[class*="logo-partnerloan"].w44 {
    background-position: -10.9rem -32.7rem
}

[class*="logo-partnerloan"].w60 {
    background-position: -14.86364rem -44.59091rem
}

[class*="logo-partnerloan"].w65 {
    background-position: -16.10227rem -48.30682rem
}

[class*="logo-partnerloan"].w72 {
    background-position: -17.83636rem -53.50909rem
}

.card-group .card-header .card-img-figure [class*="logo-partnerloan"] {
    margin-right: 1.2rem
}

/*! noimg */

.logo-partnerloan-none.w20 {
    background-position: -4.95455rem -14.86364rem
}

.logo-partnerloan-none.w22 {
    background-position: -5.45rem -16.35rem
}

.logo-partnerloan-none.w24 {
    background-position: -5.94545rem -17.83636rem
}

.logo-partnerloan-none.w34 {
    background-position: -8.42273rem -25.26818rem
}

.logo-partnerloan-none.w44 {
    background-position: -10.9rem -32.7rem
}

.logo-partnerloan-none.w60 {
    background-position: -14.86364rem -44.59091rem
}

.logo-partnerloan-none.w65 {
    background-position: -16.10227rem -48.30682rem
}

.logo-partnerloan-none.w72 {
    background-position: -17.83636rem -53.50909rem
}

/*! 렌딧 */

.logo-partnerloan-LDT.w20 {
    background-position: -14.86364rem -4.95455rem
}

.logo-partnerloan-LDT.w22 {
    background-position: -16.35rem -5.45rem
}

.logo-partnerloan-LDT.w24 {
    background-position: -17.83636rem -5.94545rem
}

.logo-partnerloan-LDT.w34 {
    background-position: -25.26818rem -8.42273rem
}

.logo-partnerloan-LDT.w44 {
    background-position: -32.7rem -10.9rem
}

.logo-partnerloan-LDT.w60 {
    background-position: -44.59091rem -14.86364rem
}

.logo-partnerloan-LDT.w65 {
    background-position: -48.30682rem -16.10227rem
}

.logo-partnerloan-LDT.w72 {
    background-position: -53.50909rem -17.83636rem
}

/*! 애큐온캐피탈 */

/*! BC카드 */

.logo-partnerloan-BCC.w20 {
    background-position: 0 0
}

.logo-partnerloan-BCC.w22 {
    background-position: 0 0
}

.logo-partnerloan-BCC.w24 {
    background-position: 0 0
}

.logo-partnerloan-BCC.w34 {
    background-position: 0 0
}

.logo-partnerloan-BCC.w44 {
    background-position: 0 0
}

.logo-partnerloan-BCC.w60 {
    background-position: 0 0
}

.logo-partnerloan-BCC.w65 {
    background-position: 0 0
}

.logo-partnerloan-BCC.w72 {
    background-position: 0 0
}

/*! BNK캐피탈 */

.logo-partnerloan-BNC.w20 {
    background-position: -4.95455rem 0
}

.logo-partnerloan-BNC.w22 {
    background-position: -5.45rem 0
}

.logo-partnerloan-BNC.w24 {
    background-position: -5.94545rem 0
}

.logo-partnerloan-BNC.w34 {
    background-position: -8.42273rem 0
}

.logo-partnerloan-BNC.w44 {
    background-position: -10.9rem 0
}

.logo-partnerloan-BNC.w60 {
    background-position: -14.86364rem 0
}

.logo-partnerloan-BNC.w65 {
    background-position: -16.10227rem 0
}

.logo-partnerloan-BNC.w72 {
    background-position: -17.83636rem 0
}

/*! DGB캐피탈 */

/*! 다올저축은행 */

.logo-partnerloan-EGS.w20 {
    background-position: 0 -4.95455rem
}

.logo-partnerloan-EGS.w22 {
    background-position: 0 -5.45rem
}

.logo-partnerloan-EGS.w24 {
    background-position: 0 -5.94545rem
}

.logo-partnerloan-EGS.w34 {
    background-position: 0 -8.42273rem
}

.logo-partnerloan-EGS.w44 {
    background-position: 0 -10.9rem
}

.logo-partnerloan-EGS.w60 {
    background-position: 0 -14.86364rem
}

.logo-partnerloan-EGS.w65 {
    background-position: 0 -16.10227rem
}

.logo-partnerloan-EGS.w72 {
    background-position: 0 -17.83636rem
}

/*! 하나캐피탈 */

.logo-partnerloan-HNC.w20 {
    background-position: -9.90909rem -4.95455rem
}

.logo-partnerloan-HNC.w22 {
    background-position: -10.9rem -5.45rem
}

.logo-partnerloan-HNC.w24 {
    background-position: -11.89091rem -5.94545rem
}

.logo-partnerloan-HNC.w34 {
    background-position: -16.84545rem -8.42273rem
}

.logo-partnerloan-HNC.w44 {
    background-position: -21.8rem -10.9rem
}

.logo-partnerloan-HNC.w60 {
    background-position: -29.72727rem -14.86364rem
}

.logo-partnerloan-HNC.w65 {
    background-position: -32.20455rem -16.10227rem
}

.logo-partnerloan-HNC.w72 {
    background-position: -35.67273rem -17.83636rem
}

/*! JT친애저축은행 */

.logo-partnerloan-JTS.w20 {
    background-position: -4.95455rem -9.90909rem
}

.logo-partnerloan-JTS.w22 {
    background-position: -5.45rem -10.9rem
}

.logo-partnerloan-JTS.w24 {
    background-position: -5.94545rem -11.89091rem
}

.logo-partnerloan-JTS.w34 {
    background-position: -8.42273rem -16.84545rem
}

.logo-partnerloan-JTS.w44 {
    background-position: -10.9rem -21.8rem
}

.logo-partnerloan-JTS.w60 {
    background-position: -14.86364rem -29.72727rem
}

.logo-partnerloan-JTS.w65 {
    background-position: -16.10227rem -32.20455rem
}

.logo-partnerloan-JTS.w72 {
    background-position: -17.83636rem -35.67273rem
}

/*! KB저축은행 */

.logo-partnerloan-KBS.w20 {
    background-position: -9.90909rem -9.90909rem
}

.logo-partnerloan-KBS.w22 {
    background-position: -10.9rem -10.9rem
}

.logo-partnerloan-KBS.w24 {
    background-position: -11.89091rem -11.89091rem
}

.logo-partnerloan-KBS.w34 {
    background-position: -16.84545rem -16.84545rem
}

.logo-partnerloan-KBS.w44 {
    background-position: -21.8rem -21.8rem
}

.logo-partnerloan-KBS.w60 {
    background-position: -29.72727rem -29.72727rem
}

.logo-partnerloan-KBS.w65 {
    background-position: -32.20455rem -32.20455rem
}

.logo-partnerloan-KBS.w72 {
    background-position: -35.67273rem -35.67273rem
}

/*! 한국투자저축은행 */

.logo-partnerloan-KIS.w20 {
    background-position: -14.86364rem 0
}

.logo-partnerloan-KIS.w22 {
    background-position: -16.35rem 0
}

.logo-partnerloan-KIS.w24 {
    background-position: -17.83636rem 0
}

.logo-partnerloan-KIS.w34 {
    background-position: -25.26818rem 0
}

.logo-partnerloan-KIS.w44 {
    background-position: -32.7rem 0
}

.logo-partnerloan-KIS.w60 {
    background-position: -44.59091rem 0
}

.logo-partnerloan-KIS.w65 {
    background-position: -48.30682rem 0
}

.logo-partnerloan-KIS.w72 {
    background-position: -53.50909rem 0
}

/*! 롯데캐피탈 */

.logo-partnerloan-LTC.w20 {
    background-position: -14.86364rem -9.90909rem
}

.logo-partnerloan-LTC.w22 {
    background-position: -16.35rem -10.9rem
}

.logo-partnerloan-LTC.w24 {
    background-position: -17.83636rem -11.89091rem
}

.logo-partnerloan-LTC.w34 {
    background-position: -25.26818rem -16.84545rem
}

.logo-partnerloan-LTC.w44 {
    background-position: -32.7rem -21.8rem
}

.logo-partnerloan-LTC.w60 {
    background-position: -44.59091rem -29.72727rem
}

.logo-partnerloan-LTC.w65 {
    background-position: -48.30682rem -32.20455rem
}

.logo-partnerloan-LTC.w72 {
    background-position: -53.50909rem -35.67273rem
}

/*! SBI저축은행 */

.logo-partnerloan-SBS.w20 {
    background-position: -14.86364rem -14.86364rem
}

.logo-partnerloan-SBS.w22 {
    background-position: -16.35rem -16.35rem
}

.logo-partnerloan-SBS.w24 {
    background-position: -17.83636rem -17.83636rem
}

.logo-partnerloan-SBS.w34 {
    background-position: -25.26818rem -25.26818rem
}

.logo-partnerloan-SBS.w44 {
    background-position: -32.7rem -32.7rem
}

.logo-partnerloan-SBS.w60 {
    background-position: -44.59091rem -44.59091rem
}

.logo-partnerloan-SBS.w65 {
    background-position: -48.30682rem -48.30682rem
}

.logo-partnerloan-SBS.w72 {
    background-position: -53.50909rem -53.50909rem
}

/*! 신한저축은행 */

.logo-partnerloan-SHS.w20 {
    background-position: -19.81818rem 0
}

.logo-partnerloan-SHS.w22 {
    background-position: -21.8rem 0
}

.logo-partnerloan-SHS.w24 {
    background-position: -23.78182rem 0
}

.logo-partnerloan-SHS.w34 {
    background-position: -33.69091rem 0
}

.logo-partnerloan-SHS.w44 {
    background-position: -43.6rem 0
}

.logo-partnerloan-SHS.w60 {
    background-position: -59.45455rem 0
}

.logo-partnerloan-SHS.w65 {
    background-position: -64.40909rem 0
}

.logo-partnerloan-SHS.w72 {
    background-position: -71.34545rem 0
}

/*! 웰컴저축은행 */

.logo-partnerloan-WCS.w20 {
    background-position: -19.81818rem -4.95455rem
}

.logo-partnerloan-WCS.w22 {
    background-position: -21.8rem -5.45rem
}

.logo-partnerloan-WCS.w24 {
    background-position: -23.78182rem -5.94545rem
}

.logo-partnerloan-WCS.w34 {
    background-position: -33.69091rem -8.42273rem
}

.logo-partnerloan-WCS.w44 {
    background-position: -43.6rem -10.9rem
}

.logo-partnerloan-WCS.w60 {
    background-position: -59.45455rem -14.86364rem
}

.logo-partnerloan-WCS.w65 {
    background-position: -64.40909rem -16.10227rem
}

.logo-partnerloan-WCS.w72 {
    background-position: -71.34545rem -17.83636rem
}

/*! 우리금융캐피탈 */

.logo-partnerloan-WFC.w20 {
    background-position: -19.81818rem -9.90909rem
}

.logo-partnerloan-WFC.w22 {
    background-position: -21.8rem -10.9rem
}

.logo-partnerloan-WFC.w24 {
    background-position: -23.78182rem -11.89091rem
}

.logo-partnerloan-WFC.w34 {
    background-position: -33.69091rem -16.84545rem
}

.logo-partnerloan-WFC.w44 {
    background-position: -43.6rem -21.8rem
}

.logo-partnerloan-WFC.w60 {
    background-position: -59.45455rem -29.72727rem
}

.logo-partnerloan-WFC.w65 {
    background-position: -64.40909rem -32.20455rem
}

.logo-partnerloan-WFC.w72 {
    background-position: -71.34545rem -35.67273rem
}

/*! 우리카드 */

.logo-partnerloan-WRC.w20 {
    background-position: -19.81818rem -14.86364rem
}

.logo-partnerloan-WRC.w22 {
    background-position: -21.8rem -16.35rem
}

.logo-partnerloan-WRC.w24 {
    background-position: -23.78182rem -17.83636rem
}

.logo-partnerloan-WRC.w34 {
    background-position: -33.69091rem -25.26818rem
}

.logo-partnerloan-WRC.w44 {
    background-position: -43.6rem -32.7rem
}

.logo-partnerloan-WRC.w60 {
    background-position: -59.45455rem -44.59091rem
}

.logo-partnerloan-WRC.w65 {
    background-position: -64.40909rem -48.30682rem
}

.logo-partnerloan-WRC.w72 {
    background-position: -71.34545rem -53.50909rem
}

/*! 하나저축은행 */

.logo-partnerloan-HNS.w20 {
    background-position: 0 -9.90909rem
}

.logo-partnerloan-HNS.w22 {
    background-position: 0 -10.9rem
}

.logo-partnerloan-HNS.w24 {
    background-position: 0 -11.89091rem
}

.logo-partnerloan-HNS.w34 {
    background-position: 0 -16.84545rem
}

.logo-partnerloan-HNS.w44 {
    background-position: 0 -21.8rem
}

.logo-partnerloan-HNS.w60 {
    background-position: 0 -29.72727rem
}

.logo-partnerloan-HNS.w65 {
    background-position: 0 -32.20455rem
}

.logo-partnerloan-HNS.w72 {
    background-position: 0 -35.67273rem
}

/*! 한국캐피탈 */

.logo-partnerloan-HKC.w20 {
    background-position: -9.90909rem 0
}

.logo-partnerloan-HKC.w22 {
    background-position: -10.9rem 0
}

.logo-partnerloan-HKC.w24 {
    background-position: -11.89091rem 0
}

.logo-partnerloan-HKC.w34 {
    background-position: -16.84545rem 0
}

.logo-partnerloan-HKC.w44 {
    background-position: -21.8rem 0
}

.logo-partnerloan-HKC.w60 {
    background-position: -29.72727rem 0
}

.logo-partnerloan-HKC.w65 {
    background-position: -32.20455rem 0
}

.logo-partnerloan-HKC.w72 {
    background-position: -35.67273rem 0
}

/*! NH캐피탈 */

.logo-partnerloan-NHC.w20 {
    background-position: 0 -14.86364rem
}

.logo-partnerloan-NHC.w22 {
    background-position: 0 -16.35rem
}

.logo-partnerloan-NHC.w24 {
    background-position: 0 -17.83636rem
}

.logo-partnerloan-NHC.w34 {
    background-position: 0 -25.26818rem
}

.logo-partnerloan-NHC.w44 {
    background-position: 0 -32.7rem
}

.logo-partnerloan-NHC.w60 {
    background-position: 0 -44.59091rem
}

.logo-partnerloan-NHC.w65 {
    background-position: 0 -48.30682rem
}

.logo-partnerloan-NHC.w72 {
    background-position: 0 -53.50909rem
}

/*! 고려저축은행 */

.logo-partnerloan-GOS.w20 {
    background-position: -4.95455rem -4.95455rem
}

.logo-partnerloan-GOS.w22 {
    background-position: -5.45rem -5.45rem
}

.logo-partnerloan-GOS.w24 {
    background-position: -5.94545rem -5.94545rem
}

.logo-partnerloan-GOS.w34 {
    background-position: -8.42273rem -8.42273rem
}

.logo-partnerloan-GOS.w44 {
    background-position: -10.9rem -10.9rem
}

.logo-partnerloan-GOS.w60 {
    background-position: -14.86364rem -14.86364rem
}

.logo-partnerloan-GOS.w65 {
    background-position: -16.10227rem -16.10227rem
}

.logo-partnerloan-GOS.w72 {
    background-position: -17.83636rem -17.83636rem
}

/*! 오케이저축은행 */

.logo-partnerloan-OKS.w20 {
    background-position: -9.90909rem -14.86364rem
}

.logo-partnerloan-OKS.w22 {
    background-position: -10.9rem -16.35rem
}

.logo-partnerloan-OKS.w24 {
    background-position: -11.89091rem -17.83636rem
}

.logo-partnerloan-OKS.w34 {
    background-position: -16.84545rem -25.26818rem
}

.logo-partnerloan-OKS.w44 {
    background-position: -21.8rem -32.7rem
}

.logo-partnerloan-OKS.w60 {
    background-position: -29.72727rem -44.59091rem
}

.logo-partnerloan-OKS.w65 {
    background-position: -32.20455rem -48.30682rem
}

.logo-partnerloan-OKS.w72 {
    background-position: -35.67273rem -53.50909rem
}

/*! component element icon sprite 오픈뱅킹용 카드로고 - square ======================================== */

/*! s: noimg : FETASK-1252 [KDS] S통장 대응 VI 업데이트 2023-08-21*/

[class*="logo-card"] {
    display: inline-block;
    overflow: hidden;
    position: relative
}

[class*="logo-card"].w21 {
    background-image: url(../../img/mmk/common/sprite_logo_card.png?timestamp=1737102040419);
    width: 2.10833rem;
    height: 3.35rem;
    background-size: 98.75rem 3.35rem
}

[class*="logo-card"].w22 {
    background-image: url(../../img/mmk/common/sprite_logo_card.png?timestamp=1737102040419);
    width: 2.20873rem;
    height: 3.50952rem;
    background-size: 103.45238rem 3.50952rem
}

[class*="logo-card"].w24 {
    background-image: url(../../img/mmk/common/sprite_logo_card.png?timestamp=1737102040419);
    width: 2.40952rem;
    height: 3.82857rem;
    background-size: 112.85714rem 3.82857rem
}

[class*="logo-card"].w26 {
    background-image: url(../../img/mmk/common/sprite_logo_card.png?timestamp=1737102040419);
    width: 2.61032rem;
    height: 4.14762rem;
    background-size: 122.2619rem 4.14762rem
}

[class*="logo-card"].w27 {
    background-image: url(../../img/mmk/common/sprite_logo_card.png?timestamp=1737102040419);
    width: 2.71071rem;
    height: 4.30714rem;
    background-size: 126.96429rem 4.30714rem
}

[class*="logo-card"].w28 {
    background-image: url(../../img/mmk/common/sprite_logo_card.png?timestamp=1737102040419);
    width: 2.81111rem;
    height: 4.46667rem;
    background-size: 131.66667rem 4.46667rem
}

[class*="logo-card"].w32 {
    background-image: url(../../img/mmk/common/sprite_logo_card.png?timestamp=1737102040419);
    width: 3.2127rem;
    height: 5.10476rem;
    background-size: 150.47619rem 5.10476rem
}

[class*="logo-card"].w34 {
    background-image: url(../../img/mmk/common/sprite_logo_card.png?timestamp=1737102040419);
    width: 3.41349rem;
    height: 5.42381rem;
    background-size: 159.88095rem 5.42381rem
}

[class*="logo-card"].w21 {
    background-position: -96.64167rem 0
}

[class*="logo-card"].w22 {
    background-position: -101.24365rem 0
}

[class*="logo-card"].w24 {
    background-position: -110.44762rem 0
}

[class*="logo-card"].w26 {
    background-position: -119.65159rem 0
}

[class*="logo-card"].w27 {
    background-position: -124.25357rem 0
}

[class*="logo-card"].w28 {
    background-position: -128.85556rem 0
}

[class*="logo-card"].w32 {
    background-position: -147.26349rem 0
}

[class*="logo-card"].w34 {
    background-position: -156.46746rem 0
}

.logo-cardnone.w21 {
    background-position: -96.64167rem 0
}

.logo-cardnone.w22 {
    background-position: -101.24365rem 0
}

.logo-cardnone.w24 {
    background-position: -110.44762rem 0
}

.logo-cardnone.w26 {
    background-position: -119.65159rem 0
}

.logo-cardnone.w27 {
    background-position: -124.25357rem 0
}

.logo-cardnone.w28 {
    background-position: -128.85556rem 0
}

.logo-cardnone.w32 {
    background-position: -147.26349rem 0
}

.logo-cardnone.w34 {
    background-position: -156.46746rem 0
}

/*! e : noimg : FETASK-1252 [KDS] S통장 대응 VI 업데이트 2023-08-21*/

/*! 산업은행카드 */

.logo-card002.w21 {
    background-position: 0 0
}

.logo-card002.w22 {
    background-position: 0 0
}

.logo-card002.w24 {
    background-position: 0 0
}

.logo-card002.w26 {
    background-position: 0 0
}

.logo-card002.w27 {
    background-position: 0 0
}

.logo-card002.w28 {
    background-position: 0 0
}

.logo-card002.w32 {
    background-position: 0 0
}

.logo-card002.w34 {
    background-position: 0 0
}

/*! 기업은행카드 */

.logo-card003.w21 {
    background-position: -4.2rem 0
}

.logo-card003.w22 {
    background-position: -4.4rem 0
}

.logo-card003.w24 {
    background-position: -4.8rem 0
}

.logo-card003.w26 {
    background-position: -5.2rem 0
}

.logo-card003.w27 {
    background-position: -5.4rem 0
}

.logo-card003.w28 {
    background-position: -5.6rem 0
}

.logo-card003.w32 {
    background-position: -6.4rem 0
}

.logo-card003.w34 {
    background-position: -6.8rem 0
}

/*! 수협은행카드 */

.logo-card007.w21 {
    background-position: -8.4rem 0
}

.logo-card007.w22 {
    background-position: -8.8rem 0
}

.logo-card007.w24 {
    background-position: -9.6rem 0
}

.logo-card007.w26 {
    background-position: -10.4rem 0
}

.logo-card007.w27 {
    background-position: -10.8rem 0
}

.logo-card007.w28 {
    background-position: -11.2rem 0
}

.logo-card007.w32 {
    background-position: -12.8rem 0
}

.logo-card007.w34 {
    background-position: -13.6rem 0
}

/*! NH농협은행카드 */

.logo-card011.w21 {
    background-position: -12.6rem 0
}

.logo-card011.w22 {
    background-position: -13.2rem 0
}

.logo-card011.w24 {
    background-position: -14.4rem 0
}

.logo-card011.w26 {
    background-position: -15.6rem 0
}

.logo-card011.w27 {
    background-position: -16.2rem 0
}

.logo-card011.w28 {
    background-position: -16.8rem 0
}

.logo-card011.w32 {
    background-position: -19.2rem 0
}

.logo-card011.w34 {
    background-position: -20.4rem 0
}

/*! 씨티은행카드 */

.logo-card027.w21 {
    background-position: -21rem 0
}

.logo-card027.w22 {
    background-position: -22rem 0
}

.logo-card027.w24 {
    background-position: -24rem 0
}

.logo-card027.w26 {
    background-position: -26rem 0
}

.logo-card027.w27 {
    background-position: -27rem 0
}

.logo-card027.w28 {
    background-position: -28rem 0
}

.logo-card027.w32 {
    background-position: -32rem 0
}

.logo-card027.w34 {
    background-position: -34rem 0
}

/*! 광주은행카드 */

.logo-card034.w21 {
    background-position: -33.6rem 0
}

.logo-card034.w22 {
    background-position: -35.2rem 0
}

.logo-card034.w24 {
    background-position: -38.4rem 0
}

.logo-card034.w26 {
    background-position: -41.6rem 0
}

.logo-card034.w27 {
    background-position: -43.2rem 0
}

.logo-card034.w28 {
    background-position: -44.8rem 0
}

.logo-card034.w32 {
    background-position: -51.2rem 0
}

.logo-card034.w34 {
    background-position: -54.4rem 0
}

/*! 제주은행카드 */

.logo-card035.w21 {
    background-position: -37.8rem 0
}

.logo-card035.w22 {
    background-position: -39.6rem 0
}

.logo-card035.w24 {
    background-position: -43.2rem 0
}

.logo-card035.w26 {
    background-position: -46.8rem 0
}

.logo-card035.w27 {
    background-position: -48.6rem 0
}

.logo-card035.w28 {
    background-position: -50.4rem 0
}

.logo-card035.w32 {
    background-position: -57.6rem 0
}

.logo-card035.w34 {
    background-position: -61.2rem 0
}

/*! 전북은행카드 */

.logo-card037.w21 {
    background-position: -42.00833rem 0
}

.logo-card037.w22 {
    background-position: -44.00873rem 0
}

.logo-card037.w24 {
    background-position: -48.00952rem 0
}

.logo-card037.w26 {
    background-position: -52.01032rem 0
}

.logo-card037.w27 {
    background-position: -54.01071rem 0
}

.logo-card037.w28 {
    background-position: -56.01111rem 0
}

.logo-card037.w32 {
    background-position: -64.0127rem 0
}

.logo-card037.w34 {
    background-position: -68.01349rem 0
}

/*! 우리카드 */

.logo-card041.w21 {
    background-position: -50.40833rem 0
}

.logo-card041.w22 {
    background-position: -52.80873rem 0
}

.logo-card041.w24 {
    background-position: -57.60952rem 0
}

.logo-card041.w26 {
    background-position: -62.41032rem 0
}

.logo-card041.w27 {
    background-position: -64.81071rem 0
}

.logo-card041.w28 {
    background-position: -67.21111rem 0
}

.logo-card041.w32 {
    background-position: -76.8127rem 0
}

.logo-card041.w34 {
    background-position: -81.61349rem 0
}

/*! 케이뱅크카드 */

.logo-card089.w21 {
    background-position: -54.60833rem 0
}

.logo-card089.w22 {
    background-position: -57.20873rem 0
}

.logo-card089.w24 {
    background-position: -62.40952rem 0
}

.logo-card089.w26 {
    background-position: -67.61032rem 0
}

.logo-card089.w27 {
    background-position: -70.21071rem 0
}

.logo-card089.w28 {
    background-position: -72.81111rem 0
}

.logo-card089.w32 {
    background-position: -83.2127rem 0
}

.logo-card089.w34 {
    background-position: -88.41349rem 0
}

/*! 토스뱅크카드 */

.logo-card092.w21 {
    background-position: -63.01667rem 0
}

.logo-card092.w22 {
    background-position: -66.01746rem 0
}

.logo-card092.w24 {
    background-position: -72.01905rem 0
}

.logo-card092.w26 {
    background-position: -78.02063rem 0
}

.logo-card092.w27 {
    background-position: -81.02143rem 0
}

.logo-card092.w28 {
    background-position: -84.02222rem 0
}

.logo-card092.w32 {
    background-position: -96.0254rem 0
}

.logo-card092.w34 {
    background-position: -102.02698rem 0
}

/*! BC카드 */

.logo-card361.w21 {
    background-position: -67.21667rem 0
}

.logo-card361.w22 {
    background-position: -70.41746rem 0
}

.logo-card361.w24 {
    background-position: -76.81905rem 0
}

.logo-card361.w26 {
    background-position: -83.22063rem 0
}

.logo-card361.w27 {
    background-position: -86.42143rem 0
}

.logo-card361.w28 {
    background-position: -89.62222rem 0
}

.logo-card361.w32 {
    background-position: -102.4254rem 0
}

.logo-card361.w34 {
    background-position: -108.82698rem 0
}

/*! SC제일은행카드 */

.logo-card023.w21 {
    background-position: -16.8rem 0
}

.logo-card023.w22 {
    background-position: -17.6rem 0
}

.logo-card023.w24 {
    background-position: -19.2rem 0
}

.logo-card023.w26 {
    background-position: -20.8rem 0
}

.logo-card023.w27 {
    background-position: -21.6rem 0
}

.logo-card023.w28 {
    background-position: -22.4rem 0
}

.logo-card023.w32 {
    background-position: -25.6rem 0
}

.logo-card023.w34 {
    background-position: -27.2rem 0
}

/*! 아이엠뱅크카드 */

.logo-card031.w21 {
    background-position: -25.2rem 0
}

.logo-card031.w22 {
    background-position: -26.4rem 0
}

.logo-card031.w24 {
    background-position: -28.8rem 0
}

.logo-card031.w26 {
    background-position: -31.2rem 0
}

.logo-card031.w27 {
    background-position: -32.4rem 0
}

.logo-card031.w28 {
    background-position: -33.6rem 0
}

.logo-card031.w32 {
    background-position: -38.4rem 0
}

.logo-card031.w34 {
    background-position: -40.8rem 0
}

/*! 부산은행카드 */

.logo-card032.w21 {
    background-position: -29.4rem 0
}

.logo-card032.w22 {
    background-position: -30.8rem 0
}

.logo-card032.w24 {
    background-position: -33.6rem 0
}

.logo-card032.w26 {
    background-position: -36.4rem 0
}

.logo-card032.w27 {
    background-position: -37.8rem 0
}

.logo-card032.w28 {
    background-position: -39.2rem 0
}

.logo-card032.w32 {
    background-position: -44.8rem 0
}

.logo-card032.w34 {
    background-position: -47.6rem 0
}

/*! 경남은행카드 */

.logo-card039.w21 {
    background-position: -46.20833rem 0
}

.logo-card039.w22 {
    background-position: -48.40873rem 0
}

.logo-card039.w24 {
    background-position: -52.80952rem 0
}

.logo-card039.w26 {
    background-position: -57.21032rem 0
}

.logo-card039.w27 {
    background-position: -59.41071rem 0
}

.logo-card039.w28 {
    background-position: -61.61111rem 0
}

.logo-card039.w32 {
    background-position: -70.4127rem 0
}

.logo-card039.w34 {
    background-position: -74.81349rem 0
}

/*! 삼성카드 */

.logo-card365.w21 {
    background-position: -71.41667rem 0
}

.logo-card365.w22 {
    background-position: -74.81746rem 0
}

.logo-card365.w24 {
    background-position: -81.61905rem 0
}

.logo-card365.w26 {
    background-position: -88.42063rem 0
}

.logo-card365.w27 {
    background-position: -91.82143rem 0
}

.logo-card365.w28 {
    background-position: -95.22222rem 0
}

.logo-card365.w32 {
    background-position: -108.8254rem 0
}

.logo-card365.w34 {
    background-position: -115.62698rem 0
}

/*! 신한카드 */

.logo-card366.w21 {
    background-position: -75.625rem 0
}

.logo-card366.w22 {
    background-position: -79.22619rem 0
}

.logo-card366.w24 {
    background-position: -86.42857rem 0
}

.logo-card366.w26 {
    background-position: -93.63095rem 0
}

.logo-card366.w27 {
    background-position: -97.23214rem 0
}

.logo-card366.w28 {
    background-position: -100.83333rem 0
}

.logo-card366.w32 {
    background-position: -115.2381rem 0
}

.logo-card366.w34 {
    background-position: -122.44048rem 0
}

/*! 현대카드 */

.logo-card367.w21 {
    background-position: -79.83333rem 0
}

.logo-card367.w22 {
    background-position: -83.63492rem 0
}

.logo-card367.w24 {
    background-position: -91.2381rem 0
}

.logo-card367.w26 {
    background-position: -98.84127rem 0
}

.logo-card367.w27 {
    background-position: -102.64286rem 0
}

.logo-card367.w28 {
    background-position: -106.44444rem 0
}

.logo-card367.w32 {
    background-position: -121.65079rem 0
}

.logo-card367.w34 {
    background-position: -129.25397rem 0
}

/*! 롯데카드 */

.logo-card368.w21 {
    background-position: -84.04167rem 0
}

.logo-card368.w22 {
    background-position: -88.04365rem 0
}

.logo-card368.w24 {
    background-position: -96.04762rem 0
}

.logo-card368.w26 {
    background-position: -104.05159rem 0
}

.logo-card368.w27 {
    background-position: -108.05357rem 0
}

.logo-card368.w28 {
    background-position: -112.05556rem 0
}

.logo-card368.w32 {
    background-position: -128.06349rem 0
}

.logo-card368.w34 {
    background-position: -136.06746rem 0
}

/*! 하나카드 */

.logo-card374.w21 {
    background-position: -88.24167rem 0
}

.logo-card374.w22 {
    background-position: -92.44365rem 0
}

.logo-card374.w24 {
    background-position: -100.84762rem 0
}

.logo-card374.w26 {
    background-position: -109.25159rem 0
}

.logo-card374.w27 {
    background-position: -113.45357rem 0
}

.logo-card374.w28 {
    background-position: -117.65556rem 0
}

.logo-card374.w32 {
    background-position: -134.46349rem 0
}

.logo-card374.w34 {
    background-position: -142.86746rem 0
}

/*! KB국민카드 */

.logo-card381.w21 {
    background-position: -92.44167rem 0
}

.logo-card381.w22 {
    background-position: -96.84365rem 0
}

.logo-card381.w24 {
    background-position: -105.64762rem 0
}

.logo-card381.w26 {
    background-position: -114.45159rem 0
}

.logo-card381.w27 {
    background-position: -118.85357rem 0
}

.logo-card381.w28 {
    background-position: -123.25556rem 0
}

.logo-card381.w32 {
    background-position: -140.86349rem 0
}

.logo-card381.w34 {
    background-position: -149.66746rem 0
}

/*! 카카오뱅크카드 */

.logo-card090.w21 {
    background-position: -58.81667rem 0
}

.logo-card090.w22 {
    background-position: -61.61746rem 0
}

.logo-card090.w24 {
    background-position: -67.21905rem 0
}

.logo-card090.w26 {
    background-position: -72.82063rem 0
}

.logo-card090.w27 {
    background-position: -75.62143rem 0
}

.logo-card090.w28 {
    background-position: -78.42222rem 0
}

.logo-card090.w32 {
    background-position: -89.6254rem 0
}

.logo-card090.w34 {
    background-position: -95.22698rem 0
}

/*! component element icon sprite 대환대출 기관 로고 - circle FETASK-649 */

[class*="logo-cardandcapital"] {
    display: inline-block;
    overflow: hidden;
    border-radius: 50%;
    position: relative
}

[class*="logo-cardandcapital"].w24 {
    background-image: url(../../img/mmk/common/sprite_logo_cardandcapital.png?timestamp=1710464807023);
    width: 2.4rem;
    height: 2.4rem;
    background-size: 26.4rem 26.4rem
}

[class*="logo-cardandcapital"].w34 {
    background-image: url(../../img/mmk/common/sprite_logo_cardandcapital.png?timestamp=1710464807023);
    width: 3.4rem;
    height: 3.4rem;
    background-size: 37.4rem 37.4rem
}

[class*="logo-cardandcapital"].w44 {
    background-image: url(../../img/mmk/common/sprite_logo_cardandcapital.png?timestamp=1710464807023);
    width: 4.4rem;
    height: 4.4rem;
    background-size: 48.4rem 48.4rem
}

[class*="logo-cardandcapital"].w24 {
    background-position: 0 0
}

[class*="logo-cardandcapital"].w34 {
    background-position: 0 0
}

[class*="logo-cardandcapital"].w44 {
    background-position: 0 0
}

/*! cardandcapital을 사용하는 kcb 구분코드 */

.logo-kcb20115.w24,
.logo-kcb20116.w24,
.logo-kcb20117.w24,
.logo-kcb20302.w24,
.logo-kcb20304.w24,
.logo-kcb20308.w24,
.logo-kcb20311.w24,
.logo-kcb20313.w24,
.logo-kcb20314.w24,
.logo-kcb20321.w24,
.logo-kcb20324.w24,
.logo-kcb20325.w24,
.logo-kcb20327.w24,
.logo-kcis3511.w24,
.logo-kcis3536.w24,
.logo-kcis3537.w24,
.logo-kcis3552.w24,
.logo-kcis3553.w24,
.logo-kcis3556.w24,
.logo-kcis3559.w24,
.logo-kcis3880.w24,
.logo-kcis3912.w24,
.logo-kcis3950.w24,
.logo-kcis3960.w24 {
    background-image: url(../../img/mmk/common/sprite_logo_cardandcapital.png?timestamp=1710464807023);
    width: 2.4rem;
    height: 2.4rem;
    background-size: 26.4rem 26.4rem
}

.logo-kcb20115.w34,
.logo-kcb20116.w34,
.logo-kcb20117.w34,
.logo-kcb20302.w34,
.logo-kcb20304.w34,
.logo-kcb20308.w34,
.logo-kcb20311.w34,
.logo-kcb20313.w34,
.logo-kcb20314.w34,
.logo-kcb20321.w34,
.logo-kcb20324.w34,
.logo-kcb20325.w34,
.logo-kcb20327.w34,
.logo-kcis3511.w34,
.logo-kcis3536.w34,
.logo-kcis3537.w34,
.logo-kcis3552.w34,
.logo-kcis3553.w34,
.logo-kcis3556.w34,
.logo-kcis3559.w34,
.logo-kcis3880.w34,
.logo-kcis3912.w34,
.logo-kcis3950.w34,
.logo-kcis3960.w34 {
    background-image: url(../../img/mmk/common/sprite_logo_cardandcapital.png?timestamp=1710464807023);
    width: 3.4rem;
    height: 3.4rem;
    background-size: 37.4rem 37.4rem
}

.logo-kcb20115.w44,
.logo-kcb20116.w44,
.logo-kcb20117.w44,
.logo-kcb20302.w44,
.logo-kcb20304.w44,
.logo-kcb20308.w44,
.logo-kcb20311.w44,
.logo-kcb20313.w44,
.logo-kcb20314.w44,
.logo-kcb20321.w44,
.logo-kcb20324.w44,
.logo-kcb20325.w44,
.logo-kcb20327.w44,
.logo-kcis3511.w44,
.logo-kcis3536.w44,
.logo-kcis3537.w44,
.logo-kcis3552.w44,
.logo-kcis3553.w44,
.logo-kcis3556.w44,
.logo-kcis3559.w44,
.logo-kcis3880.w44,
.logo-kcis3912.w44,
.logo-kcis3950.w44,
.logo-kcis3960.w44 {
    background-image: url(../../img/mmk/common/sprite_logo_cardandcapital.png?timestamp=1710464807023);
    width: 4.4rem;
    height: 4.4rem;
    background-size: 48.4rem 48.4rem
}

/*! default noimg */

.logo-cardandcapital-c000.w24 {
    background-position: 0 0
}

.logo-cardandcapital-c000.w34 {
    background-position: 0 0
}

.logo-cardandcapital-c000.w44 {
    background-position: 0 0
}

/*! KB국민카드 */

.logo-cardandcapital-c001.w24 {
    background-position: -4.8rem 0
}

.logo-cardandcapital-c001.w34 {
    background-position: -6.8rem 0
}

.logo-cardandcapital-c001.w44 {
    background-position: -8.8rem 0
}

/*! 하나카드 */

.logo-cardandcapital-c002.w24 {
    background-position: 0 -4.8rem
}

.logo-cardandcapital-c002.w34 {
    background-position: 0 -6.8rem
}

.logo-cardandcapital-c002.w44 {
    background-position: 0 -8.8rem
}

/*! 신한카드 */

.logo-cardandcapital-c003.w24 {
    background-position: -4.8rem -4.8rem
}

.logo-cardandcapital-c003.w34 {
    background-position: -6.8rem -6.8rem
}

.logo-cardandcapital-c003.w44 {
    background-position: -8.8rem -8.8rem
}

/*! 우리카드 */

.logo-cardandcapital-c004.w24 {
    background-position: -9.6rem 0
}

.logo-cardandcapital-c004.w34 {
    background-position: -13.6rem 0
}

.logo-cardandcapital-c004.w44 {
    background-position: -17.6rem 0
}

/*! 삼성카드 */

.logo-cardandcapital-c005.w24,
.logo-kcb20116.w24 {
    background-position: -9.6rem -4.8rem
}

.logo-cardandcapital-c005.w34,
.logo-kcb20116.w34 {
    background-position: -13.6rem -6.8rem
}

.logo-cardandcapital-c005.w44,
.logo-kcb20116.w44 {
    background-position: -17.6rem -8.8rem
}

/*! 현대카드 */

.logo-cardandcapital-c006.w24,
.logo-kcb20117.w24 {
    background-position: 0 -9.6rem
}

.logo-cardandcapital-c006.w34,
.logo-kcb20117.w34 {
    background-position: 0 -13.6rem
}

.logo-cardandcapital-c006.w44,
.logo-kcb20117.w44 {
    background-position: 0 -17.6rem
}

/*! 롯데카드 */

.logo-cardandcapital-c007.w24,
.logo-kcb20115.w24 {
    background-position: -4.8rem -9.6rem
}

.logo-cardandcapital-c007.w34,
.logo-kcb20115.w34 {
    background-position: -6.8rem -13.6rem
}

.logo-cardandcapital-c007.w44,
.logo-kcb20115.w44 {
    background-position: -8.8rem -17.6rem
}

/*! 미래에셋캐피탈 */

.logo-cardandcapital-c008.w24 {
    background-position: -9.6rem -9.6rem
}

.logo-cardandcapital-c008.w34 {
    background-position: -13.6rem -13.6rem
}

.logo-cardandcapital-c008.w44 {
    background-position: -17.6rem -17.6rem
}

/*! M캐피탈 */

.logo-cardandcapital-c009.w24,
.logo-kcis3880.w24 {
    background-position: -14.4rem 0
}

.logo-cardandcapital-c009.w34,
.logo-kcis3880.w34 {
    background-position: -20.4rem 0
}

.logo-cardandcapital-c009.w44,
.logo-kcis3880.w44 {
    background-position: -26.4rem 0
}

/*! c10_산은캐피탈 */

.logo-cardandcapital-c010.w24,
.logo-kcis3511.w24 {
    background-position: -14.4rem -4.8rem
}

.logo-cardandcapital-c010.w34,
.logo-kcis3511.w34 {
    background-position: -20.4rem -6.8rem
}

.logo-cardandcapital-c010.w44,
.logo-kcis3511.w44 {
    background-position: -26.4rem -8.8rem
}

/*! c11_KB캐피탈 */

.logo-cardandcapital-c011.w24 {
    background-position: -14.4rem -9.6rem
}

.logo-cardandcapital-c011.w34 {
    background-position: -20.4rem -13.6rem
}

.logo-cardandcapital-c011.w44 {
    background-position: -26.4rem -17.6rem
}

/*! c12_한국캐피탈 */

.logo-cardandcapital-c012.w24 {
    background-position: 0 -14.4rem
}

.logo-cardandcapital-c012.w34 {
    background-position: 0 -20.4rem
}

.logo-cardandcapital-c012.w44 {
    background-position: 0 -26.4rem
}

/*! c13_BMW파이낸셜서비스코리아 */

.logo-cardandcapital-c013.w24,
.logo-kcis3536.w24 {
    background-position: -4.8rem -14.4rem
}

.logo-cardandcapital-c013.w34,
.logo-kcis3536.w34 {
    background-position: -6.8rem -20.4rem
}

.logo-cardandcapital-c013.w44,
.logo-kcis3536.w44 {
    background-position: -8.8rem -26.4rem
}

/*! c14_오릭스캐피탈 */

.logo-cardandcapital-c014.w24,
.logo-kcis3537.w24 {
    background-position: -9.6rem -14.4rem
}

.logo-cardandcapital-c014.w34,
.logo-kcis3537.w34 {
    background-position: -13.6rem -20.4rem
}

.logo-cardandcapital-c014.w44,
.logo-kcis3537.w44 {
    background-position: -17.6rem -26.4rem
}

/*! c15_토요타파이낸셜 */

.logo-cardandcapital-c015.w24,
.logo-kcb20308.w24 {
    background-position: -14.4rem -14.4rem
}

.logo-cardandcapital-c015.w34,
.logo-kcb20308.w34 {
    background-position: -20.4rem -20.4rem
}

.logo-cardandcapital-c015.w44,
.logo-kcb20308.w44 {
    background-position: -26.4rem -26.4rem
}

/*! c16_NH농협캐피탈 */

.logo-cardandcapital-c016.w24 {
    background-position: -19.2rem 0
}

.logo-cardandcapital-c016.w34 {
    background-position: -27.2rem 0
}

.logo-cardandcapital-c016.w44 {
    background-position: -35.2rem 0
}

/*! c17_BNK캐피탈 */

.logo-cardandcapital-c017.w24 {
    background-position: -19.2rem -4.8rem
}

.logo-cardandcapital-c017.w34 {
    background-position: -27.2rem -6.8rem
}

.logo-cardandcapital-c017.w44 {
    background-position: -35.2rem -8.8rem
}

/*! c18_애큐온캐피탈 */

.logo-cardandcapital-c018.w24,
.logo-kcb20313.w24 {
    background-position: -19.2rem -9.6rem
}

.logo-cardandcapital-c018.w34,
.logo-kcb20313.w34 {
    background-position: -27.2rem -13.6rem
}

.logo-cardandcapital-c018.w44,
.logo-kcb20313.w44 {
    background-position: -35.2rem -17.6rem
}

/*! c19_도이치파이낸셜 */

.logo-cardandcapital-c019.w24,
.logo-kcis3553.w24 {
    background-position: -19.2rem -14.4rem
}

.logo-cardandcapital-c019.w34,
.logo-kcis3553.w34 {
    background-position: -27.2rem -20.4rem
}

.logo-cardandcapital-c019.w44,
.logo-kcis3553.w44 {
    background-position: -35.2rem -26.4rem
}

/*! c20_메리츠캐피탈 */

.logo-cardandcapital-c020.w24,
.logo-kcis3552.w24 {
    background-position: 0 -19.2rem
}

.logo-cardandcapital-c020.w34,
.logo-kcis3552.w34 {
    background-position: 0 -27.2rem
}

.logo-cardandcapital-c020.w44,
.logo-kcis3552.w44 {
    background-position: 0 -35.2rem
}

/*! c21_스타파이낸셜서비스 */

.logo-cardandcapital-c021.w24,
.logo-kcb20324.w24 {
    background-position: -4.8rem -19.2rem
}

.logo-cardandcapital-c021.w34,
.logo-kcb20324.w34 {
    background-position: -6.8rem -27.2rem
}

.logo-cardandcapital-c021.w44,
.logo-kcb20324.w44 {
    background-position: -8.8rem -35.2rem
}

/*! c22_에스와이오토캐피탈 */

.logo-cardandcapital-c022.w24,
.logo-kcb20325.w24,
.logo-kcis3556.w24 {
    background-position: -9.6rem -19.2rem
}

.logo-cardandcapital-c022.w34,
.logo-kcb20325.w34,
.logo-kcis3556.w34 {
    background-position: -13.6rem -27.2rem
}

.logo-cardandcapital-c022.w44,
.logo-kcb20325.w44,
.logo-kcis3556.w44 {
    background-position: -17.6rem -35.2rem
}

/*! c23_케이카캐피탈 */

.logo-cardandcapital-c023.w24,
.logo-kcb20327.w24,
.logo-kcis3559.w24 {
    background-position: -14.4rem -19.2rem
}

.logo-cardandcapital-c023.w34,
.logo-kcb20327.w34,
.logo-kcis3559.w34 {
    background-position: -20.4rem -27.2rem
}

.logo-cardandcapital-c023.w44,
.logo-kcb20327.w44,
.logo-kcis3559.w44 {
    background-position: -26.4rem -35.2rem
}

/*! c24_현대캐피탈 */

.logo-cardandcapital-c024.w24,
.logo-kcb20311.w24 {
    background-position: -19.2rem -19.2rem
}

.logo-cardandcapital-c024.w34,
.logo-kcb20311.w34 {
    background-position: -27.2rem -27.2rem
}

.logo-cardandcapital-c024.w44,
.logo-kcb20311.w44 {
    background-position: -35.2rem -35.2rem
}

/*! c25_우리금융캐피탈 */

.logo-cardandcapital-c025.w24 {
    background-position: -24rem 0
}

.logo-cardandcapital-c025.w34 {
    background-position: -34rem 0
}

.logo-cardandcapital-c025.w44 {
    background-position: -44rem 0
}

/*! c26_롯데캐피탈 */

.logo-cardandcapital-c026.w24,
.logo-kcb20304.w24 {
    background-position: -24rem -4.8rem
}

.logo-cardandcapital-c026.w34,
.logo-kcb20304.w34 {
    background-position: -34rem -6.8rem
}

.logo-cardandcapital-c026.w44,
.logo-kcb20304.w44 {
    background-position: -44rem -8.8rem
}

/*! c27_JB우리캐피탈 */

.logo-cardandcapital-c027.w24 {
    background-position: -24rem -9.6rem
}

.logo-cardandcapital-c027.w34 {
    background-position: -34rem -13.6rem
}

.logo-cardandcapital-c027.w44 {
    background-position: -44rem -17.6rem
}

/*! c28_하나캐피탈 */

.logo-cardandcapital-c028.w24 {
    background-position: -24rem -14.4rem
}

.logo-cardandcapital-c028.w34 {
    background-position: -34rem -20.4rem
}

.logo-cardandcapital-c028.w44 {
    background-position: -44rem -26.4rem
}

/*! c29_볼보파이낸셜 */

.logo-cardandcapital-c029.w24,
.logo-kcis3912.w24 {
    background-position: -24rem -19.2rem
}

.logo-cardandcapital-c029.w34,
.logo-kcis3912.w34 {
    background-position: -34rem -27.2rem
}

.logo-cardandcapital-c029.w44,
.logo-kcis3912.w44 {
    background-position: -44rem -35.2rem
}

/*! c30_폭스바겐파이낸셜 */

.logo-cardandcapital-c030.w24,
.logo-kcb20321.w24 {
    background-position: 0 -24rem
}

.logo-cardandcapital-c030.w34,
.logo-kcb20321.w34 {
    background-position: 0 -34rem
}

.logo-cardandcapital-c030.w44,
.logo-kcb20321.w44 {
    background-position: 0 -44rem
}

/*! c31_메르세데스벤츠파이낸셜@3x */

.logo-cardandcapital-c031.w24,
.logo-kcb20302.w24,
.logo-kcis3950.w24 {
    background-position: -4.8rem -24rem
}

.logo-cardandcapital-c031.w34,
.logo-kcb20302.w34,
.logo-kcis3950.w34 {
    background-position: -6.8rem -34rem
}

.logo-cardandcapital-c031.w44,
.logo-kcb20302.w44,
.logo-kcis3950.w44 {
    background-position: -8.8rem -44rem
}

/*! c32_RCI파이낸셜 */

.logo-cardandcapital-c032.w24,
.logo-kcb20314.w24,
.logo-kcis3960.w24 {
    background-position: -9.6rem -24rem
}

.logo-cardandcapital-c032.w34,
.logo-kcb20314.w34,
.logo-kcis3960.w34 {
    background-position: -13.6rem -34rem
}

.logo-cardandcapital-c032.w44,
.logo-kcb20314.w44,
.logo-kcis3960.w44 {
    background-position: -17.6rem -44rem
}

/*! c33_DGB캐피탈 */

.logo-cardandcapital-c033.w24 {
    background-position: -14.4rem -24rem
}

.logo-cardandcapital-c033.w34 {
    background-position: -20.4rem -34rem
}

.logo-cardandcapital-c033.w44 {
    background-position: -26.4rem -44rem
}

.card-group .card-header .logo-img-figure [class*="logo-cardandcapital"] {
    margin-right: 1.2rem;
    height: 3.4rem
}

/*! component element icon sprite 오픈뱅킹 보험 기관 로고 - circle FETASK-707 */

[class*="logo-insurance"] {
    display: inline-block;
    overflow: hidden;
    border-radius: 50%;
    position: relative
}

[class*="logo-insurance"].w24 {
    background-image: url(../../img/mmk/common/sprite_logo_insurance.png?timestamp=1701323933944);
    width: 2.4rem;
    height: 2.4rem;
    background-size: 31.2rem 26.4rem
}

[class*="logo-insurance"].w28 {
    background-image: url(../../img/mmk/common/sprite_logo_insurance.png?timestamp=1701323933944);
    width: 2.8rem;
    height: 2.8rem;
    background-size: 36.4rem 30.8rem
}

[class*="logo-insurance"].w34 {
    background-image: url(../../img/mmk/common/sprite_logo_insurance.png?timestamp=1701323933944);
    width: 3.4rem;
    height: 3.4rem;
    background-size: 44.2rem 37.4rem
}

[class*="logo-insurance"].w36 {
    background-image: url(../../img/mmk/common/sprite_logo_insurance.png?timestamp=1701323933944);
    width: 3.6rem;
    height: 3.6rem;
    background-size: 46.8rem 39.6rem
}

[class*="logo-insurance"].w40 {
    background-image: url(../../img/mmk/common/sprite_logo_insurance.png?timestamp=1701323933944);
    width: 4rem;
    height: 4rem;
    background-size: 52rem 44rem
}

[class*="logo-insurance"].w44 {
    background-image: url(../../img/mmk/common/sprite_logo_insurance.png?timestamp=1701323933944);
    width: 4.4rem;
    height: 4.4rem;
    background-size: 57.2rem 48.4rem
}

/*! default noimg */

.logo-insurance436.w24 {
    background-position: -14.4rem -9.6rem
}

.logo-insurance436.w28 {
    background-position: -16.8rem -11.2rem
}

.logo-insurance436.w34 {
    background-position: -20.4rem -13.6rem
}

.logo-insurance436.w36 {
    background-position: -21.6rem -14.4rem
}

.logo-insurance436.w40 {
    background-position: -24rem -16rem
}

.logo-insurance436.w44 {
    background-position: -26.4rem -17.6rem
}

.logo-insurance401.w24 {
    background-position: 0 0
}

.logo-insurance401.w28 {
    background-position: 0 0
}

.logo-insurance401.w34 {
    background-position: 0 0
}

.logo-insurance401.w36 {
    background-position: 0 0
}

.logo-insurance401.w40 {
    background-position: 0 0
}

.logo-insurance401.w44 {
    background-position: 0 0
}

.logo-insurance402.w24 {
    background-position: -4.8rem 0
}

.logo-insurance402.w28 {
    background-position: -5.6rem 0
}

.logo-insurance402.w34 {
    background-position: -6.8rem 0
}

.logo-insurance402.w36 {
    background-position: -7.2rem 0
}

.logo-insurance402.w40 {
    background-position: -8rem 0
}

.logo-insurance402.w44 {
    background-position: -8.8rem 0
}

.logo-insurance403.w24 {
    background-position: 0 -4.8rem
}

.logo-insurance403.w28 {
    background-position: 0 -5.6rem
}

.logo-insurance403.w34 {
    background-position: 0 -6.8rem
}

.logo-insurance403.w36 {
    background-position: 0 -7.2rem
}

.logo-insurance403.w40 {
    background-position: 0 -8rem
}

.logo-insurance403.w44 {
    background-position: 0 -8.8rem
}

.logo-insurance404.w24 {
    background-position: -4.8rem -4.8rem
}

.logo-insurance404.w28 {
    background-position: -5.6rem -5.6rem
}

.logo-insurance404.w34 {
    background-position: -6.8rem -6.8rem
}

.logo-insurance404.w36 {
    background-position: -7.2rem -7.2rem
}

.logo-insurance404.w40 {
    background-position: -8rem -8rem
}

.logo-insurance404.w44 {
    background-position: -8.8rem -8.8rem
}

.logo-insurance405.w24 {
    background-position: -9.6rem 0
}

.logo-insurance405.w28 {
    background-position: -11.2rem 0
}

.logo-insurance405.w34 {
    background-position: -13.6rem 0
}

.logo-insurance405.w36 {
    background-position: -14.4rem 0
}

.logo-insurance405.w40 {
    background-position: -16rem 0
}

.logo-insurance405.w44 {
    background-position: -17.6rem 0
}

.logo-insurance406.w24 {
    background-position: -9.6rem -4.8rem
}

.logo-insurance406.w28 {
    background-position: -11.2rem -5.6rem
}

.logo-insurance406.w34 {
    background-position: -13.6rem -6.8rem
}

.logo-insurance406.w36 {
    background-position: -14.4rem -7.2rem
}

.logo-insurance406.w40 {
    background-position: -16rem -8rem
}

.logo-insurance406.w44 {
    background-position: -17.6rem -8.8rem
}

.logo-insurance431.w24 {
    background-position: 0 -9.6rem
}

.logo-insurance431.w28 {
    background-position: 0 -11.2rem
}

.logo-insurance431.w34 {
    background-position: 0 -13.6rem
}

.logo-insurance431.w36 {
    background-position: 0 -14.4rem
}

.logo-insurance431.w40 {
    background-position: 0 -16rem
}

.logo-insurance431.w44 {
    background-position: 0 -17.6rem
}

.logo-insurance432.w24 {
    background-position: -4.8rem -9.6rem
}

.logo-insurance432.w28 {
    background-position: -5.6rem -11.2rem
}

.logo-insurance432.w34 {
    background-position: -6.8rem -13.6rem
}

.logo-insurance432.w36 {
    background-position: -7.2rem -14.4rem
}

.logo-insurance432.w40 {
    background-position: -8rem -16rem
}

.logo-insurance432.w44 {
    background-position: -8.8rem -17.6rem
}

.logo-insurance433.w24 {
    background-position: -9.6rem -9.6rem
}

.logo-insurance433.w28 {
    background-position: -11.2rem -11.2rem
}

.logo-insurance433.w34 {
    background-position: -13.6rem -13.6rem
}

.logo-insurance433.w36 {
    background-position: -14.4rem -14.4rem
}

.logo-insurance433.w40 {
    background-position: -16rem -16rem
}

.logo-insurance433.w44 {
    background-position: -17.6rem -17.6rem
}

.logo-insurance434.w24 {
    background-position: -14.4rem 0
}

.logo-insurance434.w28 {
    background-position: -16.8rem 0
}

.logo-insurance434.w34 {
    background-position: -20.4rem 0
}

.logo-insurance434.w36 {
    background-position: -21.6rem 0
}

.logo-insurance434.w40 {
    background-position: -24rem 0
}

.logo-insurance434.w44 {
    background-position: -26.4rem 0
}

.logo-insurance435.w24 {
    background-position: -14.4rem -4.8rem
}

.logo-insurance435.w28 {
    background-position: -16.8rem -5.6rem
}

.logo-insurance435.w34 {
    background-position: -20.4rem -6.8rem
}

.logo-insurance435.w36 {
    background-position: -21.6rem -7.2rem
}

.logo-insurance435.w40 {
    background-position: -24rem -8rem
}

.logo-insurance435.w44 {
    background-position: -26.4rem -8.8rem
}

.logo-insurance437.w24 {
    background-position: 0 -14.4rem
}

.logo-insurance437.w28 {
    background-position: 0 -16.8rem
}

.logo-insurance437.w34 {
    background-position: 0 -20.4rem
}

.logo-insurance437.w36 {
    background-position: 0 -21.6rem
}

.logo-insurance437.w40 {
    background-position: 0 -24rem
}

.logo-insurance437.w44 {
    background-position: 0 -26.4rem
}

.logo-insurance438.w24 {
    background-position: -4.8rem -14.4rem
}

.logo-insurance438.w28 {
    background-position: -5.6rem -16.8rem
}

.logo-insurance438.w34 {
    background-position: -6.8rem -20.4rem
}

.logo-insurance438.w36 {
    background-position: -7.2rem -21.6rem
}

.logo-insurance438.w40 {
    background-position: -8rem -24rem
}

.logo-insurance438.w44 {
    background-position: -8.8rem -26.4rem
}

.logo-insurance439.w24 {
    background-position: -9.6rem -14.4rem
}

.logo-insurance439.w28 {
    background-position: -11.2rem -16.8rem
}

.logo-insurance439.w34 {
    background-position: -13.6rem -20.4rem
}

.logo-insurance439.w36 {
    background-position: -14.4rem -21.6rem
}

.logo-insurance439.w40 {
    background-position: -16rem -24rem
}

.logo-insurance439.w44 {
    background-position: -17.6rem -26.4rem
}

.logo-insurance440.w24 {
    background-position: -14.4rem -14.4rem
}

.logo-insurance440.w28 {
    background-position: -16.8rem -16.8rem
}

.logo-insurance440.w34 {
    background-position: -20.4rem -20.4rem
}

.logo-insurance440.w36 {
    background-position: -21.6rem -21.6rem
}

.logo-insurance440.w40 {
    background-position: -24rem -24rem
}

.logo-insurance440.w44 {
    background-position: -26.4rem -26.4rem
}

.logo-insurance441.w24 {
    background-position: -19.2rem 0
}

.logo-insurance441.w28 {
    background-position: -22.4rem 0
}

.logo-insurance441.w34 {
    background-position: -27.2rem 0
}

.logo-insurance441.w36 {
    background-position: -28.8rem 0
}

.logo-insurance441.w40 {
    background-position: -32rem 0
}

.logo-insurance441.w44 {
    background-position: -35.2rem 0
}

.logo-insurance442.w24 {
    background-position: -19.2rem -4.8rem
}

.logo-insurance442.w28 {
    background-position: -22.4rem -5.6rem
}

.logo-insurance442.w34 {
    background-position: -27.2rem -6.8rem
}

.logo-insurance442.w36 {
    background-position: -28.8rem -7.2rem
}

.logo-insurance442.w40 {
    background-position: -32rem -8rem
}

.logo-insurance442.w44 {
    background-position: -35.2rem -8.8rem
}

.logo-insurance443.w24 {
    background-position: -19.2rem -9.6rem
}

.logo-insurance443.w28 {
    background-position: -22.4rem -11.2rem
}

.logo-insurance443.w34 {
    background-position: -27.2rem -13.6rem
}

.logo-insurance443.w36 {
    background-position: -28.8rem -14.4rem
}

.logo-insurance443.w40 {
    background-position: -32rem -16rem
}

.logo-insurance443.w44 {
    background-position: -35.2rem -17.6rem
}

.logo-insurance444.w24 {
    background-position: -19.2rem -14.4rem
}

.logo-insurance444.w28 {
    background-position: -22.4rem -16.8rem
}

.logo-insurance444.w34 {
    background-position: -27.2rem -20.4rem
}

.logo-insurance444.w36 {
    background-position: -28.8rem -21.6rem
}

.logo-insurance444.w40 {
    background-position: -32rem -24rem
}

.logo-insurance444.w44 {
    background-position: -35.2rem -26.4rem
}

.logo-insurance445.w24 {
    background-position: 0 -19.2rem
}

.logo-insurance445.w28 {
    background-position: 0 -22.4rem
}

.logo-insurance445.w34 {
    background-position: 0 -27.2rem
}

.logo-insurance445.w36 {
    background-position: 0 -28.8rem
}

.logo-insurance445.w40 {
    background-position: 0 -32rem
}

.logo-insurance445.w44 {
    background-position: 0 -35.2rem
}

.logo-insurance446.w24 {
    background-position: -4.8rem -19.2rem
}

.logo-insurance446.w28 {
    background-position: -5.6rem -22.4rem
}

.logo-insurance446.w34 {
    background-position: -6.8rem -27.2rem
}

.logo-insurance446.w36 {
    background-position: -7.2rem -28.8rem
}

.logo-insurance446.w40 {
    background-position: -8rem -32rem
}

.logo-insurance446.w44 {
    background-position: -8.8rem -35.2rem
}

.logo-insurance447.w24 {
    background-position: -9.6rem -19.2rem
}

.logo-insurance447.w28 {
    background-position: -11.2rem -22.4rem
}

.logo-insurance447.w34 {
    background-position: -13.6rem -27.2rem
}

.logo-insurance447.w36 {
    background-position: -14.4rem -28.8rem
}

.logo-insurance447.w40 {
    background-position: -16rem -32rem
}

.logo-insurance447.w44 {
    background-position: -17.6rem -35.2rem
}

.logo-insurance448.w24 {
    background-position: -14.4rem -19.2rem
}

.logo-insurance448.w28 {
    background-position: -16.8rem -22.4rem
}

.logo-insurance448.w34 {
    background-position: -20.4rem -27.2rem
}

.logo-insurance448.w36 {
    background-position: -21.6rem -28.8rem
}

.logo-insurance448.w40 {
    background-position: -24rem -32rem
}

.logo-insurance448.w44 {
    background-position: -26.4rem -35.2rem
}

.logo-insurance449.w24 {
    background-position: -19.2rem -19.2rem
}

.logo-insurance449.w28 {
    background-position: -22.4rem -22.4rem
}

.logo-insurance449.w34 {
    background-position: -27.2rem -27.2rem
}

.logo-insurance449.w36 {
    background-position: -28.8rem -28.8rem
}

.logo-insurance449.w40 {
    background-position: -32rem -32rem
}

.logo-insurance449.w44 {
    background-position: -35.2rem -35.2rem
}

.logo-insurance450.w24 {
    background-position: -24rem 0
}

.logo-insurance450.w28 {
    background-position: -28rem 0
}

.logo-insurance450.w34 {
    background-position: -34rem 0
}

.logo-insurance450.w36 {
    background-position: -36rem 0
}

.logo-insurance450.w40 {
    background-position: -40rem 0
}

.logo-insurance450.w44 {
    background-position: -44rem 0
}

.logo-insurance452.w24 {
    background-position: -24rem -4.8rem
}

.logo-insurance452.w28 {
    background-position: -28rem -5.6rem
}

.logo-insurance452.w34 {
    background-position: -34rem -6.8rem
}

.logo-insurance452.w36 {
    background-position: -36rem -7.2rem
}

.logo-insurance452.w40 {
    background-position: -40rem -8rem
}

.logo-insurance452.w44 {
    background-position: -44rem -8.8rem
}

.logo-insurance453.w24 {
    background-position: -24rem -9.6rem
}

.logo-insurance453.w28 {
    background-position: -28rem -11.2rem
}

.logo-insurance453.w34 {
    background-position: -34rem -13.6rem
}

.logo-insurance453.w36 {
    background-position: -36rem -14.4rem
}

.logo-insurance453.w40 {
    background-position: -40rem -16rem
}

.logo-insurance453.w44 {
    background-position: -44rem -17.6rem
}

.logo-insurance454.w24 {
    background-position: -24rem -14.4rem
}

.logo-insurance454.w28 {
    background-position: -28rem -16.8rem
}

.logo-insurance454.w34 {
    background-position: -34rem -20.4rem
}

.logo-insurance454.w36 {
    background-position: -36rem -21.6rem
}

.logo-insurance454.w40 {
    background-position: -40rem -24rem
}

.logo-insurance454.w44 {
    background-position: -44rem -26.4rem
}

.logo-insurance455.w24 {
    background-position: -24rem -19.2rem
}

.logo-insurance455.w28 {
    background-position: -28rem -22.4rem
}

.logo-insurance455.w34 {
    background-position: -34rem -27.2rem
}

.logo-insurance455.w36 {
    background-position: -36rem -28.8rem
}

.logo-insurance455.w40 {
    background-position: -40rem -32rem
}

.logo-insurance455.w44 {
    background-position: -44rem -35.2rem
}

.logo-insurance456.w24 {
    background-position: 0 -24rem
}

.logo-insurance456.w28 {
    background-position: 0 -28rem
}

.logo-insurance456.w34 {
    background-position: 0 -34rem
}

.logo-insurance456.w36 {
    background-position: 0 -36rem
}

.logo-insurance456.w40 {
    background-position: 0 -40rem
}

.logo-insurance456.w44 {
    background-position: 0 -44rem
}

.logo-insurance457.w24 {
    background-position: -4.8rem -24rem
}

.logo-insurance457.w28 {
    background-position: -5.6rem -28rem
}

.logo-insurance457.w34 {
    background-position: -6.8rem -34rem
}

.logo-insurance457.w36 {
    background-position: -7.2rem -36rem
}

.logo-insurance457.w40 {
    background-position: -8rem -40rem
}

.logo-insurance457.w44 {
    background-position: -8.8rem -44rem
}

.logo-insurance458.w24 {
    background-position: -9.6rem -24rem
}

.logo-insurance458.w28 {
    background-position: -11.2rem -28rem
}

.logo-insurance458.w34 {
    background-position: -13.6rem -34rem
}

.logo-insurance458.w36 {
    background-position: -14.4rem -36rem
}

.logo-insurance458.w40 {
    background-position: -16rem -40rem
}

.logo-insurance458.w44 {
    background-position: -17.6rem -44rem
}

.logo-insurance459.w24 {
    background-position: -14.4rem -24rem
}

.logo-insurance459.w28 {
    background-position: -16.8rem -28rem
}

.logo-insurance459.w34 {
    background-position: -20.4rem -34rem
}

.logo-insurance459.w36 {
    background-position: -21.6rem -36rem
}

.logo-insurance459.w40 {
    background-position: -24rem -40rem
}

.logo-insurance459.w44 {
    background-position: -26.4rem -44rem
}

.logo-insurance460.w24 {
    background-position: -19.2rem -24rem
}

.logo-insurance460.w28 {
    background-position: -22.4rem -28rem
}

.logo-insurance460.w34 {
    background-position: -27.2rem -34rem
}

.logo-insurance460.w36 {
    background-position: -28.8rem -36rem
}

.logo-insurance460.w40 {
    background-position: -32rem -40rem
}

.logo-insurance460.w44 {
    background-position: -35.2rem -44rem
}

.logo-insuranceCGI.w24 {
    background-position: -24rem -24rem
}

.logo-insuranceCGI.w28 {
    background-position: -28rem -28rem
}

.logo-insuranceCGI.w34 {
    background-position: -34rem -34rem
}

.logo-insuranceCGI.w36 {
    background-position: -36rem -36rem
}

.logo-insuranceCGI.w40 {
    background-position: -40rem -40rem
}

.logo-insuranceCGI.w44 {
    background-position: -44rem -44rem
}

.logo-insuranceMGI.w24 {
    background-position: -28.8rem 0
}

.logo-insuranceMGI.w28 {
    background-position: -33.6rem 0
}

.logo-insuranceMGI.w34 {
    background-position: -40.8rem 0
}

.logo-insuranceMGI.w36 {
    background-position: -43.2rem 0
}

.logo-insuranceMGI.w40 {
    background-position: -48rem 0
}

.logo-insuranceMGI.w44 {
    background-position: -52.8rem 0
}

.logo-insuranceMLI.w24 {
    background-position: -28.8rem -4.8rem
}

.logo-insuranceMLI.w28 {
    background-position: -33.6rem -5.6rem
}

.logo-insuranceMLI.w34 {
    background-position: -40.8rem -6.8rem
}

.logo-insuranceMLI.w36 {
    background-position: -43.2rem -7.2rem
}

.logo-insuranceMLI.w40 {
    background-position: -48rem -8rem
}

.logo-insuranceMLI.w44 {
    background-position: -52.8rem -8.8rem
}

.logo-insuranceSEI.w24 {
    background-position: -28.8rem -9.6rem
}

.logo-insuranceSEI.w28 {
    background-position: -33.6rem -11.2rem
}

.logo-insuranceSEI.w34 {
    background-position: -40.8rem -13.6rem
}

.logo-insuranceSEI.w36 {
    background-position: -43.2rem -14.4rem
}

.logo-insuranceSEI.w40 {
    background-position: -48rem -16rem
}

.logo-insuranceSEI.w44 {
    background-position: -52.8rem -17.6rem
}

.card-group .card-header .logo-img-figure [class*="logo-insurance"] {
    margin-right: 1.2rem;
    height: 3.4rem
}

/*! component element icon sprite 오픈뱅킹 보험 기관 로고 - rect FETASK-1783 */

[class*="logo-rect-ins"] {
    display: inline-block;
    overflow: hidden;
    width: 100%;
    position: relative;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: left center
}

.title-group.center [class*="logo-rect-ins"] {
    background-position: 50% 50%
}

[class*="logo-rect-ins"].h22 {
    height: 2.2rem
}

/*! 교보라이프플래닛생명 */

.logo-rect-ins433,
.logo-rect-insL43 {
    background-image: url(../../img/mmk/common/logo/insurance/logo_ins433.png)
}

/*! 교보생명 */

.logo-rect-ins436,
.logo-rect-insL05 {
    background-image: url(../../img/mmk/common/logo/insurance/logo_ins436.png)
}

/*! 에이비엘생명 */

.logo-rect-ins437,
.logo-rect-insL02 {
    background-image: url(../../img/mmk/common/logo/insurance/logo_ins437.png)
}

/*! 현대해상 */

.logo-rect-ins442,
.logo-rect-insN09 {
    background-image: url(../../img/mmk/common/logo/insurance/logo_ins442.png)
}

/*! DB손해보험 */

.logo-rect-ins443,
.logo-rect-insN13 {
    background-image: url(../../img/mmk/common/logo/insurance/logo_ins443.png)
}

/*! KB손해보험 */

.logo-rect-ins444,
.logo-rect-insN10 {
    background-image: url(../../img/mmk/common/logo/insurance/logo_ins444.png)
}

/*! 메리츠화재 */

.logo-rect-ins448,
.logo-rect-insN01 {
    background-image: url(../../img/mmk/common/logo/insurance/logo_ins448.png)
}

/*! DB생명보험 */

.logo-rect-ins457,
.logo-rect-insL71 {
    background-image: url(../../img/mmk/common/logo/insurance/logo_ins457.png)
}

/*! component element icon sprite 오픈뱅킹 캐피탈 기관 로고 - circle FETASK-707 */

[class*="logo-openbankingandcapital"] {
    display: inline-block;
    overflow: hidden;
    border-radius: 50%;
    position: relative
}

[class*="logo-openbankingandcapital"].w24 {
    background-image: url(../../img/mmk/common/sprite_logo_openbankingandcapital.png?timestamp=1683857283835);
    width: 2.4rem;
    height: 2.4rem;
    background-size: 2.4rem 2.4rem
}

[class*="logo-openbankingandcapital"].w28 {
    background-image: url(../../img/mmk/common/sprite_logo_openbankingandcapital.png?timestamp=1683857283835);
    width: 2.8rem;
    height: 2.8rem;
    background-size: 2.8rem 2.8rem
}

[class*="logo-openbankingandcapital"].w34 {
    background-image: url(../../img/mmk/common/sprite_logo_openbankingandcapital.png?timestamp=1683857283835);
    width: 3.4rem;
    height: 3.4rem;
    background-size: 3.4rem 3.4rem
}

[class*="logo-openbankingandcapital"].w36 {
    background-image: url(../../img/mmk/common/sprite_logo_openbankingandcapital.png?timestamp=1683857283835);
    width: 3.6rem;
    height: 3.6rem;
    background-size: 3.6rem 3.6rem
}

[class*="logo-openbankingandcapital"].w40 {
    background-image: url(../../img/mmk/common/sprite_logo_openbankingandcapital.png?timestamp=1683857283835);
    width: 4rem;
    height: 4rem;
    background-size: 4rem 4rem
}

[class*="logo-openbankingandcapital"].w44 {
    background-image: url(../../img/mmk/common/sprite_logo_openbankingandcapital.png?timestamp=1683857283835);
    width: 4.4rem;
    height: 4.4rem;
    background-size: 4.4rem 4.4rem
}

/*! 현대캐피탈 */

.logo-openbankingandcapital-304.w24 {
    background-position: 0 0
}

.logo-openbankingandcapital-304.w28 {
    background-position: 0 0
}

.logo-openbankingandcapital-304.w34 {
    background-position: 0 0
}

.logo-openbankingandcapital-304.w36 {
    background-position: 0 0
}

.logo-openbankingandcapital-304.w40 {
    background-position: 0 0
}

.logo-openbankingandcapital-304.w44 {
    background-position: 0 0
}

/*! component element icon sprite 페이로고 - circle FETASK-1248 제휴사 코드를 대문자로 수정 (logo-pay-F00) */

[class*="logo-apt"],
[class*="logo-pay"] {
    display: inline-block;
    overflow: hidden;
    border-radius: 50%;
    position: relative
}

[class*="logo-apt"].w24,
[class*="logo-pay"].w24 {
    background-image: url(../../img/mmk/common/sprite_pay.png?timestamp=1726107914732);
    width: 2.4rem;
    height: 2.4rem;
    background-size: 31.2rem 26.43636rem
}

[class*="logo-apt"].w34,
[class*="logo-pay"].w34 {
    background-image: url(../../img/mmk/common/sprite_pay.png?timestamp=1726107914732);
    width: 3.4rem;
    height: 3.4rem;
    background-size: 44.2rem 37.45152rem
}

[class*="logo-apt"].w36,
[class*="logo-pay"].w36 {
    background-image: url(../../img/mmk/common/sprite_pay.png?timestamp=1726107914732);
    width: 3.6rem;
    height: 3.6rem;
    background-size: 46.8rem 39.65455rem
}

[class*="logo-apt"].w40,
[class*="logo-pay"].w40 {
    background-image: url(../../img/mmk/common/sprite_pay.png?timestamp=1726107914732);
    width: 4rem;
    height: 4rem;
    background-size: 52rem 44.06061rem
}

[class*="logo-apt"].w44,
[class*="logo-pay"].w44 {
    background-image: url(../../img/mmk/common/sprite_pay.png?timestamp=1726107914732);
    width: 4.4rem;
    height: 4.4rem;
    background-size: 57.2rem 48.46667rem
}

[class*="logo-apt"].w24,
[class*="logo-pay"].w24 {
    background-position: -14.4rem -24.03636rem
}

[class*="logo-apt"].w34,
[class*="logo-pay"].w34 {
    background-position: -20.4rem -34.05152rem
}

[class*="logo-apt"].w36,
[class*="logo-pay"].w36 {
    background-position: -21.6rem -36.05455rem
}

[class*="logo-apt"].w40,
[class*="logo-pay"].w40 {
    background-position: -24rem -40.06061rem
}

[class*="logo-apt"].w44,
[class*="logo-pay"].w44 {
    background-position: -26.4rem -44.06667rem
}

/*! 지머니트렌스 */

.logo-pay-F01.w24,
.logo-pay-f01.w24 {
    background-position: -4.8rem -4.81818rem
}

.logo-pay-F01.w34,
.logo-pay-f01.w34 {
    background-position: -6.8rem -6.82576rem
}

.logo-pay-F01.w36,
.logo-pay-f01.w36 {
    background-position: -7.2rem -7.22727rem
}

.logo-pay-F01.w40,
.logo-pay-f01.w40 {
    background-position: -8rem -8.0303rem
}

.logo-pay-F01.w44,
.logo-pay-f01.w44 {
    background-position: -8.8rem -8.83333rem
}

/*! 핀샷 */

.logo-pay-F02.w24,
.logo-pay-f02.w24 {
    background-position: -9.6rem -4.81818rem
}

.logo-pay-F02.w34,
.logo-pay-f02.w34 {
    background-position: -13.6rem -6.82576rem
}

.logo-pay-F02.w36,
.logo-pay-f02.w36 {
    background-position: -14.4rem -7.22727rem
}

.logo-pay-F02.w40,
.logo-pay-f02.w40 {
    background-position: -16rem -8.0303rem
}

.logo-pay-F02.w44,
.logo-pay-f02.w44 {
    background-position: -17.6rem -8.83333rem
}

/*! 글로벌머니익스프레스 */

.logo-pay-F03.w24,
.logo-pay-f03.w24 {
    background-position: -14.4rem 0
}

.logo-pay-F03.w34,
.logo-pay-f03.w34 {
    background-position: -20.4rem 0
}

.logo-pay-F03.w36,
.logo-pay-f03.w36 {
    background-position: -21.6rem 0
}

.logo-pay-F03.w40,
.logo-pay-f03.w40 {
    background-position: -24rem 0
}

.logo-pay-F03.w44,
.logo-pay-f03.w44 {
    background-position: -26.4rem 0
}

/*! 한패스 */

.logo-pay-F04.w24,
.logo-pay-f04.w24 {
    background-position: -14.4rem -4.8rem
}

.logo-pay-F04.w34,
.logo-pay-f04.w34 {
    background-position: -20.4rem -6.8rem
}

.logo-pay-F04.w36,
.logo-pay-f04.w36 {
    background-position: -21.6rem -7.2rem
}

.logo-pay-F04.w40,
.logo-pay-f04.w40 {
    background-position: -24rem -8rem
}

.logo-pay-F04.w44,
.logo-pay-f04.w44 {
    background-position: -26.4rem -8.8rem
}

/*! 트래블월렛 */

.logo-pay-F05.w24,
.logo-pay-f05.w24 {
    background-position: 0 -9.63636rem
}

.logo-pay-F05.w34,
.logo-pay-f05.w34 {
    background-position: 0 -13.65152rem
}

.logo-pay-F05.w36,
.logo-pay-f05.w36 {
    background-position: 0 -14.45455rem
}

.logo-pay-F05.w40,
.logo-pay-f05.w40 {
    background-position: 0 -16.06061rem
}

.logo-pay-F05.w44,
.logo-pay-f05.w44 {
    background-position: 0 -17.66667rem
}

/*! 토스*/

.logo-apt-TSS.w24,
.logo-pay-F06.w24,
.logo-pay-f06.w24 {
    background-position: -4.8rem -9.63636rem
}

.logo-apt-TSS.w34,
.logo-pay-F06.w34,
.logo-pay-f06.w34 {
    background-position: -6.8rem -13.65152rem
}

.logo-apt-TSS.w36,
.logo-pay-F06.w36,
.logo-pay-f06.w36 {
    background-position: -7.2rem -14.45455rem
}

.logo-apt-TSS.w40,
.logo-pay-F06.w40,
.logo-pay-f06.w40 {
    background-position: -8rem -16.06061rem
}

.logo-apt-TSS.w44,
.logo-pay-F06.w44,
.logo-pay-f06.w44 {
    background-position: -8.8rem -17.66667rem
}

/*! 핀크 */

.logo-pay-F07.w24,
.logo-pay-f07.w24 {
    background-position: -9.6rem -9.63636rem
}

.logo-pay-F07.w34,
.logo-pay-f07.w34 {
    background-position: -13.6rem -13.65152rem
}

.logo-pay-F07.w36,
.logo-pay-f07.w36 {
    background-position: -14.4rem -14.45455rem
}

.logo-pay-F07.w40,
.logo-pay-f07.w40 {
    background-position: -16rem -16.06061rem
}

.logo-pay-F07.w44,
.logo-pay-f07.w44 {
    background-position: -17.6rem -17.66667rem
}

/*! 핀트 */

.logo-pay-F08.w24,
.logo-pay-f08.w24 {
    background-position: -14.4rem -9.63636rem
}

.logo-pay-F08.w34,
.logo-pay-f08.w34 {
    background-position: -20.4rem -13.65152rem
}

.logo-pay-F08.w36,
.logo-pay-f08.w36 {
    background-position: -21.6rem -14.45455rem
}

.logo-pay-F08.w40,
.logo-pay-f08.w40 {
    background-position: -24rem -16.06061rem
}

.logo-pay-F08.w44,
.logo-pay-f08.w44 {
    background-position: -26.4rem -17.66667rem
}

/*! 카카오페이 */

.logo-apt-KKP.w24,
.logo-pay-F09.w24,
.logo-pay-f09.w24 {
    background-position: -19.2rem 0
}

.logo-apt-KKP.w34,
.logo-pay-F09.w34,
.logo-pay-f09.w34 {
    background-position: -27.2rem 0
}

.logo-apt-KKP.w36,
.logo-pay-F09.w36,
.logo-pay-f09.w36 {
    background-position: -28.8rem 0
}

.logo-apt-KKP.w40,
.logo-pay-F09.w40,
.logo-pay-f09.w40 {
    background-position: -32rem 0
}

.logo-apt-KKP.w44,
.logo-pay-F09.w44,
.logo-pay-f09.w44 {
    background-position: -35.2rem 0
}

/*! 세틀뱅크 */

.logo-pay-F10.w24,
.logo-pay-f10.w24 {
    background-position: -19.2rem -4.8rem
}

.logo-pay-F10.w34,
.logo-pay-f10.w34 {
    background-position: -27.2rem -6.8rem
}

.logo-pay-F10.w36,
.logo-pay-f10.w36 {
    background-position: -28.8rem -7.2rem
}

.logo-pay-F10.w40,
.logo-pay-f10.w40 {
    background-position: -32rem -8rem
}

.logo-pay-F10.w44,
.logo-pay-f10.w44 {
    background-position: -35.2rem -8.8rem
}

/*! 뱅크샐러드 */

.logo-pay-F11.w24,
.logo-pay-f11.w24 {
    background-position: -19.2rem -9.6rem
}

.logo-pay-F11.w34,
.logo-pay-f11.w34 {
    background-position: -27.2rem -13.6rem
}

.logo-pay-F11.w36,
.logo-pay-f11.w36 {
    background-position: -28.8rem -14.4rem
}

.logo-pay-F11.w40,
.logo-pay-f11.w40 {
    background-position: -32rem -16rem
}

.logo-pay-F11.w44,
.logo-pay-f11.w44 {
    background-position: -35.2rem -17.6rem
}

/*! 쿠콘 */

.logo-pay-F12.w24,
.logo-pay-f12.w24 {
    background-position: 0 -14.43636rem
}

.logo-pay-F12.w34,
.logo-pay-f12.w34 {
    background-position: 0 -20.45152rem
}

.logo-pay-F12.w36,
.logo-pay-f12.w36 {
    background-position: 0 -21.65455rem
}

.logo-pay-F12.w40,
.logo-pay-f12.w40 {
    background-position: 0 -24.06061rem
}

.logo-pay-F12.w44,
.logo-pay-f12.w44 {
    background-position: 0 -26.46667rem
}

/*! 머니트리 */

.logo-pay-F13.w24,
.logo-pay-f13.w24 {
    background-position: -4.8rem -14.43636rem
}

.logo-pay-F13.w34,
.logo-pay-f13.w34 {
    background-position: -6.8rem -20.45152rem
}

.logo-pay-F13.w36,
.logo-pay-f13.w36 {
    background-position: -7.2rem -21.65455rem
}

.logo-pay-F13.w40,
.logo-pay-f13.w40 {
    background-position: -8rem -24.06061rem
}

.logo-pay-F13.w44,
.logo-pay-f13.w44 {
    background-position: -8.8rem -26.46667rem
}

/*! 코나아이 */

.logo-pay-F14.w24,
.logo-pay-f14.w24 {
    background-position: -9.6rem -14.43636rem
}

.logo-pay-F14.w34,
.logo-pay-f14.w34 {
    background-position: -13.6rem -20.45152rem
}

.logo-pay-F14.w36,
.logo-pay-f14.w36 {
    background-position: -14.4rem -21.65455rem
}

.logo-pay-F14.w40,
.logo-pay-f14.w40 {
    background-position: -16rem -24.06061rem
}

.logo-pay-F14.w44,
.logo-pay-f14.w44 {
    background-position: -17.6rem -26.46667rem
}

/*! 쿠팡페이 */

.logo-pay-F15.w24,
.logo-pay-f15.w24 {
    background-position: -14.4rem -14.43636rem
}

.logo-pay-F15.w34,
.logo-pay-f15.w34 {
    background-position: -20.4rem -20.45152rem
}

.logo-pay-F15.w36,
.logo-pay-f15.w36 {
    background-position: -21.6rem -21.65455rem
}

.logo-pay-F15.w40,
.logo-pay-f15.w40 {
    background-position: -24rem -24.06061rem
}

.logo-pay-F15.w44,
.logo-pay-f15.w44 {
    background-position: -26.4rem -26.46667rem
}

/*! 네이버페이 */

.logo-apt-NVP.w24,
.logo-pay-F16.w24,
.logo-pay-f16.w24 {
    background-position: -19.2rem -14.43636rem
}

.logo-apt-NVP.w34,
.logo-pay-F16.w34,
.logo-pay-f16.w34 {
    background-position: -27.2rem -20.45152rem
}

.logo-apt-NVP.w36,
.logo-pay-F16.w36,
.logo-pay-f16.w36 {
    background-position: -28.8rem -21.65455rem
}

.logo-apt-NVP.w40,
.logo-pay-F16.w40,
.logo-pay-f16.w40 {
    background-position: -32rem -24.06061rem
}

.logo-apt-NVP.w44,
.logo-pay-F16.w44,
.logo-pay-f16.w44 {
    background-position: -35.2rem -26.46667rem
}

/*! 에스에스지닷컴/SSG페이 */

.logo-pay-F17.w24,
.logo-pay-f17.w24 {
    background-position: -24rem 0
}

.logo-pay-F17.w34,
.logo-pay-f17.w34 {
    background-position: -34rem 0
}

.logo-pay-F17.w36,
.logo-pay-f17.w36 {
    background-position: -36rem 0
}

.logo-pay-F17.w40,
.logo-pay-f17.w40 {
    background-position: -40rem 0
}

.logo-pay-F17.w44,
.logo-pay-f17.w44 {
    background-position: -44rem 0
}

/*! 티머니 */

.logo-pay-F18.w24,
.logo-pay-f18.w24 {
    background-position: -24rem -4.8rem
}

.logo-pay-F18.w34,
.logo-pay-f18.w34 {
    background-position: -34rem -6.8rem
}

.logo-pay-F18.w36,
.logo-pay-f18.w36 {
    background-position: -36rem -7.2rem
}

.logo-pay-F18.w40,
.logo-pay-f18.w40 {
    background-position: -40rem -8rem
}

.logo-pay-F18.w44,
.logo-pay-f18.w44 {
    background-position: -44rem -8.8rem
}

/*! 페이코 */

.logo-pay-F19.w24,
.logo-pay-f19.w24 {
    background-position: -24rem -9.6rem
}

.logo-pay-F19.w34,
.logo-pay-f19.w34 {
    background-position: -34rem -13.6rem
}

.logo-pay-F19.w36,
.logo-pay-f19.w36 {
    background-position: -36rem -14.4rem
}

.logo-pay-F19.w40,
.logo-pay-f19.w40 {
    background-position: -40rem -16rem
}

.logo-pay-F19.w44,
.logo-pay-f19.w44 {
    background-position: -44rem -17.6rem
}

/*! 십일번가 */

.logo-pay-F20.w24,
.logo-pay-f20.w24 {
    background-position: -24rem -14.4rem
}

.logo-pay-F20.w34,
.logo-pay-f20.w34 {
    background-position: -34rem -20.4rem
}

.logo-pay-F20.w36,
.logo-pay-f20.w36 {
    background-position: -36rem -21.6rem
}

.logo-pay-F20.w40,
.logo-pay-f20.w40 {
    background-position: -40rem -24rem
}

.logo-pay-F20.w44,
.logo-pay-f20.w44 {
    background-position: -44rem -26.4rem
}

/*! 케이에스넷 */

.logo-pay-F21.w24,
.logo-pay-f21.w24 {
    background-position: 0 -19.23636rem
}

.logo-pay-F21.w34,
.logo-pay-f21.w34 {
    background-position: 0 -27.25152rem
}

.logo-pay-F21.w36,
.logo-pay-f21.w36 {
    background-position: 0 -28.85455rem
}

.logo-pay-F21.w40,
.logo-pay-f21.w40 {
    background-position: 0 -32.06061rem
}

.logo-pay-F21.w44,
.logo-pay-f21.w44 {
    background-position: 0 -35.26667rem
}

/*! DGB유페이/원패스 */

.logo-pay-F22.w24,
.logo-pay-f22.w24 {
    background-position: -4.8rem -19.23636rem
}

.logo-pay-F22.w34,
.logo-pay-f22.w34 {
    background-position: -6.8rem -27.25152rem
}

.logo-pay-F22.w36,
.logo-pay-f22.w36 {
    background-position: -7.2rem -28.85455rem
}

.logo-pay-F22.w40,
.logo-pay-f22.w40 {
    background-position: -8rem -32.06061rem
}

.logo-pay-F22.w44,
.logo-pay-f22.w44 {
    background-position: -8.8rem -35.26667rem
}

/*! 롯데멤버스 */

.logo-pay-F23.w24,
.logo-pay-f23.w24 {
    background-position: -9.6rem -19.23636rem
}

.logo-pay-F23.w34,
.logo-pay-f23.w34 {
    background-position: -13.6rem -27.25152rem
}

.logo-pay-F23.w36,
.logo-pay-f23.w36 {
    background-position: -14.4rem -28.85455rem
}

.logo-pay-F23.w40,
.logo-pay-f23.w40 {
    background-position: -16rem -32.06061rem
}

.logo-pay-F23.w44,
.logo-pay-f23.w44 {
    background-position: -17.6rem -35.26667rem
}

/*! 오케이인베스트먼트파트너스/올리고 */

.logo-pay-F24.w24,
.logo-pay-f24.w24 {
    background-position: -14.4rem -19.23636rem
}

.logo-pay-F24.w34,
.logo-pay-f24.w34 {
    background-position: -20.4rem -27.25152rem
}

.logo-pay-F24.w36,
.logo-pay-f24.w36 {
    background-position: -21.6rem -28.85455rem
}

.logo-pay-F24.w40,
.logo-pay-f24.w40 {
    background-position: -24rem -32.06061rem
}

.logo-pay-F24.w44,
.logo-pay-f24.w44 {
    background-position: -26.4rem -35.26667rem
}

/*! 나이스정보통신/나이스지역화폐 */

.logo-pay-F25.w24,
.logo-pay-f25.w24 {
    background-position: -19.2rem -19.23636rem
}

.logo-pay-F25.w34,
.logo-pay-f25.w34 {
    background-position: -27.2rem -27.25152rem
}

.logo-pay-F25.w36,
.logo-pay-f25.w36 {
    background-position: -28.8rem -28.85455rem
}

.logo-pay-F25.w40,
.logo-pay-f25.w40 {
    background-position: -32rem -32.06061rem
}

.logo-pay-F25.w44,
.logo-pay-f25.w44 {
    background-position: -35.2rem -35.26667rem
}

/*! 지마켓글로벌/스마일페이 */

.logo-pay-F26.w24,
.logo-pay-f26.w24 {
    background-position: -24rem -19.23636rem
}

.logo-pay-F26.w34,
.logo-pay-f26.w34 {
    background-position: -34rem -27.25152rem
}

.logo-pay-F26.w36,
.logo-pay-f26.w36 {
    background-position: -36rem -28.85455rem
}

.logo-pay-F26.w40,
.logo-pay-f26.w40 {
    background-position: -40rem -32.06061rem
}

.logo-pay-F26.w44,
.logo-pay-f26.w44 {
    background-position: -44rem -35.26667rem
}

/*! 차이코퍼레이션/차이 */

.logo-pay-F27.w24,
.logo-pay-f27.w24 {
    background-position: -28.8rem 0
}

.logo-pay-F27.w34,
.logo-pay-f27.w34 {
    background-position: -40.8rem 0
}

.logo-pay-F27.w36,
.logo-pay-f27.w36 {
    background-position: -43.2rem 0
}

.logo-pay-F27.w40,
.logo-pay-f27.w40 {
    background-position: -48rem 0
}

.logo-pay-F27.w44,
.logo-pay-f27.w44 {
    background-position: -52.8rem 0
}

/*! 다날 */

.logo-pay-F28.w24,
.logo-pay-f28.w24 {
    background-position: -28.8rem -4.8rem
}

.logo-pay-F28.w34,
.logo-pay-f28.w34 {
    background-position: -40.8rem -6.8rem
}

.logo-pay-F28.w36,
.logo-pay-f28.w36 {
    background-position: -43.2rem -7.2rem
}

.logo-pay-F28.w40,
.logo-pay-f28.w40 {
    background-position: -48rem -8rem
}

.logo-pay-F28.w44,
.logo-pay-f28.w44 {
    background-position: -52.8rem -8.8rem
}

/*! 웰컴페이먼츠 */

.logo-pay-F29.w24,
.logo-pay-f29.w24 {
    background-position: -28.8rem -9.6rem
}

.logo-pay-F29.w34,
.logo-pay-f29.w34 {
    background-position: -40.8rem -13.6rem
}

.logo-pay-F29.w36,
.logo-pay-f29.w36 {
    background-position: -43.2rem -14.4rem
}

.logo-pay-F29.w40,
.logo-pay-f29.w40 {
    background-position: -48rem -16rem
}

.logo-pay-F29.w44,
.logo-pay-f29.w44 {
    background-position: -52.8rem -17.6rem
}

/*! 에스케이플레닛/OK캐쉬백 */

.logo-pay-F30.w24,
.logo-pay-f30.w24 {
    background-position: -28.8rem -14.4rem
}

.logo-pay-F30.w34,
.logo-pay-f30.w34 {
    background-position: -40.8rem -20.4rem
}

.logo-pay-F30.w36,
.logo-pay-f30.w36 {
    background-position: -43.2rem -21.6rem
}

.logo-pay-F30.w40,
.logo-pay-f30.w40 {
    background-position: -48rem -24rem
}

.logo-pay-F30.w44,
.logo-pay-f30.w44 {
    background-position: -52.8rem -26.4rem
}

/*! 아이씨비 */

.logo-pay-F31.w24,
.logo-pay-f31.w24 {
    background-position: -28.8rem -19.2rem
}

.logo-pay-F31.w34,
.logo-pay-f31.w34 {
    background-position: -40.8rem -27.2rem
}

.logo-pay-F31.w36,
.logo-pay-f31.w36 {
    background-position: -43.2rem -28.8rem
}

.logo-pay-F31.w40,
.logo-pay-f31.w40 {
    background-position: -48rem -32rem
}

.logo-pay-F31.w44,
.logo-pay-f31.w44 {
    background-position: -52.8rem -35.2rem
}

/*! KG모빌리언스 */

.logo-pay-F32.w24,
.logo-pay-f32.w24 {
    background-position: 0 -24.03636rem
}

.logo-pay-F32.w34,
.logo-pay-f32.w34 {
    background-position: 0 -34.05152rem
}

.logo-pay-F32.w36,
.logo-pay-f32.w36 {
    background-position: 0 -36.05455rem
}

.logo-pay-F32.w40,
.logo-pay-f32.w40 {
    background-position: 0 -40.06061rem
}

.logo-pay-F32.w44,
.logo-pay-f32.w44 {
    background-position: 0 -44.06667rem
}

/*! 카카오모빌리티 */

.logo-pay-F33.w24,
.logo-pay-f33.w24 {
    background-position: -4.8rem -24.03636rem
}

.logo-pay-F33.w34,
.logo-pay-f33.w34 {
    background-position: -6.8rem -34.05152rem
}

.logo-pay-F33.w36,
.logo-pay-f33.w36 {
    background-position: -7.2rem -36.05455rem
}

.logo-pay-F33.w40,
.logo-pay-f33.w40 {
    background-position: -8rem -40.06061rem
}

.logo-pay-F33.w44,
.logo-pay-f33.w44 {
    background-position: -8.8rem -44.06667rem
}

/*! 당근페이 */

.logo-pay-F36.w24,
.logo-pay-f36.w24 {
    background-position: 0 0
}

.logo-pay-F36.w34,
.logo-pay-f36.w34 {
    background-position: 0 0
}

.logo-pay-F36.w36,
.logo-pay-f36.w36 {
    background-position: 0 0
}

.logo-pay-F36.w40,
.logo-pay-f36.w40 {
    background-position: 0 0
}

.logo-pay-F36.w44,
.logo-pay-f36.w44 {
    background-position: 0 0
}

/*! Finddy */

.logo-pay-F38.w24,
.logo-pay-f38.w24 {
    background-position: -4.8rem 0
}

.logo-pay-F38.w34,
.logo-pay-f38.w34 {
    background-position: -6.8rem 0
}

.logo-pay-F38.w36,
.logo-pay-f38.w36 {
    background-position: -7.2rem 0
}

.logo-pay-F38.w40,
.logo-pay-f38.w40 {
    background-position: -8rem 0
}

.logo-pay-F38.w44,
.logo-pay-f38.w44 {
    background-position: -8.8rem 0
}

/*! 비즈플레이 */

.logo-pay-F39.w24,
.logo-pay-f39.w24 {
    background-position: -9.6rem 0
}

.logo-pay-F39.w34,
.logo-pay-f39.w34 {
    background-position: -13.6rem 0
}

.logo-pay-F39.w36,
.logo-pay-f39.w36 {
    background-position: -14.4rem 0
}

.logo-pay-F39.w40,
.logo-pay-f39.w40 {
    background-position: -16rem 0
}

.logo-pay-F39.w44,
.logo-pay-f39.w44 {
    background-position: -17.6rem 0
}

/*! 하이픈코퍼레이션 */

.logo-pay-F43.w24,
.logo-pay-f43.w24 {
    background-position: 0 -4.81818rem
}

.logo-pay-F43.w34,
.logo-pay-f43.w34 {
    background-position: 0 -6.82576rem
}

.logo-pay-F43.w36,
.logo-pay-f43.w36 {
    background-position: 0 -7.22727rem
}

.logo-pay-F43.w40,
.logo-pay-f43.w40 {
    background-position: 0 -8.0303rem
}

.logo-pay-F43.w44,
.logo-pay-f43.w44 {
    background-position: 0 -8.83333rem
}

/*! 핀다*/

.logo-apt-FID.w24,
.logo-pay-F44.w24,
.logo-pay-f44.w24 {
    background-position: -9.6rem -24.03636rem
}

.logo-apt-FID.w34,
.logo-pay-F44.w34,
.logo-pay-f44.w34 {
    background-position: -13.6rem -34.05152rem
}

.logo-apt-FID.w36,
.logo-pay-F44.w36,
.logo-pay-f44.w36 {
    background-position: -14.4rem -36.05455rem
}

.logo-apt-FID.w40,
.logo-pay-F44.w40,
.logo-pay-f44.w40 {
    background-position: -16rem -40.06061rem
}

.logo-apt-FID.w44,
.logo-pay-F44.w44,
.logo-pay-f44.w44 {
    background-position: -17.6rem -44.06667rem
}

/*! component element icon sprite 케이뱅크 체크카드, 신용카드 */

[class*="ico-main-card"] {
    display: inline-block;
    position: relative
}

[class*="ico-main-card"].w22 {
    background-image: url(../../img/mmk/common/sprite_main_card.png?timestamp=1747292730496);
    width: 2.2rem;
    height: 3.476rem;
    background-size: 331.34933rem 3.476rem
}

[class*="ico-main-card"].w23 {
    background-image: url(../../img/mmk/common/sprite_main_card.png?timestamp=1747292730496);
    width: 2.3rem;
    height: 3.634rem;
    background-size: 346.41067rem 3.634rem
}

[class*="ico-main-card"].w27 {
    background-image: url(../../img/mmk/common/sprite_main_card.png?timestamp=1747292730496);
    width: 2.7rem;
    height: 4.266rem;
    background-size: 406.656rem 4.266rem
}

[class*="ico-main-card"].w28 {
    background-image: url(../../img/mmk/common/sprite_main_card.png?timestamp=1747292730496);
    width: 2.8rem;
    height: 4.424rem;
    background-size: 421.71733rem 4.424rem
}

[class*="ico-main-card"].w30 {
    background-image: url(../../img/mmk/common/sprite_main_card.png?timestamp=1747292730496);
    width: 3rem;
    height: 4.74rem;
    background-size: 451.84rem 4.74rem
}

[class*="ico-main-card"].w32 {
    background-image: url(../../img/mmk/common/sprite_main_card.png?timestamp=1747292730496);
    width: 3.2rem;
    height: 5.056rem;
    background-size: 481.96267rem 5.056rem
}

[class*="ico-main-card"].w43 {
    background-image: url(../../img/mmk/common/sprite_main_card.png?timestamp=1747292730496);
    width: 4.3rem;
    height: 6.794rem;
    background-size: 647.63733rem 6.794rem
}

[class*="ico-main-card"].w150 {
    background-image: url(../../img/mmk/common/sprite_main_card.png?timestamp=1747292730496);
    width: 15rem;
    height: 23.7rem;
    background-size: 2259.2rem 23.7rem
}

[class*="ico-main-card"].all {
    background-image: url(../../img/mmk/common/card/allcard.png);
    background-size: contain
}

/*! component element icon sprite  로고 - 체크/신용 카드 FETASK-1868 [KDS] 3.47459 반영  CHPFMTASK-1131 이미지 폴더위치 변경 앞면 */

[class*="ico-main-card-"] {
    background: url(../../img/mmk/common/card_img/ico_main_card_default.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 카드 플레이트_케이뱅크 ONE 체크카드 1 */

.ico-main-card-103895-A {
    background: url(../../img/mmk/common/card_img/ico_main_card_103895_A.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 카드 플레이트_케이뱅크 ONE 체크카드 2 */

.ico-main-card-103895-B {
    background: url(../../img/mmk/common/card_img/ico_main_card_103895_B.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 카드 플레이트_케이뱅크 ONE 체크카드 3 */

.ico-main-card-103895-C {
    background: url(../../img/mmk/common/card_img/ico_main_card_103895_C.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 카드 플레이트_케이뱅크 ONE 체크카드 깜자 1 */

.ico-main-card-103895-D {
    background: url(../../img/mmk/common/card_img/ico_main_card_103895_D.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 카드 플레이트_케이뱅크 ONE 체크카드 깜자 2 */

.ico-main-card-103895-E {
    background: url(../../img/mmk/common/card_img/ico_main_card_103895_E.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 카드 플레이트_케이뱅크 ONE 체크카드 깜자 3 */

.ico-main-card-103895-F {
    background: url(../../img/mmk/common/card_img/ico_main_card_103895_F.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 카드 플레이트_케이뱅크 ONE 체크카드 1 교통카드 가능 */

.ico-main-card-104010-A {
    background: url(../../img/mmk/common/card_img/ico_main_card_104010_A.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 카드 플레이트_케이뱅크 ONE 체크카드 2 교통카드 가능 */

.ico-main-card-104010-B {
    background: url(../../img/mmk/common/card_img/ico_main_card_104010_B.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 카드 플레이트_케이뱅크 ONE 체크카드 3 교통카드 가능 */

.ico-main-card-104010-C {
    background: url(../../img/mmk/common/card_img/ico_main_card_104010_C.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 카드 플레이트_케이뱅크 ONE 체크카드 깜자 1 교통카드 가능 */

.ico-main-card-104010-D {
    background: url(../../img/mmk/common/card_img/ico_main_card_104010_D.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 카드 플레이트_케이뱅크 ONE 체크카드 깜자 2 교통카드 가능 */

.ico-main-card-104010-E {
    background: url(../../img/mmk/common/card_img/ico_main_card_104010_E.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 카드 플레이트_케이뱅크 ONE 체크카드 깜자 3 교통카드 가능 */

.ico-main-card-104010-F {
    background: url(../../img/mmk/common/card_img/ico_main_card_104010_F.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 대충 흑백 명언 ONE 체크카드 */

.ico-main-card-103895-G {
    background: url(../../img/mmk/common/card_img/ico_main_card_103895_G.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 침착맨 와펜 ONE 체크카드 */

.ico-main-card-103895-H {
    background: url(../../img/mmk/common/card_img/ico_main_card_103895_H.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 침착하길 원하는 ONE 체크카드 */

.ico-main-card-103895-I {
    background: url(../../img/mmk/common/card_img/ico_main_card_103895_I.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 대충 흑백 명언 ONE 체크카드 */

.ico-main-card-104010-G {
    background: url(../../img/mmk/common/card_img/ico_main_card_104010_G.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 침착맨 와펜 ONE 체크카드 */

.ico-main-card-104010-H {
    background: url(../../img/mmk/common/card_img/ico_main_card_104010_H.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 침착하길 원하는 ONE 체크카드 */

.ico-main-card-104010-I {
    background: url(../../img/mmk/common/card_img/ico_main_card_104010_I.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 모임체크카드 */

.ico-main-card-103196-A {
    background: url(../../img/mmk/common/card_img/ico_main_card_103196_A.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 하이틴카드 블랙 */

.ico-main-card-102317-A {
    background: url(../../img/mmk/common/card_img/ico_main_card_102317_A.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 하이틴카드 화이트 */

.ico-main-card-102317-B {
    background: url(../../img/mmk/common/card_img/ico_main_card_102317_B.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 하이틴카드 그린 */

.ico-main-card-102317-C {
    background: url(../../img/mmk/common/card_img/ico_main_card_102317_C.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! MY 라임 */

.ico-main-card-101863-A {
    background: url(../../img/mmk/common/card_img/ico_main_card_101863_A.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! MY 네이비 */

.ico-main-card-101863-B {
    background: url(../../img/mmk/common/card_img/ico_main_card_101863_B.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 토대리 방학 */

.ico-main-card-101863-F {
    background: url(../../img/mmk/common/card_img/ico_main_card_101863_F.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 토대리 만두 */

.ico-main-card-101863-G {
    background: url(../../img/mmk/common/card_img/ico_main_card_101863_G.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 토대리 고래 */

.ico-main-card-101863-H {
    background: url(../../img/mmk/common/card_img/ico_main_card_101863_H.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! MY 라임 */

.ico-main-card-100010-A {
    background: url(../../img/mmk/common/card_img/ico_main_card_100010_A.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! MY 네이비 */

.ico-main-card-100010-B {
    background: url(../../img/mmk/common/card_img/ico_main_card_100010_B.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! MY(알뜰교통) 라임" */

.ico-main-card-103078-A {
    background: url(../../img/mmk/common/card_img/ico_main_card_103078_A.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! MY(알뜰교통) 네이비 */

.ico-main-card-103078-B {
    background: url(../../img/mmk/common/card_img/ico_main_card_103078_B.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! MY(K-패스) 라임 */

.ico-main-card-103078-C {
    background: url(../../img/mmk/common/card_img/ico_main_card_103078_C.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! MY(K-패스) 네이비 */

.ico-main-card-103078-D {
    background: url(../../img/mmk/common/card_img/ico_main_card_103078_D.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 토대리 방학 */

.ico-main-card-103078-F {
    background: url(../../img/mmk/common/card_img/ico_main_card_103078_F.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 토대리 만두 */

.ico-main-card-103078-G {
    background: url(../../img/mmk/common/card_img/ico_main_card_103078_G.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 토대리 고래 */

.ico-main-card-103078-H {
    background: url(../../img/mmk/common/card_img/ico_main_card_103078_H.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 네이버페이1 기본 */

.ico-main-card-960098-A {
    background: url(../../img/mmk/common/card_img/ico_main_card_960098_A.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 네이버페이1 브라운*/

.ico-main-card-960098-B {
    background: url(../../img/mmk/common/card_img/ico_main_card_960098_B.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 네이버페이1 샐리 */

.ico-main-card-960098-C {
    background: url(../../img/mmk/common/card_img/ico_main_card_960098_C.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 네이버페이1 초코 */

.ico-main-card-960098-D {
    background: url(../../img/mmk/common/card_img/ico_main_card_960098_D.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 네이버페이1 코니 */

.ico-main-card-960098-E {
    background: url(../../img/mmk/common/card_img/ico_main_card_960098_E.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 네이버페이2 기본 */

.ico-main-card-960137-A {
    background: url(../../img/mmk/common/card_img/ico_main_card_960137_A.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 네이버페이2 브라운 */

.ico-main-card-960137-B {
    background: url(../../img/mmk/common/card_img/ico_main_card_960137_B.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 네이버페이2 샐리 */

.ico-main-card-960137-C {
    background: url(../../img/mmk/common/card_img/ico_main_card_960137_C.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 네이버페이2 초코 */

.ico-main-card-960137-D {
    background: url(../../img/mmk/common/card_img/ico_main_card_960137_D.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 네이버페이2 코니 */

.ico-main-card-960137-E {
    background: url(../../img/mmk/common/card_img/ico_main_card_960137_E.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 네이버페이2 기본 */

.ico-main-card-100003-A {
    background: url(../../img/mmk/common/card_img/ico_main_card_100003_A.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 네이버페이2 브라운 */

.ico-main-card-100003-B {
    background: url(../../img/mmk/common/card_img/ico_main_card_100003_B.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 네이버페이2 샐리 */

.ico-main-card-100003-C {
    background: url(../../img/mmk/common/card_img/ico_main_card_100003_C.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 네이버페이2 초코 */

.ico-main-card-100003-D {
    background: url(../../img/mmk/common/card_img/ico_main_card_100003_D.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 네이버페이2 코니 */

.ico-main-card-100003-E {
    background: url(../../img/mmk/common/card_img/ico_main_card_100003_E.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 네이버페이2 기본 */

.ico-main-card-100005-A {
    background: url(../../img/mmk/common/card_img/ico_main_card_100005_A.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 네이버페이2 브라운 */

.ico-main-card-100005-B {
    background: url(../../img/mmk/common/card_img/ico_main_card_100005_B.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 네이버페이2 샐리 */

.ico-main-card-100005-C {
    background: url(../../img/mmk/common/card_img/ico_main_card_100005_C.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 네이버페이2 초코 */

.ico-main-card-100005-D {
    background: url(../../img/mmk/common/card_img/ico_main_card_100005_D.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 네이버페이2 코니 */

.ico-main-card-100005-E {
    background: url(../../img/mmk/common/card_img/ico_main_card_100005_E.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! KT멤버십더블혜택 코랄 올드*/

.ico-main-card-960027-A {
    background: url(../../img/mmk/common/card_img/ico_main_card_960027_A.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! KT멤버십더블혜택 코랄 민트*/

.ico-main-card-960027-B {
    background: url(../../img/mmk/common/card_img/ico_main_card_960027_B.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! KT멤버십더블혜택 코랄 뉴*/

.ico-main-card-960027-C {
    background: url(../../img/mmk/common/card_img/ico_main_card_960027_C.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! KT멤버십더블혜택 코랄 올드*/

.ico-main-card-100008-A {
    background: url(../../img/mmk/common/card_img/ico_main_card_100008_A.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! KT멤버십더블혜택 코랄 민트*/

.ico-main-card-100008-B {
    background: url(../../img/mmk/common/card_img/ico_main_card_100008_B.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! KT멤버십더블혜택 코랄 뉴*/

.ico-main-card-100008-C {
    background: url(../../img/mmk/common/card_img/ico_main_card_100008_C.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 플러스 그레이*/

.ico-main-card-100392-A {
    background: url(../../img/mmk/common/card_img/ico_main_card_100392_A.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 플러스 레드*/

.ico-main-card-100392-B {
    background: url(../../img/mmk/common/card_img/ico_main_card_100392_B.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 플러스 라임*/

.ico-main-card-100392-C {
    background: url(../../img/mmk/common/card_img/ico_main_card_100392_C.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 플러스 그레이 */

.ico-main-card-100009-A {
    background: url(../../img/mmk/common/card_img/ico_main_card_100009_A.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 플러스 레드*/

.ico-main-card-100009-B {
    background: url(../../img/mmk/common/card_img/ico_main_card_100009_B.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 플러스 라임*/

.ico-main-card-100009-C {
    background: url(../../img/mmk/common/card_img/ico_main_card_100009_C.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! KT파트너스복지 */

.ico-main-card-960153-A {
    background: url(../../img/mmk/common/card_img/ico_main_card_960153_A.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 해피포인트 */

.ico-main-card-960111-A {
    background: url(../../img/mmk/common/card_img/ico_main_card_960111_A.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 해피포인트 */

.ico-main-card-100004-A {
    background: url(../../img/mmk/common/card_img/ico_main_card_100004_A.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 포인트적립형 */

.ico-main-card-960001-A {
    background: url(../../img/mmk/common/card_img/ico_main_card_960001_A.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 포인트적립형(일체형OTP) */

.ico-main-card-960031-A {
    background: url(../../img/mmk/common/card_img/ico_main_card_960031_A.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 포인트적립형(카드형OTP) */

.ico-main-card-960056-A {
    background: url(../../img/mmk/common/card_img/ico_main_card_960056_A.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 포인트적립형 */

.ico-main-card-100001-A {
    background: url(../../img/mmk/common/card_img/ico_main_card_100001_A.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 통신캐시백형 */

.ico-main-card-960014-A {
    background: url(../../img/mmk/common/card_img/ico_main_card_960014_A.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 통신캐시백형(일체형OTP) */

.ico-main-card-960043-A {
    background: url(../../img/mmk/common/card_img/ico_main_card_960043_A.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 통신캐시백형(카드형OTP) */

.ico-main-card-960069-A {
    background: url(../../img/mmk/common/card_img/ico_main_card_960069_A.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 통신캐시백형 */

.ico-main-card-100002-A {
    background: url(../../img/mmk/common/card_img/ico_main_card_100002_A.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 케이뱅크 (법인) */

.ico-main-card-960179 {
    background: url(../../img/mmk/common/card_img/ico_main_card_960179.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! SIMPLE */

.ico-main-card-100972 {
    background: url(../../img/mmk/common/card_img/ico_main_card_100972.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 롯데카드 Basic */

.ico-main-card-01059-A {
    background: url(../../img/mmk/common/card_img/ico_main_card_01059_A.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 롯데카드 Tiger */

.ico-main-card-01059-B {
    background: url(../../img/mmk/common/card_img/ico_main_card_01059_B.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 롯데카드 Vintage */

.ico-main-card-01059-C {
    background: url(../../img/mmk/common/card_img/ico_main_card_01059_C.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 롯데카드 */

.ico-main-card-01059-D {
    background: url(../../img/mmk/common/card_img/ico_main_card_01059_D.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 삼성iD */

.ico-main-card-AP1769 {
    background: url(../../img/mmk/common/card_img/ico_main_card_AP1769.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! KB국민 톡톡 */

.ico-main-card-09438 {
    background: url(../../img/mmk/common/card_img/ico_main_card_09438.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 케이뱅크 신한카드 플리 */

.ico-main-card-PLADHO-A {
    background: url(../../img/mmk/common/card_img/ico_main_card_PLADHO_A.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 디지로카 Paris */

.ico-main-card-01129-A {
    background: url(../../img/mmk/common/card_img/ico_main_card_01129_A.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 디지로카 London */

.ico-main-card-01122-A {
    background: url(../../img/mmk/common/card_img/ico_main_card_01122_A.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 디지로카 Monaco */

.ico-main-card-01128-A {
    background: url(../../img/mmk/common/card_img/ico_main_card_01128_A.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

[class*="ico-main-card-trfc-"] {
    background: url(../../img/mmk/common/card_img/ico_main_card_trfc_default.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! ONE 체크카드 후불교통 전용카드 Kbank CHA2409-000861 */

.ico-main-card-trfc-103895 {
    background: url(../../img/mmk/common/card_img/ico_main_card_trfc_103895.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 교통카드 - KT 더블혜택 멤버십 */

.ico-main-card-trfc-960027 {
    background: url(../../img/mmk/common/card_img/ico_main_card_trfc_960027.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 교통카드 - 네이버페이2 */

.ico-main-card-trfc-960137 {
    background: url(../../img/mmk/common/card_img/ico_main_card_trfc_960137.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 교통카드 - 플러스  */

.ico-main-card-trfc-100392 {
    background: url(../../img/mmk/common/card_img/ico_main_card_trfc_100392.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 교통카드 - MY  */

.ico-main-card-trfc-101863 {
    background: url(../../img/mmk/common/card_img/ico_main_card_trfc_101863.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 교통카드 - MY(K패스) */

.ico-main-card-trfc-103078 {
    background: url(../../img/mmk/common/card_img/ico_main_card_trfc_103078.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! ONE 체크카드 후불교통 전용카드 Kbank(K-PASS) CHPFMTASK-1702 */

.ico-main-card-trfc-104010 {
    background: url(../../img/mmk/common/card_img/ico_main_card_trfc_104010.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 미성년 알파 카드 1 - 앞 */

.ico-main-card-104067-A {
    background: url(../../img/mmk/common/card_img/ico_main_card_104067_A.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 미성년 알파 카드 1 - 뒤 */

.ico-main-card-104067-A-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_104067_A_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 미성년 알파 카드 2 - 앞 */

.ico-main-card-104067-B {
    background: url(../../img/mmk/common/card_img/ico_main_card_104067_B.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 미성년 알파 카드 2 - 뒤 */

.ico-main-card-104067-B-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_104067_B_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 미성년 알파 카드 3 - 앞 */

.ico-main-card-104067-C {
    background: url(../../img/mmk/common/card_img/ico_main_card_104067_C.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 미성년 알파 카드 3 - 뒤 */

.ico-main-card-104067-C-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_104067_C_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 미성년 알파 카드 4 - 앞 */

.ico-main-card-104067-D {
    background: url(../../img/mmk/common/card_img/ico_main_card_104067_D.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 미성년 알파 카드 4 - 뒤 */

.ico-main-card-104067-D-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_104067_D_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 그로밋의 티타임 - 앞, 뒤 */

.ico-main-card-103895-J {
    background: url(../../img/mmk/common/card_img/ico_main_card_103895_J.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

.ico-main-card-103895-J-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_103895_J_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 우비 입은 그로밋 - 앞, 뒤 */

.ico-main-card-103895-K {
    background: url(../../img/mmk/common/card_img/ico_main_card_103895_K.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

.ico-main-card-103895-K-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_103895_K_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 그로밋네 집 - 앞, 뒤 */

.ico-main-card-103895-L {
    background: url(../../img/mmk/common/card_img/ico_main_card_103895_L.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

.ico-main-card-103895-L-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_103895_L_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 몰랑몰랑 숀 - 앞, 뒤 */

.ico-main-card-103895-M {
    background: url(../../img/mmk/common/card_img/ico_main_card_103895_M.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

.ico-main-card-103895-M-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_103895_M_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 거울 보는 맥그로우 - 앞, 뒤 */

.ico-main-card-103895-N {
    background: url(../../img/mmk/common/card_img/ico_main_card_103895_N.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

.ico-main-card-103895-N-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_103895_N_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 그로밋의 티타임 - 앞, 뒤 */

.ico-main-card-104010-J {
    background: url(../../img/mmk/common/card_img/ico_main_card_104010_J.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

.ico-main-card-104010-J-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_104010_J_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 우비 입은 그로밋 - 앞, 뒤 */

.ico-main-card-104010-K {
    background: url(../../img/mmk/common/card_img/ico_main_card_104010_K.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

.ico-main-card-104010-K-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_104010_K_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 그로밋네 집 - 앞, 뒤 */

.ico-main-card-104010-L {
    background: url(../../img/mmk/common/card_img/ico_main_card_104010_L.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

.ico-main-card-104010-L-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_104010_L_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 몰랑몰랑 숀 - 앞, 뒤 */

.ico-main-card-104010-M {
    background: url(../../img/mmk/common/card_img/ico_main_card_104010_M.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

.ico-main-card-104010-M-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_104010_M_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 거울 보는 맥그로우 - 앞, 뒤 */

.ico-main-card-104010-N {
    background: url(../../img/mmk/common/card_img/ico_main_card_104010_N.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

.ico-main-card-104010-N-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_104010_N_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

.ico-main-card-103895-O {
    background: url(../../img/mmk/common/card_img/ico_main_card_103895_O.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

.ico-main-card-103895-O-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_103895_O_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

.ico-main-card-103895-P {
    background: url(../../img/mmk/common/card_img/ico_main_card_103895_P.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

.ico-main-card-103895-P-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_103895_P_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

.ico-main-card-103895-Q {
    background: url(../../img/mmk/common/card_img/ico_main_card_103895_Q.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

.ico-main-card-103895-Q-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_103895_Q_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

.ico-main-card-103895-R {
    background: url(../../img/mmk/common/card_img/ico_main_card_103895_R.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

.ico-main-card-103895-R-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_103895_R_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

.ico-main-card-104010-O {
    background: url(../../img/mmk/common/card_img/ico_main_card_104010_O.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

.ico-main-card-104010-O-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_104010_O_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

.ico-main-card-104010-P {
    background: url(../../img/mmk/common/card_img/ico_main_card_104010_P.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

.ico-main-card-104010-P-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_104010_P_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

.ico-main-card-104010-Q {
    background: url(../../img/mmk/common/card_img/ico_main_card_104010_Q.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

.ico-main-card-104010-Q-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_104010_Q_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

.ico-main-card-104010-R {
    background: url(../../img/mmk/common/card_img/ico_main_card_104010_R.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

.ico-main-card-104010-R-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_104010_R_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! component element icon sprite 로고 - 체크/신용 카드 FETASK-1868 [KDS] 3.47459 반영 CHPFMTASK-1131 이미지 폴더위치 변경 뒷면-back */

/*! 카드 플레이트_케이뱅크 ONE 체크카드 1 */

.ico-main-card-103895-A-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_103895_A_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 카드 플레이트_케이뱅크 ONE 체크카드 2 */

.ico-main-card-103895-B-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_103895_B_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 카드 플레이트_케이뱅크 ONE 체크카드 3 */

.ico-main-card-103895-C-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_103895_C_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 카드 플레이트_케이뱅크 ONE 체크카드 깜자 1 */

.ico-main-card-103895-D-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_103895_D_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 카드 플레이트_케이뱅크 ONE 체크카드 깜자 2 */

.ico-main-card-103895-E-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_103895_E_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 카드 플레이트_케이뱅크 ONE 체크카드 깜자 3 */

.ico-main-card-103895-F-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_103895_F_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 카드 플레이트_케이뱅크 ONE 체크카드 1 교통카드 가능 */

.ico-main-card-104010-A-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_104010_A_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 카드 플레이트_케이뱅크 ONE 체크카드 2 교통카드 가능 */

.ico-main-card-104010-B-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_104010_B_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 카드 플레이트_케이뱅크 ONE 체크카드 3 교통카드 가능 */

.ico-main-card-104010-C-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_104010_C_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 카드 플레이트_케이뱅크 ONE 체크카드 깜자 1 교통카드 가능 */

.ico-main-card-104010-D-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_104010_D_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 카드 플레이트_케이뱅크 ONE 체크카드 깜자 2 교통카드 가능 */

.ico-main-card-104010-E-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_104010_E_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 카드 플레이트_케이뱅크 ONE 체크카드 깜자 3 교통카드 가능 */

.ico-main-card-104010-F-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_104010_F_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 대충 흑백 명언 ONE 체크카드 */

.ico-main-card-103895-G-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_103895_G_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 침착맨 와펜 ONE 체크카드 */

.ico-main-card-103895-H-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_103895_H_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 침착하길 원하는 ONE 체크카드 */

.ico-main-card-103895-I-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_103895_I_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 대충 흑백 명언 ONE 체크카드 */

.ico-main-card-104010-G-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_104010_G_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 침착맨 와펜 ONE 체크카드 */

.ico-main-card-104010-H-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_104010_H_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 침착하길 원하는 ONE 체크카드 */

.ico-main-card-104010-I-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_104010_I_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 모임체크카드 */

.ico-main-card-103196-A-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_103196_A_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 하이틴카드 블랙 */

.ico-main-card-102317-A-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_102317_A_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 하이틴카드 화이트 */

.ico-main-card-102317-B-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_102317_B_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 하이틴카드 그린 */

.ico-main-card-102317-C-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_102317_C_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! MY 라임 */

.ico-main-card-101863-A-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_101863_A_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! MY 네이비 */

.ico-main-card-101863-B-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_101863_B_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 토대리 방학 */

.ico-main-card-101863-F-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_101863_F_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 토대리 만두 */

.ico-main-card-101863-G-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_101863_G_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 토대리 고래 */

.ico-main-card-101863-H-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_101863_H_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! MY 라임 */

.ico-main-card-100010-A-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_100010_A_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! MY 네이비 */

.ico-main-card-100010-B-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_100010_B_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! MY(알뜰교통) 라임" */

.ico-main-card-103078-A-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_103078_A_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! MY(알뜰교통) 네이비 */

.ico-main-card-103078-B-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_103078_B_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! MY(K-패스) 라임 */

.ico-main-card-103078-C-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_103078_C_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! MY(K-패스) 네이비 */

.ico-main-card-103078-D-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_103078_D_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 토대리 방학 */

.ico-main-card-103078-F-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_103078_F_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 토대리 만두 */

.ico-main-card-103078-G-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_103078_G_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 토대리 고래 */

.ico-main-card-103078-H-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_103078_H_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 네이버페이1 기본 */

.ico-main-card-960098-A-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_960098_A_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 네이버페이1 브라운*/

.ico-main-card-960098-B-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_960098_B_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 네이버페이1 샐리 */

.ico-main-card-960098-C-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_960098_C_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 네이버페이1 초코 */

.ico-main-card-960098-D-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_960098_D_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 네이버페이1 코니 */

.ico-main-card-960098-E-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_960098_E_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 네이버페이2 기본 */

.ico-main-card-960137-A-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_960137_A_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 네이버페이2 브라운 */

.ico-main-card-960137-B-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_960137_B_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 네이버페이2 샐리 */

.ico-main-card-960137-C-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_960137_C_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 네이버페이2 초코 */

.ico-main-card-960137-D-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_960137_D_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 네이버페이2 코니 */

.ico-main-card-960137-E-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_960137_E_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 네이버페이2 기본 */

.ico-main-card-100003-A-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_100003_A_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 네이버페이2 브라운 */

.ico-main-card-100003-B-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_100003_B_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 네이버페이2 샐리 */

.ico-main-card-100003-C-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_100003_C_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 네이버페이2 초코 */

.ico-main-card-100003-D-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_100003_D_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 네이버페이2 코니 */

.ico-main-card-100003-E-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_100003_E_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 네이버페이2 기본 */

.ico-main-card-100005-A-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_100005_A_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 네이버페이2 브라운 */

.ico-main-card-100005-B-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_100005_B_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 네이버페이2 샐리 */

.ico-main-card-100005-C-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_100005_C_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 네이버페이2 초코 */

.ico-main-card-100005-D-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_100005_D_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 네이버페이2 코니 */

.ico-main-card-100005-E-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_100005_E_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! KT멤버십더블혜택 코랄 올드*/

.ico-main-card-960027-A-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_960027_A_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! KT멤버십더블혜택 코랄 민트*/

.ico-main-card-960027-B-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_960027_B_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! KT멤버십더블혜택 코랄 뉴*/

.ico-main-card-960027-C-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_960027_C_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! KT멤버십더블혜택 코랄 올드*/

.ico-main-card-100008-A-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_100008_A_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! KT멤버십더블혜택 코랄 민트*/

.ico-main-card-100008-B-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_100008_B_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! KT멤버십더블혜택 코랄 뉴*/

.ico-main-card-100008-C-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_100008_C_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 플러스 그레이*/

.ico-main-card-100392-A-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_100392_A_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 플러스 레드*/

.ico-main-card-100392-B-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_100392_B_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 플러스 라임*/

.ico-main-card-100392-C-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_100392_C_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 플러스 그레이 */

.ico-main-card-100009-A-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_100009_A_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 플러스 레드*/

.ico-main-card-100009-B-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_100009_B_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 플러스 라임*/

.ico-main-card-100009-C-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_100009_C_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! KT파트너스복지 */

.ico-main-card-960153-A-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_960153_A_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 해피포인트 */

.ico-main-card-960111-A-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_960111_A_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 해피포인트 */

.ico-main-card-100004-A-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_100004_A_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 포인트적립형 */

.ico-main-card-960001-A-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_960001_A_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 포인트적립형(일체형OTP) */

.ico-main-card-960031-A-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_960031_A_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 포인트적립형(카드형OTP) */

.ico-main-card-960056-A-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_960056_A_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 포인트적립형 */

.ico-main-card-100001-A-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_100001_A_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 통신캐시백형 */

.ico-main-card-960014-A-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_960014_A_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 통신캐시백형(일체형OTP) */

.ico-main-card-960043-A-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_960043_A_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 통신캐시백형(카드형OTP) */

.ico-main-card-960069-A-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_960069_A_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 통신캐시백형 */

.ico-main-card-100002-A-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_100002_A_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 케이뱅크 (법인) */

.ico-main-card-960179-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_960179_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! SIMPLE */

.ico-main-card-100972-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_100972_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 롯데카드 Basic */

.ico-main-card-01059-A-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_01059_A_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 롯데카드 Tiger */

.ico-main-card-01059-B-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_01059_B_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 롯데카드 Vintage */

.ico-main-card-01059-C-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_01059_C_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 롯데카드 */

.ico-main-card-01059-D-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_01059_D_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 삼성iD */

.ico-main-card-AP1769-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_AP1769_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! KB국민 톡톡 */

.ico-main-card-09438-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_09438_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 케이뱅크 신한카드 플리 */

.ico-main-card-PLADHO-A-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_PLADHO_A_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 디지로카 Paris */

.ico-main-card-01129-A-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_01129_A_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 디지로카 London */

.ico-main-card-01122-A-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_01122_A_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! 디지로카 Monaco */

.ico-main-card-01128-A-back {
    background: url(../../img/mmk/common/card_img/ico_main_card_01128_A_back.png) 0 0 no-repeat !important;
    background-size: auto 100% !important
}

/*! component element icon sprite 챌린지박스 상태값 아이콘 */

[class*="ico-new-cb"] {
    display: inline-block;
    overflow: hidden;
    border-radius: 50%
}

[class*="ico-new-cb"].w24 {
    background-image: url(../../img/mmk/common/sprite_new_cb.png?timestamp=1709638257185);
    width: 2.4rem;
    height: 2.4rem;
    background-size: 12rem 7.2rem
}

[class*="ico-new-cb"].w34 {
    background-image: url(../../img/mmk/common/sprite_new_cb.png?timestamp=1709638257185);
    width: 3.4rem;
    height: 3.4rem;
    background-size: 17rem 10.2rem
}

.ico-new-cb-001.w24 {
    background-position: 0 0
}

.ico-new-cb-001.w34 {
    background-position: 0 0
}

.ico-new-cb-002.w24 {
    background-position: -4.8rem 0
}

.ico-new-cb-002.w34 {
    background-position: -6.8rem 0
}

.ico-new-cb-003.w24 {
    background-position: 0 -4.8rem
}

.ico-new-cb-003.w34 {
    background-position: 0 -6.8rem
}

.ico-new-cb-004.w24 {
    background-position: -4.8rem -4.8rem
}

.ico-new-cb-004.w34 {
    background-position: -6.8rem -6.8rem
}

.ico-new-cb-005.w24 {
    background-position: -9.6rem 0
}

.ico-new-cb-005.w34 {
    background-position: -13.6rem 0
}

.ico-new-cb-006.w24 {
    background-position: -9.6rem -4.8rem
}

.ico-new-cb-006.w34 {
    background-position: -13.6rem -6.8rem
}

/*! component element icon sprite 챌린지박스 아이콘 */

[class*="ico-cb"] {
    display: inline-block;
    overflow: hidden;
    border-radius: 50%
}

[class*="ico-cb"].w24 {
    background-image: url(../../img/mmk/common/sprite_cb.png?timestamp=1709638149261);
    width: 2.4rem;
    height: 2.4rem;
    background-size: 26.4rem 26.4rem
}

[class*="ico-cb"].w34 {
    background-image: url(../../img/mmk/common/sprite_cb.png?timestamp=1709638149261);
    width: 3.4rem;
    height: 3.4rem;
    background-size: 37.4rem 37.4rem
}

.ico-cb-001.w24 {
    background-position: 0 0
}

.ico-cb-001.w34 {
    background-position: 0 0
}

.ico-cb-002.w24 {
    background-position: -4.8rem 0
}

.ico-cb-002.w34 {
    background-position: -6.8rem 0
}

.ico-cb-003.w24 {
    background-position: 0 -4.8rem
}

.ico-cb-003.w34 {
    background-position: 0 -6.8rem
}

.ico-cb-004.w24 {
    background-position: -4.8rem -4.8rem
}

.ico-cb-004.w34 {
    background-position: -6.8rem -6.8rem
}

.ico-cb-005.w24 {
    background-position: -9.6rem 0
}

.ico-cb-005.w34 {
    background-position: -13.6rem 0
}

.ico-cb-006.w24 {
    background-position: -9.6rem -4.8rem
}

.ico-cb-006.w34 {
    background-position: -13.6rem -6.8rem
}

.ico-cb-007.w24 {
    background-position: 0 -9.6rem
}

.ico-cb-007.w34 {
    background-position: 0 -13.6rem
}

.ico-cb-008.w24 {
    background-position: -4.8rem -9.6rem
}

.ico-cb-008.w34 {
    background-position: -6.8rem -13.6rem
}

.ico-cb-010.w24 {
    background-position: -14.4rem 0
}

.ico-cb-010.w34 {
    background-position: -20.4rem 0
}

.ico-cb-011.w24 {
    background-position: -14.4rem -4.8rem
}

.ico-cb-011.w34 {
    background-position: -20.4rem -6.8rem
}

.ico-cb-012.w24 {
    background-position: -14.4rem -9.6rem
}

.ico-cb-012.w34 {
    background-position: -20.4rem -13.6rem
}

.ico-cb-013.w24 {
    background-position: 0 -14.4rem
}

.ico-cb-013.w34 {
    background-position: 0 -20.4rem
}

.ico-cb-014.w24 {
    background-position: -4.8rem -14.4rem
}

.ico-cb-014.w34 {
    background-position: -6.8rem -20.4rem
}

.ico-cb-015.w24 {
    background-position: -9.6rem -14.4rem
}

.ico-cb-015.w34 {
    background-position: -13.6rem -20.4rem
}

.ico-cb-016.w24 {
    background-position: -14.4rem -14.4rem
}

.ico-cb-016.w34 {
    background-position: -20.4rem -20.4rem
}

.ico-cb-017.w24 {
    background-position: -19.2rem 0
}

.ico-cb-017.w34 {
    background-position: -27.2rem 0
}

.ico-cb-018.w24 {
    background-position: -19.2rem -4.8rem
}

.ico-cb-018.w34 {
    background-position: -27.2rem -6.8rem
}

.ico-cb-0082.w24 {
    background-position: -9.6rem -9.6rem
}

.ico-cb-0082.w34 {
    background-position: -13.6rem -13.6rem
}

.ico-cb-tony-001.w24 {
    background-position: -19.2rem -9.6rem
}

.ico-cb-tony-001.w34 {
    background-position: -27.2rem -13.6rem
}

.ico-cb-tony-002.w24 {
    background-position: -19.2rem -14.4rem
}

.ico-cb-tony-002.w34 {
    background-position: -27.2rem -20.4rem
}

.ico-cb-tony-003.w24 {
    background-position: 0 -19.2rem
}

.ico-cb-tony-003.w34 {
    background-position: 0 -27.2rem
}

.ico-cb-tony-004.w24 {
    background-position: -4.8rem -19.2rem
}

.ico-cb-tony-004.w34 {
    background-position: -6.8rem -27.2rem
}

.ico-cb-tony-005.w24 {
    background-position: -9.6rem -19.2rem
}

.ico-cb-tony-005.w34 {
    background-position: -13.6rem -27.2rem
}

.ico-cb-tony-006.w24 {
    background-position: -14.4rem -19.2rem
}

.ico-cb-tony-006.w34 {
    background-position: -20.4rem -27.2rem
}

.ico-cb-tony-007.w24 {
    background-position: -19.2rem -19.2rem
}

.ico-cb-tony-007.w34 {
    background-position: -27.2rem -27.2rem
}

.ico-cb-tony-008.w24 {
    background-position: -24rem 0
}

.ico-cb-tony-008.w34 {
    background-position: -34rem 0
}

.ico-cb-tony-010.w24 {
    background-position: -24rem -9.6rem
}

.ico-cb-tony-010.w34 {
    background-position: -34rem -13.6rem
}

.ico-cb-tony-011.w24 {
    background-position: -24rem -14.4rem
}

.ico-cb-tony-011.w34 {
    background-position: -34rem -20.4rem
}

.ico-cb-tony-012.w24 {
    background-position: -24rem -19.2rem
}

.ico-cb-tony-012.w34 {
    background-position: -34rem -27.2rem
}

.ico-cb-tony-013.w24 {
    background-position: 0 -24rem
}

.ico-cb-tony-013.w34 {
    background-position: 0 -34rem
}

.ico-cb-tony-014.w24 {
    background-position: -4.8rem -24rem
}

.ico-cb-tony-014.w34 {
    background-position: -6.8rem -34rem
}

.ico-cb-tony-015.w24 {
    background-position: -9.6rem -24rem
}

.ico-cb-tony-015.w34 {
    background-position: -13.6rem -34rem
}

.ico-cb-tony-016.w24 {
    background-position: -14.4rem -24rem
}

.ico-cb-tony-016.w34 {
    background-position: -20.4rem -34rem
}

.ico-cb-tony-017.w24 {
    background-position: -19.2rem -24rem
}

.ico-cb-tony-017.w34 {
    background-position: -27.2rem -34rem
}

.ico-cb-tony-018.w24 {
    background-position: -24rem -24rem
}

.ico-cb-tony-018.w34 {
    background-position: -34rem -34rem
}

.ico-cb-tony-0082.w24 {
    background-position: -24rem -4.8rem
}

.ico-cb-tony-0082.w34 {
    background-position: -34rem -6.8rem
}

/*! component element icon sprite 플러스박스 아이콘 */

[class*="ico-pb"] {
    display: inline-block;
    overflow: hidden;
    border-radius: 50%
}

[class*="ico-pb"].w20 {
    background-image: url(../../img/mmk/common/sprite_pb.png?timestamp=1730079946737);
    width: 2rem;
    height: 2rem;
    background-size: 14rem 10rem
}

[class*="ico-pb"].w22 {
    background-image: url(../../img/mmk/common/sprite_pb.png?timestamp=1730079946737);
    width: 2.2rem;
    height: 2.2rem;
    background-size: 15.4rem 11rem
}

[class*="ico-pb"].w24 {
    background-image: url(../../img/mmk/common/sprite_pb.png?timestamp=1730079946737);
    width: 2.4rem;
    height: 2.4rem;
    background-size: 16.8rem 12rem
}

[class*="ico-pb"].w26 {
    background-image: url(../../img/mmk/common/sprite_pb.png?timestamp=1730079946737);
    width: 2.6rem;
    height: 2.6rem;
    background-size: 18.2rem 13rem
}

[class*="ico-pb"].w28 {
    background-image: url(../../img/mmk/common/sprite_pb.png?timestamp=1730079946737);
    width: 2.8rem;
    height: 2.8rem;
    background-size: 19.6rem 14rem
}

[class*="ico-pb"].w32 {
    background-image: url(../../img/mmk/common/sprite_pb.png?timestamp=1730079946737);
    width: 3.2rem;
    height: 3.2rem;
    background-size: 22.4rem 16rem
}

[class*="ico-pb"].w34 {
    background-image: url(../../img/mmk/common/sprite_pb.png?timestamp=1730079946737);
    width: 3.4rem;
    height: 3.4rem;
    background-size: 23.8rem 17rem
}

[class*="ico-pb"].w36 {
    background-image: url(../../img/mmk/common/sprite_pb.png?timestamp=1730079946737);
    width: 3.6rem;
    height: 3.6rem;
    background-size: 25.2rem 18rem
}

[class*="ico-pb"].w40 {
    background-image: url(../../img/mmk/common/sprite_pb.png?timestamp=1730079946737);
    width: 4rem;
    height: 4rem;
    background-size: 28rem 20rem
}

[class*="ico-pb"].w44 {
    background-image: url(../../img/mmk/common/sprite_pb.png?timestamp=1730079946737);
    width: 4.4rem;
    height: 4.4rem;
    background-size: 30.8rem 22rem
}

[class*="ico-pb"].w46 {
    background-image: url(../../img/mmk/common/sprite_pb.png?timestamp=1730079946737);
    width: 4.6rem;
    height: 4.6rem;
    background-size: 32.2rem 23rem
}

[class*="ico-pb"].w48 {
    background-image: url(../../img/mmk/common/sprite_pb.png?timestamp=1730079946737);
    width: 4.8rem;
    height: 4.8rem;
    background-size: 33.6rem 24rem
}

[class*="ico-pb"].w50 {
    background-image: url(../../img/mmk/common/sprite_pb.png?timestamp=1730079946737);
    width: 5rem;
    height: 5rem;
    background-size: 35rem 25rem
}

[class*="ico-pb"].w62 {
    background-image: url(../../img/mmk/common/sprite_pb.png?timestamp=1730079946737);
    width: 6.2rem;
    height: 6.2rem;
    background-size: 43.4rem 31rem
}

[class*="ico-pb"].w64 {
    background-image: url(../../img/mmk/common/sprite_pb.png?timestamp=1730079946737);
    width: 6.4rem;
    height: 6.4rem;
    background-size: 44.8rem 32rem
}

[class*="ico-pb"].w70 {
    background-image: url(../../img/mmk/common/sprite_pb.png?timestamp=1730079946737);
    width: 7rem;
    height: 7rem;
    background-size: 49rem 35rem
}

.ico-pb-001.w20 {
    background-position: 0 0
}

.ico-pb-001.w22 {
    background-position: 0 0
}

.ico-pb-001.w24 {
    background-position: 0 0
}

.ico-pb-001.w26 {
    background-position: 0 0
}

.ico-pb-001.w28 {
    background-position: 0 0
}

.ico-pb-001.w32 {
    background-position: 0 0
}

.ico-pb-001.w34 {
    background-position: 0 0
}

.ico-pb-001.w36 {
    background-position: 0 0
}

.ico-pb-001.w40 {
    background-position: 0 0
}

.ico-pb-001.w44 {
    background-position: 0 0
}

.ico-pb-001.w46 {
    background-position: 0 0
}

.ico-pb-001.w48 {
    background-position: 0 0
}

.ico-pb-001.w50 {
    background-position: 0 0
}

.ico-pb-001.w62 {
    background-position: 0 0
}

.ico-pb-001.w64 {
    background-position: 0 0
}

.ico-pb-001.w70 {
    background-position: 0 0
}

.ico-pb-002.w20 {
    background-position: -4rem 0
}

.ico-pb-002.w22 {
    background-position: -4.4rem 0
}

.ico-pb-002.w24 {
    background-position: -4.8rem 0
}

.ico-pb-002.w26 {
    background-position: -5.2rem 0
}

.ico-pb-002.w28 {
    background-position: -5.6rem 0
}

.ico-pb-002.w32 {
    background-position: -6.4rem 0
}

.ico-pb-002.w34 {
    background-position: -6.8rem 0
}

.ico-pb-002.w36 {
    background-position: -7.2rem 0
}

.ico-pb-002.w40 {
    background-position: -8rem 0
}

.ico-pb-002.w44 {
    background-position: -8.8rem 0
}

.ico-pb-002.w46 {
    background-position: -9.2rem 0
}

.ico-pb-002.w48 {
    background-position: -9.6rem 0
}

.ico-pb-002.w50 {
    background-position: -10rem 0
}

.ico-pb-002.w62 {
    background-position: -12.4rem 0
}

.ico-pb-002.w64 {
    background-position: -12.8rem 0
}

.ico-pb-002.w70 {
    background-position: -14rem 0
}

.ico-pb-003.w20 {
    background-position: 0 -4rem
}

.ico-pb-003.w22 {
    background-position: 0 -4.4rem
}

.ico-pb-003.w24 {
    background-position: 0 -4.8rem
}

.ico-pb-003.w26 {
    background-position: 0 -5.2rem
}

.ico-pb-003.w28 {
    background-position: 0 -5.6rem
}

.ico-pb-003.w32 {
    background-position: 0 -6.4rem
}

.ico-pb-003.w34 {
    background-position: 0 -6.8rem
}

.ico-pb-003.w36 {
    background-position: 0 -7.2rem
}

.ico-pb-003.w40 {
    background-position: 0 -8rem
}

.ico-pb-003.w44 {
    background-position: 0 -8.8rem
}

.ico-pb-003.w46 {
    background-position: 0 -9.2rem
}

.ico-pb-003.w48 {
    background-position: 0 -9.6rem
}

.ico-pb-003.w50 {
    background-position: 0 -10rem
}

.ico-pb-003.w62 {
    background-position: 0 -12.4rem
}

.ico-pb-003.w64 {
    background-position: 0 -12.8rem
}

.ico-pb-003.w70 {
    background-position: 0 -14rem
}

.ico-pb-004.w20 {
    background-position: -4rem -4rem
}

.ico-pb-004.w22 {
    background-position: -4.4rem -4.4rem
}

.ico-pb-004.w24 {
    background-position: -4.8rem -4.8rem
}

.ico-pb-004.w26 {
    background-position: -5.2rem -5.2rem
}

.ico-pb-004.w28 {
    background-position: -5.6rem -5.6rem
}

.ico-pb-004.w32 {
    background-position: -6.4rem -6.4rem
}

.ico-pb-004.w34 {
    background-position: -6.8rem -6.8rem
}

.ico-pb-004.w36 {
    background-position: -7.2rem -7.2rem
}

.ico-pb-004.w40 {
    background-position: -8rem -8rem
}

.ico-pb-004.w44 {
    background-position: -8.8rem -8.8rem
}

.ico-pb-004.w46 {
    background-position: -9.2rem -9.2rem
}

.ico-pb-004.w48 {
    background-position: -9.6rem -9.6rem
}

.ico-pb-004.w50 {
    background-position: -10rem -10rem
}

.ico-pb-004.w62 {
    background-position: -12.4rem -12.4rem
}

.ico-pb-004.w64 {
    background-position: -12.8rem -12.8rem
}

.ico-pb-004.w70 {
    background-position: -14rem -14rem
}

.ico-pb-005.w20 {
    background-position: -8rem 0
}

.ico-pb-005.w22 {
    background-position: -8.8rem 0
}

.ico-pb-005.w24 {
    background-position: -9.6rem 0
}

.ico-pb-005.w26 {
    background-position: -10.4rem 0
}

.ico-pb-005.w28 {
    background-position: -11.2rem 0
}

.ico-pb-005.w32 {
    background-position: -12.8rem 0
}

.ico-pb-005.w34 {
    background-position: -13.6rem 0
}

.ico-pb-005.w36 {
    background-position: -14.4rem 0
}

.ico-pb-005.w40 {
    background-position: -16rem 0
}

.ico-pb-005.w44 {
    background-position: -17.6rem 0
}

.ico-pb-005.w46 {
    background-position: -18.4rem 0
}

.ico-pb-005.w48 {
    background-position: -19.2rem 0
}

.ico-pb-005.w50 {
    background-position: -20rem 0
}

.ico-pb-005.w62 {
    background-position: -24.8rem 0
}

.ico-pb-005.w64 {
    background-position: -25.6rem 0
}

.ico-pb-005.w70 {
    background-position: -28rem 0
}

.ico-pb-006.w20 {
    background-position: -8rem -4rem
}

.ico-pb-006.w22 {
    background-position: -8.8rem -4.4rem
}

.ico-pb-006.w24 {
    background-position: -9.6rem -4.8rem
}

.ico-pb-006.w26 {
    background-position: -10.4rem -5.2rem
}

.ico-pb-006.w28 {
    background-position: -11.2rem -5.6rem
}

.ico-pb-006.w32 {
    background-position: -12.8rem -6.4rem
}

.ico-pb-006.w34 {
    background-position: -13.6rem -6.8rem
}

.ico-pb-006.w36 {
    background-position: -14.4rem -7.2rem
}

.ico-pb-006.w40 {
    background-position: -16rem -8rem
}

.ico-pb-006.w44 {
    background-position: -17.6rem -8.8rem
}

.ico-pb-006.w46 {
    background-position: -18.4rem -9.2rem
}

.ico-pb-006.w48 {
    background-position: -19.2rem -9.6rem
}

.ico-pb-006.w50 {
    background-position: -20rem -10rem
}

.ico-pb-006.w62 {
    background-position: -24.8rem -12.4rem
}

.ico-pb-006.w64 {
    background-position: -25.6rem -12.8rem
}

.ico-pb-006.w70 {
    background-position: -28rem -14rem
}

.ico-pb-007.w20 {
    background-position: 0 -8rem
}

.ico-pb-007.w22 {
    background-position: 0 -8.8rem
}

.ico-pb-007.w24 {
    background-position: 0 -9.6rem
}

.ico-pb-007.w26 {
    background-position: 0 -10.4rem
}

.ico-pb-007.w28 {
    background-position: 0 -11.2rem
}

.ico-pb-007.w32 {
    background-position: 0 -12.8rem
}

.ico-pb-007.w34 {
    background-position: 0 -13.6rem
}

.ico-pb-007.w36 {
    background-position: 0 -14.4rem
}

.ico-pb-007.w40 {
    background-position: 0 -16rem
}

.ico-pb-007.w44 {
    background-position: 0 -17.6rem
}

.ico-pb-007.w46 {
    background-position: 0 -18.4rem
}

.ico-pb-007.w48 {
    background-position: 0 -19.2rem
}

.ico-pb-007.w50 {
    background-position: 0 -20rem
}

.ico-pb-007.w62 {
    background-position: 0 -24.8rem
}

.ico-pb-007.w64 {
    background-position: 0 -25.6rem
}

.ico-pb-007.w70 {
    background-position: 0 -28rem
}

.ico-pb-008.w20 {
    background-position: -4rem -8rem
}

.ico-pb-008.w22 {
    background-position: -4.4rem -8.8rem
}

.ico-pb-008.w24 {
    background-position: -4.8rem -9.6rem
}

.ico-pb-008.w26 {
    background-position: -5.2rem -10.4rem
}

.ico-pb-008.w28 {
    background-position: -5.6rem -11.2rem
}

.ico-pb-008.w32 {
    background-position: -6.4rem -12.8rem
}

.ico-pb-008.w34 {
    background-position: -6.8rem -13.6rem
}

.ico-pb-008.w36 {
    background-position: -7.2rem -14.4rem
}

.ico-pb-008.w40 {
    background-position: -8rem -16rem
}

.ico-pb-008.w44 {
    background-position: -8.8rem -17.6rem
}

.ico-pb-008.w46 {
    background-position: -9.2rem -18.4rem
}

.ico-pb-008.w48 {
    background-position: -9.6rem -19.2rem
}

.ico-pb-008.w50 {
    background-position: -10rem -20rem
}

.ico-pb-008.w62 {
    background-position: -12.4rem -24.8rem
}

.ico-pb-008.w64 {
    background-position: -12.8rem -25.6rem
}

.ico-pb-008.w70 {
    background-position: -14rem -28rem
}

.ico-pb-009.w20 {
    background-position: -8rem -8rem
}

.ico-pb-009.w22 {
    background-position: -8.8rem -8.8rem
}

.ico-pb-009.w24 {
    background-position: -9.6rem -9.6rem
}

.ico-pb-009.w26 {
    background-position: -10.4rem -10.4rem
}

.ico-pb-009.w28 {
    background-position: -11.2rem -11.2rem
}

.ico-pb-009.w32 {
    background-position: -12.8rem -12.8rem
}

.ico-pb-009.w34 {
    background-position: -13.6rem -13.6rem
}

.ico-pb-009.w36 {
    background-position: -14.4rem -14.4rem
}

.ico-pb-009.w40 {
    background-position: -16rem -16rem
}

.ico-pb-009.w44 {
    background-position: -17.6rem -17.6rem
}

.ico-pb-009.w46 {
    background-position: -18.4rem -18.4rem
}

.ico-pb-009.w48 {
    background-position: -19.2rem -19.2rem
}

.ico-pb-009.w50 {
    background-position: -20rem -20rem
}

.ico-pb-009.w62 {
    background-position: -24.8rem -24.8rem
}

.ico-pb-009.w64 {
    background-position: -25.6rem -25.6rem
}

.ico-pb-009.w70 {
    background-position: -28rem -28rem
}

.ico-pb-010.w20 {
    background-position: -12rem 0
}

.ico-pb-010.w22 {
    background-position: -13.2rem 0
}

.ico-pb-010.w24 {
    background-position: -14.4rem 0
}

.ico-pb-010.w26 {
    background-position: -15.6rem 0
}

.ico-pb-010.w28 {
    background-position: -16.8rem 0
}

.ico-pb-010.w32 {
    background-position: -19.2rem 0
}

.ico-pb-010.w34 {
    background-position: -20.4rem 0
}

.ico-pb-010.w36 {
    background-position: -21.6rem 0
}

.ico-pb-010.w40 {
    background-position: -24rem 0
}

.ico-pb-010.w44 {
    background-position: -26.4rem 0
}

.ico-pb-010.w46 {
    background-position: -27.6rem 0
}

.ico-pb-010.w48 {
    background-position: -28.8rem 0
}

.ico-pb-010.w50 {
    background-position: -30rem 0
}

.ico-pb-010.w62 {
    background-position: -37.2rem 0
}

.ico-pb-010.w64 {
    background-position: -38.4rem 0
}

.ico-pb-010.w70 {
    background-position: -42rem 0
}

/*! component element icon sprite 서비스 아이콘 */

[class*="ico-service"] {
    display: inline-block;
    overflow: hidden;
    border-radius: 50%
}

[class*="ico-service"].w34 {
    background-image: url(../../img/mmk/common/sprite_service.png?timestamp=1692589288055);
    width: 3.4rem;
    height: 3.4rem;
    background-size: 23.8rem 17rem
}

.ico-service-001.w34 {
    background-position: 0 0
}

.ico-service-002.w34 {
    background-position: -6.8rem 0
}

.ico-service-003.w34 {
    background-position: 0 -6.8rem
}

.ico-service-004.w34 {
    background-position: -6.8rem -6.8rem
}

.ico-service-005.w34 {
    background-position: -13.6rem 0
}

.ico-service-006.w34 {
    background-position: -13.6rem -6.8rem
}

.ico-service-007.w34 {
    background-position: 0 -13.6rem
}

.ico-service-008.w34 {
    background-position: -6.8rem -13.6rem
}

.ico-service-009.w34 {
    background-position: -13.6rem -13.6rem
}

.ico-service-010.w34 {
    background-position: -20.4rem 0
}

.ico-service-011.w34 {
    background-position: -20.4rem -6.8rem
}

/*! component element icon sprite 기분통장 아이콘 */

[class*="img-feeling"] {
    display: inline-block;
    overflow: hidden;
    border-radius: 50%
}

[class*="img-feeling"].w26 {
    background-image: url(../../img/mmk/common/sprite_feeling.png?timestamp=1683857283835);
    width: 2.6rem;
    height: 2.6rem;
    background-size: 23.4rem 18.2rem
}

[class*="img-feeling"].w28 {
    background-image: url(../../img/mmk/common/sprite_feeling.png?timestamp=1683857283835);
    width: 2.8rem;
    height: 2.8rem;
    background-size: 25.2rem 19.6rem
}

[class*="img-feeling"].w32 {
    background-image: url(../../img/mmk/common/sprite_feeling.png?timestamp=1683857283835);
    width: 3.2rem;
    height: 3.2rem;
    background-size: 28.8rem 22.4rem
}

[class*="img-feeling"].w34 {
    background-image: url(../../img/mmk/common/sprite_feeling.png?timestamp=1683857283835);
    width: 3.4rem;
    height: 3.4rem;
    background-size: 30.6rem 23.8rem
}

[class*="img-feeling"].w36 {
    background-image: url(../../img/mmk/common/sprite_feeling.png?timestamp=1683857283835);
    width: 3.6rem;
    height: 3.6rem;
    background-size: 32.4rem 25.2rem
}

.img-feeling-h01.w26 {
    background-position: -15.6rem -5.2rem
}

.img-feeling-h01.w28 {
    background-position: -16.8rem -5.6rem
}

.img-feeling-h01.w32 {
    background-position: -19.2rem -6.4rem
}

.img-feeling-h01.w34 {
    background-position: -20.4rem -6.8rem
}

.img-feeling-h01.w36 {
    background-position: -21.6rem -7.2rem
}

.img-feeling-h02.w26 {
    background-position: -15.6rem -10.4rem
}

.img-feeling-h02.w28 {
    background-position: -16.8rem -11.2rem
}

.img-feeling-h02.w32 {
    background-position: -19.2rem -12.8rem
}

.img-feeling-h02.w34 {
    background-position: -20.4rem -13.6rem
}

.img-feeling-h02.w36 {
    background-position: -21.6rem -14.4rem
}

.img-feeling-h03.w26 {
    background-position: 0 -15.6rem
}

.img-feeling-h03.w28 {
    background-position: 0 -16.8rem
}

.img-feeling-h03.w32 {
    background-position: 0 -19.2rem
}

.img-feeling-h03.w34 {
    background-position: 0 -20.4rem
}

.img-feeling-h03.w36 {
    background-position: 0 -21.6rem
}

.img-feeling-h04.w26 {
    background-position: -5.2rem -15.6rem
}

.img-feeling-h04.w28 {
    background-position: -5.6rem -16.8rem
}

.img-feeling-h04.w32 {
    background-position: -6.4rem -19.2rem
}

.img-feeling-h04.w34 {
    background-position: -6.8rem -20.4rem
}

.img-feeling-h04.w36 {
    background-position: -7.2rem -21.6rem
}

.img-feeling-h05.w26 {
    background-position: -10.4rem -15.6rem
}

.img-feeling-h05.w28 {
    background-position: -11.2rem -16.8rem
}

.img-feeling-h05.w32 {
    background-position: -12.8rem -19.2rem
}

.img-feeling-h05.w34 {
    background-position: -13.6rem -20.4rem
}

.img-feeling-h05.w36 {
    background-position: -14.4rem -21.6rem
}

.img-feeling-s01.w26 {
    background-position: -15.6rem -15.6rem
}

.img-feeling-s01.w28 {
    background-position: -16.8rem -16.8rem
}

.img-feeling-s01.w32 {
    background-position: -19.2rem -19.2rem
}

.img-feeling-s01.w34 {
    background-position: -20.4rem -20.4rem
}

.img-feeling-s01.w36 {
    background-position: -21.6rem -21.6rem
}

.img-feeling-s02.w26 {
    background-position: -20.8rem 0
}

.img-feeling-s02.w28 {
    background-position: -22.4rem 0
}

.img-feeling-s02.w32 {
    background-position: -25.6rem 0
}

.img-feeling-s02.w34 {
    background-position: -27.2rem 0
}

.img-feeling-s02.w36 {
    background-position: -28.8rem 0
}

.img-feeling-s03.w26 {
    background-position: -20.8rem -5.2rem
}

.img-feeling-s03.w28 {
    background-position: -22.4rem -5.6rem
}

.img-feeling-s03.w32 {
    background-position: -25.6rem -6.4rem
}

.img-feeling-s03.w34 {
    background-position: -27.2rem -6.8rem
}

.img-feeling-s03.w36 {
    background-position: -28.8rem -7.2rem
}

.img-feeling-s04.w26 {
    background-position: -20.8rem -10.4rem
}

.img-feeling-s04.w28 {
    background-position: -22.4rem -11.2rem
}

.img-feeling-s04.w32 {
    background-position: -25.6rem -12.8rem
}

.img-feeling-s04.w34 {
    background-position: -27.2rem -13.6rem
}

.img-feeling-s04.w36 {
    background-position: -28.8rem -14.4rem
}

.img-feeling-s05.w26 {
    background-position: -20.8rem -15.6rem
}

.img-feeling-s05.w28 {
    background-position: -22.4rem -16.8rem
}

.img-feeling-s05.w32 {
    background-position: -25.6rem -19.2rem
}

.img-feeling-s05.w34 {
    background-position: -27.2rem -20.4rem
}

.img-feeling-s05.w36 {
    background-position: -28.8rem -21.6rem
}

.img-feeling-d01.w26 {
    background-position: -10.4rem -5.2rem
}

.img-feeling-d01.w28 {
    background-position: -11.2rem -5.6rem
}

.img-feeling-d01.w32 {
    background-position: -12.8rem -6.4rem
}

.img-feeling-d01.w34 {
    background-position: -13.6rem -6.8rem
}

.img-feeling-d01.w36 {
    background-position: -14.4rem -7.2rem
}

.img-feeling-d02.w26 {
    background-position: 0 -10.4rem
}

.img-feeling-d02.w28 {
    background-position: 0 -11.2rem
}

.img-feeling-d02.w32 {
    background-position: 0 -12.8rem
}

.img-feeling-d02.w34 {
    background-position: 0 -13.6rem
}

.img-feeling-d02.w36 {
    background-position: 0 -14.4rem
}

.img-feeling-d03.w26 {
    background-position: -5.2rem -10.4rem
}

.img-feeling-d03.w28 {
    background-position: -5.6rem -11.2rem
}

.img-feeling-d03.w32 {
    background-position: -6.4rem -12.8rem
}

.img-feeling-d03.w34 {
    background-position: -6.8rem -13.6rem
}

.img-feeling-d03.w36 {
    background-position: -7.2rem -14.4rem
}

.img-feeling-d04.w26 {
    background-position: -10.4rem -10.4rem
}

.img-feeling-d04.w28 {
    background-position: -11.2rem -11.2rem
}

.img-feeling-d04.w32 {
    background-position: -12.8rem -12.8rem
}

.img-feeling-d04.w34 {
    background-position: -13.6rem -13.6rem
}

.img-feeling-d04.w36 {
    background-position: -14.4rem -14.4rem
}

.img-feeling-d05.w26 {
    background-position: -15.6rem 0
}

.img-feeling-d05.w28 {
    background-position: -16.8rem 0
}

.img-feeling-d05.w32 {
    background-position: -19.2rem 0
}

.img-feeling-d05.w34 {
    background-position: -20.4rem 0
}

.img-feeling-d05.w36 {
    background-position: -21.6rem 0
}

.img-feeling-a01.w26 {
    background-position: 0 0
}

.img-feeling-a01.w28 {
    background-position: 0 0
}

.img-feeling-a01.w32 {
    background-position: 0 0
}

.img-feeling-a01.w34 {
    background-position: 0 0
}

.img-feeling-a01.w36 {
    background-position: 0 0
}

.img-feeling-a02.w26 {
    background-position: -5.2rem 0
}

.img-feeling-a02.w28 {
    background-position: -5.6rem 0
}

.img-feeling-a02.w32 {
    background-position: -6.4rem 0
}

.img-feeling-a02.w34 {
    background-position: -6.8rem 0
}

.img-feeling-a02.w36 {
    background-position: -7.2rem 0
}

.img-feeling-a03.w26 {
    background-position: 0 -5.2rem
}

.img-feeling-a03.w28 {
    background-position: 0 -5.6rem
}

.img-feeling-a03.w32 {
    background-position: 0 -6.4rem
}

.img-feeling-a03.w34 {
    background-position: 0 -6.8rem
}

.img-feeling-a03.w36 {
    background-position: 0 -7.2rem
}

.img-feeling-a04.w26 {
    background-position: -5.2rem -5.2rem
}

.img-feeling-a04.w28 {
    background-position: -5.6rem -5.6rem
}

.img-feeling-a04.w32 {
    background-position: -6.4rem -6.4rem
}

.img-feeling-a04.w34 {
    background-position: -6.8rem -6.8rem
}

.img-feeling-a04.w36 {
    background-position: -7.2rem -7.2rem
}

.img-feeling-a05.w26 {
    background-position: -10.4rem 0
}

.img-feeling-a05.w28 {
    background-position: -11.2rem 0
}

.img-feeling-a05.w32 {
    background-position: -12.8rem 0
}

.img-feeling-a05.w34 {
    background-position: -13.6rem 0
}

.img-feeling-a05.w36 {
    background-position: -14.4rem 0
}

/*! CHPFMTASK-929 api-icon 가상자산 */

[class*="logo-coin"].w34 {
    height: 3.4rem
}

[class*="logo-coin"] img {
    display: block;
    width: 100%
}

[class*="logo-coin"].won-ty {
    background: var(--color-g700)
}

[class*="logo-coin"].switch-ty {
    background: var(--color-w100)
}

[class*="logo-coin"].unset-all {
    background: unset;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    overflow: hidden;
    border-radius: 50%;
    position: relative;
    width: 3.4rem;
    height: 3.4rem;
    background-color: var(--color-w100)
}

[class*="logo-coin"].unset-all::after {
    top: 50%;
    left: 50%;
    width: 100%;
    height: 100%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

[class*="logo-coin"].unset-all img.noimg-invest {
    display: block;
    width: 100%
}

[class*="logo-coin"].unset-all img {
    display: block
}

[class*="logo-coin"] .rec-thumb-none {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
    height: 100%;
    background: var(--bg-ter)
}

[class*="logo-coin"] .rec-thumb-none span {
    font-size: 1.2rem;
    font-weight: 500;
    color: var(--txt-sec);
    font-style: normal;
    text-align: center
}

.ico-circle-alarm {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 3.6rem;
    height: 3.6rem;
    border-radius: 99rem;
    background-color: var(--bg-pri-invert)
}

.ico-circle-alarm::before {
    content: "";
    display: block;
    width: 2rem;
    height: 2rem;
    background: var(--path-solid-alarm) no-repeat 0 0/100%;
    -webkit-filter: brightness(0) invert(1);
    filter: brightness(0) invert(1)
}

.logo_msgr_instagram {
    display: inline-block;
    overflow: hidden;
    position: relative;
    border-radius: 50%;
    background: url("/resource/img/mmk/common/logo/logo_msgr_instagram.png") no-repeat 0 0/contain
}

.logo_msgr_instagram::after {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 99rem;
    border: 1px solid var(--color-pb5);
    z-index: 3
}

.logo_msgr_instagram.w52 {
    width: 5.2rem;
    height: 5.2rem
}

.ico-middle-dot {
    width: .4rem;
    height: .4rem;
    background: var(--ico-qua);
    border-radius: 50%
}

.logo-bankMoneymove {
    width: 6.6rem;
    height: 6.6rem;
    background: url("/resource/img/mmk/common/logo/logo_bank_moneymove.png") !important;
    background-size: 100% !important;
    background-position: 0 !important
}

.logo-bankCple {
    width: 6.6rem;
    height: 6.6rem;
    background: url("/resource/img/mmk/common/logo/logo_bank_cple.png") !important;
    background-size: 100% !important;
    background-position: 0 !important
}

.logo-bank8Percent {
    width: 6.6rem;
    height: 6.6rem;
    background: url("/resource/img/mmk/common/logo/logo_bank_8percent.png") !important;
    background-size: 100% !important;
    background-position: 0 !important
}

.logo-bankhonestfund {
    width: 6.6rem;
    height: 6.6rem;
    background: url("/resource/img/mmk/common/logo/logo_bank_honestfund.png") !important;
    background-size: 100% !important;
    background-position: 0 !important
}

.logo-bankLendit {
    width: 6.6rem;
    height: 6.6rem;
    background: url("/resource/img/mmk/common/logo/logo_bank_lendit.png") !important;
    background-size: 100% !important;
    background-position: 0 !important
}

.logo-partnerloan-SHC {
    background-image: url("/resource/img/mmk/common/logo/logo_partnerloan_SHC.png") !important;
    background-size: 100% !important;
    background-position: 0 !important
}

.logo-bankOKS {
    background-image: url("../../img/mmk/common/logo/logo_bank_oks.png") !important;
    background-size: 100% !important;
    background-position: 0 !important
}

.logo-bankWinkstone {
    background-image: url("../../img/mmk/common/logo/logo_bank_winkstone.png") !important;
    background-size: 100% !important;
    background-position: 0 !important
}

/*! variables */

:root {
    --color-g100: #F7F9FD;
    --color-g200: #EDF1F7;
    --color-g300: #E0E6F1;
    --color-g900: #020616;
    --color-w0: #ffffff00;
    --color-w100: #ffffff;
    --color-grey-g500: #8694B1;
    --color-g500: #8694B1
}

/*! reset */

*,
*::after,
*::before {
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

html {
    -webkit-text-size-adjust: 100%;
    -moz-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    text-size-adjust: 100%;
    font-size: 10px;
    font-weight: 400;
    line-height: 1.15;
    word-break: break-all;
    word-wrap: break-word;
    letter-spacing: 0
}

div {
    margin: 0;
    padding: 0
}

body {
    color: var(--color-g900, #020616);
    background-color: var(--color-w100, #fff);
    font-size: 1.6rem;
    font-family: 'Pretendard K Edition', -apple-system, BlinkMacSystemFont, system-ui, Roboto, 'Helvetica Neue', 'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', sans-serif;
    font-variant-numeric: tabular-nums
}

body * {
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none
}

body *:focus {
    outline: none
}

/*! base */

.mt2 {
    margin-top: 0.2rem !important
}

.mt4 {
    margin-top: 0.4rem !important
}

.mt6 {
    margin-top: 0.6rem !important
}

.mt8 {
    margin-top: 0.8rem !important
}

.mt10 {
    margin-top: 1rem !important
}

.mt12 {
    margin-top: 1.2rem !important
}

.mt14 {
    margin-top: 1.4rem !important
}

.mt16 {
    margin-top: 1.6rem !important
}

.mt24 {
    margin-top: 2.4rem !important
}

.mt32 {
    margin-top: 3.2rem !important
}

.mt36 {
    margin-top: 3.6rem !important
}

.mt48 {
    margin-top: 4.8rem !important
}

.mt56 {
    margin-top: 5.6rem !important
}

.mt64 {
    margin-top: 6.4rem !important
}

.hide-txt {
    overflow: hidden;
    position: absolute;
    width: 1px;
    height: 1px;
    font-size: 1px;
    line-height: 0;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    margin: -1px;
    padding: 0;
    border: 0
}

/*! component element skeleton 공통 */

.component-skeleton {
    position: fixed;
    top: 6rem;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 10000;
    width: 100%;
    height: 100%;
    background-color: var(--color-w100);
    padding: 0
}

.component-skeleton-sub {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 10000;
    width: 100%;
    height: 100%;
    background-color: var(--color-w100);
    padding: 0;
    top: env(safe-area-inset-top)
}

.component-skeleton-sub.bg-gray {
    background-color: var(--color-g200)
}

.component-skeleton-sub.bg-lightgray {
    background-color: var(--color-g100)
}

:root .component-skeleton-sub.bg-lightgray {
    background-color: var(--color-g400)
}

/*! component element skeleton 서브 1 */

.skeleton-header {
    position: relative;
    height: 5rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: var(--color-w100)
}

.skeleton-header.skeleton-header-bg01 {
    background-color: var(--color-g100)
}

.skeleton-header.skeleton-header-bg02 {
    background-color: var(--color-g100)
}

:root .skeleton-header.skeleton-header-bg01 {
    background-color: var(--color-g400)
}

:root .skeleton-header.skeleton-header-bg02 {
    background-color: var(--bg-qua)
}

.skeleton-header .skeleton-btn-back {
    position: absolute;
    top: 0;
    left: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 5rem;
    height: 5rem
}

.skeleton-header .skeleton-btn-back .ico-back {
    display: none
}

.skeleton-header .skeleton-tit-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 0;
    -ms-flex: 0 1 100%;
    flex: 0 1 100%;
    font-size: 1.8rem;
    line-height: 1.38889;
    font-weight: 400
}

.skeleton-item {
    position: relative;
    margin: 0 2rem
}

.skeleton-item.mg0 {
    margin: 0
}

.skeleton-item.radius {
    border-radius: 1rem
}

.skeleton-item.b-line {
    border-bottom: 1px solid #fff;
    border-color: var(border-pri-invert)
}

.skeleton-item.b-line .skeleton-arrow.ico-arrow-sbr {
    display: none
}

.skeleton-item.item-white {
    background-color: var(--color-w100)
}

.skeleton-item.pdtb16 {
    padding-top: 1.6rem;
    padding-bottom: 1.6rem
}

.skeleton-item.pdlr20 {
    padding-left: 2rem;
    padding-right: 2rem
}

.skeleton-item.pd20 {
    padding: 2rem
}

.skeleton-item+.skeleton-item {
    margin-top: 1.6rem
}

.skeleton-item+.skeleton-item.mt24 {
    margin-top: 2.4rem
}

.skeleton-item+.skeleton-item.mg0 {
    margin: 0
}

.skeleton-item.flexlist {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding-left: 1.7rem;
    height: 5.5rem;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.skeleton-item.tradelist {
    padding-top: 3.4rem;
    padding-bottom: 3.4rem
}

.skeleton-item.tradelist:first-child {
    padding-top: 2.2rem
}

/*! component element skeleton 디폴트 */

.skeleton-loader {
    position: absolute;
    top: 50%;
    left: 50%;
    font-size: 1rem;
    width: 3.6rem;
    height: 3.6rem;
    margin: -1.8rem 0 0 -1.8rem;
    border-radius: 50%;
    background: #afafaf;
    background: -o-linear-gradient(left, var(--color-g500) 50%, rgba(175, 175, 175, 0) 60%);
    background: -webkit-gradient(linear, left top, right top, color-stop(50%, var(--color-g500)), color-stop(60%, rgba(175, 175, 175, 0)));
    background: linear-gradient(to right, var(--color-g500) 50%, rgba(175, 175, 175, 0) 60%);
    -webkit-animation: skeleton-loader .7s infinite linear;
    animation: skeleton-loader .7s infinite linear;
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
}

:root .skeleton-loader {
    background: #afafaf;
    background: -o-linear-gradient(left, var(--color-g400) 50%, rgba(175, 175, 175, 0) 60%);
    background: -webkit-gradient(linear, left top, right top, color-stop(50%, var(--color-g400)), color-stop(60%, rgba(175, 175, 175, 0)));
    background: linear-gradient(to right, var(--color-g400) 50%, rgba(175, 175, 175, 0) 60%);
    -webkit-animation: skeleton-loader .7s infinite linear;
    animation: skeleton-loader .7s infinite linear;
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
}

:root .skeleton-loader {
    background: -o-linear-gradient(left, var(--color-g500) 50%, rgba(175, 175, 175, 0) 60%);
    background: -webkit-gradient(linear, left top, right top, color-stop(50%, var(--color-g500)), color-stop(60%, rgba(175, 175, 175, 0)));
    background: linear-gradient(to right, var(--color-g500) 50%, rgba(175, 175, 175, 0) 60%)
}

.skeleton-loader:before {
    content: '';
    background-color: var(--color-w100);
    width: 68%;
    height: 68%;
    border-radius: 50%;
    margin: auto;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0
}

.skeleton-loader .loader-item {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0
}

.skeleton-loader .loader-item:before {
    content: '';
    position: absolute;
    top: 0;
    left: 50%;
    -webkit-transform: translate(-50%);
    -ms-transform: translate(-50%);
    transform: translate(-50%);
    width: 0.8rem;
    height: 0.6rem;
    background: var(--color-g500);
    border-radius: 50%
}

:root .skeleton-loader .loader-item:before {
    background: var(--color-g400)
}

.skeleton-loader .loader-item:after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    -webkit-transform: translate(-50%);
    -ms-transform: translate(-50%);
    transform: translate(-50%);
    width: 0.8rem;
    height: 0.6rem;
    background: var(--color-g500);
    border-radius: 50%
}

:root .skeleton-loader .loader-item:after {
    background: var(--color-g400)
}

:root .skeleton-loader .loader-item:before {
    background: var(--color-g500)
}

:root .skeleton-loader .loader-item:after {
    background: var(--color-g500)
}

@-webkit-keyframes skeleton-loader {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0)
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

@keyframes skeleton-loader {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0)
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

/*! component element skeleton 스켈레톤 그라디언트 */

.skeleton-animation-all:after {
    display: block;
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    content: '';
    background: -o-linear-gradient(340deg, rgba(255, 255, 255, 0) 25%, rgba(255, 255, 255, 0.5) 35%, rgba(255, 255, 255, 0) 45%);
    background: linear-gradient(110deg, rgba(255, 255, 255, 0) 25%, rgba(255, 255, 255, 0.5) 35%, rgba(255, 255, 255, 0) 45%);
    background-size: 200% 100%;
    -webkit-animation: 1.5s skeleton-shine linear infinite;
    animation: 1.5s skeleton-shine linear infinite
}

:root .skeleton-animation-all:after {
    display: block;
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    content: '';
    background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0.9)), color-stop(21.18%, rgba(255, 255, 255, 0.9)), color-stop(42.63%, rgba(255, 255, 255, 0.4)), color-stop(50%, rgba(255, 255, 255, 0)), color-stop(52.86%, rgba(255, 255, 255, 0.03)), color-stop(55.5%, rgba(255, 255, 255, 0.18)), color-stop(60.12%, rgba(255, 255, 255, 0.41)), color-stop(79.81%, rgba(255, 255, 255, 0.98)), to(rgba(255, 255, 255, 0.9)));
    background: -o-linear-gradient(left, rgba(255, 255, 255, 0.9) 0, rgba(255, 255, 255, 0.9) 21.18%, rgba(255, 255, 255, 0.4) 42.63%, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 0.03) 52.86%, rgba(255, 255, 255, 0.18) 55.5%, rgba(255, 255, 255, 0.41) 60.12%, rgba(255, 255, 255, 0.98) 79.81%, rgba(255, 255, 255, 0.9) 100%);
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.9) 0, rgba(255, 255, 255, 0.9) 21.18%, rgba(255, 255, 255, 0.4) 42.63%, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 0.03) 52.86%, rgba(255, 255, 255, 0.18) 55.5%, rgba(255, 255, 255, 0.41) 60.12%, rgba(255, 255, 255, 0.98) 79.81%, rgba(255, 255, 255, 0.9) 100%);
    background-size: 500% 100%;
    -webkit-animation: skeleton-shine-ally ease-in-out 5s infinite;
    animation: skeleton-shine-ally ease-in-out 5s infinite
}

:root .graybox-skeleton-group .skeleton-animation-all:after,
:root .graybox-skeleton-group02 .skeleton-animation-all:after {
    display: none
}

@-webkit-keyframes skeleton-shine {
    to {
        background-position-x: -300%
    }
}

@keyframes skeleton-shine {
    to {
        background-position-x: -300%
    }
}

@-webkit-keyframes skeleton-shine-ally {
    from {
        background-position-x: 120%
    }
    to {
        background-position-x: 0
    }
}

@keyframes skeleton-shine-ally {
    from {
        background-position-x: 120%
    }
    to {
        background-position-x: 0
    }
}

@-webkit-keyframes skeleton-color-change {
    0% {
        background-color: var(--color-g200)
    }
    50% {
        background-color: var(--color-g300)
    }
    100% {
        background-color: var(--color-g300)
    }
}

@keyframes skeleton-color-change {
    0% {
        background-color: var(--color-g200)
    }
    50% {
        background-color: var(--color-g300)
    }
    100% {
        background-color: var(--color-g300)
    }
}

@-webkit-keyframes skeleton-effect {
    0% {
        opacity: 1
    }
    50% {
        opacity: 0.4
    }
    100% {
        opacity: 1
    }
}

@keyframes skeleton-effect {
    0% {
        opacity: 1
    }
    50% {
        opacity: 0.4
    }
    100% {
        opacity: 1
    }
}

.component-skeleton-sub {
    overflow: hidden
}

.skeleton-header+.container-bgwhite {
    height: calc(100% - 5rem);
    background-color: var(--color-w100)
}

/*! component element loading spinner 컨텐츠 로딩 */

.component-loader {
    position: relative;
    text-align: center;
    margin: 6rem 0
}

.component-loader .skeleton-loader {
    top: 0;
    margin-top: 0
}

.component-loader .txt {
    padding-top: 4.8rem;
    font-size: 1.4rem;
    line-height: 1.42857;
    font-weight: bold
}

.component-skeleton-sub.shield {
    z-index: -1
}

.component-skeleton-sub.shield .skeleton-main-group {
    background-color: #f6f7f9;
    padding-bottom: 0
}

.component-skeleton-sub.shield .home-header-group {
    height: 5.6rem;
    padding: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.component-skeleton-sub.shield .home-header-group .skeleton-home-header-item01 {
    width: 4.2rem;
    height: 3.3rem;
    background-color: var(--color-w100);
    border-radius: 0.4rem
}

.component-skeleton-sub.shield .skeleton-home01-group {
    height: 61.5rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.component-skeleton-sub.shield .skeleton-home01-group [class^="skeleton-home-item"] {
    width: 100%;
    background-color: var(--color-w100);
    border-radius: 2rem;
    -webkit-filter: blur(0.3rem);
    filter: blur(0.3rem)
}

.component-skeleton-sub.shield .skeleton-home01-group .skeleton-home-item01 {
    height: 8.8rem
}

.component-skeleton-sub.shield .skeleton-home01-group .skeleton-home-item02 {
    height: 33.8rem
}

.component-skeleton-sub.shield .skeleton-home01-group .skeleton-home-item03 {
    height: 10.1rem
}

.component-skeleton-sub.shield .skeleton-home01-group .skeleton-home-item04 {
    height: 2.4rem
}

.component-skeleton-sub.shield .skeleton-home01-group .skeleton-home-item05 {
    height: 1.6rem
}

/*! component element skeleton 홈_MY */

.skeleton-main-group {
    width: 100%;
    height: 100%;
    padding: 0 2rem 11.3rem 2rem;
    background-color: var(--color-g100, #f8f8f8)
}

:root .skeleton-main-group {
    background-color: var(--color-g500)
}

.skeleton-main-group .skeleton-item02-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    height: 46.2rem;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.skeleton-main-group .skeleton-item02 {
    width: 100%;
    background-color: var(--color-w100, #fff);
    border-radius: 2rem
}

.skeleton-main-group .skeleton-item02:nth-child(1) {
    -webkit-box-flex: 1;
    -ms-flex: 1 0 0px;
    flex: 1 0 0
}

.skeleton-main-group .skeleton-item02:nth-child(2) {
    -webkit-box-flex: 2;
    -ms-flex: 2 0 0px;
    flex: 2 0 0;
    margin-top: 2rem
}

.skeleton-main-group .skeleton-item03 {
    width: 80%;
    height: 2rem;
    margin-top: 3rem;
    background-color: var(--color-w100, #fff);
    border-radius: 0.5rem
}

.skeleton-main-group .skeleton-item04 {
    width: 20%;
    height: 1.4rem;
    margin-top: 1rem;
    background-color: var(--color-w100, #fff);
    border-radius: 0.5rem
}

.skeleton-main-group .home-header-group .home-header-col>a {
    display: none
}

/*! component element skeleton 홈_추천 */

.skeleton-rec-group {
    width: 100%;
    height: 100%;
    padding: 0 2rem 11.3rem 2rem;
    background-color: var(--color-w100, #fff)
}

.skeleton-rec-group .skeleton-item01-group {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.skeleton-rec-group .skeleton-item01 {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    width: calc(25% - 0.6rem);
    height: 3.4rem;
    background-color: var(--color-cg400, #ebecf0);
    border-radius: 2rem;
    margin-right: 0.8rem
}

.skeleton-rec-group .skeleton-item01:last-child {
    margin-right: 0
}

.skeleton-rec-group .skeleton-item02-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    margin-top: 2rem;
    height: 46.2rem;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.skeleton-rec-group .skeleton-item02 {
    width: 100%;
    background-color: var(--color-cg400, #ebecf0);
    border-radius: 2rem
}

.skeleton-rec-group .skeleton-item02:nth-child(1) {
    -webkit-box-flex: 1;
    -ms-flex: 1 0 0px;
    flex: 1 0 0
}

.skeleton-rec-group .skeleton-item02:nth-child(2) {
    -webkit-box-flex: 2;
    -ms-flex: 2 0 0px;
    flex: 2 0 0;
    margin-top: 2rem
}

.skeleton-rec-group .skeleton-item03 {
    width: 80%;
    height: 2rem;
    margin-top: 3rem;
    background-color: var(--color-cg400, #ebecf0);
    border-radius: 0.5rem
}

.skeleton-rec-group .skeleton-item04 {
    width: 20%;
    height: 1.4rem;
    margin-top: 1rem;
    background-color: var(--color-cg400, #ebecf0);
    border-radius: 0.5rem
}

.skeleton-rec-group.renew {
    padding: 0 0 11.3rem 2rem;
    overflow-x: hidden
}

.skeleton-rec-group.renew .skeleton-item01-group {
    margin-top: 0;
    -webkit-box-pack: left;
    -ms-flex-pack: left;
    justify-content: left
}

.skeleton-rec-group.renew .skeleton-item01-group .skeleton-item01 {
    -webkit-box-flex: 0;
    -ms-flex: 0 6.4rem;
    flex: 0 6.4rem;
    margin-right: 12px;
    width: 6.4rem;
    height: auto;
    border-radius: 0;
    background-color: transparent
}

.skeleton-rec-group.renew .skeleton-item01-group .skeleton-item01 .skeleton-item0101 {
    width: 6.4rem;
    height: 6.4rem;
    border-radius: 50%;
    background-color: var(--color-g100, #f8f8f8)
}

.skeleton-rec-group.renew .skeleton-item01-group .skeleton-item01 .skeleton-item0102 {
    margin: 0.8rem auto 0;
    width: 4.7rem;
    height: 1.6rem;
    border-radius: 0.4rem;
    background-color: var(--color-g100, #f8f8f8)
}

:root .skeleton-rec-group.renew .skeleton-item01-group .skeleton-item01 .skeleton-item0101 {
    background-color: var(--color-g500)
}

:root .skeleton-rec-group.renew .skeleton-item01-group .skeleton-item01 .skeleton-item0102 {
    background-color: var(--color-g500)
}

.skeleton-rec-group.renew .skeleton-item02 {
    margin-top: 4.8rem;
    width: 18.3rem;
    height: 2.8rem;
    background-color: var(--color-g100, #f8f8f8);
    border-radius: 0.4rem
}

:root .skeleton-rec-group.renew .skeleton-item02 {
    background-color: var(--color-g500)
}

.skeleton-rec-group.renew .skeleton-item03-group {
    margin-top: 1.6rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: left;
    -ms-flex-pack: left;
    justify-content: left;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row;
    flex-flow: row;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap
}

.skeleton-rec-group.renew .skeleton-item03-group .skeleton-item03 {
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
    margin-top: 0;
    margin-right: 1rem;
    width: calc(100% - 2rem);
    height: auto;
    background-color: transparent;
    border: 1px solid var(--color-g100, #f8f8f8);
    border-radius: 1.6rem;
    overflow: hidden
}

:root .skeleton-rec-group.renew .skeleton-item03-group .skeleton-item03 {
    border: 1px solid var(--color-g500)
}

.skeleton-rec-group.renew .skeleton-item03-group .skeleton-item03 .skeleton-item0301 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    height: 19.5rem;
    background-color: var(--color-g100, #f8f8f8)
}

:root .skeleton-rec-group.renew .skeleton-item03-group .skeleton-item03 .skeleton-item0301 {
    background-color: var(--color-g500)
}

.skeleton-rec-group.renew .skeleton-item03-group .skeleton-item03 .skeleton-item0302 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    height: 8.7rem;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row;
    flex-flow: row;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.skeleton-rec-group.renew .skeleton-item03-group .skeleton-item03 .skeleton-item0302 .skeleton-item030201 {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    padding: 2rem 0 0 2rem;
    height: 100%;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-flow: column;
    flex-flow: column;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.skeleton-rec-group.renew .skeleton-item03-group .skeleton-item03 .skeleton-item0302 .skeleton-item030201 .skeleton-item03020101 {
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
    width: 15.9rem;
    height: 2.4rem;
    border-radius: 0.4rem;
    background-color: var(--color-g100, #f8f8f8)
}

.skeleton-rec-group.renew .skeleton-item03-group .skeleton-item03 .skeleton-item0302 .skeleton-item030201 .skeleton-item03020102 {
    margin-top: 0.4rem;
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
    width: 13.4rem;
    height: 1.6rem;
    border-radius: 0.4rem;
    background-color: var(--color-g100, #f8f8f8)
}

:root .skeleton-rec-group.renew .skeleton-item03-group .skeleton-item03 .skeleton-item0302 .skeleton-item030201 .skeleton-item03020101 {
    background-color: var(--color-g500)
}

:root .skeleton-rec-group.renew .skeleton-item03-group .skeleton-item03 .skeleton-item0302 .skeleton-item030201 .skeleton-item03020102 {
    background-color: var(--color-g500)
}

.skeleton-rec-group.renew .skeleton-item03-group .skeleton-item03 .skeleton-item0302 .skeleton-item030202 {
    -webkit-box-flex: 0;
    -ms-flex: 0 10.1rem;
    flex: 0 10.1rem;
    padding-top: 2.75rem;
    height: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.skeleton-rec-group.renew .skeleton-item03-group .skeleton-item03 .skeleton-item0302 .skeleton-item030202 .skeleton-item0302021 {
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
    width: 8.1rem;
    height: 3.2rem;
    border-radius: 1rem;
    background-color: var(--color-g100, #f8f8f8)
}

.skeleton-rec-group.renew .skeleton-item04 {
    margin-top: 3.2rem;
    width: 25.4rem;
    height: 2.4rem;
    border-radius: 0.4rem;
    background-color: var(--color-g100, #f8f8f8)
}

.skeleton-rec-group.renew .skeleton-item05 {
    margin-top: 1.2rem;
    width: 16.3rem;
    height: 2rem;
    border-radius: 0.4rem;
    background-color: var(--color-g100, #f8f8f8)
}

:root .skeleton-rec-group.renew .skeleton-item03-group .skeleton-item03 .skeleton-item0302 .skeleton-item030202 .skeleton-item0302021 {
    background-color: var(--color-g500)
}

:root .skeleton-rec-group.renew .skeleton-item04 {
    background-color: var(--color-g500)
}

:root .skeleton-rec-group.renew .skeleton-item05 {
    background-color: var(--color-g500)
}

/*! component element skeleton 홈_타임라인 */

.skeleton-timeline-group {
    width: 100%;
    height: 100%;
    padding: 1.2rem 2rem 11.3rem 2rem;
    background-color: var(--color-w100, #fff)
}

.skeleton-timeline-group .skeleton-item01 {
    width: 12rem;
    height: 1.4rem;
    background-color: var(--color-g100, #f8f8f8);
    border-radius: 0.5rem
}

.skeleton-timeline-group .skeleton-item02-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    margin-top: 1rem
}

.skeleton-timeline-group .skeleton-item02-img {
    -webkit-box-flex: 1;
    -ms-flex: 1 0 auto;
    flex: 1 0 auto;
    width: 3.6rem;
    height: 3.6rem;
    margin-top: 0.8rem;
    background-color: var(--color-g100, #f8f8f8);
    border-radius: 50%
}

.skeleton-timeline-group .skeleton-item02-box {
    -webkit-box-flex: 0;
    -ms-flex: 0 1 100%;
    flex: 0 1 100%;
    height: 10rem;
    margin-left: 0.8rem;
    background-color: var(--color-g100, #f8f8f8);
    border-radius: 1rem
}

.skeleton-timeline-group .skeleton-item03-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-top: 2rem
}

.skeleton-timeline-group .skeleton-item03-group+.skeleton-item04-group {
    margin-top: 0.6rem
}

.skeleton-timeline-group .skeleton-item03-img {
    -webkit-box-flex: 1;
    -ms-flex: 1 0 auto;
    flex: 1 0 auto;
    width: 3.6rem;
    height: 3.6rem;
    background-color: var(--color-g100, #f8f8f8);
    border-radius: 50%
}

.skeleton-timeline-group .skeleton-item03-box {
    -webkit-box-flex: 0;
    -ms-flex: 0 1 100%;
    flex: 0 1 100%;
    height: 2rem;
    margin-left: 0.8rem;
    background-color: var(--color-g100, #f8f8f8);
    border-radius: 0.4rem
}

.skeleton-timeline-group .skeleton-item04-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    padding-left: 4.4rem;
    margin-top: 0.8rem
}

.skeleton-timeline-group .skeleton-item04-box {
    -webkit-box-flex: 0;
    -ms-flex: 0 1 100%;
    flex: 0 1 100%;
    height: 8.2rem;
    background-color: var(--color-g100, #f8f8f8);
    border-radius: 1rem
}

:root .skeleton-timeline-group .skeleton-item01 {
    background-color: var(--color-g500)
}

:root .skeleton-timeline-group .skeleton-item02-img {
    background-color: var(--color-g500)
}

:root .skeleton-timeline-group .skeleton-item02-box {
    background-color: var(--color-g500)
}

:root .skeleton-timeline-group .skeleton-item03-img {
    background-color: var(--color-g500)
}

:root .skeleton-timeline-group .skeleton-item03-box {
    background-color: var(--color-g500)
}

:root .skeleton-timeline-group .skeleton-item04-box {
    background-color: var(--color-g500)
}

/*! component element skeleton 홈_전체메뉴 renewal 2023-11-07 */

.skeleton-menu-group.renewal {
    width: 100%;
    height: 100%;
    padding: 0 2rem 15.4rem 2rem;
    background-color: var(--color-w100, #fff)
}

.skeleton-menu-group.renewal .skeleton-item00 {
    width: 100%;
    height: 4.6rem;
    border-radius: 1.2rem;
    background-color: var(--color-g100, #f8f8f8)
}

.skeleton-menu-group.renewal .skeleton-item-group-01 {
    margin-top: 1.2rem;
    border: 1px solid var(--color-g100, #f8f8f8);
    border-radius: 1.2rem;
    padding: 2.5rem 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.skeleton-menu-group.renewal .skeleton-item01-group {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: space-evenly;
    -ms-flex-pack: space-evenly;
    justify-content: space-evenly
}

.skeleton-menu-group.renewal .skeleton-item01 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.skeleton-menu-group.renewal .skeleton-item01-img {
    width: 2.8rem;
    height: 2.8rem;
    border-radius: 50%;
    background-color: var(--color-g100, #f8f8f8)
}

.skeleton-menu-group.renewal .skeleton-item01-txt {
    margin-top: 1rem;
    width: 5.2rem;
    height: 1.4rem;
    border-radius: 0.4rem;
    background-color: var(--color-g100, #f8f8f8)
}

.skeleton-menu-group.renewal .skeleton-item02-group {
    margin: 2.5rem 2rem 0;
    width: calc(100% - 4rem);
    border-top: 1px solid var(--color-g100, #f8f8f8)
}

.skeleton-menu-group.renewal .skeleton-item02 {
    margin-top: 2rem;
    width: 12rem;
    height: 1.8rem;
    border-radius: 0.4rem;
    background-color: var(--color-g100, #f8f8f8)
}

.skeleton-menu-group.renewal .skeleton-item03-group {
    margin-top: 3.6rem
}

.skeleton-menu-group.renewal .skeleton-item03-group>.skeleton-item03-item {
    margin-top: 2.8rem;
    width: 12rem;
    height: 2.4rem;
    border-radius: 0.4rem;
    background-color: var(--color-g100, #f8f8f8)
}

.skeleton-menu-group.renewal .skeleton-item03-item:nth-child(1) {
    width: 9rem
}

.skeleton-menu-group.renewal .skeleton-item03-item:nth-child(2) {
    width: 22rem
}

.skeleton-menu-group.renewal .skeleton-item03-item:nth-child(3) {
    width: 26rem
}

.skeleton-menu-group.renewal .skeleton-item03-item:nth-child(4) {
    width: 22rem
}

.skeleton-menu-group.renewal .skeleton-item03-item:nth-child(5) {
    width: 15rem
}

.skeleton-menu-group.renewal .skeleton-item03-item:nth-child(6) {
    width: 21rem
}

:root .skeleton-menu-group.renewal .skeleton-item00 {
    background-color: var(--color-g500)
}

:root .skeleton-menu-group.renewal .skeleton-item01-img {
    background-color: var(--color-g500)
}

:root .skeleton-menu-group.renewal .skeleton-item01-txt {
    background-color: var(--color-g500)
}

:root .skeleton-menu-group.renewal .skeleton-item02 {
    background-color: var(--color-g500)
}

:root .skeleton-menu-group.renewal .skeleton-item03-group>.skeleton-item03-item {
    background-color: var(--color-g500)
}

.component-skeleton-sub [class^="btn-home-tab"] {
    top: 0
}

.component-skeleton-sub .new-home [class^="btn-home-tab"] {
    top: -30px;
    padding: 10px 0
}

.component-skeleton-sub .ico-main-ci {
    display: inline-block;
    width: 8rem;
    height: 3.2rem;
    background-image: url("/resource/img/bim/ico_main_ci.png");
    opacity: 0
}

.skeleton-main-group {
    padding-top: 0
}

.skeleton-main-group .home-header-group.my-header-group {
    padding: 0;
    padding-bottom: 1.35rem
}

.skeleton-main-group .home-header-group.my-header-group .svg-main-benefit .box,
.skeleton-main-group .home-header-group.my-header-group .svg-main-benefit .money {
    display: none
}

.skeleton-main-group .skeleton-item02-group {
    padding-top: 2.4rem
}

.skeleton-rec-group {
    padding-top: 0
}

.skeleton-rec-group .skeleton-header {
    height: 6.0rem
}

.skeleton-rec-group .skeleton-header .skeleton-title {
    width: 4.2rem;
    height: 2.7rem;
    text-indent: -100rem;
    overflow: hidden;
    background-color: var(--color-g100, #f8f8f8);
    border-radius: 0.4rem
}

:root .skeleton-rec-group .skeleton-header .skeleton-title {
    background-color: var(--color-g500)
}

.skeleton-rec-group .skeleton-item01-group {
    margin-top: 1.0rem
}

.skeleton-timeline-group {
    padding-top: 0
}

.skeleton-timeline-group .skeleton-header {
    height: 6.0rem
}

.skeleton-timeline-group .skeleton-header .skeleton-title {
    width: 4.2rem;
    height: 2.7rem;
    text-indent: -100rem;
    font-size: 2.4rem;
    font-weight: bold;
    overflow: hidden;
    background-color: var(--color-g100, #f8f8f8);
    border-radius: 0.4rem
}

:root .skeleton-timeline-group .skeleton-header .skeleton-title {
    background-color: var(--color-g500)
}

.skeleton-timeline-group .skeleton-header .right {
    display: none
}

.skeleton-menu-group {
    padding-top: 0
}

.skeleton-menu-group .skeleton-header {
    height: 6.0rem
}

.skeleton-menu-group .skeleton-header .skeleton-h-item00 {
    width: 8.5rem;
    height: 2.8rem;
    border-radius: 0.4rem;
    background-color: var(--color-g100, #f8f8f8);
    position: relative;
    top: 2px
}

.skeleton-menu-group .skeleton-header .skeleton-h-item00:after {
    content: '';
    position: absolute;
    width: 8.5rem;
    height: 2.8rem;
    border-radius: 0.4rem;
    background: var(--color-g100, #f8f8f8)
}

:root .skeleton-menu-group .skeleton-header .skeleton-h-item00:after {
    background: var(--color-g500)
}

.skeleton-menu-group .skeleton-header .right {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.skeleton-menu-group .skeleton-header .right .skeleton-h-item01 {
    width: 5.8rem;
    height: 1.9rem;
    border-radius: 1.2rem;
    font-size: 1.2rem;
    font-weight: 400;
    line-height: 1.33333;
    color: var(--color-g700, #7d7d7d);
    background-color: var(--color-g200, #eee);
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-right: 1.2rem;
    padding: 0.1rem 0.8rem 0 0.8rem
}

.skeleton-menu-group .skeleton-header .right .btn-timeline-refresh {
    visibility: hidden
}

.home-header-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    height: 6rem;
    padding: 0 2rem
}

.home-header-group.my-header-group {
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    padding-bottom: 1.35rem
}

.home-header-col {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.component-skeleton-sub svg.ico-main-ci {
    position: absolute;
    top: 2px;
    left: 3px;
    margin: 0;
    padding: 0;
    width: 7.4rem;
    height: 3.2rem;
    background-image: none;
    vertical-align: middle;
    opacity: 1
}

.home-header-group .btn-main-benefit {
    display: block;
    position: relative;
    margin-bottom: 0.35rem
}

.home-header-group.my-header-group .svg-main-benefit {
    top: 0.6rem;
    left: 0.5rem
}

.svg-main-benefit {
    display: block;
    position: relative;
    width: 40px;
    height: 40px
}

.svg-main-benefit .box {
    display: block;
    position: absolute;
    bottom: 0;
    left: 1px;
    width: 32px;
    height: 32px
}

.svg-main-benefit .money {
    display: block;
    position: absolute;
    bottom: 6px;
    right: 5px;
    width: 16px;
    height: 16px
}

[class^="component-"].fixed-bottom.home-tab-menu {
    background-color: var(--color-w100, #fff);
    border-top: 1px solid var(--color-g200, #eee);
    height: 5.7rem
}

[class^="btn-home-tab"] {
    text-align: center;
    padding: 1rem 0;
    position: relative;
    top: -3.3rem
}

[class^="btn-home-tab"] [class^="ico-home-tab"] {
    width: 4rem;
    height: 4rem;
    background-size: 4rem 4rem
}

[class^="btn-home-tab"] .ico-home-tab1 {
    -webkit-transition: background-image 0.3s ease;
    -o-transition: background-image 0.3s ease;
    transition: background-image 0.3s ease;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40'%3E%3Cpath fill='transparent' d='M0 0h40v40H0z' opacity='.2'/%3E%3Cg fill='%23141414'%3E%3Cpath d='M29.41 9a3.09 3.09 0 0 1 3.085 2.915l.005.175V17a1 1 0 0 1-1.993.117L30.5 17v-4.91a1.09 1.09 0 0 0-.971-1.084L29.41 11H10.59a1.09 1.09 0 0 0-1.084.971l-.006.119v15.82c0 .562.425 1.024.971 1.084l.119.006h18.82a1.09 1.09 0 0 0 1.084-.971l.006-.119V23a1 1 0 0 1 1.993-.117L32.5 23v4.91a3.09 3.09 0 0 1-2.915 3.085L29.41 31H10.59a3.09 3.09 0 0 1-3.085-2.915L7.5 27.91V12.09a3.09 3.09 0 0 1 2.915-3.085L10.59 9z'/%3E%3Cpath d='M31.41 16H27.5a4 4 0 0 0 0 8h3.91a3.09 3.09 0 0 0 3.09-3.09v-1.82A3.09 3.09 0 0 0 31.41 16zm-3.91 2h3.91c.602 0 1.09.488 1.09 1.09v1.82A1.09 1.09 0 0 1 31.41 22H27.5a2 2 0 1 1 0-4z'/%3E%3C/g%3E%3C/svg%3E")
}

[class^="btn-home-tab"] .ico-home-tab2 {
    -webkit-transition: background-image 0.3s ease;
    -o-transition: background-image 0.3s ease;
    transition: background-image 0.3s ease;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40'%3E%3Cpath fill='transparent' d='M0 0h40v40H0z' opacity='.2'/%3E%3Cpath fill='%23141414' d='M16.699 9.55a2.352 2.352 0 0 1 2.351 2.351V16.7a2.352 2.352 0 0 1-2.351 2.351H11.9A2.352 2.352 0 0 1 9.549 16.7v-4.8A2.352 2.352 0 0 1 11.9 9.549h4.8zm0 1.9H11.9a.451.451 0 0 0-.444.37l-.007.081V16.7c0 .221.16.406.37.444l.081.007h4.8c.221 0 .406-.16.444-.37l.007-.081v-4.8a.451.451 0 0 0-.37-.444l-.081-.007zm0 9.5a2.352 2.352 0 0 1 2.351 2.351V28.1a2.352 2.352 0 0 1-2.351 2.351H11.9A2.352 2.352 0 0 1 9.549 28.1v-4.8a2.352 2.352 0 0 1 2.351-2.351h4.8zm0 1.9H11.9a.451.451 0 0 0-.444.37l-.007.081V28.1c0 .221.16.406.37.444l.081.007h4.8c.221 0 .406-.16.444-.37l.007-.081v-4.8a.451.451 0 0 0-.37-.444l-.081-.007zm11.4-1.9a2.352 2.352 0 0 1 2.351 2.351V28.1a2.352 2.352 0 0 1-2.351 2.351H23.3a2.352 2.352 0 0 1-2.351-2.351v-4.8a2.352 2.352 0 0 1 2.351-2.351h4.8zm0 1.9H23.3a.451.451 0 0 0-.444.37l-.007.081V28.1c0 .221.16.406.37.444l.081.007h4.8c.221 0 .406-.16.444-.37l.007-.081v-4.8a.451.451 0 0 0-.37-.444l-.081-.007zm-2.526-13.3c.64 0 1.166.486 1.229 1.109l.006.126v2.248h2.249a1.235 1.235 0 0 1 .126 2.464l-.126.006h-2.249v2.249a1.234 1.234 0 0 1-2.463.126l-.007-.126v-2.249H22.09a1.234 1.234 0 0 1-.126-2.463l.126-.007h2.248v-2.248c0-.682.553-1.235 1.235-1.235z'/%3E%3C/svg%3E")
}

[class^="btn-home-tab"] .ico-home-tab3 {
    -webkit-transition: background-image 0.3s ease;
    -o-transition: background-image 0.3s ease;
    transition: background-image 0.3s ease;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40'%3E%3Cpath fill='transparent' d='M0 0h40v40H0z' opacity='.2'/%3E%3Cpath fill='%23141414' d='M20 8c6.616 0 12 5.383 12 12s-5.384 12-12 12S8 26.617 8 20 13.384 8 20 8zm0 2c-5.512 0-10 4.488-10 10s4.488 10 10 10 10-4.488 10-10-4.488-10-10-10zm0 3.136a1.1 1.1 0 0 1 1.094.98l.006.12v5.914l3.963 1.573c.527.21.803.78.655 1.315l-.038.113a1.1 1.1 0 0 1-1.315.655l-.114-.038-4.657-1.849a1.1 1.1 0 0 1-.686-.889l-.008-.133v-6.66a1.1 1.1 0 0 1 1.1-1.1z'/%3E%3C/svg%3E")
}

[class^="btn-home-tab"] .ico-home-tab4 {
    -webkit-transition: background-image 0.3s ease;
    -o-transition: background-image 0.3s ease;
    transition: background-image 0.3s ease;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' id='레이어_1' viewBox='0 0 40 40' width='40' height='40'%3E%3Cstyle%3E.st0%7Bclip-path:url(%23SVGID_00000051376255471979520790000008095385281213710231_)%7D%3C/style%3E%3Cdefs%3E%3Cpath id='SVGID_1_' d='M27.8 26.5c0 2.8-2.2 5-5 5h-12c-2.8 0-5-2.2-5-5s2.2-5 5-5h12c2.8 0 5 2.2 5 5zm-20 0c0 1.7 1.3 3 3 3h12c1.7 0 3-1.3 3-3s-1.3-3-3-3h-12c-1.7 0-3 1.3-3 3zM22.3 14c0 3-2.5 5.5-5.5 5.5S11.3 17 11.3 14s2.5-5.5 5.5-5.5 5.5 2.5 5.5 5.5zm-9 0c0 1.9 1.6 3.5 3.5 3.5s3.5-1.6 3.5-3.5-1.6-3.5-3.5-3.5-3.5 1.6-3.5 3.5z'/%3E%3C/defs%3E%3CclipPath id='SVGID_00000031197706254579383860000013802329169818036404_'%3E%3Cuse overflow='visible' xlink:href='%23SVGID_1_'/%3E%3C/clipPath%3E%3Cg clip-path='url(%23SVGID_00000031197706254579383860000013802329169818036404_)'%3E%3Cpath id='a1030z' d='M27.8 26.5c0 2.8-2.2 5-5 5h-12c-2.8 0-5-2.2-5-5s2.2-5 5-5h12c2.8 0 5 2.2 5 5zm-20 0c0 1.7 1.3 3 3 3h12c1.7 0 3-1.3 3-3s-1.3-3-3-3h-12c-1.7 0-3 1.3-3 3zM22.3 14c0 3-2.5 5.5-5.5 5.5S11.3 17 11.3 14s2.5-5.5 5.5-5.5 5.5 2.5 5.5 5.5zm-9 0c0 1.9 1.6 3.5 3.5 3.5s3.5-1.6 3.5-3.5-1.6-3.5-3.5-3.5-3.5 1.6-3.5 3.5z'/%3E%3C/g%3E%3Cpath d='M33 11.5h-6.1c-.5 0-1 .5-1 1s.5 1 1 1H33c.5 0 1-.5 1-1s-.5-1-1-1zm0 8.5h-3c-.5 0-1 .5-1 1s.5 1 1 1h3c.5 0 1-.5 1-1s-.5-1-1-1zm0-4.2h-7.6c-.5 0-1 .5-1 1s.5 1 1 1H33c.5 0 1-.5 1-1s-.5-1-1-1z'/%3E%3C/svg%3E")
}

[class^="btn-home-tab"].on .ico-home-tab1 {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40'%3E%3Cpath fill='transparent' d='M0 0h40v40H0z' opacity='.2'/%3E%3Cpath fill='%23141414' d='M29.41 9a3.09 3.09 0 0 1 3.09 3.09v4.108A3.097 3.097 0 0 0 31.41 16H27.5a4 4 0 0 0 0 8h3.91c.384 0 .752-.07 1.09-.198v4.108A3.09 3.09 0 0 1 29.41 31H10.59a3.09 3.09 0 0 1-3.09-3.09V12.09A3.09 3.09 0 0 1 10.59 9zm2 9c.602 0 1.09.488 1.09 1.09v1.82A1.09 1.09 0 0 1 31.41 22H27.5a2 2 0 1 1 0-4z'/%3E%3C/svg%3E")
}

[class^="btn-home-tab"].on .ico-home-tab2 {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40'%3E%3Cpath fill='transparent' d='M0 0h40v40H0z' opacity='.2'/%3E%3Cpath fill='%23141414' d='M11.901 9.55H16.7a2.352 2.352 0 0 1 2.351 2.351V16.7a2.352 2.352 0 0 1-2.351 2.351h-4.8A2.352 2.352 0 0 1 9.549 16.7v-4.8A2.352 2.352 0 0 1 11.9 9.549zm0 11.4H16.7a2.352 2.352 0 0 1 2.351 2.351V28.1a2.352 2.352 0 0 1-2.351 2.351h-4.8A2.352 2.352 0 0 1 9.549 28.1v-4.8a2.352 2.352 0 0 1 2.351-2.351zm11.4 0H28.1a2.352 2.352 0 0 1 2.351 2.351V28.1a2.352 2.352 0 0 1-2.351 2.351h-4.8a2.352 2.352 0 0 1-2.351-2.351v-4.8a2.352 2.352 0 0 1 2.351-2.351zm2.272-11.4c.64 0 1.166.486 1.229 1.109l.006.126v2.248h2.249a1.235 1.235 0 0 1 .126 2.464l-.126.006h-2.249v2.249a1.234 1.234 0 0 1-2.463.126l-.007-.126v-2.249H22.09a1.234 1.234 0 0 1-.126-2.463l.126-.007h2.248v-2.248c0-.682.553-1.235 1.235-1.235z'/%3E%3C/svg%3E")
}

[class^="btn-home-tab"].on .ico-home-tab3 {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40'%3E%3Cpath fill='transparent' d='M0 0h40v40H0z' opacity='.2'/%3E%3Cpath fill='%23141414' d='M20 8c6.616 0 12 5.383 12 12s-5.384 12-12 12S8 26.617 8 20 13.384 8 20 8zm0 5.136a1.1 1.1 0 0 0-1.1 1.1v6.66l.008.134c.048.4.312.741.686.89l4.657 1.848.114.038a1.1 1.1 0 0 0 1.315-.655l.038-.113a1.1 1.1 0 0 0-.655-1.315L21.1 20.15v-5.914l-.006-.12a1.1 1.1 0 0 0-1.094-.98z'/%3E%3C/svg%3E")
}

[class^="btn-home-tab"].on .ico-home-tab4 {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40' width='40' height='40'%3E%3Cpath d='M33 11.5h-6.1c-.5 0-1 .5-1 1s.5 1 1 1H33c.5 0 1-.5 1-1s-.5-1-1-1zm0 8.5h-3c-.5 0-1 .5-1 1s.5 1 1 1h3c.5 0 1-.5 1-1s-.5-1-1-1zm0-4.2h-7.6c-.5 0-1 .5-1 1s.5 1 1 1H33c.5 0 1-.5 1-1s-.5-1-1-1zm-10.2 5.7h-12c-2.8 0-5 2.2-5 5s2.2 5 5 5h12c2.8 0 5-2.2 5-5s-2.2-5-5-5zm-6-12.7c-2.9 0-5.2 2.4-5.2 5.2s2.4 5.2 5.2 5.2S22 16.8 22 14s-2.3-5.2-5.2-5.2z'/%3E%3C/svg%3E")
}

[class^="btn-home-tab"] .new-info {
    position: absolute;
    top: 1.3rem;
    right: 1.8rem;
    width: 0.4rem;
    height: 0.4rem;
    border-radius: 50%;
    background-color: var(--color-re700, #f02727)
}

[class^="component-"].fixed-bottom.home-tab-menu.new-home {
    padding: 28px 8px;
    border-radius: 20px 20px 0 0;
    -webkit-box-shadow: 0 -1px 4px 0 rgba(20, 20, 20, 0.1);
    box-shadow: 0 -1px 4px 0 rgba(20, 20, 20, 0.1);
    border: 0
}

.new-home [class^="btn-home-tab"] {
    top: -30px;
    padding: 10px 0
}

.new-home .btn-group [class^="btn-"]+[class^="btn-"] {
    margin-left: 0
}

.new-home .btn-group [class^="btn-"] em {
    position: absolute;
    bottom: -5px;
    left: calc(50% - 0.5px);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    font-size: 11px;
    line-height: 1.2;
    font-weight: bold;
    white-space: nowrap
}

.new-home .btn-group .btn-ico-item {
    display: inline-block;
    vertical-align: middle;
    position: relative;
    width: 40px;
    height: 40px
}

.new-home .btn-group .btn-ico-item .btn-home-svgicon {
    position: absolute;
    top: 0;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    width: 34px;
    height: 34px;
    margin: 0
}

.new-home .btn-group .btn-ico-item .new-info {
    top: 3px;
    right: 5px
}

[class^="btn-home-tab"] .new-info {
    width: 4px;
    height: 4px
}

/*! component element skeleton 서브 1 */

.skeleton-layout-group {
    width: 100%;
    height: 100%
}

.skeleton-group {
    width: 100%;
    padding-top: 2.2rem;
    padding-bottom: 2.2rem
}

.skeleton-group.group-gray {
    background-color: var(--color-g100, #f8f8f8) !important
}

:root .skeleton-group.group-gray {
    background-color: var(--bg-qua) !important
}

.skeleton-group.pdtb0 {
    padding-top: 0;
    padding-bottom: 0
}

.skeleton-col {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.skeleton-col.fd-c {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.skeleton-col.jc-c {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.skeleton-col.jc-sb {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.skeleton-col.jc-fe {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.skeleton-col.jc-fe.trading-mg {
    margin: 3.8rem 0 1.6rem
}

.skeleton-col+.skeleton-col {
    margin-top: 3rem
}

.skeleton-field {
    border-radius: 0.4rem
}

.skeleton-field.field-gray {
    background-color: var(--color-g100, #f8f8f8) !important
}

.skeleton-field.field-lightgray2 {
    background-color: var(--color-g200, #eee) !important
}

:root .skeleton-field.field-gray {
    background-color: var(--color-g500) !important
}

:root .skeleton-field.field-lightgray2 {
    background-color: var(--color-g500) !important
}

.skeleton-field.w10 {
    width: 10%
}

.skeleton-field.w20 {
    width: 20%
}

.skeleton-field.w30 {
    width: 30%
}

.skeleton-field.w40 {
    width: 40%
}

.skeleton-field.w50 {
    width: 50%
}

.skeleton-field.w60 {
    width: 60%
}

.skeleton-field.w70 {
    width: 70%
}

.skeleton-field.w80 {
    width: 80%
}

.skeleton-field.w90 {
    width: 90%
}

.skeleton-field.h7 {
    height: 0.7rem
}

.skeleton-field.h16 {
    height: 1.6rem
}

.skeleton-field.h14 {
    height: 1.4rem
}

.skeleton-field.h20 {
    height: 2rem
}

.skeleton-field.h24 {
    height: 2.4rem
}

.skeleton-field.h25 {
    height: 2.5rem
}

.skeleton-field.h30 {
    height: 3rem
}

.skeleton-field.h32 {
    height: 3.2rem
}

.skeleton-field.h48 {
    height: 4.8rem
}

.skeleton-field.mt6 {
    margin-top: 0.6rem
}

.skeleton-field.ml10 {
    margin-left: 1rem
}

.skeleton-field.radius4 {
    border-radius: 0.4rem
}

.skeleton-field.radius12 {
    border-radius: 1.2rem
}

/*! component element skeleton 홈_혜택 */

.skeleton-benefit-group {
    position: relative;
    width: 100%;
    height: 100%;
    padding: 0 0 11.3rem 0;
    background-color: var(--color-w100, #fff)
}

.skeleton-benefit-group .skeleton-item01-group {
    padding: 3rem 0 0 0;
    height: 19.6rem;
    background-color: var(--color-g100, #f8f8f8)
}

:root .skeleton-benefit-group .skeleton-item01-group {
    background-color: var(--color-g400)
}

.skeleton-benefit-group .skeleton-item01-1 {
    width: 70%;
    height: 1.4rem;
    border-radius: 0.4rem;
    background-color: var(--color-g200, #eee);
    margin: 0 auto
}

.skeleton-benefit-group .skeleton-item01-2 {
    width: 50%;
    height: 1.4rem;
    margin: 1rem auto 0 auto;
    border-radius: 0.4rem;
    background-color: var(--color-g200, #eee)
}

:root .skeleton-benefit-group .skeleton-item01-1 {
    background-color: var(--color-g500)
}

:root .skeleton-benefit-group .skeleton-item01-2 {
    background-color: var(--color-g500)
}

.skeleton-benefit-group .skeleton-swiper-container {
    margin-top: -10.4rem
}

.skeleton-benefit-group .skeleton-swiper-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding-left: 2rem
}

.skeleton-benefit-group .skeleton-swiper-item {
    -webkit-box-flex: 1;
    -ms-flex: 1 0 auto;
    flex: 1 0 auto;
    width: calc(100% - 3.7rem);
    margin-right: 1.5rem;
    height: 14.2rem;
    background-color: var(--color-w100, #fff);
    border-radius: 1.4rem;
    border: 1px solid var(--color-g100, #f8f8f8)
}

:root .skeleton-benefit-group .skeleton-swiper-item {
    border: 1px solid var(--color-g500)
}

.skeleton-benefit-group .skeleton-dot-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 1.6rem 0 0 0
}

.skeleton-benefit-group .skeleton-dot-item {
    width: 0.7rem;
    height: 0.7rem;
    margin: 0 0.3rem 0 0.3rem;
    border-radius: 50%;
    background-color: var(--color-g100, #f8f8f8)
}

:root .skeleton-benefit-group .skeleton-dot-item {
    background-color: var(--color-g500)
}

.skeleton-benefit-group .skeleton-item02-group {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.skeleton-benefit-group .skeleton-item02-group+.skeleton-item03-group {
    margin-top: 3.8rem
}

.skeleton-benefit-group .skeleton-item-container {
    padding: 4.7rem 2rem 0 2rem
}

.skeleton-benefit-group .skeleton-item02 {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    width: calc(25% - 0.6rem);
    height: 3.4rem;
    background-color: var(--color-g100, #f8f8f8);
    border-radius: 2rem;
    margin-right: 0.8rem
}

:root .skeleton-benefit-group .skeleton-item02 {
    background-color: var(--color-g500)
}

.skeleton-benefit-group .skeleton-item02:last-child {
    margin-right: 0
}

.skeleton-benefit-group .skeleton-item03-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-top: 4.4rem
}

.skeleton-benefit-group .skeleton-item03-img {
    -webkit-box-flex: 0;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    width: 6.6rem;
    height: 6.6rem;
    background-color: var(--color-g100, #f8f8f8);
    border-radius: 50%
}

:root .skeleton-benefit-group .skeleton-item03-img {
    background-color: var(--color-g500)
}

.skeleton-benefit-group .skeleton-item03-txt {
    -webkit-box-flex: 1;
    -ms-flex: 1 0 auto;
    flex: 1 0 auto;
    padding: 0 0 0 1.2rem
}

.skeleton-benefit-group .skeleton-item03-txt01 {
    width: 50%;
    height: 1.4rem;
    border-radius: 0.4rem;
    background-color: var(--color-g100, #f8f8f8)
}

.skeleton-benefit-group .skeleton-item03-txt02 {
    width: 90%;
    height: 2rem;
    margin-top: 1rem;
    background-color: var(--color-g100, #f8f8f8);
    border-radius: 0.4rem
}

:root .skeleton-benefit-group .skeleton-item03-txt01 {
    background-color: var(--color-g500)
}

:root .skeleton-benefit-group .skeleton-item03-txt02 {
    background-color: var(--color-g500)
}

/*! component element skeleton 부동산자산관리_홈 */

.skeleton-realestate-group {
    position: relative;
    width: 100%;
    height: 100%;
    padding: 0 1.9rem
}

.skeleton-realestate-group .skeleton-item01 {
    width: 51%;
    height: 2.8rem;
    background: var(--color-g100, #f8f8f8);
    border-radius: 0.5rem
}

.skeleton-realestate-group .skeleton-item02 {
    width: 78%;
    height: 1.9rem;
    background: var(--color-g100, #f8f8f8);
    border-radius: 0.5rem;
    margin: 1.9rem 0
}

.skeleton-realestate-group .skeleton-item03 {
    width: 100%;
    height: 5.1rem;
    background: var(--color-g100, #f8f8f8);
    border-radius: 0.5rem
}

.skeleton-realestate-group .skeleton-item04 {
    width: 100%;
    height: calc(100% - 23.4rem);
    background: var(--color-g100, #f8f8f8);
    border-radius: 0.5rem;
    margin: 1.9rem 0;
    max-height: 60%
}

:root .skeleton-realestate-group .skeleton-item01 {
    background: var(--color-g500)
}

:root .skeleton-realestate-group .skeleton-item02 {
    background: var(--color-g500)
}

:root .skeleton-realestate-group .skeleton-item03 {
    background: var(--color-g500)
}

:root .skeleton-realestate-group .skeleton-item04 {
    background: var(--color-g500)
}

/*! component element skeleton 이체하기 */

.skeleton-transfer-group {
    position: relative;
    width: 100%;
    height: 100%;
    padding: 0 1.9rem
}

.skeleton-transfer-group .skeleton-item01 {
    width: 20.5rem;
    height: 3.3rem;
    background: var(--color-g100, #f8f8f8);
    border-radius: 0.5rem
}

.skeleton-transfer-group .skeleton-item02 {
    width: 100%;
    height: 7.4rem;
    background: var(--color-g100, #f8f8f8);
    border-radius: 0.5rem;
    margin-top: 3.3rem
}

.skeleton-transfer-group .skeleton-item03 {
    width: 8.6rem;
    height: 2.5rem;
    background: var(--color-g100, #f8f8f8);
    border-radius: 0.5rem;
    margin-top: 8.6rem
}

.skeleton-transfer-group .skeleton-item04 {
    width: 10.6rem;
    height: 2rem;
    background: var(--color-g100, #f8f8f8);
    border-radius: 0.5rem;
    margin-top: 2.2rem
}

:root .skeleton-transfer-group .skeleton-item01 {
    background: var(--color-g500)
}

:root .skeleton-transfer-group .skeleton-item02 {
    background: var(--color-g500)
}

:root .skeleton-transfer-group .skeleton-item03 {
    background: var(--color-g500)
}

:root .skeleton-transfer-group .skeleton-item04 {
    background: var(--color-g500)
}

.skeleton-transfer-group .skeleton-item-container {
    padding: 1rem 0 0
}

.skeleton-transfer-group .skeleton-item03-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 1.4rem 0;
    border-bottom: 1px solid var(--color-w100, #fff)
}

.skeleton-transfer-group .skeleton-item03-img {
    -webkit-box-flex: 0;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    width: 3.4rem;
    height: 3.4rem;
    background-color: var(--color-g100, #f8f8f8);
    border-radius: 50%
}

:root .skeleton-transfer-group .skeleton-item03-img {
    background-color: var(--color-g500)
}

.skeleton-transfer-group .skeleton-item03-txt {
    -webkit-box-flex: 1;
    -ms-flex: 1 0 auto;
    flex: 1 0 auto;
    padding: 0 0 0 1.2rem
}

.skeleton-transfer-group .skeleton-item03-txt01 {
    width: 18.4rem;
    height: 2.1rem;
    border-radius: 0.4rem;
    background-color: var(--color-g100, #f8f8f8)
}

.skeleton-transfer-group .skeleton-item03-txt02 {
    width: 13.8rem;
    height: 2rem;
    margin-top: 0.4rem;
    background-color: var(--color-g100, #f8f8f8);
    border-radius: 0.4rem
}

:root .skeleton-transfer-group .skeleton-item03-txt01 {
    background-color: var(--color-g500)
}

:root .skeleton-transfer-group .skeleton-item03-txt02 {
    background-color: var(--color-g500)
}

/*! component element graybox-text 아담대 - 그레이박스 스켈레톤그룹 */

.graybox-skeleton-group {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: var(--color-g100, #f8f8f8);
    border-radius: 1rem;
    padding: 2rem
}

.graybox-skeleton-group .skeleton-item-01 {
    width: 6rem;
    height: 6rem;
    border-radius: 0.4rem;
    background-color: #ebecf0;
    margin: 0 auto
}

.graybox-skeleton-group .skeleton-item-02 {
    width: 70%;
    height: 3.2rem;
    border-radius: 0.4rem;
    background-color: #ebecf0;
    margin: 0.4rem auto 0
}

.graybox-skeleton-group .skeleton-item-03 {
    width: 40%;
    height: 2rem;
    border-radius: 0.4rem;
    background-color: #ebecf0;
    margin: 0.4rem auto 0
}

.graybox-skeleton-group .skeleton-item-04 {
    width: 80%;
    height: 2rem;
    border-radius: 0.4rem;
    background-color: #ebecf0;
    margin: 0.8rem auto 0
}

.graybox-skeleton-group .skeleton-item-05 {
    width: 50%;
    height: 1.4rem;
    border-radius: 0.4rem;
    background-color: #ebecf0;
    margin: 1.6rem 0 0 auto
}

.graybox-skeleton-group02 {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%
}

.graybox-skeleton-group02 [class^="skeleton-item-"] {
    margin: 0 auto;
    border-radius: 0.4rem;
    background-color: var(--color-g200, #eee)
}

:root .graybox-skeleton-group [class^="skeleton-item-"],
:root .graybox-skeleton-group02 [class^="skeleton-item-"] {
    background: -webkit-gradient(linear, right top, left top, color-stop(50%, #e0e6f1), color-stop(60%, #67748e), color-stop(70%, #e0e6f1), to(#e0e6f1));
    background: -o-linear-gradient(right, #e0e6f1 50%, #67748e 60%, #e0e6f1 70%, #e0e6f1 100%);
    background: linear-gradient(to left, #e0e6f1 50%, #67748e 60%, #e0e6f1 70%, #e0e6f1 100%);
    background-size: 400% 100%;
    -webkit-animation: sk-gradient 5s ease infinite;
    animation: sk-gradient 5s ease infinite
}

@-webkit-keyframes sk-gradient {
    0% {
        background-position: 100% 50%
    }
    100% {
        background-position: 0 50%
    }
}

@keyframes sk-gradient {
    0% {
        background-position: 100% 50%
    }
    100% {
        background-position: 0 50%
    }
}

.graybox-skeleton-group02 [class^="skeleton-inner"] {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%
}

.graybox-skeleton-group02 .skeleton-inner .skeleton-item-01 {
    width: 10rem;
    height: 10rem;
    margin-top: 12.6rem;
    border-radius: 2.4rem
}

.graybox-skeleton-group02 .skeleton-inner .skeleton-item-01.space01 {
    margin-top: 18.3rem
}

.graybox-skeleton-group02 .skeleton-inner .skeleton-item-02 {
    width: 14rem;
    height: 2rem;
    margin-top: 1.6rem
}

.graybox-skeleton-group02 .skeleton-inner .skeleton-item-03 {
    width: 17rem;
    height: 3.1rem;
    margin-top: .8rem
}

.graybox-skeleton-group02 .skeleton-inner .skeleton-item-01+.skeleton-item-03 {
    margin-top: 1.6rem
}

.graybox-skeleton-group02 .skeleton-inner .ico-btn-arrow2 {
    display: block;
    margin: 25.2rem auto 0;
    background-color: var(--bg-qua)
}

.graybox-skeleton-group02 .skeleton-inner .ico-btn-arrow2.space01 {
    margin-top: 19.9rem
}

.graybox-skeleton-group02 .skeleton-inner .skeleton-item-03.ty01 {
    margin-top: 2.8rem;
    width: 15.4rem
}

.graybox-skeleton-group02 .skeleton-inner .skeleton-item-03-1 {
    margin-top: 2.8rem;
    width: 7.6rem;
    height: 2rem
}

.graybox-skeleton-group02 .skeleton-inner .skeleton-item-03-1+.skeleton-item-03.ty01 {
    margin-top: .6rem
}

.graybox-skeleton-group02 .skeleton-inner .skeleton-item-04 {
    width: 12rem;
    height: 3.1rem;
    margin-top: .4rem
}

.graybox-skeleton-group02 .skeleton-inner .skeleton-item-05 {
    width: 20rem;
    height: 2.1rem;
    margin-top: 1.6rem
}

.graybox-skeleton-group02 .skeleton-inner .skeleton-item-05-1 {
    width: 22.4rem;
    height: 2.1rem;
    margin-top: 1.6rem
}

.graybox-skeleton-group02 .skeleton-inner .skeleton-item-05-2 {
    width: 7rem;
    height: 2.1rem;
    margin-top: .8rem
}

.graybox-skeleton-group02 .skeleton-inner .skeleton-item-06 {
    width: 11rem;
    height: 1.6rem;
    margin: 3.2rem 0 0 calc(100% - 12.6rem)
}

.graybox-skeleton-group02 .skeleton-inner02 [class^="skeleton-item-"] {
    background-color: var(--color-g100, #f8f8f8)
}

.graybox-skeleton-group02 .skeleton-inner02 .skeleton-item-01 {
    width: 100%;
    height: 4.8rem;
    border-radius: 1.2rem
}

.graybox-skeleton-group02 .skeleton-inner02 .skeleton-item-02 {
    width: 21.6rem;
    height: 2.5rem;
    margin-top: 3.6rem
}

.graybox-skeleton-group02 .skeleton-inner02 .skeleton-item-03 {
    width: 23.9rem;
    height: 2.1rem;
    margin-top: .2rem
}

.graybox-skeleton-group02 .skeleton-inner02 .skeleton-item-04 {
    width: 11rem;
    height: 2.1rem;
    margin: 11.2rem 0 0 calc(75% - 5.6rem)
}

.graybox-skeleton-group02 .skeleton-inner02 .skeleton-item-05 {
    width: calc(100% - 3.2rem);
    height: 4.6rem;
    margin-top: 1.6rem;
    border-radius: 1.6rem
}

.graybox-skeleton-group02 .skeleton-inner02 .skeleton-item-06 {
    width: 11rem;
    height: 2.1rem;
    margin: 6rem 0 0 calc(75% - 5.6rem)
}

.graybox-skeleton-group02 .skeleton-inner02 .skeleton-item-07 {
    width: calc(100% - 3.2rem);
    height: 4.6rem;
    margin-top: 1.6rem;
    border-radius: 1.6rem
}

.graybox-skeleton-group02 .skeleton-inner02 .skeleton-item-08 {
    width: 11rem;
    height: 2.1rem;
    margin: 6rem 0 0 calc(75% - 5.6rem)
}

.graybox-skeleton-group02 .skeleton-inner02 .skeleton-item-09 {
    width: calc(100% - 3.2rem);
    height: 4.6rem;
    margin-top: 1.6rem;
    border-radius: 1.6rem
}

.graybox-skeleton-group02.v1 {
    height: calc(100% - 4.8rem);
    top: 4.8rem
}

.graybox-skeleton-group02.v1 .skeleton-inner02 .skeleton-item-05 {
    margin-top: 23.3rem
}

.graybox-skeleton-group02.v1 .skeleton-inner02 .skeleton-item-07 {
    margin-top: 9.7rem
}

.graybox-skeleton-group02.v1 .skeleton-inner02 .skeleton-item-09 {
    margin-top: 9.7rem
}

.graybox-skeleton-group02 .skeleton-inner03 .skeleton-item-01 {
    width: 10rem;
    height: 10rem;
    margin-top: 23.2rem;
    border-radius: 2.4rem
}

.graybox-skeleton-group02 .skeleton-inner03 .skeleton-item-02 {
    width: 14rem;
    height: 2rem;
    margin-top: 1.6rem
}

.graybox-skeleton-group02 .skeleton-inner03 .skeleton-item-03 {
    width: 17rem;
    height: 3.1rem;
    margin-top: .8rem
}

.graybox-skeleton-group02 .skeleton-inner03 .skeleton-item-01+.skeleton-item-03 {
    margin-top: 1.6rem
}

.graybox-skeleton-group02 .skeleton-inner03 .skeleton-item-04 {
    width: 12rem;
    height: 3.1rem;
    margin-top: .4rem
}

.graybox-skeleton-group02 .skeleton-inner03 .skeleton-item-05 {
    width: 20rem;
    height: 2.1rem;
    margin-top: 1.6rem
}

.graybox-skeleton-group02 .skeleton-inner03 .skeleton-item-06 {
    width: 9rem;
    height: 2.1rem;
    margin-top: .8rem
}

.graybox-skeleton-group02 .skeleton-inner03 .skeleton-item-07 {
    width: 11rem;
    height: 1.6rem;
    margin: 3.2rem 0 0 calc(100% - 12.5rem)
}

.graybox-skeleton-group02.ty01 .skeleton-inner .skeleton-item-01 {
    margin-top: 17.9rem
}

.graybox-skeleton-group02.ty01 .skeleton-inner .skeleton-inner02 {
    position: static;
    height: auto
}

.graybox-skeleton-group02.ty01 .skeleton-inner .skeleton-inner02 .skeleton-item-02 {
    margin-top: 4.7rem
}

.skeleton-transfer-group .skeleton-header {
    height: 6.0rem
}

.skeleton-transfer-group .skeleton-header .btn-control {
    position: Absolute;
    top: 0;
    right: -1.9rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 6rem;
    height: 5rem
}

.skeleton-realestate-group .skeleton-header .skeleton-btn-back {
    left: -1.9rem
}

.skeleton-realestate-group2 .skeleton-header .skeleton-btn-back {
    left: -1.9rem
}

.skeleton-pubsub-group {
    position: relative;
    width: 100%;
    height: 100%;
    padding: 0 1.9rem
}

.skeleton-pubsub-group .skeleton-pubsub-frm {
    margin-top: 1.3rem
}

.skeleton-pubsub-frm [class*="skeleton-block"] {
    background-color: var(--color-g100, #f8f8f8)
}

:root .skeleton-pubsub-frm [class*="skeleton-block"] {
    background-color: var(--color-g500)
}

.skeleton-pubsub-frm .skeleton-item01 .skeleton-block01 {
    width: 14.2rem;
    height: 2.8rem;
    border-radius: 0.4rem
}

.skeleton-pubsub-frm .skeleton-item01 .skeleton-block02 {
    margin-top: 2.1rem;
    height: 5.8rem;
    border-radius: 1.2rem
}

.skeleton-pubsub-frm .skeleton-item02 {
    margin-top: 5.8rem
}

.skeleton-pubsub-frm .skeleton-item02 [class*="skeleton-item020"],
.skeleton-pubsub-frm .skeleton-item03 [class*="skeleton-item030"] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.skeleton-pubsub-frm .skeleton-item02 .skeleton-item0201 {
    height: 2.4rem
}

.skeleton-pubsub-frm .skeleton-item02 .skeleton-item0201 .skeleton-block01 {
    width: 8.5rem;
    border-radius: 0.4rem
}

.skeleton-pubsub-frm .skeleton-item02 .skeleton-item0202 {
    margin-top: 2.5rem;
    height: 2rem
}

.skeleton-pubsub-frm .skeleton-item02 .skeleton-item0202 .skeleton-block01 {
    width: 30%;
    border-radius: 0.4rem
}

.skeleton-pubsub-frm .skeleton-item02 .skeleton-item0203,
.skeleton-pubsub-frm .skeleton-item02 .skeleton-item0204,
.skeleton-pubsub-frm .skeleton-item02 .skeleton-item0205 {
    margin-top: 1.4rem;
    height: 2rem
}

.skeleton-pubsub-frm .skeleton-item02 .skeleton-item0203 .skeleton-block01 {
    width: 25%;
    border-radius: 0.4rem
}

.skeleton-pubsub-frm .skeleton-item02 .skeleton-item0204 .skeleton-block01 {
    width: 40%;
    border-radius: 0.4rem
}

.skeleton-pubsub-frm .skeleton-item02 .skeleton-item0204 .skeleton-block02 {
    width: 15%;
    border-radius: 0.4rem
}

.skeleton-pubsub-frm .skeleton-item02 .skeleton-item0205 .skeleton-block01 {
    width: 15%;
    border-radius: 0.4rem
}

.skeleton-pubsub-frm .skeleton-item02 .skeleton-item0205 .skeleton-block02 {
    width: 40%;
    border-radius: 0.4rem
}

.skeleton-pubsub-frm .skeleton-item02 .skeleton-item0206 {
    margin-top: 3.2rem;
    height: 4.8rem
}

.skeleton-pubsub-frm .skeleton-item02 .skeleton-item0206 .skeleton-block01 {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    border-radius: 1.2rem
}

.skeleton-pubsub-frm .skeleton-item03 {
    margin-top: 4.8rem
}

.skeleton-pubsub-frm .skeleton-item03 .skeleton-item0301 {
    height: 2.4rem
}

.skeleton-pubsub-frm .skeleton-item03 .skeleton-item0301 .skeleton-block01 {
    width: 8.5rem;
    border-radius: 0.4rem
}

.skeleton-pubsub-frm .skeleton-item04 {
    margin-top: 2.8rem
}

.skeleton-pubsub-frm .skeleton-item04 [class*="skeleton-item040"] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 2.4rem;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.skeleton-pubsub-frm .skeleton-item04 [class*="skeleton-item040"] .skeleton-block01 {
    width: 2.4rem;
    height: 2.4rem;
    border-radius: 50%
}

.skeleton-pubsub-frm .skeleton-item04 [class*="skeleton-item040"] .skeleton-block02 {
    margin-left: 1.3rem;
    height: 2rem;
    border-radius: 0.4rem
}

.skeleton-pubsub-frm .skeleton-item04 .skeleton-item0401 .skeleton-block02 {
    width: 12.6rem
}

.skeleton-pubsub-frm .skeleton-item04 .skeleton-item0402,
.skeleton-pubsub-frm .skeleton-item04 .skeleton-item0403 {
    margin-top: 3rem
}

.skeleton-pubsub-frm .skeleton-item04 .skeleton-item0402 .skeleton-block02 {
    width: 18.7rem
}

.skeleton-pubsub-frm .skeleton-item04 .skeleton-item0403 .skeleton-block02 {
    width: 8.4rem
}

.skeleton-easyhome-group {
    position: relative;
    width: 100%;
    height: 100%;
    padding: 0 2rem
}

.skeleton-easyhome-group .skeleton-easyhome-frm {
    margin-top: 1.3rem
}

.skeleton-easyhome-frm [class*="skeleton-block"] {
    background-color: var(--color-g200, #eee)
}

:root .skeleton-easyhome-frm [class*="skeleton-block"] {
    background-color: var(--color-g500)
}

.skeleton-easyhome-frm .skeleton-item01 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 0.7rem 0;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.skeleton-easyhome-frm .skeleton-item01 .skeleton-block01:nth-child(1) {
    -webkit-box-flex: 0;
    -ms-flex: 0 8.1rem;
    flex: 0 8.1rem;
    height: 3.2rem;
    border-radius: 5.6rem
}

.skeleton-easyhome-frm .skeleton-item01 .skeleton-block01:nth-child(2) {
    display: none
}

.skeleton-easyhome-frm .skeleton-item02 {
    margin-top: 3.2rem
}

.skeleton-easyhome-frm .skeleton-item02 .skeleton-block01:nth-child(1) {
    width: 12.8rem;
    height: 2.7rem;
    border-radius: 0.4rem
}

.skeleton-easyhome-frm .skeleton-item02 .skeleton-block01:nth-child(2) {
    margin-top: 0.8rem;
    width: 18.3rem;
    height: 3.7rem;
    border-radius: 0.4rem
}

.skeleton-easyhome-frm .skeleton-item03 {
    margin-top: 3.2rem
}

.skeleton-easyhome-frm .skeleton-item03 .skeleton-block01 {
    height: 5.2rem;
    border-radius: 0.4rem
}

.skeleton-easyhome-frm .skeleton-item04 {
    margin-top: 2rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.skeleton-easyhome-frm .skeleton-item04 .skeleton-block01 {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    margin-left: 0.8rem;
    height: 19.2rem;
    background-color: var(--color-w100, #fff);
    border-radius: 1.2rem
}

.skeleton-easyhome-frm .skeleton-item04 .skeleton-block01:nth-child(1) {
    margin-left: 0
}

.skeleton-easyhome-frm .skeleton-item05 {
    margin-top: 8rem
}

.skeleton-easyhome-frm .skeleton-item05 .skeleton-block01 {
    width: 11rem;
    height: 2.7rem;
    border-radius: 0.4rem
}

.skeleton-easyhome-frm .skeleton-item06 {
    margin-top: 2rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.skeleton-easyhome-frm .skeleton-item06 .skeleton-block01 {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    margin-left: 0.8rem;
    height: 12.8rem;
    background-color: var(--color-w100, #fff);
    border-radius: 1.2rem
}

.skeleton-easyhome-frm .skeleton-item06 .skeleton-block01:nth-child(1) {
    margin-left: 0
}

.graybox-skeleton-group02.card-type1 .skeleton-inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end
}

.graybox-skeleton-group02.card-type1 .skeleton-inner .skeleton-item {
    margin: 0;
    width: 7.6rem;
    height: 2rem;
    border-radius: 0.4rem;
    background-color: var(--color-g200, #eee)
}

.graybox-skeleton-group02.card-type1 .skeleton-inner .skeleton-item+.skeleton-item {
    margin-top: 1.6rem
}

.sub7.skeleton-group {
    padding: 2.3rem 0
}

[class*="sub7-box"] .skeleton-field {
    background: var(--color-g100, #f8f8f8)
}

:root [class*="sub7-box"] .skeleton-field {
    background: var(--color-g500)
}

.sub7-box01 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.sub7-box01 .skeleton-col:first-child {
    width: 55%;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.sub7-box01 .skeleton-col:last-child {
    margin: 0;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 30%;
    flex: 1 1 30%;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.sub7-box01 .skeleton-col:last-child .skeleton-field {
    width: 10rem;
    height: 10rem;
    border-radius: 1.2rem
}

.sub7-box01 .skeleton-field {
    background: var(--color-g200, #eee)
}

.sub7-box02 .skeleton-field {
    width: 100%;
    height: 5.3rem;
    border-radius: 0.8rem
}

.sub7-box04 .skeleton-field {
    margin-right: 0.8rem;
    width: 9rem;
    height: 2.8rem;
    border-radius: 99rem
}

.sub7-box05 .skeleton-field {
    width: 15rem;
    height: 4.8rem;
    border-radius: 1.2rem
}

.sub7-box06 .skeleton-field {
    width: 60%;
    height: 2.8rem
}

.skeleton-pubsub-my-act {
    top: 4.8rem;
    left: 0;
    padding: 0;
    background-color: #fff;
    z-index: 999
}

.skeleton-pubsub-my-act .skeleton-item {
    margin: 0
}

.skeleton-pubsub-my-act .skeleton-item-group1 .skeleton-item {
    width: 7.4rem;
    height: 3.4rem;
    border-radius: 0.8rem;
    background: #8694b1
}

.skeleton-pubsub-my-act .skeleton-item-group2 {
    margin-top: 1.9rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.skeleton-pubsub-my-act .skeleton-item-group2 .skeleton-item {
    width: 5.3rem;
    height: 3.4rem;
    border-radius: 99rem;
    background: #8694b1
}

.skeleton-pubsub-my-act .skeleton-item-group2 .skeleton-item+.skeleton-item {
    margin-left: 0.8rem
}

.skeleton-pubsub-my-act .skeleton-item-group2 .skeleton-item:last-child {
    width: 7.7rem
}

.skeleton-pubsub-my-act .skeleton-item-group3:first-child {
    margin-top: 0
}

.skeleton-pubsub-my-act .skeleton-item-group3 {
    margin-top: 5.95rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.skeleton-pubsub-my-act .skeleton-item-group3 .skeleton-item {
    width: 8.5rem;
    height: 2.4rem;
    border-radius: 0.4rem;
    background: #8694b1
}

.skeleton-pubsub-my-act .skeleton-item-group3 .skeleton-item+.skeleton-item {
    width: 10.6rem;
    height: 2rem;
    border-radius: 0.4rem;
    background: #8694b1
}

.skeleton-pubsub-my-act .skeleton-item-group4 {
    margin-top: 1.4rem
}

.skeleton-pubsub-my-act .skeleton-item-group4 .skeleton-item {
    width: 100%;
    height: 9.5rem;
    border-radius: 1.6rem;
    background: #8694b1
}

.skeleton-pubsub-my-act .skeleton-item-group4 .skeleton-item+.skeleton-item {
    margin-top: 1.2rem
}

.skeleton-cardlist-group {
    position: relative;
    width: 100%;
    height: 100%;
    padding: 0 2rem
}

.skeleton-cardlist-group .skeleton-item-banner,
.skeleton-cardlist-group .skeleton-item-img,
.skeleton-cardlist-group [class^="skeleton-item-txt"] {
    background-color: var(--color-g500)
}

.skeleton-cardlist-group [class^="skeleton-item-txt"]+[class^="skeleton-item-txt"] {
    margin-top: 0.4rem
}

.skeleton-cardlist-group .skeleton-item-img {
    width: 2.4rem;
    height: 2.4rem;
    border-radius: 100%
}

.skeleton-cardlist-group .skeleton-item01-group {
    padding: 1.6rem 0 3.2rem
}

.skeleton-cardlist-group .skeleton-item01-group .skeleton-item-txt01 {
    width: 24%;
    height: 3.3rem;
    border-radius: 0.8rem
}

.skeleton-cardlist-group .skeleton-item01-group .skeleton-item-txt02 {
    width: 42%;
    height: 3.3rem;
    border-radius: 0.8rem
}

.skeleton-cardlist-group .skeleton-item02-group {
    margin-top: 1.6rem;
    padding: 1.6rem 0 3.2rem
}

.skeleton-cardlist-group .skeleton-item02-group .skeleton-txt01 {
    width: 100%
}

.skeleton-cardlist-group .skeleton-item02-group .skeleton-item-txt01 {
    width: 15.3%;
    height: 3.2rem;
    border-radius: 0.8rem
}

.skeleton-cardlist-group .skeleton-item02-group .skeleton-item-txt02 {
    width: 12.3%;
    height: 2rem;
    border-radius: 0.4rem
}

.skeleton-cardlist-group .skeleton-item02-group .skeleton-item-txt03 {
    width: 30%;
    height: 2.1rem;
    border-radius: 0.4rem
}

.skeleton-cardlist-group .skeleton-item02-group .skeleton-col {
    margin: 3.2rem 0;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 1.2rem
}

.skeleton-cardlist-group .skeleton-item02-group .skeleton-item-banner {
    height: 6.6rem;
    border-radius: 1.2rem
}

.skeleton-cardlist-group .skeleton-item03-group {
    padding: 4.8rem 0 3.2rem
}

.skeleton-cardlist-group .skeleton-item03-group .skeleton-item-header {
    margin-bottom: 3.2rem
}

.skeleton-cardlist-group .skeleton-item03-group .skeleton-item-header .skeleton-item-txt01 {
    width: 15%;
    height: 2rem;
    border-radius: 0.4rem
}

.skeleton-cardlist-group .skeleton-item03-group .skeleton-item-header .skeleton-item-txt02 {
    width: 34.1%;
    height: 3.3rem;
    border-radius: 0.4rem
}

.skeleton-cardlist-group .skeleton-item03-group .skeleton-col {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 1.2rem;
    padding: 2rem 0
}

.skeleton-cardlist-group .skeleton-item03-group .skeleton-col+.skeleton-col {
    margin-top: 0
}

.skeleton-cardlist-group .skeleton-item03-group .skeleton-item-list {
    margin-top: 2.4rem
}

.skeleton-cardlist-group .skeleton-item03-group .skeleton-txt01 {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1
}

.skeleton-cardlist-group .skeleton-item03-group .skeleton-txt02 {
    margin-left: auto
}

.skeleton-cardlist-group .skeleton-item03-group .skeleton-item-list .skeleton-item-txt01 {
    width: 15%;
    height: 2.1rem;
    border-radius: 0.4rem
}

.skeleton-cardlist-group .skeleton-item03-group .skeleton-item-list .skeleton-item-txt02 {
    width: 29.4%;
    height: 2.1rem;
    border-radius: 0.4rem
}

.skeleton-cardlist-group .skeleton-item03-group .skeleton-item-list .skeleton-item-txt03 {
    width: 16.2%;
    height: 2rem;
    border-radius: 0.4rem
}

.skeleton-cardlist-group .skeleton-item03-group .skeleton-item-list .skeleton-item-txt04 {
    width: 7.6rem;
    height: 2.1rem;
    border-radius: 0.4rem
}

.graybox-skeleton-group04 {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.graybox-skeleton-group04 [class^="skeleton-item-"] {
    background: -webkit-gradient(linear, right top, left top, color-stop(50%, #e0e6f1), color-stop(60%, #67748e), color-stop(70%, #e0e6f1), to(#e0e6f1));
    background: -o-linear-gradient(right, #e0e6f1 50%, #67748e 60%, #e0e6f1 70%, #e0e6f1 100%);
    background: linear-gradient(to left, #e0e6f1 50%, #67748e 60%, #e0e6f1 70%, #e0e6f1 100%);
    background-size: 400% 100%;
    -webkit-animation: sk-gradient 5s ease infinite;
    animation: sk-gradient 5s ease infinite
}

.graybox-skeleton-group04 [class^="skeleton-inner"] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.graybox-skeleton-group04 .skeleton-inner .skeleton-item-01 {
    width: 8.5rem;
    height: 2rem;
    border-radius: 1.6rem;
    padding: 0 1.6rem
}

.graybox-skeleton-group04 .skeleton-inner .skeleton-item-02 {
    margin-top: .7rem;
    width: 16.7rem;
    height: 2.8rem;
    border-radius: .8rem;
    padding: 0 1.6rem
}

.graybox-skeleton-group04 .skeleton-inner .skeleton-item-03 {
    margin-top: .7rem;
    width: 19.6rem;
    height: 2.8rem;
    border-radius: .8rem;
    padding: 0 1.6rem
}

.graybox-skeleton-group04 .skeleton-inner .skeleton-item-04 {
    margin-top: 1.7rem;
    margin-bottom: .4rem;
    width: 100%;
    height: 5.2rem;
    border-radius: 1.2rem;
    padding: 0 .8rem
}

.graybox-skeleton-group05 {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 5
}

.graybox-skeleton-group05 [class^="skeleton-item-"] {
    background: -webkit-gradient(linear, right top, left top, color-stop(50%, #e0e6f1), color-stop(60%, #67748e), color-stop(70%, #e0e6f1), to(#e0e6f1));
    background: -o-linear-gradient(right, #e0e6f1 50%, #67748e 60%, #e0e6f1 70%, #e0e6f1 100%);
    background: linear-gradient(to left, #e0e6f1 50%, #67748e 60%, #e0e6f1 70%, #e0e6f1 100%);
    background-size: 400% 100%;
    -webkit-animation: sk-gradient 5s ease infinite;
    animation: sk-gradient 5s ease infinite
}

.graybox-skeleton-group05 [class^="skeleton-inner"] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.graybox-skeleton-group05 .skeleton-inner .skeleton-group-01 .skeleton-item-01 {
    width: 11.6rem;
    height: 2.2rem;
    border-radius: 1.6rem
}

.graybox-skeleton-group05 .skeleton-inner .skeleton-group-01 .skeleton-item-02 {
    margin-top: .8rem;
    width: 20.3rem;
    height: 2.5rem;
    border-radius: .8rem
}

.graybox-skeleton-group05 .skeleton-inner .skeleton-group-02 {
    margin-top: 1.2rem;
    padding: 2rem;
    border-radius: 1.2rem;
    background-color: var(--bg-qua)
}

.graybox-skeleton-group05 .skeleton-inner .skeleton-group-02 .skeleton-group-02-inner {
    margin-top: 3.2rem
}

.graybox-skeleton-group05 .skeleton-inner .skeleton-group-02 .skeleton-group-02-inner .skeleton-item-01 {
    width: 100%;
    height: 4.4rem;
    border-radius: 99rem
}

.graybox-skeleton-group05 .skeleton-inner .skeleton-group-02 .skeleton-group-02-inner .skeleton-item-02 {
    margin: 1.6rem auto 0;
    width: 19.5rem;
    height: 1.6rem;
    border-radius: 1.6rem
}

.graybox-skeleton-group05 .skeleton-inner .skeleton-group-02 .skeleton-group-02-inner:first-child {
    margin-top: 0
}

.graybox-skeleton-group05 .skeleton-inner .skeleton-group-02 .skeleton-group-02-inner .skeleton-item-03 {
    margin: .5rem auto 0;
    width: 22.1rem;
    height: 2.1rem;
    border-radius: .8rem
}

.graybox-skeleton-group05 .skeleton-inner .skeleton-group-02 .skeleton-group-02-inner .skeleton-item-04 {
    margin-top: 3.2rem;
    width: 100%;
    height: 4.2rem;
    border-radius: 1.2rem
}

.graybox-skeleton-group05 .skeleton-inner .skeleton-group-03 .skeleton-item-01 {
    margin: .8rem 0 0 auto;
    width: 13.8rem;
    height: 2.2rem;
    border-radius: .8rem
}

.skeleton-group .sub-quick-wrap {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 2.4rem 2rem 0
}

.skeleton-group .sub-quick-wrap .skeleton-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    min-width: 7.4rem;
    margin: 0
}

.skeleton-group .sub-quick-wrap .skeleton-item .img-box {
    width: 4rem;
    height: 4rem
}

.skeleton-group .sub-quick-wrap .skeleton-item .txt-box {
    width: 6.4rem;
    height: 1.4rem;
    margin-top: 1rem
}

.skeleton-group .sub-quick-wrap~.divider-box {
    height: 0.1rem;
    margin-top: 3.2rem
}

.skeleton-custom-policy {
    position: absolute;
    padding: 0 1.9rem;
    top: 0;
    left: 0;
    width: 100%;
    min-height: 100vh;
    z-index: 999;
    background-color: var(--color-w100)
}

.skeleton-custom-policy .skeleton-item-group {
    padding-top: 7.3rem
}

.skeleton-custom-policy .skeleton-item-group [class^="skeleton-item-"] {
    border-radius: 0.8rem;
    background-color: var(--color-g500)
}

.skeleton-custom-policy .skeleton-item-01 {
    width: 11.1rem;
    height: 3.6rem
}

.skeleton-custom-policy .skeleton-item-02 {
    width: 100%;
    height: 12.8rem;
    margin-top: 2rem
}

.skeleton-custom-policy .skeleton-item-03 {
    width: 100%;
    height: 6.8rem;
    margin-top: 1.6rem
}

.skeleton-custom-policy .skeleton-item-04 {
    width: 8.8rem;
    height: 2rem;
    margin-top: 3.2rem
}

.skeleton-custom-policy .skeleton-item-05 {
    width: 2.4rem;
    height: 2.4rem;
    margin: 3.2rem auto 0
}

.skeleton-custom-policy .skeleton-item-06 {
    width: 23.9rem;
    height: 2rem;
    margin: 1.6rem auto 0
}

.skeleton-custom-policy .skeleton-item-07 {
    width: 19.6rem;
    height: 2rem
}

.skeleton-custom-policy .skeleton-item-08 {
    width: 8.5rem;
    height: 2rem
}

.skeleton-custom-policy .skeleton-item-09 {
    width: 9.6rem;
    height: 2rem;
    margin-top: 1.6rem;
    margin-left: auto
}

.skeleton-custom-policy .skeleton-item-10 {
    width: 8.8rem;
    height: 2rem
}

.skeleton-custom-policy .skeleton-list {
    margin-top: 3.2rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.skeleton-custom-policy .skeleton-list .skeleton-item-img {
    margin-right: 1.2rem;
    width: 5.1rem;
    height: 5.1rem;
    border-radius: 1.8rem
}

.skeleton-custom-policy .skeleton-list .skeleton-list-content {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.skeleton-custom-policy .skeleton-list .skeleton-item-content1 {
    width: 80%;
    height: 2rem
}

.skeleton-custom-policy .skeleton-list .skeleton-item-content2 {
    width: 40%;
    height: 2rem;
    margin-top: 0.4rem
}

.skeleton-custom-policy .skeleton-list .skeleton-item-content3 {
    width: 30%;
    height: 2rem;
    margin-top: 0.4rem;
    margin-left: 0.4rem
}

.skeleton-custom-policy .skeleton-list .skeleton-item-content4 {
    width: 60%;
    height: 2rem;
    margin-top: 0.4rem
}

.skeleton-custom-policy .skeleton-tab {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-top: 2.4rem
}

.skeleton-custom-policy .skeleton-tab .tab {
    width: 50%
}

.skeleton-custom-policy .skeleton-tab .skeleton-item-tit1 {
    margin: 0 auto;
    width: 6.7rem;
    height: 2rem
}

.skeleton-custom-policy .skeleton-tab .skeleton-item-tit2 {
    margin: 0 auto;
    width: 3.3rem;
    height: 2rem
}

.skeleton-custom-policy .skeleton-select-chip {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-top: 1.6rem;
    padding-top: 0.8rem;
    border-top: 1px solid var(--color-g500)
}

.skeleton-custom-policy .skeleton-select-chip [class^="skeleton-item-chip"]+[class^="skeleton-item-chip"] {
    margin-left: 0.5rem
}

.skeleton-custom-policy .skeleton-select-chip .skeleton-item-chip1 {
    width: calc(17% - 0.4rem);
    height: 3.6rem;
    border-radius: 9.9rem;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.skeleton-custom-policy .skeleton-select-chip .skeleton-item-chip2 {
    width: calc(32% - 0.4rem);
    height: 3.6rem;
    border-radius: 9.9rem;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.skeleton-custom-policy.type2 {
    min-height: auto
}

.skeleton-custom-policy.type2 .skeleton-item-group {
    padding-top: 0
}

.graybox-skeleton-group06 {
    position: absolute;
    top: 0;
    left: 3.2rem;
    width: 100%;
    height: 100%
}

.graybox-skeleton-group06 [class^="skeleton-item-"] {
    border-radius: 0.8rem;
    background: -webkit-gradient(linear, right top, left top, color-stop(50%, #e0e6f1), color-stop(60%, #67748e), color-stop(70%, #e0e6f1), to(#e0e6f1));
    background: -o-linear-gradient(right, #e0e6f1 50%, #67748e 60%, #e0e6f1 70%, #e0e6f1 100%);
    background: linear-gradient(to left, #e0e6f1 50%, #67748e 60%, #e0e6f1 70%, #e0e6f1 100%);
    background-size: 400% 100%;
    -webkit-animation: sk-gradient 5s ease infinite;
    animation: sk-gradient 5s ease infinite
}

.graybox-skeleton-group06 .skeleton-item-01 {
    height: 3.1rem;
    width: 16.7rem;
    margin-top: 20.3rem
}

.graybox-skeleton-group06 .skeleton-item-02 {
    height: 3.1rem;
    width: 26.5rem;
    margin-top: 1rem
}

.skeleton-ai-cardlist-group .skeleton-col {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 1.8rem 0
}

.skeleton-ai-cardlist-group .skeleton-col+.skeleton-col {
    margin-top: 0.4rem
}

.skeleton-ai-cardlist-group .skeleton-item-img {
    width: 2.8rem;
    height: 4.4rem;
    margin-right: 1.6rem;
    background-color: var(--color-g500);
    border-radius: 0.2rem
}

.skeleton-ai-cardlist-group .skeleton-item-txt {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.skeleton-ai-cardlist-group .skeleton-item-txt .skeleton-item-txt01,
.skeleton-ai-cardlist-group .skeleton-item-txt .skeleton-item-txt02 {
    border-radius: 0.4rem;
    background-color: var(--color-g500)
}

.skeleton-ai-cardlist-group .skeleton-item-txt .skeleton-item-txt01 {
    width: 79%;
    height: 2rem
}

.skeleton-ai-cardlist-group .skeleton-item-txt .skeleton-item-txt02 {
    width: 59%;
    height: 1.6rem;
    margin-top: 0.8rem
}

.skeleton-ai-cardlist-group .skeleton-item-btn {
    width: 7.5rem;
    height: 2.8rem;
    margin-left: auto;
    background-color: var(--color-g500);
    border-radius: 0.8rem
}

.skeleton-upbit-asset {
    position: absolute;
    top: 0;
    right: 2rem;
    left: 2rem;
    z-index: 10
}

.skeleton-upbit-asset .skeleton-item-group [class^="skeleton-item-"] {
    height: 2rem;
    border-radius: 0.4rem;
    background-color: var(--color-g500)
}

.skeleton-upbit-asset .skeleton-item00-group .skeleton-item-txt01 {
    width: 30%
}

.skeleton-upbit-asset .skeleton-item01-group {
    margin-top: 1.6rem;
    background-color: var(--color-w100)
}

.skeleton-upbit-asset .skeleton-item01-group .skeleton-item-txt01 {
    width: 56%;
    height: 2.4rem
}

.skeleton-upbit-asset .skeleton-item01-group .skeleton-item-txt02 {
    width: 50%;
    margin-top: 0.4rem
}

.skeleton-upbit-asset .skeleton-item02-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-top: 2rem;
    padding-top: 1.6rem;
    border-top: 1px solid var(--border-quin)
}

.skeleton-upbit-asset .skeleton-item02-group .skeleton-item-txt01 {
    width: 36%
}

.skeleton-consume-coupon {
    width: 100%
}

.skeleton-consume-coupon .skeleton-item-group {
    width: 100%;
    height: 13rem;
    background-color: var(--bg-qua)
}

.skeleton-consume-coupon .skeleton-item-group [class^="skeleton-item-"] {
    border-radius: 0.8rem;
    background-color: var(--color-g500)
}

.skeleton-consume-coupon .skeleton-item-1 {
    width: 45%;
    height: 2.1rem
}

.skeleton-consume-coupon .skeleton-item-2 {
    margin-top: 0.4rem;
    width: 60%;
    height: 2.5rem
}

.skeleton-consume-coupon .skeleton-item-3 {
    margin-top: 3.2rem;
    width: 100%;
    height: 4.8rem
}

.skeleton-animation-all.skeleton-consume-coupon:after {
    display: block;
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    content: '';
    background: -webkit-gradient(linear, left top, right top, from(rgba(247, 249, 253, 0.9)), color-stop(21.18%, rgba(247, 249, 253, 0.9)), color-stop(42.63%, rgba(247, 249, 253, 0.4)), color-stop(50%, rgba(247, 249, 253, 0)), color-stop(52.86%, rgba(247, 249, 253, 0.03)), color-stop(55.5%, rgba(247, 249, 253, 0.18)), color-stop(60.12%, rgba(247, 249, 253, 0.41)), color-stop(79.81%, rgba(247, 249, 253, 0.98)), to(rgba(247, 249, 253, 0.9)));
    background: -o-linear-gradient(left, rgba(247, 249, 253, 0.9) 0, rgba(247, 249, 253, 0.9) 21.18%, rgba(247, 249, 253, 0.4) 42.63%, rgba(247, 249, 253, 0) 50%, rgba(247, 249, 253, 0.03) 52.86%, rgba(247, 249, 253, 0.18) 55.5%, rgba(247, 249, 253, 0.41) 60.12%, rgba(247, 249, 253, 0.98) 79.81%, rgba(247, 249, 253, 0.9) 100%);
    background: linear-gradient(90deg, rgba(247, 249, 253, 0.9) 0, rgba(247, 249, 253, 0.9) 21.18%, rgba(247, 249, 253, 0.4) 42.63%, rgba(247, 249, 253, 0) 50%, rgba(247, 249, 253, 0.03) 52.86%, rgba(247, 249, 253, 0.18) 55.5%, rgba(247, 249, 253, 0.41) 60.12%, rgba(247, 249, 253, 0.98) 79.81%, rgba(247, 249, 253, 0.9) 100%);
    background-size: 500% 100%;
    -webkit-animation: skeleton-shine-ally ease-in-out 5s infinite;
    animation: skeleton-shine-ally ease-in-out 5s infinite;
    border-radius: 1.2rem
}

/*!
* variables
*/

/*! mixin 영역 */

@media only screen and (device-width: 320px) and (device-height: 693px) and (-webkit-device-pixel-ratio: 3) {
    /*! mixin : 스켈레톤 노치대응 */
    body.ios .component-skeleton {
        top: calc(4.4rem + 6rem)
    }
    body.ios .component-skeleton-sub {
        padding-top: 4.4rem
    }
    body.ios .skeleton-pubsub-my-act {
        padding-top: 3rem
    }
    body.ios .component-skeleton-sub.finding-prod {
        padding-top: 0
    }
    body.ios .main-tab-content01 .component-skeleton-sub,
    body.ios .main-tab-content02 .component-skeleton-sub,
    body.ios .main-tab-content03 .component-skeleton-sub,
    body.ios .main-tab-content05 .component-skeleton-sub {
        padding-top: 4.4rem
    }
    body.ios .skeleton-main-group {
        margin-top: -4.4rem;
        padding-top: 4.4rem
    }
    body.ios .component-skeleton-sub.shield {
        padding-top: 0
    }
    body.ios .component-skeleton-sub.shield .skeleton-main-group {
        margin-top: 0;
        padding-top: 4rem
    }
    /*! mixin : 스켈레톤 노치대응 */
    html.ios.statusExpension .component-skeleton {
        top: calc(4.4rem + 6rem)
    }
    html.ios.statusExpension .component-skeleton-sub {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .skeleton-pubsub-my-act {
        padding-top: 3rem
    }
    html.ios.statusExpension .component-skeleton-sub.finding-prod {
        padding-top: 0
    }
    html.ios.statusExpension .main-tab-content01 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content02 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content03 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content05 .component-skeleton-sub {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .skeleton-main-group {
        margin-top: -4.4rem;
        padding-top: 4.4rem
    }
    html.ios.statusExpension .component-skeleton-sub.shield {
        padding-top: 0
    }
    html.ios.statusExpension .component-skeleton-sub.shield .skeleton-main-group {
        margin-top: 0;
        padding-top: 4rem
    }
}

@media only screen and (device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 2) {
    /*! mixin : 스켈레톤 노치대응 */
    body.ios .component-skeleton {
        top: calc(4.4rem + 6rem)
    }
    body.ios .component-skeleton-sub {
        padding-top: 4.4rem
    }
    body.ios .skeleton-pubsub-my-act {
        padding-top: 3rem
    }
    body.ios .component-skeleton-sub.finding-prod {
        padding-top: 0
    }
    body.ios .main-tab-content01 .component-skeleton-sub,
    body.ios .main-tab-content02 .component-skeleton-sub,
    body.ios .main-tab-content03 .component-skeleton-sub,
    body.ios .main-tab-content05 .component-skeleton-sub {
        padding-top: 4.4rem
    }
    body.ios .skeleton-main-group {
        margin-top: -4.4rem;
        padding-top: 4.4rem
    }
    body.ios .component-skeleton-sub.shield {
        padding-top: 0
    }
    body.ios .component-skeleton-sub.shield .skeleton-main-group {
        margin-top: 0;
        padding-top: 4rem
    }
    /*! mixin : 스켈레톤 노치대응 */
    html.ios.statusExpension .component-skeleton {
        top: calc(4.4rem + 6rem)
    }
    html.ios.statusExpension .component-skeleton-sub {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .skeleton-pubsub-my-act {
        padding-top: 3rem
    }
    html.ios.statusExpension .component-skeleton-sub.finding-prod {
        padding-top: 0
    }
    html.ios.statusExpension .main-tab-content01 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content02 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content03 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content05 .component-skeleton-sub {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .skeleton-main-group {
        margin-top: -4.4rem;
        padding-top: 4.4rem
    }
    html.ios.statusExpension .component-skeleton-sub.shield {
        padding-top: 0
    }
    html.ios.statusExpension .component-skeleton-sub.shield .skeleton-main-group {
        margin-top: 0;
        padding-top: 4rem
    }
}

@media only screen and (device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 3) {
    /*! mixin : 스켈레톤 노치대응 */
    body.ios .component-skeleton {
        top: calc(4.4rem + 6rem)
    }
    body.ios .component-skeleton-sub {
        padding-top: 4.4rem
    }
    body.ios .skeleton-pubsub-my-act {
        padding-top: 3rem
    }
    body.ios .component-skeleton-sub.finding-prod {
        padding-top: 0
    }
    body.ios .main-tab-content01 .component-skeleton-sub,
    body.ios .main-tab-content02 .component-skeleton-sub,
    body.ios .main-tab-content03 .component-skeleton-sub,
    body.ios .main-tab-content05 .component-skeleton-sub {
        padding-top: 4.4rem
    }
    body.ios .skeleton-main-group {
        margin-top: -4.4rem;
        padding-top: 4.4rem
    }
    body.ios .component-skeleton-sub.shield {
        padding-top: 0
    }
    body.ios .component-skeleton-sub.shield .skeleton-main-group {
        margin-top: 0;
        padding-top: 4rem
    }
    /*! mixin : 스켈레톤 노치대응 */
    html.ios.statusExpension .component-skeleton {
        top: calc(4.4rem + 6rem)
    }
    html.ios.statusExpension .component-skeleton-sub {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .skeleton-pubsub-my-act {
        padding-top: 3rem
    }
    html.ios.statusExpension .component-skeleton-sub.finding-prod {
        padding-top: 0
    }
    html.ios.statusExpension .main-tab-content01 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content02 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content03 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content05 .component-skeleton-sub {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .skeleton-main-group {
        margin-top: -4.4rem;
        padding-top: 4.4rem
    }
    html.ios.statusExpension .component-skeleton-sub.shield {
        padding-top: 0
    }
    html.ios.statusExpension .component-skeleton-sub.shield .skeleton-main-group {
        margin-top: 0;
        padding-top: 4rem
    }
}

@media only screen and (device-width: 390px) and (device-height: 844px) and (-webkit-device-pixel-ratio: 3) {
    /*! mixin : 스켈레톤 노치대응 */
    body.ios .component-skeleton {
        top: calc(4.4rem + 6rem)
    }
    body.ios .component-skeleton-sub {
        padding-top: 4.4rem
    }
    body.ios .skeleton-pubsub-my-act {
        padding-top: 3rem
    }
    body.ios .component-skeleton-sub.finding-prod {
        padding-top: 0
    }
    body.ios .main-tab-content01 .component-skeleton-sub,
    body.ios .main-tab-content02 .component-skeleton-sub,
    body.ios .main-tab-content03 .component-skeleton-sub,
    body.ios .main-tab-content05 .component-skeleton-sub {
        padding-top: 4.4rem
    }
    body.ios .skeleton-main-group {
        margin-top: -4.4rem;
        padding-top: 4.4rem
    }
    body.ios .component-skeleton-sub.shield {
        padding-top: 0
    }
    body.ios .component-skeleton-sub.shield .skeleton-main-group {
        margin-top: 0;
        padding-top: 4rem
    }
    /*! mixin : 스켈레톤 노치대응 */
    html.ios.statusExpension .component-skeleton {
        top: calc(4.4rem + 6rem)
    }
    html.ios.statusExpension .component-skeleton-sub {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .skeleton-pubsub-my-act {
        padding-top: 3rem
    }
    html.ios.statusExpension .component-skeleton-sub.finding-prod {
        padding-top: 0
    }
    html.ios.statusExpension .main-tab-content01 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content02 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content03 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content05 .component-skeleton-sub {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .skeleton-main-group {
        margin-top: -4.4rem;
        padding-top: 4.4rem
    }
    html.ios.statusExpension .component-skeleton-sub.shield {
        padding-top: 0
    }
    html.ios.statusExpension .component-skeleton-sub.shield .skeleton-main-group {
        margin-top: 0;
        padding-top: 4rem
    }
}

@media only screen and (device-width: 393px) and (device-height: 852px) and (-webkit-device-pixel-ratio: 3) {
    /*! mixin : 스켈레톤 노치대응 */
    body.ios .component-skeleton {
        top: calc(4.4rem + 6rem)
    }
    body.ios .component-skeleton-sub {
        padding-top: 4.4rem
    }
    body.ios .skeleton-pubsub-my-act {
        padding-top: 3rem
    }
    body.ios .component-skeleton-sub.finding-prod {
        padding-top: 0
    }
    body.ios .main-tab-content01 .component-skeleton-sub,
    body.ios .main-tab-content02 .component-skeleton-sub,
    body.ios .main-tab-content03 .component-skeleton-sub,
    body.ios .main-tab-content05 .component-skeleton-sub {
        padding-top: 4.4rem
    }
    body.ios .skeleton-main-group {
        margin-top: -4.4rem;
        padding-top: 4.4rem
    }
    body.ios .component-skeleton-sub.shield {
        padding-top: 0
    }
    body.ios .component-skeleton-sub.shield .skeleton-main-group {
        margin-top: 0;
        padding-top: 4rem
    }
    /*! mixin : 스켈레톤 노치대응 */
    html.ios.statusExpension .component-skeleton {
        top: calc(4.4rem + 6rem)
    }
    html.ios.statusExpension .component-skeleton-sub {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .skeleton-pubsub-my-act {
        padding-top: 3rem
    }
    html.ios.statusExpension .component-skeleton-sub.finding-prod {
        padding-top: 0
    }
    html.ios.statusExpension .main-tab-content01 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content02 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content03 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content05 .component-skeleton-sub {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .skeleton-main-group {
        margin-top: -4.4rem;
        padding-top: 4.4rem
    }
    html.ios.statusExpension .component-skeleton-sub.shield {
        padding-top: 0
    }
    html.ios.statusExpension .component-skeleton-sub.shield .skeleton-main-group {
        margin-top: 0;
        padding-top: 4rem
    }
}

@media only screen and (device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 2) {
    /*! mixin : 스켈레톤 노치대응 */
    body.ios .component-skeleton {
        top: calc(4.4rem + 6rem)
    }
    body.ios .component-skeleton-sub {
        padding-top: 4.4rem
    }
    body.ios .skeleton-pubsub-my-act {
        padding-top: 3rem
    }
    body.ios .component-skeleton-sub.finding-prod {
        padding-top: 0
    }
    body.ios .main-tab-content01 .component-skeleton-sub,
    body.ios .main-tab-content02 .component-skeleton-sub,
    body.ios .main-tab-content03 .component-skeleton-sub,
    body.ios .main-tab-content05 .component-skeleton-sub {
        padding-top: 4.4rem
    }
    body.ios .skeleton-main-group {
        margin-top: -4.4rem;
        padding-top: 4.4rem
    }
    body.ios .component-skeleton-sub.shield {
        padding-top: 0
    }
    body.ios .component-skeleton-sub.shield .skeleton-main-group {
        margin-top: 0;
        padding-top: 4rem
    }
    /*! mixin : 스켈레톤 노치대응 */
    html.ios.statusExpension .component-skeleton {
        top: calc(4.4rem + 6rem)
    }
    html.ios.statusExpension .component-skeleton-sub {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .skeleton-pubsub-my-act {
        padding-top: 3rem
    }
    html.ios.statusExpension .component-skeleton-sub.finding-prod {
        padding-top: 0
    }
    html.ios.statusExpension .main-tab-content01 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content02 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content03 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content05 .component-skeleton-sub {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .skeleton-main-group {
        margin-top: -4.4rem;
        padding-top: 4.4rem
    }
    html.ios.statusExpension .component-skeleton-sub.shield {
        padding-top: 0
    }
    html.ios.statusExpension .component-skeleton-sub.shield .skeleton-main-group {
        margin-top: 0;
        padding-top: 4rem
    }
}

@media only screen and (device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 3) {
    /*! mixin : 스켈레톤 노치대응 */
    body.ios .component-skeleton {
        top: calc(4.4rem + 6rem)
    }
    body.ios .component-skeleton-sub {
        padding-top: 4.4rem
    }
    body.ios .skeleton-pubsub-my-act {
        padding-top: 3rem
    }
    body.ios .component-skeleton-sub.finding-prod {
        padding-top: 0
    }
    body.ios .main-tab-content01 .component-skeleton-sub,
    body.ios .main-tab-content02 .component-skeleton-sub,
    body.ios .main-tab-content03 .component-skeleton-sub,
    body.ios .main-tab-content05 .component-skeleton-sub {
        padding-top: 4.4rem
    }
    body.ios .skeleton-main-group {
        margin-top: -4.4rem;
        padding-top: 4.4rem
    }
    body.ios .component-skeleton-sub.shield {
        padding-top: 0
    }
    body.ios .component-skeleton-sub.shield .skeleton-main-group {
        margin-top: 0;
        padding-top: 4rem
    }
    /*! mixin : 스켈레톤 노치대응 */
    html.ios.statusExpension .component-skeleton {
        top: calc(4.4rem + 6rem)
    }
    html.ios.statusExpension .component-skeleton-sub {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .skeleton-pubsub-my-act {
        padding-top: 3rem
    }
    html.ios.statusExpension .component-skeleton-sub.finding-prod {
        padding-top: 0
    }
    html.ios.statusExpension .main-tab-content01 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content02 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content03 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content05 .component-skeleton-sub {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .skeleton-main-group {
        margin-top: -4.4rem;
        padding-top: 4.4rem
    }
    html.ios.statusExpension .component-skeleton-sub.shield {
        padding-top: 0
    }
    html.ios.statusExpension .component-skeleton-sub.shield .skeleton-main-group {
        margin-top: 0;
        padding-top: 4rem
    }
}

@media only screen and (device-width: 428px) and (device-height: 926px) and (-webkit-device-pixel-ratio: 3) {
    /*! mixin : 스켈레톤 노치대응 */
    body.ios .component-skeleton {
        top: calc(4.4rem + 6rem)
    }
    body.ios .component-skeleton-sub {
        padding-top: 4.4rem
    }
    body.ios .skeleton-pubsub-my-act {
        padding-top: 3rem
    }
    body.ios .component-skeleton-sub.finding-prod {
        padding-top: 0
    }
    body.ios .main-tab-content01 .component-skeleton-sub,
    body.ios .main-tab-content02 .component-skeleton-sub,
    body.ios .main-tab-content03 .component-skeleton-sub,
    body.ios .main-tab-content05 .component-skeleton-sub {
        padding-top: 4.4rem
    }
    body.ios .skeleton-main-group {
        margin-top: -4.4rem;
        padding-top: 4.4rem
    }
    body.ios .component-skeleton-sub.shield {
        padding-top: 0
    }
    body.ios .component-skeleton-sub.shield .skeleton-main-group {
        margin-top: 0;
        padding-top: 4rem
    }
    /*! mixin : 스켈레톤 노치대응 */
    html.ios.statusExpension .component-skeleton {
        top: calc(4.4rem + 6rem)
    }
    html.ios.statusExpension .component-skeleton-sub {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .skeleton-pubsub-my-act {
        padding-top: 3rem
    }
    html.ios.statusExpension .component-skeleton-sub.finding-prod {
        padding-top: 0
    }
    html.ios.statusExpension .main-tab-content01 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content02 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content03 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content05 .component-skeleton-sub {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .skeleton-main-group {
        margin-top: -4.4rem;
        padding-top: 4.4rem
    }
    html.ios.statusExpension .component-skeleton-sub.shield {
        padding-top: 0
    }
    html.ios.statusExpension .component-skeleton-sub.shield .skeleton-main-group {
        margin-top: 0;
        padding-top: 4rem
    }
}

@media only screen and (device-width: 426px) and (device-height: 926px) and (-webkit-device-pixel-ratio: 3) {
    /*! mixin : 스켈레톤 노치대응 */
    body.ios .component-skeleton {
        top: calc(4.4rem + 6rem)
    }
    body.ios .component-skeleton-sub {
        padding-top: 4.4rem
    }
    body.ios .skeleton-pubsub-my-act {
        padding-top: 3rem
    }
    body.ios .component-skeleton-sub.finding-prod {
        padding-top: 0
    }
    body.ios .main-tab-content01 .component-skeleton-sub,
    body.ios .main-tab-content02 .component-skeleton-sub,
    body.ios .main-tab-content03 .component-skeleton-sub,
    body.ios .main-tab-content05 .component-skeleton-sub {
        padding-top: 4.4rem
    }
    body.ios .skeleton-main-group {
        margin-top: -4.4rem;
        padding-top: 4.4rem
    }
    body.ios .component-skeleton-sub.shield {
        padding-top: 0
    }
    body.ios .component-skeleton-sub.shield .skeleton-main-group {
        margin-top: 0;
        padding-top: 4rem
    }
    /*! mixin : 스켈레톤 노치대응 */
    html.ios.statusExpension .component-skeleton {
        top: calc(4.4rem + 6rem)
    }
    html.ios.statusExpension .component-skeleton-sub {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .skeleton-pubsub-my-act {
        padding-top: 3rem
    }
    html.ios.statusExpension .component-skeleton-sub.finding-prod {
        padding-top: 0
    }
    html.ios.statusExpension .main-tab-content01 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content02 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content03 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content05 .component-skeleton-sub {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .skeleton-main-group {
        margin-top: -4.4rem;
        padding-top: 4.4rem
    }
    html.ios.statusExpension .component-skeleton-sub.shield {
        padding-top: 0
    }
    html.ios.statusExpension .component-skeleton-sub.shield .skeleton-main-group {
        margin-top: 0;
        padding-top: 4rem
    }
}

@media only screen and (device-width: 430px) and (device-height: 932px) and (-webkit-device-pixel-ratio: 3) {
    /*! mixin : 스켈레톤 노치대응 */
    body.ios .component-skeleton {
        top: calc(4.4rem + 6rem)
    }
    body.ios .component-skeleton-sub {
        padding-top: 4.4rem
    }
    body.ios .skeleton-pubsub-my-act {
        padding-top: 3rem
    }
    body.ios .component-skeleton-sub.finding-prod {
        padding-top: 0
    }
    body.ios .main-tab-content01 .component-skeleton-sub,
    body.ios .main-tab-content02 .component-skeleton-sub,
    body.ios .main-tab-content03 .component-skeleton-sub,
    body.ios .main-tab-content05 .component-skeleton-sub {
        padding-top: 4.4rem
    }
    body.ios .skeleton-main-group {
        margin-top: -4.4rem;
        padding-top: 4.4rem
    }
    body.ios .component-skeleton-sub.shield {
        padding-top: 0
    }
    body.ios .component-skeleton-sub.shield .skeleton-main-group {
        margin-top: 0;
        padding-top: 4rem
    }
    /*! mixin : 스켈레톤 노치대응 */
    html.ios.statusExpension .component-skeleton {
        top: calc(4.4rem + 6rem)
    }
    html.ios.statusExpension .component-skeleton-sub {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .skeleton-pubsub-my-act {
        padding-top: 3rem
    }
    html.ios.statusExpension .component-skeleton-sub.finding-prod {
        padding-top: 0
    }
    html.ios.statusExpension .main-tab-content01 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content02 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content03 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content05 .component-skeleton-sub {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .skeleton-main-group {
        margin-top: -4.4rem;
        padding-top: 4.4rem
    }
    html.ios.statusExpension .component-skeleton-sub.shield {
        padding-top: 0
    }
    html.ios.statusExpension .component-skeleton-sub.shield .skeleton-main-group {
        margin-top: 0;
        padding-top: 4rem
    }
}

@media only screen and (device-width: 393px) and (device-height: 852px) and (-webkit-device-pixel-ratio: 3) {
    /*! mixin : 스켈레톤 노치대응 */
    body.ios .component-skeleton {
        top: calc(4.4rem + 6rem)
    }
    body.ios .component-skeleton-sub {
        padding-top: 4.4rem
    }
    body.ios .skeleton-pubsub-my-act {
        padding-top: 3rem
    }
    body.ios .component-skeleton-sub.finding-prod {
        padding-top: 0
    }
    body.ios .main-tab-content01 .component-skeleton-sub,
    body.ios .main-tab-content02 .component-skeleton-sub,
    body.ios .main-tab-content03 .component-skeleton-sub,
    body.ios .main-tab-content05 .component-skeleton-sub {
        padding-top: 4.4rem
    }
    body.ios .skeleton-main-group {
        margin-top: -4.4rem;
        padding-top: 4.4rem
    }
    body.ios .component-skeleton-sub.shield {
        padding-top: 0
    }
    body.ios .component-skeleton-sub.shield .skeleton-main-group {
        margin-top: 0;
        padding-top: 4rem
    }
    /*! mixin : 스켈레톤 노치대응 */
    html.ios.statusExpension .component-skeleton {
        top: calc(4.4rem + 6rem)
    }
    html.ios.statusExpension .component-skeleton-sub {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .skeleton-pubsub-my-act {
        padding-top: 3rem
    }
    html.ios.statusExpension .component-skeleton-sub.finding-prod {
        padding-top: 0
    }
    html.ios.statusExpension .main-tab-content01 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content02 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content03 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content05 .component-skeleton-sub {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .skeleton-main-group {
        margin-top: -4.4rem;
        padding-top: 4.4rem
    }
    html.ios.statusExpension .component-skeleton-sub.shield {
        padding-top: 0
    }
    html.ios.statusExpension .component-skeleton-sub.shield .skeleton-main-group {
        margin-top: 0;
        padding-top: 4rem
    }
}

@media only screen and (device-width: 402px) and (device-height: 874px) and (-webkit-device-pixel-ratio: 3) {
    /*! mixin : 스켈레톤 노치대응 */
    body.ios .component-skeleton {
        top: calc(4.4rem + 6rem)
    }
    body.ios .component-skeleton-sub {
        padding-top: 4.4rem
    }
    body.ios .skeleton-pubsub-my-act {
        padding-top: 3rem
    }
    body.ios .component-skeleton-sub.finding-prod {
        padding-top: 0
    }
    body.ios .main-tab-content01 .component-skeleton-sub,
    body.ios .main-tab-content02 .component-skeleton-sub,
    body.ios .main-tab-content03 .component-skeleton-sub,
    body.ios .main-tab-content05 .component-skeleton-sub {
        padding-top: 4.4rem
    }
    body.ios .skeleton-main-group {
        margin-top: -4.4rem;
        padding-top: 4.4rem
    }
    body.ios .component-skeleton-sub.shield {
        padding-top: 0
    }
    body.ios .component-skeleton-sub.shield .skeleton-main-group {
        margin-top: 0;
        padding-top: 4rem
    }
    /*! mixin : 스켈레톤 노치대응 */
    html.ios.statusExpension .component-skeleton {
        top: calc(4.4rem + 6rem)
    }
    html.ios.statusExpension .component-skeleton-sub {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .skeleton-pubsub-my-act {
        padding-top: 3rem
    }
    html.ios.statusExpension .component-skeleton-sub.finding-prod {
        padding-top: 0
    }
    html.ios.statusExpension .main-tab-content01 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content02 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content03 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content05 .component-skeleton-sub {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .skeleton-main-group {
        margin-top: -4.4rem;
        padding-top: 4.4rem
    }
    html.ios.statusExpension .component-skeleton-sub.shield {
        padding-top: 0
    }
    html.ios.statusExpension .component-skeleton-sub.shield .skeleton-main-group {
        margin-top: 0;
        padding-top: 4rem
    }
}

@media only screen and (device-width: 440px) and (device-height: 956px) and (-webkit-device-pixel-ratio: 3) {
    /*! mixin : 스켈레톤 노치대응 */
    body.ios .component-skeleton {
        top: calc(4.4rem + 6rem)
    }
    body.ios .component-skeleton-sub {
        padding-top: 4.4rem
    }
    body.ios .skeleton-pubsub-my-act {
        padding-top: 3rem
    }
    body.ios .component-skeleton-sub.finding-prod {
        padding-top: 0
    }
    body.ios .main-tab-content01 .component-skeleton-sub,
    body.ios .main-tab-content02 .component-skeleton-sub,
    body.ios .main-tab-content03 .component-skeleton-sub,
    body.ios .main-tab-content05 .component-skeleton-sub {
        padding-top: 4.4rem
    }
    body.ios .skeleton-main-group {
        margin-top: -4.4rem;
        padding-top: 4.4rem
    }
    body.ios .component-skeleton-sub.shield {
        padding-top: 0
    }
    body.ios .component-skeleton-sub.shield .skeleton-main-group {
        margin-top: 0;
        padding-top: 4rem
    }
    /*! mixin : 스켈레톤 노치대응 */
    html.ios.statusExpension .component-skeleton {
        top: calc(4.4rem + 6rem)
    }
    html.ios.statusExpension .component-skeleton-sub {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .skeleton-pubsub-my-act {
        padding-top: 3rem
    }
    html.ios.statusExpension .component-skeleton-sub.finding-prod {
        padding-top: 0
    }
    html.ios.statusExpension .main-tab-content01 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content02 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content03 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content05 .component-skeleton-sub {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .skeleton-main-group {
        margin-top: -4.4rem;
        padding-top: 4.4rem
    }
    html.ios.statusExpension .component-skeleton-sub.shield {
        padding-top: 0
    }
    html.ios.statusExpension .component-skeleton-sub.shield .skeleton-main-group {
        margin-top: 0;
        padding-top: 4rem
    }
}

@media only screen and (device-width: 414px) and (device-height: 736px) and (-webkit-device-pixel-ratio: 3) {
    /*! mixin : 스켈레톤 노치대응 */
    body.ios.nonotch .component-skeleton {
        top: calc(2rem + 6rem)
    }
    body.ios.nonotch .component-skeleton-sub {
        padding-top: 2rem
    }
    body.ios.nonotch .skeleton-pubsub-my-act {
        padding-top: 3rem
    }
    body.ios.nonotch .component-skeleton-sub.finding-prod {
        padding-top: 0
    }
    body.ios.nonotch .main-tab-content01 .component-skeleton-sub,
    body.ios.nonotch .main-tab-content02 .component-skeleton-sub,
    body.ios.nonotch .main-tab-content03 .component-skeleton-sub,
    body.ios.nonotch .main-tab-content05 .component-skeleton-sub {
        padding-top: 4.4rem
    }
    body.ios.nonotch .skeleton-main-group {
        margin-top: -4.4rem;
        padding-top: 2rem
    }
    body.ios.nonotch .component-skeleton-sub.shield {
        padding-top: 0
    }
    body.ios.nonotch .component-skeleton-sub.shield .skeleton-main-group {
        margin-top: 0;
        padding-top: 4rem
    }
    /*! mixin : 스켈레톤 노치대응 */
    html.ios.statusExpension .component-skeleton {
        top: calc(2rem + 6rem)
    }
    html.ios.statusExpension .component-skeleton-sub {
        padding-top: 2rem
    }
    html.ios.statusExpension .skeleton-pubsub-my-act {
        padding-top: 3rem
    }
    html.ios.statusExpension .component-skeleton-sub.finding-prod {
        padding-top: 0
    }
    html.ios.statusExpension .main-tab-content01 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content02 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content03 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content05 .component-skeleton-sub {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .skeleton-main-group {
        margin-top: -4.4rem;
        padding-top: 2rem
    }
    html.ios.statusExpension .component-skeleton-sub.shield {
        padding-top: 0
    }
    html.ios.statusExpension .component-skeleton-sub.shield .skeleton-main-group {
        margin-top: 0;
        padding-top: 4rem
    }
}

@media only screen and (device-width: 375px) and (device-height: 667px) and (-webkit-device-pixel-ratio: 3) {
    /*! mixin : 스켈레톤 노치대응 */
    body.ios.nonotch .component-skeleton {
        top: calc(2rem + 6rem)
    }
    body.ios.nonotch .component-skeleton-sub {
        padding-top: 2rem
    }
    body.ios.nonotch .skeleton-pubsub-my-act {
        padding-top: 3rem
    }
    body.ios.nonotch .component-skeleton-sub.finding-prod {
        padding-top: 0
    }
    body.ios.nonotch .main-tab-content01 .component-skeleton-sub,
    body.ios.nonotch .main-tab-content02 .component-skeleton-sub,
    body.ios.nonotch .main-tab-content03 .component-skeleton-sub,
    body.ios.nonotch .main-tab-content05 .component-skeleton-sub {
        padding-top: 4.4rem
    }
    body.ios.nonotch .skeleton-main-group {
        margin-top: -4.4rem;
        padding-top: 2rem
    }
    body.ios.nonotch .component-skeleton-sub.shield {
        padding-top: 0
    }
    body.ios.nonotch .component-skeleton-sub.shield .skeleton-main-group {
        margin-top: 0;
        padding-top: 4rem
    }
    /*! mixin : 스켈레톤 노치대응 */
    html.ios.statusExpension .component-skeleton {
        top: calc(2rem + 6rem)
    }
    html.ios.statusExpension .component-skeleton-sub {
        padding-top: 2rem
    }
    html.ios.statusExpension .skeleton-pubsub-my-act {
        padding-top: 3rem
    }
    html.ios.statusExpension .component-skeleton-sub.finding-prod {
        padding-top: 0
    }
    html.ios.statusExpension .main-tab-content01 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content02 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content03 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content05 .component-skeleton-sub {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .skeleton-main-group {
        margin-top: -4.4rem;
        padding-top: 2rem
    }
    html.ios.statusExpension .component-skeleton-sub.shield {
        padding-top: 0
    }
    html.ios.statusExpension .component-skeleton-sub.shield .skeleton-main-group {
        margin-top: 0;
        padding-top: 4rem
    }
}

@media only screen and (device-width: 375px) and (device-height: 667px) and (-webkit-device-pixel-ratio: 2) {
    /*! mixin : 스켈레톤 노치대응 */
    body.ios.nonotch .component-skeleton {
        top: calc(2rem + 6rem)
    }
    body.ios.nonotch .component-skeleton-sub {
        padding-top: 2rem
    }
    body.ios.nonotch .skeleton-pubsub-my-act {
        padding-top: 3rem
    }
    body.ios.nonotch .component-skeleton-sub.finding-prod {
        padding-top: 0
    }
    body.ios.nonotch .main-tab-content01 .component-skeleton-sub,
    body.ios.nonotch .main-tab-content02 .component-skeleton-sub,
    body.ios.nonotch .main-tab-content03 .component-skeleton-sub,
    body.ios.nonotch .main-tab-content05 .component-skeleton-sub {
        padding-top: 4.4rem
    }
    body.ios.nonotch .skeleton-main-group {
        margin-top: -4.4rem;
        padding-top: 2rem
    }
    body.ios.nonotch .component-skeleton-sub.shield {
        padding-top: 0
    }
    body.ios.nonotch .component-skeleton-sub.shield .skeleton-main-group {
        margin-top: 0;
        padding-top: 4rem
    }
    /*! mixin : 스켈레톤 노치대응 */
    html.ios.statusExpension .component-skeleton {
        top: calc(2rem + 6rem)
    }
    html.ios.statusExpension .component-skeleton-sub {
        padding-top: 2rem
    }
    html.ios.statusExpension .skeleton-pubsub-my-act {
        padding-top: 3rem
    }
    html.ios.statusExpension .component-skeleton-sub.finding-prod {
        padding-top: 0
    }
    html.ios.statusExpension .main-tab-content01 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content02 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content03 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content05 .component-skeleton-sub {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .skeleton-main-group {
        margin-top: -4.4rem;
        padding-top: 2rem
    }
    html.ios.statusExpension .component-skeleton-sub.shield {
        padding-top: 0
    }
    html.ios.statusExpension .component-skeleton-sub.shield .skeleton-main-group {
        margin-top: 0;
        padding-top: 4rem
    }
}

@media only screen and (device-width: 320px) and (device-height: 568px) and (-webkit-device-pixel-ratio: 2) {
    /*! mixin : 스켈레톤 노치대응 */
    body.ios.nonotch .component-skeleton {
        top: calc(2rem + 6rem)
    }
    body.ios.nonotch .component-skeleton-sub {
        padding-top: 2rem
    }
    body.ios.nonotch .skeleton-pubsub-my-act {
        padding-top: 3rem
    }
    body.ios.nonotch .component-skeleton-sub.finding-prod {
        padding-top: 0
    }
    body.ios.nonotch .main-tab-content01 .component-skeleton-sub,
    body.ios.nonotch .main-tab-content02 .component-skeleton-sub,
    body.ios.nonotch .main-tab-content03 .component-skeleton-sub,
    body.ios.nonotch .main-tab-content05 .component-skeleton-sub {
        padding-top: 4.4rem
    }
    body.ios.nonotch .skeleton-main-group {
        margin-top: -4.4rem;
        padding-top: 2rem
    }
    body.ios.nonotch .component-skeleton-sub.shield {
        padding-top: 0
    }
    body.ios.nonotch .component-skeleton-sub.shield .skeleton-main-group {
        margin-top: 0;
        padding-top: 4rem
    }
    /*! mixin : 스켈레톤 노치대응 */
    html.ios.statusExpension .component-skeleton {
        top: calc(2rem + 6rem)
    }
    html.ios.statusExpension .component-skeleton-sub {
        padding-top: 2rem
    }
    html.ios.statusExpension .skeleton-pubsub-my-act {
        padding-top: 3rem
    }
    html.ios.statusExpension .component-skeleton-sub.finding-prod {
        padding-top: 0
    }
    html.ios.statusExpension .main-tab-content01 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content02 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content03 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content05 .component-skeleton-sub {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .skeleton-main-group {
        margin-top: -4.4rem;
        padding-top: 2rem
    }
    html.ios.statusExpension .component-skeleton-sub.shield {
        padding-top: 0
    }
    html.ios.statusExpension .component-skeleton-sub.shield .skeleton-main-group {
        margin-top: 0;
        padding-top: 4rem
    }
}

@media only screen and (device-width: 320px) and (device-height: 480px) and (-webkit-device-pixel-ratio: 2) {
    /*! mixin : 스켈레톤 노치대응 */
    body.ios.nonotch .component-skeleton {
        top: calc(2rem + 6rem)
    }
    body.ios.nonotch .component-skeleton-sub {
        padding-top: 2rem
    }
    body.ios.nonotch .skeleton-pubsub-my-act {
        padding-top: 3rem
    }
    body.ios.nonotch .component-skeleton-sub.finding-prod {
        padding-top: 0
    }
    body.ios.nonotch .main-tab-content01 .component-skeleton-sub,
    body.ios.nonotch .main-tab-content02 .component-skeleton-sub,
    body.ios.nonotch .main-tab-content03 .component-skeleton-sub,
    body.ios.nonotch .main-tab-content05 .component-skeleton-sub {
        padding-top: 4.4rem
    }
    body.ios.nonotch .skeleton-main-group {
        margin-top: -4.4rem;
        padding-top: 2rem
    }
    body.ios.nonotch .component-skeleton-sub.shield {
        padding-top: 0
    }
    body.ios.nonotch .component-skeleton-sub.shield .skeleton-main-group {
        margin-top: 0;
        padding-top: 4rem
    }
    /*! mixin : 스켈레톤 노치대응 */
    html.ios.statusExpension .component-skeleton {
        top: calc(2rem + 6rem)
    }
    html.ios.statusExpension .component-skeleton-sub {
        padding-top: 2rem
    }
    html.ios.statusExpension .skeleton-pubsub-my-act {
        padding-top: 3rem
    }
    html.ios.statusExpension .component-skeleton-sub.finding-prod {
        padding-top: 0
    }
    html.ios.statusExpension .main-tab-content01 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content02 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content03 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content05 .component-skeleton-sub {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .skeleton-main-group {
        margin-top: -4.4rem;
        padding-top: 2rem
    }
    html.ios.statusExpension .component-skeleton-sub.shield {
        padding-top: 0
    }
    html.ios.statusExpension .component-skeleton-sub.shield .skeleton-main-group {
        margin-top: 0;
        padding-top: 4rem
    }
}

@media only screen and (device-width: 320px) and (device-height: 480px) and (-webkit-device-pixel-ratio: 1) {
    /*! mixin : 스켈레톤 노치대응 */
    body.ios.nonotch .component-skeleton {
        top: calc(2rem + 6rem)
    }
    body.ios.nonotch .component-skeleton-sub {
        padding-top: 2rem
    }
    body.ios.nonotch .skeleton-pubsub-my-act {
        padding-top: 3rem
    }
    body.ios.nonotch .component-skeleton-sub.finding-prod {
        padding-top: 0
    }
    body.ios.nonotch .main-tab-content01 .component-skeleton-sub,
    body.ios.nonotch .main-tab-content02 .component-skeleton-sub,
    body.ios.nonotch .main-tab-content03 .component-skeleton-sub,
    body.ios.nonotch .main-tab-content05 .component-skeleton-sub {
        padding-top: 4.4rem
    }
    body.ios.nonotch .skeleton-main-group {
        margin-top: -4.4rem;
        padding-top: 2rem
    }
    body.ios.nonotch .component-skeleton-sub.shield {
        padding-top: 0
    }
    body.ios.nonotch .component-skeleton-sub.shield .skeleton-main-group {
        margin-top: 0;
        padding-top: 4rem
    }
    /*! mixin : 스켈레톤 노치대응 */
    html.ios.statusExpension .component-skeleton {
        top: calc(2rem + 6rem)
    }
    html.ios.statusExpension .component-skeleton-sub {
        padding-top: 2rem
    }
    html.ios.statusExpension .skeleton-pubsub-my-act {
        padding-top: 3rem
    }
    html.ios.statusExpension .component-skeleton-sub.finding-prod {
        padding-top: 0
    }
    html.ios.statusExpension .main-tab-content01 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content02 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content03 .component-skeleton-sub,
    html.ios.statusExpension .main-tab-content05 .component-skeleton-sub {
        padding-top: 4.4rem
    }
    html.ios.statusExpension .skeleton-main-group {
        margin-top: -4.4rem;
        padding-top: 2rem
    }
    html.ios.statusExpension .component-skeleton-sub.shield {
        padding-top: 0
    }
    html.ios.statusExpension .component-skeleton-sub.shield .skeleton-main-group {
        margin-top: 0;
        padding-top: 4rem
    }
}

[commonui-import] {
    display: none
}

.prd-detail-wrap {
    background: var(--color-w100, #fff);
    max-width: 100vw;
    overflow-x: hidden
}

.prd-detail-wrap.center {
    text-align: center
}

.prd-detail-wrap.pt0 {
    padding-top: 0
}

.ico-prd-share-top {
    display: block;
    width: 2.4rem;
    height: 0;
    padding-top: 2.4rem;
    overflow: hidden;
    background: var(--path-line-share)
}

.component-prd-notice {
    padding: 1.6rem 2rem
}

.component-prd-notice .card-group {
    border-radius: 1.6rem;
    border: 0;
    -webkit-box-shadow: 0 0.4rem 1.6rem 0 rgba(0, 0, 0, 0.08);
    box-shadow: 0 0.4rem 1.6rem 0 rgba(0, 0, 0, 0.08);
    padding-bottom: 1.2rem
}

.component-prd-notice .card-group img {
    width: 2.7rem;
    margin-right: 0.8rem
}

.component-prd-notice .card-group .col-cont p {
    margin-bottom: 0.8rem;
    font-size: 1.6rem;
    line-height: 2rem
}

.component-prd-notice .card-group .col-cont .txt-ttl {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 1.8rem;
    font-weight: 700;
    color: var(--color-g800, #414141);
    margin-bottom: 1.6rem
}

.component-prd-notice .card-group .col-cont .txt-sub {
    margin-bottom: 0.2rem;
    font-size: 1.4rem;
    color: var(--color-g800, #414141)
}

.title-group.prd-ttl .title-field-page {
    font-size: 3.2rem;
    line-height: 4.2rem
}

.title-group.prd-ttl .title-field-page.ty01 {
    font-size: 2.8rem;
    line-height: 3.6rem
}

.title-group.prd-ttl .title-field-page.ty02 {
    font-size: 1.8rem;
    line-height: 2.5rem;
    padding-bottom: 1.2rem
}

.title-group.prd-ttl .title-field-page .title-s {
    display: block;
    color: var(--color-bu900, #003fc7)
}

.title-group.prd-ttl .title-field-page.ty02 .title-s {
    color: var(--color-g700, #7d7d7d)
}

.title-group.prd-ttl .title-field-page .title-s .tag {
    margin-top: -.5rem
}

.title-group.prd-ttl .title-field-page.ty03 {
    margin-bottom: 1.2rem;
    font-size: 1.5rem;
    line-height: 2.4rem
}

.title-group.prd-ttl .title-field-page.ty03 .title-s {
    color: var(--txt-ter)
}

.title-group.prd-ttl .tag-group {
    margin-top: 1rem
}

.title-group.prd-ttl .tag-group.ty01 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-top: 1.2rem;
    text-align: center
}

.title-group.prd-ttl .tag-group.ty01 .tag {
    padding: .6rem 1.2rem;
    height: 2.8rem;
    border-color: var(--border-quin);
    background: var(--bg-qua)
}

.title-group.prd-ttl .tag-group.ty01 .tag+.tag {
    margin-left: .4rem
}

.title-group.prd-ttl .tag-group.ty01 .tag .txt {
    color: var(--txt-ter);
    font-size: 1.2rem;
    line-height: 1.6rem
}

.component-prd-card {
    min-height: 24rem
}

.component-prd-card .swiper-slide {
    text-align: center
}

.component-prd-card .swiper-slide img {
    width: 15.4rem
}

.component-prd-lottie {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 3.2rem 0
}

.component-prd-lottie i {
    display: block;
    width: 28rem;
    height: 28rem
}

.component-prd-lottie .k-pass {
    display: block;
    width: 100%;
    height: 28rem
}

.component-prd-lottie .img-ty,
.component-prd-lottie .img-ty img {
    display: block;
    margin: 0 auto;
    width: auto;
    height: 28rem
}

.component-text-simple.pt16 {
    padding-top: 1.6rem
}

.component-text-simple.pt24 {
    padding-top: 2.4rem
}

.component-prd-info {
    padding-bottom: 4rem
}

.component-text-simple+.component-prd-info,
.prd-detail-wrap.text-simple+.prd-detail-wrap.prd-info {
    padding-top: 6.4rem
}

.component-text-simple.aiquiz-type1 {
    display: none
}

.component-text-simple.aiquiz-type1 .title-group.ani-up .txt {
    -webkit-animation: none;
    animation: none
}

.component-text-simple.aiquiz-type1.active {
    display: block
}

.component-text-simple.aiquiz-type1.active .title-group.ani-up .txt {
    -webkit-animation: title-ani-up 0.6s ease forwards;
    animation: title-ani-up 0.6s ease forwards
}

.component-text-simple.aiquiz-type1 .img-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: relative;
    opacity: 1;
    width: 33.5rem;
    height: 34.5rem;
    margin: 5.2rem auto 0
}

.component-text-simple.aiquiz-type1 .img-group img {
    opacity: 0;
    width: 12rem
}

.component-text-simple.aiquiz-type1 .img-group .img-circle {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 34.5rem;
    height: 34.5rem;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.component-text-simple.aiquiz-type1.active .img-group {
    -webkit-animation: none;
    animation: none
}

.component-text-simple.aiquiz-type1.active .img-group img {
    -webkit-animation: live-img-up 0.3s ease-in-out forwards;
    animation: live-img-up 0.3s ease-in-out forwards
}

.component-text-simple.aiquiz-type1 .img-group.type1 {
    display: block;
    width: auto;
    height: auto;
    margin: 10.4rem 0 0;
    background: none;
    text-align: center
}

.component-text-simple.aiquiz-type1.active .img-group.type1 img {
    -webkit-animation: none;
    animation: none;
    width: 27.6rem;
    height: auto;
    opacity: 1
}

.component-text-simple.aiquiz-type2 {
    position: relative;
    z-index: 3;
    margin-top: 5.4rem;
    text-align: center
}

.component-text-simple.aiquiz-type2 .txt-eyebrow {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 1.5rem;
    font-weight: 500;
    color: var(--txt-sec)
}

.component-text-simple.aiquiz-type2 .tag.live {
    margin-right: 0.6rem
}

.component-text-simple.aiquiz-type2 .img-live {
    width: 4.6rem;
    margin-right: 0.6rem
}

.component-text-simple.aiquiz-type2 .img-group {
    width: 17rem;
    margin: 1.6rem auto 4.8rem
}

.component-text-simple.aiquiz-type2 .img-group img {
    max-width: 100%
}

.component-text-simple.aiquiz-type2 .number {
    font-size: 3.2rem;
    line-height: 4.2rem
}

.component-text-simple.aiquiz-type2 .txt-number {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: baseline;
    -ms-flex-align: baseline;
    align-items: baseline;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-top: 0.4rem;
    font-size: 2.1rem;
    font-weight: bold;
    line-height: 2.7rem;
    color: var(--txt-pri)
}

.component-text-simple.aiquiz-type2 .txt-number .number {
    margin-right: 0.4rem;
    font-size: 3.2rem;
    line-height: 4.2rem
}

.component-text-simple.aiquiz-type3 {
    margin-top: 5.6rem;
    text-align: center
}

.component-text-simple.aiquiz-type3 .txt-eyebrow {
    font-size: 1.6rem;
    font-weight: 500;
    line-height: 2.1rem;
    color: var(--txt-pri-down)
}

.component-text-simple.aiquiz-type3 .txt-tit {
    margin: 0.8rem 0 1.2rem;
    font-size: 2.6rem;
    font-weight: 700;
    line-height: 3.4rem;
    color: var(--color-g900)
}

.component-text-simple.aiquiz-type3 .txt-guide {
    font-size: 1.6rem;
    line-height: 2.1rem;
    color: var(--txt-ter)
}

.component-text-simple.aiquiz-type3 .img-group {
    margin-top: 2.4rem;
    padding: 3.4rem 0;
    text-align: center
}

.component-text-simple.aiquiz-type3 .img-group img {
    width: 18.2rem
}

.component-text-simple.aiquiz-type3 .btn-lv02 {
    margin-bottom: 1.2rem
}

.component-text-simple.aiquiz-type3 .btn-lv02 .txt {
    margin-top: 0;
    font-size: 1.6rem;
    font-weight: 500
}

.component-text-simple.aiquiz-type4 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    margin-top: 0
}

.component-text-simple.aiquiz-type4 .img-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative;
    width: 23.5rem;
    height: 13.3rem;
    margin-bottom: 4.8rem
}

.component-text-simple.aiquiz-type4 .img1 {
    width: 4.6rem;
    height: auto;
    margin-bottom: 1.2rem
}

.component-text-simple.aiquiz-type4 .img2 {
    position: relative;
    z-index: 2;
    width: 14.4rem;
    height: auto;
    margin-bottom: 1.2rem
}

.component-text-simple.aiquiz-type4 .img3 {
    position: absolute;
    top: 4rem;
    left: 0;
    z-index: 1;
    width: 6.4rem;
    height: auto
}

.component-text-simple.aiquiz-type4 .img4 {
    position: absolute;
    right: 0.2rem;
    bottom: 0.4rem;
    z-index: 1;
    width: 4.8rem;
    height: auto
}

.component-text-simple.aiquiz-type4 .loading-box {
    width: 3.4rem;
    margin: 2rem auto 0
}

.component-text-simple.aiquiz-type5 {
    margin: 4rem 0 6.4rem;
    text-align: center
}

.component-text-simple.aiquiz-type5 .img-group {
    margin-bottom: 3.2rem
}

.component-text-simple.aiquiz-type5 .img-group img {
    width: 12rem
}

.component-text-simple.aiquiz-type5 .txt-tit {
    font-size: 2.1rem;
    font-weight: 700;
    line-height: 2.7rem;
    color: var(--txt-pri)
}

.component-text-simple.aiquiz-type5 .txt-guide {
    margin-top: 1.6rem;
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--txt-ter)
}

.container-component.ai-quiz .img-circle {
    position: absolute;
    top: 11.8rem;
    left: 50%;
    width: 34.5rem;
    height: 34.5rem;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%)
}

.container-component.ai-quiz .img-circle img {
    width: 100%
}

.container-component.ai-quiz.h-center .section-component .img-circle {
    top: calc(50% + 4.2rem);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.container-component.ai-quiz.h-center .section-component .component-text-simple.aiquiz-type1.active {
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.container-component.ai-quiz.h-center .section-component .component-text-simple.aiquiz-type1.active .img-group {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    margin: 0 auto
}

.container-component.ai-quiz.h-center .section-component .component-text-simple.aiquiz-type1.active .img-group.type1 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.section-component.type4 .component-text-simple.aiquiz-type2 {
    margin-top: 10.8rem
}

.section-component.type4 .component-text-simple.aiquiz-type2 .txt-number {
    margin-bottom: 0.4rem;
    font-size: 1.6rem;
    line-height: 2rem
}

.component-text-simple.aiquiz-type2 .txt-number.txt-btc .btc,
.component-text-simple.aiquiz-type2 .txt-number.txt-btc .number.btc {
    color: #f89b2b
}

.component-text-simple.aiquiz-type2 .txt-number.txt-btc .plus {
    margin: 0 0.4rem;
    font-size: 3.2rem;
    font-weight: 400;
    line-height: 4.2rem;
    color: var(--txt-qua)
}

.sales-info-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.sales-info-group .col-cont {
    padding: 0 1.6rem
}

.sales-info-group .col-cont:first-child {
    padding-left: 0
}

.sales-info-group .col-cont:last-child {
    padding-right: 0
}

.sales-info-group .col-cont+.col-cont {
    border-left: 0.1rem solid var(--color-g200, #eee)
}

.sales-info-group .col-cont .txt-group {
    white-space: nowrap
}

.sales-info-group .col-cont .none {
    display: none
}

.sales-info-group .price {
    font-size: 3.2rem;
    font-weight: 700;
    color: var(--color-bu900, #003fc7)
}

.sales-info-group .price.medium {
    font-size: 2.6rem;
    line-height: 3.4rem
}

.sales-info-group .price.medium2 {
    font-size: 2.4rem;
    line-height: 3.3rem
}

.sales-info-group .txt-01 {
    font-size: 1.4rem;
    margin-bottom: 0.4rem
}

.sales-info-group .txt-02 {
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: bold;
    color: var(--color-bu900, #003fc7)
}

.sales-info-group .txt-03 {
    font-size: 1.4rem;
    color: #a6a6b3;
    margin-top: .4rem
}

:root .sales-info-group .txt-03 {
    color: var(--txt-quin, #8694b1)
}

.sales-info-group+.sales-info-group {
    margin-top: 2.4rem
}

.sales-info-group.center {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center
}

.sales-info-group.center .price.medium {
    font-size: 2.4rem
}

.sales-info-group.center.d-flex-g1 .col-cont:first-child,
.sales-info-group.center.d-flex-g1 .col-cont:last-child {
    -webkit-box-flex: 1 !important;
    -ms-flex-positive: 1 !important;
    flex-grow: 1 !important;
    padding: 0
}

.sales-info-group.center.type03 .col-cont:first-child,
.sales-info-group.center.type03 .col-cont:last-child {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    padding: 0
}

.sales-info-group.type02 .txt-01 {
    color: var(--txt-ter)
}

.component-prd-txt-group {
    position: relative;
    width: 100%;
    background: var(--color-pn, #17008c);
    padding: 8.8rem 0 8.8rem 2rem
}

.component-prd-txt-group .component-prd-txt-block {
    padding: 0
}

.component-prd-txt-group .hash {
    font-size: 1.6rem;
    color: var(--color-w50, #fffFFF7F);
    font-weight: bold
}

.component-prd-txt-group .txt01 {
    padding-top: 1rem;
    font-size: 3.2rem;
    line-height: 3.8rem;
    color: var(--color-w65, #fffFFFA5);
    white-space: nowrap
}

.component-prd-txt-group .txt01 .txt01-1 {
    font-size: 1.3rem;
    line-height: 1.6rem
}

.component-prd-txt-group .txt02 {
    margin-top: 1.2rem;
    font-size: 1.6rem;
    line-height: 2.1rem;
    color: var(--color-w65, #fffFFFA5)
}

.component-prd-txt-group+.component-prd-txt-group {
    border-top: 1px solid #463c89
}

.component-prd-txt-group [class^="prd-effect"] {
    position: relative;
    height: 5.6rem
}

.component-prd-txt-group [class^="prd-effect"] svg {
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1
}

.component-prd-txt-group .prd-effect1 {
    padding: 0 1rem 0 .5rem;
    margin-right: -1rem
}

.component-prd-txt-group .prd-effect1 svg {
    width: 128%;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    height: 5.6rem
}

.component-prd-txt-group .prd-effect2 svg {
    width: 146%;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    height: 5.6rem
}

.component-prd-txt-group .prd-effect3 {
    padding: 1rem 0
}

.component-prd-txt-group .prd-effect3 svg {
    width: 100%
}

.component-prd-txt-group .prd-effect4 {
    padding: 0 0 0.6rem 0;
    margin-right: -0.5%
}

.component-prd-txt-group .prd-effect4 svg {
    width: 100%;
    height: 5rem
}

.component-prd-txt-group .prd-effect4_1 svg {
    bottom: 2rem;
    left: -1rem;
    width: 3rem;
    height: 2.8rem
}

.component-prd-txt-group .prd-effect4_1 svg path {
    position: absolute;
    -webkit-transform: translate(-22.5rem, 0);
    -ms-transform: translate(-22.5rem, 0);
    transform: translate(-22.5rem, 0);
    z-index: 10
}

.component-prd-txt-group .prd-effect5 {
    padding: 0 0 0.4rem 0
}

.component-prd-txt-group .prd-effect5_2 {
    margin-right: 1.3rem
}

.component-prd-txt-group .prd-effect5 svg {
    width: 100%;
    height: 5rem;
    top: inherit;
    left: 0;
    bottom: -0.25rem
}

.component-prd-txt-group .prd-effect5_1 svg {
    bottom: 2.5rem;
    left: -1.5rem;
    width: 3rem;
    height: 2rem
}

.component-prd-txt-group .prd-effect5_2 svg {
    bottom: .5rem;
    left: -1.5rem;
    width: 4rem;
    height: 4rem
}

.component-prd-txt-group .prd-effect5_1 svg path {
    position: absolute;
    -webkit-transform: translate(-22rem, 0);
    -ms-transform: translate(-22rem, 0);
    transform: translate(-22rem, 0);
    z-index: 10
}

.component-prd-txt-group .prd-effect5_2 svg path {
    position: absolute;
    -webkit-transform: translate(-22rem, 0);
    -ms-transform: translate(-22rem, 0);
    transform: translate(-22rem, 0);
    z-index: 10
}

.component-prd-txt-group.bg-qua {
    background-color: var(--bg-qua)
}

.component-prd-txt-group.bg-qua .txt01 {
    color: var(--txt-sec-active);
    font-weight: 700
}

.component-prd-txt-group [data-role="animation-item"] [class^="prd-effect"] {
    color: var(--color-w100, #fff)
}

.ui-scrollMotion .component-prd-txt-group [data-role="animation-item"] [class^="prd-effect"] {
    color: var(--color-w65, #fffFFFA5);
    -webkit-transition: color .7s linear;
    -o-transition: color .7s linear;
    transition: color .7s linear
}

.ui-scrollMotion .component-prd-txt-group [data-role="animation-item"].active [class^="prd-effect"] {
    color: var(--color-w100, #fff)
}

.component-prd-txt-group:not(.type2) [data-role="animation-item"] [class^="prd-effect"] svg path {
    stroke-dashoffset: 0 !important;
    stroke-dasharray: 0 !important
}

.component-prd-txt-group.type2 [data-role="animation-item"].active .prd-effect1 svg path,
.component-prd-txt-group.type2 [data-role="animation-item"].active .prd-effect2 svg path,
.component-prd-txt-group.type2 [data-role="animation-item"].active .prd-effect3 svg path {
    -webkit-animation: prd-ef 1s .3s forwards;
    animation: prd-ef 1s .3s forwards
}

.component-prd-txt-group.type2 [data-role="animation-item"].active .prd-effect4 svg path {
    -webkit-animation: prd-ef 1s .3s forwards;
    animation: prd-ef 1s .3s forwards
}

.component-prd-txt-group.type2 [data-role="animation-item"].active .prd-effect4_1 svg path {
    -webkit-animation: prd-ef 0.5s .8s forwards;
    animation: prd-ef 0.5s .8s forwards
}

.component-prd-txt-group.type2 [data-role="animation-item"].active .prd-effect5 svg path {
    -webkit-animation: prd-ef 1s .3s forwards;
    animation: prd-ef 1s .3s forwards
}

.component-prd-txt-group.type2 [data-role="animation-item"].active .prd-effect5_1 svg path {
    -webkit-animation: prd-ef .5s .7s forwards;
    animation: prd-ef .5s .7s forwards
}

.component-prd-txt-group.type2 [data-role="animation-item"].active .prd-effect5_2 svg path {
    -webkit-animation: prd-ef .5s 1s forwards;
    animation: prd-ef .5s 1s forwards
}

.ui-scrollMotion .prd-detail-wrap.ani-txt-group [data-ani-type="up"] {
    display: block;
    -webkit-transform: translateY(30%);
    -ms-transform: translateY(30%);
    transform: translateY(30%);
    opacity: 0;
    white-space: nowrap
}

.component-prd-txt-group.type2 [data-ani-type="up"] {
    display: block;
    -webkit-transform: translateY(30%);
    -ms-transform: translateY(30%);
    transform: translateY(30%);
    opacity: 0;
    white-space: nowrap
}

.component-prd-txt-group.type2 [data-role="animation-item"].active [data-ani-type="up"] {
    -webkit-animation: ani-up .3s linear forwards;
    animation: ani-up .3s linear forwards
}

.component-prd-txt-group.type2 [data-role="animation-item"].active [class^="prd-effect"] {
    color: var(--color-w100, #fff)
}

.component-prd-txt-group.type2 [data-role="animation-item"] [class^="prd-effect"] {
    color: var(--color-w100, #fff)
}

.component-prd-txt-group.type2 [data-role="animation-item"] [class^="prd-effect"] {
    color: var(--color-w65, #fffFFFA5);
    -webkit-transition: color .7s linear;
    -o-transition: color .7s linear;
    transition: color .7s linear
}

.component-prd-txt-group.type2 [data-role="animation-item"].active [data-ani-speed="0.5"] {
    -webkit-animation-duration: 0.5s;
    animation-duration: 0.5s
}

@-webkit-keyframes prd-ef {
    to {
        stroke-dashoffset: 0
    }
}

@keyframes prd-ef {
    to {
        stroke-dashoffset: 0
    }
}

@-webkit-keyframes ani-up {
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1
    }
    50% {
        opacity: .7
    }
    0% {
        -webkit-transform: translateY(30%);
        transform: translateY(30%);
        opacity: 0
    }
}

@keyframes ani-up {
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1
    }
    50% {
        opacity: .7
    }
    0% {
        -webkit-transform: translateY(30%);
        transform: translateY(30%);
        opacity: 0
    }
}

.component-prd-txt-group .prd-effect1_1 svg,
.component-prd-txt-group .prd-effect1_2 svg,
.component-prd-txt-group .prd-effect1_3 svg,
.component-prd-txt-group .prd-effect1_4 svg {
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: auto;
    height: 5.6rem
}

.component-prd-txt-group .prd-effect2_1 svg {
    width: auto;
    height: 5.6rem;
    bottom: -1.1rem
}

.component-prd-txt-group .prd-effect2_2 svg {
    width: auto;
    height: 5.6rem;
    bottom: -1.6rem;
    left: -0.5rem
}

.component-prd-txt-group .prd-effect3_1 svg {
    width: auto;
    height: 5.6rem;
    bottom: -1.1rem
}

.component-prd-txt-group .prd-effect3_2 svg {
    width: auto;
    height: 5.6rem;
    bottom: -0.5rem;
    left: -0.7rem
}

.component-prd-txt-group .prd-effect3_3 svg {
    width: auto;
    height: 5.6rem;
    bottom: -0.5rem;
    left: -0.5rem
}

.component-prd-txt-group.type2 [data-role="animation-item"].active .prd-effect1_1 svg path,
.component-prd-txt-group.type2 [data-role="animation-item"].active .prd-effect1_2 svg path,
.component-prd-txt-group.type2 [data-role="animation-item"].active .prd-effect1_3 svg path,
.component-prd-txt-group.type2 [data-role="animation-item"].active .prd-effect1_4 svg path {
    -webkit-animation: prd-ef 1s .3s forwards;
    animation: prd-ef 1s .3s forwards
}

.component-prd-txt-group.type2 [data-role="animation-item"].active .prd-effect2_1 svg path {
    -webkit-animation: prd-ef 1s .3s forwards;
    animation: prd-ef 1s .3s forwards
}

.component-prd-txt-group.type2 [data-role="animation-item"].active .prd-effect2_2 svg path {
    -webkit-animation: prd-ef 0.5s .8s forwards;
    animation: prd-ef 0.5s .8s forwards
}

.component-prd-txt-group.type2 [data-role="animation-item"].active .prd-effect3_1 svg path {
    -webkit-animation: prd-ef 1s .3s forwards;
    animation: prd-ef 1s .3s forwards
}

.component-prd-txt-group.type2 [data-role="animation-item"].active .prd-effect3_2 svg path {
    -webkit-animation: prd-ef .5s .7s forwards;
    animation: prd-ef .5s .7s forwards
}

.component-prd-txt-group.type2 [data-role="animation-item"].active .prd-effect3_3 svg path {
    -webkit-animation: prd-ef .5s 1s forwards;
    animation: prd-ef .5s 1s forwards
}

.component-prd-txt-group.type3 {
    padding: 8rem 0;
    text-align: center
}

.component-prd-txt-group.type3 .txt01+.hash {
    margin-top: 1.2rem
}

.component-prd-txt-group.type3 .hash {
    font-weight: 500;
    color: var(--color-w65, #fffFFFA5);
    line-height: 2.1rem
}

.component-bg-number+.component-prd-txt-group.type3 {
    margin-top: 3.6rem;
    overflow: hidden
}

.component-prd-txt-group.bg-gary {
    background-color: var(--color-g100, #f8f8f8)
}

.component-prd-txt-group.bg-white+.component-prd-txt-group {
    border-top: 0
}

.component-prd-txt-group.bg-gary .txt01,
.component-prd-txt-group.bg-white .txt01 {
    color: var(--color-g900, #141414);
    font-size: 2.8rem;
    line-height: 3.6rem;
    padding-top: 0
}

.component-prd-txt-group.bg-gary .hash,
.component-prd-txt-group.bg-white .hash {
    color: var(--color-g800, #414141);
    line-height: 2.1rem
}

.component-prd-txt-group.type4 {
    padding: 6.4rem 0 3.6rem;
    text-align: center
}

.component-prd-txt-group.type4 .txt01 {
    font-size: 2.6rem;
    line-height: 3.4rem;
    font-weight: 700;
    color: var(--color-g900)
}

.component-prd-txt-group.type4 .txt01+.hash {
    margin-top: 1.2rem
}

.component-prd-txt-group.type4 .hash {
    font-size: 1.6rem;
    color: var(--txt-sec);
    line-height: 2.1rem;
    font-weight: 400
}

.component-prd-txt-group.type4 .img-area {
    margin-top: 40px
}

.component-prd-txt-group.center {
    text-align: center
}

.component-prd-txt-group.type5 .txt01 {
    font-size: 3.2rem;
    line-height: 4.2rem;
    font-weight: 400;
    color: var(--txt-sec-invert)
}

.component-prd-acco {
    padding: 0
}

.component-prd-acco .title-group {
    margin-top: 3.2rem
}

.component-prd-acco .title-group:first-child {
    margin-top: 0
}

.component-prd-acco .bl-txt-group,
.component-prd-acco .title-group+.txt-lv03 {
    padding: 1rem 0 0
}

.component-prd-acco .title-group .bl-txt-group>.txt+.txt {
    margin-top: 0.4rem
}

.component-prd-acco .bl-txt-group:first-child {
    padding-top: 0
}

.component-prd-acco .bl-txt-group+.table-layout-group {
    padding-top: 1.2rem
}

.component-prd-acco .table-layout-group+.title-group,
.component-prd-acco .title-group+.table-layout-group .table-layout-header {
    margin-top: 1.2rem
}

.component-prd-acco .table-layout-header+.txt-lv03 {
    padding-bottom: 1.2rem
}

.component-prd-acco .table-layout-footer+.txt-lv03 {
    padding: 1.2rem 0 1.3rem
}

.component-prd-acco .bl-txt-group>.txt {
    font-size: 1.4rem;
    line-height: 2.1rem;
    color: var(--color-g800)
}

.component-prd-acco .bl-txt-group>.txt+.txt {
    margin-top: .8rem
}

.component-prd-acco .bl-txt-group.type01 {
    margin-top: 0;
    padding-top: 1.2rem
}

.component-prd-acco .bl-txt-group.type01>.txt+.txt {
    margin-top: .4rem
}

.component-prd-acco .bl-txt-group.type01>.txt>.dash-txt-group .txt {
    margin-top: .4rem
}

.component-prd-acco .bl-txt-group>.txt>.dash-txt-group .txt {
    color: var(--color-g800, #414141);
    font-size: 1.4rem
}

.component-prd-acco .bl-txt-group+.btn-under-link,
.component-prd-acco .bl-txt-group>.txt .btn-under-link {
    margin-top: .8rem
}

.component-prd-acco .bl-txt-group.txt-ter>.txt {
    color: var(--txt-ter)
}

.component-prd-acco .byul-txt {
    margin: 1.2rem 0 .7rem;
    font-size: 1.4rem;
    color: #414141;
    line-height: 2.1rem
}

.component-prd-acco ul .byul-txt:first-child {
    margin-bottom: 0
}

.component-prd-acco .byul-txt+.byul-txt {
    margin: .4rem 0 0
}

.component-prd-acco .txt-lv03+.txt-lv03 {
    margin-top: .4rem
}

.component-prd-acco .btn-under-link,
.component-prd-acco .txt-lv02 {
    margin-top: .8rem;
    font-size: 1.4rem;
    color: #414141
}

.component-prd-acco .table-layout-group td.blue {
    color: var(--color-bu600, #0082ff)
}

.component-prd-acco .table-layout-group .bl-txt-group:first-child {
    padding-top: 0
}

.component-prd-acco .table-layout-group .bl-txt-group>.txt+.txt {
    margin-top: 0
}

.component-prd-acco .table-layout-group+.table-layout-group {
    margin-top: 3.2rem
}

.component-prd-acco .table-layout-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.component-prd-acco .table-layout-header .l-txt {
    justify-self: flex-start;
    font-size: 1.5rem
}

.component-prd-acco .table-layout-header .txt {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    color: var(--color-g700, #7d7d7d)
}

.component-prd-acco .table-layout-footer .bl-txt-group {
    padding: 0
}

.component-prd-acco .table-layout-footer .bl-txt-group>.txt>.dash-txt-group .txt,
.component-prd-acco .table-layout-footer .txt {
    font-size: 1.2rem;
    color: var(--color-g700, #7d7d7d)
}

:root .list-linebox-group .accordion-cont {
    background: var(--bg-qua)
}

:root .list-linebox-group .accordion-cont [class^="table-group"] th {
    background: var(--bg-ter)
}

.component-prd-acco.ty01 .bl-txt-group {
    padding-top: 1.2rem
}

.component-prd-acco.ty01 .title-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.component-prd-acco.ty01 .title-group+.txt-lv03.txt-ter.bold {
    padding-top: 1.2rem
}

.component-prd-acco.ty01 .bl-txt-group>.txt {
    color: var(--txt-ter)
}

.component-prd-acco.ty01 .bl-txt-group>.txt+.txt {
    margin-top: .4rem
}

.component-prd-acco.ty01 .bl-txt-group>.txt>.dash-txt-group {
    margin-top: .4rem
}

.component-prd-acco.ty01 .bl-txt-group>.txt>.dash-txt-group .txt {
    color: var(--txt-qua)
}

.component-prd-acco.ty01 .bl-txt-group>.txt>.dash-txt-group .txt+.txt {
    margin-top: .4rem
}

.component-prd-acco.ty01 .txt-lv03.txt-ter.bold+.bl-txt-group {
    padding-top: .4rem
}

.component-prd-acco.ty01 .bl-txt-group+.txt-lv03.txt-ter.bold {
    padding-top: 1.2rem
}

.component-prd-acco.ty01 .bl-txt-group+.table-layout-group {
    padding-top: .8rem
}

.component-prd-acco.ty01 .prd-bu-ty01 {
    position: relative;
    padding-left: 1rem
}

.component-prd-acco.ty01 .prd-bu-ty01:before {
    content: '※';
    position: absolute;
    top: 0;
    left: 0;
    display: block
}

.component-prd-acco.ty01 .prd-bu-ty01 .dash-txt-group {
    margin-top: .4rem
}

.component-prd-acco.ty01 .prd-bu-ty01 .dash-txt-group .txt {
    color: var(--txt-qua)
}

.component-prd-acco.ty01 .prd-bu-ty01 .dash-txt-group .txt+.txt {
    margin-top: .4rem
}

.component-prd-acco .title-group .title-field-004 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.component-prd-acco .title-group .title-field-004>div {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-bottom: 0.2rem
}

.component-prd-acco .title-group .title-field-004>div .l-txt {
    display: block;
    color: var(--color-g900, #141414);
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: bold
}

.component-prd-acco .title-group .title-field-004>div .r-txt {
    color: var(--color-g700, #7d7d7d);
    font-size: 1.4rem;
    line-height: 2rem
}

.component-prd-acco .title-group .title-field-004 .b-txt {
    color: var(--color-g700, #7d7d7d);
    font-size: 1.1rem
}

.list-linebox-group.prd {
    background: transparent
}

.list-linebox-group.prd .list-item {
    border: 0
}

:root .list-linebox-group.prd .list-item {
    border: 0
}

.list-linebox-group.prd .tit-list {
    font-size: 1.4rem;
    color: #414141;
    line-height: 2rem
}

.txt-add-group.prd {
    padding: 2rem 2.0rem 0;
    text-align: left;
    color: var(--color-g700, #7d7d7d)
}

.txt-add-group.prd .txt-lv03 {
    padding-bottom: 1rem
}

.prd-detail-wrap.btn .component-btn.fixed-bottom {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0)
}

.component-btn.fixed-bottom.prd {
    padding-top: 1.2rem;
    background: none var(--color-w85, #fffFFFD8);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px)
}

.component-btn.fixed-bottom.prd:before {
    background: transparent
}

.component-btn.fixed-bottom.prd.white {
    background: var(--color-w100, #fff)
}

.txt-add-group.prd.insu-date {
    padding: 1.2rem 2rem 0
}

.txt-add-group.prd.insu-date .txt-lv03 {
    font-size: 1rem;
    line-height: 1.5rem
}

.txt-add-group.prd.insu-date .txt-lv03+.txt-lv03 {
    padding-top: 0
}

.txt-add-group.prd.app-moweb-show {
    display: block
}

.txt-add-group.prd.pc-show {
    display: none
}

.pc .txt-add-group.prd.app-moweb-show {
    display: none
}

.pc .txt-add-group.prd.pc-show {
    display: block
}

.prd-bottom-banner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.prd-bottom-banner+.btn-under-link {
    display: block;
    margin: 0 auto;
    padding-top: 1.5rem
}

.prd-bottom-txt {
    font-size: 1.4rem;
    color: #9b9b9b;
    word-break: keep-all
}

:root .prd-bottom-txt {
    color: var(--txt-qua, #67748e)
}

.prd-bottom-txt span {
    padding-top: .7rem;
    display: block;
    font-size: 1.6rem;
    color: var(--color-g900, #141414);
    font-weight: bold
}

.prd-bottom-txt span strong {
    color: var(--color-lm500, #69b405);
    font-weight: bold
}

:root .prd-bottom-txt span strong {
    color: var(--txt-pri-active, #0114a7)
}

.prd-bottom-txt+.prd-bottom-btn {
    margin-left: 1.6rem;
    -webkit-box-flex: 1;
    -ms-flex: 1 0 auto;
    flex: 1 0 auto
}

.prd-bottom-btn {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    max-width: 100%
}

.prd-bottom-txt+.prd-bottom-btn .btn-group {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.prd-bottom-txt+.prd-bottom-btn .btn-group [class^="btn-"] {
    -webkit-box-flex: 0;
    -ms-flex: 0 auto;
    flex: 0 auto
}

.icon-list-group.prd {
    padding: 2rem 0 5rem
}

.icon-list-group.prd .item-tap {
    margin: 0
}

.icon-list-group.prd .item-tap [class*="ico-"] {
    width: 3rem;
    height: 3rem
}

.icon-list-group.prd .item-tap .ico-prod-01 {
    background-image: var(--path-line-share)
}

.icon-list-group.prd .item-tap .ico-prod-02 {
    background-image: var(--path-line-call)
}

.icon-list-group.prd .item-tap .ico-prod-03 {
    background-image: var(--path-line-chat)
}

.word-break_ {
    word-break: keep-all
}

.component-prd-insu {
    padding: 0
}

.component-prd-insu+.component-prd-event,
.prd-detail-wrap.prd-insu+.prd-detail-wrap.prd-event {
    margin-top: 4rem
}

.component-prd-event {
    padding: 0 0 2.4rem
}

.component-prd-event .section-link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
    padding: 1.4rem 1.6rem;
    background-color: #f5f6fa;
    border-radius: 1.2rem;
    height: auto
}

.component-prd-event .section-link .col-cont {
    padding-left: 1.2rem;
    padding-right: 0.4rem
}

.component-prd-event .section-link .col-cont .txt-ttl {
    font-size: 1.5rem;
    color: rga(20, 20, 20);
    line-height: 2.1rem
}

.component-prd-event .section-link .col-cont .txt-ttl.strong {
    font-weight: bold
}

.component-prd-event .section-link img {
    max-width: 3.6rem
}

.component-prd-event .section-link .prd-bne-link {
    margin-left: auto
}

.component-prd-event .section-link .prd-bne-link * {
    font-style: normal;
    font-size: 1.4rem;
    color: var(--color-g900, #141414)
}

.component-prd-event .swiper-container {
    padding: 0 2.0rem
}

.component-prd-event .swiper-slide {
    padding: 0 0 1rem 0
}

.component-prd-event .swiper-pagination-bullet {
    background: #e0e0e0
}

.component-prd-event .swiper-pagination-bullet {
    background: #fff
}

.component-prd-event .swiper-pagination-bullet-active {
    background: var(--color-g700, #7d7d7d)
}

.component-prd-event.type2 .section-link {
    background: var(--indigo-in1000, #1728c4);
    padding: 1.6rem 1.4rem
}

.component-prd-event.type2 .section-link img {
    max-width: 4rem
}

.component-prd-event.type2 .section-link .txt-ttl {
    color: var(--color-w100, #fff)
}

.component-prd-event.type2 .section-link .txt-sub {
    font-size: 1.2rem;
    font-weight: 400;
    line-height: 1.6rem;
    color: var(--color-w70, rgba(255, 255, 255, 0.7))
}

.component-prd-event.type2 .section-link .ico-arrow-link {
    width: 1.6rem;
    height: 1.6rem;
    -webkit-filter: var(--filter-w100);
    filter: var(--filter-w100)
}

.component-prd-event.type3 .section-link {
    background: var(--bg-ter, #edf1f7);
    padding: 1.6rem 2rem
}

.component-prd-event.type3 .section-link img {
    max-width: 4.4rem
}

.component-prd-event.type3 .section-link .txt-ttl {
    color: var(--color-g800, #3b4659)
}

.component-prd-event.type3 .section-link .txt-sub {
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 2rem;
    color: var(--color-g600, #67748e)
}

.component-prd-event.type3 .section-link .ico-arrow-link {
    width: 1.6rem;
    height: 1.6rem;
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

.component-prd-bne .txt-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-top: 1px solid var(--color-g200, #eee);
    padding: 2.5rem 0 2.4rem
}

.component-prd-bne .txt-group img {
    width: 4.8rem
}

.component-prd-bne .txt-group .col-cont {
    padding-left: .3rem
}

.component-prd-bne .txt-group .txt-ttl {
    font-size: 1.5rem;
    color: var(--color-g900, #141414);
    font-weight: bold;
    line-height: 2.1rem
}

.component-prd-bne .txt-group .txt-ttl .txt-sub {
    font-weight: normal
}

.component-prd-bne .txt-group .txt-ttl .txt-sub.ty01 {
    margin-top: .2rem;
    font-size: 1.4rem;
    color: var(--color-g700, #7d7d7d);
    line-height: 2rem
}

.component-prd-bne .banner-link {
    position: relative;
    margin: 4.8rem 0;
    padding: 2.5rem;
    min-height: 15.5rem;
    border-radius: 1.6rem;
    overflow: hidden
}

.component-prd-bne .banner-link .col-cont {
    position: relative;
    z-index: 1;
    width: 100%;
    font-size: 1.5rem;
    color: var(--color-w100, #fff);
    line-height: 2.1rem
}

.component-prd-bne .banner-link .txt-ttl {
    margin-top: 0.4rem;
    font-size: 2.4rem;
    font-weight: bold;
    line-height: 3rem
}

.component-prd-bne .banner-link .img-figure {
    position: absolute;
    right: 2.5rem;
    bottom: 2.5rem
}

.component-prd-bne+.component-prd-txt-group,
.component-prd-total-ea+.component-prd-txt-group,
.component-prd-total-ea+.prd-detail-wrap.ani-txt-group,
.prd-detail-wrap.prd-bne+.prd-detail-wrap.ani-txt-group {
    margin-top: 0
}

.component-prd-total-ea {
    padding: 3.6rem 2rem 4rem;
    background: rgba(20, 20, 20, 0.03)
}

:root .component-prd-total-ea {
    background: var(--bg-qua, #f7f9fd)
}

.prd-total-group .txt-01 {
    font-weight: bold;
    padding-left: .5rem
}

.prd-total-group .prd-total-header+.form-row,
.prd-total-group .prd-total-header+.title-group {
    margin-top: 2.4rem
}

.prd-total-group .text-simple-group {
    padding: .4rem 0 0 1.6rem
}

.mobile .prd-detail-wrap.prd-bne {
    display: none !important
}

.prd-total-result {
    margin-top: 4rem;
    padding-top: 4rem;
    border-top: 1px solid var(--color-g300, #e0e0e0);
    text-align: right
}

:root .prd-total-result {
    border-top: 1px solid var(--border-qua, #e0e6f1)
}

.prd-total-result .title-group .title-field-page {
    font-size: 1.8rem;
    line-height: 2.1rem
}

.prd-total-result .title-field-page .sum {
    padding: 0 .2rem 0 .4rem;
    font-size: 2.6rem;
    color: var(--color-lm500, #69b405);
    font-weight: bold
}

:root .prd-total-result .title-field-page .sum {
    color: var(--txt-pri-success, #039115)
}

:root .prd-total-result .title-field-page .sum {
    color: var(--txt-pri-active, #0114a7)
}

.prd-total-result .title-group .txt-guide {
    margin-top: .5rem
}

:root .prd-total-result .title-group .tag.fee {
    background-color: var(--bg-accent-pri, #4262ff)
}

:root .prd-total-result .title-group .tag.fee .txt {
    color: var(--txt-pri-invert, #fff)
}

.prd-total-result .form-row {
    margin: 0 0 1.2rem
}

.prd-total-result .tag.fee .txt {
    font-weight: normal
}

.prd-total-result .tag.fee .txt strong {
    font-weight: bold;
    padding-left: .2rem
}

.bl-x {
    width: 1.2rem;
    height: 0;
    padding-top: 1.2rem;
    overflow: hidden;
    margin-left: 0.6rem;
    background: url(/resource/img/mmk/common/ico_green_Icons_x.png) 0 0 no-repeat;
    background-size: 100%
}

:root .bl-x {
    width: 1.4rem;
    height: 1.4rem;
    padding-top: 1rem;
    background-image: var(--path-solid-close-circle);
    -webkit-filter: var(--filter-pn);
    filter: var(--filter-pn)
}

.prd-total-group.ty01 {
    padding-bottom: 1.2rem
}

.prd-total-group.ty01 .prd-total-header .highlight:before {
    background: var(--color-bu500, #1c97ff);
    opacity: 0.2
}

.prd-total-group.ty01 .form-row {
    font-size: 0
}

.prd-total-group.ty01 .selectbox-bl-radius-group+[class^="txt"] {
    padding-left: 0;
    margin-left: .8rem
}

.prd-total-group.ty01 [class^="txt"]+.selectbox-bl-radius-group {
    margin-left: .8rem
}

.prd-total-group.ty01 .prd-total-header {
    padding-bottom: 0.8rem
}

.prd-total-group.ty01 .text-simple-group .txt-lv04 .underline {
    margin-left: 0
}

.prd-total-group.ty01 .prd-total-result {
    margin-top: 3.2rem;
    padding-top: 3.2rem
}

.prd-total-group.ty01 .title-group .txt-guide {
    margin-top: .8rem
}

.prd-total-group.ty01 .prd-total-result .title-field-page span {
    color: var(--indigo-in1100, #0114a7);
    font-size: 2.6rem;
    line-height: 3.4rem
}

.selectbox-bl-radius-group[class*="prd-select"] {
    border-color: var(--border-pri-success);
    padding: 0.8rem 1.6rem
}

.selectbox-bl-radius-group[class*="prd"] .bl-selectbox {
    position: relative;
    top: inherit;
    right: inherit;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none;
    margin-left: 0.6rem
}

.selectbox-bl-radius-group.prd-select1 .bl-selectbox {
    -webkit-filter: var(--filter-lm500);
    filter: var(--filter-lm500)
}

.selectbox-bl-radius-group[class*="prd"] .btn-selectbox .select-txt-wrap {
    font-size: 2.1rem;
    line-height: 2.7rem;
    font-weight: 700
}

.selectbox-bl-radius-group.prd-select1 .btn-selectbox .select-txt-wrap,
.selectbox-bl-radius-group.prd-select1 .btn-selectbox .txt-name {
    font-size: 2.1rem;
    line-height: 2.7rem;
    font-weight: 700;
    color: var(--color-lm500, #69b405)
}

:root .selectbox-bl-radius-group.prd-select1 .btn-selectbox .txt-name {
    color: var(--txt-pri-success, #039115)
}

.selectbox-bl-radius-group.prd-select1.error .btn-selectbox .select-txt-wrap,
.selectbox-bl-radius-group.prd-select1.error .btn-selectbox .txt-name {
    color: var(--color-re700, #f02727)
}

.selectbox-bl-radius-group.prd-select1.error {
    border-color: var(--color-re700, #f02727)
}

.selectbox-bl-radius-group.prd-select1.error .bl-selectbox {
    -webkit-filter: var(--filter-re700);
    filter: var(--filter-re700)
}

.selectbox-bl-radius-group.prd-select2 {
    background: var(--color-lm500, #69b405)
}

.selectbox-bl-radius-group.prd-select2 .bl-selectbox {
    -webkit-filter: var(--filter-w100);
    filter: var(--filter-w100)
}

.selectbox-bl-radius-group.prd-select2 .btn-selectbox .txt-name {
    color: var(--color-w100, #fff)
}

.selectbox-bl-radius-group.prd-select3 {
    border-color: var(--indigo-in1100, #0114a7);
    background: var(--color-w100, #fff);
    padding: 0.7rem 1.6rem
}

.selectbox-bl-radius-group.prd-select3 .bl-selectbox {
    -webkit-filter: var(--filter-pn);
    filter: var(--filter-pn)
}

.selectbox-bl-radius-group.prd-select3 .btn-selectbox .select-txt-wrap,
.selectbox-bl-radius-group.prd-select3 .btn-selectbox .txt-name {
    color: var(--indigo-in1100, #0114a7)
}

.selectbox-bl-radius-group.prd-select3.error .btn-selectbox .select-txt-wrap,
.selectbox-bl-radius-group.prd-select3.error .btn-selectbox .txt-name {
    color: var(--color-re700, #f02727)
}

.selectbox-bl-radius-group.prd-select3.error {
    border-color: var(--color-re700, #f02727)
}

.selectbox-bl-radius-group.prd-select3.error .bl-selectbox {
    -webkit-filter: var(--filter-re700);
    filter: var(--filter-re700)
}

.selectbox-bl-radius-group.prd-select4 {
    border-color: var(--indigo-in1100, #0114a7);
    background: var(--indigo-in1100, #0114a7);
    padding: 0.7rem 1.6rem
}

.selectbox-bl-radius-group.prd-select4 .bl-selectbox {
    -webkit-filter: var(--filter-w100);
    filter: var(--filter-w100)
}

.selectbox-bl-radius-group.prd-select4 .btn-selectbox .select-txt-wrap,
.selectbox-bl-radius-group.prd-select4 .btn-selectbox .txt-name {
    font-size: 2.1rem;
    line-height: 2.7rem;
    font-weight: 700;
    color: var(--color-w100, #fff)
}

.prd-total-result .selectbox-bl-radius-group {
    height: 3rem
}

.prd-total-result .selectbox-bl-radius-group .btn-selectbox {
    margin: 0 auto
}

.prd-total-result .selectbox-bl-radius-group .btn-selectbox .txt-name {
    font-size: 1.4rem
}

:root .selectbox-bl-radius-group.prd-select1 {
    border: 1px solid var(--bg-pri, #0114a7)
}

:root .selectbox-bl-radius-group.prd-select1 .btn-selectbox .select-txt-wrap {
    color: var(--txt-accent-pri, #0114a7)
}

:root .selectbox-bl-radius-group.prd-select1 .btn-selectbox .bl-selectbox {
    -webkit-filter: var(--filter-pn, #0114a7);
    filter: var(--filter-pn, #0114a7)
}

:root .selectbox-bl-radius-group.prd-select1 .btn-selectbox .txt-name {
    color: var(--txt-accent-pri, #0114a7)
}

:root .selectbox-bl-radius-group.prd-select1.error {
    border-color: var(--color-re700, #f02727)
}

:root .selectbox-bl-radius-group.prd-select1.error .btn-selectbox .select-txt-wrap,
:root .selectbox-bl-radius-group.prd-select1.error .btn-selectbox .txt-name {
    color: var(--color-re700, #f02727)
}

:root .selectbox-bl-radius-group.prd-select1.error .btn-selectbox .bl-selectbox {
    -webkit-filter: var(--filter-re700);
    filter: var(--filter-re700)
}

:root .selectbox-bl-radius-group.prd-select2 {
    background: var(--bg-pri, #0114a7);
    border: 1px solid var(--bg-pri, #0114a7)
}

:root .selectbox-bl-radius-group.prd-select2 .bl-selectbox {
    -webkit-filter: brightness(0) saturate(100%) invert(1);
    filter: brightness(0) saturate(100%) invert(1)
}

:root .selectbox-bl-radius-group.prd-select2 .btn-selectbox .txt-name {
    color: var(--color-w100, #fff)
}

.prd-cal-keypad .keypad-value .value,
.prd-cal-keypad .keypad-value .value-sub-area .value-p {
    display: block
}

.prd-cal-keypad .keypad-value.error .validation-txt-set * {
    font-size: 1.2rem
}

.prd-cal-keypad .keypad-value.error .validation-txt-set+.validation-txt-set {
    margin-top: 0.2rem
}

.prd-cal-keypad .keypad-group .keypad-value .value-sub-area {
    margin-top: 1.5rem
}

.component-prd-ico-txt.title-group .txt-guide {
    margin-top: 0.8rem
}

.component-prd-ico-txt .tag.fee {
    position: relative
}

:root .component-prd-ico-txt .tag.fee {
    background-color: var(--bg-accent-pri, #4262ff)
}

.component-prd-ico-txt .tag.fee .txt {
    font-weight: normal
}

:root .component-prd-ico-txt .tag.fee .txt {
    color: var(--txt-pri-invert, #fff)
}

.component-prd-ico-txt .tooltip-point-group .tag.fee:after {
    content: "";
    position: absolute;
    bottom: -2.5rem;
    left: 2.5rem;
    width: 1.8rem;
    height: 1.8rem;
    border-radius: 0.3rem;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    background: #41b706
}

.tooltip-point-group .tooltip-area.point-none:after {
    display: none
}

.tooltip-point-group .tooltip-area.point-type1:after {
    left: 5.5rem
}

.title-group .title-field-01.prd {
    padding: 1.6rem 0
}

.prd-pa-line {
    padding-top: 2.4rem
}

.prd-pa-line .selectbox-bl-radius-group {
    height: 3rem;
    padding: 0 1.4rem;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-color: var(--color-lm500, #69b405)
}

:root .prd-pa-line .selectbox-bl-radius-group {
    border-color: var(--border-pri-success, #039115)
}

:root .prd-pa-line .selectbox-bl-radius-group {
    border-color: var(--bg-pri, #0114a7)
}

.prd-pa-line .selectbox-bl-radius-group.prd-select2 .bl-selectbox {
    -webkit-filter: var(--filter-w100);
    filter: var(--filter-w100)
}

.component-prd-ico-txt .selectbox-bl-radius-group.prd-select1 .btn-selectbox .txt-name,
.prd-pa-line .selectbox-bl-radius-group .txt-name {
    font-size: 1.4rem;
    color: var(--color-lm500, #69b405);
    font-weight: bold;
    line-height: 3rem
}

:root .prd-pa-line .selectbox-bl-radius-group .txt-name {
    color: var(--txt-pri-active, #0114a7)
}

:root .component-prd-ico-txt .selectbox-bl-radius-group.prd-select1 .btn-selectbox .txt-name {
    color: var(--txt-pri-success, #039115)
}

:root .component-prd-ico-txt .selectbox-bl-radius-group.prd-select1 .btn-selectbox .txt-name {
    color: var(--txt-pri-active, #0114a7)
}

.prd-pa-line .sum {
    padding: 0 .2rem;
    color: var(--color-g500, #b8b8b8);
    font-size: 2.1rem
}

.prd-pa-line.type2 .selectbox-bl-radius-group {
    border-color: var(--bg-accent-pri)
}

.prd-pa-line.type2 .selectbox-bl-radius-group .txt-name {
    color: var(--bg-accent-pri)
}

.prd-pa-line.type2 .selectbox-bl-radius-group.prd-select1 {
    background-color: var(--bg-base)
}

.prd-pa-line.type2 .selectbox-bl-radius-group.prd-select1 .bl-x {
    -webkit-filter: var(--filter-pl);
    filter: var(--filter-pl)
}

.prd-pa-line.type2 .selectbox-bl-radius-group.prd-select2 {
    background: var(--bg-accent-pri)
}

.prd-pa-line.type2 .selectbox-bl-radius-group.prd-select2.read-only {
    background: var(--color-g300);
    border-color: var(--color-g300)
}

.prd-pa-line.type2 .selectbox-bl-radius-group.prd-select2.read-only .txt-name {
    color: var(--txt-ter)
}

.prd-pa-line.type2 .selectbox-bl-radius-group.prd-select2.read-only .bl-selectbox {
    -webkit-filter: var(--filter-ico-ter);
    filter: var(--filter-ico-ter)
}

.prd-comp-wrap {
    padding: 0 2rem
}

.prd-comp-filed {
    padding: 2.2rem 3.3rem;
    background: #f1f0f6;
    border-radius: .5rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.prd-comp-wrap .prd-comp-text {
    width: calc(100% - 11rem)
}

.prd-comp-wrap .prd-comp-text .code-txt {
    width: 100%;
    height: 3.2rem;
    padding: 0 .5rem;
    background: var(--color-w100, #fff);
    border-radius: .5rem;
    text-align: center;
    border: 0;
    font-size: 1.4rem;
    border: 1px solid var(--color-w100, #fff)
}

.prd-comp-wrap .prd-comp-text .valid-msg {
    display: none
}

.prd-comp-wrap .prd-comp-text.error .valid-msg {
    display: block;
    padding-top: .8rem;
    font-size: 1.2rem;
    color: var(--color-re700, #f02727)
}

.prd-comp-wrap .prd-comp-text.error .code-txt {
    border: 1px solid var(--color-re700, #f02727)
}

.prd-comp-wrap .code-copy {
    min-width: 10rem;
    height: 3.2rem;
    border-radius: .5rem;
    line-height: 3.2rem;
    text-align: center;
    background: rgba(15, 0, 96, 0.06);
    font-size: 1.4rem;
    color: #0f0060
}

.prd-comp-wrap .code-copy span {
    opacity: 0.32
}

.prd-comp-wrap .code-copy.on span {
    opacity: 1
}

.prd-comp-wrap .prd-comp-hint {
    padding-top: 1.6rem;
    font-size: 1.5rem;
    color: var(--color-g700, #7d7d7d);
    text-align: center
}

.prd-comp-wrap .prd-comp-hint a {
    position: relative;
    display: inline-block;
    padding: 0 0 0.4rem 3.7rem
}

.prd-comp-wrap .prd-comp-hint a:before {
    content: '';
    display: block;
    position: absolute;
    top: .1rem;
    left: 0;
    width: 2.7rem;
    height: 1.6rem;
    background: url(/resource/img/mmk/common/ico_prd_comp.png) 0 0 no-repeat;
    background-size: 100%
}

.prd-comp-wrap .prd-comp-hint a:after {
    content: '';
    display: block;
    position: absolute;
    bottom: 0;
    right: 0;
    width: calc(100% - 3.7rem);
    height: 1px;
    background: var(--color-g700, #7d7d7d)
}

.prd-total-header .highlight {
    position: relative
}

:root .prd-total-header .highlight {
    z-index: 0
}

.prd-total-header .highlight:before {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 1rem;
    background: var(--color-pl, #b6f23d);
    opacity: .4;
    z-index: -1
}

:root .prd-total-header .highlight:before {
    background: var(--color-blue-bu500, #2e9aff);
    opacity: .2
}

.title-group .title-field-01.prd.pt0 {
    padding-top: 0
}

.graybox-text-group.type2.tooltip-focus-group .tooltip-area {
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    background-color: var(--color-w100, #fff);
    -webkit-filter: drop-shadow(0 2px 6px rgba(0, 0, 0, 0.12));
    filter: drop-shadow(0 2px 6px rgba(0, 0, 0, 0.12));
    display: none
}

.graybox-text-group.type2.tooltip-focus-group .tooltip-content {
    padding: 0
}

.graybox-text-group.type2.tooltip-focus-group .tooltip-area:after {
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    -webkit-filter: var(--filter-w100);
    filter: var(--filter-w100)
}

.graybox-text-group.type2.tooltip-focus-group .tooltip-icon {
    margin-right: 0;
    padding-right: 0
}

.graybox-text-group.type2.tooltip-focus-group .tooltip-content .txt {
    color: var(--color-g900, #141414)
}

.title-field-popup.base-rate {
    position: relative
}

.title-field-popup.base-rate .ico-clock2 {
    position: absolute;
    top: 1rem;
    right: 0
}

.title-field-popup.base-rate .ico-ir {
    position: absolute;
    top: -0.2rem;
    right: 0
}

.prd-cal-keypad .validation-txt-set {
    -webkit-animation: 2.35s shaking linear alternate;
    animation: 2.35s shaking linear alternate;
    -webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;
    -webkit-animation-delay: 1s;
    animation-delay: 1s
}

.component-prd-txt-group .txt01 .btn-under-link {
    position: relative;
    color: var(--color-w100, #fff);
    text-decoration: none;
    line-height: 2.2rem !important;
    font-size: 1.4rem
}

.component-prd-txt-group .txt01 .btn-under-link::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    background: var(--color-w100, #fff);
    height: 0.1rem
}

.list-linebox-group.prd .section-link {
    position: relative;
    padding: 1.2rem 1.5rem 0 0;
    font-size: 1.4rem;
    color: var(--color-g800, #414141)
}

.list-linebox-group.prd .section-link:after {
    content: '';
    display: block;
    position: absolute;
    top: calc(50% - .2rem);
    right: 0.2rem;
    width: 1.6rem;
    height: 1.6rem;
    background-image: var(--path-line-chevron-right);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
    -webkit-filter: var(--filter-g500);
    filter: var(--filter-g500)
}

.list-linebox-group.prd .list-item:first-child .section-link {
    padding-top: 0
}

.list-linebox-group.prd .list-item:first-child .section-link:after {
    top: calc(50% - 0.8rem)
}

.list-linebox-group.prd .section-link .col-state {
    display: none
}

.graybox-text-group.type2 {
    width: 100%
}

.graybox-text-group.type2 .ico-loan-result {
    position: absolute;
    top: 1rem;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%)
}

.ico-ir {
    display: block;
    width: 6rem;
    height: 6rem;
    background: url(/resource/img/mmk/common/ico_prd_ir.png) 0 0 no-repeat;
    background-size: 100%
}

.ico-clock2 {
    display: block;
    width: 8rem;
    height: 8rem;
    background: url(/resource/img/mmk/common/ico_prd_clock.png) 0 0 no-repeat;
    background-size: 100%
}

.ico-prd-tooltip {
    display: inline-block;
    vertical-align: middle;
    width: 2rem;
    height: 1.9rem;
    background: url(/resource/img/mmk/common/ico_prd_tooltip.png) 0 0 no-repeat;
    background-size: 100%
}

.title-group.prd-ttl .title-field-page .title-s.color1 {
    color: var(--color-g900)
}

.sales-info-group .txt-group.color2 .price,
.sales-info-group .txt-group.color2 .txt-02,
.title-group.prd-ttl .title-field-page .title-s.color2 {
    color: var(--color-bu900, #003fc7)
}

.sales-info-group .txt-group.color3 .price,
.sales-info-group .txt-group.color3 .txt-02,
.title-group.prd-ttl .title-field-page .title-s.color3 {
    color: var(--color-bu900, #003fc7)
}

.sales-info-group .txt-group.color4 .price,
.sales-info-group .txt-group.color4 .txt-02,
.title-group.prd-ttl .title-field-page .title-s.color4 {
    color: var(--color-bu900, #003fc7)
}

.sales-info-group .txt-group.color5 .price,
.sales-info-group .txt-group.color5.txt-02,
.title-group.prd-ttl .title-field-page .title-s.color5 {
    color: var(--txt-accent-sec)
}

.sub-title-group {
    margin-top: 1.6rem
}

.sub-title-group .title-s {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g700, #7d7d7d)
}

.sub-title-group .title-s.strong {
    color: var(--color-g900, #141414);
    font-weight: 700
}

.txt-s-group {
    margin-top: 1rem
}

.txt-s-group .txt-lv03 {
    font-size: 1.5rem;
    color: var(--color-w100, #fff);
    line-height: 2rem
}

.component-insu-infolist {
    padding: 3.2rem 2rem;
    background-color: var(--color-pn, #17008c)
}

.component-insu-infolist .title-group {
    margin-top: 3.2rem
}

.component-insu-infolist .title-group:first-child {
    margin-top: 0
}

.component-insu-infolist .bl-txt-group,
.component-insu-infolist .title-group+.txt-lv03 {
    padding: 1rem 0 0
}

.component-insu-infolist .byul-txt {
    margin: 1.2rem 0 .7rem;
    font-size: 1.4rem;
    line-height: 2.1rem
}

.component-insu-infolist .bl-txt-group>.txt,
.component-insu-infolist .dash-txt-group .txt {
    font-size: 1.4rem;
    line-height: 2.1rem
}

.component-insu-infolist * {
    color: var(--color-w100, #fff) !important
}

.list-linebox-group.insu-acco .list-item {
    border-bottom: 0
}

.ico-microphone {
    width: 6.4rem;
    height: 6.4rem;
    background: url(/resource/img/mmk/common/ico_prd_microphone.png) 0 0 no-repeat;
    background-size: 100%
}

.txt-lv01.pop-micro {
    margin-top: 1.6rem;
    color: var(--color-g700, #7d7d7d)
}

.prd-detail-wrap.icon-slide-prd {
    background: var(--color-pn, #17008c) !important
}

.prd-detail-wrap.icon-slide-prd.type2 {
    background: var(--color-w100, #fff) !important
}

.prd-detail-wrap.icon-slide-prd.type2 .component-icon-slide-prd {
    padding: 6rem 2rem
}

.prd-detail-wrap.icon-slide-prd.type3 {
    background: var(--color-w100, #fff) !important
}

.prd-detail-wrap.icon-slide-prd.type3 .component-icon-slide-prd {
    padding: 6.4rem 2rem 4.8rem
}

.prd-detail-wrap.icon-slide-prd.type4 {
    background: var(--color-qua) !important
}

.prd-detail-wrap.icon-slide-prd.type4 .component-icon-slide-prd {
    padding: 2rem 2rem 4.8rem
}

.prd-detail-wrap.icon-slide-prd.type5 {
    margin: 4rem 0 2.4rem;
    background: var(--color-w100, #fff) !important
}

.prd-detail-wrap.icon-slide-prd.type5 .component-icon-slide-prd {
    padding: 0
}

.prd-detail-wrap.icon-slide-prd.type5 .bridgeCashback-list-wrapper {
    height: 4.8rem;
    margin: 0
}

.prd-detail-wrap.icon-slide-prd.type5 .bridgeCashback-list-wrapper::before,
.prd-detail-wrap.icon-slide-prd.type5 .bridgeCashback-list-wrapper:after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    width: 3.6rem;
    height: 4.8rem;
    z-index: 1
}

.prd-detail-wrap.icon-slide-prd.type5 .bridgeCashback-list-wrapper:before {
    left: 0;
    background: -webkit-gradient(linear, left top, right top, color-stop(30%, var(--color-w100, #fff)), to(rgba(255, 255, 255, 0)));
    background: -o-linear-gradient(left, var(--color-w100, #fff) 30%, rgba(255, 255, 255, 0) 100%);
    background: linear-gradient(90deg, var(--color-w100, #fff) 30%, rgba(255, 255, 255, 0) 100%)
}

.prd-detail-wrap.icon-slide-prd.type5 .bridgeCashback-list-wrapper:after {
    right: 0;
    background: -webkit-gradient(linear, right top, left top, color-stop(30%, var(--color-w100, #fff)), to(rgba(255, 255, 255, 0)));
    background: -o-linear-gradient(right, var(--color-w100, #fff) 30%, rgba(255, 255, 255, 0) 100%);
    background: linear-gradient(270deg, var(--color-w100, #fff) 30%, rgba(255, 255, 255, 0) 100%)
}

.prd-detail-wrap.icon-slide-prd.type5 .bridgeCashback-list-wrapper .logo-slide-box {
    padding-bottom: 0;
    position: relative;
    z-index: 0
}

.prd-detail-wrap.icon-slide-prd.type5 .logo-img-box.type1 img {
    margin: 0 1rem
}

.prd-detail-wrap.icon-slide-prd.type6 {
    background: var(--color-w100, #fff) !important
}

.prd-detail-wrap.icon-slide-prd.type6 .component-icon-slide-prd {
    padding: 4rem 2rem 3.2rem
}

.prd-detail-wrap.icon-slide-prd.type6 .bridgeCashback-list-wrapper .logo-slide-box {
    padding-bottom: 0
}

.component-icon-slide-prd {
    position: relative;
    padding-bottom: 8.8rem;
    z-index: 1
}

.bridgeCashback-list-wrapper {
    position: relative;
    overflow: hidden;
    margin: 0 -2rem
}

.bridgeCashback-list-wrapper .logo-slide-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding-bottom: 1.6rem
}

.bridgeCashback-list-wrapper .logo-slide-box::-webkit-scrollbar {
    display: none
}

.bridgeCashback-list-wrapper .logo-slide-box:nth-child(2) {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse
}

.bridgeCashback-list-wrapper .logo-slide-box .logo-img-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: relative
}

.bridgeCashback-list-wrapper .logo-slide-box .logo-img-box img {
    display: inline-block;
    width: 72px;
    height: 72px;
    margin: 0 5px
}

.prd-detail-wrap.icon-slide-prd.type7 {
    margin: 4rem 0 2.4rem;
    background: var(--color-w100, #fff) !important
}

.prd-detail-wrap.icon-slide-prd.type7 .component-icon-slide-prd {
    padding: 0
}

.prd-detail-wrap.icon-slide-prd.type7 .bridgeCashback-list-wrapper {
    height: 8rem;
    margin: 0
}

.prd-detail-wrap.icon-slide-prd.type7.bg-trans {
    background: transparent !important
}

.prd-detail-wrap.icon-slide-prd.type7 .logo-img-box.type2 {
    height: 8rem
}

.prd-detail-wrap.icon-slide-prd.type7 .logo-img-box.type2 img {
    width: 8rem;
    height: 8rem;
    border-radius: 50%;
    margin-left: 2.4rem
}

.prd-detail-wrap.icon-slide-prd.type7 .bridgeCashback-list-wrapper {
    height: 8rem
}

.prd-detail-wrap.icon-slide-prd.type7 .bridgeCashback-list-wrapper::after,
.prd-detail-wrap.icon-slide-prd.type7 .bridgeCashback-list-wrapper::before {
    display: none
}

.bridgeCashback-list-wrapper .logo-slide-box .logo-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 0 .8rem;
    padding: 1.6rem 2rem;
    width: 28rem;
    height: 9.2rem;
    border-radius: 2rem;
    font-size: 1.8rem;
    font-weight: 500;
    line-height: 2.5rem;
    text-align: left
}

.bridgeCashback-list-wrapper .logo-slide-box .logo-item {
    background-color: var(--bg-base);
    background-size: 6rem;
    background-repeat: no-repeat;
    background-position: calc(100% - 2rem) center
}

.bridgeCashback-list-wrapper .ico-item {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 4.8rem;
    margin: 0 1rem;
    padding: 0 1.2rem;
    background-color: var(--bg-qua, #f7f9fd);
    border-radius: 1.2rem;
    font-size: 1.6rem;
    color: var(--ico-ter, #8694b1);
    font-weight: 700;
    white-space: nowrap
}

.bridgeCashback-list-wrapper .logo-slide-box .logo-img-box.type1 img {
    width: 4.8rem;
    height: 4.8rem
}

.prd-detail-wrap.ani-txt-group+.prd-detail-wrap.icon-slide-prd .component-icon-slide-prd {
    padding: 0 2.0rem 5.6rem
}

.prd-detail-wrap.icon-slide-prd+.prd-detail-wrap.ani-txt-group {
    border-top: 1px solid #463c89
}

.prd-detail-wrap.icon-slide-prd+.prd-detail-wrap.ani-txt-group .component-prd-txt-group {
    margin-top: 0
}

.insu-info-group {
    padding: 4.6rem 0 6rem
}

.insu-info-group+.insu-info-group {
    padding-top: 0
}

.insu-info-group .insu-main-txt {
    font-size: 3.1rem;
    font-weight: 700
}

.insu-info-group .insu-sub-txt {
    margin-top: 1.2rem;
    color: var(--color-g800, #414141);
    line-height: 2.2rem
}

.insu-info-group .insu-sub-txt02 {
    margin-top: 1.2rem;
    font-size: 1.2rem;
    line-height: 1.6rem;
    font-weight: 400;
    color: var(--color-g700, #7d7d7d)
}

.insu-info-group .insu-img {
    margin: 6rem 0 6.8rem;
    text-align: center
}

.insu-info-group .insu-img img {
    width: 100%;
    max-width: 24.7rem
}

.insu-info-group .insu-img .img-txt .txt-01 {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400
}

.insu-info-group .insu-img .img-txt .txt-02 {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--color-g500, #b8b8b8)
}

.insu-info-group .insu-img .img-txt .txt-03 {
    font-size: 1.2rem;
    line-height: 1.6rem;
    font-weight: 400;
    color: var(--color-g500, #b8b8b8)
}

.insu-info-group+.insu-infotxt-group {
    font-size: 1.2rem;
    line-height: 1.6rem;
    font-weight: 400;
    padding-bottom: 2.4rem
}

.prd-detail-wrap.img-wrap {
    width: 100%
}

.prd-detail-wrap.img-wrap img {
    width: 100%
}

.prd-detail-wrap.img-wrap2 {
    width: 100%;
    height: 23.6rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.prd-detail-wrap.img-wrap2 img {
    width: auto
}

.type_cardQR .pc_show.component-btn.fixed-bottom.prd {
    display: none !important
}

.type_cardQR .mob_show.component-btn.fixed-bottom.prd,
.type_cardQR .mobmweb_show.component-btn.fixed-bottom.prd {
    display: none !important
}

.component-prd-card.type-flip {
    margin: 0;
    text-align: center
}

.component-prd-card.type-flip .section-link {
    display: block;
    width: 100%
}

.component-prd-card.type-flip .card-bnr {
    padding: 6.4rem 0 4.8rem
}

.component-prd-card.type-flip .card-bnr .flip {
    width: 100%;
    height: 24.4rem;
    position: relative;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-perspective-origin: 50% 50%;
    perspective-origin: 50% 50%;
    -webkit-transition: ease-in-out .4s;
    -o-transition: ease-in-out .4s;
    transition: ease-in-out .4s;
    margin: 0 auto
}

.component-prd-card.type-flip .card-bnr .flip .back,
.component-prd-card.type-flip .card-bnr .flip .front {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

.component-prd-card.type-flip .card-bnr .flip .back {
    -webkit-transform: rotateY(180deg);
    transform: rotateY(180deg)
}

.component-prd-card.type-flip .swiper-slide.horizontal .card-bnr .flip {
    height: 16.4rem
}

.component-prd-card.type-flip .swiper-slide.horizontal img {
    width: 24.5rem
}

.component-prd-card.type-flip .swiper-slide-active .card-bnr .flip {
    -webkit-animation: cardFlip 2s ease-out .3s 1 forwards;
    animation: cardFlip 2s ease-out .3s 1 forwards
}

.component-prd-card.type-flip .ui-swiper {
    position: relative
}

.component-prd-card.type-flip .swiper-button-prev {
    width: 4.8rem;
    height: 4.8rem;
    left: -.8rem;
    background-color: var(--color-g100, #f8f8f8);
    border-radius: 50%
}

.component-prd-card.type-flip .swiper-button-next {
    width: 4.8rem;
    height: 4.8rem;
    right: -.8rem;
    background-color: var(--color-g100, #f8f8f8);
    border-radius: 50%
}

.component-prd-card.type-flip .swiper-button-prev:after {
    content: '';
    display: block;
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-chevron-left);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain
}

.component-prd-card.type-flip .swiper-button-next:after {
    content: '';
    display: block;
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-line-chevron-right);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain
}

.component-prd-card.type-flip .swiper-button-next.swiper-button-disabled,
.component-prd-card.type-flip .swiper-button-prev.swiper-button-disabled {
    display: none
}

@-webkit-keyframes cardFlip {
    0% {
        -webkit-transform: rotate3d(0.1, 1, 0.1, 0deg);
        transform: rotate3d(0.1, 1, 0.1, 0deg)
    }
    50% {
        -webkit-transform: rotate3d(0.25, 1, 0.1, 180deg);
        transform: rotate3d(0.25, 1, 0.1, 180deg)
    }
    100% {
        -webkit-transform: rotate3d(0.25, 1, 0.1, 359.9deg);
        transform: rotate3d(0.25, 1, 0.1, 359.9deg)
    }
}

@keyframes cardFlip {
    0% {
        -webkit-transform: rotate3d(0.1, 1, 0.1, 0deg);
        transform: rotate3d(0.1, 1, 0.1, 0deg)
    }
    50% {
        -webkit-transform: rotate3d(0.25, 1, 0.1, 180deg);
        transform: rotate3d(0.25, 1, 0.1, 180deg)
    }
    100% {
        -webkit-transform: rotate3d(0.25, 1, 0.1, 359.9deg);
        transform: rotate3d(0.25, 1, 0.1, 359.9deg)
    }
}

.component-prd-card.type-flip2 {
    position: relative;
    margin-top: 6.4rem
}

.component-prd-card.type-flip2 .swiper-container {
    padding: 1.2rem 0
}

.component-prd-card.type-flip2 .swiper-slide {
    width: 17.8rem;
    height: auto
}

.component-prd-card.type-flip2 .swiper-slide .section-link {
    display: block;
    position: relative;
    text-align: center;
    width: 17.8rem;
    height: 31rem;
    padding: 0;
    margin: 0 auto
}

.component-prd-card.type-flip2 .swiper-slide img {
    width: 18rem
}

.component-prd-card.type-flip2 .swiper-slide .section-link .flip {
    position: relative;
    width: 100%;
    height: 100%;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-perspective-origin: 50% 50%;
    perspective-origin: 50% 50%
}

.component-prd-card.type-flip2 .swiper-slide .section-link .flip .back,
.component-prd-card.type-flip2 .swiper-slide .section-link .flip .front {
    position: absolute;
    top: 0;
    left: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
    height: 100%;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden
}

.component-prd-card.type-flip2 .swiper-slide .section-link .flip .back {
    -webkit-transform: rotateY(-180deg);
    transform: rotateY(-180deg)
}

.component-prd-card.type-flip2 .swiper-slide-active .flip {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1)
}

.component-prd-card.type-flip2:not(.swiper-slide-active) .flip {
    -webkit-transform: scale(0.78);
    -ms-transform: scale(0.78);
    transform: scale(0.78)
}

.component-prd-card.type-flip2 .swiper-slide-active .flip {
    -webkit-animation: flipclockwise 1.5s ease-in-out forwards;
    animation: flipclockwise 1.5s ease-in-out forwards
}

@-webkit-keyframes flipclockwise {
    0% {
        -webkit-transform: rotateY(0);
        transform: rotateY(0)
    }
    50% {
        -webkit-transform: rotateY(-180deg);
        transform: rotateY(-180deg)
    }
    100% {
        -webkit-transform: rotateY(-360deg);
        transform: rotateY(-360deg)
    }
}

@keyframes flipclockwise {
    0% {
        -webkit-transform: rotateY(0);
        transform: rotateY(0)
    }
    50% {
        -webkit-transform: rotateY(-180deg);
        transform: rotateY(-180deg)
    }
    100% {
        -webkit-transform: rotateY(-360deg);
        transform: rotateY(-360deg)
    }
}

.component-prd-cs-box dl dt {
    padding-bottom: 0.8rem
}

.component-prd-cs-box dl dd {
    padding: 2.4rem 0 2rem;
    border-bottom: 1px solid var(--color-g200, #eee)
}

.component-prd-cs-box dl.txt-review-list dd:before {
    content: '';
    display: block;
    margin: 0 0 1.2rem;
    width: 3rem;
    height: 2.5rem;
    background: url(/resource/img/mmk/common/ico_prod_quotation.png) 0 0 no-repeat;
    background-size: 100%
}

.component-prd-cs-box.gray {
    padding: 4.8rem 2rem;
    background: var(--color-g100, #f8f8f8)
}

.component-prd-cs-box.gray dl dt {
    padding-bottom: 0
}

.component-prd-cs-box.gray dl dd {
    padding: 2.4rem 0 1.6rem;
    border-bottom: none
}

.txt-review-list {
    margin: 4.8rem 0
}

.txt-review-title {
    font-size: 2.8rem;
    color: var(--color-g900, #141414);
    font-weight: bold;
    margin-top: .8rem
}

.txt-review-sub {
    font-size: 1.8rem;
    line-height: 2.1rem
}

.txt-review-sub2 {
    font-size: 1.4rem;
    color: #9b9b9b;
    margin-top: .4rem
}

.component-list.partners .title-group {
    padding-bottom: 1.2rem
}

.component-list.partners .title-group+.title-group {
    padding-top: 2rem
}

.component-list.partners+.component-list.partners {
    padding-top: 4.8rem
}

.bridgeCashback-list-wrapper .logo-slide-box .logo-img-box i[class^="logo-"] {
    margin: 0 5px
}

.myCheckCard-wrap {
    padding: 24px 24px 0
}

.myCheckCard-tit .tit {
    font-size: 28px;
    color: var(--color-g900, #141414);
    font-weight: 700
}

.myCheckCard-tit .desc {
    margin-top: 10px;
    font-size: 14px;
    color: var(--color-g700, #7d7d7d)
}

.bridgeMyCheckCard-item {
    margin-top: 54px;
    text-align: center
}

.bridgeMyCheckCard-item .tit {
    font-size: 21px;
    color: var(--color-g900, #141414);
    font-weight: 700
}

.bridgeMyCheckCard-item .txt-emph {
    display: inline-block;
    text-decoration: none;
    -webkit-box-shadow: 0 -12px 0 0 rgba(0, 80, 255, 0.2) inset;
    box-shadow: 0 -12px 0 0 rgba(0, 80, 255, 0.2) inset
}

.bridgeMyCheckCard-item .bridgeMyCheckCard-head.type2 .tit {
    font-size: 18px;
    font-weight: bold
}

.cardUsage-actions {
    margin-top: 44px;
    text-align: center
}

.cardUsage-actions .btn-cardUsage {
    font-size: 14px;
    line-height: 18px
}

.cardUsage-actions .btn-cardUsage:after {
    content: '';
    display: inline-block;
    width: 7px;
    height: 7px;
    margin-left: 5px;
    margin-top: -4px;
    vertical-align: middle;
    border-right: 1px solid var(--color-g900, #141414);
    border-bottom: 1px solid var(--color-g900, #141414);
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg)
}

.myCheckCard-intro {
    margin: 48px -24px 0;
    text-align: center
}

.myCheckCard-intro .objCard-wrap {
    overflow: hidden;
    position: relative;
    max-width: 375px;
    height: 226px;
    margin: 0 auto;
    background: url("/resource/img/mmk/common/card/bg_chkcard_intro.png") no-repeat center top;
    background-size: 375px auto
}

.myCheckCard-intro .obj-card {
    position: absolute;
    left: 50%;
    margin-left: -54px;
    display: block;
    width: 107px;
    height: 170px;
    background: url("/resource/img/mmk/common/card/img_chkcard_01.png") no-repeat left top;
    background-size: contain
}

.myCheckCard-intro .obj-card.n1 {
    z-index: 3;
    top: 50px;
    background-image: url("/resource/img/mmk/common/card/img_chkcard_01.png")
}

.myCheckCard-intro .obj-card.n2 {
    z-index: 2;
    top: 31px;
    -webkit-transform: scale(0.9, 0.9);
    -ms-transform: scale(0.9, 0.9);
    transform: scale(0.9, 0.9);
    background-image: url("/resource/img/mmk/common/card/img_chkcard_02.png")
}

.myCheckCard-intro .obj-card.n3 {
    z-index: 1;
    top: 14px;
    -webkit-transform: scale(0.8, 0.8);
    -ms-transform: scale(0.8, 0.8);
    transform: scale(0.8, 0.8);
    opacity: .2;
    background-image: url("/resource/img/mmk/common/card/img_chkcard_03.png")
}

.start .myCheckCard-intro .obj-card.n1 {
    -webkit-animation: bridgeCard1 3s infinite ease-in-out;
    animation: bridgeCard1 3s infinite ease-in-out
}

.start .myCheckCard-intro .obj-card.n2 {
    -webkit-animation: bridgeCard2 3s infinite ease-in-out;
    animation: bridgeCard2 3s infinite ease-in-out
}

.start .myCheckCard-intro .obj-card.n3 {
    -webkit-animation: bridgeCard3 3s infinite ease-in-out;
    animation: bridgeCard3 3s infinite ease-in-out
}

.usageMyCheckCard-item.start .myCheckCard-intro .obj-card.n1 {
    background-image: url("/resource/img/mmk/common/card/img_chkcard_02.png")
}

.usageMyCheckCard-item.start .myCheckCard-intro .obj-card.n2 {
    background-image: url("/resource/img/mmk/common/card/img_chkcard_01.png")
}

@-webkit-keyframes bridgeCard1 {
    0% {
        top: 50px
    }
    25% {
        top: 50px
    }
    40% {
        top: 100%
    }
    82% {
        top: 100%
    }
    95% {
        top: 50px
    }
}

@keyframes bridgeCard1 {
    0% {
        top: 50px
    }
    25% {
        top: 50px
    }
    40% {
        top: 100%
    }
    82% {
        top: 100%
    }
    95% {
        top: 50px
    }
}

@-webkit-keyframes bridgeCard2 {
    0% {
        top: 31px
    }
    25% {
        top: 31px;
        -webkit-transform: scale(0.9, 0.9);
        transform: scale(0.9, 0.9)
    }
    50% {
        top: 100%;
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1)
    }
    82% {
        top: 100%;
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1)
    }
    92% {
        top: 31px;
        -webkit-transform: scale(0.9, 0.9);
        transform: scale(0.9, 0.9)
    }
}

@keyframes bridgeCard2 {
    0% {
        top: 31px
    }
    25% {
        top: 31px;
        -webkit-transform: scale(0.9, 0.9);
        transform: scale(0.9, 0.9)
    }
    50% {
        top: 100%;
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1)
    }
    82% {
        top: 100%;
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1)
    }
    92% {
        top: 31px;
        -webkit-transform: scale(0.9, 0.9);
        transform: scale(0.9, 0.9)
    }
}

@-webkit-keyframes bridgeCard3 {
    0% {
        top: 14px;
        -webkit-transform: scale(0.8, 0.8);
        transform: scale(0.8, 0.8);
        opacity: .2
    }
    30% {
        top: 14px;
        -webkit-transform: scale(0.8, 0.8);
        transform: scale(0.8, 0.8);
        opacity: .2
    }
    50% {
        top: 50px;
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1);
        opacity: 1
    }
    82% {
        top: 50px;
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1);
        opacity: 1
    }
    95% {
        top: 14px;
        -webkit-transform: scale(0.8, 0.8);
        transform: scale(0.8, 0.8);
        opacity: .2
    }
}

@keyframes bridgeCard3 {
    0% {
        top: 14px;
        -webkit-transform: scale(0.8, 0.8);
        transform: scale(0.8, 0.8);
        opacity: .2
    }
    30% {
        top: 14px;
        -webkit-transform: scale(0.8, 0.8);
        transform: scale(0.8, 0.8);
        opacity: .2
    }
    50% {
        top: 50px;
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1);
        opacity: 1
    }
    82% {
        top: 50px;
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1);
        opacity: 1
    }
    95% {
        top: 14px;
        -webkit-transform: scale(0.8, 0.8);
        transform: scale(0.8, 0.8);
        opacity: .2
    }
}

.usageMyCheckCard-item {
    margin-top: 64px
}

.usageMyCheckCard-item+.usageMyCheckCard-item {
    margin-top: 88px
}

.usageMyCheckCard-item .tit {
    font-size: 21px;
    color: var(--color-g900, #141414);
    font-weight: 700
}

.usageMyCheckCard-item .desc {
    margin-top: 6px;
    font-size: 15px;
    color: var(--color-g700, #7d7d7d)
}

.usageMyCheckCard-item .desc+.desc {
    margin-top: 6px
}

.usageMyCheckCard-item .txt-caption {
    font-size: 15px;
    color: var(--color-g700, #7d7d7d)
}

.usageMyCheckCard-item.n2 .txt-caption {
    margin-top: 32px;
    letter-spacing: -.2px
}

.usageMyCheckCard-item.n2 .txt-caption+.txt-caption {
    margin-top: 6px
}

.usageMyCheckCard-pay {
    position: relative;
    width: 150px;
    height: 150px;
    margin: 48px auto 0;
    background: url("../../img/mmk/common/card/bg_chkcard_pay.png") no-repeat center top;
    background-size: 150px auto
}

.usageMyCheckCard-pay .obj-pay {
    position: absolute;
    left: 50%;
    top: 50%;
    margin: -25px;
    display: block;
    width: 50px;
    height: 50px;
    background-position: left top;
    background-repeat: no-repeat;
    background-size: contain
}

.usageMyCheckCard-pay .obj-pay.n1 {
    -webkit-transform: rotate(-135deg) translate(60px) rotate(135deg);
    -ms-transform: rotate(-135deg) translate(60px) rotate(135deg);
    transform: rotate(-135deg) translate(60px) rotate(135deg);
    background-image: url("../../img/mmk/common/card/img_chkcard_paybook.png")
}

.usageMyCheckCard-pay .obj-pay.n2 {
    -webkit-transform: rotate(-45deg) translate(60px) rotate(45deg);
    -ms-transform: rotate(-45deg) translate(60px) rotate(45deg);
    transform: rotate(-45deg) translate(60px) rotate(45deg);
    background-image: url("../../img/mmk/common/card/img_chkcard_sp.png")
}

.usageMyCheckCard-pay .obj-pay.n3 {
    -webkit-transform: rotate(-225deg) translate(60px) rotate(225deg);
    -ms-transform: rotate(-225deg) translate(60px) rotate(225deg);
    transform: rotate(-225deg) translate(60px) rotate(225deg);
    background-image: url("../../img/mmk/common/card/img_chkcard_toss.png")
}

.usageMyCheckCard-pay .obj-pay.n4 {
    -webkit-transform: rotate(45deg) translate(60px) rotate(-45deg);
    -ms-transform: rotate(45deg) translate(60px) rotate(-45deg);
    transform: rotate(45deg) translate(60px) rotate(-45deg);
    background-image: url("../../img/mmk/common/card/img_chkcard_kp.png")
}

.start .usageMyCheckCard-pay .obj-pay.n1 {
    -webkit-animation: cardPay1 5s infinite linear;
    animation: cardPay1 5s infinite linear
}

.start .usageMyCheckCard-pay .obj-pay.n2 {
    -webkit-animation: cardPay2 5s infinite linear;
    animation: cardPay2 5s infinite linear
}

.start .usageMyCheckCard-pay .obj-pay.n3 {
    -webkit-animation: cardPay3 5s infinite linear;
    animation: cardPay3 5s infinite linear
}

.start .usageMyCheckCard-pay .obj-pay.n4 {
    -webkit-animation: cardPay4 5s infinite linear;
    animation: cardPay4 5s infinite linear
}

.ios .usageMyCheckCard-pay .obj-pay.n1 {
    -webkit-transform: rotate(-90deg) translate(60px) rotate(90deg);
    -ms-transform: rotate(-90deg) translate(60px) rotate(90deg);
    transform: rotate(-90deg) translate(60px) rotate(90deg)
}

.ios .usageMyCheckCard-pay .obj-pay.n2 {
    display: none
}

.ios .usageMyCheckCard-pay .obj-pay.n3 {
    -webkit-transform: rotate(-215deg) translate(60px) rotate(215deg);
    -ms-transform: rotate(-215deg) translate(60px) rotate(215deg);
    transform: rotate(-215deg) translate(60px) rotate(215deg)
}

.ios .usageMyCheckCard-pay .obj-pay.n4 {
    -webkit-transform: rotate(35deg) translate(60px) rotate(-35deg);
    -ms-transform: rotate(35deg) translate(60px) rotate(-35deg);
    transform: rotate(35deg) translate(60px) rotate(-35deg)
}

.ios .start .usageMyCheckCard-pay .obj-pay.n1 {
    -webkit-animation-name: cardPayiOS1;
    animation-name: cardPayiOS1;
    -webkit-animation-duration: 4s;
    animation-duration: 4s
}

.ios .start .usageMyCheckCard-pay .obj-pay.n3 {
    -webkit-animation-name: cardPayiOS3;
    animation-name: cardPayiOS3;
    -webkit-animation-duration: 4s;
    animation-duration: 4s
}

.ios .start .usageMyCheckCard-pay .obj-pay.n4 {
    -webkit-animation-name: cardPayiOS4;
    animation-name: cardPayiOS4;
    -webkit-animation-duration: 4s;
    animation-duration: 4s
}

@-webkit-keyframes cardPayiOS1 {
    0% {
        -webkit-transform: rotate(-90deg) translate(60px) rotate(90deg);
        transform: rotate(-90deg) translate(60px) rotate(90deg)
    }
    30% {
        -webkit-transform: rotate(-90deg) translate(60px) rotate(90deg);
        transform: rotate(-90deg) translate(60px) rotate(90deg)
    }
    50% {
        -webkit-transform: rotate(35deg) translate(60px) rotate(-35deg);
        transform: rotate(35deg) translate(60px) rotate(-35deg)
    }
    60% {
        -webkit-transform: rotate(35deg) translate(60px) rotate(-35deg);
        transform: rotate(35deg) translate(60px) rotate(-35deg)
    }
    75% {
        -webkit-transform: rotate(145deg) translate(60px) rotate(-145deg);
        transform: rotate(145deg) translate(60px) rotate(-145deg)
    }
    85% {
        -webkit-transform: rotate(145deg) translate(60px) rotate(-145deg);
        transform: rotate(145deg) translate(60px) rotate(-145deg)
    }
    100% {
        -webkit-transform: rotate(270deg) translate(60px) rotate(-270deg);
        transform: rotate(270deg) translate(60px) rotate(-270deg)
    }
}

@keyframes cardPayiOS1 {
    0% {
        -webkit-transform: rotate(-90deg) translate(60px) rotate(90deg);
        transform: rotate(-90deg) translate(60px) rotate(90deg)
    }
    30% {
        -webkit-transform: rotate(-90deg) translate(60px) rotate(90deg);
        transform: rotate(-90deg) translate(60px) rotate(90deg)
    }
    50% {
        -webkit-transform: rotate(35deg) translate(60px) rotate(-35deg);
        transform: rotate(35deg) translate(60px) rotate(-35deg)
    }
    60% {
        -webkit-transform: rotate(35deg) translate(60px) rotate(-35deg);
        transform: rotate(35deg) translate(60px) rotate(-35deg)
    }
    75% {
        -webkit-transform: rotate(145deg) translate(60px) rotate(-145deg);
        transform: rotate(145deg) translate(60px) rotate(-145deg)
    }
    85% {
        -webkit-transform: rotate(145deg) translate(60px) rotate(-145deg);
        transform: rotate(145deg) translate(60px) rotate(-145deg)
    }
    100% {
        -webkit-transform: rotate(270deg) translate(60px) rotate(-270deg);
        transform: rotate(270deg) translate(60px) rotate(-270deg)
    }
}

@-webkit-keyframes cardPayiOS3 {
    0% {
        -webkit-transform: rotate(-215deg) translate(60px) rotate(215deg);
        transform: rotate(-215deg) translate(60px) rotate(215deg)
    }
    30% {
        -webkit-transform: rotate(-215deg) translate(60px) rotate(215deg);
        transform: rotate(-215deg) translate(60px) rotate(215deg)
    }
    50% {
        -webkit-transform: rotate(-90deg) translate(60px) rotate(90deg);
        transform: rotate(-90deg) translate(60px) rotate(90deg)
    }
    60% {
        -webkit-transform: rotate(-90deg) translate(60px) rotate(90deg);
        transform: rotate(-90deg) translate(60px) rotate(90deg)
    }
    75% {
        -webkit-transform: rotate(35deg) translate(60px) rotate(-35deg);
        transform: rotate(35deg) translate(60px) rotate(-35deg)
    }
    85% {
        -webkit-transform: rotate(35deg) translate(60px) rotate(-35deg);
        transform: rotate(35deg) translate(60px) rotate(-35deg)
    }
    100% {
        -webkit-transform: rotate(145deg) translate(60px) rotate(-145deg);
        transform: rotate(145deg) translate(60px) rotate(-145deg)
    }
}

@keyframes cardPayiOS3 {
    0% {
        -webkit-transform: rotate(-215deg) translate(60px) rotate(215deg);
        transform: rotate(-215deg) translate(60px) rotate(215deg)
    }
    30% {
        -webkit-transform: rotate(-215deg) translate(60px) rotate(215deg);
        transform: rotate(-215deg) translate(60px) rotate(215deg)
    }
    50% {
        -webkit-transform: rotate(-90deg) translate(60px) rotate(90deg);
        transform: rotate(-90deg) translate(60px) rotate(90deg)
    }
    60% {
        -webkit-transform: rotate(-90deg) translate(60px) rotate(90deg);
        transform: rotate(-90deg) translate(60px) rotate(90deg)
    }
    75% {
        -webkit-transform: rotate(35deg) translate(60px) rotate(-35deg);
        transform: rotate(35deg) translate(60px) rotate(-35deg)
    }
    85% {
        -webkit-transform: rotate(35deg) translate(60px) rotate(-35deg);
        transform: rotate(35deg) translate(60px) rotate(-35deg)
    }
    100% {
        -webkit-transform: rotate(145deg) translate(60px) rotate(-145deg);
        transform: rotate(145deg) translate(60px) rotate(-145deg)
    }
}

@-webkit-keyframes cardPayiOS4 {
    0% {
        -webkit-transform: rotate(35deg) translate(60px) rotate(-35deg);
        transform: rotate(35deg) translate(60px) rotate(-35deg)
    }
    30% {
        -webkit-transform: rotate(35deg) translate(60px) rotate(-35deg);
        transform: rotate(35deg) translate(60px) rotate(-35deg)
    }
    50% {
        -webkit-transform: rotate(145deg) translate(60px) rotate(-145deg);
        transform: rotate(145deg) translate(60px) rotate(-145deg)
    }
    60% {
        -webkit-transform: rotate(145deg) translate(60px) rotate(-145deg);
        transform: rotate(145deg) translate(60px) rotate(-145deg)
    }
    75% {
        -webkit-transform: rotate(260deg) translate(60px) rotate(-260deg);
        transform: rotate(260deg) translate(60px) rotate(-260deg)
    }
    85% {
        -webkit-transform: rotate(260deg) translate(60px) rotate(-260deg);
        transform: rotate(260deg) translate(60px) rotate(-260deg)
    }
    100% {
        -webkit-transform: rotate(395deg) translate(60px) rotate(-395deg);
        transform: rotate(395deg) translate(60px) rotate(-395deg)
    }
}

@keyframes cardPayiOS4 {
    0% {
        -webkit-transform: rotate(35deg) translate(60px) rotate(-35deg);
        transform: rotate(35deg) translate(60px) rotate(-35deg)
    }
    30% {
        -webkit-transform: rotate(35deg) translate(60px) rotate(-35deg);
        transform: rotate(35deg) translate(60px) rotate(-35deg)
    }
    50% {
        -webkit-transform: rotate(145deg) translate(60px) rotate(-145deg);
        transform: rotate(145deg) translate(60px) rotate(-145deg)
    }
    60% {
        -webkit-transform: rotate(145deg) translate(60px) rotate(-145deg);
        transform: rotate(145deg) translate(60px) rotate(-145deg)
    }
    75% {
        -webkit-transform: rotate(260deg) translate(60px) rotate(-260deg);
        transform: rotate(260deg) translate(60px) rotate(-260deg)
    }
    85% {
        -webkit-transform: rotate(260deg) translate(60px) rotate(-260deg);
        transform: rotate(260deg) translate(60px) rotate(-260deg)
    }
    100% {
        -webkit-transform: rotate(395deg) translate(60px) rotate(-395deg);
        transform: rotate(395deg) translate(60px) rotate(-395deg)
    }
}

@-webkit-keyframes cardPay1 {
    0% {
        -webkit-transformtransform: rotate(-135deg) translate(60px) rotate(135deg);
        -webkit-transform: rotate(-135deg) translate(60px) rotate(135deg);
        transform: rotate(-135deg) translate(60px) rotate(135deg)
    }
    30% {
        -webkit-transformtransform: rotate(-135deg) translate(60px) rotate(135deg);
        -webkit-transform: rotate(-135deg) translate(60px) rotate(135deg);
        transform: rotate(-135deg) translate(60px) rotate(135deg)
    }
    40% {
        -webkit-transformtransform: rotate(-45deg) translate(60px) rotate(45deg);
        -webkit-transform: rotate(-45deg) translate(60px) rotate(45deg);
        transform: rotate(-45deg) translate(60px) rotate(45deg)
    }
    50% {
        -webkit-transformtransform: rotate(-45deg) translate(60px) rotate(45deg);
        -webkit-transform: rotate(-45deg) translate(60px) rotate(45deg);
        transform: rotate(-45deg) translate(60px) rotate(45deg)
    }
    60% {
        -webkit-transformtransform: rotate(45deg) translate(60px) rotate(-45deg);
        -webkit-transform: rotate(45deg) translate(60px) rotate(-45deg);
        transform: rotate(45deg) translate(60px) rotate(-45deg)
    }
    70% {
        -webkit-transformtransform: rotate(45deg) translate(60px) rotate(-45deg);
        -webkit-transform: rotate(45deg) translate(60px) rotate(-45deg);
        transform: rotate(45deg) translate(60px) rotate(-45deg)
    }
    80% {
        -webkit-transformtransform: rotate(135deg) translate(60px) rotate(-135deg);
        -webkit-transform: rotate(135deg) translate(60px) rotate(-135deg);
        transform: rotate(135deg) translate(60px) rotate(-135deg)
    }
    90% {
        -webkit-transformtransform: rotate(135deg) translate(60px) rotate(-135deg);
        -webkit-transform: rotate(135deg) translate(60px) rotate(-135deg);
        transform: rotate(135deg) translate(60px) rotate(-135deg)
    }
    100% {
        -webkit-transformtransform: rotate(225deg) translate(60px) rotate(-225deg);
        -webkit-transform: rotate(225deg) translate(60px) rotate(-225deg);
        transform: rotate(225deg) translate(60px) rotate(-225deg)
    }
}

@keyframes cardPay1 {
    0% {
        -webkit-transformtransform: rotate(-135deg) translate(60px) rotate(135deg);
        -webkit-transform: rotate(-135deg) translate(60px) rotate(135deg);
        transform: rotate(-135deg) translate(60px) rotate(135deg)
    }
    30% {
        -webkit-transformtransform: rotate(-135deg) translate(60px) rotate(135deg);
        -webkit-transform: rotate(-135deg) translate(60px) rotate(135deg);
        transform: rotate(-135deg) translate(60px) rotate(135deg)
    }
    40% {
        -webkit-transformtransform: rotate(-45deg) translate(60px) rotate(45deg);
        -webkit-transform: rotate(-45deg) translate(60px) rotate(45deg);
        transform: rotate(-45deg) translate(60px) rotate(45deg)
    }
    50% {
        -webkit-transformtransform: rotate(-45deg) translate(60px) rotate(45deg);
        -webkit-transform: rotate(-45deg) translate(60px) rotate(45deg);
        transform: rotate(-45deg) translate(60px) rotate(45deg)
    }
    60% {
        -webkit-transformtransform: rotate(45deg) translate(60px) rotate(-45deg);
        -webkit-transform: rotate(45deg) translate(60px) rotate(-45deg);
        transform: rotate(45deg) translate(60px) rotate(-45deg)
    }
    70% {
        -webkit-transformtransform: rotate(45deg) translate(60px) rotate(-45deg);
        -webkit-transform: rotate(45deg) translate(60px) rotate(-45deg);
        transform: rotate(45deg) translate(60px) rotate(-45deg)
    }
    80% {
        -webkit-transformtransform: rotate(135deg) translate(60px) rotate(-135deg);
        -webkit-transform: rotate(135deg) translate(60px) rotate(-135deg);
        transform: rotate(135deg) translate(60px) rotate(-135deg)
    }
    90% {
        -webkit-transformtransform: rotate(135deg) translate(60px) rotate(-135deg);
        -webkit-transform: rotate(135deg) translate(60px) rotate(-135deg);
        transform: rotate(135deg) translate(60px) rotate(-135deg)
    }
    100% {
        -webkit-transformtransform: rotate(225deg) translate(60px) rotate(-225deg);
        -webkit-transform: rotate(225deg) translate(60px) rotate(-225deg);
        transform: rotate(225deg) translate(60px) rotate(-225deg)
    }
}

@-webkit-keyframes cardPay2 {
    0% {
        -webkit-transform: rotate(-45deg) translate(60px) rotate(45deg);
        transform: rotate(-45deg) translate(60px) rotate(45deg)
    }
    30% {
        -webkit-transform: rotate(-45deg) translate(60px) rotate(45deg);
        transform: rotate(-45deg) translate(60px) rotate(45deg)
    }
    40% {
        -webkit-transform: rotate(45deg) translate(60px) rotate(-45deg);
        transform: rotate(45deg) translate(60px) rotate(-45deg)
    }
    50% {
        -webkit-transform: rotate(45deg) translate(60px) rotate(-45deg);
        transform: rotate(45deg) translate(60px) rotate(-45deg)
    }
    60% {
        -webkit-transform: rotate(135deg) translate(60px) rotate(-135deg);
        transform: rotate(135deg) translate(60px) rotate(-135deg)
    }
    70% {
        -webkit-transform: rotate(135deg) translate(60px) rotate(-135deg);
        transform: rotate(135deg) translate(60px) rotate(-135deg)
    }
    80% {
        -webkit-transform: rotate(225deg) translate(60px) rotate(-225deg);
        transform: rotate(225deg) translate(60px) rotate(-225deg)
    }
    90% {
        -webkit-transform: rotate(225deg) translate(60px) rotate(-225deg);
        transform: rotate(225deg) translate(60px) rotate(-225deg)
    }
    100% {
        -webkit-transform: rotate(315deg) translate(60px) rotate(-315deg);
        transform: rotate(315deg) translate(60px) rotate(-315deg)
    }
}

@keyframes cardPay2 {
    0% {
        -webkit-transform: rotate(-45deg) translate(60px) rotate(45deg);
        transform: rotate(-45deg) translate(60px) rotate(45deg)
    }
    30% {
        -webkit-transform: rotate(-45deg) translate(60px) rotate(45deg);
        transform: rotate(-45deg) translate(60px) rotate(45deg)
    }
    40% {
        -webkit-transform: rotate(45deg) translate(60px) rotate(-45deg);
        transform: rotate(45deg) translate(60px) rotate(-45deg)
    }
    50% {
        -webkit-transform: rotate(45deg) translate(60px) rotate(-45deg);
        transform: rotate(45deg) translate(60px) rotate(-45deg)
    }
    60% {
        -webkit-transform: rotate(135deg) translate(60px) rotate(-135deg);
        transform: rotate(135deg) translate(60px) rotate(-135deg)
    }
    70% {
        -webkit-transform: rotate(135deg) translate(60px) rotate(-135deg);
        transform: rotate(135deg) translate(60px) rotate(-135deg)
    }
    80% {
        -webkit-transform: rotate(225deg) translate(60px) rotate(-225deg);
        transform: rotate(225deg) translate(60px) rotate(-225deg)
    }
    90% {
        -webkit-transform: rotate(225deg) translate(60px) rotate(-225deg);
        transform: rotate(225deg) translate(60px) rotate(-225deg)
    }
    100% {
        -webkit-transform: rotate(315deg) translate(60px) rotate(-315deg);
        transform: rotate(315deg) translate(60px) rotate(-315deg)
    }
}

@-webkit-keyframes cardPay3 {
    0% {
        -webkit-transform: rotate(-225deg) translate(60px) rotate(225deg);
        transform: rotate(-225deg) translate(60px) rotate(225deg)
    }
    30% {
        -webkit-transform: rotate(-225deg) translate(60px) rotate(225deg);
        transform: rotate(-225deg) translate(60px) rotate(225deg)
    }
    40% {
        -webkit-transform: rotate(-135deg) translate(60px) rotate(135deg);
        transform: rotate(-135deg) translate(60px) rotate(135deg)
    }
    50% {
        -webkit-transform: rotate(-135deg) translate(60px) rotate(135deg);
        transform: rotate(-135deg) translate(60px) rotate(135deg)
    }
    60% {
        -webkit-transform: rotate(-45deg) translate(60px) rotate(45deg);
        transform: rotate(-45deg) translate(60px) rotate(45deg)
    }
    70% {
        -webkit-transform: rotate(-45deg) translate(60px) rotate(45deg);
        transform: rotate(-45deg) translate(60px) rotate(45deg)
    }
    80% {
        -webkit-transform: rotate(45deg) translate(60px) rotate(-45deg);
        transform: rotate(45deg) translate(60px) rotate(-45deg)
    }
    90% {
        -webkit-transform: rotate(45deg) translate(60px) rotate(-45deg);
        transform: rotate(45deg) translate(60px) rotate(-45deg)
    }
    100% {
        -webkit-transform: rotate(135deg) translate(60px) rotate(-135deg);
        transform: rotate(135deg) translate(60px) rotate(-135deg)
    }
}

@keyframes cardPay3 {
    0% {
        -webkit-transform: rotate(-225deg) translate(60px) rotate(225deg);
        transform: rotate(-225deg) translate(60px) rotate(225deg)
    }
    30% {
        -webkit-transform: rotate(-225deg) translate(60px) rotate(225deg);
        transform: rotate(-225deg) translate(60px) rotate(225deg)
    }
    40% {
        -webkit-transform: rotate(-135deg) translate(60px) rotate(135deg);
        transform: rotate(-135deg) translate(60px) rotate(135deg)
    }
    50% {
        -webkit-transform: rotate(-135deg) translate(60px) rotate(135deg);
        transform: rotate(-135deg) translate(60px) rotate(135deg)
    }
    60% {
        -webkit-transform: rotate(-45deg) translate(60px) rotate(45deg);
        transform: rotate(-45deg) translate(60px) rotate(45deg)
    }
    70% {
        -webkit-transform: rotate(-45deg) translate(60px) rotate(45deg);
        transform: rotate(-45deg) translate(60px) rotate(45deg)
    }
    80% {
        -webkit-transform: rotate(45deg) translate(60px) rotate(-45deg);
        transform: rotate(45deg) translate(60px) rotate(-45deg)
    }
    90% {
        -webkit-transform: rotate(45deg) translate(60px) rotate(-45deg);
        transform: rotate(45deg) translate(60px) rotate(-45deg)
    }
    100% {
        -webkit-transform: rotate(135deg) translate(60px) rotate(-135deg);
        transform: rotate(135deg) translate(60px) rotate(-135deg)
    }
}

@-webkit-keyframes cardPay4 {
    0% {
        -webkit-transform: rotate(45deg) translate(60px) rotate(-45deg);
        transform: rotate(45deg) translate(60px) rotate(-45deg)
    }
    30% {
        -webkit-transform: rotate(45deg) translate(60px) rotate(-45deg);
        transform: rotate(45deg) translate(60px) rotate(-45deg)
    }
    40% {
        -webkit-transform: rotate(135deg) translate(60px) rotate(-135deg);
        transform: rotate(135deg) translate(60px) rotate(-135deg)
    }
    50% {
        -webkit-transform: rotate(135deg) translate(60px) rotate(-135deg);
        transform: rotate(135deg) translate(60px) rotate(-135deg)
    }
    60% {
        -webkit-transform: rotate(225deg) translate(60px) rotate(-225deg);
        transform: rotate(225deg) translate(60px) rotate(-225deg)
    }
    70% {
        -webkit-transform: rotate(225deg) translate(60px) rotate(-225deg);
        transform: rotate(225deg) translate(60px) rotate(-225deg)
    }
    80% {
        -webkit-transform: rotate(315deg) translate(60px) rotate(-315deg);
        transform: rotate(315deg) translate(60px) rotate(-315deg)
    }
    90% {
        -webkit-transform: rotate(315deg) translate(60px) rotate(-315deg);
        transform: rotate(315deg) translate(60px) rotate(-315deg)
    }
    100% {
        -webkit-transform: rotate(405deg) translate(60px) rotate(-405deg);
        transform: rotate(405deg) translate(60px) rotate(-405deg)
    }
}

@keyframes cardPay4 {
    0% {
        -webkit-transform: rotate(45deg) translate(60px) rotate(-45deg);
        transform: rotate(45deg) translate(60px) rotate(-45deg)
    }
    30% {
        -webkit-transform: rotate(45deg) translate(60px) rotate(-45deg);
        transform: rotate(45deg) translate(60px) rotate(-45deg)
    }
    40% {
        -webkit-transform: rotate(135deg) translate(60px) rotate(-135deg);
        transform: rotate(135deg) translate(60px) rotate(-135deg)
    }
    50% {
        -webkit-transform: rotate(135deg) translate(60px) rotate(-135deg);
        transform: rotate(135deg) translate(60px) rotate(-135deg)
    }
    60% {
        -webkit-transform: rotate(225deg) translate(60px) rotate(-225deg);
        transform: rotate(225deg) translate(60px) rotate(-225deg)
    }
    70% {
        -webkit-transform: rotate(225deg) translate(60px) rotate(-225deg);
        transform: rotate(225deg) translate(60px) rotate(-225deg)
    }
    80% {
        -webkit-transform: rotate(315deg) translate(60px) rotate(-315deg);
        transform: rotate(315deg) translate(60px) rotate(-315deg)
    }
    90% {
        -webkit-transform: rotate(315deg) translate(60px) rotate(-315deg);
        transform: rotate(315deg) translate(60px) rotate(-315deg)
    }
    100% {
        -webkit-transform: rotate(405deg) translate(60px) rotate(-405deg);
        transform: rotate(405deg) translate(60px) rotate(-405deg)
    }
}

.usageAlcard {
    text-align: center
}

.usageAlcard .title-field-page+.txt-lv01 {
    display: block;
    margin-top: .8rem;
    line-height: 2.1rem
}

.usageAlcard .title-field-page+.txt-lv01 strong {
    font-weight: bold
}

.usageAlcard .title-field-page~.txt-lv03 {
    display: block;
    margin-top: .8rem;
    line-height: 2rem
}

.usageAlcard .title-field-page span {
    color: var(--color-bu800, #0150ff)
}

:root .usageAlcard .title-field-page span {
    color: var(--txt-accent-sec, #4262ff)
}

.usageAlcard .alcardAni {
    position: relative
}

.usageAlcard .alcardAni .obj-Alcard {
    position: absolute;
    display: block;
    background-position: 0 0;
    background-repeat: no-repeat;
    background-size: contain
}

.usageAlcard .graybox-text-group {
    margin-top: 2.4rem;
    padding: 3.6rem 2.4rem 2.4rem
}

.usageAlcard .graybox-text-group .txt-group-02 {
    margin-top: 3.9rem;
    line-height: 2rem;
    text-align: left
}

.usageAlcard .graybox-text-group .txt-group-02 .tit {
    font-size: 1.5rem
}

.usageAlcard.n1 {
    padding: 0 2rem
}

.usageAlcard.n1 .alcardAni {
    height: 25rem;
    background: url("../../img/mmk/common/card/img_kpasscard.png") center 0 no-repeat;
    background-size: contain
}

.usageAlcard.n1 .alcardAni .obj-Alcard {
    -webkit-transform: scale(0);
    -ms-transform: scale(0);
    transform: scale(0);
    -webkit-animation: alcard1 .5s ease forwards;
    animation: alcard1 .5s ease forwards
}

.usageAlcard.n1 .alcardAni .obj-Alcard.n1 {
    left: calc(50% + 3.7rem);
    top: 6rem;
    width: 7.6rem;
    height: 7.6rem;
    background-image: url("../../img/mmk/common/card/img_albubble01.png");
    -webkit-animation-delay: .4s;
    animation-delay: .4s
}

.usageAlcard.n1 .alcardAni .obj-Alcard.n2 {
    left: calc(50% - 12.2rem);
    top: 14.1rem;
    width: 7.6rem;
    height: 7.6rem;
    background-image: url("../../img/mmk/common/card/img_albubble02.png");
    -webkit-animation-delay: .8s;
    animation-delay: .8s
}

.usageAlcard.n1 .alcardAni .obj-Alcard.n3 {
    left: calc(50% + 1.2rem);
    top: 21.6rem;
    width: 7.6rem;
    height: 7.6rem;
    background-image: url("../../img/mmk/common/card/img_albubble03.png");
    -webkit-animation-delay: 1.2s;
    animation-delay: 1.2s
}

.usageAlcard.n2 .alcardAni {
    margin-top: -3.2rem;
    height: 26rem;
    background: url("../../img/mmk/common/card/img_albus.png") center 0 no-repeat;
    background-size: 28.6rem 26rem
}

.usageAlcard.n2 .alcardAni .obj-Alcard.n1 {
    left: calc(50% - 10.9rem);
    top: 14.3rem;
    width: 5.5rem;
    height: 4.3rem;
    background-image: url("../../img/mmk/common/card/img_alcoin01.png")
}

.usageAlcard.n2 .alcardAni .obj-Alcard.n2 {
    left: calc(50% + 6.8rem);
    top: 20.9rem;
    width: 4.3rem;
    height: 4.5rem;
    background-image: url("../../img/mmk/common/card/img_alcoin02.png")
}

.usageAlcard.n2.inScroll .obj-Alcard.n1 {
    -webkit-animation: alcard2 .5s ease-in forwards;
    animation: alcard2 .5s ease-in forwards
}

.usageAlcard.n2.inScroll .obj-Alcard.n2 {
    -webkit-animation: alcard3 .5s ease-in forwards;
    animation: alcard3 .5s ease-in forwards;
    -webkit-animation-delay: .4s;
    animation-delay: .4s
}

.count-txt-group {
    margin-top: 3.9rem
}

.count-txt-group li>div {
    position: relative;
    margin-top: .8rem;
    font-size: 3.2rem;
    line-height: 4.3rem
}

.count-txt-group li>div+p {
    margin-top: .2rem
}

.count-txt-group li strong {
    font-weight: bold
}

.count-txt-group .ico-myChatCheck {
    margin-top: -.2rem;
    -webkit-transform: scale(0);
    -ms-transform: scale(0);
    transform: scale(0);
    width: 4.4rem;
    height: 4.4rem;
    background: url("/resource/img/bim/my_chat_check.png") 0 0 no-repeat;
    background-size: contain
}

.usageAlcard.n3 .txt2 .sum.active~.ico-myChatCheck {
    -webkit-animation: alcard1 .8s ease forwards;
    animation: alcard1 .8s ease forwards;
    -webkit-animation-delay: 1s;
    animation-delay: 1s
}

.usageAlcard.n4 .alcardAni {
    margin-top: 4.4rem;
    height: 26rem;
    background: url("../../img/mmk/common/card/img_kpass.png") center 0 no-repeat;
    background-size: 28.6rem 26rem
}

.usageAlcard .text-list-group {
    text-align: left;
    margin-top: 6rem
}

.usageAlcard .text-list-group .title-group .title-field-notice {
    margin-bottom: .8rem;
    font-size: 1.6rem;
    line-height: 2.1rem
}

.usageAlcard .text-list-group .prd-rules-group {
    margin-top: 4.8rem
}

@-webkit-keyframes alcard1 {
    0% {
        -webkit-transform: scale(0, 0);
        transform: scale(0, 0)
    }
    60% {
        -webkit-transform: scale(1.05, 1.05);
        transform: scale(1.05, 1.05)
    }
    100% {
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1)
    }
}

@keyframes alcard1 {
    0% {
        -webkit-transform: scale(0, 0);
        transform: scale(0, 0)
    }
    60% {
        -webkit-transform: scale(1.05, 1.05);
        transform: scale(1.05, 1.05)
    }
    100% {
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1)
    }
}

@-webkit-keyframes alcard2 {
    0% {
        top: 14.3rem
    }
    100% {
        top: 6.3rem
    }
}

@keyframes alcard2 {
    0% {
        top: 14.3rem
    }
    100% {
        top: 6.3rem
    }
}

@-webkit-keyframes alcard3 {
    0% {
        top: 20.9rem
    }
    100% {
        top: 13.9rem
    }
}

@keyframes alcard3 {
    0% {
        top: 20.9rem
    }
    100% {
        top: 13.9rem
    }
}

.usageMyCheckCard-number {
    position: relative;
    max-width: 375px;
    height: 155px;
    margin: 32px auto 0;
    background: url("/resource/img/mmk/common/card/bg_chkcard_number_01.png") no-repeat center top;
    background-size: 375px auto
}

.start .usageMyCheckCard-number {
    -webkit-animation: cardNumberBg 3s infinite linear;
    animation: cardNumberBg 3s infinite linear
}

.usageMyCheckCard-number .obj-numbers {
    position: absolute;
    display: block;
    height: 30px;
    background-position: left top;
    background-repeat: no-repeat
}

.usageMyCheckCard-number .obj-numbers.n1 {
    left: 50%;
    bottom: 0;
    width: 118px;
    margin-left: -70px;
    opacity: 0;
    background-image: url("/resource/img/mmk/common/card/img_chkcard_obj_01.png");
    background-size: 118px auto
}

.usageMyCheckCard-number .obj-numbers.n2 {
    left: 50%;
    bottom: 0;
    width: 131px;
    margin-left: -70px;
    opacity: 0;
    background-image: url("/resource/img/mmk/common/card/img_chkcard_obj_02.png");
    background-size: 118px auto
}

.start .usageMyCheckCard-number .obj-numbers.n1 {
    -webkit-animation: cardNumber1 3s infinite cubic-bezier(0.075, 0.82, 0.165, 1);
    animation: cardNumber1 3s infinite cubic-bezier(0.075, 0.82, 0.165, 1)
}

.start .usageMyCheckCard-number .obj-numbers.n2 {
    -webkit-animation: cardNumber2 3s infinite cubic-bezier(0.075, 0.82, 0.165, 1);
    animation: cardNumber2 3s infinite cubic-bezier(0.075, 0.82, 0.165, 1)
}

@-webkit-keyframes cardNumberBg {
    20%,
    65% {
        background-image: url("/resource/img/mmk/common/card/bg_chkcard_number_02.png")
    }
}

@keyframes cardNumberBg {
    20%,
    65% {
        background-image: url("/resource/img/mmk/common/card/bg_chkcard_number_02.png")
    }
}

@-webkit-keyframes cardNumber1 {
    40% {
        margin-left: -135px;
        bottom: 32px;
        opacity: 1;
        background-image: url("/resource/img/mmk/common/card/img_chkcard_obj_01_line.png")
    }
    65% {
        margin-left: -135px;
        bottom: 32px;
        opacity: 1;
        background-image: url("/resource/img/mmk/common/card/img_chkcard_obj_01_line.png")
    }
    70% {
        margin-left: -135px;
        bottom: 32px;
        opacity: 1;
        background-image: url("/resource/img/mmk/common/card/img_chkcard_obj_01.png")
    }
    80% {
        margin-left: -70px;
        bottom: 0;
        opacity: 0;
        background-image: url("/resource/img/mmk/common/card/img_chkcard_obj_01.png")
    }
}

@keyframes cardNumber1 {
    40% {
        margin-left: -135px;
        bottom: 32px;
        opacity: 1;
        background-image: url("/resource/img/mmk/common/card/img_chkcard_obj_01_line.png")
    }
    65% {
        margin-left: -135px;
        bottom: 32px;
        opacity: 1;
        background-image: url("/resource/img/mmk/common/card/img_chkcard_obj_01_line.png")
    }
    70% {
        margin-left: -135px;
        bottom: 32px;
        opacity: 1;
        background-image: url("/resource/img/mmk/common/card/img_chkcard_obj_01.png")
    }
    80% {
        margin-left: -70px;
        bottom: 0;
        opacity: 0;
        background-image: url("/resource/img/mmk/common/card/img_chkcard_obj_01.png")
    }
}

@-webkit-keyframes cardNumber2 {
    40% {
        margin-left: 10px;
        bottom: 0;
        opacity: 1;
        background-image: url("/resource/img/mmk/common/card/img_chkcard_obj_02_line.png")
    }
    65% {
        margin-left: 10px;
        bottom: 0;
        opacity: 1;
        background-image: url("/resource/img/mmk/common/card/img_chkcard_obj_02_line.png")
    }
    70% {
        margin-left: 10px;
        bottom: 0;
        opacity: 1;
        background-image: url("/resource/img/mmk/common/card/img_chkcard_obj_02.png")
    }
    80% {
        margin-left: -70px;
        bottom: 0;
        opacity: 0;
        background-image: url("/resource/img/mmk/common/card/img_chkcard_obj_02.png")
    }
}

@keyframes cardNumber2 {
    40% {
        margin-left: 10px;
        bottom: 0;
        opacity: 1;
        background-image: url("/resource/img/mmk/common/card/img_chkcard_obj_02_line.png")
    }
    65% {
        margin-left: 10px;
        bottom: 0;
        opacity: 1;
        background-image: url("/resource/img/mmk/common/card/img_chkcard_obj_02_line.png")
    }
    70% {
        margin-left: 10px;
        bottom: 0;
        opacity: 1;
        background-image: url("/resource/img/mmk/common/card/img_chkcard_obj_02.png")
    }
    80% {
        margin-left: -70px;
        bottom: 0;
        opacity: 0;
        background-image: url("/resource/img/mmk/common/card/img_chkcard_obj_02.png")
    }
}

.usageMyCheckCard-pay .obj-pay.n5 {
    -webkit-transform: rotate(-225deg) translate(60px) rotate(225deg);
    -ms-transform: rotate(-225deg) translate(60px) rotate(225deg);
    transform: rotate(-225deg) translate(60px) rotate(225deg);
    background-image: url("/resource/img/mmk/common/card/img_chkcard_sp.png")
}

.start .usageMyCheckCard-pay .obj-pay.n5 {
    -webkit-animation: cardPay3 5s infinite linear;
    animation: cardPay3 5s infinite linear
}

.ios .usageMyCheckCard-pay .obj-pay.n5 {
    -webkit-transform: rotate(-215deg) translate(60px) rotate(215deg);
    -ms-transform: rotate(-215deg) translate(60px) rotate(215deg);
    transform: rotate(-215deg) translate(60px) rotate(215deg)
}

.ios .start .usageMyCheckCard-pay .obj-pay.n5 {
    -webkit-animation-name: cardPayiOS3;
    animation-name: cardPayiOS3;
    -webkit-animation-duration: 4s;
    animation-duration: 4s
}

.usageMyCheckCard-pay.pay_new .obj-pay.n1 {
    -webkit-transform: rotate(50deg) translate(-65px) rotate(-50deg);
    -ms-transform: rotate(50deg) translate(-65px) rotate(-50deg);
    transform: rotate(50deg) translate(-65px) rotate(-50deg)
}

.usageMyCheckCard-pay.pay_new .obj-pay.n2 {
    -webkit-transform: rotate(129deg) translate(-65px) rotate(-129deg);
    -ms-transform: rotate(129deg) translate(-65px) rotate(-129deg);
    transform: rotate(129deg) translate(-65px) rotate(-129deg)
}

.usageMyCheckCard-pay.pay_new .obj-pay.n4 {
    -webkit-transform: rotate(197deg) translate(-65px) rotate(-197deg);
    -ms-transform: rotate(197deg) translate(-65px) rotate(-197deg);
    transform: rotate(197deg) translate(-65px) rotate(-197deg)
}

.usageMyCheckCard-pay.pay_new .obj-pay.n6 {
    -webkit-transform: rotate(269deg) translate(-65px) rotate(-269deg);
    -ms-transform: rotate(269deg) translate(-65px) rotate(-269deg);
    transform: rotate(269deg) translate(-65px) rotate(-269deg);
    background-image: url("/resource/img/mmk/common/card/img_chkcard_payco02.png")
}

.usageMyCheckCard-pay.pay_new .obj-pay.n5 {
    -webkit-transform: rotate(344deg) translate(-65px) rotate(-344deg);
    -ms-transform: rotate(344deg) translate(-65px) rotate(-344deg);
    transform: rotate(344deg) translate(-65px) rotate(-344deg)
}

.start .usageMyCheckCard-pay.pay_new .obj-pay.n1 {
    -webkit-animation: cardPay2_1 5s infinite linear;
    animation: cardPay2_1 5s infinite linear
}

.start .usageMyCheckCard-pay.pay_new .obj-pay.n2 {
    -webkit-animation: cardPay2_2 5s infinite linear;
    animation: cardPay2_2 5s infinite linear
}

.start .usageMyCheckCard-pay.pay_new .obj-pay.n4 {
    -webkit-animation: cardPay2_4 5s infinite linear;
    animation: cardPay2_4 5s infinite linear
}

.start .usageMyCheckCard-pay.pay_new .obj-pay.n6 {
    -webkit-animation: cardPay2_3 5s infinite linear;
    animation: cardPay2_3 5s infinite linear
}

.start .usageMyCheckCard-pay.pay_new .obj-pay.n5 {
    -webkit-animation: cardPay2_5 5s infinite linear;
    animation: cardPay2_5 5s infinite linear
}

@-webkit-keyframes cardPay2_1 {
    0% {
        -webkit-transformtransform: rotate(50deg) translate(-65px) rotate(-50deg);
        -webkit-transform: rotate(50deg) translate(-65px) rotate(-50deg);
        transform: rotate(50deg) translate(-65px) rotate(-50deg)
    }
    10% {
        -webkit-transformtransform: rotate(50deg) translate(-65px) rotate(-50deg);
        -webkit-transform: rotate(50deg) translate(-65px) rotate(-50deg);
        transform: rotate(50deg) translate(-65px) rotate(-50deg)
    }
    20% {
        -webkit-transformtransform: rotate(129deg) translate(-65px) rotate(-129deg);
        -webkit-transform: rotate(129deg) translate(-65px) rotate(-129deg);
        transform: rotate(129deg) translate(-65px) rotate(-129deg)
    }
    30% {
        -webkit-transformtransform: rotate(129deg) translate(-65px) rotate(-129deg);
        -webkit-transform: rotate(129deg) translate(-65px) rotate(-129deg);
        transform: rotate(129deg) translate(-65px) rotate(-129deg)
    }
    40% {
        -webkit-transformtransform: rotate(197deg) translate(-65px) rotate(-197deg);
        -webkit-transform: rotate(197deg) translate(-65px) rotate(-197deg);
        transform: rotate(197deg) translate(-65px) rotate(-197deg)
    }
    50% {
        -webkit-transformtransform: rotate(197deg) translate(-65px) rotate(-197deg);
        -webkit-transform: rotate(197deg) translate(-65px) rotate(-197deg);
        transform: rotate(197deg) translate(-65px) rotate(-197deg)
    }
    60% {
        -webkit-transformtransform: rotate(269deg) translate(-65px) rotate(-269deg);
        -webkit-transform: rotate(269deg) translate(-65px) rotate(-269deg);
        transform: rotate(269deg) translate(-65px) rotate(-269deg)
    }
    70% {
        -webkit-transformtransform: rotate(269deg) translate(-65px) rotate(-269deg);
        -webkit-transform: rotate(269deg) translate(-65px) rotate(-269deg);
        transform: rotate(269deg) translate(-65px) rotate(-269deg)
    }
    80% {
        -webkit-transformtransform: rotate(344deg) translate(-65px) rotate(-344deg);
        -webkit-transform: rotate(344deg) translate(-65px) rotate(-344deg);
        transform: rotate(344deg) translate(-65px) rotate(-344deg)
    }
    90% {
        -webkit-transformtransform: rotate(344deg) translate(-65px) rotate(-344deg);
        -webkit-transform: rotate(344deg) translate(-65px) rotate(-344deg);
        transform: rotate(344deg) translate(-65px) rotate(-344deg)
    }
    100% {
        -webkit-transformtransform: rotate(409deg) translate(-65px) rotate(-409deg);
        -webkit-transform: rotate(409deg) translate(-65px) rotate(-409deg);
        transform: rotate(409deg) translate(-65px) rotate(-409deg)
    }
}

@keyframes cardPay2_1 {
    0% {
        -webkit-transformtransform: rotate(50deg) translate(-65px) rotate(-50deg);
        -webkit-transform: rotate(50deg) translate(-65px) rotate(-50deg);
        transform: rotate(50deg) translate(-65px) rotate(-50deg)
    }
    10% {
        -webkit-transformtransform: rotate(50deg) translate(-65px) rotate(-50deg);
        -webkit-transform: rotate(50deg) translate(-65px) rotate(-50deg);
        transform: rotate(50deg) translate(-65px) rotate(-50deg)
    }
    20% {
        -webkit-transformtransform: rotate(129deg) translate(-65px) rotate(-129deg);
        -webkit-transform: rotate(129deg) translate(-65px) rotate(-129deg);
        transform: rotate(129deg) translate(-65px) rotate(-129deg)
    }
    30% {
        -webkit-transformtransform: rotate(129deg) translate(-65px) rotate(-129deg);
        -webkit-transform: rotate(129deg) translate(-65px) rotate(-129deg);
        transform: rotate(129deg) translate(-65px) rotate(-129deg)
    }
    40% {
        -webkit-transformtransform: rotate(197deg) translate(-65px) rotate(-197deg);
        -webkit-transform: rotate(197deg) translate(-65px) rotate(-197deg);
        transform: rotate(197deg) translate(-65px) rotate(-197deg)
    }
    50% {
        -webkit-transformtransform: rotate(197deg) translate(-65px) rotate(-197deg);
        -webkit-transform: rotate(197deg) translate(-65px) rotate(-197deg);
        transform: rotate(197deg) translate(-65px) rotate(-197deg)
    }
    60% {
        -webkit-transformtransform: rotate(269deg) translate(-65px) rotate(-269deg);
        -webkit-transform: rotate(269deg) translate(-65px) rotate(-269deg);
        transform: rotate(269deg) translate(-65px) rotate(-269deg)
    }
    70% {
        -webkit-transformtransform: rotate(269deg) translate(-65px) rotate(-269deg);
        -webkit-transform: rotate(269deg) translate(-65px) rotate(-269deg);
        transform: rotate(269deg) translate(-65px) rotate(-269deg)
    }
    80% {
        -webkit-transformtransform: rotate(344deg) translate(-65px) rotate(-344deg);
        -webkit-transform: rotate(344deg) translate(-65px) rotate(-344deg);
        transform: rotate(344deg) translate(-65px) rotate(-344deg)
    }
    90% {
        -webkit-transformtransform: rotate(344deg) translate(-65px) rotate(-344deg);
        -webkit-transform: rotate(344deg) translate(-65px) rotate(-344deg);
        transform: rotate(344deg) translate(-65px) rotate(-344deg)
    }
    100% {
        -webkit-transformtransform: rotate(409deg) translate(-65px) rotate(-409deg);
        -webkit-transform: rotate(409deg) translate(-65px) rotate(-409deg);
        transform: rotate(409deg) translate(-65px) rotate(-409deg)
    }
}

@-webkit-keyframes cardPay2_2 {
    0% {
        -webkit-transformtransform: rotate(129deg) translate(-65px) rotate(-129deg);
        -webkit-transform: rotate(129deg) translate(-65px) rotate(-129deg);
        transform: rotate(129deg) translate(-65px) rotate(-129deg)
    }
    10% {
        -webkit-transformtransform: rotate(129deg) translate(-65px) rotate(-129deg);
        -webkit-transform: rotate(129deg) translate(-65px) rotate(-129deg);
        transform: rotate(129deg) translate(-65px) rotate(-129deg)
    }
    20% {
        -webkit-transformtransform: rotate(197deg) translate(-65px) rotate(-197deg);
        -webkit-transform: rotate(197deg) translate(-65px) rotate(-197deg);
        transform: rotate(197deg) translate(-65px) rotate(-197deg)
    }
    30% {
        -webkit-transformtransform: rotate(197deg) translate(-65px) rotate(-197deg);
        -webkit-transform: rotate(197deg) translate(-65px) rotate(-197deg);
        transform: rotate(197deg) translate(-65px) rotate(-197deg)
    }
    40% {
        -webkit-transformtransform: rotate(269deg) translate(-65px) rotate(-269deg);
        -webkit-transform: rotate(269deg) translate(-65px) rotate(-269deg);
        transform: rotate(269deg) translate(-65px) rotate(-269deg)
    }
    50% {
        -webkit-transformtransform: rotate(269deg) translate(-65px) rotate(-269deg);
        -webkit-transform: rotate(269deg) translate(-65px) rotate(-269deg);
        transform: rotate(269deg) translate(-65px) rotate(-269deg)
    }
    60% {
        -webkit-transformtransform: rotate(344deg) translate(-65px) rotate(-344deg);
        -webkit-transform: rotate(344deg) translate(-65px) rotate(-344deg);
        transform: rotate(344deg) translate(-65px) rotate(-344deg)
    }
    70% {
        -webkit-transformtransform: rotate(344deg) translate(-65px) rotate(-344deg);
        -webkit-transform: rotate(344deg) translate(-65px) rotate(-344deg);
        transform: rotate(344deg) translate(-65px) rotate(-344deg)
    }
    80% {
        -webkit-transformtransform: rotate(409deg) translate(-65px) rotate(-409deg);
        -webkit-transform: rotate(409deg) translate(-65px) rotate(-409deg);
        transform: rotate(409deg) translate(-65px) rotate(-409deg)
    }
    90% {
        -webkit-transformtransform: rotate(409deg) translate(-65px) rotate(-409deg);
        -webkit-transform: rotate(409deg) translate(-65px) rotate(-409deg);
        transform: rotate(409deg) translate(-65px) rotate(-409deg)
    }
    100% {
        -webkit-transformtransform: rotate(489deg) translate(-65px) rotate(-489deg);
        -webkit-transform: rotate(489deg) translate(-65px) rotate(-489deg);
        transform: rotate(489deg) translate(-65px) rotate(-489deg)
    }
}

@keyframes cardPay2_2 {
    0% {
        -webkit-transformtransform: rotate(129deg) translate(-65px) rotate(-129deg);
        -webkit-transform: rotate(129deg) translate(-65px) rotate(-129deg);
        transform: rotate(129deg) translate(-65px) rotate(-129deg)
    }
    10% {
        -webkit-transformtransform: rotate(129deg) translate(-65px) rotate(-129deg);
        -webkit-transform: rotate(129deg) translate(-65px) rotate(-129deg);
        transform: rotate(129deg) translate(-65px) rotate(-129deg)
    }
    20% {
        -webkit-transformtransform: rotate(197deg) translate(-65px) rotate(-197deg);
        -webkit-transform: rotate(197deg) translate(-65px) rotate(-197deg);
        transform: rotate(197deg) translate(-65px) rotate(-197deg)
    }
    30% {
        -webkit-transformtransform: rotate(197deg) translate(-65px) rotate(-197deg);
        -webkit-transform: rotate(197deg) translate(-65px) rotate(-197deg);
        transform: rotate(197deg) translate(-65px) rotate(-197deg)
    }
    40% {
        -webkit-transformtransform: rotate(269deg) translate(-65px) rotate(-269deg);
        -webkit-transform: rotate(269deg) translate(-65px) rotate(-269deg);
        transform: rotate(269deg) translate(-65px) rotate(-269deg)
    }
    50% {
        -webkit-transformtransform: rotate(269deg) translate(-65px) rotate(-269deg);
        -webkit-transform: rotate(269deg) translate(-65px) rotate(-269deg);
        transform: rotate(269deg) translate(-65px) rotate(-269deg)
    }
    60% {
        -webkit-transformtransform: rotate(344deg) translate(-65px) rotate(-344deg);
        -webkit-transform: rotate(344deg) translate(-65px) rotate(-344deg);
        transform: rotate(344deg) translate(-65px) rotate(-344deg)
    }
    70% {
        -webkit-transformtransform: rotate(344deg) translate(-65px) rotate(-344deg);
        -webkit-transform: rotate(344deg) translate(-65px) rotate(-344deg);
        transform: rotate(344deg) translate(-65px) rotate(-344deg)
    }
    80% {
        -webkit-transformtransform: rotate(409deg) translate(-65px) rotate(-409deg);
        -webkit-transform: rotate(409deg) translate(-65px) rotate(-409deg);
        transform: rotate(409deg) translate(-65px) rotate(-409deg)
    }
    90% {
        -webkit-transformtransform: rotate(409deg) translate(-65px) rotate(-409deg);
        -webkit-transform: rotate(409deg) translate(-65px) rotate(-409deg);
        transform: rotate(409deg) translate(-65px) rotate(-409deg)
    }
    100% {
        -webkit-transformtransform: rotate(489deg) translate(-65px) rotate(-489deg);
        -webkit-transform: rotate(489deg) translate(-65px) rotate(-489deg);
        transform: rotate(489deg) translate(-65px) rotate(-489deg)
    }
}

@-webkit-keyframes cardPay2_3 {
    0% {
        -webkit-transformtransform: rotate(197deg) translate(-65px) rotate(-197deg);
        -webkit-transform: rotate(197deg) translate(-65px) rotate(-197deg);
        transform: rotate(197deg) translate(-65px) rotate(-197deg)
    }
    10% {
        -webkit-transformtransform: rotate(197deg) translate(-65px) rotate(-197deg);
        -webkit-transform: rotate(197deg) translate(-65px) rotate(-197deg);
        transform: rotate(197deg) translate(-65px) rotate(-197deg)
    }
    20% {
        -webkit-transformtransform: rotate(269deg) translate(-65px) rotate(-269deg);
        -webkit-transform: rotate(269deg) translate(-65px) rotate(-269deg);
        transform: rotate(269deg) translate(-65px) rotate(-269deg)
    }
    30% {
        -webkit-transformtransform: rotate(269deg) translate(-65px) rotate(-269deg);
        -webkit-transform: rotate(269deg) translate(-65px) rotate(-269deg);
        transform: rotate(269deg) translate(-65px) rotate(-269deg)
    }
    40% {
        -webkit-transformtransform: rotate(344deg) translate(-65px) rotate(-344deg);
        -webkit-transform: rotate(344deg) translate(-65px) rotate(-344deg);
        transform: rotate(344deg) translate(-65px) rotate(-344deg)
    }
    50% {
        -webkit-transformtransform: rotate(344deg) translate(-65px) rotate(-344deg);
        -webkit-transform: rotate(344deg) translate(-65px) rotate(-344deg);
        transform: rotate(344deg) translate(-65px) rotate(-344deg)
    }
    60% {
        -webkit-transformtransform: rotate(409deg) translate(-65px) rotate(-409deg);
        -webkit-transform: rotate(409deg) translate(-65px) rotate(-409deg);
        transform: rotate(409deg) translate(-65px) rotate(-409deg)
    }
    70% {
        -webkit-transformtransform: rotate(409deg) translate(-65px) rotate(-409deg);
        -webkit-transform: rotate(409deg) translate(-65px) rotate(-409deg);
        transform: rotate(409deg) translate(-65px) rotate(-409deg)
    }
    80% {
        -webkit-transformtransform: rotate(489deg) translate(-65px) rotate(-489deg);
        -webkit-transform: rotate(489deg) translate(-65px) rotate(-489deg);
        transform: rotate(489deg) translate(-65px) rotate(-489deg)
    }
    90% {
        -webkit-transformtransform: rotate(489deg) translate(-65px) rotate(-489deg);
        -webkit-transform: rotate(489deg) translate(-65px) rotate(-489deg);
        transform: rotate(489deg) translate(-65px) rotate(-489deg)
    }
    100% {
        -webkit-transformtransform: rotate(549deg) translate(-65px) rotate(-549deg);
        -webkit-transform: rotate(549deg) translate(-65px) rotate(-549deg);
        transform: rotate(549deg) translate(-65px) rotate(-549deg)
    }
}

@keyframes cardPay2_3 {
    0% {
        -webkit-transformtransform: rotate(197deg) translate(-65px) rotate(-197deg);
        -webkit-transform: rotate(197deg) translate(-65px) rotate(-197deg);
        transform: rotate(197deg) translate(-65px) rotate(-197deg)
    }
    10% {
        -webkit-transformtransform: rotate(197deg) translate(-65px) rotate(-197deg);
        -webkit-transform: rotate(197deg) translate(-65px) rotate(-197deg);
        transform: rotate(197deg) translate(-65px) rotate(-197deg)
    }
    20% {
        -webkit-transformtransform: rotate(269deg) translate(-65px) rotate(-269deg);
        -webkit-transform: rotate(269deg) translate(-65px) rotate(-269deg);
        transform: rotate(269deg) translate(-65px) rotate(-269deg)
    }
    30% {
        -webkit-transformtransform: rotate(269deg) translate(-65px) rotate(-269deg);
        -webkit-transform: rotate(269deg) translate(-65px) rotate(-269deg);
        transform: rotate(269deg) translate(-65px) rotate(-269deg)
    }
    40% {
        -webkit-transformtransform: rotate(344deg) translate(-65px) rotate(-344deg);
        -webkit-transform: rotate(344deg) translate(-65px) rotate(-344deg);
        transform: rotate(344deg) translate(-65px) rotate(-344deg)
    }
    50% {
        -webkit-transformtransform: rotate(344deg) translate(-65px) rotate(-344deg);
        -webkit-transform: rotate(344deg) translate(-65px) rotate(-344deg);
        transform: rotate(344deg) translate(-65px) rotate(-344deg)
    }
    60% {
        -webkit-transformtransform: rotate(409deg) translate(-65px) rotate(-409deg);
        -webkit-transform: rotate(409deg) translate(-65px) rotate(-409deg);
        transform: rotate(409deg) translate(-65px) rotate(-409deg)
    }
    70% {
        -webkit-transformtransform: rotate(409deg) translate(-65px) rotate(-409deg);
        -webkit-transform: rotate(409deg) translate(-65px) rotate(-409deg);
        transform: rotate(409deg) translate(-65px) rotate(-409deg)
    }
    80% {
        -webkit-transformtransform: rotate(489deg) translate(-65px) rotate(-489deg);
        -webkit-transform: rotate(489deg) translate(-65px) rotate(-489deg);
        transform: rotate(489deg) translate(-65px) rotate(-489deg)
    }
    90% {
        -webkit-transformtransform: rotate(489deg) translate(-65px) rotate(-489deg);
        -webkit-transform: rotate(489deg) translate(-65px) rotate(-489deg);
        transform: rotate(489deg) translate(-65px) rotate(-489deg)
    }
    100% {
        -webkit-transformtransform: rotate(549deg) translate(-65px) rotate(-549deg);
        -webkit-transform: rotate(549deg) translate(-65px) rotate(-549deg);
        transform: rotate(549deg) translate(-65px) rotate(-549deg)
    }
}

@-webkit-keyframes cardPay2_4 {
    0% {
        -webkit-transformtransform: rotate(269deg) translate(-65px) rotate(-269deg);
        -webkit-transform: rotate(269deg) translate(-65px) rotate(-269deg);
        transform: rotate(269deg) translate(-65px) rotate(-269deg)
    }
    10% {
        -webkit-transformtransform: rotate(269deg) translate(-65px) rotate(-269deg);
        -webkit-transform: rotate(269deg) translate(-65px) rotate(-269deg);
        transform: rotate(269deg) translate(-65px) rotate(-269deg)
    }
    20% {
        -webkit-transformtransform: rotate(344deg) translate(-65px) rotate(-344deg);
        -webkit-transform: rotate(344deg) translate(-65px) rotate(-344deg);
        transform: rotate(344deg) translate(-65px) rotate(-344deg)
    }
    30% {
        -webkit-transformtransform: rotate(344deg) translate(-65px) rotate(-344deg);
        -webkit-transform: rotate(344deg) translate(-65px) rotate(-344deg);
        transform: rotate(344deg) translate(-65px) rotate(-344deg)
    }
    40% {
        -webkit-transformtransform: rotate(409deg) translate(-65px) rotate(-409deg);
        -webkit-transform: rotate(409deg) translate(-65px) rotate(-409deg);
        transform: rotate(409deg) translate(-65px) rotate(-409deg)
    }
    50% {
        -webkit-transformtransform: rotate(409deg) translate(-65px) rotate(-409deg);
        -webkit-transform: rotate(409deg) translate(-65px) rotate(-409deg);
        transform: rotate(409deg) translate(-65px) rotate(-409deg)
    }
    60% {
        -webkit-transformtransform: rotate(489deg) translate(-65px) rotate(-489deg);
        -webkit-transform: rotate(489deg) translate(-65px) rotate(-489deg);
        transform: rotate(489deg) translate(-65px) rotate(-489deg)
    }
    70% {
        -webkit-transformtransform: rotate(489deg) translate(-65px) rotate(-489deg);
        -webkit-transform: rotate(489deg) translate(-65px) rotate(-489deg);
        transform: rotate(489deg) translate(-65px) rotate(-489deg)
    }
    80% {
        -webkit-transformtransform: rotate(549deg) translate(-65px) rotate(-549deg);
        -webkit-transform: rotate(549deg) translate(-65px) rotate(-549deg);
        transform: rotate(549deg) translate(-65px) rotate(-549deg)
    }
    90% {
        -webkit-transformtransform: rotate(549deg) translate(-65px) rotate(-549deg);
        -webkit-transform: rotate(549deg) translate(-65px) rotate(-549deg);
        transform: rotate(549deg) translate(-65px) rotate(-549deg)
    }
    100% {
        -webkit-transformtransform: rotate(609deg) translate(-65px) rotate(-609deg);
        -webkit-transform: rotate(609deg) translate(-65px) rotate(-609deg);
        transform: rotate(609deg) translate(-65px) rotate(-609deg)
    }
}

@keyframes cardPay2_4 {
    0% {
        -webkit-transformtransform: rotate(269deg) translate(-65px) rotate(-269deg);
        -webkit-transform: rotate(269deg) translate(-65px) rotate(-269deg);
        transform: rotate(269deg) translate(-65px) rotate(-269deg)
    }
    10% {
        -webkit-transformtransform: rotate(269deg) translate(-65px) rotate(-269deg);
        -webkit-transform: rotate(269deg) translate(-65px) rotate(-269deg);
        transform: rotate(269deg) translate(-65px) rotate(-269deg)
    }
    20% {
        -webkit-transformtransform: rotate(344deg) translate(-65px) rotate(-344deg);
        -webkit-transform: rotate(344deg) translate(-65px) rotate(-344deg);
        transform: rotate(344deg) translate(-65px) rotate(-344deg)
    }
    30% {
        -webkit-transformtransform: rotate(344deg) translate(-65px) rotate(-344deg);
        -webkit-transform: rotate(344deg) translate(-65px) rotate(-344deg);
        transform: rotate(344deg) translate(-65px) rotate(-344deg)
    }
    40% {
        -webkit-transformtransform: rotate(409deg) translate(-65px) rotate(-409deg);
        -webkit-transform: rotate(409deg) translate(-65px) rotate(-409deg);
        transform: rotate(409deg) translate(-65px) rotate(-409deg)
    }
    50% {
        -webkit-transformtransform: rotate(409deg) translate(-65px) rotate(-409deg);
        -webkit-transform: rotate(409deg) translate(-65px) rotate(-409deg);
        transform: rotate(409deg) translate(-65px) rotate(-409deg)
    }
    60% {
        -webkit-transformtransform: rotate(489deg) translate(-65px) rotate(-489deg);
        -webkit-transform: rotate(489deg) translate(-65px) rotate(-489deg);
        transform: rotate(489deg) translate(-65px) rotate(-489deg)
    }
    70% {
        -webkit-transformtransform: rotate(489deg) translate(-65px) rotate(-489deg);
        -webkit-transform: rotate(489deg) translate(-65px) rotate(-489deg);
        transform: rotate(489deg) translate(-65px) rotate(-489deg)
    }
    80% {
        -webkit-transformtransform: rotate(549deg) translate(-65px) rotate(-549deg);
        -webkit-transform: rotate(549deg) translate(-65px) rotate(-549deg);
        transform: rotate(549deg) translate(-65px) rotate(-549deg)
    }
    90% {
        -webkit-transformtransform: rotate(549deg) translate(-65px) rotate(-549deg);
        -webkit-transform: rotate(549deg) translate(-65px) rotate(-549deg);
        transform: rotate(549deg) translate(-65px) rotate(-549deg)
    }
    100% {
        -webkit-transformtransform: rotate(609deg) translate(-65px) rotate(-609deg);
        -webkit-transform: rotate(609deg) translate(-65px) rotate(-609deg);
        transform: rotate(609deg) translate(-65px) rotate(-609deg)
    }
}

@-webkit-keyframes cardPay2_5 {
    0% {
        -webkit-transformtransform: rotate(344deg) translate(-65px) rotate(-344deg);
        -webkit-transform: rotate(344deg) translate(-65px) rotate(-344deg);
        transform: rotate(344deg) translate(-65px) rotate(-344deg)
    }
    10% {
        -webkit-transformtransform: rotate(344deg) translate(-65px) rotate(-344deg);
        -webkit-transform: rotate(344deg) translate(-65px) rotate(-344deg);
        transform: rotate(344deg) translate(-65px) rotate(-344deg)
    }
    20% {
        -webkit-transformtransform: rotate(409deg) translate(-65px) rotate(-409deg);
        -webkit-transform: rotate(409deg) translate(-65px) rotate(-409deg);
        transform: rotate(409deg) translate(-65px) rotate(-409deg)
    }
    30% {
        -webkit-transformtransform: rotate(409deg) translate(-65px) rotate(-409deg);
        -webkit-transform: rotate(409deg) translate(-65px) rotate(-409deg);
        transform: rotate(409deg) translate(-65px) rotate(-409deg)
    }
    40% {
        -webkit-transformtransform: rotate(489deg) translate(-65px) rotate(-489deg);
        -webkit-transform: rotate(489deg) translate(-65px) rotate(-489deg);
        transform: rotate(489deg) translate(-65px) rotate(-489deg)
    }
    50% {
        -webkit-transformtransform: rotate(489deg) translate(-65px) rotate(-489deg);
        -webkit-transform: rotate(489deg) translate(-65px) rotate(-489deg);
        transform: rotate(489deg) translate(-65px) rotate(-489deg)
    }
    60% {
        -webkit-transformtransform: rotate(549deg) translate(-65px) rotate(-549deg);
        -webkit-transform: rotate(549deg) translate(-65px) rotate(-549deg);
        transform: rotate(549deg) translate(-65px) rotate(-549deg)
    }
    70% {
        -webkit-transformtransform: rotate(549deg) translate(-65px) rotate(-549deg);
        -webkit-transform: rotate(549deg) translate(-65px) rotate(-549deg);
        transform: rotate(549deg) translate(-65px) rotate(-549deg)
    }
    80% {
        -webkit-transformtransform: rotate(629deg) translate(-65px) rotate(-629deg);
        -webkit-transform: rotate(629deg) translate(-65px) rotate(-629deg);
        transform: rotate(629deg) translate(-65px) rotate(-629deg)
    }
    90% {
        -webkit-transformtransform: rotate(629deg) translate(-65px) rotate(-629deg);
        -webkit-transform: rotate(629deg) translate(-65px) rotate(-629deg);
        transform: rotate(629deg) translate(-65px) rotate(-629deg)
    }
    100% {
        -webkit-transformtransform: rotate(704deg) translate(-65px) rotate(-704deg);
        -webkit-transform: rotate(704deg) translate(-65px) rotate(-704deg);
        transform: rotate(704deg) translate(-65px) rotate(-704deg)
    }
}

@keyframes cardPay2_5 {
    0% {
        -webkit-transformtransform: rotate(344deg) translate(-65px) rotate(-344deg);
        -webkit-transform: rotate(344deg) translate(-65px) rotate(-344deg);
        transform: rotate(344deg) translate(-65px) rotate(-344deg)
    }
    10% {
        -webkit-transformtransform: rotate(344deg) translate(-65px) rotate(-344deg);
        -webkit-transform: rotate(344deg) translate(-65px) rotate(-344deg);
        transform: rotate(344deg) translate(-65px) rotate(-344deg)
    }
    20% {
        -webkit-transformtransform: rotate(409deg) translate(-65px) rotate(-409deg);
        -webkit-transform: rotate(409deg) translate(-65px) rotate(-409deg);
        transform: rotate(409deg) translate(-65px) rotate(-409deg)
    }
    30% {
        -webkit-transformtransform: rotate(409deg) translate(-65px) rotate(-409deg);
        -webkit-transform: rotate(409deg) translate(-65px) rotate(-409deg);
        transform: rotate(409deg) translate(-65px) rotate(-409deg)
    }
    40% {
        -webkit-transformtransform: rotate(489deg) translate(-65px) rotate(-489deg);
        -webkit-transform: rotate(489deg) translate(-65px) rotate(-489deg);
        transform: rotate(489deg) translate(-65px) rotate(-489deg)
    }
    50% {
        -webkit-transformtransform: rotate(489deg) translate(-65px) rotate(-489deg);
        -webkit-transform: rotate(489deg) translate(-65px) rotate(-489deg);
        transform: rotate(489deg) translate(-65px) rotate(-489deg)
    }
    60% {
        -webkit-transformtransform: rotate(549deg) translate(-65px) rotate(-549deg);
        -webkit-transform: rotate(549deg) translate(-65px) rotate(-549deg);
        transform: rotate(549deg) translate(-65px) rotate(-549deg)
    }
    70% {
        -webkit-transformtransform: rotate(549deg) translate(-65px) rotate(-549deg);
        -webkit-transform: rotate(549deg) translate(-65px) rotate(-549deg);
        transform: rotate(549deg) translate(-65px) rotate(-549deg)
    }
    80% {
        -webkit-transformtransform: rotate(629deg) translate(-65px) rotate(-629deg);
        -webkit-transform: rotate(629deg) translate(-65px) rotate(-629deg);
        transform: rotate(629deg) translate(-65px) rotate(-629deg)
    }
    90% {
        -webkit-transformtransform: rotate(629deg) translate(-65px) rotate(-629deg);
        -webkit-transform: rotate(629deg) translate(-65px) rotate(-629deg);
        transform: rotate(629deg) translate(-65px) rotate(-629deg)
    }
    100% {
        -webkit-transformtransform: rotate(704deg) translate(-65px) rotate(-704deg);
        -webkit-transform: rotate(704deg) translate(-65px) rotate(-704deg);
        transform: rotate(704deg) translate(-65px) rotate(-704deg)
    }
}

.ios .usageMyCheckCard-pay.pay_new .obj-pay.n1 {
    -webkit-transform: rotate(-135deg) translate(60px) rotate(135deg);
    -ms-transform: rotate(-135deg) translate(60px) rotate(135deg);
    transform: rotate(-135deg) translate(60px) rotate(135deg)
}

.ios .usageMyCheckCard-pay.pay_new .obj-pay.n2 {
    display: none
}

.ios .usageMyCheckCard-pay.pay_new .obj-pay.n5 {
    -webkit-transform: rotate(-45deg) translate(60px) rotate(45deg);
    -ms-transform: rotate(-45deg) translate(60px) rotate(45deg);
    transform: rotate(-45deg) translate(60px) rotate(45deg)
}

.ios .usageMyCheckCard-pay.pay_new .obj-pay.n4 {
    -webkit-transform: rotate(-225deg) translate(60px) rotate(225deg);
    -ms-transform: rotate(-225deg) translate(60px) rotate(225deg);
    transform: rotate(-225deg) translate(60px) rotate(225deg)
}

.ios .usageMyCheckCard-pay.pay_new .obj-pay.n6 {
    -webkit-transform: rotate(45deg) translate(60px) rotate(-45deg);
    -ms-transform: rotate(45deg) translate(60px) rotate(-45deg);
    transform: rotate(45deg) translate(60px) rotate(-45deg)
}

.ios .start .usageMyCheckCard-pay.pay_new .obj-pay.n1 {
    -webkit-animation-name: cardPayiOS2_1;
    animation-name: cardPayiOS2_1;
    -webkit-animation-duration: 4s;
    animation-duration: 4s
}

.ios .start .usageMyCheckCard-pay.pay_new .obj-pay.n5 {
    -webkit-animation-name: cardPayiOS2_2;
    animation-name: cardPayiOS2_2;
    -webkit-animation-duration: 4s;
    animation-duration: 4s
}

.ios .start .usageMyCheckCard-pay.pay_new .obj-pay.n4 {
    -webkit-animation-name: cardPayiOS2_3;
    animation-name: cardPayiOS2_3;
    -webkit-animation-duration: 4s;
    animation-duration: 4s
}

.ios .start .usageMyCheckCard-pay.pay_new .obj-pay.n6 {
    -webkit-animation-name: cardPayiOS2_4;
    animation-name: cardPayiOS2_4;
    -webkit-animation-duration: 4s;
    animation-duration: 4s
}

@-webkit-keyframes cardPayiOS2_1 {
    0% {
        -webkit-transformtransform: rotate(-135deg) translate(60px) rotate(135deg);
        -webkit-transform: rotate(-135deg) translate(60px) rotate(135deg);
        transform: rotate(-135deg) translate(60px) rotate(135deg)
    }
    30% {
        -webkit-transformtransform: rotate(-135deg) translate(60px) rotate(135deg);
        -webkit-transform: rotate(-135deg) translate(60px) rotate(135deg);
        transform: rotate(-135deg) translate(60px) rotate(135deg)
    }
    40% {
        -webkit-transformtransform: rotate(-45deg) translate(60px) rotate(45deg);
        -webkit-transform: rotate(-45deg) translate(60px) rotate(45deg);
        transform: rotate(-45deg) translate(60px) rotate(45deg)
    }
    50% {
        -webkit-transformtransform: rotate(-45deg) translate(60px) rotate(45deg);
        -webkit-transform: rotate(-45deg) translate(60px) rotate(45deg);
        transform: rotate(-45deg) translate(60px) rotate(45deg)
    }
    60% {
        -webkit-transformtransform: rotate(45deg) translate(60px) rotate(-45deg);
        -webkit-transform: rotate(45deg) translate(60px) rotate(-45deg);
        transform: rotate(45deg) translate(60px) rotate(-45deg)
    }
    70% {
        -webkit-transformtransform: rotate(45deg) translate(60px) rotate(-45deg);
        -webkit-transform: rotate(45deg) translate(60px) rotate(-45deg);
        transform: rotate(45deg) translate(60px) rotate(-45deg)
    }
    80% {
        -webkit-transformtransform: rotate(135deg) translate(60px) rotate(-135deg);
        -webkit-transform: rotate(135deg) translate(60px) rotate(-135deg);
        transform: rotate(135deg) translate(60px) rotate(-135deg)
    }
    90% {
        -webkit-transformtransform: rotate(135deg) translate(60px) rotate(-135deg);
        -webkit-transform: rotate(135deg) translate(60px) rotate(-135deg);
        transform: rotate(135deg) translate(60px) rotate(-135deg)
    }
    100% {
        -webkit-transformtransform: rotate(225deg) translate(60px) rotate(-225deg);
        -webkit-transform: rotate(225deg) translate(60px) rotate(-225deg);
        transform: rotate(225deg) translate(60px) rotate(-225deg)
    }
}

@keyframes cardPayiOS2_1 {
    0% {
        -webkit-transformtransform: rotate(-135deg) translate(60px) rotate(135deg);
        -webkit-transform: rotate(-135deg) translate(60px) rotate(135deg);
        transform: rotate(-135deg) translate(60px) rotate(135deg)
    }
    30% {
        -webkit-transformtransform: rotate(-135deg) translate(60px) rotate(135deg);
        -webkit-transform: rotate(-135deg) translate(60px) rotate(135deg);
        transform: rotate(-135deg) translate(60px) rotate(135deg)
    }
    40% {
        -webkit-transformtransform: rotate(-45deg) translate(60px) rotate(45deg);
        -webkit-transform: rotate(-45deg) translate(60px) rotate(45deg);
        transform: rotate(-45deg) translate(60px) rotate(45deg)
    }
    50% {
        -webkit-transformtransform: rotate(-45deg) translate(60px) rotate(45deg);
        -webkit-transform: rotate(-45deg) translate(60px) rotate(45deg);
        transform: rotate(-45deg) translate(60px) rotate(45deg)
    }
    60% {
        -webkit-transformtransform: rotate(45deg) translate(60px) rotate(-45deg);
        -webkit-transform: rotate(45deg) translate(60px) rotate(-45deg);
        transform: rotate(45deg) translate(60px) rotate(-45deg)
    }
    70% {
        -webkit-transformtransform: rotate(45deg) translate(60px) rotate(-45deg);
        -webkit-transform: rotate(45deg) translate(60px) rotate(-45deg);
        transform: rotate(45deg) translate(60px) rotate(-45deg)
    }
    80% {
        -webkit-transformtransform: rotate(135deg) translate(60px) rotate(-135deg);
        -webkit-transform: rotate(135deg) translate(60px) rotate(-135deg);
        transform: rotate(135deg) translate(60px) rotate(-135deg)
    }
    90% {
        -webkit-transformtransform: rotate(135deg) translate(60px) rotate(-135deg);
        -webkit-transform: rotate(135deg) translate(60px) rotate(-135deg);
        transform: rotate(135deg) translate(60px) rotate(-135deg)
    }
    100% {
        -webkit-transformtransform: rotate(225deg) translate(60px) rotate(-225deg);
        -webkit-transform: rotate(225deg) translate(60px) rotate(-225deg);
        transform: rotate(225deg) translate(60px) rotate(-225deg)
    }
}

@-webkit-keyframes cardPayiOS2_2 {
    0% {
        -webkit-transform: rotate(-45deg) translate(60px) rotate(45deg);
        transform: rotate(-45deg) translate(60px) rotate(45deg)
    }
    30% {
        -webkit-transform: rotate(-45deg) translate(60px) rotate(45deg);
        transform: rotate(-45deg) translate(60px) rotate(45deg)
    }
    40% {
        -webkit-transform: rotate(45deg) translate(60px) rotate(-45deg);
        transform: rotate(45deg) translate(60px) rotate(-45deg)
    }
    50% {
        -webkit-transform: rotate(45deg) translate(60px) rotate(-45deg);
        transform: rotate(45deg) translate(60px) rotate(-45deg)
    }
    60% {
        -webkit-transform: rotate(135deg) translate(60px) rotate(-135deg);
        transform: rotate(135deg) translate(60px) rotate(-135deg)
    }
    70% {
        -webkit-transform: rotate(135deg) translate(60px) rotate(-135deg);
        transform: rotate(135deg) translate(60px) rotate(-135deg)
    }
    80% {
        -webkit-transform: rotate(225deg) translate(60px) rotate(-225deg);
        transform: rotate(225deg) translate(60px) rotate(-225deg)
    }
    90% {
        -webkit-transform: rotate(225deg) translate(60px) rotate(-225deg);
        transform: rotate(225deg) translate(60px) rotate(-225deg)
    }
    100% {
        -webkit-transform: rotate(315deg) translate(60px) rotate(-315deg);
        transform: rotate(315deg) translate(60px) rotate(-315deg)
    }
}

@keyframes cardPayiOS2_2 {
    0% {
        -webkit-transform: rotate(-45deg) translate(60px) rotate(45deg);
        transform: rotate(-45deg) translate(60px) rotate(45deg)
    }
    30% {
        -webkit-transform: rotate(-45deg) translate(60px) rotate(45deg);
        transform: rotate(-45deg) translate(60px) rotate(45deg)
    }
    40% {
        -webkit-transform: rotate(45deg) translate(60px) rotate(-45deg);
        transform: rotate(45deg) translate(60px) rotate(-45deg)
    }
    50% {
        -webkit-transform: rotate(45deg) translate(60px) rotate(-45deg);
        transform: rotate(45deg) translate(60px) rotate(-45deg)
    }
    60% {
        -webkit-transform: rotate(135deg) translate(60px) rotate(-135deg);
        transform: rotate(135deg) translate(60px) rotate(-135deg)
    }
    70% {
        -webkit-transform: rotate(135deg) translate(60px) rotate(-135deg);
        transform: rotate(135deg) translate(60px) rotate(-135deg)
    }
    80% {
        -webkit-transform: rotate(225deg) translate(60px) rotate(-225deg);
        transform: rotate(225deg) translate(60px) rotate(-225deg)
    }
    90% {
        -webkit-transform: rotate(225deg) translate(60px) rotate(-225deg);
        transform: rotate(225deg) translate(60px) rotate(-225deg)
    }
    100% {
        -webkit-transform: rotate(315deg) translate(60px) rotate(-315deg);
        transform: rotate(315deg) translate(60px) rotate(-315deg)
    }
}

@-webkit-keyframes cardPayiOS2_3 {
    0% {
        -webkit-transform: rotate(-225deg) translate(60px) rotate(225deg);
        transform: rotate(-225deg) translate(60px) rotate(225deg)
    }
    30% {
        -webkit-transform: rotate(-225deg) translate(60px) rotate(225deg);
        transform: rotate(-225deg) translate(60px) rotate(225deg)
    }
    40% {
        -webkit-transform: rotate(-135deg) translate(60px) rotate(135deg);
        transform: rotate(-135deg) translate(60px) rotate(135deg)
    }
    50% {
        -webkit-transform: rotate(-135deg) translate(60px) rotate(135deg);
        transform: rotate(-135deg) translate(60px) rotate(135deg)
    }
    60% {
        -webkit-transform: rotate(-45deg) translate(60px) rotate(45deg);
        transform: rotate(-45deg) translate(60px) rotate(45deg)
    }
    70% {
        -webkit-transform: rotate(-45deg) translate(60px) rotate(45deg);
        transform: rotate(-45deg) translate(60px) rotate(45deg)
    }
    80% {
        -webkit-transform: rotate(45deg) translate(60px) rotate(-45deg);
        transform: rotate(45deg) translate(60px) rotate(-45deg)
    }
    90% {
        -webkit-transform: rotate(45deg) translate(60px) rotate(-45deg);
        transform: rotate(45deg) translate(60px) rotate(-45deg)
    }
    100% {
        -webkit-transform: rotate(135deg) translate(60px) rotate(-135deg);
        transform: rotate(135deg) translate(60px) rotate(-135deg)
    }
}

@keyframes cardPayiOS2_3 {
    0% {
        -webkit-transform: rotate(-225deg) translate(60px) rotate(225deg);
        transform: rotate(-225deg) translate(60px) rotate(225deg)
    }
    30% {
        -webkit-transform: rotate(-225deg) translate(60px) rotate(225deg);
        transform: rotate(-225deg) translate(60px) rotate(225deg)
    }
    40% {
        -webkit-transform: rotate(-135deg) translate(60px) rotate(135deg);
        transform: rotate(-135deg) translate(60px) rotate(135deg)
    }
    50% {
        -webkit-transform: rotate(-135deg) translate(60px) rotate(135deg);
        transform: rotate(-135deg) translate(60px) rotate(135deg)
    }
    60% {
        -webkit-transform: rotate(-45deg) translate(60px) rotate(45deg);
        transform: rotate(-45deg) translate(60px) rotate(45deg)
    }
    70% {
        -webkit-transform: rotate(-45deg) translate(60px) rotate(45deg);
        transform: rotate(-45deg) translate(60px) rotate(45deg)
    }
    80% {
        -webkit-transform: rotate(45deg) translate(60px) rotate(-45deg);
        transform: rotate(45deg) translate(60px) rotate(-45deg)
    }
    90% {
        -webkit-transform: rotate(45deg) translate(60px) rotate(-45deg);
        transform: rotate(45deg) translate(60px) rotate(-45deg)
    }
    100% {
        -webkit-transform: rotate(135deg) translate(60px) rotate(-135deg);
        transform: rotate(135deg) translate(60px) rotate(-135deg)
    }
}

@-webkit-keyframes cardPayiOS2_4 {
    0% {
        -webkit-transform: rotate(45deg) translate(60px) rotate(-45deg);
        transform: rotate(45deg) translate(60px) rotate(-45deg)
    }
    30% {
        -webkit-transform: rotate(45deg) translate(60px) rotate(-45deg);
        transform: rotate(45deg) translate(60px) rotate(-45deg)
    }
    40% {
        -webkit-transform: rotate(135deg) translate(60px) rotate(-135deg);
        transform: rotate(135deg) translate(60px) rotate(-135deg)
    }
    50% {
        -webkit-transform: rotate(135deg) translate(60px) rotate(-135deg);
        transform: rotate(135deg) translate(60px) rotate(-135deg)
    }
    60% {
        -webkit-transform: rotate(225deg) translate(60px) rotate(-225deg);
        transform: rotate(225deg) translate(60px) rotate(-225deg)
    }
    70% {
        -webkit-transform: rotate(225deg) translate(60px) rotate(-225deg);
        transform: rotate(225deg) translate(60px) rotate(-225deg)
    }
    80% {
        -webkit-transform: rotate(315deg) translate(60px) rotate(-315deg);
        transform: rotate(315deg) translate(60px) rotate(-315deg)
    }
    90% {
        -webkit-transform: rotate(315deg) translate(60px) rotate(-315deg);
        transform: rotate(315deg) translate(60px) rotate(-315deg)
    }
    100% {
        -webkit-transform: rotate(405deg) translate(60px) rotate(-405deg);
        transform: rotate(405deg) translate(60px) rotate(-405deg)
    }
}

@keyframes cardPayiOS2_4 {
    0% {
        -webkit-transform: rotate(45deg) translate(60px) rotate(-45deg);
        transform: rotate(45deg) translate(60px) rotate(-45deg)
    }
    30% {
        -webkit-transform: rotate(45deg) translate(60px) rotate(-45deg);
        transform: rotate(45deg) translate(60px) rotate(-45deg)
    }
    40% {
        -webkit-transform: rotate(135deg) translate(60px) rotate(-135deg);
        transform: rotate(135deg) translate(60px) rotate(-135deg)
    }
    50% {
        -webkit-transform: rotate(135deg) translate(60px) rotate(-135deg);
        transform: rotate(135deg) translate(60px) rotate(-135deg)
    }
    60% {
        -webkit-transform: rotate(225deg) translate(60px) rotate(-225deg);
        transform: rotate(225deg) translate(60px) rotate(-225deg)
    }
    70% {
        -webkit-transform: rotate(225deg) translate(60px) rotate(-225deg);
        transform: rotate(225deg) translate(60px) rotate(-225deg)
    }
    80% {
        -webkit-transform: rotate(315deg) translate(60px) rotate(-315deg);
        transform: rotate(315deg) translate(60px) rotate(-315deg)
    }
    90% {
        -webkit-transform: rotate(315deg) translate(60px) rotate(-315deg);
        transform: rotate(315deg) translate(60px) rotate(-315deg)
    }
    100% {
        -webkit-transform: rotate(405deg) translate(60px) rotate(-405deg);
        transform: rotate(405deg) translate(60px) rotate(-405deg)
    }
}

.myCheckCard-intro.new-type .obj-card.n3 {
    top: 20px;
    -webkit-transform: scale(0.9, 0.9);
    -ms-transform: scale(0.9, 0.9);
    transform: scale(0.9, 0.9);
    opacity: 1
}

.start .myCheckCard-intro.new-type .obj-card.n3 {
    -webkit-animation: bridgeCard3-1 3s infinite ease-in-out;
    animation: bridgeCard3-1 3s infinite ease-in-out
}

.usageMyCheckCard-item.start .myCheckCard-intro.new-type .obj-card.n1 {
    background-image: url("/resource/img/mmk/common/card/img_chkcard_01.png")
}

@-webkit-keyframes bridgeCard3-1 {
    0% {
        top: 20px
    }
    30% {
        top: 20px;
        -webkit-transform: scale(0.9, 0.9);
        transform: scale(0.9, 0.9);
        opacity: 1
    }
    50% {
        top: 50px;
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1);
        opacity: 1
    }
    82% {
        top: 50px;
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1);
        opacity: 1
    }
    95% {
        top: 20px;
        -webkit-transform: scale(0.9, 0.9);
        transform: scale(0.9, 0.9);
        opacity: 1
    }
}

@keyframes bridgeCard3-1 {
    0% {
        top: 20px
    }
    30% {
        top: 20px;
        -webkit-transform: scale(0.9, 0.9);
        transform: scale(0.9, 0.9);
        opacity: 1
    }
    50% {
        top: 50px;
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1);
        opacity: 1
    }
    82% {
        top: 50px;
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1);
        opacity: 1
    }
    95% {
        top: 20px;
        -webkit-transform: scale(0.9, 0.9);
        transform: scale(0.9, 0.9);
        opacity: 1
    }
}

.list-pay-group-divide {
    position: relative
}

.list-pay-group-divide:before {
    content: '';
    display: block;
    position: absolute;
    top: 1.6rem;
    left: 37%;
    bottom: 1.6rem;
    width: 2px;
    border-left: 2px dashed var(--color-g800, #414141)
}

.list-infobox-group.list-pay-group-divide .list-repay {
    width: 26.9rem
}

.list-infobox-group.list-pay-group-divide .list-repay+.img-box {
    max-width: 29.7rem
}

.list-infobox-group.list-pay-group-divide .list-repay .list-item:nth-child(2) {
    padding-left: 3.5rem
}

.list-infobox-group.list-pay-group-divide+.text-list-group2 {
    margin-top: 0;
    font-size: 1.5rem;
    color: var(--color-g700, #7d7d7d);
    line-height: 2.1rem
}

@media screen and (max-width: 375px) {
    .list-pay-group-divide:before {
        left: 35.5%
    }
}

.component-banner-feeling {
    position: relative;
    margin: 0 !important;
    padding: 0
}

.component-banner-feeling .swiper-slide {
    overflow-x: hidden;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.component-banner-feeling .swiper-slide * {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.component-banner-feeling .swiper-slide img {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    pointer-events: none
}

.component-banner-feeling .swiper-pagination {
    position: absolute;
    top: 0;
    left: 2rem;
    right: 2rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.component-banner-feeling .swiper-pagination .swiper-pagination-bullet {
    width: calc(25% - 4px);
    height: 4px;
    border-radius: 2px;
    overflow: hidden;
    background: var(--color-g200, #eee);
    z-index: 1;
    border: 0;
    margin-left: 0.5rem
}

.component-banner-feeling .swiper-pagination .swiper-pagination-bullet-active {
    background: var(--color-g200, #eee)
}

.component-banner-feeling .swiper-pagination .swiper-pagination-bullet .fill-item {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 2px;
    -webkit-transform: translateX(-100%);
    -ms-transform: translateX(-100%);
    transform: translateX(-100%)
}

.component-banner-feeling .swiper-pagination .swiper-pagination-bullet-active .fill-item {
    background: var(--color-g900, #141414);
    -webkit-animation: indicatorFill 5.0s linear forwards;
    animation: indicatorFill 5.0s linear forwards
}

.component-banner-feeling .swiper-pagination .swiper-pagination-bullet.filled .fill-item {
    background: var(--color-g900, #141414);
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0)
}

.component-banner-feeling .swiper-pagination .swiper-pagination-bullet.play {
    width: 1.2rem;
    height: 1.2rem;
    border: none;
    margin-top: -0.2rem;
    background: var(--path-solid-play) center center no-repeat;
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700);
    background-size: 7.2rem 1rem
}

.component-banner-feeling .swiper-pagination .swiper-pagination-bullet.stop {
    width: 1.2rem;
    height: 1.2rem;
    border: none;
    margin-top: -0.2rem;
    background: var(--path-solid-pause) center center no-repeat;
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700);
    background-size: 7.2rem 1rem
}

.component-banner-feeling .carousel-group .swiper-slide {
    height: auto
}

@keyframes indicatorFill {
    0% {
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%)
    }
    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}

.feeling-book-group {
    padding-top: 4rem
}

.feeling-book-group .title-group .title-field-page {
    font-size: 2.8rem
}

.feeling-book-group .txt-guide {
    position: relative;
    height: 5rem;
    font-size: 1.8rem;
    overflow: hidden
}

.feeling-book-group .txt-guide span {
    display: block;
    width: 100%;
    position: absolute;
    left: 0
}

.feeling-book-group .txt-guide .active01 {
    top: 0;
    opacity: 1
}

.feeling-book-group .txt-guide .active02 {
    top: -2rem;
    opacity: 0
}

.swiper-slide-active .feeling-book-group .txt-guide .active01 {
    top: 0;
    -webkit-animation: ani-textDown1 0.3s ease forwards;
    animation: ani-textDown1 0.3s ease forwards;
    -webkit-animation-delay: 2.5s;
    animation-delay: 2.5s
}

.swiper-slide-active .feeling-book-group .txt-guide .active02 {
    top: -2rem;
    opacity: 0;
    -webkit-animation: ani-textDown2 0.3s ease forwards;
    animation: ani-textDown2 0.3s ease forwards;
    -webkit-animation-delay: 2.5s;
    animation-delay: 2.5s
}

@keyframes ani-textDown1 {
    0% {
        top: 0;
        opacity: 1
    }
    100% {
        top: 2rem;
        opacity: 0
    }
}

@keyframes ani-textDown2 {
    0% {
        top: -2rem;
        opacity: 0
    }
    100% {
        top: 0;
        opacity: 1
    }
}

.feeling-emoji-box {
    width: 25rem;
    height: 25rem;
    margin: 8.2rem auto 0;
    display: block
}

.feeling-emoji-box ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.feeling-emoji-box ul li {
    width: 50%;
    height: 12.5rem;
    position: relative
}

.feeling-emoji-box ul li img {
    width: 100%;
    position: absolute;
    width: 0;
    height: 0;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.feeling-account .feeling-emoji-box ul li img,
.swiper-slide-active .feeling-emoji-box ul li img {
    width: 0;
    height: 0;
    -webkit-animation: imgSacle-ani 0.4s ease-in-out forwards;
    animation: imgSacle-ani 0.4s ease-in-out forwards
}

.feeling-emoji-box ul li.active01 img {
    -webkit-animation-delay: 1s;
    animation-delay: 1s
}

.feeling-emoji-box ul li.active02 img {
    -webkit-animation-delay: 1.5s;
    animation-delay: 1.5s
}

.feeling-emoji-box ul li.active03 img {
    -webkit-animation-delay: 2.0s;
    animation-delay: 2.0s
}

.feeling-emoji-box ul li.active04 img {
    -webkit-animation-delay: 2.5s;
    animation-delay: 2.5s
}

@-webkit-keyframes imgSacle-ani {
    0% {
        width: 0;
        height: 0
    }
    70% {
        width: 13.7rem;
        height: 13.7rem
    }
    100% {
        width: 12.5rem;
        height: 12.5rem
    }
}

@keyframes imgSacle-ani {
    0% {
        width: 0;
        height: 0
    }
    70% {
        width: 13.7rem;
        height: 13.7rem
    }
    100% {
        width: 12.5rem;
        height: 12.5rem
    }
}

.feeling-calendar-group {
    position: relative;
    width: 100%;
    padding: 5.2rem 2rem 0
}

.calendar-y-m {
    text-align: center;
    font-size: 3.6rem;
    color: var(--color-pb100, #000);
    font-weight: bold;
    padding-bottom: 2.1rem
}

.calendar-day-wrap,
.calendar-day-wrap img {
    max-width: 26.7rem;
    width: 100%;
    margin: 0 auto;
    overflow: hidden
}

.calendar-day-wrap.active01 {
    opacity: 1;
    height: auto
}

.calendar-day-wrap.active02 {
    opacity: 0;
    height: 0;
    position: relative
}

.swiper-slide-active .calendar-day-wrap.active01 {
    -webkit-animation: imgShow1-ani 0.5s linear forwards;
    animation: imgShow1-ani 0.5s linear forwards;
    -webkit-animation-delay: 2.1s;
    animation-delay: 2.1s
}

.swiper-slide-active .calendar-day-wrap.active02 {
    -webkit-animation: imgShow2-ani 0.5s linear forwards;
    animation: imgShow2-ani 0.5s linear forwards;
    -webkit-animation-delay: 2.6s;
    animation-delay: 2.6s
}

@-webkit-keyframes imgShow1-ani {
    0% {
        opacity: 1;
        height: auto
    }
    100% {
        opacity: 0;
        height: 0
    }
}

@keyframes imgShow1-ani {
    0% {
        opacity: 1;
        height: auto
    }
    100% {
        opacity: 0;
        height: 0
    }
}

@-webkit-keyframes imgShow2-ani {
    0% {
        opacity: 0;
        height: 0
    }
    100% {
        opacity: 1;
        height: auto
    }
}

@keyframes imgShow2-ani {
    0% {
        opacity: 0;
        height: 0
    }
    100% {
        opacity: 1;
        height: auto
    }
}

.calendar-day-wrap .img-bubble {
    opacity: 0;
    position: absolute;
    top: 1.2rem;
    right: 1.4rem;
    width: 15.5rem;
    height: 16.5rem;
    background: url(/resource/img/mmk/common/feeling/img_bubble.png) 0 0 no-repeat;
    background-size: 100%;
    z-index: 2
}

.swiper-slide-active .calendar-day-wrap .img-bubble {
    opacity: 0;
    -webkit-animation: imgShow3-ani 0.2s ease-in-out forwards;
    animation: imgShow3-ani 0.2s ease-in-out forwards;
    -webkit-animation-delay: 3.4s;
    animation-delay: 3.4s
}

@-webkit-keyframes imgShow3-ani {
    0% {
        opacity: 0;
        -webkit-transform: scale(0);
        transform: scale(0)
    }
    70% {
        opacity: 1;
        -webkit-transform: scale(1.2);
        transform: scale(1.2)
    }
    100% {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

@keyframes imgShow3-ani {
    0% {
        opacity: 0;
        -webkit-transform: scale(0);
        transform: scale(0)
    }
    70% {
        opacity: 1;
        -webkit-transform: scale(1.2);
        transform: scale(1.2)
    }
    100% {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

.calcAni-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 5.0rem
}

.calcAni-wrap .calcAni-y-wrap {
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 100%
}

.calcAni-wrap .calcAni-y {
    position: relative;
    width: 2.8rem;
    overflow: hidden;
    line-height: 4.6rem
}

.calcAni-wrap .calcAni-y .calcAni-y-item {
    display: block;
    word-break: break-all;
    line-height: 4.6rem
}

.calcAni-wrap .calcAni-y+.calcAni-y {
    margin-left: -0.3rem
}

.calcAni-wrap .calcAni-m-wrap {
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 100%
}

.calcAni-wrap .calcAni-m {
    position: relative;
    width: 5.0rem;
    overflow: hidden;
    line-height: 4.6rem
}

.calcAni-wrap .calcAni-m .calcAni-m-item {
    display: block;
    word-break: break-all;
    line-height: 4.6rem
}

.calcAni-date {
    overflow: hidden;
    position: absolute;
    width: 1px;
    height: 1px;
    font-size: 1px;
    line-height: 0;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    margin: -1px;
    padding: 0;
    border: 0
}

.feeling-chat-group {
    width: 100%;
    padding: 4.6rem 2rem 0
}

.feeling-chat-group .chat-txt {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: end;
    width: 100%
}

.feeling-chat-group .chat-txt.left {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    text-align: left
}

.feeling-chat-group .chat-txt.right {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    text-align: right
}

.feeling-chat-group .chat-txt:nth-child(1) {
    opacity: 0
}

.feeling-chat-group .chat-txt:nth-child(2) {
    padding: 1.6rem 0 0.6rem;
    opacity: 0
}

.feeling-chat-group .chat-txt:nth-child(3) {
    padding: 2.1rem 0 0;
    opacity: 0
}

.feeling-chat-group .chat-txt:nth-child(4) {
    padding: 2.1rem 0 0;
    opacity: 0
}

.swiper-slide-active .feeling-chat-group .chat-txt:nth-child(1) {
    opacity: 0;
    -webkit-animation: imgShow3-ani 0.4s linear forwards;
    animation: imgShow3-ani 0.4s linear forwards;
    -webkit-animation-delay: 1s;
    animation-delay: 1s
}

.swiper-slide-active .feeling-chat-group .chat-txt:nth-child(2) {
    width: 22.2rem;
    padding: 1.6rem 0 0.6rem;
    margin-left: auto;
    opacity: 0;
    -webkit-animation: imgShow3-ani 0.4s linear forwards;
    animation: imgShow3-ani 0.4s linear forwards;
    -webkit-animation-delay: 1.7s;
    animation-delay: 1.7s
}

.swiper-slide-active .feeling-chat-group .chat-txt:nth-child(2) img {
    width: 100%
}

.swiper-slide-active .feeling-chat-group .chat-txt:nth-child(3) {
    padding: 2.1rem 0 0;
    opacity: 0;
    -webkit-animation: imgShow3-ani 0.4s linear forwards;
    animation: imgShow3-ani 0.4s linear forwards;
    -webkit-animation-delay: 2.4s;
    animation-delay: 2.4s
}

.swiper-slide-active .feeling-chat-group .chat-txt:nth-child(4) {
    padding: 2.1rem 0 0;
    opacity: 0;
    -webkit-animation: imgShow3-ani 0.4s linear forwards;
    animation: imgShow3-ani 0.4s linear forwards;
    -webkit-animation-delay: 3.2s;
    animation-delay: 3.2s
}

.feeling-emoji-group {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-left: 13rem
}

.swiper-slide-active .feeling-emoji-group {
    margin-left: 13rem;
    -webkit-animation: left0to-emoji 0.3s linear forwards;
    animation: left0to-emoji 0.3s linear forwards;
    -webkit-animation-delay: 1s;
    animation-delay: 1s
}

.feeling-emoji-group .coin-ani {
    position: absolute;
    bottom: 45%;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    width: 4.4rem;
    height: 4.4rem;
    background: url(/resource/img/mmk/common/feeling/coin.svg) 0 0 no-repeat;
    background-size: 100%;
    z-index: 1;
    opacity: 0
}

.feeling-emoji-group>ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.swiper-slide-active .feeling-emoji-group>ul {
    -webkit-animation: left0to-emoji2 0.3s linear forwards;
    animation: left0to-emoji2 0.3s linear forwards;
    -webkit-animation-delay: 2.2s;
    animation-delay: 2.2s
}

.swiper-slide-active .feeling-emoji-group>ul li:first-child {
    -webkit-animation: left0to-emoji2 0.3s linear forwards;
    animation: left0to-emoji2 0.3s linear forwards;
    -webkit-animation-delay: 3.4s;
    animation-delay: 3.4s
}

.feeling-emoji-group>ul>li {
    width: 13rem;
    padding-top: 12.6rem
}

.feeling-emoji-group>ul>li img {
    width: 100%
}

.feeling-emoji-group .coin-ani.active01,
.feeling-emoji-group .coin-ani.active02 {
    opacity: 0;
    bottom: 45%
}

.swiper-slide-active .feeling-emoji-group .coin-ani.active01 {
    -webkit-animation: coinUp-ani 0.5s linear forwards;
    animation: coinUp-ani 0.5s linear forwards;
    -webkit-animation-delay: 1.5s;
    animation-delay: 1.5s
}

.swiper-slide-active .feeling-emoji-group .coin-ani.active02 {
    -webkit-animation: coinUp-ani 0.5s linear forwards;
    animation: coinUp-ani 0.5s linear forwards;
    -webkit-animation-delay: 2.7s;
    animation-delay: 2.7s
}

.swiper-slide-active .feeling-emoji-group .coin-ani.active03 {
    -webkit-animation: coinUp-ani 0.5s linear forwards;
    animation: coinUp-ani 0.5s linear forwards;
    -webkit-animation-delay: 3.9s;
    animation-delay: 3.9s
}

@-webkit-keyframes left0to-emoji {
    0% {
        margin-left: 13rem
    }
    100% {
        margin-left: 0
    }
}

@keyframes left0to-emoji {
    0% {
        margin-left: 13rem
    }
    100% {
        margin-left: 0
    }
}

@-webkit-keyframes left0to-emoji2 {
    0% {
        margin-left: 0
    }
    100% {
        margin-left: -26rem
    }
}

@keyframes left0to-emoji2 {
    0% {
        margin-left: 0
    }
    100% {
        margin-left: -26rem
    }
}

@-webkit-keyframes coinUp-ani {
    0% {
        opacity: 0;
        bottom: 45%
    }
    50% {
        opacity: 1;
        bottom: 63%
    }
    100% {
        opacity: 0;
        bottom: 70%
    }
}

@keyframes coinUp-ani {
    0% {
        opacity: 0;
        bottom: 45%
    }
    50% {
        opacity: 1;
        bottom: 63%
    }
    100% {
        opacity: 0;
        bottom: 70%
    }
}

.feeling-account {
    text-align: center
}

.feeling-account .component-prd-txt-group .hash {
    line-height: 2.4rem;
    color: var(--color-g800, #414141);
    font-weight: 500
}

.feeling-account .component-prd-txt-group .txt01 {
    font-size: 3rem;
    line-height: 4.2rem;
    padding: 0;
    color: var(--color-g900, #141414);
    font-weight: 500
}

.feeling-account .component-prd-txt-group .hash+.txt01,
.feeling-account .component-prd-txt-group .txt01+.hash {
    margin-top: 1.2rem
}

.feeling-account .component-prd-txt-group .txt01+.hash>[data-ani-type="up"] {
    font-size: 1.6rem;
    line-height: 2.4rem
}

.feeling-account.view01 {
    margin-top: 2.4rem
}

.feeling-account.view01 .component-prd-txt-group {
    padding: 0;
    background-color: var(--color-w100, #fff)
}

.feeling-account.view01 .component-prd-txt-group .hash {
    font-size: 1.8rem;
    color: var(--color-g700, #7d7d7d);
    font-weight: 700;
    line-height: 2.5rem
}

.feeling-account.view01 .component-prd-txt-group .txt01 {
    font-size: 3.2rem;
    font-weight: 700;
    line-height: 4.2rem
}

.feeling-account.view01 .feeling-emoji-box {
    position: relative;
    height: 34.8rem;
    margin: 2rem auto 0
}

.feeling-account.view01 .feeling-emoji-box ul {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 100%
}

.feeling-account.view01 .feeling-emoji-box ul [class*="active"] img {
    width: 10.625rem;
    height: 10.625rem;
    -webkit-animation-delay: 0s !important;
    animation-delay: 0s !important;
    -webkit-animation: imgSacle-ani-new 0.4s ease-in-out forwards;
    animation: imgSacle-ani-new 0.4s ease-in-out forwards
}

.feeling-account.view01 .feeling-book-group {
    margin-top: 2.4rem;
    padding-top: 0
}

@-webkit-keyframes imgSacle-ani-new {
    0% {
        width: 10.625rem;
        height: 10.625rem
    }
    100% {
        width: 12.5rem;
        height: 12.5rem
    }
}

@keyframes imgSacle-ani-new {
    0% {
        width: 10.625rem;
        height: 10.625rem
    }
    100% {
        width: 12.5rem;
        height: 12.5rem
    }
}

.feeling-account.view02 {
    padding: 8rem 2.4rem 4rem;
    background-color: var(--color-pn, #17008c)
}

.feeling-account.view02 .calendar-day-wrap .img-bubble {
    top: 2.6rem;
    background: url(/resource/img/mmk/common/feeling/img_bubble_new.png) 0 0 no-repeat;
    background-size: 100%
}

.feeling-account.view02 .calcAni-wrap .calcAni-y+.calcAni-y {
    margin-left: -0.5rem
}

.feeling-account.view02 .calcAni-wrap .calcAni-m .calcAni-m-item {
    letter-spacing: -0.2rem
}

.feeling-account.view02 .component-prd-txt-group {
    padding: 0
}

.feeling-account.view02 .component-prd-txt-group .hash,
.feeling-account.view02 .component-prd-txt-group .txt01 {
    color: var(--color-w65, #fffFFFA5)
}

.feeling-account.view02 .feeling-calendar-group {
    margin-top: 4rem;
    padding: 2.8rem 0 4.8rem;
    height: 41.8rem;
    background-color: var(--color-cg300, #f1f6fb);
    border-radius: 2rem
}

.feeling-account.view02 .feeling-view02 .active .calendar-day-wrap.active01 {
    -webkit-animation: imgShow1-ani 0.5s linear forwards;
    animation: imgShow1-ani 0.5s linear forwards;
    -webkit-animation-delay: 1.5s;
    animation-delay: 1.5s
}

.feeling-account.view02 .feeling-view02 .active .calendar-day-wrap.active02 {
    -webkit-animation: imgShow2-1-ani 0.5s forwards;
    animation: imgShow2-1-ani 0.5s forwards;
    -webkit-animation-delay: 2s;
    animation-delay: 2s
}

.feeling-account.view02 .feeling-view02 .active .calendar-day-wrap .img-bubble {
    opacity: 0;
    -webkit-animation: imgShow3-ani 0.2s ease-in-out forwards;
    animation: imgShow3-ani 0.2s ease-in-out forwards;
    -webkit-animation-delay: 2.5s;
    animation-delay: 2.5s
}

@-webkit-keyframes imgShow2-1-ani {
    0% {
        opacity: 1;
        height: auto
    }
    100% {
        opacity: 1;
        height: auto
    }
}

@keyframes imgShow2-1-ani {
    0% {
        opacity: 1;
        height: auto
    }
    100% {
        opacity: 1;
        height: auto
    }
}

.feeling-account.view03 .component-prd-txt-group {
    padding: 8rem 0 0;
    background-color: var(--color-w100, #fff)
}

.feeling-account.view03 .feeling-emoji-group {
    margin: 0;
    padding: 12.7rem 0 16rem
}

.feeling-account.view03 .component-prd-txt-group [data-role="animation-item"] [class^="prd-effect"] {
    color: var(--color-bu900, #003fc7);
    font-weight: 500
}

.feeling-account.view03 .feeling-view03 .active .feeling-emoji-group .coin-ani.active00 {
    bottom: 29rem;
    -webkit-animation: coinUp-ani2 1.3s linear infinite;
    animation: coinUp-ani2 1.3s linear infinite
}

.component-carousel-feeling {
    overflow: hidden
}

.component-carousel-feeling .swiper-container {
    margin: 0 -2.4rem
}

.component-carousel-feeling .swiper-slide {
    max-width: 13rem
}

.component-carousel-feeling .swiper-slide img {
    width: 100%
}

@-webkit-keyframes coinUp-ani2 {
    0% {
        opacity: 0;
        bottom: 29rem
    }
    75% {
        opacity: 1;
        bottom: 34rem
    }
    85% {
        opacity: 0;
        bottom: 34rem
    }
    100% {
        opacity: 0
    }
}

@keyframes coinUp-ani2 {
    0% {
        opacity: 0;
        bottom: 29rem
    }
    75% {
        opacity: 1;
        bottom: 34rem
    }
    85% {
        opacity: 0;
        bottom: 34rem
    }
    100% {
        opacity: 0
    }
}

.feeling-account.view04 .component-prd-txt-group {
    padding: 8rem 0 0;
    background-color: var(--color-cg300, #f1f6fb)
}

.feeling-account.view04 .component-prd-txt-group [data-role="animation-item"] [class^="prd-effect"] {
    color: var(--color-bu900, #003fc7);
    font-weight: 500
}

.feeling-account.view04 .feeling-chat-group {
    padding: 7rem 2rem 8rem;
    background-color: var(--color-cg300, #f1f6fb)
}

.feeling-account.view04 .feeling-chat-group .chat-txt {
    opacity: 1
}

.feeling-account.view04 .feeling-chat-group .chat-txt.left img {
    -webkit-transform: translateX(-100%);
    -ms-transform: translateX(-100%);
    transform: translateX(-100%);
    opacity: 0
}

.feeling-account.view04 .feeling-chat-group .chat-txt.right img {
    -webkit-transform: translateX(100%);
    -ms-transform: translateX(100%);
    transform: translateX(100%);
    opacity: 0
}

.feeling-account.view04 .feeling-view04 .active .feeling-chat-group .chat-txt:nth-child(1) img {
    -webkit-animation: imgShow4-ani-left 0.4s ease-in-out forwards;
    animation: imgShow4-ani-left 0.4s ease-in-out forwards;
    width: 11.8rem
}

.feeling-account.view04 .feeling-view04 .active .feeling-chat-group .chat-txt:nth-child(2) img {
    -webkit-animation: imgShow4-ani-right 0.4s ease-in-out forwards;
    animation: imgShow4-ani-right 0.4s ease-in-out forwards;
    -webkit-animation-delay: 0.6s;
    animation-delay: 0.6s;
    width: calc(97.6rem/4)
}

.feeling-account.view04 .feeling-view04 .active .feeling-chat-group .chat-txt:nth-child(3) img {
    -webkit-animation: imgShow4-ani-right 0.4s ease-in-out forwards;
    animation: imgShow4-ani-right 0.4s ease-in-out forwards;
    -webkit-animation-delay: 1.2s;
    animation-delay: 1.2s;
    width: 26.9rem
}

.feeling-account.view04 .feeling-view04 .active .feeling-chat-group .chat-txt:nth-child(4) img {
    -webkit-animation: imgShow4-ani-left 0.4s ease-in-out forwards;
    animation: imgShow4-ani-left 0.4s ease-in-out forwards;
    -webkit-animation-delay: 1.8s;
    animation-delay: 1.8s;
    width: 14rem
}

@-webkit-keyframes imgShow4-ani-left {
    0% {
        opacity: 0;
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%)
    }
    70% {
        opacity: 1
    }
    100% {
        opacity: 1;
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}

@keyframes imgShow4-ani-left {
    0% {
        opacity: 0;
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%)
    }
    70% {
        opacity: 1
    }
    100% {
        opacity: 1;
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}

@-webkit-keyframes imgShow4-ani-right {
    0% {
        opacity: 0;
        -webkit-transform: translateX(100%);
        transform: translateX(100%)
    }
    70% {
        opacity: 1
    }
    100% {
        opacity: 1;
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}

@keyframes imgShow4-ani-right {
    0% {
        opacity: 0;
        -webkit-transform: translateX(100%);
        transform: translateX(100%)
    }
    70% {
        opacity: 1
    }
    100% {
        opacity: 1;
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}

.component-banner-feeling .feeling-account .title-group .title-field-page [data-ani-type="up"] {
    display: block;
    -webkit-transform: translateY(30%);
    -ms-transform: translateY(30%);
    transform: translateY(30%);
    opacity: 0;
    white-space: nowrap
}

.component-banner-feeling [data-role="animation-item"].active [data-ani-type="up"] {
    -webkit-animation: ani-up .3s linear forwards;
    animation: ani-up .3s linear forwards
}

.component-banner-feeling [data-role="animation-item"].active [class^="prd-effect"] {
    color: var(--color-w100, #fff)
}

.intrt-flag {
    font-size: 1.3rem;
    color: var(--color-bu900, #003fc7);
    font-weight: 500;
    margin: 0 -0.5rem
}

.cgbox-prd-detail .component-prd-txt-group {
    padding: 7.2rem 0 7.2rem
}

.cgbox-prd-detail.view01 .component-prd-txt-group {
    padding: 2.4rem 0 3.6rem;
    background-color: var(--color-w100, #fff)
}

.cgbox-prd-detail.view03 .component-prd-txt-group {
    background-color: var(--color-w100, #fff)
}

.cgbox-prd-detail.view04 .component-prd-txt-group {
    background-color: #f8f8f8
}

.cgbox-prd-detail .component-prd-txt-group .txt01 {
    line-height: 4.2rem;
    font-weight: 500
}

.cgbox-prd-detail .component-prd-txt-group .txt01 [data-ani-type="up"]>strong {
    margin-right: -0.6rem
}

.cgbox-prd-detail .component-prd-txt-group .txt02 {
    color: #fff
}

.cgbox-prd-detail.view01 .component-prd-txt-group .hash+.txt01 {
    margin-top: 1.2rem
}

.cgbox-prd-detail.view01 .component-prd-txt-group .hash {
    font-size: 1.8rem;
    color: var(--color-g700, #7d7d7d);
    font-weight: 700;
    line-height: 2.5rem
}

:root .cgbox-prd-detail.view01 .component-prd-txt-group .hash {
    color: var(--txt-qua, #67748e)
}

.cgbox-prd-detail.view01 .btn-link-ty {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: .2rem;
    line-height: 1.6rem;
    height: 1.6rem
}

.cgbox-prd-detail.view01 .btn-link-ty span {
    color: var(--txt-qua, #67748e)
}

.cgbox-prd-detail.view01 .btn-link-ty:after {
    content: '';
    display: inline-block;
    width: 1.4rem;
    height: 1.4rem;
    background: var(--path-line-chevron-right) center no-repeat;
    background-size: contain;
    opacity: 0.5
}

.cgbox-prd-detail.view01 .component-prd-txt-group .txt01 {
    font-weight: 700;
    color: var(--color-g900, #141414)
}

.cgbox-prd-detail.view03 .component-prd-txt-group .txt01,
.cgbox-prd-detail.view04 .component-prd-txt-group .txt01 {
    color: #141414;
    font-weight: 500
}

.cgbox-prd-detail.view03 .component-prd-txt-group .txt02,
.cgbox-prd-detail.view04 .component-prd-txt-group .txt02 {
    color: #141414
}

.cgbox-prd-detail .component-prd-motion {
    margin-top: 6.4rem;
    padding: 0
}

.cgbox-prd-detail.view01 .component-prd-motion {
    margin: 0
}

.cgbox-prd-detail.view01 .component-prd-info {
    padding: 0
}

.cgbox-flip-group {
    margin: 4rem auto;
    width: 24rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.cgbox-flip-group .col-card-bnr {
    padding: 1rem;
    text-align: center
}

.cgbox-flip-group .col-card-bnr .flip {
    position: relative;
    width: 9.6rem;
    height: 9.6rem;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-perspective-origin: 50% 50%;
    perspective-origin: 50% 50%;
    -webkit-transition: ease-in-out;
    -o-transition: ease-in-out;
    transition: ease-in-out
}

.cgbox-flip-group .col-card-bnr .flip .back,
.cgbox-flip-group .col-card-bnr .flip .front {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    border-radius: 1.6rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.cgbox-flip-group .col-card-bnr .flip .front {
    background: var(--color-w100, #fff);
    -webkit-box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08)
}

.cgbox-flip-group .col-card-bnr .flip [class*="ico-thumbnail"] {
    width: 5.6rem;
    height: 5.6rem
}

.cgbox-flip-group .col-card-bnr .flip .back {
    background: var(--color-in700, #5c59f9);
    -webkit-transform: rotateY(180deg);
    transform: rotateY(180deg)
}

.cgbox-flip-group .col-card-bnr .flip .back .txt {
    font-size: 2.1rem;
    font-weight: 700;
    color: var(--color-w100, #fff)
}

.active .cgbox-flip-group .col-card-bnr .flip {
    -webkit-animation: cardFlip2 4s ease-in-out forwards;
    animation: cardFlip2 4s ease-in-out forwards;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite
}

.active .cgbox-flip-group .col-card-bnr:nth-child(1) .flip {
    -webkit-animation-delay: 0s;
    animation-delay: 0s
}

.active .cgbox-flip-group .col-card-bnr:nth-child(2) .flip {
    -webkit-animation-delay: 1s;
    animation-delay: 1s
}

.active .cgbox-flip-group .col-card-bnr:nth-child(4) .flip {
    -webkit-animation-delay: 2.0s;
    animation-delay: 2.0s
}

.active .cgbox-flip-group .col-card-bnr:nth-child(3) .flip {
    -webkit-animation-delay: 3s;
    animation-delay: 3s
}

@-webkit-keyframes cardFlip2 {
    0% {
        -webkit-transform: rotateY(0);
        transform: rotateY(0)
    }
    15% {
        -webkit-transform: rotateY(0);
        transform: rotateY(0)
    }
    25% {
        -webkit-transform: rotateY(180deg);
        transform: rotateY(180deg)
    }
    40% {
        -webkit-transform: rotateY(180deg);
        transform: rotateY(180deg)
    }
    50% {
        -webkit-transform: rotateY(0);
        transform: rotateY(0)
    }
    100% {
        -webkit-transform: rotateY(0);
        transform: rotateY(0)
    }
}

@keyframes cardFlip2 {
    0% {
        -webkit-transform: rotateY(0);
        transform: rotateY(0)
    }
    15% {
        -webkit-transform: rotateY(0);
        transform: rotateY(0)
    }
    25% {
        -webkit-transform: rotateY(180deg);
        transform: rotateY(180deg)
    }
    40% {
        -webkit-transform: rotateY(180deg);
        transform: rotateY(180deg)
    }
    50% {
        -webkit-transform: rotateY(0);
        transform: rotateY(0)
    }
    100% {
        -webkit-transform: rotateY(0);
        transform: rotateY(0)
    }
}

.cgbox-flip-group.ty01 img {
    width: 100%
}

.cgbox-flip-group.ty01 .col-card-bnr {
    padding: .8rem
}

.cgbox-flip-group.ty01 .col-card-bnr .flip {
    width: 10rem;
    height: 10rem
}

.cgbox-flip-group.ty01 .col-card-bnr .flip .front {
    -webkit-box-shadow: none;
    box-shadow: none
}

.cgbox-flip-group.ty01 .col-card-bnr .flip .back {
    background: var(--color-w100)
}

.component-carousel-cgbox {
    padding: 2.4rem 0;
    overflow: hidden
}

.component-carousel-cgbox .swiper-container {
    margin: 0 -2rem
}

.component-carousel-cgbox .swiper-slide {
    max-width: 16.2rem
}

.component-carousel-cgbox .swiper-slide img {
    width: 100%
}

.cgbox-step-anibox {
    position: relative;
    margin-top: 5rem;
    width: 32rem;
    display: -webkit-inline-box !important;
    display: -ms-inline-flexbox !important;
    display: inline-flex !important;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.cgbox-step-anibox .items-wrap {
    overflow: hidden;
    position: relative;
    z-index: 1;
    background: var(--color-w100, #fff);
    padding: 1rem 3rem 1rem 2rem;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.cgbox-step-anibox .items-wrap:before {
    content: '';
    position: absolute;
    z-index: 1;
    height: 6.4rem;
    top: 1rem;
    left: 6.2rem;
    right: 5rem;
    background: url("/resource/img/mmk/common/bg_step_line.png") repeat-x 0 -0.4rem;
    background-size: auto 9rem
}

.cgbox-step-anibox .item {
    position: relative;
    z-index: 3;
    width: 6.4rem;
    height: 6.4rem;
    background: var(--color-w100, #fff)
}

.cgbox-step-anibox .item:nth-child(3) {
    background: none
}

.cgbox-step-anibox .item img {
    width: 100%;
    height: 100%
}

.cgbox-step-anibox .item .img2 {
    position: absolute;
    left: 0;
    -webkit-transform: translateY(100%);
    -ms-transform: translateY(100%);
    transform: translateY(100%);
    opacity: 0
}

.cgbox-step-anibox .tooltip {
    position: absolute;
    z-index: 0;
    top: -5rem;
    right: 0.3rem;
    color: var(--color-w100, #fff);
    font-size: 1.4rem;
    font-weight: 700;
    padding: 1.2rem 1.6rem;
    border-radius: 1rem;
    background: var(--color-in700, #5c59f9);
    -webkit-transform: translateY(100%);
    -ms-transform: translateY(100%);
    transform: translateY(100%);
    opacity: 0
}

.cgbox-step-anibox .tooltip {
    width: auto;
    height: auto;
    margin-left: 0;
    line-height: 1.6rem
}

.cgbox-step-anibox .tooltip:after {
    content: '';
    position: absolute;
    bottom: -0.7rem;
    left: 50%;
    margin-left: -0.9rem;
    width: 1.8rem;
    height: 1.8rem;
    border-radius: 0.3rem;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    background: var(--color-in700, #5c59f9)
}

.cgbox-step-anibox .twinkle {
    position: absolute;
    z-index: 1;
    top: 50%;
    -webkit-transform: translateY(-51%);
    -ms-transform: translateY(-51%);
    transform: translateY(-51%);
    margin-right: -2.7rem;
    right: 0;
    width: 18rem;
    height: 18rem
}

.active .cgbox-step-anibox .item .img1 {
    opacity: 0
}

.active .cgbox-step-anibox .item .img2 {
    -webkit-animation: anibox-up 0.8s ease-in-out 0.3s forwards;
    animation: anibox-up 0.8s ease-in-out 0.3s forwards
}

.active .cgbox-step-anibox .item:nth-child(1) .img1 {
    -webkit-transition: opacity 0.5s 0.6s ease;
    -o-transition: opacity 0.5s 0.6s ease;
    transition: opacity 0.5s 0.6s ease
}

.active .cgbox-step-anibox .item:nth-child(2) .img1 {
    -webkit-transition: opacity 0.5s 1.2s ease;
    -o-transition: opacity 0.5s 1.2s ease;
    transition: opacity 0.5s 1.2s ease
}

.active .cgbox-step-anibox .item:nth-child(3) .img1 {
    -webkit-transition: opacity 0.5s 1.8s ease;
    -o-transition: opacity 0.5s 1.8s ease;
    transition: opacity 0.5s 1.8s ease
}

.active .cgbox-step-anibox .item:nth-child(1) .img2 {
    -webkit-animation-delay: 0.6s;
    animation-delay: 0.6s
}

.active .cgbox-step-anibox .item:nth-child(2) .img2 {
    -webkit-animation-delay: 1.2s;
    animation-delay: 1.2s
}

.active .cgbox-step-anibox .item:nth-child(3) .img2 {
    -webkit-animation-delay: 1.8s;
    animation-delay: 1.8s
}

.active .cgbox-step-anibox .tooltip {
    -webkit-animation-delay: 2.4s !important;
    animation-delay: 2.4s !important;
    -webkit-animation: anibox-up 0.5s ease-in-out 0.3s forwards;
    animation: anibox-up 0.5s ease-in-out 0.3s forwards
}

@-webkit-keyframes anibox-up {
    0% {
        -webkit-transform: translateY(100%);
        transform: translateY(100%);
        opacity: 0
    }
    70% {
        -webkit-transform: translateY(-10%);
        transform: translateY(-10%);
        opacity: 1
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1
    }
}

@keyframes anibox-up {
    0% {
        -webkit-transform: translateY(100%);
        transform: translateY(100%);
        opacity: 0
    }
    70% {
        -webkit-transform: translateY(-10%);
        transform: translateY(-10%);
        opacity: 1
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1
    }
}

.cgbox-week-group {
    margin: 0 auto;
    height: 14.6rem;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    overflow: hidden
}

.cgbox-week-group li {
    width: 5.2rem;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.cgbox-week-group li+li {
    margin-left: 2rem
}

.cgbox-week-group li .week {
    margin-bottom: 0.8rem;
    font-weight: 700
}

.cgbox-week-group li .check {
    position: relative;
    margin-bottom: 0.6rem;
    width: 5.2rem;
    height: 2.8rem;
    border-radius: 1rem;
    border: 2px solid var(--color-in800, #4946f7);
    background: var(--color-in700, #5c59f9);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.cgbox-week-group li .check:before {
    content: '';
    opacity: 0;
    display: inline-block;
    width: 1.6rem;
    height: 1.6rem;
    background-image: var(--path-solid-plus);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain
}

.cgbox-week-group li .check:after {
    content: '';
    z-index: -1;
    display: block;
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    opacity: 0;
    background: -o-linear-gradient(335deg, rgba(255, 255, 255, 0) 20%, rgba(255, 255, 255, 0.3) 35%, rgba(255, 255, 255, 0) 50%);
    background: linear-gradient(115deg, rgba(255, 255, 255, 0) 20%, rgba(255, 255, 255, 0.3) 35%, rgba(255, 255, 255, 0) 50%);
    background-size: 200% 100%
}

.cgbox-week-group li .stick {
    width: 5.2rem;
    height: 8.5rem;
    border-radius: 1rem 1rem 0 0;
    background: var(--color-in700, #5c59f9);
    opacity: 0.16
}

.cgbox-week-group li.action3,
.cgbox-week-group li.action4 {
    opacity: 0;
    -webkit-transform: translateY(200%);
    -ms-transform: translateY(200%);
    transform: translateY(200%)
}

.active .cgbox-week-group .action1 .week {
    -webkit-animation: week-color 3.5s ease-in-out forwards;
    animation: week-color 3.5s ease-in-out forwards;
    -webkit-animation-delay: 0.8s;
    animation-delay: 0.8s
}

.active .cgbox-week-group .action1 .stick {
    -webkit-animation: stick-color 3.5s ease-in-out forwards;
    animation: stick-color 3.5s ease-in-out forwards;
    -webkit-animation-delay: 0.8s;
    animation-delay: 0.8s
}

.cgbox-week-group {
    -webkit-transform: translateX(25%);
    -ms-transform: translateX(25%);
    transform: translateX(25%)
}

.active .cgbox-week-group {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
    -webkit-transition: all 0.6s 1s ease-in-out;
    -o-transition: all 0.6s 1s ease-in-out;
    transition: all 0.6s 1s ease-in-out
}

.active .cgbox-week-group .action1 .stick {
    height: 0.2rem;
    -webkit-transition: all 0.6s 1.6s ease-in-out;
    -o-transition: all 0.6s 1.6s ease-in-out;
    transition: all 0.6s 1.6s ease-in-out
}

.active .cgbox-week-group .action3,
.active .cgbox-week-group .action4 {
    -webkit-animation: stick-up 0.6s ease-in-out forwards;
    animation: stick-up 0.6s ease-in-out forwards
}

.active .cgbox-week-group .action3 {
    -webkit-animation-delay: 1.6s;
    animation-delay: 1.6s
}

.active .cgbox-week-group .action4 {
    -webkit-animation-delay: 1.8s;
    animation-delay: 1.8s
}

.cgbox-week-group li:not(.action1) .week {
    -webkit-transform: translateY(3.2rem);
    -ms-transform: translateY(3.2rem);
    transform: translateY(3.2rem)
}

.active .cgbox-week-group li:not(.action1) .week {
    -webkit-animation: week-up 0.8s ease-in-out forwards;
    animation: week-up 0.8s ease-in-out forwards;
    -webkit-animation-delay: 1.8s;
    animation-delay: 1.8s
}

.cgbox-week-group .check {
    opacity: 0;
    -webkit-transform: translateY(200%);
    -ms-transform: translateY(200%);
    transform: translateY(200%)
}

.active .cgbox-week-group .check {
    -webkit-animation: check-up 0.8s ease-in-out forwards;
    animation: check-up 0.8s ease-in-out forwards;
    -webkit-animation-delay: 1.8s;
    animation-delay: 1.8s
}

.active .cgbox-week-group .check:before {
    opacity: 1;
    -webkit-transform: rotate(-360deg);
    -ms-transform: rotate(-360deg);
    transform: rotate(-360deg);
    -webkit-transition: all 0.8s 2s ease-in-out;
    -o-transition: all 0.8s 2s ease-in-out;
    transition: all 0.8s 2s ease-in-out
}

.active .cgbox-week-group .action3 .check,
.active .cgbox-week-group .action3 .week {
    -webkit-animation-delay: 2s;
    animation-delay: 2s
}

.active .cgbox-week-group .action4 .check,
.active .cgbox-week-group .action4 .week {
    -webkit-animation-delay: 2.2s;
    animation-delay: 2.2s
}

.active .cgbox-week-group .check:before {
    -webkit-animation: check-icon 1s ease-in-out forwards;
    animation: check-icon 1s ease-in-out forwards;
    -webkit-animation-delay: 3.5s;
    animation-delay: 3.5s
}

.active .cgbox-week-group .check:after {
    -webkit-animation: check-shine 0.6s linear forwards;
    animation: check-shine 0.6s linear forwards;
    -webkit-animation-delay: 3.5s;
    animation-delay: 3.5s
}

@-webkit-keyframes week-color {
    0% {
        color: var(--color-g900, #141414)
    }
    10% {
        color: var(--color-re700, #f02727)
    }
    90% {
        color: var(--color-re700, #f02727)
    }
    100% {
        color: var(--color-g900, #141414)
    }
}

@keyframes week-color {
    0% {
        color: var(--color-g900, #141414)
    }
    10% {
        color: var(--color-re700, #f02727)
    }
    90% {
        color: var(--color-re700, #f02727)
    }
    100% {
        color: var(--color-g900, #141414)
    }
}

@-webkit-keyframes stick-color {
    0% {
        background: var(--color-in700, #5c59f9)
    }
    10% {
        background: var(--color-re700, #f02727)
    }
    90% {
        background: var(--color-re700, #f02727)
    }
    100% {
        background: var(--color-in700, #5c59f9)
    }
}

@keyframes stick-color {
    0% {
        background: var(--color-in700, #5c59f9)
    }
    10% {
        background: var(--color-re700, #f02727)
    }
    90% {
        background: var(--color-re700, #f02727)
    }
    100% {
        background: var(--color-in700, #5c59f9)
    }
}

@-webkit-keyframes stick-up {
    0% {
        opacity: 0;
        -webkit-transform: translateY(200%);
        transform: translateY(200%)
    }
    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

@keyframes stick-up {
    0% {
        opacity: 0;
        -webkit-transform: translateY(200%);
        transform: translateY(200%)
    }
    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

@-webkit-keyframes week-up {
    0% {
        -webkit-transform: translateY(3.2rem);
        transform: translateY(3.2rem)
    }
    50% {
        -webkit-transform: translateY(-12%);
        transform: translateY(-12%)
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

@keyframes week-up {
    0% {
        -webkit-transform: translateY(3.2rem);
        transform: translateY(3.2rem)
    }
    50% {
        -webkit-transform: translateY(-12%);
        transform: translateY(-12%)
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

@-webkit-keyframes check-up {
    0% {
        opacity: 0;
        -webkit-transform: translateY(200%);
        transform: translateY(200%)
    }
    50% {
        opacity: 0.4;
        -webkit-transform: translateY(-12%);
        transform: translateY(-12%)
    }
    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

@keyframes check-up {
    0% {
        opacity: 0;
        -webkit-transform: translateY(200%);
        transform: translateY(200%)
    }
    50% {
        opacity: 0.4;
        -webkit-transform: translateY(-12%);
        transform: translateY(-12%)
    }
    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

@-webkit-keyframes check-icon {
    0% {
        opacity: 0.1;
        width: 1.2rem;
        height: 1.2rem;
        background-image: url("/resource/img/mmk/kds3/ico/solid/check_w.svg")
    }
    100% {
        opacity: 1;
        width: 1.2rem;
        height: 1.2rem;
        background-image: url("/resource/img/mmk/kds3/ico/solid/check_w.svg")
    }
}

@keyframes check-icon {
    0% {
        opacity: 0.1;
        width: 1.2rem;
        height: 1.2rem;
        background-image: url("/resource/img/mmk/kds3/ico/solid/check_w.svg")
    }
    100% {
        opacity: 1;
        width: 1.2rem;
        height: 1.2rem;
        background-image: url("/resource/img/mmk/kds3/ico/solid/check_w.svg")
    }
}

@-webkit-keyframes check-shine {
    0% {
        opacity: 0;
        left: -100%
    }
    10% {
        opacity: 1;
        left: -90%
    }
    99% {
        opacity: 1;
        left: 100%
    }
    100% {
        opacity: 0;
        left: 100%
    }
}

@keyframes check-shine {
    0% {
        opacity: 0;
        left: -100%
    }
    10% {
        opacity: 1;
        left: -90%
    }
    99% {
        opacity: 1;
        left: 100%
    }
    100% {
        opacity: 0;
        left: 100%
    }
}

.seg-case2 {
    display: none
}

.component-prd-acco .title-group+.table-layout-group {
    margin-top: 0.8rem
}

.btn-detail-view {
    position: relative;
    display: block;
    padding: 0 2rem;
    line-height: 6.6rem;
    font-size: 1.4rem;
    color: var(--color-g800, #414141);
    overflow: hidden;
    background-color: var(--color-w100, #fff);
    border: 1px solid var(--color-g300, #e0e0e0);
    border-radius: 1rem
}

.btn-detail-view .ico-arrow-open {
    position: absolute;
    top: 50%;
    right: 20px;
    -ms-transform: translateY(-50%) rotate(-90deg);
    transform: translateY(-50%) rotate(-90deg);
    -webkit-transform: translateY(-50%) rotate(-90deg)
}

.icon-list-group.prd .item-tap .ico-prod-04 {
    background: url(../../img/icon/icon_cs_email.png) 0 0 no-repeat;
    background-size: 85%;
    background-position: center 0.4rem
}

.component-prd-txt-group.type2 .prd-logo-img {
    width: 7.2rem;
    height: 7.2rem;
    margin-top: 4rem
}

.component-prd-txt-group.type2 .prd-logo-img img {
    width: 100%
}

.component-prd-icon {
    margin: 0 auto 3.6rem;
    text-align: center
}

.component-prd-info+.component-prd-icon {
    margin-top: -1.2rem
}

.repay-wrap .text-list-group+.list-infobox-group {
    margin-top: 2.5rem;
    padding-top: .5rem;
    border-top: 1px solid var(--color-g300, #e0e0e0)
}

.list-infobox-group .list-repay {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    -webkit-box-align: baseline;
    -ms-flex-align: baseline;
    align-items: baseline;
    max-width: 73%;
    margin: 0 auto
}

.list-infobox-group .list-repay .list-item {
    font-size: 1.4rem;
    color: var(--color-g700, #7d7d7d);
    text-align: center
}

.list-infobox-group .list-repay .list-item>span {
    display: block;
    margin: 0 auto .6rem;
    font-size: 2rem;
    color: var(--color-g900, #141414);
    font-weight: bold
}

.list-infobox-group .list-repay+.img-box {
    margin: 0 auto;
    padding: 1.6rem 0;
    max-width: 28rem
}

.list-infobox-group .list-repay+.img-box img {
    width: 100%
}

.pc .fnclPdDetail [class^="prd-detail-wrap"] {
    max-width: 940px;
    overflow-x: hidden
}

.pc .fnclPdDetail [class^="prd-detail-wrap"] .component-icon-list {
    display: none
}

.pc .fnclPdDetail [class^="prd-detail-wrap"] .component-text-simple.pt24 {
    padding: 2.4rem 0 0
}

.pc .fnclPdDetail .component-insu-info,
.pc .fnclPdDetail .component-prd-bne,
.pc .fnclPdDetail .component-prd-event .swiper-container,
.pc .fnclPdDetail .prd-detail-wrap.card+.prd-detail-wrap.prd-info,
.pc .fnclPdDetail .prd-detail-wrap.cs-box .component-prd-cs-box {
    padding: 0
}

.pc .fnclPdDetail .component-prd-notice {
    padding: 1.6rem 1rem
}

.pc .fnclPdDetail .component-prd-info {
    padding-left: 0;
    padding-right: 0
}

.pc .fnclPdDetail [class^="prd-detail-wrap"] .list-linebox-group .section-link {
    padding: 2rem 0
}

.pc .fnclPdDetail [class^="prd-detail-wrap"] .component-prd-cs-box .list-linebox-group .section-link {
    padding: 2rem 1.6rem 2rem 2rem
}

.pc .fnclPdDetail .txt-add-group.prd {
    padding: 2rem 0 3.6rem
}

.pc .fnclPdDetail .component-prd-event.type2 {
    display: none
}

.pc_show.component-btn.fixed-bottom.prd {
    left: 50%;
    width: 940px;
    max-width: 940px;
    margin-left: -470px;
    display: none !important
}

.pc .fnclPdDetail [class^="component-"].no-space-pc {
    padding: 0
}

.pc .pc_show.component-btn.fixed-bottom.prd.insu {
    display: block !important
}

.pc .component-text.insu {
    position: relative;
    min-height: 370px
}

.component-text.insu>.text-icon-group {
    margin-top: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 100%
}

.component-text.insu>.text-icon-group .text-icon-area {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.pc .fnclPdDetail .popup-dialog.ui-full {
    background-color: transparent
}

.pc .fnclPdDetail .popup-wrap.popActive:before {
    content: '';
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: var(--color-pb50, #0000007F);
    z-index: 83
}

.pc .fnclPdDetail .popup-wrap [class^="prd-view"] .popup-section {
    position: fixed;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 480px;
    border-radius: 12px;
    overflow: hidden
}

.pc .fnclPdDetail .popup-wrap [class^="prd-view"] .popup-group {
    max-height: 650px;
    overflow: auto
}

.pc .fnclPdDetail .popup-wrap [class^="prd-view"] .popup-header {
    width: 480px;
    z-index: 10
}

.pc .fnclPdDetail .popup-wrap [class^="prd-view"].ui-bottom .popup-group {
    position: relative;
    bottom: inherit
}

.pc .fnclPdDetail .popup-wrap [class^="prd-view"].ui-bottom .popup-inner {
    overflow-y: auto
}

.pc .fnclPdDetail [class^="prd-detail-wrap"] .list-linebox-group.prd .section-link {
    padding: 0
}

.pc .fnclPdDetail [class^="prd-detail-wrap"] .list-linebox-group.prd .list-item+.list-item .section-link {
    padding: 1.2rem 0 0
}

.pc_m .mobmweb_show.component-btn.fixed-bottom.prd {
    display: block
}

.mobileweb .component-prd-event.type2 {
    display: none
}

.mobile .fnclPdDetail [class^="prd-detail-wrap"] {
    overflow-x: hidden;
    background: var(--color-w100, #fff)
}

.mobile .fnclPdDetail [class^="prd-view"].ui-full {
    background: var(--color-w100, #fff)
}

.mobile .fnclPdDetail [class^="prd-view"] .popup-group:after,
.mobile .fnclPdDetail [class^="prd-view"] .popup-header {
    z-index: 4
}

.mobile .fpmfooter_menu a:before {
    position: inherit
}

.prd-pc.popup-wrap .popup-dialog {
    z-index: 1000 !important
}

.prd-pc .dimm {
    z-index: 999 !important
}

.mobile .pc_show.component-btn.fixed-bottom.prd {
    left: 0;
    margin-left: 0;
    width: 100%;
    max-width: 100%
}

.mobmweb_show.component-btn.fixed-bottom.prd,
.only_m.component-btn.fixed-bottom.prd {
    display: none
}

@media screen and (max-width: 320px) {
    .component-prd-txt-group .txt01 {
        font-size: 32px;
        margin-left: -2rem
    }
    .component-prd-txt-group .txt01>div {
        -webkit-transform: scale(0.85);
        -ms-transform: scale(0.85);
        transform: scale(0.85)
    }
    .component-prd-txt-group .txt01>div .txt-lv03 {
        font-size: 14px
    }
}

.ios.mobile .iphoneX.statusExpension #FPMDPT1800000100V .popup-dialog.ui-full.prd-view-pop01 .popup-group {
    padding-top: 4.4rem
}

.component-img.type2 {
    padding: 11.5rem 0
}

.component-img.type2 .img-account {
    margin: 0 auto;
    width: 20.9rem
}

.component-img.type2 .img-account img {
    width: 100%;
    display: block
}

.card-group.bg-gray2.type2 {
    border-radius: 1.6rem;
    text-align: center;
    padding: 3.6rem 0 2.4rem
}

.card-group.bg-gray2.type2+.card-group.bg-gray2.type2 {
    margin-top: 2.4rem
}

.card-group.bg-gray2.type2 .card-tit {
    margin-top: 1.2rem;
    font-size: 2.4rem;
    line-height: 3.3rem
}

.card-group.bg-gray2.type2 .card-txt {
    margin-top: 0.8rem;
    font-size: 1.6rem;
    line-height: 2.1rem
}

.card-group.bg-gray2.type2 .card-img-figure {
    margin-top: 1.2rem
}

.card-group.bg-gray2.type2 .card-img-figure img {
    width: 100%
}

.card-group.bg-gray2.type2 .card-img-figure .pension-img1 {
    margin: 0 auto;
    width: 21.6rem
}

.card-group.bg-gray2.type2 .card-img-figure .pension-img2 {
    margin: 0 auto;
    width: 18rem
}

.card-group.bg-gray2.type2 .card-img-figure .pension-img3 {
    margin: 0 auto;
    width: 16rem
}

.prd-detail-wrap .component-img.mt0 {
    margin-top: 0
}

.prd-detail-wrap .ico-my-account-4 {
    display: block;
    margin: 3.4rem auto;
    width: 22rem;
    height: 22rem;
    background: url("/resource/img/bim/my_account_4.png") 0 0 no-repeat;
    background-size: contain
}

.pension-prd-detail .component-prd-txt-group {
    padding: 8rem 0 8rem
}

.pension-prd-detail.view01 .component-prd-txt-group {
    padding: 2.4rem 0 3.6rem;
    background-color: var(--color-w100, #fff)
}

.pension-prd-detail.view01 .component-prd-txt-block .hash+.txt01 {
    padding-top: 1.2rem;
    line-height: 4.2rem
}

.pension-prd-detail.view01 .component-prd-txt-block .hash {
    font-size: 1.8rem;
    color: var(--color-g700, #7d7d7d);
    font-weight: 700;
    line-height: 2.5rem
}

.pension-prd-detail.view01 .component-prd-txt-block .txt01,
.pension-prd-detail.view03 .component-prd-txt-block .txt01 {
    font-weight: 700;
    color: var(--color-g900, #141414)
}

.pension-prd-detail.view01 .pension-ani-wrap {
    width: 37.5rem;
    margin: 0 auto;
    height: 35rem;
    position: relative
}

.pension-prd-detail.view01 .pension-ani-wrap span {
    display: block
}

.pension-prd-detail.view01 .pension-ani-wrap span>img {
    width: 100%
}

.pension-prd-detail.view01 .pension-ani-wrap .img01 {
    width: 33rem;
    position: absolute;
    left: -1rem;
    top: -3rem;
    opacity: 0;
    -webkit-transform: translate(-30rem, -8rem);
    -ms-transform: translate(-30rem, -8rem);
    transform: translate(-30rem, -8rem);
    -webkit-animation: pension-move02 0.5s ease-in-out forwards;
    animation: pension-move02 0.5s ease-in-out forwards;
    z-index: 2;
    -webkit-animation-delay: 0.5s;
    animation-delay: 0.5s
}

.pension-prd-detail.view01 .pension-ani-wrap .img02 {
    width: 27rem;
    position: absolute;
    right: 1.6rem;
    top: 9rem;
    z-index: 1;
    opacity: 0;
    -webkit-transform: translate(24rem, -8rem);
    -ms-transform: translate(24rem, -8rem);
    transform: translate(24rem, -8rem);
    -webkit-animation: pension-move01 0.5s ease-in-out forwards;
    animation: pension-move01 0.5s ease-in-out forwards;
    -webkit-animation-delay: 0s;
    animation-delay: 0s
}

.pension-prd-detail.view01 .pension-ani-wrap .img03 {
    width: 6.8rem;
    position: absolute;
    top: 7rem;
    right: 8rem;
    opacity: 0;
    -webkit-animation: pension-show 0.3s ease-in-out forwards;
    animation: pension-show 0.3s ease-in-out forwards;
    -webkit-animation-delay: 1s;
    animation-delay: 1s
}

.pension-prd-detail.view01 .pension-ani-wrap .img04 {
    width: 6.8rem;
    position: absolute;
    bottom: 7rem;
    left: 5rem;
    opacity: 0;
    -webkit-animation: pension-show 0.3s ease-in-out forwards;
    animation: pension-show 0.3s ease-in-out forwards;
    -webkit-animation-delay: 1.5s;
    animation-delay: 1.5s
}

@-webkit-keyframes pension-move01 {
    0% {
        -webkit-transform: translate(24rem, -8rem);
        transform: translate(24rem, -8rem);
        opacity: 0
    }
    100% {
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0);
        opacity: 1
    }
}

@keyframes pension-move01 {
    0% {
        -webkit-transform: translate(24rem, -8rem);
        transform: translate(24rem, -8rem);
        opacity: 0
    }
    100% {
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0);
        opacity: 1
    }
}

@-webkit-keyframes pension-move02 {
    0% {
        -webkit-transform: translate(-30rem, -8rem);
        transform: translate(-30rem, -8rem);
        opacity: 0
    }
    100% {
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0);
        opacity: 1
    }
}

@keyframes pension-move02 {
    0% {
        -webkit-transform: translate(-30rem, -8rem);
        transform: translate(-30rem, -8rem);
        opacity: 0
    }
    100% {
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0);
        opacity: 1
    }
}

@-webkit-keyframes pension-show {
    0% {
        opacity: 0
    }
    100% {
        opacity: 1
    }
}

@keyframes pension-show {
    0% {
        opacity: 0
    }
    100% {
        opacity: 1
    }
}

.pension-prd-detail.view01 .component-prd-info {
    padding-bottom: 0
}

.pension-prd-detail.view01 .sales-info-group.center[data-ani-type="up"] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.pension-prd-detail.view02 .component-prd-txt-block .txt01 {
    font-size: 3rem;
    line-height: 4.2rem;
    font-weight: 400
}

.pension-prd-detail.view02 .component-prd-txt-group:last-child {
    padding: 0 0 10rem;
    border-top: 1px solid var(--color-pn, #17008c);
    margin-top: -1px
}

.pension-prd-detail.view02 .component-prd-txt-block .tag {
    margin-bottom: 1rem;
    padding: 0.2rem 1rem 0;
    height: auto
}

.pension-prd-detail.view02 .component-prd-txt-block .tag .txt {
    font-size: 1.4rem;
    line-height: 2rem
}

.pension-prd-detail.view02 .pension-box {
    padding: 1.6rem 0 2.8rem;
    margin-top: 2.4rem;
    background-color: var(--color-w100, #fff);
    border-radius: 2rem
}

.pension-prd-detail.view02 .pension-box .pension-img1 {
    width: 20rem;
    height: 12rem;
    margin: 0 auto
}

.pension-prd-detail.view02 .pension-box .pension-img1>img {
    width: 100%;
    height: 100%
}

.pension-prd-detail.view02 .pension-box .pension-img2 {
    width: 11.6rem;
    margin: 0 auto
}

.pension-prd-detail.view02 .pension-box .pension-img2>img {
    width: 100%
}

.pension-prd-detail.view02 .pension-box .pension-text {
    font-size: 1.6rem;
    line-height: 2.4rem;
    font-weight: 500;
    color: var(--color-g800, #414141);
    margin-bottom: 2rem
}

.pension-prd-detail.view02 .pension-box .pension-text span {
    font-size: 1.2rem
}

.pension-prd-detail.view02 .pension-box .btn-under-link.block {
    margin: 0
}

.pension-prd-detail.view03 .component-prd-txt-group {
    background-color: var(--color-g100, #f8f8f8)
}

.pension-prd-detail.view03 .component-prd-txt-block .txt01 {
    font-size: 3rem;
    line-height: 3.6rem;
    font-weight: 500;
    padding-top: 0
}

.pension-prd-detail.view03 .component-prd-txt-block .txt02 {
    margin-top: 1.2rem;
    color: var(--color-g800, #414141);
    font-weight: 500
}

.pension-prd-detail.view03 .component-prd-motion {
    margin-top: 5.6rem
}

.pension-prd-detail.view03 .table-layout-group [class^="table-group"] {
    border-top: none;
    border-bottom: none
}

.pension-prd-detail.view03 .table-layout-group [class^="table-group"] th {
    padding: 2rem 0.5rem;
    background: none;
    font-size: 1.6rem;
    line-height: 2.1rem
}

.pension-prd-detail.view03 .table-layout-group [class^="table-group"] td {
    background: transparent
}

.pension-prd-detail.view03 .table-layout-group .table-group-row th.bold {
    background: var(--color-bu50, #e0f2ff);
    border-right: 1px solid var(--color-g700, #7d7d7d)
}

.pension-prd-detail.view03 .table-layout-group .table-group-row th+th {
    border-left: none;
    border-bottom: none
}

.pension-prd-detail.view03 .table-layout-group .bold {
    background: var(--color-bu50, #e0f2ff) !important
}

.pension-prd-detail.view03 .table-layout-group .table-group-row td {
    border-top: 1px dashed var(--color-g700, #7d7d7d);
    border-left: none;
    padding: 3rem 0.5rem;
    line-height: 2rem;
    font-weight: 500
}

.pension-prd-detail.view03 .table-layout-group .table-group-row tr:first-child td {
    border-top: 1px solid var(--color-g700, #7d7d7d)
}

.pension-prd-detail.view03 .table-layout-group .table-group-row td.bold {
    border-right: 1px solid var(--color-g700, #7d7d7d)
}

.pension-prd-detail.view03 .table-layout-group .table-layout-footer {
    margin-top: 1rem
}

.pension-prd-detail.view03 .table-layout-group .table-layout-footer .txt-row {
    text-align: right
}

.pension-prd-detail.view03 .table-layout-group .table-layout-footer .txt-row .txt {
    color: var(--color-pb100, #000);
    font-size: 1.1rem;
    line-height: 1.5rem;
    font-weight: 500
}

.pension-prd-detail.view04 .component-prd-txt-group {
    padding: 6rem 0;
    background: var(--color-bu50, #e0f2ff)
}

.pension-prd-detail.view04 .component-prd-txt-block {
    margin-bottom: 3.8rem
}

.pension-prd-detail.view04 .component-prd-txt-block .hash {
    font-size: 2.1rem;
    color: var(--color-g800, #414141);
    font-weight: 700;
    line-height: 2.7rem
}

.pension-prd-detail.view04 .component-prd-motion .pension-noti {
    background-color: var(--color-w100, #fff);
    border-radius: 2rem;
    padding: 2.8rem 0
}

.pension-prd-detail.view04 .component-prd-motion+.component-prd-motion {
    margin-top: 1.5rem
}

.pension-prd-detail.view04 .component-prd-motion .pension-noti .pension-img {
    width: 5.6rem;
    margin-bottom: 2rem
}

.pension-prd-detail.view04 .component-prd-motion .pension-noti .pension-img>img {
    width: 100%
}

.pension-prd-detail.view04 .component-prd-motion .pension-noti .pension-text {
    font-size: 1.6rem;
    color: var(--color-g800, #414141);
    font-weight: 500;
    line-height: 2.1rem
}

.pension-prd-detail.view04 .component-prd-motion .pension-noti .pension-text strong {
    font-weight: 700
}

.prd-detail-wrap.shcard {
    overflow-x: initial
}

.card-prd-detail .component-prd-txt-group {
    padding: 8rem 0;
    text-align: center
}

.card-prd-detail.view02 {
    background: var(--color-pn, #17008c)
}

.card-prd-detail.view02 .component-prd-txt-group {
    padding: 8rem 0 12rem
}

.card-prd-detail.view02 .component-prd-txt-group .txt01 {
    padding-top: 0;
    font-weight: 400;
    line-height: 4rem
}

.card-prd-detail.view02 .component-prd-motion .shcard-img01 {
    display: block;
    width: 20rem;
    margin: 6.4rem auto 0
}

.card-prd-detail.view02 .component-prd-motion .shcard-img01>img {
    width: 100%
}

.card-prd-detail.view03 .component-prd-txt-group {
    padding: 8rem 0 6.4rem;
    background: var(--color-w100, #fff)
}

.prd-detail-wrap.shcard .card-prd-detail.view03 .component-prd-txt-group {
    padding-bottom: 0
}

.card-prd-detail.view03 .component-prd-txt-group .txt01,
.card-prd-detail.view04 .component-prd-txt-group .txt01 {
    font-size: 2.8rem;
    font-weight: 500;
    line-height: 3.6rem;
    color: var(--color-g800, #414141)
}

.card-prd-detail.view03 .component-prd-txt-group .txt02,
.card-prd-detail.view04 .component-prd-txt-group .txt02 {
    color: var(--color-g800, #414141);
    font-weight: 500
}

.card-prd-detail.view03 .shcard-ani-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    margin-top: 6.4rem
}

.card-prd-detail.view03 .shcard-ani-wrap[data-ani-type="up"] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.card-prd-detail.view03 .shcard-ani-wrap .ani-img01 {
    display: inline-block;
    width: 21rem
}

.card-prd-detail.view03 .shcard-ani-wrap .ani-img02 {
    display: inline-block;
    width: 28.4rem;
    opacity: 0
}

.card-prd-detail.view03 .shcard-ani-wrap .ani-img01>img,
.card-prd-detail.view03 .shcard-ani-wrap .ani-img02>img {
    width: 100%
}

.card-prd-detail.view03 .component-prd-motion.active .shcard-ani-wrap .ani-img02 {
    -webkit-animation: shcard-move 7s linear infinite;
    animation: shcard-move 7s linear infinite
}

@-webkit-keyframes shcard-move {
    0% {
        -webkit-transform: translateY(-9rem);
        transform: translateY(-9rem);
        opacity: 0
    }
    14% {
        -webkit-transform: translateY(-9rem);
        transform: translateY(-9rem);
        opacity: 0;
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
    28% {
        -webkit-transform: translateY(-18rem);
        transform: translateY(-18rem);
        opacity: 1;
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
    56% {
        -webkit-transform: translateY(-18rem);
        transform: translateY(-18rem);
        opacity: 1;
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }
    70% {
        -webkit-transform: translateY(-9rem);
        transform: translateY(-9rem);
        opacity: 0;
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }
    100% {
        -webkit-transform: translateY(-9rem);
        transform: translateY(-9rem);
        opacity: 0
    }
}

@keyframes shcard-move {
    0% {
        -webkit-transform: translateY(-9rem);
        transform: translateY(-9rem);
        opacity: 0
    }
    14% {
        -webkit-transform: translateY(-9rem);
        transform: translateY(-9rem);
        opacity: 0;
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
    28% {
        -webkit-transform: translateY(-18rem);
        transform: translateY(-18rem);
        opacity: 1;
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
    56% {
        -webkit-transform: translateY(-18rem);
        transform: translateY(-18rem);
        opacity: 1;
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }
    70% {
        -webkit-transform: translateY(-9rem);
        transform: translateY(-9rem);
        opacity: 0;
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }
    100% {
        -webkit-transform: translateY(-9rem);
        transform: translateY(-9rem);
        opacity: 0
    }
}

.card-prd-detail.view04 .component-prd-txt-group {
    padding: 8rem 0 12rem;
    background-color: var(--color-g100, #f8f8f8)
}

:root .card-prd-detail.view04 .component-prd-txt-group {
    background-color: var(--bg-qua)
}

.card-prd-detail.view04 .component-prd-txt-block {
    margin-bottom: 3.8rem
}

.card-prd-detail.view04 .component-btn {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex
}

.prd-detail-wrap.shcard .card-prd-detail.view04 .component-btn a {
    line-height: 4.8rem
}

.card-prd-detail.view04 .component-prd-motion .shcard-img02 {
    display: block;
    width: 24rem;
    margin: 6.4rem auto 0
}

.card-prd-detail.view04 .component-prd-motion .shcard-img02>img {
    width: 100%
}

.card-prd-detail.view05 .component-prd-txt-group {
    padding: 8rem 0 6.4rem;
    background: var(--color-w100, #fff)
}

.card-prd-detail.view05 .component-prd-txt-block .txt01 {
    font-size: 2.8rem;
    font-weight: 500;
    line-height: 3.6rem;
    color: var(--color-g900, #141414)
}

.card-prd-detail.view05 .component-prd-txt-block .txt02 {
    margin-top: 1.2rem;
    color: var(--color-g800, #414141);
    font-size: 1.6rem;
    font-weight: 500;
    line-height: 2.1rem
}

.card-prd-detail.view05 .component-prd-motion .shcard-img03 {
    display: block;
    width: 24rem;
    margin: 6.4rem auto 0
}

.card-prd-detail.view05 .component-prd-motion .shcard-img03>img {
    width: 100%
}

.component-img.type3 {
    margin: 4rem 0 3.2rem
}

.component-img.type3 .img-coupon {
    margin: 0 auto;
    width: 22rem
}

.component-img.type3 .img-coupon img {
    width: 100%;
    display: block
}

.component-img.type3+.component-cont-list {
    margin: 2.4rem 0 7.2rem
}

.component-img.type3+.component-cont-list+.component-cont-list {
    margin-bottom: 7.2rem
}

.step-list-group {
    margin-top: 3.2rem
}

.step-list-group li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.step-list-group li+li {
    margin-top: 3.2rem
}

.step-list-group li .img-area {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    width: 6.8rem;
    height: 6.8rem;
    background-color: var(--color-g100, #f8f8f8);
    border-radius: 1.6rem;
    margin-right: 1.6rem
}

.step-list-group li .img-area img {
    width: 4.4rem
}

.step-list-group li .txt-area .num {
    font-size: 1.4rem;
    font-weight: 700;
    line-height: 2rem;
    color: var(--color-bu900, #003fc7)
}

.step-list-group li .txt-area .desc {
    margin-top: 0.4rem;
    font-size: 1.6rem;
    font-weight: 500;
    line-height: 2.1rem
}

.list-linebox-group.qtype.type3 .section-link {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border: 1px solid var(--color-g300, #e0e0e0);
    border-radius: 1.2rem;
    padding: 2.4rem 2rem
}

.list-linebox-group.qtype.type3 .list-item.open .section-link {
    border-radius: 1.2rem 1.2rem 0 0;
    border-bottom: 0
}

.list-linebox-group.qtype.type3 .list-item+.list-item {
    margin-top: 1.6rem
}

.list-linebox-group.qtype.type3 .accordion-cont {
    margin: 0;
    background-color: transparent;
    padding: 2.4rem 2rem 3.2rem;
    border-radius: 0 0 1.2rem 1.2rem;
    border: 1px solid var(--color-g300, #e0e0e0)
}

.list-linebox-group.qtype.type3 .tit-list {
    word-break: keep-all
}

.component-card-detail-carousel img {
    width: 100%
}

.component-card-detail-carousel .onboarding-card-swiper.type2 .swiper-container {
    padding: 0
}

.component-card-detail-carousel .onboarding-card .swiper-pagination {
    margin-top: 2.8rem
}

.component-card-detail-carousel .swiper-pagination-bullet {
    background-color: transparent;
    border: 1px solid var(--color-w100);
    width: 0.8rem;
    height: 0.8rem
}

.component-card-detail-carousel .swiper-pagination-bullet-active {
    background-color: var(--color-w100)
}

:root .component-card-detail-carousel .swiper-pagination-bullet.play {
    width: 1.2rem;
    height: 1.2rem;
    border: none;
    margin-top: -0.2rem;
    background: var(--path-solid-play) center center no-repeat;
    -webkit-filter: var(--filter-w100);
    filter: var(--filter-w100);
    background-size: 7.2rem 1rem
}

:root .component-card-detail-carousel .swiper-pagination-bullet.stop {
    width: 1.2rem;
    height: 1.2rem;
    border: none;
    margin-top: -0.2rem;
    background: var(--path-solid-pause) center center no-repeat;
    -webkit-filter: var(--filter-w100);
    filter: var(--filter-w100);
    background-size: 7.2rem 1rem
}

.component-card-detail-carousel .txt-lv09 {
    padding: 3.2rem 0;
    color: var(--color-g900)
}

.component-card-detail-carousel .txt-lv04 {
    padding: 3.2rem 0;
    color: var(--color-g700)
}

.card-prd-detail .txt02 .img {
    margin-top: 6.4rem
}

.card-prd-detail .txt02 .img img {
    height: 18rem
}

.card-prd-detail .txt02 .img.h20 img {
    height: 20rem
}

.card-prd-detail .txt02 .img.h24 img {
    height: 24rem
}

.card-prd-detail .btn-group.crd {
    margin-top: 3.2rem;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.card-prd-detail .btn-group.crd .btn-lv02:only-child {
    -webkit-box-flex: 0;
    -ms-flex: 0;
    flex: 0
}

.card-prd-detail-box {
    padding: 2.4rem 2.4rem 4.2rem;
    border-radius: 1.6rem;
    border: 1px solid var(--color-g300)
}

.card-prd-detail-box+.card-prd-detail-box {
    margin-top: 1.8rem
}

.card-prd-detail-box .video-group {
    text-align: center
}

.card-prd-detail-box .video-group video {
    max-width: 26rem;
    width: 100%
}

.card-prd-detail-box:not(.noline) .txt-guide {
    color: var(--color-g800)
}

:root .card-prd-detail-box .txt-guide {
    color: var(--txt-sec)
}

.card-prd-detail-box .txt-guide strong {
    font-weight: 700
}

.card-prd-detail-box .img-group {
    text-align: center;
    padding-top: 4rem
}

.card-prd-detail-box .img-group.no-space {
    margin: 0 -2rem
}

.card-prd-detail-box .img-group img {
    width: 100%
}

.card-prd-detail-box .text-group {
    margin-top: 0.8rem;
    padding: 2rem;
    background-color: var(--bg-qua);
    border-radius: 1.2rem
}

.card-prd-detail-box.noline {
    padding: 0;
    border: 0
}

.card-prd-detail-box.noline+.card-prd-detail-box.noline {
    margin-top: 6.4rem
}

.samsunpay-use-tip p {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400;
    padding-left: 3.2rem;
    position: relative;
    min-height: 4.2rem
}

.samsunpay-use-tip p span {
    position: absolute;
    top: 0;
    left: 0;
    width: 2.4rem;
    height: 2.4rem;
    border: 1px solid var(--txt-pri);
    border-radius: 99rem;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.samsunpay-use-tip p strong {
    color: var(--color-in700);
    font-weight: 700
}

.samsunpay-use-tip img {
    display: block;
    margin: 2.4rem auto;
    width: 27.1rem
}

.card-prd-detail.view03.plus-check01 .component-prd-txt-group {
    padding: 5rem 0 12rem
}

.card-prd-detail.view02.plus-check02 .component-prd-txt-group .txt01 {
    font-size: 2.8rem;
    font-weight: 500;
    line-height: 3.6rem
}

.card-prd-detail.view03.kt-member02 .component-prd-txt-group,
.card-prd-detail.view03.kt-member04 .component-prd-txt-group,
.card-prd-detail.view03.plus-check03 .component-prd-txt-group {
    padding: 8rem 0 12rem
}

.card-prd-detail.view02.kt-member01 .component-prd-txt-group .txt01 {
    font-size: 2.8rem;
    font-weight: 500;
    line-height: 3.6rem
}

.card-prd-detail.view04.plus-check04 .component-prd-txt-group {
    padding: 8rem 0 5.6rem
}

.onboading-item.plus-check .img-wrap+.txt-lv03 {
    height: 10rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.samsung-pay-swipe .swiper-pagination {
    margin-top: 0
}

.kt-member .sales-info-group.center .col-cont {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    padding: 0
}

.pbbox-prd-detail .component-prd-txt-group {
    background-color: var(--color-w100);
    padding: 8rem 0;
    text-align: center
}

.pbbox-prd-detail.bg-01 .component-prd-txt-group {
    background-color: var(--bg-qua)
}

.pbbox-prd-detail .component-prd-txt-group .txt01 {
    padding-top: 0;
    font-size: 3rem;
    line-height: 3.6rem;
    color: var(--color-grey-g900);
    font-weight: 500
}

.pbbox-prd-detail .component-prd-txt-group .txt01.type1 {
    font-size: 2.6rem;
    line-height: 3.4rem;
    color: var(--txt-pri)
}

.component-prd-img {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 25rem
}

.plus-box-intersest-img01 {
    padding: 3.2rem 0 2rem
}

.component-prd-txt-group.type6 {
    padding: 6.4rem 2rem 3.6rem
}

.component-prd-txt-group.type6.bg-white .txt01 {
    font-weight: 700
}

.component-prd-txt-group.type6.line {
    border-bottom: 1px solid var(--border-qua)
}

.component-prd-txt-group.type6 .card-graph-row .graph-item>span.txt01 {
    padding-top: 0
}

.component-prd-txt-group.type6 .card-group.pb-interest-graph {
    background: transparent
}

.component-prd-txt-group.type6 .card-graph-row.type1 .graph-item .txt01 {
    background-color: var(--color-grey-g300)
}

.pbbox-prd-detail .component-prd-txt-group .bg-number-group {
    text-align: left
}

.reward-tootip-wrap {
    text-align: right;
    float: right;
    margin-top: -.4rem
}

.reward-tootip-wrap .txt-area {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: #f7f9fd;
    border-radius: 3.4rem;
    font-size: 1.4rem;
    line-height: 2rem;
    height: 3.4rem;
    text-align: center;
    padding: .7rem 1.2rem
}

.reward-tootip-wrap .txt {
    color: #fff !important;
    font-weight: normal !important
}

.reward-tootip-wrap .txt-area .img {
    vertical-align: middle;
    margin-right: .6rem
}

.reward-tootip-wrap .new {
    display: block;
    position: absolute;
    top: .6rem;
    right: .6rem;
    width: .4rem;
    height: .4rem;
    border-radius: .4rem;
    font-size: 0;
    overflow: hidden;
    background: #e23a32
}

.reward-tootip-wrap .tooltip-content {
    padding: .8rem 0
}

.onboarding-card-swiper.type3 {
    position: relative;
    margin-top: 6.4rem
}

.onboarding-card-swiper.type3 .swiper-container {
    padding: 1.2rem 0
}

.onboarding-card-swiper.type3 .swiper-slide {
    width: 14rem;
    height: auto
}

.onboarding-card-swiper.type3 .swiper-slide .section-link {
    width: 17.8rem;
    height: 100%;
    padding: 0;
    border-radius: unset;
    -webkit-box-shadow: unset;
    box-shadow: unset;
    background-color: unset
}

.onboarding-card-swiper.type3 .swiper-slide .section-link.startslide {
    opacity: 1
}

.onboarding-card-swiper.type3 .swiper-slide .section-link:not(.startslide) {
    -webkit-transform: scale(0.8);
    -ms-transform: scale(0.8);
    transform: scale(0.8)
}

.onboarding-card-swiper.type3 .onboading-item>img {
    width: 100%
}

.onboarding-card-swiper.type3 .swiper-slide-active.inducing .section-link {
    -webkit-animation: none;
    animation: none
}

.onboarding-card-swiper.type3 .swiper-slide-active.inducing .section-link:after {
    display: none
}

.onboarding-card-swiper.type3 .swiper-slide-active .section-link {
    opacity: 1
}

.onboarding-card-swiper.type3 .tooltip-focus-group .tooltip-area {
    display: none !important
}

.onboarding-card-swiper.type3 .onboarding-img>img {
    width: 100%
}

.onboarding-card-swiper.type3 .onboarding-img.active {
    -webkit-transform: translateX(13.5rem);
    -ms-transform: translateX(13.5rem);
    transform: translateX(13.5rem)
}

.prd-slide-ty01 .swiper-slide {
    width: 21rem;
    height: 23.8rem
}

.prd-slide-ty01 .card-box {
    position: relative;
    width: 100%;
    height: 100%;
    padding: 3.2rem .8rem 0 2rem;
    border-radius: 2rem;
    background: var(--bg-base);
    text-align: left
}

.prd-slide-ty01 .card-box * {
    padding: 0
}

.prd-slide-ty01 .card-box .txt-lv03 {
    margin-top: .4rem
}

.prd-slide-ty01 .img-wrap {
    position: absolute;
    bottom: 1.1rem;
    right: 1.1rem;
    width: 10rem;
    height: 10rem
}

.prd-slide-ty01 .swiper-pagination {
    margin-top: 2.8rem
}

.onboarding-card-swiper.type2.lotte .swiper-slide {
    width: 25.5rem;
    height: auto;
    margin: 0 0.5rem
}

.onboarding-card-swiper.type2.lotte .swiper-slide .section-link {
    width: 25.5rem;
    height: 100%;
    opacity: 1
}

.onboarding-card-swiper.type2.lotte .swiper-slide .section-link:not(.startslide) {
    -webkit-transform: scale(0.9);
    -ms-transform: scale(0.9);
    transform: scale(0.9)
}

.onboarding-card-swiper.type2.lotte .swiper-slide-active.inducing .section-link {
    -webkit-animation: none;
    animation: none
}

.card-prd-detail.view02.lotte .component-prd-txt-group,
.card-prd-detail.view03.lotte .component-prd-txt-group,
.card-prd-detail.view04.lotte .component-prd-txt-group {
    padding: 8rem 0 8rem
}

.card-prd-detail.lotte .component-prd-txt-group .txt01 {
    padding-top: 0
}

.list-linebox-group.topline2 {
    border-top: 1px solid var(--color-g300, #e0e6f1)
}

.card-prd-detail.view02.lotte .component-prd-txt-group .txt01 {
    font-size: 2.8rem;
    line-height: 3.6rem
}

.component-prd-loan01 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 5.2rem 0 4rem
}

.loan-img-box {
    width: 37.5rem;
    height: 17.6rem
}

.loan-img-box img {
    width: 100% !important;
    height: auto !important
}

.loan-prd-line {
    margin: 1.2rem 0 !important
}

.loan-prd-detail {
    overflow: hidden
}

.loan-prd-detail .card-prd-detail.view03 .component-prd-txt-group {
    padding: 5.6rem 0 5.2rem
}

.loan-prd-detail .card-prd-detail.view03 .component-prd-txt-group .txt01 {
    font-size: 2.6rem;
    line-height: 3.4rem;
    font-weight: 700
}

.loan-prd-detail .card-prd-detail.view03 .txt02 {
    font-weight: 400;
    color: var(--txt-ter)
}

.loan-prd-detail .card-prd-detail.view03 .txt02 .img {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-top: 4.4rem
}

.loan-prd-detail .component-prd-txt-group+.component-prd-txt-group {
    border: 0
}

.loan-prd-detail .card-prd-detail.view03 .component-prd-txt-group.prd-loan-ty01 {
    background: var(--bg-qua)
}

.loan-prd-detail .card-prd-detail.view03 .component-prd-txt-group.prd-loan-ty02 {
    padding-bottom: 6.4rem
}

.loan-prd-detail .card-prd-detail.view03.life-bankbook .component-prd-txt-group {
    padding: 5.6rem 0 4.8rem
}

.loan-prd-detail .card-prd-detail.view03.life-bankbook .component-prd-txt-group.type2.bg-qua {
    background: var(--bg-qua)
}

.loan-prd-detail .card-prd-detail.view03.life-bankbook .component-prd-txt-group .txt01 {
    padding-top: 0.8rem;
    color: var(--color-g900)
}

.loan-prd-detail .card-prd-detail.view03.life-bankbook .txt02 .img {
    margin: 4.4rem 0 2rem
}

.loan-prd-detail .card-prd-detail.view03.life-bankbook .txt02 .img img {
    height: 17.6rem
}

.card-prd-detail.view05.stock-account .component-prd-txt-group {
    padding: 5.6rem 0 3.2rem
}

.card-prd-detail.view05.stock-account .component-prd-txt-block .txt01 {
    font-size: 2.6rem;
    line-height: 3.4rem;
    font-weight: bold;
    color: var(--color-g900)
}

.card-prd-detail.view05.stock-account .component-prd-txt-block .txt01+.hash {
    margin-top: 1.2rem
}

.card-prd-detail.view05.stock-account .hash {
    margin-bottom: 2.4rem;
    font-size: 1.6rem;
    color: var(--txt-sec);
    line-height: 2.1rem;
    font-weight: 400
}

.component-img-hana {
    padding: 2rem 0 2rem
}

.component-img-hana img {
    width: 32rem;
    height: auto
}

.stock-account-img {
    padding: 2rem 0 2rem
}

.stock-account-img img {
    width: 32rem;
    height: auto
}

.card-group.bg-qua.type3 {
    padding: 2.4rem 2rem
}

.card-group.bg-qua.type3 .card-group-tit {
    font-size: 1.4rem;
    color: var(--txt-ter);
    font-weight: bold;
    line-height: 2rem;
    margin-bottom: 1.2rem
}

.card-group .card-link-list {
    margin-bottom: 1.2rem
}

.card-group .card-link-list .card-row-infobox {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.card-group .card-link-list:last-child {
    margin-bottom: 0
}

.card-group .card-link-list .card-tit {
    font-size: 1.5rem;
    color: var(--txt-sec);
    line-height: 2rem;
    font-weight: normal
}

.card-group .card-link-list .card-tit .tit {
    vertical-align: middle;
    margin-left: 0.3rem
}

.tag.accent-pri {
    background-color: var(--bg-accent-pri);
    padding: 0.25rem 0.8rem;
    margin-bottom: 0.8rem
}

.tag.accent-pri .txt {
    color: var(--txt-pri-invert)
}

.card-prd-detail.invest .component-prd-txt-group {
    padding: 6.4rem 0 3.2rem
}

.card-prd-detail.view04.invest .component-prd-txt-block {
    margin-bottom: 0
}

.card-prd-detail.invest .component-prd-txt-block .txt01 {
    padding-top: 0;
    font-size: 2.6rem;
    line-height: 3.4rem;
    font-weight: bold;
    color: var(--color-g900)
}

.card-prd-detail.invest .component-prd-txt-block .txt01+.hash {
    margin-top: 1.2rem
}

.card-prd-detail.invest .txt-group {
    margin-bottom: 2.4rem
}

.card-prd-detail.invest .hash {
    font-size: 1.6rem;
    color: var(--txt-sec);
    line-height: 2.1rem;
    font-weight: 400
}

.card-group.bg-qua.type3 [class^="card-row"] .card-col-tit {
    color: var(--txt-sec)
}

.invest-content-img {
    padding: 2rem 0 2rem
}

.invest-content-img img {
    width: 32rem;
    height: auto
}

.invest-content-img.type2 img {
    width: 37.5rem;
    height: auto
}

.component-img-viver {
    overflow: hidden
}

.component-img-viver img {
    width: 32rem;
    height: auto;
    opacity: 0;
    -webkit-transform: translateY(15%);
    -ms-transform: translateY(15%);
    transform: translateY(15%);
    -webkit-animation: viver-up 1s ease-out forwards;
    animation: viver-up 1s ease-out forwards
}

@-webkit-keyframes viver-up {
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1
    }
    80% {
        opacity: .3
    }
    0% {
        -webkit-transform: translateY(15%);
        transform: translateY(15%);
        opacity: 0
    }
}

@keyframes viver-up {
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1
    }
    80% {
        opacity: .3
    }
    0% {
        -webkit-transform: translateY(15%);
        transform: translateY(15%);
        opacity: 0
    }
}

.card-prd-detail.invest .txt-sm {
    margin-bottom: 0.8rem;
    font-size: 1.6rem;
    line-height: 2.1rem;
    color: var(--txt-qua, #67748e);
    font-weight: 500
}

.card-group.bg-qua.type3 .ico-watch {
    width: 2.4rem;
    height: 2.4rem;
    background: url("/resource/img/not/adm_ic_watch_X3.png") 0 0 no-repeat;
    background-size: contain
}

.card-group.bg-qua.type3 .ico-review {
    width: 2.4rem;
    height: 2.4rem;
    background: url("/resource/img/not/adm_ic_review_X3.png") 0 0 no-repeat;
    background-size: contain
}

.card-group.bg-qua.type3 .ico-purchase {
    width: 2.4rem;
    height: 2.4rem;
    background: url("/resource/img/not/adm_ic_purchase_X3.png") 0 0 no-repeat;
    background-size: contain
}

[class*=one_checkcard-video] {
    display: block;
    margin: 0 auto
}

.one_checkcard-video-cover {
    width: 30rem
}

[class*=one_checkcard-video-benefit] {
    width: 20rem
}

[class*=one_checkcard-video-benefit].medium {
    height: 17.6rem;
    margin: 2rem auto
}

.one_checkcard-video-pattern {
    width: 17.9rem
}

:visited [class*=one_checkcard-pattern],
[class*=one_checkcard-pattern] {
    display: block;
    height: 100%;
    border-radius: 100%;
    border: 1px solid var(--color-g500)
}

.tab-item.active :visited [class*=one_checkcard-pattern],
.tab-item.active [class*=one_checkcard-pattern] {
    border-color: var(--border-pri-invert)
}

.one_checkcard-pattern1 {
    background-image: url("/resource/img/mmk/common/card/img_onecheckcard_pattern1.png");
    border-color: var(--color-w100)
}

.one_checkcard-pattern2 {
    background: -o-linear-gradient(315deg, #c8d2e4 0.62%, #f7f9fd 51.12%, #c8d2e4 100.62%);
    background: linear-gradient(135deg, #c8d2e4 0.62%, #f7f9fd 51.12%, #c8d2e4 100.62%);
    border-color: var(--ico-qua)
}

.one_checkcard-pattern3 {
    background: #000;
    border-color: var(--border-qua)
}

.component-kds-banner .ico-ggamja {
    width: 3.2rem;
    height: 3.2rem;
    background-image: url("/resource/img/mmk/common/ico_ggamja.png");
    background-size: contain
}

.one_checkcard-swiper .swiper-pagination {
    margin-top: 2.8rem
}

.one_checkcard-swiper .swiper-slide,
.one_checkcard-swiper .swiper-slide .section-link {
    width: 30rem
}

.one_checkcard-swiper .swiper-slide img {
    width: 17.3rem
}

.one_checkcard-swiper .swiper-slide:not(.swiper-slide-active) .section-link {
    -webkit-transform: scale(0.9);
    -ms-transform: scale(0.9);
    transform: scale(0.9)
}

.one_checkcard-swiper .onboarding-card .swiper-pagination {
    margin-top: 2.8rem
}

.one_checkcard-swiper .swiper-pagination-bullet.play {
    width: 1.2rem;
    height: 1.2rem;
    border: none;
    margin-top: -0.2rem;
    background: var(--path-solid-play) center center no-repeat;
    background-size: 7.2rem 1rem
}

.one_checkcard-swiper .swiper-pagination-bullet.stop {
    width: 1.2rem;
    height: 1.2rem;
    border: none;
    margin-top: -0.2rem;
    background: var(--path-solid-pause) center center no-repeat;
    background-size: 7.2rem 1rem
}

.one_checkcard-swiper .title-group {
    white-space: normal;
    word-break: keep-all
}

.one_checkcard-swiper-flip,
.type-flip2 .one_checkcard-swiper-flip .swiper-slide .section-link {
    height: 28rem
}

.type-flip2 .one_checkcard-swiper-flip .swiper-container {
    padding: 0
}

.one_checkcard-swiper-flip .swiper-pagination {
    margin-top: 2.8rem
}

.pc .one_checkcard-swiper-wrap {
    margin-bottom: 2.4rem
}

.pc .one_checkcard-swiper-flip .swiper-pagination {
    display: block
}

.one_checkcard-swiper.a11y-swiper[data-timer-start="true"] .section-link {
    margin-left: auto;
    margin-right: auto
}

.pc .one_checkcard-swiper-flip .swiper-pagination {
    display: block
}

.one_checkcard-swiper-flip .swiper-pagination {
    margin-top: 2.8rem;
    display: none
}

.a11y-swiper.one_checkcard-swiper-flip .swiper-pagination {
    display: block
}

.component-carousel-life-bankbook {
    margin-top: 4.4rem
}

.component-carousel-life-bankbook .swiper-slide {
    padding: 3.2rem 0;
    border-radius: 2rem;
    background-color: var(--bg-base)
}

.component-carousel-life-bankbook .title-group .txt-guide {
    margin-top: 0;
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--txt-accent-sec) !important;
    line-height: 2rem
}

.component-carousel-life-bankbook .title-group .title-field-page {
    margin-top: 0.4rem;
    color: var(--txt-sec)
}

.component-carousel-life-bankbook .text-icon-group .img-area {
    margin: 2.6rem 0
}

.component-carousel-life-bankbook .text-icon-group .img-area img {
    width: 18rem;
    height: 18rem
}

.component-carousel-life-bankbook .text-icon-group .txt {
    font-weight: 500;
    color: var(--txt-sec) !important
}

.component-carousel-life-bankbook.type01 .carousel-group .swiper-slide {
    height: 39.3rem
}

.component-carousel-life-bankbook.type01 .carousel-group .text-icon-group .img-area {
    margin: 2.8rem 2rem;
    height: 17.6rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.component-carousel-life-bankbook.type01 .carousel-group .text-icon-group .img-area img {
    width: auto;
    height: 17.6rem
}

.component-carousel-life-bankbook.type01 .carousel-group .swiper-pagination {
    margin-top: 1.6rem
}

.kds-landing-image .cgbox_card {
    width: 15rem;
    padding: 1.6rem 0;
    background: #fff;
    border-radius: 2rem
}

.kds-landing-image .cgbox_card-thumb {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 15rem;
    height: 8.4rem
}

.kds-landing-image .cgbox_card-thumb img {
    display: block;
    margin: 0 auto
}

.kds-landing-image .cgbox_card-tag {
    width: 6.8rem;
    margin-top: 1.2rem;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.kds-landing-image .cgbox_card-info {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.component-prd-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.component-prd-txt-group .txt02.first-type {
    margin-top: 0;
    margin-bottom: 0.8rem
}

.info-repay-way .way-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 18.5rem;
    padding: 1.8rem 0 0.8rem
}

.info-repay-way .way-box .box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 0 1.5rem;
    text-align: center;
    word-spacing: 0.8rem
}

.info-repay-way .way-box .box+.box {
    border-left: 1px dotted #67748e
}

.popup-dialog.ui-full .popup-group.prd-nh {
    background-color: var(--bg-qua)
}

.section-nh-benefit {
    margin-top: 3.2rem
}

.component-benefit-card .card-wrap {
    width: 100%;
    border-radius: 1.6rem;
    overflow: hidden
}

.component-benefit-card+.component-benefit-card {
    margin-top: 2rem
}

.component-benefit-card .card-top {
    padding: 1.3rem 2rem;
    background-color: var(--bg-ter-active)
}

.component-benefit-card .txt-top {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: bold;
    color: var(--txt-pri-invert)
}

.component-benefit-card .card-content {
    padding: 2.4rem 2rem;
    background-color: var(--bg-base)
}

.component-benefit-card .title-group+.title-group {
    margin-top: 2rem
}

.component-benefit-card .title-group .title-field-page {
    color: var(--txt-sec)
}

.component-benefit-card .title-group .txt-guide {
    margin-top: 0.4rem;
    font-size: 1.4rem;
    line-height: 2rem
}

.component-benefit-card .benefit-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
    height: 7.2rem;
    margin-top: 2rem;
    border: 1px solid var(--border-qua);
    border-radius: 1.2rem;
    text-align: center
}

.component-benefit-card .benefit-box-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.component-benefit-card .benefit-box-group .benefit-box {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.component-benefit-card .benefit-box-group .benefit-box+.benefit-box {
    margin-left: 0.8rem
}

.component-benefit-card .benefit-txt-list {
    margin-top: 2rem
}

.component-benefit-card .benefit-txt-list .bl-txt-group>.txt {
    margin-top: 0.4rem;
    font-size: 1.2rem;
    line-height: 1.6rem
}

.component-benefit-card .benefit-txt-list .bl-txt-group>.txt>.dash-txt-group {
    margin-top: 0
}

.component-benefit-card .benefit-txt-list .dash-txt-group .txt {
    font-size: 1.2rem;
    line-height: 1.6rem;
    margin-top: 0;
    color: var(--txt-ter)
}

.component-benefit-card .benefit-txt-list .dash-txt-group .txt+.txt {
    margin-top: 0
}

.card-group.prime-rate {
    padding: 1.6rem 2rem
}

.card-group.prime-rate+.card-group.prime-rate {
    margin-top: 1.2rem
}

.card-group.prime-rate .card-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.card-group.prime-rate .card-tit-wrap {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.card-group.prime-rate .card-tit-wrap .card-tit {
    font-size: 1.5rem;
    color: var(--txt-sec);
    line-height: 2rem
}

.card-group.prime-rate .card-tit-wrap .card-subtit {
    margin-top: 0.2rem;
    font-size: 1.4rem;
    color: var(--txt-qua);
    line-height: 2rem
}

.card-group.prime-rate .card-rate {
    margin-left: 1.2rem;
    font-size: 1.6rem;
    font-weight: bold;
    color: var(--txt-pri-down);
    line-height: 2.1rem
}

.feelings-bankbook-view01 .feelings-emoji-group {
    position: relative;
    width: 23.4rem;
    height: 23.4rem;
    margin: 0 auto
}

.feelings-bankbook-view01 .feelings-emoji-group .feelings-emoji-img {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.feelings-bankbook-view01 .feelings-emoji-group .feelings-emoji-img>li {
    position: relative;
    width: 50%;
    height: 11.7rem
}

.feelings-bankbook-view01 .feelings-emoji-group .feelings-emoji-img>li>img {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 10.625rem;
    height: 10.625rem;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    -webkit-animation-delay: 0s !important;
    animation-delay: 0s !important;
    -webkit-animation: imgSacle-ani-new 0.4s ease-in-out forwards;
    animation: imgSacle-ani-new 0.4s ease-in-out forwards
}

.feelings-bankbook-view02 {
    margin-right: 0 !important;
    margin-left: 0 !important;
    padding-right: .4rem;
    padding-left: .4rem
}

.feelings-bankbook-view02.feeling-view02 .active .calendar-day-wrap.active01 {
    -webkit-animation: imgShow1-ani 0.5s linear forwards;
    animation: imgShow1-ani 0.5s linear forwards;
    -webkit-animation-delay: 1.5s;
    animation-delay: 1.5s
}

.feelings-bankbook-view02.feeling-view02 .active .calendar-day-wrap.active02 {
    -webkit-animation: imgShow2-1-ani 0.5s forwards;
    animation: imgShow2-1-ani 0.5s forwards;
    -webkit-animation-delay: 2s;
    animation-delay: 2s
}

.feelings-bankbook-view02.feeling-view02 .active .calendar-day-wrap .img-bubble {
    opacity: 0;
    -webkit-animation: imgShow3-ani 0.2s ease-in-out forwards;
    animation: imgShow3-ani 0.2s ease-in-out forwards;
    -webkit-animation-delay: 2.5s;
    animation-delay: 2.5s
}

.feelings-calendar-group {
    position: relative;
    height: 41.8rem;
    padding: 2.8rem 0 4.8rem;
    background-color: var(--bg-base);
    border-radius: 2rem
}

.feelings-calendar-group .calcAni-wrap {
    height: 4.3rem
}

.feelings-calendar-group .calcAni-y-item {
    white-space: normal !important
}

.feelings-calendar-group .calendar-day-wrap .img-bubble {
    background-image: url(/resource/img/mmk/common/feeling/img_bubble_new.png)
}

.feelings-bankbook-view03 .feeling-emoji-group {
    margin-left: 0;
    padding: 4.7rem 0 0
}

.feelings-bankbook-view03 .active .feeling-emoji-group .coin-ani.active00 {
    bottom: 10.5rem;
    -webkit-animation: coinUp-ani3 1.3s linear infinite;
    animation: coinUp-ani3 1.3s linear infinite
}

@-webkit-keyframes coinUp-ani3 {
    0% {
        opacity: 0;
        bottom: 10.5rem
    }
    75% {
        opacity: 1;
        bottom: 16.5rem
    }
    85% {
        opacity: 0;
        bottom: 16.5rem
    }
    100% {
        opacity: 0
    }
}

@keyframes coinUp-ani3 {
    0% {
        opacity: 0;
        bottom: 10.5rem
    }
    75% {
        opacity: 1;
        bottom: 16.5rem
    }
    85% {
        opacity: 0;
        bottom: 16.5rem
    }
    100% {
        opacity: 0
    }
}

.feelings-bankbook-view04 .feeling-chat-group {
    padding: 2rem 2rem 0;
    background-color: var(--bg-qua)
}

.feelings-bankbook-view04 .feeling-chat-group .chat-txt:nth-child(1),
.feelings-bankbook-view04 .feeling-chat-group .chat-txt:nth-child(2),
.feelings-bankbook-view04 .feeling-chat-group .chat-txt:nth-child(3),
.feelings-bankbook-view04 .feeling-chat-group .chat-txt:nth-child(4) {
    opacity: 1
}

.feelings-bankbook-view04 .feeling-chat-group .chat-txt.left img {
    -webkit-transform: translateX(-100%);
    -ms-transform: translateX(-100%);
    transform: translateX(-100%);
    opacity: 0;
    margin: 0
}

.feelings-bankbook-view04 .feeling-chat-group .chat-txt.right img {
    -webkit-transform: translateX(100%);
    -ms-transform: translateX(100%);
    transform: translateX(100%);
    opacity: 0;
    margin: 0
}

.feelings-bankbook-view04 .active .feeling-chat-group .chat-txt:nth-child(1) img {
    -webkit-animation: imgShow4-ani-left 0.4s ease-in-out forwards;
    animation: imgShow4-ani-left 0.4s ease-in-out forwards;
    width: 11.8rem
}

.feelings-bankbook-view04 .active .feeling-chat-group .chat-txt:nth-child(2) img {
    -webkit-animation: imgShow4-ani-right 0.4s ease-in-out forwards;
    animation: imgShow4-ani-right 0.4s ease-in-out forwards;
    -webkit-animation-delay: 0.6s;
    animation-delay: 0.6s;
    width: calc(97.6rem/4)
}

.feelings-bankbook-view04 .active .feeling-chat-group .chat-txt:nth-child(3) img {
    -webkit-animation: imgShow4-ani-right 0.4s ease-in-out forwards;
    animation: imgShow4-ani-right 0.4s ease-in-out forwards;
    -webkit-animation-delay: 1.2s;
    animation-delay: 1.2s;
    width: 26.9rem
}

.feelings-bankbook-view04 .active .feeling-chat-group .chat-txt:nth-child(4) img {
    -webkit-animation: imgShow4-ani-left 0.4s ease-in-out forwards;
    animation: imgShow4-ani-left 0.4s ease-in-out forwards;
    -webkit-animation-delay: 1.8s;
    animation-delay: 1.8s;
    width: 14rem
}

.challenge-box-view01 .cgbox-flip-group {
    margin: 0 auto;
    width: 24rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.challenge-box-view01 .cgbox-flip-group .col-card-bnr {
    padding: 1rem;
    text-align: center
}

.challenge-box-view01 .cgbox-flip-group .col-card-bnr .flip {
    position: relative;
    width: 9.6rem;
    height: 9.6rem;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-perspective-origin: 50% 50%;
    perspective-origin: 50% 50%;
    -webkit-transition: ease-in-out;
    -o-transition: ease-in-out;
    transition: ease-in-out
}

.cgbox-flip-group .col-card-bnr .flip .back,
.challenge-box-view01 .cgbox-flip-group .col-card-bnr .flip .front {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    border-radius: 1.6rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.challenge-box-view01 .cgbox-flip-group .col-card-bnr .flip .front {
    background: var(--color-w100, #fff);
    -webkit-box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08)
}

.challenge-box-view01 .cgbox-flip-group .col-card-bnr .flip [class*="ico-thumbnail"] {
    width: 5.6rem;
    height: 5.6rem
}

.challenge-box-view01 .cgbox-flip-group .col-card-bnr .flip .back {
    background: var(--color-in700, #5c59f9);
    -webkit-transform: rotateY(180deg);
    transform: rotateY(180deg)
}

.challenge-box-view01 .cgbox-flip-group .col-card-bnr .flip .back .txt {
    font-size: 2.1rem;
    font-weight: 700;
    color: var(--color-w100, #fff)
}

.challenge-box-view01 .cgbox-flip-group .col-card-bnr .flip {
    -webkit-animation: cardFlip2 4s ease-in-out forwards;
    animation: cardFlip2 4s ease-in-out forwards;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite
}

.challenge-box-view01 .cgbox-flip-group .col-card-bnr:nth-child(1) .flip {
    -webkit-animation-delay: 0s;
    animation-delay: 0s
}

.challenge-box-view01 .cgbox-flip-group .col-card-bnr:nth-child(2) .flip {
    -webkit-animation-delay: 1s;
    animation-delay: 1s
}

.challenge-box-view01 .cgbox-flip-group .col-card-bnr:nth-child(4) .flip {
    -webkit-animation-delay: 2.0s;
    animation-delay: 2.0s
}

.challenge-box-view01 .cgbox-flip-group .col-card-bnr:nth-child(3) .flip {
    -webkit-animation-delay: 3s;
    animation-delay: 3s
}

.challenge-box-view03 .component-prd-motion {
    margin-top: 2.5rem;
    padding: 0;
    text-align: center
}

.challenge-box-view04 .component-prd-motion {
    margin: 1.5rem 0
}

.challenge-box-view04 .component-prd-motion [data-ani-type="up"] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.solpay-view .shcard-ani-wrap {
    height: 17.6rem
}

.solpay-view .shcard-ani-wrap[data-ani-type="up"] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.solpay-view .shcard-ani-wrap .ani-img01 {
    display: block;
    width: auto;
    margin: 0 auto;
    text-align: center
}

.solpay-view .shcard-ani-wrap .ani-img02 {
    display: block;
    width: 28.4rem;
    margin: 0 auto;
    opacity: 0
}

.solpay-view .shcard-ani-wrap .ani-img01>img {
    width: auto
}

.solpay-view .shcard-ani-wrap .ani-img02>img {
    width: 100%
}

.solpay-view .component-prd-motion.active .shcard-ani-wrap .ani-img02 {
    -webkit-animation: shcard-move1 7s linear infinite;
    animation: shcard-move1 7s linear infinite
}

@-webkit-keyframes shcard-move1 {
    0% {
        -webkit-transform: translateY(-6.8rem);
        transform: translateY(-6.8rem);
        opacity: 0
    }
    14% {
        -webkit-transform: translateY(-6.8rem);
        transform: translateY(-6.8rem);
        opacity: 0;
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
    28% {
        -webkit-transform: translateY(-13.6rem);
        transform: translateY(-13.6rem);
        opacity: 1;
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
    56% {
        -webkit-transform: translateY(-13.6rem);
        transform: translateY(-13.6rem);
        opacity: 1;
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }
    70% {
        -webkit-transform: translateY(-6.8rem);
        transform: translateY(-6.8rem);
        opacity: 0;
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }
    100% {
        -webkit-transform: translateY(-6.8rem);
        transform: translateY(-6.8rem);
        opacity: 0
    }
}

@keyframes shcard-move1 {
    0% {
        -webkit-transform: translateY(-6.8rem);
        transform: translateY(-6.8rem);
        opacity: 0
    }
    14% {
        -webkit-transform: translateY(-6.8rem);
        transform: translateY(-6.8rem);
        opacity: 0;
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
    28% {
        -webkit-transform: translateY(-13.6rem);
        transform: translateY(-13.6rem);
        opacity: 1;
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
    56% {
        -webkit-transform: translateY(-13.6rem);
        transform: translateY(-13.6rem);
        opacity: 1;
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }
    70% {
        -webkit-transform: translateY(-6.8rem);
        transform: translateY(-6.8rem);
        opacity: 0;
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }
    100% {
        -webkit-transform: translateY(-6.8rem);
        transform: translateY(-6.8rem);
        opacity: 0
    }
}

.component-card-detail-carousel .onboarding-card-swiper.type4 {
    position: relative;
    margin-top: -2rem;
    margin-bottom: -2rem
}

.component-card-detail-carousel .onboarding-card-swiper.type4 .swiper-container {
    padding: 0
}

.component-card-detail-carousel .onboarding-card-swiper.type4 .onboading-item.plus-check .img-wrap {
    margin-bottom: 2.8rem
}

.component-card-detail-carousel .onboarding-card-swiper.type4 .onboading-item.plus-check .img-wrap img {
    height: 11.6rem
}

.component-card-detail-carousel .onboarding-card-swiper.type4 .onboading-item.plus-check .img-wrap+.txt-lv03 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    height: 4rem
}

.component-card-detail-carousel .onboarding-card-swiper.type4 .swiper-slide {
    width: 25.5rem;
    height: auto;
    margin: 0 0.5rem
}

.component-card-detail-carousel .onboarding-card-swiper.type4 .swiper-slide .section-link {
    width: 25.5rem;
    height: 31.6rem;
    padding: 0;
    opacity: 1;
    border-radius: 2rem;
    -webkit-box-shadow: none;
    box-shadow: none
}

.component-card-detail-carousel .onboarding-card-swiper.type4 .swiper-slide .section-link.startslide {
    opacity: 1
}

.component-card-detail-carousel .onboarding-card-swiper.type4 .swiper-slide .section-link:not(.startslide) {
    -webkit-transform: scale(0.891);
    -ms-transform: scale(0.891);
    transform: scale(0.891)
}

.component-card-detail-carousel .onboarding-card-swiper.type4 .onboading-item>img {
    width: 100%
}

.component-card-detail-carousel .onboarding-card-swiper.type4 .swiper-slide-active .section-link {
    opacity: 1
}

.component-card-detail-carousel .onboarding-card-swiper.type4 .swiper-pagination-bullet {
    border-color: var(--border-sec);
    border-width: 1.4px
}

.component-card-detail-carousel .onboarding-card-swiper.type4 .swiper-pagination-bullet-active {
    background-color: var(--ico-qua-active)
}

.component-card-detail-carousel .onboarding-card-swiper.type4 .swiper-pagination-bullet.play,
.component-card-detail-carousel .onboarding-card-swiper.type4 .swiper-pagination-bullet.stop {
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

.component-card-detail-carousel .onboarding-card-swiper.type5 {
    position: relative;
    margin: 0 auto;
    max-width: 63rem
}

.component-card-detail-carousel .onboarding-card-swiper.type5 .swiper-container {
    padding: 0
}

.component-card-detail-carousel .onboarding-card-swiper.type5 .swiper-slide {
    width: 20rem;
    height: auto
}

.component-card-detail-carousel .onboarding-card-swiper.type5 .a11y-swiper[data-timer-start="true"] .section-link {
    margin-left: auto;
    margin-right: auto
}

.component-card-detail-carousel .onboarding-card-swiper.type5 .swiper-slide .section-link {
    width: 20rem;
    height: 100%;
    padding: 0;
    border-radius: 1.9rem;
    background: none;
    opacity: 1
}

.component-card-detail-carousel .onboarding-card-swiper.type5 .swiper-slide .section-link.startslide {
    opacity: 1
}

.component-card-detail-carousel .onboarding-card-swiper.type5 .swiper-slide .section-link:not(.startslide) {
    border-radius: 2rem
}

.component-card-detail-carousel .onboarding-card-swiper.type5 .onboading-item>img {
    width: 100%
}

.component-card-detail-carousel .onboarding-card-swiper.type5 .swiper-slide-active.inducing .section-link {
    -webkit-animation: none;
    animation: none
}

.component-card-detail-carousel .onboarding-card-swiper.type5 .swiper-slide-active.inducing .section-link:after {
    display: none
}

.component-card-detail-carousel .onboarding-card-swiper.type5 .swiper-slide-active .section-link {
    opacity: 1
}

.ico-img-worry {
    max-width: 37.5rem
}

.component-card-detail-carousel .onboarding-card-swiper.type5 .img-wrap {
    -webkit-clip-path: inset(9.2rem 0 9.2rem 0 round 2rem);
    clip-path: inset(9.2rem 0 9.2rem 0 round 2rem);
    -webkit-transition: -webkit-clip-path .4s ease;
    transition: -webkit-clip-path .4s ease;
    -o-transition: clip-path .4s ease;
    transition: clip-path .4s ease;
    transition: clip-path .4s ease, -webkit-clip-path .4s ease
}

.component-card-detail-carousel .onboarding-card-swiper.type5 .swiper-slide-active .img-wrap {
    -webkit-clip-path: inset(0 0 0 0 round 2rem);
    clip-path: inset(0 0 0 0 round 2rem)
}

.moin-box .flex-box-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 0 auto;
    padding: 0;
    width: auto;
    max-width: 40rem;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.moin-box .flex-box-list .item.bg-qua {
    background: var(--bg-qua)
}

.moin-box .flex-box-list .item {
    border-radius: 2rem;
    padding: 2rem 1rem;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.moin-box .flex-box-list .item+.item {
    margin-left: 1rem
}

.moin-box .flex-box-list .imgbox {
    margin-bottom: 1rem;
    width: 100%;
    text-align: center
}

.moin-box .flex-box-list .imgbox img {
    max-width: 100%;
    max-height: 100%;
    height: 6rem;
    width: 8rem
}

.moin-box .flex-box-list .txt {
    font-size: 1.8rem;
    font-weight: 700;
    line-height: 2.5rem;
    color: var(--color-grey-g900)
}

.component-card-detail-carousel .pagination-gray .swiper-pagination-bullet {
    border-color: var(--border-sec);
    border-width: 1.4px
}

.component-card-detail-carousel .pagination-gray .swiper-pagination-bullet-active {
    background-color: var(--ico-qua-active)
}

.component-card-detail-carousel .pagination-gray .swiper-pagination-bullet.play,
.component-card-detail-carousel .pagination-gray .swiper-pagination-bullet.stop {
    -webkit-filter: var(--filter-g700);
    filter: var(--filter-g700)
}

.prd-detail-wrap.icon-slide-prd.type7 {
    background: transparent !important
}

.prd-detail-wrap.icon-slide-prd.type7 .bridgeCashback-list-wrapper .logo-slide-box .logo-item {
    background-color: var(--bg-qua)
}

.prd-detail-wrap.icon-slide-prd.type7 .component-icon-slide-prd {
    padding: 0
}

.prd-detail-wrap.icon-slide-prd.type7 .bridgeCashback-list-wrapper .logo-slide-box:nth-child(2) {
    padding-bottom: 0
}

.aiquiz-today-wrap {
    position: fixed;
    right: 2rem;
    bottom: 17.2rem;
    z-index: 999
}

.aiquiz-today-wrap .aiquiz-today {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 6.4rem;
    height: 6.4rem;
    border: 2px solid transparent;
    border-radius: 999rem;
    background: -o-linear-gradient(var(--bg-base), var(--bg-base)), -o-linear-gradient(315deg, #66e2ff, #4c5fe4, #8254e3);
    background: linear-gradient(var(--bg-base), var(--bg-base)), linear-gradient(135deg, #66e2ff, #4c5fe4, #8254e3);
    background-origin: border-box;
    background-clip: content-box, border-box
}

.aiquiz-today-wrap .aiquiz-today img {
    width: 4rem;
    height: 4rem;
    position: relative
}

.aiquiz-today-wrap .aiquiz-today .text-group {
    display: none;
    margin-right: 1.6rem;
    color: var(--txt-pri)
}

.aiquiz-today-wrap .aiquiz-today .tit {
    font-size: 1.4rem;
    line-height: 2rem
}

.aiquiz-today-wrap .aiquiz-today .txt {
    font-size: 1.8rem;
    font-weight: 700;
    line-height: 2.5rem
}

.aiquiz-today-wrap .aiquiz-today.open {
    width: auto;
    border-radius: 3.2rem
}

.aiquiz-today-wrap .aiquiz-today.open .text-group {
    display: block;
    white-space: nowrap
}

.aiquiz-today-wrap .aiquiz-today.open img {
    margin-right: 1rem;
    margin-left: 1rem
}

.component-carousel-pansion-save .swiper-slide {
    margin-bottom: 1.2rem;
    padding: 3.2rem 0;
    border-radius: 2rem;
    background-color: var(--bg-base)
}

.component-carousel-pansion-save .title-group {
    text-align: center
}

.component-carousel-pansion-save .title-group .txt-guide {
    margin-top: 0;
    font-size: 1.5rem;
    font-weight: 500;
    color: var(--txt-qua);
    line-height: 2rem
}

.component-carousel-pansion-save .title-group .title-field-page {
    margin-top: 0.4rem;
    color: var(--txt-sec)
}

.component-carousel-pansion-save .text-icon-group .img-area {
    margin: 1.6rem auto
}

.component-carousel-pansion-save .text-icon-group .img-area img {
    width: 29.5rem;
    height: auto
}

.component-carousel-pansion-save .text-icon-group .txt {
    font-size: 1.4rem;
    font-weight: 500;
    color: var(--txt-sec)
}

.prd-detail-wrap.icon-slide-prd.type8 {
    background: var(--bg-qua) !important
}

.prd-detail-wrap.icon-slide-prd.type8 .component-icon-slide-prd {
    padding-bottom: 7.7rem
}

.insurance-landing-image {
    border-radius: 1.6rem;
    overflow: hidden;
    margin: 2rem;
    text-align: center
}

.insurance-landing-image img {
    -o-object-fit: contain;
    object-fit: contain;
    max-width: 375px;
    width: 100%
}

.insurance-landing-footer-wrap {
    padding-bottom: 15.4rem
}

.insurance-landing-footer {
    padding: 2rem;
    background-color: var(--bg-qua)
}

.insurance-landing-footer .list-linebox-group {
    background: transparent
}

.insurance-landing-footer .title-group {
    margin-top: 3rem;
    margin-bottom: .44rem;
    font-size: 1.6rem;
    line-height: 2.1rem
}

.insurance-landing-footer .list-linebox-group .list-item {
    border-bottom: 0
}

.insurance-landing-footer .bl-txt-group .txt {
    top: .8rem;
    font-size: 1.4rem;
    line-height: 2rem
}

.container-component .insurance-landing-footer-wrap {
    padding-bottom: 0
}

.component-today-coupon {
    margin-top: 2.4rem
}

.component-today-coupon .coupon-list-group .list-item+.list-item {
    margin-top: 1.2rem
}

.component-today-coupon .coupon-list-group .section-link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
    height: 10.3rem;
    border-radius: 1.2rem;
    border: 1px solid var(--border-quin);
    background-color: var(--bg-base)
}

.component-today-coupon .coupon-list-group .coupon-detail {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    overflow: hidden;
    padding: 2rem 1.2rem 2rem 2rem;
    border-right: 1px dashed var(--border-quin)
}

.component-today-coupon .coupon-list-group .coupon-state {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 8rem;
    flex: 0 0 8rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    background-color: var(--bg-qua)
}

.component-today-coupon .coupon-list-group .coupon-state .txt {
    font-size: 1.4rem;
    font-weight: 500;
    line-height: 2rem;
    color: var(--txt-quin);
    text-align: center
}

.component-today-coupon .coupon-list-group .coupon-state .ico-download {
    width: 2.4rem;
    height: 2.4rem;
    -webkit-filter: var(--filter-in700);
    filter: var(--filter-in700)
}

.component-today-coupon .coupon-list-group .coupon-logo {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 5rem;
    flex: 0 0 5rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    overflow: hidden;
    height: 5rem;
    margin-right: 1.6rem;
    border-radius: 2rem;
    background-color: var(--bg-qua)
}

.component-today-coupon .coupon-list-group .coupon-logo .img {
    max-width: 100%
}

.component-today-coupon .coupon-list-group .coupon-logo .img.default {
    width: 4rem;
    height: 4rem
}

.component-today-coupon .coupon-list-group .coupon-tit {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    overflow: hidden
}

.component-today-coupon .coupon-list-group .txt-eyebrow {
    display: block;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin-bottom: 0.4rem;
    font-size: 1.2rem;
    font-weight: 500;
    line-height: 1.6rem;
    color: var(--txt-quin)
}

.component-today-coupon .coupon-list-group .txt-tit {
    display: block;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--txt-ter)
}

.component-today-coupon .coupon-list-group .txt-price {
    display: block;
    margin-top: 0.2rem;
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 2rem;
    color: var(--txt-pri)
}

.component-today-coupon .coupon-list-group .section-link.dday .coupon-state {
    background-color: var(--bg-base)
}

.component-today-coupon .coupon-list-group .section-link.off * {
    color: var(--txt-disabled) !important
}

.component-today-coupon .coupon-list-group .section-link.off .coupon-state {
    background-color: var(--bg-base)
}

.component-today-coupon .coupon-list-group .section-link.random {
    -webkit-animation: randomCouponBg linear 4.8s infinite alternate;
    animation: randomCouponBg linear 4.8s infinite alternate;
    background: -o-linear-gradient(355deg, rgba(242, 247, 237, 0.6) 0, rgba(230, 244, 255, 0.6) 12%, rgba(255, 230, 255, 0.6) 25%, rgba(253, 231, 255, 0.6) 37%, rgba(242, 247, 237, 0.6) 50%, rgba(230, 244, 255, 0.6) 62%, rgba(230, 244, 255, 0.6) 75%, rgba(255, 230, 255, 0.6) 87%, rgba(242, 247, 237, 0.6) 100%);
    background: linear-gradient(95deg, rgba(242, 247, 237, 0.6) 0, rgba(230, 244, 255, 0.6) 12%, rgba(255, 230, 255, 0.6) 25%, rgba(253, 231, 255, 0.6) 37%, rgba(242, 247, 237, 0.6) 50%, rgba(230, 244, 255, 0.6) 62%, rgba(230, 244, 255, 0.6) 75%, rgba(255, 230, 255, 0.6) 87%, rgba(242, 247, 237, 0.6) 100%);
    background-size: 300%
}

.component-today-coupon .coupon-list-group .section-link.random .coupon-logo {
    background-color: var(--color-w50)
}

.component-today-coupon .coupon-list-group .section-link.random .txt-eyebrow {
    font-size: 1.4rem;
    color: var(--txt-ter)
}

.component-today-coupon .coupon-list-group .section-link.random .txt-price {
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
    line-height: 2.1rem
}

.component-today-coupon .btn-group {
    margin: 2.4rem 0
}

.component-today-coupon .btn-view-more {
    padding: 0.4rem 0
}

@-webkit-keyframes randomCouponBg {
    from {
        background-position: -100%
    }
    to {
        background-position: 0
    }
}

@keyframes randomCouponBg {
    from {
        background-position: -100%
    }
    to {
        background-position: 0
    }
}

.section-component.addbrand {
    display: block;
    margin: 0 2rem;
    padding: 2.4rem 0;
    background-color: var(--bg-qua);
    border-radius: 2rem
}

.section-component.addbrand .prd-detail-wrap.icon-slide-prd.type5 {
    background: transparent !important
}

.section-component.addbrand .title-field-01 {
    margin-top: 0.4rem;
    color: var(--txt-sec)
}

.section-component.addbrand .txt-guide {
    margin-top: 0;
    font-size: 1.4rem;
    font-weight: 500;
    line-height: 2rem;
    color: var(--txt-ter)
}

.section-component.addbrand .prd-detail-wrap.icon-slide-prd.type5 {
    margin-bottom: 3.2rem
}

.section-component.addbrand .prd-detail-wrap.icon-slide-prd.type5 .bridgeCashback-list-wrapper {
    height: 5.4rem
}

.section-component.addbrand .prd-detail-wrap.icon-slide-prd.type5 .bridgeCashback-list-wrapper::before,
.section-component.addbrand .prd-detail-wrap.icon-slide-prd.type5 .bridgeCashback-list-wrapper:after {
    width: 3.4rem;
    height: 5.4rem
}

.section-component.addbrand .prd-detail-wrap.icon-slide-prd.type5 .bridgeCashback-list-wrapper:before {
    background: -webkit-gradient(linear, left top, right top, from(#f7f9fd), color-stop(30%, #f7f9fd), to(rgba(247, 249, 253, 0)));
    background: -o-linear-gradient(left, #f7f9fd 0, #f7f9fd 30%, rgba(247, 249, 253, 0) 100%);
    background: linear-gradient(90deg, #f7f9fd 0, #f7f9fd 30%, rgba(247, 249, 253, 0) 100%)
}

.section-component.addbrand .prd-detail-wrap.icon-slide-prd.type5 .bridgeCashback-list-wrapper:after {
    background: -webkit-gradient(linear, right top, left top, from(#f7f9fd), color-stop(30%, #f7f9fd), to(rgba(247, 249, 253, 0)));
    background: -o-linear-gradient(right, #f7f9fd 0, #f7f9fd 30%, rgba(247, 249, 253, 0) 100%);
    background: linear-gradient(270deg, #f7f9fd 0, #f7f9fd 30%, rgba(247, 249, 253, 0) 100%)
}

.section-component.addbrand .bridgeCashback-list-wrapper .logo-slide-box .logo-img-box.type1 img {
    width: 5.4rem;
    height: 5.4rem;
    margin: 0 1.2rem;
    border-radius: 2rem
}

.section-component.addbrand .prd-detail-wrap.icon-slide-prd.type5 img.border {
    border: 1px solid var(--border-quin)
}

.container-component.today-coupon.h-center .section-component .component-text-simple {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 6.6rem;
    text-align: center
}

.container-component.today-coupon.h-center .section-component .component-text-simple .title-group {
    position: relative;
    width: 100%;
    height: 6.6rem
}

.container-component.today-coupon.h-center .section-component .component-text-simple .txt-lv08 {
    line-height: 1;
    font-weight: bold;
    background: -o-linear-gradient(341deg, #23b4d7 0, #4262e3 50%, #8c59dc 100%);
    background: linear-gradient(109deg, #23b4d7 0, #4262e3 50%, #8c59dc 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    -webkit-text-stroke: transparent
}

.container-component.today-coupon.h-center .section-component .component-text-simple .txt1,
.container-component.today-coupon.h-center .section-component .component-text-simple .txt2 {
    position: absolute;
    -webkit-transition: all 0.3s ease-in;
    -o-transition: all 0.3s ease-in;
    transition: all 0.3s ease-in;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    white-space: nowrap
}

.container-component.today-coupon.h-center .section-component .component-text-simple .txt2 {
    opacity: 0;
    line-height: 3.3rem
}

.container-component.today-coupon.h-center .section-component .component-text-simple .txt1 {
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    margin-top: -1.65rem
}

.container-component.today-coupon.finish .section-component .component-text-simple .txt1 {
    opacity: 0
}

.container-component.today-coupon.finish .section-component .component-text-simple .txt2 {
    opacity: 1
}

.container-component.today-coupon.finish .result-confetti.ui-lottie {
    display: none
}

.component-scratch-coupon {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.component-scratch-coupon .lottery-data {
    height: 100%
}

.component-scratch-coupon .card-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    border-radius: 2rem;
    overflow: hidden;
    background-color: transparent
}

.component-scratch-coupon .card-group .card-header+.card-row-info {
    margin-top: 0
}

.component-scratch-coupon .card-group .card-header {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding-top: 4rem;
    text-align: center;
    background-color: var(--bg-base)
}

.component-scratch-coupon .card-group .card-img-figure {
    width: 10rem;
    height: 10rem;
    margin-bottom: 4rem;
    border-radius: 3.2rem
}

.component-scratch-coupon .card-group .card-img-figure img {
    max-width: 100%
}

.component-scratch-coupon .card-group .card-header .card-info .card-tit {
    overflow: hidden;
    display: block;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 0 1.6rem;
    font-size: 1.8rem;
    font-weight: 500;
    line-height: 2.5rem;
    color: var(--txt-ter)
}

.component-scratch-coupon .card-group .card-header .card-info .card-sum {
    margin-top: 0.8rem;
    font-size: 4rem;
    font-weight: 700;
    line-height: 4.2rem;
    color: var(--txt-pri)
}

.component-scratch-coupon .card-group .card-row-info {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 6.8rem;
    padding: 2.4rem 0;
    border-top: 1px dashed var(--border-ter);
    border-radius: 0 0 2rem 2rem;
    background-color: var(--bg-qua);
    text-align: center;
    font-size: 1.4rem;
    font-weight: 500;
    line-height: 2rem;
    color: var(--txt-ter)
}

.component-scratch-coupon .lottery-wrap {
    position: relative;
    width: 27rem;
    height: 36.5rem;
    display: block;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    border-radius: 2rem;
    -webkit-box-shadow: 0 0.4rem 2rem rgba(0, 0, 0, 0.05);
    box-shadow: 0 0.4rem 2rem rgba(0, 0, 0, 0.05)
}

.component-scratch-coupon .lottery-wrap.end {
    pointer-events: none
}

.component-scratch-coupon .lottery-wrap canvas {
    position: absolute;
    border-radius: 2rem;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.component-scratch-coupon .result-confetti {
    display: none;
    position: absolute;
    top: 0;
    right: 0;
    height: auto;
    z-index: 1
}

.component-scratch-coupon .lottery-wrap.end+.result-confetti {
    display: block
}

.component-scratch-coupon .lottery-touch {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 3;
    width: 27rem;
    height: 36.5rem;
    background-color: var(--bg-sec);
    border-radius: 2rem;
    -webkit-transform: translate3d(-50%, -50%, 0);
    transform: translate3d(-50%, -50%, 0);
    pointer-events: none
}

.component-scratch-coupon .lottery-touch img {
    width: 14rem;
    height: auto
}

.component-scratch-coupon .lottery-touch .txt-lv01 {
    display: block;
    margin-top: 1.2rem;
    white-space: nowrap;
    text-align: center
}

.component-scratch-coupon .lottery-wrap.end .lottery-touch,
.component-scratch-coupon .lottery-wrap.touch .lottery-touch {
    display: none
}

.component-text-simple.add-brand {
    margin-top: 1.6rem;
    text-align: center
}

.component-text-simple.add-brand .txt-lv11 {
    margin: 1.2rem 0 1.6rem
}

.component-text-simple.add-brand .txt-lv11 .txt {
    font-size: 2.8rem;
    font-weight: 700;
    line-height: 3.6rem
}

.component-text-simple.add-brand .img-group {
    margin-top: 3.6rem
}

.component-text-simple.add-brand .img-group img {
    width: 20rem
}

.component-today-coupon.type2 {
    margin-top: 0
}

.component-today-coupon.type2 .coupon-list-group .txt-eyebrow {
    font-size: 1.3rem;
    line-height: 1.8rem
}

.component-today-coupon.type2 .coupon-list-group .coupon-state {
    background-color: var(--bg-base)
}

.component-today-coupon.type2 .coupon-list-group .txt-tit {
    width: 100%;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    white-space: normal
}

.component-today-coupon.type2 .coupon-list-group .txt-price {
    width: 100%;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden
}

.section-component.stars-type1 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    position: relative;
    height: calc(100vh - 5rem);
    overflow: hidden
}

.section-component.stars-type1 .component-text-simple {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: url("/resource/img/mmk/common/teen/bg_universe.png") no-repeat 50% 0/cover;
    text-align: center
}

.section-component.stars-type1 .component-text-simple .title-group {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    height: 4.4rem;
    margin-top: 2.4rem;
    padding: 1.2rem 1.6rem;
    border-radius: 10rem;
    background-color: var(--bg-pri-invert)
}

.section-component.stars-type1 .component-text-simple .img-group {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    position: relative;
    width: 30rem;
    height: 30rem;
    margin: 0 auto
}

.section-component.stars-type1 .component-text-simple .img-group img {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    max-width: 100%
}

.section-component.stars-type1 .component-kds-arrow-scroll {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 7.6rem;
    padding-top: 0
}

.section-component.stars-type1 .component-tooltip {
    position: absolute;
    bottom: 4.5rem;
    left: 50%;
    z-index: 5;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    text-align: center
}

.section-component.stars-type2 {
    padding-top: 4.8rem;
    padding-bottom: 8rem
}

.section-component.stars-type2 .component-text-simple {
    margin-top: 3.2rem
}

.section-component.stars-type2 .component-text-simple .title-group .title-field-01 {
    margin-bottom: 0.4rem;
    color: var(--txt-pri-invert)
}

.section-component.stars-type2 .component-text-simple .title-group .txt-guide {
    margin-top: 0.4rem;
    font-size: 1.4rem;
    color: var(--txt-sec-invert)
}

.component-explore-stars-carousel {
    margin-top: 1.2rem
}

.component-explore-stars-carousel .swiper-slide {
    width: calc(100% - 1.5rem);
    height: 13.9rem;
    padding: 2.4rem 7.6rem 2.4rem 2rem;
    background-color: var(--bg-pri-invert);
    border-radius: 1.6rem
}

.component-explore-stars-carousel .swiper-slide:only-child {
    margin: 0 auto
}

.component-explore-stars-carousel .title-group .title-field-01 {
    margin-bottom: 0.4rem;
    color: var(--color-w100)
}

.component-explore-stars-carousel .title-group .txt-guide {
    margin-top: 0;
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--txt-sec-invert)
}

.component-explore-stars-carousel .title-group .number {
    font-weight: 700;
    color: var(--color-vo200)
}

.component-explore-stars-carousel .title-group .title-flex-area .title-field-01 {
    font-size: 1.1rem;
    font-weight: 400;
    line-height: 1.4rem;
    color: var(--txt-sec-invert)
}

.component-explore-stars-carousel .title-group .title-flex-area .txt-lv10 {
    color: var(--txt-sec-invert)
}

.component-explore-stars-carousel .img-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: absolute;
    top: 2.4rem;
    right: 2rem;
    width: 4.4rem;
    height: 4.4rem;
    border-radius: 2rem;
    background-color: var(--color-g900);
    overflow: hidden
}

.component-explore-stars-carousel .img-group img {
    width: 4.4rem;
    height: 4.4rem
}

.component-explore-stars-carousel .img-group.lock::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(37, 43, 55, 0.8)
}

.component-explore-stars-carousel .img-group.lock .ico-colored-lock.dark {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 3;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.component-explore-stars-carousel .swiper-pagination {
    margin-top: 1.6rem
}

.component-explore-stars-carousel .swiper-pagination-bullet {
    width: 0.6rem !important;
    height: 0.6rem !important;
    background-color: transparent;
    border: 1px solid var(--color-w50)
}

.component-explore-stars-carousel .swiper-pagination-bullet.swiper-pagination-bullet-active {
    background-color: var(--ico-pri-invert);
    border: 1px solid var(--ico-pri-invert)
}

.component-explore-stars-carousel .swiper-pagination-bullet+.swiper-pagination-bullet {
    margin-left: 0.5rem
}

.reward-display-monthly {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 4.4rem;
    margin-top: 2.4rem;
    padding: 1.2rem 1.6rem;
    border-radius: 10rem;
    background-color: var(--bg-pri-invert)
}

.reward-display-monthly [class^="ico-"] {
    width: 2rem;
    height: 2rem
}

.reward-display-monthly .txt {
    margin: 0 0.8rem;
    font-size: 1.4rem;
    font-weight: 500;
    line-height: 2rem;
    color: var(--txt-sec-invert)
}

.reward-display-monthly .count {
    font-size: 1.4rem;
    font-weight: 700;
    line-height: 2rem;
    color: var(--txt-pri-invert)
}

.component-today-coupon .coupon-list-group.type1 .section-link {
    height: auto;
    border: 0;
    background-color: transparent
}

.component-today-coupon .coupon-list-group.type1 .list-item+.list-item {
    margin-top: 3.2rem
}

.component-today-coupon .coupon-list-group.type1 .coupon-detail {
    padding: 0 1.6rem 0 0.8rem;
    border-right: 0
}

.component-today-coupon .coupon-list-group.type1 .txt-tit {
    color: var(--txt-sec-invert)
}

.component-today-coupon .coupon-list-group.type1 .txt-price {
    color: var(--txt-pri-invert)
}

.component-today-coupon .coupon-list-group.type1 .coupon-state {
    -webkit-box-flex: 0;
    -ms-flex: 0;
    flex: 0;
    padding-right: 0.8rem;
    background-color: transparent
}

.component-today-coupon .coupon-list-group.type1 .section-link.finish .coupon-logo {
    opacity: 0.4
}

.component-today-coupon .coupon-list-group.type1 .section-link.finish .txt-tit {
    color: var(--color-w20)
}

.component-today-coupon .coupon-list-group.type1 .section-link.finish .txt-price {
    color: var(--color-w40)
}

.component-prd-info.type2 {
    padding-top: 1.6rem;
    padding-bottom: 5.2rem
}

.component-prd-info.type2 .sales-info-group .price {
    font-size: 2.1rem;
    line-height: 2.7rem;
    color: var(--txt-sec)
}

.component-prd-info.type2 .sales-info-group .txt-01 {
    color: var(--txt-ter)
}

.component-prd-info.type2 .sales-info-group .txt-03 {
    margin-top: 0.2rem;
    font-size: 1.6rem;
    line-height: 2.1rem;
    color: var(--txt-sec)
}

.component-prd-info.type2 .sales-info-group .col-cont {
    padding: 0 2.1rem
}

.component-prd-info.type2 .sales-info-group .col-cont:first-child {
    padding-left: 0
}

.component-prd-info.type2 .sales-info-group .col-cont:last-child {
    padding-right: 0
}

.page-inner-scroll.mission-onboarding {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(20%, #fff), to(#e3ebfc));
    background: -o-linear-gradient(top, #fff 20%, #e3ebfc 100%);
    background: linear-gradient(180deg, #fff 20%, #e3ebfc 100%)
}

.page-inner-scroll.mission-onboarding .container-component {
    overflow: hidden
}

.section-component.mission-onboarding1 .component-list {
    padding: 0 2.8rem
}

.section-component.mission-onboarding1 .rec-list-group.type1 {
    max-width: 31.9rem;
    margin: 0 auto;
    padding: 0
}

.section-component.mission-onboarding1 .rec-list-group.type1 .rec-list-item {
    padding: 1.6rem 2rem;
    background-color: var(--bg-pri-base);
    -webkit-box-shadow: 0 0.4rem 0.8rem 0 rgba(80, 100, 197, 0.16);
    box-shadow: 0 0.4rem 0.8rem 0 rgba(80, 100, 197, 0.16);
    border-radius: 2rem;
    opacity: 0
}

.section-component.mission-onboarding1 .rec-list-group.type1 .rec-list-item+.rec-list-item {
    margin-top: 1.7rem
}

.section-component.mission-onboarding1 .rec-list-group.type1 .rec-item-img {
    width: 4rem;
    height: 4rem;
    margin-right: 1.2rem
}

.section-component.mission-onboarding1 .rec-list-group.type1 .rec-item-txt {
    margin-right: 1.2rem
}

.section-component.mission-onboarding1 .rec-list-group.type1 .rec-item-txt .txt01 {
    font-size: 1.4rem
}

.section-component.mission-onboarding1 .rec-list-group.type1 .rec-item-txt .txt02 {
    font-size: 1.2rem;
    color: var(--txt-ter)
}

.section-component.mission-onboarding1 .component-toast {
    opacity: 0;
    -webkit-transition: opacity 0.7s var(--kds-easing-float);
    -o-transition: opacity 0.7s var(--kds-easing-float);
    transition: opacity 0.7s var(--kds-easing-float);
    -webkit-transition-delay: 1.75s;
    -o-transition-delay: 1.75s;
    transition-delay: 1.75s
}

.section-component.mission-onboarding1 .ico-coin-flip {
    opacity: 0;
    position: absolute;
    top: -4.8rem;
    right: 3.45rem;
    width: 3.6rem;
    height: 3.6rem
}

.section-component.mission-onboarding1 .rec-list-item .btn-lv04 {
    width: 6.5rem;
    padding-right: 0;
    padding-left: 0;
    border: 0
}

.section-component.mission-onboarding1 .rec-list-item .btn-lv04 .txt {
    font-size: 1.3rem
}

.section-component.mission-onboarding1 .rec-list-item:nth-child(1) .btn-lv04.primary2 {
    position: relative;
    z-index: 3;
    opacity: 1;
    -webkit-transition: opacity .8s ease-out;
    -o-transition: opacity .8s ease-out;
    transition: opacity .8s ease-out;
    -webkit-transition-delay: 1.75s;
    -o-transition-delay: 1.75s;
    transition-delay: 1.75s
}

.section-component.mission-onboarding1 .btn-lv04.primary1.disabled {
    opacity: 0;
    -webkit-transition: opacity .8s ease-in;
    -o-transition: opacity .8s ease-in;
    transition: opacity .8s ease-in;
    -webkit-transition-delay: 1.75s;
    -o-transition-delay: 1.75s;
    transition-delay: 1.75s;
    position: absolute;
    top: 50%;
    right: 2rem;
    z-index: 1;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

.section-component.mission-onboarding1 .btn-lv04.primary1.disabled {
    opacity: 1
}

.section-component.mission-onboarding1 .btn-lv04.primary1.disabled .txt {
    color: var(--txt-readonly)
}

.section-component.mission-onboarding1 .rec-list-group.type1 .rec-list-item .ico-check-line.bu700 {
    -webkit-filter: var(--filter-bu700) !important;
    filter: var(--filter-bu700) !important
}

.section-component.mission-onboarding1 .btn-lv04.primary1.disabled i {
    -webkit-filter: none;
    filter: none
}

.section-component.mission-onboarding1.active .rec-list-group.type1 .rec-list-item:nth-child(1) {
    -webkit-animation: onboarding1-fade-up1 0.6s var(--kds-easing-float) forwards;
    animation: onboarding1-fade-up1 0.6s var(--kds-easing-float) forwards;
    -webkit-animation-delay: .8s;
    animation-delay: .8s
}

.section-component.mission-onboarding1.active .rec-list-group.type1 .rec-list-item:nth-child(2) {
    -webkit-animation: onboarding1-fade-up2 0.6s var(--kds-easing-float) forwards;
    animation: onboarding1-fade-up2 0.6s var(--kds-easing-float) forwards;
    -webkit-animation-delay: .85s;
    animation-delay: .85s
}

.section-component.mission-onboarding1.active .rec-list-group.type1 .rec-list-item:nth-child(3) {
    -webkit-animation: onboarding1-fade-up3 0.6s var(--kds-easing-float) forwards;
    animation: onboarding1-fade-up3 0.6s var(--kds-easing-float) forwards;
    -webkit-animation-delay: .9s;
    animation-delay: .9s
}

.section-component.mission-onboarding1.active .rec-list-group.type1 .rec-list-item:nth-child(4) {
    -webkit-animation: onboarding1-fade-up4 0.6s var(--kds-easing-float) forwards;
    animation: onboarding1-fade-up4 0.6s var(--kds-easing-float) forwards;
    -webkit-animation-delay: .95s;
    animation-delay: .95s
}

.section-component.mission-onboarding1.active .ico-coin-flip {
    -webkit-animation: onboarding1-coin-show 0.7s 1.75s ease-out forwards, onboarding1-coin-hide 0.8s 2.45s ease-out forwards;
    animation: onboarding1-coin-show 0.7s 1.75s ease-out forwards, onboarding1-coin-hide 0.8s 2.45s ease-out forwards
}

.section-component.mission-onboarding1.active .component-toast {
    opacity: 1;
    -webkit-animation: onboarding1-toast-hide 3s .2s forwards;
    animation: onboarding1-toast-hide 3s .2s forwards;
    -webkit-animation-delay: 2.45s;
    animation-delay: 2.45s
}

.section-component.mission-onboarding1.active .rec-list-item:nth-child(1) .btn-lv04.primary2 {
    opacity: 0
}

@-webkit-keyframes onboarding1-coin-show {
    0% {
        opacity: 0;
        -webkit-transform: translateY(2rem);
        transform: translateY(2rem)
    }
    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

@keyframes onboarding1-coin-show {
    0% {
        opacity: 0;
        -webkit-transform: translateY(2rem);
        transform: translateY(2rem)
    }
    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

@-webkit-keyframes onboarding1-coin-hide {
    0% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0);
        top: -4.8rem
    }
    70% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0);
        top: -4.8rem
    }
    100% {
        opacity: 0;
        -webkit-transform: translateY(2rem);
        transform: translateY(2rem);
        top: -4.8rem
    }
}

@keyframes onboarding1-coin-hide {
    0% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0);
        top: -4.8rem
    }
    70% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0);
        top: -4.8rem
    }
    100% {
        opacity: 0;
        -webkit-transform: translateY(2rem);
        transform: translateY(2rem);
        top: -4.8rem
    }
}

@-webkit-keyframes onboarding1-fade-up1 {
    0% {
        opacity: 0;
        -webkit-transform: translateY(15rem);
        transform: translateY(15rem)
    }
    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

@keyframes onboarding1-fade-up1 {
    0% {
        opacity: 0;
        -webkit-transform: translateY(15rem);
        transform: translateY(15rem)
    }
    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

@-webkit-keyframes onboarding1-fade-up2 {
    0% {
        opacity: 0;
        -webkit-transform: translateY(15rem);
        transform: translateY(15rem)
    }
    100% {
        opacity: .75;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

@keyframes onboarding1-fade-up2 {
    0% {
        opacity: 0;
        -webkit-transform: translateY(15rem);
        transform: translateY(15rem)
    }
    100% {
        opacity: .75;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

@-webkit-keyframes onboarding1-fade-up3 {
    0% {
        opacity: 0;
        -webkit-transform: translateY(15rem);
        transform: translateY(15rem)
    }
    100% {
        opacity: .45;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

@keyframes onboarding1-fade-up3 {
    0% {
        opacity: 0;
        -webkit-transform: translateY(15rem);
        transform: translateY(15rem)
    }
    100% {
        opacity: .45;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

@-webkit-keyframes onboarding1-fade-up4 {
    0% {
        opacity: 0;
        -webkit-transform: translateY(15rem);
        transform: translateY(15rem)
    }
    100% {
        opacity: .10;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

@keyframes onboarding1-fade-up4 {
    0% {
        opacity: 0;
        -webkit-transform: translateY(15rem);
        transform: translateY(15rem)
    }
    100% {
        opacity: .10;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

@-webkit-keyframes onboarding1-toast-hide {
    0% {
        opacity: 1
    }
    90% {
        opacity: 1
    }
    100% {
        opacity: 0
    }
}

@keyframes onboarding1-toast-hide {
    0% {
        opacity: 1
    }
    90% {
        opacity: 1
    }
    100% {
        opacity: 0
    }
}

.section-component.mission-onboarding2 {
    position: relative
}

.section-component.mission-onboarding2 .component-progress {
    position: absolute;
    top: 28rem;
    right: 0;
    left: 0;
    padding-bottom: 0;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
    -webkit-transition: opacity 0.8s var(--kds-easing-bounce) 1.2s, -webkit-transform 0.8s var(--kds-easing-bounce) 1.2s;
    transition: opacity 0.8s var(--kds-easing-bounce) 1.2s, -webkit-transform 0.8s var(--kds-easing-bounce) 1.2s;
    -o-transition: opacity 0.8s var(--kds-easing-bounce) 1.2s, transform 0.8s var(--kds-easing-bounce) 1.2s;
    transition: opacity 0.8s var(--kds-easing-bounce) 1.2s, transform 0.8s var(--kds-easing-bounce) 1.2s;
    transition: opacity 0.8s var(--kds-easing-bounce) 1.2s, transform 0.8s var(--kds-easing-bounce) 1.2s, -webkit-transform 0.8s var(--kds-easing-bounce) 1.2s
}

.section-component.mission-onboarding2 .component-list {
    margin-top: 8rem;
    opacity: 0;
    -webkit-transform: translateY(30%);
    -ms-transform: translateY(30%);
    transform: translateY(30%);
    -webkit-transition: opacity 0.8s var(--kds-easing-bounce) 1.35s, -webkit-transform 0.8s var(--kds-easing-bounce) 1.35s;
    transition: opacity 0.8s var(--kds-easing-bounce) 1.35s, -webkit-transform 0.8s var(--kds-easing-bounce) 1.35s;
    -o-transition: opacity 0.8s var(--kds-easing-bounce) 1.35s, transform 0.8s var(--kds-easing-bounce) 1.35s;
    transition: opacity 0.8s var(--kds-easing-bounce) 1.35s, transform 0.8s var(--kds-easing-bounce) 1.35s;
    transition: opacity 0.8s var(--kds-easing-bounce) 1.35s, transform 0.8s var(--kds-easing-bounce) 1.35s, -webkit-transform 0.8s var(--kds-easing-bounce) 1.35s
}

.section-component.mission-onboarding2 .list-mission-group,
.section-component.mission-onboarding2 .list-mission-group.list-unlock .list-col {
    height: 24.8rem
}

.section-component.mission-onboarding2 .list-mission-group.list-unlock .list-col {
    opacity: 1
}

.section-component.mission-onboarding2 .list-mission-group .rolling-pin {
    background-image: url(/resource/img/mmk/common/moneymission/roulette_arrow.png)
}

.section-component.mission-onboarding2 .component-tooltip {
    text-align: center;
    opacity: 0;
    -webkit-transition: opacity .2s ease-out 1.8s;
    -o-transition: opacity .2s ease-out 1.8s;
    transition: opacity .2s ease-out 1.8s
}

.section-component.mission-onboarding2 .component-tooltip .tooltip-focus-group .tooltip-area {
    position: static;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none
}

.section-component.mission-onboarding2 .progress-box-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    position: relative;
    width: 100%;
    padding: 1.6rem 1.7rem;
    border-radius: 1.6rem;
    background-color: var(--bg-pri-base);
    -webkit-box-shadow: 0 0.4rem 1.6rem 0 rgba(80, 100, 197, 0.12);
    box-shadow: 0 0.4rem 1.6rem 0 rgba(80, 100, 197, 0.12)
}

.section-component.mission-onboarding2 .progress-box-group .progress-bar {
    overflow: hidden;
    position: relative;
    width: 100%;
    height: 0.8rem;
    margin-top: 1.2rem;
    border-radius: 0.2rem;
    background-color: var(--color-g300)
}

.section-component.mission-onboarding2 .progress-box-group .progress-bar .progress-value {
    position: absolute;
    top: 0;
    left: 0;
    width: 40%;
    height: 100%;
    border-radius: 0.2rem;
    background: -webkit-gradient(linear, left top, right top, color-stop(0, #438eff), to(#8d70f7));
    background: -o-linear-gradient(left, #438eff 0, #8d70f7 100%);
    background: linear-gradient(90deg, #438eff 0, #8d70f7 100%);
    -webkit-transition: width .8s ease-out;
    -o-transition: width .8s ease-out;
    transition: width .8s ease-out
}

.section-component.mission-onboarding2 .progress-box-group .progress-bar-txt {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.section-component.mission-onboarding2 .progress-box-group .progress-bar-txt .item-txt {
    font-size: 1.4rem;
    color: var(--color-g700)
}

.section-component.mission-onboarding2.active .progress-box-group .progress-bar .progress-value {
    width: 100%
}

.section-component.mission-onboarding2.active .component-progress {
    -webkit-transform: translateY(-100%);
    -ms-transform: translateY(-100%);
    transform: translateY(-100%);
    opacity: 0
}

.section-component.mission-onboarding2.active .component-list {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0)
}

.section-component.mission-onboarding2.active .component-tooltip {
    opacity: 1;
    -webkit-animation: onboarding-tooltip-float 2s ease-out infinite;
    animation: onboarding-tooltip-float 2s ease-out infinite
}

@-webkit-keyframes onboarding-tooltip-float {
    0%,
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
    50% {
        -webkit-transform: translateY(0.8rem);
        transform: translateY(0.8rem)
    }
}

@keyframes onboarding-tooltip-float {
    0%,
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
    50% {
        -webkit-transform: translateY(0.8rem);
        transform: translateY(0.8rem)
    }
}

.section-component.mission-onboarding3 .component-scratch-coupon {
    display: block;
    position: relative;
    margin-top: 5rem;
    text-align: center
}

.section-component.mission-onboarding3 .component-scratch-coupon .lottery-wrap {
    width: 20rem;
    height: 27.2rem
}

.section-component.mission-onboarding3 .component-scratch-coupon .img {
    width: 35.1rem;
    position: relative;
    z-index: 3
}

.section-component.mission-onboarding3 .missioncard-confetti {
    position: relative;
    z-index: 3;
    max-width: 42rem
}

.section-component.mission-onboarding3 .missioncard-result-confetti {
    position: absolute;
    z-index: 2;
    top: 0;
    left: 50%;
    max-width: 42rem;
    -webkit-transform: translateX(-50%) scale(1.2);
    -ms-transform: translateX(-50%) scale(1.2);
    transform: translateX(-50%) scale(1.2)
}

.section-component.mission-onboarding3 .component-toast {
    opacity: 0;
    -webkit-transition: opacity 0.3s var(--kds-easing-float);
    -o-transition: opacity 0.3s var(--kds-easing-float);
    transition: opacity 0.3s var(--kds-easing-float)
}

.section-component.mission-onboarding3 .component-toast.toast-wrap.icon-type .toast-group {
    padding: 1.2rem 2rem 1.2rem 1.6rem
}

.section-component.mission-onboarding3 .component-toast.toast-wrap.icon-type .toast-group .ico-colored-confetti {
    width: 2rem;
    height: 2rem
}

.section-component.mission-onboarding3 .toast-wrap.icon-type .toast-txt {
    margin-left: 0.6rem
}

.section-component.mission-onboarding3.toast .component-toast {
    position: relative;
    z-index: 10;
    opacity: 1;
    -webkit-animation: onboarding1-toast-hide 3s .2s ease-out forwards;
    animation: onboarding1-toast-hide 3s .2s ease-out forwards
}

.section-component.mission-top {
    position: -webkit-sticky;
    position: sticky;
    top: 5rem;
    left: 0;
    z-index: 2;
    padding-top: 3.2rem
}

.section-component.mission-top .component-text-simple .txt-lv09 {
    line-height: 3.2rem
}

.section-component.mission-top .component-text-simple .txt-guide {
    line-height: 2rem
}

.section-component.mission-top .btn-lv08.gray-round {
    border: 0
}

.section-component.mission-rolling {
    position: -webkit-sticky;
    position: sticky;
    top: 23.8rem;
    left: 0;
    height: 28.5rem;
    overflow: hidden
}

.section-component.mission-rolling .component-tooltip {
    text-align: center
}

.section-component.mission-rolling .component-tooltip .tooltip-focus-group .tooltip-area.align-bottom {
    top: 1.6rem
}

.section-component.mission-rolling .component-list {
    padding-top: 2.8rem
}

.list-mission-group {
    display: block;
    position: relative;
    height: 21rem;
    padding-top: 2.4rem
}

.list-mission-group {
    height: 25.8rem
}

.list-mission-group .list-item {
    position: relative;
    margin: 0 1rem;
    width: 13.6rem
}

.list-mission-group .list-item img {
    max-width: 100%
}

.list-mission-group .rolling-pin {
    position: absolute;
    left: 50%;
    top: 0;
    z-index: 4;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    width: 4.4rem;
    height: 5rem;
    background: url(/resource/img/mmk/common/moneymission/roulette_arrow_dimmed.png) no-repeat 0 0/100%
}

.list-mission-group .rolling-pin svg {
    display: none
}

.list-mission-group .rolling-pin-lottie {
    width: 6rem;
    height: 6.8rem;
    position: absolute;
    left: 50%;
    top: -1.7rem;
    z-index: 4;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%)
}

.section-component.mission-list {
    position: relative;
    z-index: 3;
    padding-bottom: 8rem;
    background-color: var(--bg-base);
    border-radius: 3.2rem 3.2rem 0 0
}

.section-component.mission-list .component-prd-icon {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 5.2rem;
    opacity: 1;
    padding-top: 1.6rem;
    margin-bottom: 0
}

.section-component.mission-list .component-prd-icon .ico-arrow_up {
    width: 2.8rem;
    height: 1.2rem
}

.section-component.mission-list .component-tooltip {
    position: absolute;
    top: -1.6rem;
    left: 50%;
    z-index: 3;
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    text-align: center
}

.section-component.mission-list .component-tooltip .tooltip-focus-group .tooltip-area {
    position: static;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none
}

.section-component.mission-list .component-tooltip.type1 {
    top: -1.6rem
}

.section-component.mission-list .component-progress {
    padding-bottom: 2rem
}

.section-component.mission-list .btn-lv04.primary1.disabled i {
    -webkit-filter: none;
    filter: none
}

@-webkit-keyframes tooltipShow {
    0% {
        opacity: 0
    }
    100% {
        opacity: 1
    }
}

@keyframes tooltipShow {
    0% {
        opacity: 0
    }
    100% {
        opacity: 1
    }
}

@-webkit-keyframes tooltipHide {
    0% {
        opacity: 1
    }
    90% {
        opacity: 1
    }
    100% {
        opacity: 0
    }
}

@keyframes tooltipHide {
    0% {
        opacity: 1
    }
    90% {
        opacity: 1
    }
    100% {
        opacity: 0
    }
}

.list-mission-group.list-lock .list-item {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    opacity: 0;
    -webkit-transition: opacity 0.4s var(--kds-easing-float), -webkit-transform 0.6s var(--kds-easing-float);
    transition: opacity 0.4s var(--kds-easing-float), -webkit-transform 0.6s var(--kds-easing-float);
    -o-transition: transform 0.6s var(--kds-easing-float), opacity 0.4s var(--kds-easing-float);
    transition: transform 0.6s var(--kds-easing-float), opacity 0.4s var(--kds-easing-float);
    transition: transform 0.6s var(--kds-easing-float), opacity 0.4s var(--kds-easing-float), -webkit-transform 0.6s var(--kds-easing-float)
}

.list-mission-group.list-lock .list-item:nth-child(1),
.list-mission-group.list-lock .list-item:nth-child(5) {
    -webkit-transform: translateY(100%);
    -ms-transform: translateY(100%);
    transform: translateY(100%)
}

.list-mission-group.list-lock .list-item:nth-child(2),
.list-mission-group.list-lock .list-item:nth-child(4) {
    -webkit-transform: translateY(50%);
    -ms-transform: translateY(50%);
    transform: translateY(50%)
}

.list-mission-group.list-lock .list-item:nth-child(3) {
    -webkit-transform: translateY(30%);
    -ms-transform: translateY(30%);
    transform: translateY(30%)
}

.list-mission-group.list-lock .rolling-pin {
    -webkit-animation: none;
    animation: none
}

.list-mission-group.list-lock .list-col {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    height: 25.8rem;
    -webkit-animation: none;
    animation: none;
    opacity: 0;
    -webkit-transition: opacity 0.4s var(--kds-easing-float);
    -o-transition: opacity 0.4s var(--kds-easing-float);
    transition: opacity 0.4s var(--kds-easing-float)
}

.list-mission-group.list-unlock .list-col {
    position: absolute;
    top: 2.4rem;
    left: calc(((15.6rem * -5 + 100%) / 2));
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    height: 25.4rem;
    opacity: 0;
    -webkit-transition: opacity 0.4s var(--kds-easing-float);
    -o-transition: opacity 0.4s var(--kds-easing-float);
    transition: opacity 0.4s var(--kds-easing-float)
}

.list-mission-group.list-unlock.list-click .list-col {
    -webkit-animation: ani-rolling 3.5s forwards var(--kds-easing-steady);
    animation: ani-rolling 3.5s forwards var(--kds-easing-steady)
}

.list-mission-group.list-unlock.list-click .rolling-pin {
    -webkit-animation: ani-pin 3.5s var(--kds-easing-steady);
    animation: ani-pin 3.5s var(--kds-easing-steady)
}

.list-mission-group.list-unlock.list-reverse-click .list-col {
    animation: ani-reverse-rolling 3.5s forwards ease-in reverse
}

.list-mission-group.list-unlock.list-reverse-click .rolling-pin {
    -webkit-animation: ani-pin-reverse 3.5s ease-in;
    animation: ani-pin-reverse 3.5s ease-in
}

@-webkit-keyframes ani-rolling {
    from {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    to {
        -webkit-transform: translateX(calc((15.6rem * 5) - 100%));
        transform: translateX(calc((15.6rem * 5) - 100%))
    }
}

@keyframes ani-rolling {
    from {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    to {
        -webkit-transform: translateX(calc((15.6rem * 5) - 100%));
        transform: translateX(calc((15.6rem * 5) - 100%))
    }
}

@-webkit-keyframes ani-reverse-rolling {
    from {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    to {
        -webkit-transform: translateX(calc((15.6rem * 5) - 100%));
        transform: translateX(calc((15.6rem * 5) - 100%))
    }
}

@keyframes ani-reverse-rolling {
    from {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    to {
        -webkit-transform: translateX(calc((15.6rem * 5) - 100%));
        transform: translateX(calc((15.6rem * 5) - 100%))
    }
}

@-webkit-keyframes ani-pin {
    0% {
        -webkit-transform: translateX(-50%) rotate(0);
        transform: translateX(-50%) rotate(0)
    }
    4.545454545454546% {
        -webkit-transform: translateX(-50%) rotate(90deg);
        transform: translateX(-50%) rotate(90deg)
    }
    9.090909090909092% {
        -webkit-transform: translateX(-50%) rotate(0);
        transform: translateX(-50%) rotate(0)
    }
    13.636363636363637% {
        -webkit-transform: translateX(-50%) rotate(81.81818deg);
        transform: translateX(-50%) rotate(81.81818deg)
    }
    18.181818181818183% {
        -webkit-transform: translateX(-50%) rotate(0);
        transform: translateX(-50%) rotate(0)
    }
    22.72727272727273% {
        -webkit-transform: translateX(-50%) rotate(73.63636deg);
        transform: translateX(-50%) rotate(73.63636deg)
    }
    27.272727272727277% {
        -webkit-transform: translateX(-50%) rotate(0);
        transform: translateX(-50%) rotate(0)
    }
    31.818181818181824% {
        -webkit-transform: translateX(-50%) rotate(65.45455deg);
        transform: translateX(-50%) rotate(65.45455deg)
    }
    36.36363636363637% {
        -webkit-transform: translateX(-50%) rotate(0);
        transform: translateX(-50%) rotate(0)
    }
    40.909090909090914% {
        -webkit-transform: translateX(-50%) rotate(57.27273deg);
        transform: translateX(-50%) rotate(57.27273deg)
    }
    45.45454545454546% {
        -webkit-transform: translateX(-50%) rotate(0);
        transform: translateX(-50%) rotate(0)
    }
    50% {
        -webkit-transform: translateX(-50%) rotate(49.09091deg);
        transform: translateX(-50%) rotate(49.09091deg)
    }
    54.545454545454554% {
        -webkit-transform: translateX(-50%) rotate(0);
        transform: translateX(-50%) rotate(0)
    }
    59.0909090909091% {
        -webkit-transform: translateX(-50%) rotate(40.90909deg);
        transform: translateX(-50%) rotate(40.90909deg)
    }
    63.63636363636365% {
        -webkit-transform: translateX(-50%) rotate(0);
        transform: translateX(-50%) rotate(0)
    }
    68.18181818181819% {
        -webkit-transform: translateX(-50%) rotate(32.72727deg);
        transform: translateX(-50%) rotate(32.72727deg)
    }
    72.72727272727273% {
        -webkit-transform: translateX(-50%) rotate(0);
        transform: translateX(-50%) rotate(0)
    }
    77.27272727272728% {
        -webkit-transform: translateX(-50%) rotate(24.54545deg);
        transform: translateX(-50%) rotate(24.54545deg)
    }
    81.81818181818183% {
        -webkit-transform: translateX(-50%) rotate(0);
        transform: translateX(-50%) rotate(0)
    }
    86.36363636363637% {
        -webkit-transform: translateX(-50%) rotate(16.36364deg);
        transform: translateX(-50%) rotate(16.36364deg)
    }
    90.90909090909092% {
        -webkit-transform: translateX(-50%) rotate(0);
        transform: translateX(-50%) rotate(0)
    }
    95.45454545454547% {
        -webkit-transform: translateX(-50%) rotate(8.18182deg);
        transform: translateX(-50%) rotate(8.18182deg)
    }
    100% {
        -webkit-transform: translateX(-50%) rotate(0);
        transform: translateX(-50%) rotate(0)
    }
}

@keyframes ani-pin {
    0% {
        -webkit-transform: translateX(-50%) rotate(0);
        transform: translateX(-50%) rotate(0)
    }
    4.545454545454546% {
        -webkit-transform: translateX(-50%) rotate(90deg);
        transform: translateX(-50%) rotate(90deg)
    }
    9.090909090909092% {
        -webkit-transform: translateX(-50%) rotate(0);
        transform: translateX(-50%) rotate(0)
    }
    13.636363636363637% {
        -webkit-transform: translateX(-50%) rotate(81.81818deg);
        transform: translateX(-50%) rotate(81.81818deg)
    }
    18.181818181818183% {
        -webkit-transform: translateX(-50%) rotate(0);
        transform: translateX(-50%) rotate(0)
    }
    22.72727272727273% {
        -webkit-transform: translateX(-50%) rotate(73.63636deg);
        transform: translateX(-50%) rotate(73.63636deg)
    }
    27.272727272727277% {
        -webkit-transform: translateX(-50%) rotate(0);
        transform: translateX(-50%) rotate(0)
    }
    31.818181818181824% {
        -webkit-transform: translateX(-50%) rotate(65.45455deg);
        transform: translateX(-50%) rotate(65.45455deg)
    }
    36.36363636363637% {
        -webkit-transform: translateX(-50%) rotate(0);
        transform: translateX(-50%) rotate(0)
    }
    40.909090909090914% {
        -webkit-transform: translateX(-50%) rotate(57.27273deg);
        transform: translateX(-50%) rotate(57.27273deg)
    }
    45.45454545454546% {
        -webkit-transform: translateX(-50%) rotate(0);
        transform: translateX(-50%) rotate(0)
    }
    50% {
        -webkit-transform: translateX(-50%) rotate(49.09091deg);
        transform: translateX(-50%) rotate(49.09091deg)
    }
    54.545454545454554% {
        -webkit-transform: translateX(-50%) rotate(0);
        transform: translateX(-50%) rotate(0)
    }
    59.0909090909091% {
        -webkit-transform: translateX(-50%) rotate(40.90909deg);
        transform: translateX(-50%) rotate(40.90909deg)
    }
    63.63636363636365% {
        -webkit-transform: translateX(-50%) rotate(0);
        transform: translateX(-50%) rotate(0)
    }
    68.18181818181819% {
        -webkit-transform: translateX(-50%) rotate(32.72727deg);
        transform: translateX(-50%) rotate(32.72727deg)
    }
    72.72727272727273% {
        -webkit-transform: translateX(-50%) rotate(0);
        transform: translateX(-50%) rotate(0)
    }
    77.27272727272728% {
        -webkit-transform: translateX(-50%) rotate(24.54545deg);
        transform: translateX(-50%) rotate(24.54545deg)
    }
    81.81818181818183% {
        -webkit-transform: translateX(-50%) rotate(0);
        transform: translateX(-50%) rotate(0)
    }
    86.36363636363637% {
        -webkit-transform: translateX(-50%) rotate(16.36364deg);
        transform: translateX(-50%) rotate(16.36364deg)
    }
    90.90909090909092% {
        -webkit-transform: translateX(-50%) rotate(0);
        transform: translateX(-50%) rotate(0)
    }
    95.45454545454547% {
        -webkit-transform: translateX(-50%) rotate(8.18182deg);
        transform: translateX(-50%) rotate(8.18182deg)
    }
    100% {
        -webkit-transform: translateX(-50%) rotate(0);
        transform: translateX(-50%) rotate(0)
    }
}

@-webkit-keyframes ani-pin-reverse {
    0% {
        -webkit-transform: translateX(-50%) rotate(0);
        transform: translateX(-50%) rotate(0)
    }
    4.545454545454546% {
        -webkit-transform: translateX(-50%) rotate(-90deg);
        transform: translateX(-50%) rotate(-90deg)
    }
    9.090909090909092% {
        -webkit-transform: translateX(-50%) rotate(0);
        transform: translateX(-50%) rotate(0)
    }
    13.636363636363637% {
        -webkit-transform: translateX(-50%) rotate(-81.81818deg);
        transform: translateX(-50%) rotate(-81.81818deg)
    }
    18.181818181818183% {
        -webkit-transform: translateX(-50%) rotate(0);
        transform: translateX(-50%) rotate(0)
    }
    22.72727272727273% {
        -webkit-transform: translateX(-50%) rotate(-73.63636deg);
        transform: translateX(-50%) rotate(-73.63636deg)
    }
    27.272727272727277% {
        -webkit-transform: translateX(-50%) rotate(0);
        transform: translateX(-50%) rotate(0)
    }
    31.818181818181824% {
        -webkit-transform: translateX(-50%) rotate(-65.45455deg);
        transform: translateX(-50%) rotate(-65.45455deg)
    }
    36.36363636363637% {
        -webkit-transform: translateX(-50%) rotate(0);
        transform: translateX(-50%) rotate(0)
    }
    40.909090909090914% {
        -webkit-transform: translateX(-50%) rotate(-57.27273deg);
        transform: translateX(-50%) rotate(-57.27273deg)
    }
    45.45454545454546% {
        -webkit-transform: translateX(-50%) rotate(0);
        transform: translateX(-50%) rotate(0)
    }
    50% {
        -webkit-transform: translateX(-50%) rotate(-49.09091deg);
        transform: translateX(-50%) rotate(-49.09091deg)
    }
    54.545454545454554% {
        -webkit-transform: translateX(-50%) rotate(0);
        transform: translateX(-50%) rotate(0)
    }
    59.0909090909091% {
        -webkit-transform: translateX(-50%) rotate(-40.90909deg);
        transform: translateX(-50%) rotate(-40.90909deg)
    }
    63.63636363636365% {
        -webkit-transform: translateX(-50%) rotate(0);
        transform: translateX(-50%) rotate(0)
    }
    68.18181818181819% {
        -webkit-transform: translateX(-50%) rotate(-32.72727deg);
        transform: translateX(-50%) rotate(-32.72727deg)
    }
    72.72727272727273% {
        -webkit-transform: translateX(-50%) rotate(0);
        transform: translateX(-50%) rotate(0)
    }
    77.27272727272728% {
        -webkit-transform: translateX(-50%) rotate(-24.54545deg);
        transform: translateX(-50%) rotate(-24.54545deg)
    }
    81.81818181818183% {
        -webkit-transform: translateX(-50%) rotate(0);
        transform: translateX(-50%) rotate(0)
    }
    86.36363636363637% {
        -webkit-transform: translateX(-50%) rotate(-16.36364deg);
        transform: translateX(-50%) rotate(-16.36364deg)
    }
    90.90909090909092% {
        -webkit-transform: translateX(-50%) rotate(0);
        transform: translateX(-50%) rotate(0)
    }
    95.45454545454547% {
        -webkit-transform: translateX(-50%) rotate(-8.18182deg);
        transform: translateX(-50%) rotate(-8.18182deg)
    }
    100% {
        -webkit-transform: translateX(-50%) rotate(0);
        transform: translateX(-50%) rotate(0)
    }
}

@keyframes ani-pin-reverse {
    0% {
        -webkit-transform: translateX(-50%) rotate(0);
        transform: translateX(-50%) rotate(0)
    }
    4.545454545454546% {
        -webkit-transform: translateX(-50%) rotate(-90deg);
        transform: translateX(-50%) rotate(-90deg)
    }
    9.090909090909092% {
        -webkit-transform: translateX(-50%) rotate(0);
        transform: translateX(-50%) rotate(0)
    }
    13.636363636363637% {
        -webkit-transform: translateX(-50%) rotate(-81.81818deg);
        transform: translateX(-50%) rotate(-81.81818deg)
    }
    18.181818181818183% {
        -webkit-transform: translateX(-50%) rotate(0);
        transform: translateX(-50%) rotate(0)
    }
    22.72727272727273% {
        -webkit-transform: translateX(-50%) rotate(-73.63636deg);
        transform: translateX(-50%) rotate(-73.63636deg)
    }
    27.272727272727277% {
        -webkit-transform: translateX(-50%) rotate(0);
        transform: translateX(-50%) rotate(0)
    }
    31.818181818181824% {
        -webkit-transform: translateX(-50%) rotate(-65.45455deg);
        transform: translateX(-50%) rotate(-65.45455deg)
    }
    36.36363636363637% {
        -webkit-transform: translateX(-50%) rotate(0);
        transform: translateX(-50%) rotate(0)
    }
    40.909090909090914% {
        -webkit-transform: translateX(-50%) rotate(-57.27273deg);
        transform: translateX(-50%) rotate(-57.27273deg)
    }
    45.45454545454546% {
        -webkit-transform: translateX(-50%) rotate(0);
        transform: translateX(-50%) rotate(0)
    }
    50% {
        -webkit-transform: translateX(-50%) rotate(-49.09091deg);
        transform: translateX(-50%) rotate(-49.09091deg)
    }
    54.545454545454554% {
        -webkit-transform: translateX(-50%) rotate(0);
        transform: translateX(-50%) rotate(0)
    }
    59.0909090909091% {
        -webkit-transform: translateX(-50%) rotate(-40.90909deg);
        transform: translateX(-50%) rotate(-40.90909deg)
    }
    63.63636363636365% {
        -webkit-transform: translateX(-50%) rotate(0);
        transform: translateX(-50%) rotate(0)
    }
    68.18181818181819% {
        -webkit-transform: translateX(-50%) rotate(-32.72727deg);
        transform: translateX(-50%) rotate(-32.72727deg)
    }
    72.72727272727273% {
        -webkit-transform: translateX(-50%) rotate(0);
        transform: translateX(-50%) rotate(0)
    }
    77.27272727272728% {
        -webkit-transform: translateX(-50%) rotate(-24.54545deg);
        transform: translateX(-50%) rotate(-24.54545deg)
    }
    81.81818181818183% {
        -webkit-transform: translateX(-50%) rotate(0);
        transform: translateX(-50%) rotate(0)
    }
    86.36363636363637% {
        -webkit-transform: translateX(-50%) rotate(-16.36364deg);
        transform: translateX(-50%) rotate(-16.36364deg)
    }
    90.90909090909092% {
        -webkit-transform: translateX(-50%) rotate(0);
        transform: translateX(-50%) rotate(0)
    }
    95.45454545454547% {
        -webkit-transform: translateX(-50%) rotate(-8.18182deg);
        transform: translateX(-50%) rotate(-8.18182deg)
    }
    100% {
        -webkit-transform: translateX(-50%) rotate(0);
        transform: translateX(-50%) rotate(0)
    }
}

.page-inner-scroll.money-mission.first-lock-entry .list-mission-group .list-col {
    opacity: 1
}

.page-inner-scroll.money-mission.first-lock-entry .list-mission-group .list-item {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0)
}

.page-inner-scroll.money-mission.first-lock-entry .section-component.mission-rolling .component-list {
    opacity: 1;
    -webkit-transition: opacity 0.4s var(--kds-easing-float), -webkit-transform 1s var(--kds-easing-float);
    transition: opacity 0.4s var(--kds-easing-float), -webkit-transform 1s var(--kds-easing-float);
    -o-transition: transform 1s var(--kds-easing-float), opacity 0.4s var(--kds-easing-float);
    transition: transform 1s var(--kds-easing-float), opacity 0.4s var(--kds-easing-float);
    transition: transform 1s var(--kds-easing-float), opacity 0.4s var(--kds-easing-float), -webkit-transform 1s var(--kds-easing-float);
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0)
}

.page-inner-scroll.money-mission.first-unlock-entry {
    background: var(--bg-base)
}

.page-inner-scroll.money-mission.first-unlock-entry .component-prd-icon {}

.page-inner-scroll.money-mission.first-unlock-entry .list-mission-group .list-col {
    opacity: 1
}

.page-inner-scroll.money-mission.first-unlock-entry .section-component.mission-top {
    position: static
}

.page-inner-scroll.money-mission.first-unlock-entry .list-mission-group .rolling-pin {
    opacity: 0;
    -webkit-transform: translate(-50%, 100%);
    -ms-transform: translate(-50%, 100%);
    transform: translate(-50%, 100%);
    -webkit-transition: opacity 0.4s var(--kds-easing-float), -webkit-transform 0.4s var(--kds-easing-float);
    transition: opacity 0.4s var(--kds-easing-float), -webkit-transform 0.4s var(--kds-easing-float);
    -o-transition: transform 0.4s var(--kds-easing-float), opacity 0.4s var(--kds-easing-float);
    transition: transform 0.4s var(--kds-easing-float), opacity 0.4s var(--kds-easing-float);
    transition: transform 0.4s var(--kds-easing-float), opacity 0.4s var(--kds-easing-float), -webkit-transform 0.4s var(--kds-easing-float)
}

.page-inner-scroll.money-mission.first-unlock-entry .section-component.mission-rolling .list-col {
    opacity: 0;
    -webkit-transform: translateY(25%);
    -ms-transform: translateY(25%);
    transform: translateY(25%);
    -webkit-transition: opacity 0.4s var(--kds-easing-float), -webkit-transform 0.4s var(--kds-easing-float);
    transition: opacity 0.4s var(--kds-easing-float), -webkit-transform 0.4s var(--kds-easing-float);
    -o-transition: transform 0.4s var(--kds-easing-float), opacity 0.4s var(--kds-easing-float);
    transition: transform 0.4s var(--kds-easing-float), opacity 0.4s var(--kds-easing-float);
    transition: transform 0.4s var(--kds-easing-float), opacity 0.4s var(--kds-easing-float), -webkit-transform 0.4s var(--kds-easing-float)
}

.page-inner-scroll.money-mission.first-unlock-entry.scroll-down .component-tooltip.type2 {
    opacity: 0;
    -webkit-animation: tooltipShow 0.4s var(--kds-easing-float) forwards, tooltip-float 2s ease-out infinite;
    animation: tooltipShow 0.4s var(--kds-easing-float) forwards, tooltip-float 2s ease-out infinite;
    -webkit-animation-delay: 1.3s;
    animation-delay: 1.3s
}

.page-inner-scroll.money-mission.first-unlock-entry.first-unlock-end.scrolling .component-tooltip.type2 {
    display: none
}

@-webkit-keyframes tooltip-float {
    0%,
    100% {
        -webkit-transform: translate(-50%, 0);
        transform: translate(-50%, 0)
    }
    50% {
        -webkit-transform: translate(-50%, 0.8rem);
        transform: translate(-50%, 0.8rem)
    }
}

@keyframes tooltip-float {
    0%,
    100% {
        -webkit-transform: translate(-50%, 0);
        transform: translate(-50%, 0)
    }
    50% {
        -webkit-transform: translate(-50%, 0.8rem);
        transform: translate(-50%, 0.8rem)
    }
}

@-webkit-keyframes tooltipHide2 {
    0% {
        opacity: 1
    }
    100% {
        opacity: 0
    }
}

@keyframes tooltipHide2 {
    0% {
        opacity: 1
    }
    100% {
        opacity: 0
    }
}

.page-inner-scroll.money-mission.first-lock-entry.scroll-top {
    background: var(--bg-base)
}

.page-inner-scroll.money-mission.first-lock-entry.scroll-top .section-component.mission-rolling {
    position: -webkit-sticky;
    position: sticky;
    top: 24.3rem
}

.page-inner-scroll.money-mission.first-lock-entry.scroll-top .section-component.mission-rolling .component-list {
    opacity: 0;
    -webkit-transform: translateY(100%);
    -ms-transform: translateY(100%);
    transform: translateY(100%)
}

.page-inner-scroll.money-mission.first-lock-entry.scroll-top .section-component.mission-top {
    position: static
}

.page-inner-scroll.money-mission.first-unlock-entry.scroll-down {
    background: url(/resource/img/mmk/common/moneymission/bg_moneymission.png) no-repeat 50% 0/cover
}

.page-inner-scroll.money-mission.first-unlock-entry.scroll-down .component-header {
    background: transparent
}

.page-inner-scroll.money-mission.first-unlock-entry.scroll-down .list-mission-group .rolling-pin {
    opacity: 1;
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0)
}

.page-inner-scroll.money-mission.first-unlock-entry.scroll-down .section-component.mission-rolling .list-col {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
    -webkit-transition-delay: 0.18s;
    -o-transition-delay: 0.18s;
    transition-delay: 0.18s
}

.page-inner-scroll.money-mission.first-unlock-entry.scroll-down .section-component.mission-top {
    position: -webkit-sticky;
    position: sticky;
    top: 5rem;
    left: 0
}

.page-inner-scroll.money-mission.first-unlock-entry.scroll-down .section-component.mission-list.tooltip-open2 .component-tooltip.type2 {
    display: none
}

.page-inner-scroll.money-mission.scrolling .section-component.mission-list .component-prd-icon {
    opacity: 0;
    -webkit-transition: opacity 0.3s;
    -o-transition: opacity 0.3s;
    transition: opacity 0.3s
}

.page-inner-scroll.money-mission.scrolling.scroll-down .section-component.mission-list .component-prd-icon {
    opacity: 1
}

.section-component.mission-talisman {
    position: absolute;
    top: 11%;
    right: 0;
    left: 0;
    text-align: center
}

@media screen and (min-width: 400px) {
    .section-component.mission-talisman {
        top: 15%
    }
}

.section-component.mission-talisman .component-text-simple .reward-stars-group {
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 50%;
    width: 6.8rem;
    height: 2rem;
    height: 2rem;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%)
}

.section-component.mission-talisman .component-text-simple .reward-display-stars {
    height: 2rem;
    background: url(/resource/img/mmk/common/moneymission/star_total.png) no-repeat 0 0/6.8rem 2rem;
    -webkit-transform: translateY(100%);
    -ms-transform: translateY(100%);
    transform: translateY(100%)
}

.section-component.mission-talisman .component-text-simple .reward-display-stars .img {
    position: absolute;
    top: 0;
    width: 2rem;
    height: 2rem;
    -webkit-transform: scale(0);
    -ms-transform: scale(0);
    transform: scale(0)
}

.section-component.mission-talisman .component-text-simple .reward-display-stars .img:nth-child(1) {
    left: 0
}

.section-component.mission-talisman .component-text-simple .reward-display-stars .img:nth-child(2) {
    left: 2.4rem
}

.section-component.mission-talisman .component-text-simple .reward-display-stars .img:nth-child(3) {
    left: 4.8rem
}

.section-component.mission-talisman .component-text-simple .title-field-07 {
    overflow: hidden;
    position: absolute;
    top: 3.6rem;
    left: 0;
    width: 100%;
    height: 3.2rem;
    color: var(--color-w100)
}

.section-component.mission-talisman .component-text-simple .title-field-07>.txt {
    display: block;
    text-align: center
}

.section-component.mission-talisman .component-text-simple .txt-guide {
    overflow: hidden;
    position: absolute;
    top: 7.2rem;
    left: 0;
    width: 100%;
    height: 2.6rem;
    margin-top: 0;
    color: var(--color-w100)
}

.section-component.mission-talisman .component-text-simple .txt-guide>.txt {
    display: block;
    line-height: 2.6rem;
    text-align: center
}

.section-component.mission-talisman .component-scratch-coupon .result-confetti {
    width: 160%;
    height: auto;
    top: calc(50% - 1.6rem);
    right: auto;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    z-index: -1
}

.popup-group.mission-talisman.end .component-text-simple .reward-display-stars {
    -webkit-animation: txt-talisman-stars1 0.6s var(--kds-easing-float) forwards;
    animation: txt-talisman-stars1 0.6s var(--kds-easing-float) forwards
}

.popup-group.mission-talisman.end .component-text-simple .title-field-07>.txt,
.popup-group.mission-talisman.end .component-text-simple .txt-guide>.txt {
    -webkit-animation: talisman-txt 0.6s var(--kds-easing-float) forwards;
    animation: talisman-txt 0.6s var(--kds-easing-float) forwards
}

.popup-group.mission-talisman.end .component-text-simple .reward-display-stars .img {
    -webkit-animation: txt-talisman-stars2 0.5s var(--kds-easing-float) forwards;
    animation: txt-talisman-stars2 0.5s var(--kds-easing-float) forwards;
    -webkit-animation-delay: 1s;
    animation-delay: 1s
}

.popup-group.mission-talisman.end .component-text-simple .reward-display-stars .img:nth-child(2) {
    -webkit-animation-delay: 1.4s;
    animation-delay: 1.4s
}

.popup-group.mission-talisman.end .component-text-simple .reward-display-stars .img:nth-child(3) {
    -webkit-animation-delay: 1.8s;
    animation-delay: 1.8s
}

@-webkit-keyframes talisman-txt {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
    100% {
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%)
    }
}

@keyframes talisman-txt {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
    100% {
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%)
    }
}

@-webkit-keyframes txt-talisman-stars1 {
    0% {
        -webkit-transform: translateY(100%);
        transform: translateY(100%)
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

@keyframes txt-talisman-stars1 {
    0% {
        -webkit-transform: translateY(100%);
        transform: translateY(100%)
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

@-webkit-keyframes txt-talisman-stars2 {
    0% {
        -webkit-transform: scale(0);
        transform: scale(0)
    }
    100% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

@keyframes txt-talisman-stars2 {
    0% {
        -webkit-transform: scale(0);
        transform: scale(0)
    }
    100% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

.section-component.mission-talisman .component-scratch-coupon {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    position: absolute;
    top: 14.2rem;
    left: 50%;
    z-index: 90;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%)
}

.section-component.mission-talisman .lottery-container.n1 {
    opacity: 0;
    -webkit-animation: talisman-scale-ani 0.4s var(--kds-easing-float) forwards;
    animation: talisman-scale-ani 0.4s var(--kds-easing-float) forwards;
    -webkit-animation-delay: .4s;
    animation-delay: .4s
}

.section-component.mission-talisman .component-scratch-coupon .lottery-wrap {
    width: 22.5rem;
    height: 30.6rem;
    -webkit-box-shadow: none;
    box-shadow: none
}

.section-component.mission-talisman .component-scratch-coupon .lottery-touch {
    width: 100%;
    height: 100%;
    background-color: transparent
}

.section-component.mission-talisman .component-scratch-coupon .lottery-touch img {
    width: 100%;
    height: auto
}

.section-component.mission-talisman .component-scratch-coupon .card-group .card-img-figure {
    width: 100%;
    height: 100%;
    margin-bottom: 0;
    border-radius: 2rem
}

.section-component.mission-talisman .component-scratch-coupon .card-group {
    -webkit-box-shadow: none;
    box-shadow: none;
    overflow: visible
}

.section-component.mission-talisman .component-scratch-coupon .card-group .card-img-figure img {
    width: 100%;
    height: 100%
}

.section-component.mission-talisman .component-scratch-coupon .btn-under-link {
    margin-top: 2.8rem;
    padding: 0.8rem;
    color: var(--color-w100);
    opacity: 0
}

.section-component.mission-talisman .component-scratch-coupon .btn-under-link .txt-lv01 {
    color: var(--color-w100)
}

.section-component.mission-talisman .component-scratch-coupon .lottery-wrap canvas {
    -ms-interpolation-mode: nearest-neighbor;
    image-rendering: -webkit-optimize-contrast;
    image-rendering: -moz-crisp-edges;
    image-rendering: -o-pixelated;
    image-rendering: pixelated
}

.popup-wrap.popup-mission-talisman .popup-group.mission-talisman .component-btn {
    opacity: 0
}

.popup-group.mission-talisman.end .component-btn,
.popup-group.mission-talisman.end .component-scratch-coupon .btn-under-link {
    -webkit-animation: talisman-display 0.5s var(--kds-easing-float) forwards;
    animation: talisman-display 0.5s var(--kds-easing-float) forwards
}

@-webkit-keyframes talisman-display {
    0% {
        opacity: 0
    }
    100% {
        opacity: 1
    }
}

@keyframes talisman-display {
    0% {
        opacity: 0
    }
    100% {
        opacity: 1
    }
}

@-webkit-keyframes talisman-scale-ani {
    0% {
        -webkit-transform: scale(0.667);
        transform: scale(0.667);
        opacity: 0
    }
    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 1
    }
}

@keyframes talisman-scale-ani {
    0% {
        -webkit-transform: scale(0.667);
        transform: scale(0.667);
        opacity: 0
    }
    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 1
    }
}

.section-component.mission-talisman .component-scratch-coupon .lottery-wrap [class^="mission-front-"] {
    width: 100%;
    height: 100%;
    border-radius: 2rem;
    -webkit-filter: drop-shadow(0 0.36rem 4.32rem rgba(0, 0, 0, 0.32));
    filter: drop-shadow(0 0.36rem 4.32rem rgba(0, 0, 0, 0.32));
    -webkit-box-shadow: none;
    box-shadow: none
}

.list-talisman-group .list-row {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    -webkit-column-gap: 1rem;
    -moz-column-gap: 1rem;
    column-gap: 1rem;
    row-gap: 1.6rem;
    max-width: 50rem;
    margin: 0 auto
}

.list-talisman-group .list-item .section-link {
    display: block;
    position: relative;
    padding-top: 135.58%
}

.list-talisman-group .list-item .section-link [class^="mission-back-"] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.section-component.list-talisman .component-text-simple {
    opacity: 0;
    -webkit-animation: talisman-fade-up1 0.5s var(--kds-easing-float) forwards;
    animation: talisman-fade-up1 0.5s var(--kds-easing-float) forwards;
    -webkit-animation-delay: 1.5s;
    animation-delay: 1.5s
}

.section-component.list-talisman .component-list {
    opacity: 0;
    -webkit-animation: talisman-fade-up2 0.5s var(--kds-easing-float) forwards;
    animation: talisman-fade-up2 0.5s var(--kds-easing-float) forwards;
    -webkit-animation-delay: 1.5s;
    animation-delay: 1.5s
}

@-webkit-keyframes talisman-fade-up1 {
    0% {
        opacity: 0;
        -webkit-transform: translateY(200%);
        transform: translateY(200%)
    }
    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

@keyframes talisman-fade-up1 {
    0% {
        opacity: 0;
        -webkit-transform: translateY(200%);
        transform: translateY(200%)
    }
    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

@-webkit-keyframes talisman-fade-up2 {
    0% {
        opacity: 0;
        -webkit-transform: translateY(50%);
        transform: translateY(50%)
    }
    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

@keyframes talisman-fade-up2 {
    0% {
        opacity: 0;
        -webkit-transform: translateY(50%);
        transform: translateY(50%)
    }
    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

[class^="mission-back-"],
[class^="mission-front-"] {
    display: block;
    width: 13.6rem;
    height: 18.5rem;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: cover;
    border-radius: 1.6rem;
    -webkit-box-shadow: 0 0.2rem 0.6rem rgba(42, 55, 119, 0.2);
    box-shadow: 0 0.2rem 0.6rem rgba(42, 55, 119, 0.2)
}

.list-talisman-group [class^="mission-back-"] {
    border-radius: 1.2rem
}

.list-talisman-group [class^="mission-back-"].on {
    -webkit-box-shadow: 0 0.2rem 0.8rem rgba(42, 55, 119, 0.2);
    box-shadow: 0 0.2rem 0.8rem rgba(42, 55, 119, 0.2)
}

.list-talisman-group [class^="mission-back-"] {
    -webkit-box-shadow: none;
    box-shadow: none
}

.mission-back-card1 {
    background-image: url("/resource/img/mmk/common/moneymission/activate_back1.png")
}

.list-talisman-group .mission-back-card1.on,
.mission-back-card1.on,
.mission-front-card1 {
    background-image: url("/resource/img/mmk/common/moneymission/activate_front1.png")
}

.first-lock-entry .mission-back-card1 {
    background-image: url("/resource/img/mmk/common/moneymission/disable_lock1.png")
}

.list-talisman-group .mission-back-card1 {
    background-image: url("/resource/img/mmk/common/moneymission/disable_back1.png")
}

.mission-back-card2 {
    background-image: url("/resource/img/mmk/common/moneymission/activate_back2.png")
}

.list-talisman-group .mission-back-card2.on,
.mission-back-card2.on,
.mission-front-card2 {
    background-image: url("/resource/img/mmk/common/moneymission/activate_front2.png")
}

.first-lock-entry .mission-back-card2 {
    background-image: url("/resource/img/mmk/common/moneymission/disable_lock2.png")
}

.list-talisman-group .mission-back-card2 {
    background-image: url("/resource/img/mmk/common/moneymission/disable_back2.png")
}

.mission-back-card3 {
    background-image: url("/resource/img/mmk/common/moneymission/activate_back3.png")
}

.list-talisman-group .mission-back-card3.on,
.mission-back-card3.on,
.mission-front-card3 {
    background-image: url("/resource/img/mmk/common/moneymission/activate_front3.png")
}

.first-lock-entry .mission-back-card3 {
    background-image: url("/resource/img/mmk/common/moneymission/disable_lock3.png")
}

.list-talisman-group .mission-back-card3 {
    background-image: url("/resource/img/mmk/common/moneymission/disable_back3.png")
}

.mission-back-card4 {
    background-image: url("/resource/img/mmk/common/moneymission/activate_back4.png")
}

.list-talisman-group .mission-back-card4.on,
.mission-back-card4.on,
.mission-front-card4 {
    background-image: url("/resource/img/mmk/common/moneymission/activate_front4.png")
}

.first-lock-entry .mission-back-card4 {
    background-image: url("/resource/img/mmk/common/moneymission/disable_lock4.png")
}

.list-talisman-group .mission-back-card4 {
    background-image: url("/resource/img/mmk/common/moneymission/disable_back4.png")
}

.mission-back-card5 {
    background-image: url("/resource/img/mmk/common/moneymission/activate_back5.png")
}

.list-talisman-group .mission-back-card5.on,
.mission-back-card5.on,
.mission-front-card5 {
    background-image: url("/resource/img/mmk/common/moneymission/activate_front5.png")
}

.first-lock-entry .mission-back-card5 {
    background-image: url("/resource/img/mmk/common/moneymission/disable_lock5.png")
}

.list-talisman-group .mission-back-card5 {
    background-image: url("/resource/img/mmk/common/moneymission/disable_back5.png")
}

.mission-back-card6 {
    background-image: url("/resource/img/mmk/common/moneymission/activate_back6.png")
}

.list-talisman-group .mission-back-card6.on,
.mission-back-card6.on,
.mission-front-card6 {
    background-image: url("/resource/img/mmk/common/moneymission/activate_front6.png")
}

.first-lock-entry .mission-back-card6 {
    background-image: url("/resource/img/mmk/common/moneymission/disable_lock6.png")
}

.list-talisman-group .mission-back-card6 {
    background-image: url("/resource/img/mmk/common/moneymission/disable_back6.png")
}

.mission-back-card7 {
    background-image: url("/resource/img/mmk/common/moneymission/activate_back7.png")
}

.list-talisman-group .mission-back-card7.on,
.mission-back-card7.on,
.mission-front-card7 {
    background-image: url("/resource/img/mmk/common/moneymission/activate_front7.png")
}

.first-lock-entry .mission-back-card7 {
    background-image: url("/resource/img/mmk/common/moneymission/disable_lock7.png")
}

.list-talisman-group .mission-back-card7 {
    background-image: url("/resource/img/mmk/common/moneymission/disable_back7.png")
}

.mission-back-card8 {
    background-image: url("/resource/img/mmk/common/moneymission/activate_back8.png")
}

.list-talisman-group .mission-back-card8.on,
.mission-back-card8.on,
.mission-front-card8 {
    background-image: url("/resource/img/mmk/common/moneymission/activate_front8.png")
}

.first-lock-entry .mission-back-card8 {
    background-image: url("/resource/img/mmk/common/moneymission/disable_lock8.png")
}

.list-talisman-group .mission-back-card8 {
    background-image: url("/resource/img/mmk/common/moneymission/disable_back8.png")
}

.mission-back-card9 {
    background-image: url("/resource/img/mmk/common/moneymission/activate_back9.png")
}

.list-talisman-group .mission-back-card9.on,
.mission-back-card9.on,
.mission-front-card9 {
    background-image: url("/resource/img/mmk/common/moneymission/activate_front9.png")
}

.first-lock-entry .mission-back-card9 {
    background-image: url("/resource/img/mmk/common/moneymission/disable_lock9.png")
}

.list-talisman-group .mission-back-card9 {
    background-image: url("/resource/img/mmk/common/moneymission/disable_back9.png")
}

.mission-back-card10 {
    background-image: url("/resource/img/mmk/common/moneymission/activate_back10.png")
}

.list-talisman-group .mission-back-card10.on,
.mission-back-card10.on,
.mission-front-card10 {
    background-image: url("/resource/img/mmk/common/moneymission/activate_front10.png")
}

.first-lock-entry .mission-back-card10 {
    background-image: url("/resource/img/mmk/common/moneymission/disable_lock10.png")
}

.list-talisman-group .mission-back-card10 {
    background-image: url("/resource/img/mmk/common/moneymission/disable_back10.png")
}

.mission-back-card11 {
    background-image: url("/resource/img/mmk/common/moneymission/activate_back11.png")
}

.list-talisman-group .mission-back-card11.on,
.mission-back-card11.on,
.mission-front-card11 {
    background-image: url("/resource/img/mmk/common/moneymission/activate_front11.png")
}

.first-lock-entry .mission-back-card11 {
    background-image: url("/resource/img/mmk/common/moneymission/disable_lock11.png")
}

.list-talisman-group .mission-back-card11 {
    background-image: url("/resource/img/mmk/common/moneymission/disable_back11.png")
}

.mission-back-card12 {
    background-image: url("/resource/img/mmk/common/moneymission/activate_back12.png")
}

.list-talisman-group .mission-back-card12.on,
.mission-back-card12.on,
.mission-front-card12 {
    background-image: url("/resource/img/mmk/common/moneymission/activate_front12.png")
}

.first-lock-entry .mission-back-card12 {
    background-image: url("/resource/img/mmk/common/moneymission/disable_lock12.png")
}

.list-talisman-group .mission-back-card12 {
    background-image: url("/resource/img/mmk/common/moneymission/disable_back12.png")
}

.popup-group.mission-talisman.talisman-zoom .section-component.mission-talisman .component-text-simple .reward-display-stars {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0)
}

.popup-group.mission-talisman.talisman-zoom .section-component.mission-talisman .component-text-simple .reward-display-stars .img {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1)
}

.popup-group.mission-talisman.talisman-zoom .section-component.mission-talisman .component-scratch-coupon .btn-under-link,
.popup-wrap.popup-mission-talisman .popup-group.mission-talisman.talisman-zoom .component-btn {
    opacity: 1
}

.popup-group.mission-talisman.talisman-zoom .section-component.mission-talisman .lottery-container.n1 {
    opacity: 1;
    -webkit-animation: none;
    animation: none
}

.component-nodata-blur {
    padding: 0
}

.component-nodata-blur .nodata-account-group {
    display: block;
    height: 26.4rem;
    padding-top: 4.8rem;
    background: url(/resource/img/mmk/common/moneymission/mission_list_blur.png) no-repeat 0 0;
    background-size: contain
}

.page-inner-scroll.money-mission.first-unlock-entry .component-prd-icon {
    -webkit-transition: opacity .3s;
    -o-transition: opacity .3s;
    transition: opacity .3s
}

.page-inner-scroll.money-mission.first-unlock-entry.scroll-down.first-unlock-end .component-prd-icon {
    opacity: 1 !important
}

.page-inner-scroll.money-mission.scroll-top .section-component.mission-list .component-prd-icon {
    opacity: 0 !important
}

.tooltip-check-group {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    position: relative;
    margin-top: 0.7rem;
    padding: 1.4rem 1.6rem;
    border-radius: 1.2rem;
    background-color: var(--bg-qua)
}

.tooltip-check-group::before {
    content: "";
    display: block;
    position: absolute;
    top: -0.65rem;
    left: 2.8rem;
    z-index: -1;
    width: 1.4rem;
    height: 1.05rem;
    background: url(/resource/img/mmk/common/ico_tooltip_arrow.png) no-repeat 50% 50%/cover
}

.tooltip-check-group .input-checkbox.circle {
    width: 2rem;
    height: 2rem
}

.tooltip-check-group .checkbox-txt-field {
    font-size: 1.5rem;
    font-weight: 400;
    line-height: 2rem;
    color: var(--txt-ter)
}

:root .tooltip-check-group .checkbox-shape-circle:before {
    border-width: 0.18rem;
    background-color: var(--color-w100)
}

:root .tooltip-check-group .checkbox-shape-circle:after {
    width: 1.2rem;
    height: 1.2rem
}

.pd-list-group .item-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin: 2.4rem 0
}

.pd-list-group .list-item+.list-item {
    border-top: 1px solid var(--border-quin);
    margin-top: 2.4rem
}

.pd-list-group .txt-group {
    margin-right: 1.6rem
}

.pd-list-group .txt-title {
    font-size: 1.6rem;
    font-weight: 700
}

.pd-list-group .txt-desc {
    margin-top: .2rem;
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--txt-qua)
}

.pd-list-group .icon-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 7rem;
    font-size: 0;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: start;
    overflow: hidden
}

.list-sub-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 1.6rem;
    background: #f2f6fc;
    border-radius: 1.2rem
}

.list-sub-box .item-box-img {
    margin-right: 1.2rem
}

.list-sub-box .txt-group {
    color: var(--txt-sec);
    font-size: 1.4rem;
    line-height: 2rem
}

.pd-list-group {
    overflow: hidden
}

.pd-list-group .carousel-group.logo-carousel {
    width: 6rem
}

.pd-list-group .carousel-group.logo-carousel .swiper-container {
    overflow: visible
}

.pd-list-group .carousel-group.logo-carousel .swiper-slide {
    opacity: 0;
    will-change: opacity
}

.pd-list-group .carousel-group.logo-carousel .swiper-slide-prev {
    opacity: 0;
    will-change: opacity
}

.pd-list-group .carousel-group.logo-carousel .swiper-slide-active {
    opacity: 1;
    -webkit-transition: opacity .5s;
    -o-transition: opacity .5s;
    transition: opacity .5s;
    will-change: opacity
}

.pd-list-group .carousel-group.logo-carousel .swiper-slide-next {
    opacity: 1;
    will-change: opacity
}

.pd-list-group .carousel-group.logo-carousel .swiper-slide-next+.swiper-slide {
    opacity: 1;
    will-change: opacity
}

.pd-list-group .carousel-group.logo-carousel .swiper-slide-next+.swiper-slide+.swiper-slide {
    opacity: 0;
    -webkit-transition: opacity .5s;
    -o-transition: opacity .5s;
    transition: opacity .5s;
    will-change: opacity
}

.pd-list-group .carousel-group.logo-carousel .logo-wrap i::after {
    display: none
}

.sub-quick-item-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.sub-quick-item-wrap .tooltip-focus-group .tooltip-area.small.align-bottom {
    top: calc(100% + 1.4rem);
    z-index: 79
}

.sub-quick-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    min-width: 7.4rem
}

.sub-quick-ico {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 4rem;
    height: 4rem;
    background: var(--bg-ter);
    border-radius: 1.2rem
}

.sub-quick-ico .ico-etc-new-large {
    position: absolute;
    top: -0.4rem;
    right: -0.4rem
}

.sub-quick-txt {
    margin-top: 0.8rem;
    font-size: 1.3rem;
    font-weight: 500;
    line-height: 1.6rem;
    color: var(--txt-ter)
}

.auto-charge-notice {
    margin: -1.6rem 0 1.6rem
}

.section-component.coin-catch1 {
    position: relative;
    height: 100vh;
    padding-top: 8.6rem;
    background: -webkit-gradient(linear, left top, left bottom, from(var(--color-bu1100)), color-stop(80%, var(--color-bu800)));
    background: -o-linear-gradient(top, var(--color-bu1100) 0, var(--color-bu800) 80%);
    background: linear-gradient(180deg, var(--color-bu1100) 0, var(--color-bu800) 80%);
    overflow: hidden
}

.section-component.coin-catch1::before {
    content: "";
    position: absolute;
    top: -30%;
    left: -30%;
    z-index: 1;
    width: 160%;
    height: 160%;
    background: url(/resource/img/mmk/common/coingame_grid.png) repeat 50% 0;
    background-size: 85.01rem auto;
    opacity: 0.07;
    -webkit-transform: rotate(15.582deg);
    -ms-transform: rotate(15.582deg);
    transform: rotate(15.582deg)
}

.section-component.coin-catch1 .logo {
    position: absolute;
    top: 2rem;
    right: 0;
    z-index: 2
}

.section-component.coin-catch1 .title-field-28 {
    color: var(--txt-pri-invert)
}

.section-component.coin-catch1 .txt-guide {
    color: var(--txt-readonly-invert)
}

.section-component.coin-catch1 .component-img,
.section-component.coin-catch1 .component-text-simple {
    position: relative;
    z-index: 2
}

.section-component.coin-catch2 {
    margin-top: 0;
    background: var(--bg-qua)
}

.section-component.coin-catch2 .component-text-simple {
    padding: 7.2rem 0 3.2rem
}

.section-component.coin-catch2 .form-toggle-group.bg-ter {
    border: 0
}

.section-component.coin-catch2 .form-toggle-group.bg-ter .form-toggle-label {
    border: 0
}

.section-component.coin-catch2 .form-toggle-group.bg-ter .ico-circle-alarm::before {
    -webkit-filter: var(--filter-in700);
    filter: var(--filter-in700)
}

.component-header.bg-sec {
    background-color: var(--bg-sec)
}

.component-header.bg-blur-10 {
    background-color: transparent
}

.component-header.bg-blur-10:after {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px)
}

.component-header.bg-blur-10 .header-group {
    position: relative;
    z-index: 2
}

.component-header.bg-sec.bg-blur-10 {
    background: transparent !important;
    position: fixed !important
}

.component-header.bg-sec.bg-blur-10~div .section-component.pd-card-bg {
    padding-top: 5rem
}

.mobile .section-component.pd-card-bg {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(26%, var(--bg-sec)), to(var(--color-w100)));
    background: -o-linear-gradient(top, var(--bg-sec) 26%, var(--color-w100) 100%);
    background: linear-gradient(180deg, var(--bg-sec) 26%, var(--color-w100) 100%)
}

.pc .section-component.pd-card-bg {
    background: var(--color-w100)
}

.component-text-simple.pd-card {
    padding-top: 2rem;
    text-align: center
}

.component-text-simple.pd-card .title-group .txt-guide {
    margin-top: 0;
    font-size: 1.5rem;
    line-height: 2.4rem;
    color: var(--txt-accent-sec);
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis
}

.component-text-simple.pd-card .title-group .title-field-page {
    margin-top: 0;
    font-size: 2.8rem;
    line-height: 3.6rem
}

.component-pd-card-carousel {
    padding: 0 0 2rem 0;
    text-align: center;
    position: relative
}

.component-pd-card-carousel .card-bnr {
    padding: 3.2rem 0 1.6rem
}

.component-pd-card-carousel .plate-box {
    -webkit-perspective: 1000px;
    perspective: 1000px;
    padding: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.component-pd-card-carousel .card-plate {
    --card-round: 0.8rem;
    --card-light-opacity: 0.8;
    --card-motion-duration: 8s;
    position: relative;
    width: 15.2rem;
    -webkit-box-shadow: 0 0.4rem 1.2rem rgba(0, 0, 0, 0.12), inset -0.1rem -0.1rem 0.2rem rgba(0, 0, 0, 0.3), inset 0.1rem 0.1rem 0.2rem rgba(255, 255, 255, 0.3);
    box-shadow: 0 0.4rem 1.2rem rgba(0, 0, 0, 0.12), inset -0.1rem -0.1rem 0.2rem rgba(0, 0, 0, 0.3), inset 0.1rem 0.1rem 0.2rem rgba(255, 255, 255, 0.3);
    pointer-events: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.component-pd-card-carousel .card-plate img {
    width: 100%;
    display: block;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

.component-pd-card-carousel [class*="plate-texture"] {
    overflow: hidden;
    border-radius: var(--card-round)
}

.component-pd-card-carousel [class*="plate-texture"]::before {
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    z-index: 100;
    width: 200%;
    height: 200%;
    border-radius: inherit;
    opacity: var(--card-light-opacity);
    background-size: cover;
    -webkit-transform-origin: center;
    -ms-transform-origin: center;
    transform-origin: center
}

.component-pd-card-carousel .plate-texture-metal::before {
    background: -o-radial-gradient(left center, ellipse, rgba(0, 0, 0, 0.07) 0, transparent 100%), conic-gradient(from 60deg at 50% 50%, rgba(0, 0, 0, 0.07) -120deg, rgba(255, 255, 255, 0.2) 9deg, rgba(0, 0, 0, 0.15) 60deg, rgba(0, 0, 0, 0.11) 107deg, rgba(0, 0, 0, 0.14) 131deg, rgba(0, 0, 0, 0) 188deg, rgba(0, 0, 0, 0.18) 240deg, rgba(170, 142, 142, 0.17) 367deg);
    background: radial-gradient(ellipse at left center, rgba(0, 0, 0, 0.07) 0, transparent 100%), conic-gradient(from 60deg at 50% 50%, rgba(0, 0, 0, 0.07) -120deg, rgba(255, 255, 255, 0.2) 9deg, rgba(0, 0, 0, 0.15) 60deg, rgba(0, 0, 0, 0.11) 107deg, rgba(0, 0, 0, 0.14) 131deg, rgba(0, 0, 0, 0) 188deg, rgba(0, 0, 0, 0.18) 240deg, rgba(170, 142, 142, 0.17) 367deg);
    -webkit-animation: plate-texture-metal var(--card-motion-duration) linear infinite alternate;
    animation: plate-texture-metal var(--card-motion-duration) linear infinite alternate
}

.component-pd-card-carousel .plate-texture-light::before {
    background: -o-radial-gradient(50% 20%, circle, rgba(255, 255, 255, 0.4) 0, rgba(255, 255, 255, 0.2) 15%, rgba(0, 0, 0, 0.1) 30%, transparent 100%), -o-linear-gradient(315deg, rgba(255, 255, 255, 0.3) 0, rgba(0, 0, 0, 0.2) 100%);
    background: radial-gradient(circle at 50% 20%, rgba(255, 255, 255, 0.4) 0, rgba(255, 255, 255, 0.2) 15%, rgba(0, 0, 0, 0.1) 30%, transparent 100%), linear-gradient(135deg, rgba(255, 255, 255, 0.3) 0, rgba(0, 0, 0, 0.2) 100%);
    -webkit-animation: plate-texture-light var(--card-motion-duration) linear infinite alternate;
    animation: plate-texture-light var(--card-motion-duration) linear infinite alternate
}

.component-pd-card-carousel .plate-motion {
    -webkit-animation: plate-motion var(--card-motion-duration) infinite linear;
    animation: plate-motion var(--card-motion-duration) infinite linear;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d
}

@-webkit-keyframes plate-motion {
    0% {
        -webkit-transform: rotateX(0) rotateY(15deg);
        transform: rotateX(0) rotateY(15deg)
    }
    25% {
        -webkit-transform: rotateX(12deg) rotateY(0);
        transform: rotateX(12deg) rotateY(0)
    }
    35% {
        -webkit-transform: rotateX(10deg) rotateY(-6deg);
        transform: rotateX(10deg) rotateY(-6deg)
    }
    50% {
        -webkit-transform: rotateX(0) rotateY(-15deg);
        transform: rotateX(0) rotateY(-15deg)
    }
    55% {
        -webkit-transform: rotateX(-4deg) rotateY(-12deg);
        transform: rotateX(-4deg) rotateY(-12deg)
    }
    75% {
        -webkit-transform: rotateX(-12deg) rotateY(0);
        transform: rotateX(-12deg) rotateY(0)
    }
    100% {
        -webkit-transform: rotateX(0) rotateY(15deg);
        transform: rotateX(0) rotateY(15deg)
    }
}

@keyframes plate-motion {
    0% {
        -webkit-transform: rotateX(0) rotateY(15deg);
        transform: rotateX(0) rotateY(15deg)
    }
    25% {
        -webkit-transform: rotateX(12deg) rotateY(0);
        transform: rotateX(12deg) rotateY(0)
    }
    35% {
        -webkit-transform: rotateX(10deg) rotateY(-6deg);
        transform: rotateX(10deg) rotateY(-6deg)
    }
    50% {
        -webkit-transform: rotateX(0) rotateY(-15deg);
        transform: rotateX(0) rotateY(-15deg)
    }
    55% {
        -webkit-transform: rotateX(-4deg) rotateY(-12deg);
        transform: rotateX(-4deg) rotateY(-12deg)
    }
    75% {
        -webkit-transform: rotateX(-12deg) rotateY(0);
        transform: rotateX(-12deg) rotateY(0)
    }
    100% {
        -webkit-transform: rotateX(0) rotateY(15deg);
        transform: rotateX(0) rotateY(15deg)
    }
}

@-webkit-keyframes plate-texture-metal {
    0% {
        -webkit-transform: translate(-50%, -50%) rotate(60deg);
        transform: translate(-50%, -50%) rotate(60deg)
    }
    50% {
        -webkit-transform: translate(-50%, -50%) rotate(120deg);
        transform: translate(-50%, -50%) rotate(120deg)
    }
    100% {
        -webkit-transform: translate(-50%, -50%) rotate(60deg);
        transform: translate(-50%, -50%) rotate(60deg)
    }
}

@keyframes plate-texture-metal {
    0% {
        -webkit-transform: translate(-50%, -50%) rotate(60deg);
        transform: translate(-50%, -50%) rotate(60deg)
    }
    50% {
        -webkit-transform: translate(-50%, -50%) rotate(120deg);
        transform: translate(-50%, -50%) rotate(120deg)
    }
    100% {
        -webkit-transform: translate(-50%, -50%) rotate(60deg);
        transform: translate(-50%, -50%) rotate(60deg)
    }
}

@-webkit-keyframes plate-texture-light {
    0% {
        -webkit-transform: translate(-50%, -50%) scale(1.02) rotate(30deg);
        transform: translate(-50%, -50%) scale(1.02) rotate(30deg)
    }
    25% {
        -webkit-transform: translate(-50%, -50%) scale(1.04) rotate(60deg);
        transform: translate(-50%, -50%) scale(1.04) rotate(60deg)
    }
    50% {
        -webkit-transform: translate(-50%, -50%) scale(1.05) rotate(0);
        transform: translate(-50%, -50%) scale(1.05) rotate(0)
    }
    75% {
        -webkit-transform: translate(-50%, -50%) scale(1.04) rotate(-60deg);
        transform: translate(-50%, -50%) scale(1.04) rotate(-60deg)
    }
    100% {
        -webkit-transform: translate(-50%, -50%) scale(1.02) rotate(-30deg);
        transform: translate(-50%, -50%) scale(1.02) rotate(-30deg)
    }
}

@keyframes plate-texture-light {
    0% {
        -webkit-transform: translate(-50%, -50%) scale(1.02) rotate(30deg);
        transform: translate(-50%, -50%) scale(1.02) rotate(30deg)
    }
    25% {
        -webkit-transform: translate(-50%, -50%) scale(1.04) rotate(60deg);
        transform: translate(-50%, -50%) scale(1.04) rotate(60deg)
    }
    50% {
        -webkit-transform: translate(-50%, -50%) scale(1.05) rotate(0);
        transform: translate(-50%, -50%) scale(1.05) rotate(0)
    }
    75% {
        -webkit-transform: translate(-50%, -50%) scale(1.04) rotate(-60deg);
        transform: translate(-50%, -50%) scale(1.04) rotate(-60deg)
    }
    100% {
        -webkit-transform: translate(-50%, -50%) scale(1.02) rotate(-30deg);
        transform: translate(-50%, -50%) scale(1.02) rotate(-30deg)
    }
}

.component-pd-card-benefit {
    margin-top: 0.8rem
}

.component-pd-card-benefit .list-linebox-group .box-state .txt-state {
    font-size: 1.4rem
}

.component-pd-card-benefit .ico-area {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 4rem;
    flex: 0 0 4rem
}

.component-pd-card-benefit .ico-area img {
    width: 100%
}

.component-pd-card-info {
    margin-top: 2.8rem
}

.component-pd-card-info .list-infobox-group .item-box {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.component-pd-card-info .list-infobox-group .area-term {
    width: 11rem;
    font-size: 1.6rem;
    line-height: 2.8rem
}

.component-pd-card-info .list-infobox-group .area-desc {
    font-size: 1.6rem;
    line-height: 2.8rem;
    text-align: left
}

.component-kds-arrow-scroll {
    text-align: center;
    height: 6rem;
    padding: 3.2rem 2rem 0
}

.component-kds-arrow-scroll .ico-arrow_down.kds-interaction-scroll_down {
    -webkit-animation: kds-interactionScrollDown 1.8s var(--kds-easing-steady) 0.1s infinite;
    animation: kds-interactionScrollDown 1.8s var(--kds-easing-steady) 0.1s infinite
}

@-webkit-keyframes kds-interactionScrollDown {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1
    }
    50% {
        -webkit-transform: translateY(-1.2rem);
        transform: translateY(-1.2rem);
        opacity: 0
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1
    }
}

@keyframes kds-interactionScrollDown {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1
    }
    50% {
        -webkit-transform: translateY(-1.2rem);
        transform: translateY(-1.2rem);
        opacity: 0
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1
    }
}

.component-kds-arrow-scroll .ico-arrow_down.kds-interaction-scroll_up {
    -webkit-animation: kds-interactionScrollUp 0.8s var(--kds-easing-steady) 0.1s infinite;
    animation: kds-interactionScrollUp 0.8s var(--kds-easing-steady) 0.1s infinite
}

@-webkit-keyframes kds-interactionScrollUp {
    0% {
        -webkit-transform: translateY(-1.2rem);
        transform: translateY(-1.2rem);
        opacity: 1
    }
    50% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 0
    }
    100% {
        -webkit-transform: translateY(-1.2rem);
        transform: translateY(-1.2rem);
        opacity: 1
    }
}

@keyframes kds-interactionScrollUp {
    0% {
        -webkit-transform: translateY(-1.2rem);
        transform: translateY(-1.2rem);
        opacity: 1
    }
    50% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 0
    }
    100% {
        -webkit-transform: translateY(-1.2rem);
        transform: translateY(-1.2rem);
        opacity: 1
    }
}

[data-role="animation-item"] [data-ani-type="fade-up"].active,
[data-role="animation-item"].active [data-ani-type="fade-up"] {
    -webkit-animation-name: kds-interactionFadeUp;
    animation-name: kds-interactionFadeUp;
    -webkit-animation-duration: .7s;
    animation-duration: .7s;
    -webkit-animation-timing-function: var(--kds-easing-float);
    animation-timing-function: var(--kds-easing-float)
}

@-webkit-keyframes kds-interactionFadeUp {
    0% {
        -webkit-transform: translateY(6.4rem);
        transform: translateY(6.4rem);
        opacity: 0
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1
    }
}

@keyframes kds-interactionFadeUp {
    0% {
        -webkit-transform: translateY(6.4rem);
        transform: translateY(6.4rem);
        opacity: 0
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1
    }
}

[data-role="animation-item"] [data-ani-type="fade-up"].active[data-ani-delay-list="true"]:nth-of-type(1),
[data-role="animation-item"].active [data-ani-type="fade-up"][data-ani-delay-list="true"]:nth-of-type(1) {
    -webkit-animation-delay: 0s;
    animation-delay: 0s
}

[data-role="animation-item"] [data-ani-type="fade-up"].active[data-ani-delay-list="true"]:nth-of-type(2),
[data-role="animation-item"].active [data-ani-type="fade-up"][data-ani-delay-list="true"]:nth-of-type(2) {
    -webkit-animation-delay: 0.05s;
    animation-delay: 0.05s
}

[data-role="animation-item"] [data-ani-type="fade-up"].active[data-ani-delay-list="true"]:nth-of-type(3),
[data-role="animation-item"].active [data-ani-type="fade-up"][data-ani-delay-list="true"]:nth-of-type(3) {
    -webkit-animation-delay: 0.1s;
    animation-delay: 0.1s
}

[data-role="animation-item"] [data-ani-type="fade-up"].active[data-ani-delay-list="true"]:nth-of-type(4),
[data-role="animation-item"].active [data-ani-type="fade-up"][data-ani-delay-list="true"]:nth-of-type(4) {
    -webkit-animation-delay: 0.15s;
    animation-delay: 0.15s
}

[data-role="animation-item"] [data-ani-type="fade-up"].active[data-ani-delay-list="true"]:nth-of-type(5),
[data-role="animation-item"].active [data-ani-type="fade-up"][data-ani-delay-list="true"]:nth-of-type(5) {
    -webkit-animation-delay: 0.2s;
    animation-delay: 0.2s
}

[data-role="animation-item"] [data-ani-type="fade-up"].active[data-ani-delay-list="true"]:nth-of-type(6),
[data-role="animation-item"].active [data-ani-type="fade-up"][data-ani-delay-list="true"]:nth-of-type(6) {
    -webkit-animation-delay: 0.25s;
    animation-delay: 0.25s
}

[data-role="animation-item"] [data-ani-type="fade-up"].active[data-ani-delay-list="true"]:nth-of-type(7),
[data-role="animation-item"].active [data-ani-type="fade-up"][data-ani-delay-list="true"]:nth-of-type(7) {
    -webkit-animation-delay: 0.3s;
    animation-delay: 0.3s
}

[data-role="animation-item"] [data-ani-type="fade-up"].active[data-ani-delay-list="true"]:nth-of-type(8),
[data-role="animation-item"].active [data-ani-type="fade-up"][data-ani-delay-list="true"]:nth-of-type(8) {
    -webkit-animation-delay: 0.35s;
    animation-delay: 0.35s
}

[data-role="animation-item"] [data-ani-type="fade-up"].active[data-ani-delay-list="true"]:nth-of-type(9),
[data-role="animation-item"].active [data-ani-type="fade-up"][data-ani-delay-list="true"]:nth-of-type(9) {
    -webkit-animation-delay: 0.4s;
    animation-delay: 0.4s
}

[data-role="animation-item"] [data-ani-type="fade-up"].active[data-ani-delay-list="true"]:nth-of-type(10),
[data-role="animation-item"].active [data-ani-type="fade-up"][data-ani-delay-list="true"]:nth-of-type(10) {
    -webkit-animation-delay: 0.45s;
    animation-delay: 0.45s
}

[class*=kds] .bg-ter,
[class*=kds].bg-ter {
    background-color: var(--bg-ter)
}

[class*=kds] .bg-qua,
[class*=kds].bg-qua {
    background-color: var(--bg-qua)
}

[class*=kds] .bg-base,
[class*=kds].bg-base {
    background-color: var(--bg-base)
}

[class*=kds] .bg-sec-base,
[class*=kds].bg-sec-base {
    background-color: var(--bg-sec-base)
}

[class*=kds] .bg-sec-solid,
[class*=kds].bg-sec-solid {
    background-color: var(--bg-sec-solid)
}

[class*=kds] .bg-sec-neutral,
[class*=kds].bg-sec-neutral {
    background-color: var(--bg-sec-neutral)
}

[class*=kds] .bg-banner-bu,
[class*=kds].bg-banner-bu {
    background-color: var(--bg-banner-bu)
}

[class*=kds] .bg-banner-in,
[class*=kds].bg-banner-in {
    background-color: var(--bg-banner-in)
}

[class*=kds] .bg-banner-og,
[class*=kds].bg-banner-og {
    background-color: var(--bg-banner-og)
}

[class*=kds] .bg-banner-yl,
[class*=kds].bg-banner-yl {
    background-color: var(--bg-banner-yl)
}

[class*=kds] .bg-banner-ce,
[class*=kds].bg-banner-ce {
    background-color: var(--bg-banner-ce)
}

[class*=kds] .bg-banner-cy,
[class*=kds].bg-banner-cy {
    background-color: var(--bg-banner-cy)
}

[class*=kds] .text-wrap {
    white-space: normal
}

[class*=kds][data-role="animation-group"] {
    overflow: hidden
}

[class*=kds] .app-moweb-show {
    display: block
}

[class*=kds] .pc-show {
    display: none
}

.pc .fnclPdDetail [class*=kds] .app-moweb-show {
    display: none
}

.pc .fnclPdDetail [class*=kds] .pc-show {
    display: block
}

/*!
* [kds] landing
* 랜딩 / 상품상세
*/

[class*=component-kds][class*=title] {
    padding: 1.6rem 0 3.2rem
}

[class*=component-kds][class*=callout] {
    padding: 4.8rem 2rem 1.2rem
}

[class*=component-kds][class*=list-grid] {
    padding-top: 1.6rem;
    padding-bottom: 4.2rem
}

[class*=component-kds][class*=card-benefit],
[class*=component-kds][class*=landing-step] {
    padding-top: 1.6rem;
    padding-bottom: 0
}

[class*=component-kds][class*=divider] {
    height: 1.6rem;
    margin-top: 4.8rem;
    background-color: var(--bg-qua)
}

[class*=component-kds][class*=divider][class*=empty] {
    height: 0;
    background-color: transparent
}

[class*=component-kds][class*=section] {}

.component-kds-divider+[class*=component-kds][class*=section]:not([class*=bg]),
[class*=component-kds][class*=section]:not([class*=bg])+.component-kds-divider,
[class*=component-kds][class*=section]:not([class*=bg])+[class*=component-line],
[class*=component-line]+[class*=component-kds][class*=section]:not([class*=bg]) {
    margin-top: 1.2rem
}

[class*=component-kds][class*=section]:first-of-type::before,
[class*=component-kds][class*=section]:last-of-type::after {
    content: '';
    display: block;
    height: 1.2rem
}

div:not([class*=component-line])~div:not(.prd-detail-wrap)>[class*=component-kds][class*=section][class*=bg]:first-of-type {
    margin-top: 4.8rem
}

div:not([class*=component-line])~.prd-detail-wrap>[class*=component-kds][class*=section][class*=bg]:first-of-type {
    margin-top: -1.6rem
}

[class*=component-kds][class*=section] .kds-landing-section {
    padding-top: 5.6rem;
    padding-bottom: 4.8rem
}

[class*=component-kds][class*=info] {
    padding-top: 2.4rem;
    padding-bottom: 0
}

[class*=component-kds][class*=notice] {
    padding-top: 1.2rem;
    padding-bottom: 1.2rem
}

[class*=component-kds][class*=image] {
    padding: 0
}

[class*=component-kds][class*=share] {
    padding-bottom: 1.2rem
}

[class*=component-kds] [data-ani-type="up"] {
    display: block;
    -webkit-transform: translateY(30%);
    -ms-transform: translateY(30%);
    transform: translateY(30%);
    opacity: 0;
    white-space: nowrap
}

[class*=component-kds] [data-ani-type="up"] [class*=kds-] {
    white-space: normal
}

[class*=component-kds] [data-role="animation-item"].active [data-ani-type="up"] {
    -webkit-animation: ani-up .3s linear forwards;
    animation: ani-up .3s linear forwards
}

[class*=component-kds] [data-role="animation-item"].active [class^="prd-effect"] {
    color: var(--color-w100, #fff)
}

[class*=component-kds] [data-role="animation-item"] [class^="prd-effect"] {
    color: var(--color-w100, #fff)
}

[class*=component-kds] [data-role="animation-item"] [class^="prd-effect"] {
    color: var(--color-w65, #fffFFFA5);
    -webkit-transition: color .7s linear;
    -o-transition: color .7s linear;
    transition: color .7s linear
}

[class*=component-kds] [data-role="animation-item"].active [data-ani-speed="0.5"] {
    -webkit-animation-duration: 0.5s;
    animation-duration: 0.5s
}

.kds-landing-list-benefit-group {
    padding: 2.4rem 2rem;
    border-radius: 1.6rem;
    background-color: var(--bg-qua)
}

.kds-landing-list-benefit-group__title {
    font-size: 1.4rem;
    font-weight: 700;
    line-height: 2rem;
    color: var(--txt-ter)
}

.kds-landing-list-benefit__item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    padding: 1.6rem 0 0 4rem
}

.kds-landing-list-benefit__item+.kds-landing-list-benefit__item {
    margin-top: 1.2rem
}

.kds-landing-list-benefit__container {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    padding: 0.4rem 0;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.kds-landing-list-benefit__condition {
    margin-bottom: 0.4rem;
    font-size: 1.4rem;
    line-height: 1.6rem;
    font-weight: 400;
    color: var(--txt-qua)
}

.kds-landing-list-benefit__caption {
    margin-bottom: 0.4rem;
    font-size: 1.2rem;
    line-height: 1.6rem;
    font-weight: 500;
    color: var(--txt-ter)
}

.kds-landing-list-benefit__text {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.kds-landing-list-benefit__label {
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 700;
    color: var(--txt-sec)
}

.kds-landing-list-benefit__desc {
    margin-top: 0.2rem;
    font-size: 1.2rem;
    line-height: 1.6rem;
    font-weight: 400;
    color: var(--txt-qua);
    -webkit-box-flex: 100%;
    -ms-flex: 100%;
    flex: 100%;
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2
}

.kds-landing-list-benefit__image {
    position: absolute;
    left: -4rem;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

.kds-landing-list-benefit [class*=ico-arrow] {
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1;
    margin-left: 1.2rem
}

.kds-landing-card-tip {
    margin-top: 1.2rem
}

.kds-landing-card-tip__item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 2rem 1.6rem 2rem 2rem;
    background: var(--bg-qua);
    border-radius: 1.2rem
}

.kds-landing-card-tip__item+.kds-landing-card-tip__item {
    margin-top: 1.2rem
}

.kds-landing-card-tip__item>*~* {
    margin-left: 1.2rem
}

.kds-landing-card-tip__item.vertical {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding: 2.8rem 2rem;
    text-align: center
}

.kds-landing-card-tip__item.vertical .kds-landing-card-tip__image {
    padding: 1.2rem 0 0
}

.kds-landing-card-tip__text {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.kds-landing-card-tip__caption {
    margin-bottom: 0.4rem;
    font-size: 1.2rem;
    line-height: 1.6rem;
    font-weight: 400;
    color: var(--txt-ter)
}

.kds-landing-card-tip__label {
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 700;
    color: var(--txt-sec)
}

.kds-landing-card-tip__desc {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--txt-ter);
    margin-top: .2rem
}

.kds-landing-card-tip__condition {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--txt-qua);
    margin-bottom: .2rem
}

.kds-landing-card-tip__image [class^="ico-"] {
    width: 3.2rem;
    height: 3.2rem
}

.kds-landing-tag,
.kds-landing-utill {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-bottom: -0.6rem
}

.kds-landing-tag>*~*,
.kds-landing-utill>*~* {
    margin-left: 0.4rem
}

.kds-landing-tag .tag,
.kds-landing-utill .tag {
    height: auto;
    padding: 0.6rem 1.2rem;
    font-size: 1.2rem;
    line-height: 1.6rem;
    font-weight: 500;
    margin-bottom: 0.6rem
}

.kds-landing-tag [class=tag],
.kds-landing-utill [class=tag] {
    background: var(--bg-qua);
    border: 0.1rem solid var(--border-quin);
    color: var(--txt-ter)
}

.kds-landing-tag {
    padding-top: 0.4rem
}

.kds-landing-tag+.kds-landing-title__title {
    margin-top: 0.8rem
}

.kds-landing-logo__group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.kds-landing-logo.left {
    margin-right: auto
}

.kds-landing-logo.right {
    margin-left: auto
}

.kds-landing-title {
    padding-left: 2rem;
    padding-right: 2rem;
    text-align: center
}

.kds-landing-title.top {}

.kds-landing-title.top .kds-landing-title__label {
    padding-top: 0.8rem
}

.kds-landing-title.top .kds-landing-title__group:first-child .kds-landing-title__title {
    padding-top: 1.2rem
}

.kds-landing-title__group~[class*=__group] {
    margin-top: 1.2rem
}

.kds-landing-title__label {
    display: block;
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 700;
    color: var(--txt-ter)
}

.kds-landing-title__list-label {
    display: block;
    font-size: 1.2rem;
    line-height: 1.6rem;
    font-weight: 500;
    color: var(--txt-ter)
}

.kds-landing-title__title {
    display: block;
    font-size: 2.8rem;
    line-height: 3.6rem;
    font-weight: 700;
    color: var(--txt-pri)
}

.middle .kds-landing-title__title {
    font-size: 2.6rem;
    line-height: 3.4rem;
    font-weight: 700
}

.kds-landing-title__name {
    display: block;
    font-size: 2.8rem;
    line-height: 3.6rem;
    font-weight: 700;
    color: var(--txt-accent-sec)
}

.kds-landing-title__subtitle {
    display: block;
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--txt-ter)
}

.middle .kds-landing-title__subtitle {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400
}

.kds-landing-title__content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-top: 0.8rem;
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: 700;
    color: var(--txt-sec)
}

.kds-landing-title__content .tag {
    margin-left: 0.4rem
}

.kds-landing-title__desc {
    display: block;
    font-size: 1.1rem;
    line-height: 1.5rem;
    font-weight: 400;
    color: var(--txt-qua)
}

.kds-landing-title .kds-landing-tag {
    padding-top: 0
}

.kds-landing-title .kds-landing-tag .tag {
    height: 2rem;
    padding: 0.1rem 0.8rem 0;
    font-size: 1.1rem;
    font-weight: 400
}

.kds-landing-notice {
    position: relative;
    padding-left: 2.4rem
}

.kds-landing-notice [class^=ico] {
    position: absolute;
    left: 0;
    top: 0.2rem;
    width: 1.6rem;
    height: 1.6rem;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.kds-landing-notice__desc {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 500;
    color: var(--txt-sec)
}

.kds-landing-notice__subdesc {
    margin-top: 0.4rem;
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--txt-qua)
}

.kds-landing-image {
    padding: 2rem 0
}

.kds-landing-image>div:only-of-type>img:only-of-type,
.kds-landing-image>img:only-of-type {
    display: block;
    margin: 0 auto
}

.kds-landing-image.small img {
    height: 12.8rem
}

.kds-landing-image.medium img {
    height: 17.6rem
}

.kds-landing-image.large img {
    height: 28.8rem
}

.kds-landing-step {
    counter-reset: num
}

.kds-landing-step.card {
    padding: 2.4rem 2rem 2.4rem;
    background: var(--bg-qua);
    border-radius: 1.6rem
}

.kds-landing-step__number {
    position: absolute;
    left: 0;
    top: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 3.2rem;
    height: 3.2rem;
    background: var(--bg-ter);
    color: var(--txt-ter);
    border-radius: 100%;
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 700
}

.kds-landing-step__item {
    position: relative;
    min-height: 3.2rem;
    padding: 0.35rem 0 0 4.4rem;
    counter-increment: num;
    text-align: left
}

.kds-landing-step__item>*:not(.kds-landing-step__number)~* {
    margin-top: 0.4rem
}

.kds-landing-step__item::after {
    content: '';
    position: absolute;
    left: 1.5rem;
    top: calc(3.2rem + 0.4rem);
    width: 0.2rem;
    height: calc(100% - 3.2rem + 2rem - 0.8rem);
    background: var(--border-quin)
}

.kds-landing-step__item:last-of-type::after {
    content: normal
}

.kds-landing-step__item>[class*=btn] {
    margin-top: 0.8rem
}

.kds-landing-step__item~.kds-landing-step__item {
    margin-top: 2rem
}

.kds-landing-step__caption {
    margin: 0.4rem 0.4rem 1.6rem;
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 700;
    color: var(--txt-ter);
    text-align: left
}

.kds-landing-step__title {
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: 700;
    color: var(--txt-pri)
}

.kds-landing-step__title:first-of-type::before {
    content: counter(num);
    position: absolute;
    left: 0;
    top: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 3.2rem;
    height: 3.2rem;
    background: var(--bg-ter);
    color: var(--txt-ter);
    border-radius: 100%;
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 700
}

.kds-landing-step__subtitle {
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--txt-qua)
}

.kds-landing-step__btn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-top: 2rem
}

.kds-landing-step__btn>* {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.kds-landing-btn {
    padding-top: 2.4rem
}

.kds-landing-btn a[class^="btn-"] {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex
}

.kds-landing-callout {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    text-align: center
}

.kds-landing-callout.flexible-division .col-cont {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto
}

.kds-landing-callout .col-cont {
    position: relative;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.kds-landing-callout .col-cont:nth-of-type(odd) {
    padding-right: 1.2rem
}

.kds-landing-callout .col-cont:nth-of-type(even) {
    padding-left: 1.2rem
}

.kds-landing-callout .col-cont:nth-of-type(even)::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 0.1rem;
    height: 100%;
    background-color: var(--border-quin)
}

.kds-landing-callout .col-cont:only-of-type {
    padding-right: 0
}

.kds-landing-callout .txt-01 {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--txt-ter)
}

.kds-landing-callout .txt-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-top: 0.2rem;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-size: 2.1rem;
    line-height: 3.2rem;
    font-weight: 700;
    color: var(--txt-sec)
}

.kds-landing-callout .txt-group>* {
    font-weight: inherit
}

.kds-landing-callout .txt-group>.price~.price {
    margin-left: 1rem
}

.kds-landing-callout .txt-03 {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400;
    line-height: 2rem;
    color: var(--txt-sec)
}

.kds-landing-callout.hori .col-cont {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    white-space: nowrap
}

.kds-landing-callout.hori .col-cont .txt-group {
    margin-top: 0;
    margin-left: 1.2rem;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap
}

.kds-landing-callout.hori .col-cont .txt-03 {
    display: none
}

.kds-landing-callout.hori .txt-group>.price~.price {
    margin-left: 0.2rem
}

.kds-landing-list-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0 2.4rem
}

.kds-landing-list-grid__item {
    padding-top: 2.4rem
}

.kds-landing-list-grid__group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.kds-landing-list-grid__group:not(:first-of-type) {
    margin-top: 0.8rem
}

.kds-landing-list-grid__group>*~* {
    margin-left: 0.4rem
}

.kds-landing-list-grid__label {
    font-size: 1.2rem;
    line-height: 1.6rem;
    font-weight: 500;
    color: var(--txt-ter)
}

.kds-landing-list-grid__title {
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: 700;
    color: var(--txt-sec)
}

.kds-landing-list-grid__desc {
    margin-top: 0.4rem;
    font-size: 1.1rem;
    line-height: 1.5rem;
    font-weight: 400;
    color: var(--txt-qua)
}

.kds-landing-list-grid .txt-01 {
    font-size: 1.2rem;
    line-height: 1.6rem;
    font-weight: 500;
    color: var(--txt-ter)
}

.kds-landing-list-grid .txt-02 {
    color: var(--txt-sec)
}

.kds-landing-list-grid .txt-group {
    margin-top: 0.8rem;
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: 700;
    color: var(--txt-sec)
}

.kds-landing-list-grid .txt-group>* {
    font-weight: inherit
}

.kds-landing-list-grid .txt-group .price {
    color: var(--txt-accent-sec)
}

.kds-landing-list-grid .txt-03 {
    margin-top: 0.4rem;
    font-size: 1.1rem;
    line-height: 1.5rem;
    font-weight: 400
}

.kds-landing-card-accordion__item {
    margin-top: 1.2rem;
    background: var(--bg-qua);
    border-radius: 1.6rem;
    border: 1px solid var(--border-quin)
}

.kds-landing-card-accordion__label {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    padding: 2rem 4.4rem 2rem 2rem;
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 500;
    color: var(--txt-pri)
}

.kds-landing-card-accordion__label[aria-expanded=true] {
    font-weight: 700
}

.kds-landing-card-accordion__label::before {
    content: 'Q';
    position: static;
    color: var(--txt-accent-sec);
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: 700;
    line-height: 2.1rem;
    margin-right: 0.8rem
}

.kds-landing-card-accordion__cont {
    margin: 0 1.2rem;
    padding: 1.2rem 2rem 2.8rem;
    border-top: 1px solid var(--border-qua)
}

.kds-landing-card-accordion .bl-txt-group>.txt {
    color: var(--txt-pri)
}

.kds-landing-card-accordion .bl-txt-group+.bl-txt-group,
.kds-landing-card-accordion .bl-txt-group>.txt+.txt {
    margin-top: 0.8rem
}

.kds-landing-card-accordion [class*=ico-arrow] {
    position: absolute;
    top: 50%;
    right: 2rem;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
    width: 1.6rem;
    height: 1.6rem
}

.kds-landing-card-accordion .open .ico-arrow-open {
    -webkit-transform: translate(0, -50%) rotate(180deg);
    -ms-transform: translate(0, -50%) rotate(180deg);
    transform: translate(0, -50%) rotate(180deg)
}

.kds-landing-card-accordion .prd-bu-ty01 {
    position: relative;
    padding-left: 1rem
}

.kds-landing-card-accordion .prd-bu-ty01:before {
    content: '※';
    position: absolute;
    top: 0;
    left: 0;
    display: block
}

.kds-landing-card-benefit {
    background: var(--bg-qua);
    border-radius: 1.6rem
}

.kds-landing-card-benefit__title {
    padding: 2.4rem 2rem 0.8rem;
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 700;
    color: var(--txt-ter)
}

.kds-landing-card-benefit__list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 2rem 2rem 2.4rem;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 500;
    color: var(--txt-sec)
}

.kds-landing-card-benefit__list>*~* {
    margin-top: 0.8rem
}

.kds-landing-card-benefit__title+.kds-landing-card-benefit__list {
    padding-top: 0
}

.kds-landing-card-benefit__item,
.kds-landing-card-benefit__link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.kds-landing-card-benefit__item>*~*,
.kds-landing-card-benefit__link>*~* {
    margin-left: 0.8rem
}

.kds-landing-card-benefit__item .txt,
.kds-landing-card-benefit__link .txt {
    padding: 0.2rem 0.8rem 0.2rem 0
}

.kds-landing-card-benefit__item .ico-arrow-link,
.kds-landing-card-benefit__link .ico-arrow-link {
    margin-left: auto;
    margin-top: 0.6rem;
    -webkit-filter: var(--filter-ico-sec);
    filter: var(--filter-ico-sec)
}

.kds-landing-card-benefit__item {
    padding-top: 0.6rem
}

.kds-landing-card-benefit__link {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    min-width: 0
}

.kds-landing-card-benefit [class^=ico-] {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    -ms-flex-item-align: start;
    align-self: flex-start
}

.kds-landing-section .kds-landing-title {
    padding-bottom: 2.4rem
}

.kds-landing-section .kds-landing-title__label {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 500;
    color: var(--txt-qua)
}

.kds-landing-section .kds-landing-title__title {
    font-size: 2.6rem;
    line-height: 3.4rem;
    font-weight: 700
}

.kds-landing-section .kds-landing-title__title:first-child {
    margin-top: 0.8rem
}

.kds-landing-section .kds-landing-title__subtitle {
    font-size: 1.6rem;
    line-height: 2.1rem;
    font-weight: 400
}

.kds-landing-section .kds-landing-title__group .kds-landing-title__label:only-child {
    margin-bottom: -0.4rem
}

.kds-landing-section .kds-landing-image,
.kds-landing-section .kds-landing-title {
    margin-left: -2rem;
    margin-right: -2rem
}

.kds-landing-info {}

.kds-landing-info__item.caption {
    padding: 1.2rem 2rem;
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 700;
    color: var(--txt-sec)
}

.pc .fnclPdDetail .kds-landing-info__item.caption {
    padding-left: 0;
    padding-right: 0
}

.kds-landing-info__item.desc {
    padding: 2rem;
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--txt-qua)
}

.pc .fnclPdDetail .kds-landing-info__item.desc {
    padding-left: 0;
    padding-right: 0
}

.kds-landing-info.list-linebox-group .list-item {
    border-bottom: 0
}

.kds-landing-info_title {
    padding: 1.2rem 2rem;
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 700;
    color: var(--txt-sec)
}

.pc .fnclPdDetail .kds-landing-info_title {
    padding-left: 0;
    padding-right: 0
}

.kds-landing-info__desc {
    padding: 2rem;
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--txt-qua)
}

.kds-landing__icon {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 4.4rem;
    height: 4.4rem;
    background-color: var(--bg-ter);
    border-radius: 50%
}

.kds-landing__icon.kakao {
    background-color: #fae100
}

.kds-landing__icon.link,
.kds-landing__icon.share {
    background-color: var(--bg-ter-active)
}

.kds-landing__icon.link [class^=ico-],
.kds-landing__icon.share [class^=ico-] {
    -webkit-filter: var(--filter-w100);
    filter: var(--filter-w100)
}

.kds-landing-share {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 2rem 0
}

.kds-landing-share__item {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.kds-landing-share__item>*~* {
    margin-top: 0.8rem
}

.kds-landing-share__group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.kds-landing-share__title+.kds-landing-share__group {
    margin-left: auto
}

.kds-landing-share__title+.kds-landing-share__group>*~* {
    margin-left: 1.2rem
}

.kds-landing-share__title {
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: 700
}

.kds-landing-share__text {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400
}

.kds-landing-share.type1 {
    padding: 2.4rem 0
}

.kds-landing-share.type1 .kds-landing__icon {
    width: 3.6rem;
    height: 3.6rem
}

.kds-landing-share.type1 .kds-landing__icon .ico-dot-hori,
.kds-landing-share.type1 .kds-landing__icon .ico-link {
    background-size: 80%
}

.kds-landing-share.type2 {
    padding-top: 3.2rem;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-column-gap: 1.6rem;
    -moz-column-gap: 1.6rem;
    column-gap: 1.6rem
}

.kds-landing-share.type2 .kds-landing-share__item {
    -webkit-box-flex: 0;
    -ms-flex: 0;
    flex: 0
}

.kds-landing-share.type2 .kds-landing-share__item .link-icon {
    width: 4.4rem;
    height: 4.4rem
}

/*!
* [kds] banner
*/

.component-kds-banner {
    padding-top: 2rem
}

.kds-banner-card {
    border-radius: 1.2rem
}

.kds-banner-belt,
.kds-banner-card {
    position: relative;
    background: var(--bg-ter)
}

.kds-banner-belt__item,
.kds-banner-card__item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    width: 100%;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 1.6rem 2rem;
    text-align: left
}

.kds-banner-belt__item>*~*,
.kds-banner-card__item>*~* {
    margin-left: 1.2rem
}

.kds-banner-belt__text,
.kds-banner-card__text {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    min-width: 0
}

.kds-banner-belt__caption,
.kds-banner-card__caption {
    margin-bottom: 0.4rem;
    font-size: 1.2rem;
    line-height: 1.6rem;
    font-weight: 400;
    color: var(--txt-qua);
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis
}

.kds-banner-belt__caption.white,
.kds-banner-card__caption.white {
    color: var(--color-w100)
}

.kds-banner-belt__title,
.kds-banner-card__title {
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 700;
    color: var(--txt-sec)
}

.kds-banner-belt__title.white,
.kds-banner-card__title.white {
    color: var(--color-w100)
}

.kds-banner-belt__title:not(:first-child),
.kds-banner-card__title:not(:first-child) {
    margin-top: 0.2rem
}

.kds-banner-belt__desc,
.kds-banner-belt__subtitle,
.kds-banner-card__desc,
.kds-banner-card__subtitle {
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
    color: var(--txt-qua);
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis
}

.kds-banner-belt__desc.white,
.kds-banner-belt__subtitle.white,
.kds-banner-card__desc.white,
.kds-banner-card__subtitle.white {
    color: var(--color-w100)
}

.kds-banner-belt__desc:not(:first-child),
.kds-banner-belt__subtitle:not(:first-child),
.kds-banner-card__desc:not(:first-child),
.kds-banner-card__subtitle:not(:first-child) {
    margin-top: 0.2rem
}

.kds-banner-belt__image,
.kds-banner-card__image {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.kds-banner-belt__tag,
.kds-banner-card__tag {
    margin-top: 0.8rem
}

.kds-banner-belt.small .kds-banner-belt__image [class*=ico-],
.kds-banner-belt.small .kds-banner-belt__image img,
.kds-banner-belt.small .kds-banner-card__image [class*=ico-],
.kds-banner-belt.small .kds-banner-card__image img,
.kds-banner-card.small .kds-banner-belt__image [class*=ico-],
.kds-banner-card.small .kds-banner-belt__image img,
.kds-banner-card.small .kds-banner-card__image [class*=ico-],
.kds-banner-card.small .kds-banner-card__image img {
    width: 3.4rem;
    height: 3.4rem
}

.kds-banner-belt.small.no-icon .kds-banner-card__item,
.kds-banner-card.small.no-icon .kds-banner-card__item {
    padding: 2rem
}

.kds-banner-belt.medium .kds-banner-belt__image [class*=ico-],
.kds-banner-belt.medium .kds-banner-belt__image img,
.kds-banner-belt.medium .kds-banner-card__image [class*=ico-],
.kds-banner-belt.medium .kds-banner-card__image img,
.kds-banner-card.medium .kds-banner-belt__image [class*=ico-],
.kds-banner-card.medium .kds-banner-belt__image img,
.kds-banner-card.medium .kds-banner-card__image [class*=ico-],
.kds-banner-card.medium .kds-banner-card__image img {
    width: 4.4rem;
    height: 4.4rem
}

.kds-banner-belt.large,
.kds-banner-card.large {
    border-radius: 1.6rem
}

.kds-banner-belt.large .kds-banner-belt__title,
.kds-banner-belt.large .kds-banner-card__title,
.kds-banner-card.large .kds-banner-belt__title,
.kds-banner-card.large .kds-banner-card__title {
    width: calc(100% - 3rem)
}

.kds-banner-belt.large .kds-banner-belt__subtitle,
.kds-banner-belt.large .kds-banner-card__subtitle,
.kds-banner-card.large .kds-banner-belt__subtitle,
.kds-banner-card.large .kds-banner-card__subtitle {
    width: calc(100% - 2rem)
}

.kds-banner-belt.large .kds-banner-belt__item,
.kds-banner-belt.large .kds-banner-card__item,
.kds-banner-card.large .kds-banner-belt__item,
.kds-banner-card.large .kds-banner-card__item {
    padding-top: 2.4rem;
    padding-bottom: 2.4rem
}

.kds-banner-belt.large .kds-banner-belt__image,
.kds-banner-belt.large .kds-banner-card__image,
.kds-banner-card.large .kds-banner-belt__image,
.kds-banner-card.large .kds-banner-card__image {
    position: absolute;
    right: 2rem;
    bottom: 2.4rem
}

.kds-banner-belt.large .kds-banner-belt__image [class*=ico-],
.kds-banner-belt.large .kds-banner-belt__image img,
.kds-banner-belt.large .kds-banner-card__image [class*=ico-],
.kds-banner-belt.large .kds-banner-card__image img,
.kds-banner-card.large .kds-banner-belt__image [class*=ico-],
.kds-banner-card.large .kds-banner-belt__image img,
.kds-banner-card.large .kds-banner-card__image [class*=ico-],
.kds-banner-card.large .kds-banner-card__image img {
    width: 7.2rem;
    height: 7.2rem
}

.kds-banner-belt__btn,
.kds-banner-card__btn {
    margin-top: 4rem
}

.kds-banner-belt .btn-banner-close,
.kds-banner-card .btn-banner-close {
    position: absolute;
    right: 2rem;
    top: 2rem;
    width: 1.6rem;
    height: 1.6rem;
    background-image: var(--path-line-close);
    background-size: 1.6rem;
    background-repeat: no-repeat;
    background-position: center;
    -webkit-filter: var(--filter-ico-sec);
    filter: var(--filter-ico-sec)
}

.kds-banner-belt .ico-arrow-link,
.kds-banner-card .ico-arrow-link {
    -webkit-filter: var(--filter-ico-sec);
    filter: var(--filter-ico-sec)
}

.kds-banner-belt_grid,
.kds-banner-card_grid {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.kds-banner-belt_grid .kds-banner-card__item,
.kds-banner-card_grid .kds-banner-card__item {
    position: relative;
    padding: 1.6rem;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 calc(50% - (0.7rem / 2));
    flex: 0 0 calc(50% - (0.7rem / 2));
    background-color: var(--bg-ter);
    border-radius: 1.6rem;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    display: grid;
    -webkit-box-pack: normal;
    -ms-flex-pack: normal;
    justify-content: normal
}

.kds-banner-belt_grid .kds-banner-card__item:not(:last-child),
.kds-banner-card_grid .kds-banner-card__item:not(:last-child) {
    margin-right: 0.7rem
}

.kds-banner-belt_grid .kds-banner-card__item .kds-banner-card__image,
.kds-banner-card_grid .kds-banner-card__item .kds-banner-card__image {
    margin-left: auto;
    margin-top: auto
}

.kds-banner-belt__item {
    padding-top: 2rem;
    padding-bottom: 2rem
}

.kds-banner-belt__caption {
    margin-bottom: 0.2rem
}

.kds-banner-card-color {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.kds-banner-card-color .kds-banner-card__item {
    padding: 2rem
}

.kds-banner-card-color .kds-banner-card__text {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 100%
}

.kds-banner-card-color .kds-banner-card__title {
    font-size: 2.4rem;
    line-height: 3rem;
    color: var(--color-w100)
}

.kds-banner-card-color .kds-banner-card__desc {
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--color-w100);
    margin-top: 0.2rem
}

.kds-banner-card-color .kds-banner-card__btn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    padding-top: 1.8rem;
    margin-top: auto
}

/*!
* [kds] step
* number type
* CHPFMTASK-1774 KDS 3.602 신규 및 삭제
* CHPFMTASK-2154 
*/

.kds-step {
    counter-reset: num
}

.kds-step__item {
    position: relative;
    padding-left: 3.2rem;
    padding-bottom: 4.8rem;
    font-size: 1.6rem;
    line-height: 2rem;
    counter-increment: num
}

.kds-step__item:last-child {
    padding-bottom: 0
}

.kds-step__item>.kds-step__title:first-child:before,
.kds-step__item> :first-child .kds-step__title:before,
.kds-step__number {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: absolute;
    left: 0;
    top: 0;
    width: 2.4rem;
    height: 2.4rem;
    background: var(--bg-base);
    border: 2px solid var(--border-qua);
    border-radius: 50%;
    color: var(--txt-quin);
    font-size: 1.6rem;
    font-weight: 700;
    line-height: normal;
    z-index: 2;
    overflow: hidden
}

.kds-step__item>.kds-step__title:first-child:before,
.kds-step__item> :first-child .kds-step__title:before {
    content: counter(num)
}

.kds-step__empty {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: absolute;
    left: 0;
    top: 0;
    width: 2.4rem;
    height: 2rem;
    z-index: 2;
    overflow: hidden
}

.kds-step__empty::after {
    content: '';
    display: block;
    width: .8rem;
    height: .8rem;
    background: var(--bg-sec);
    border-radius: 50%
}

.kds-step__title {
    min-height: 2.4rem;
    padding-top: 0.2rem;
    font-size: 1.8rem;
    line-height: normal;
    font-weight: 700;
    color: var(--txt-quin)
}

.kds-step__title .tag {
    display: none
}

.kds-step__title+.kds-step__content {
    display: none
}

.kds-step__content {
    margin-top: 1.6rem
}

.kds-step__content>*+* {
    margin-top: 1.2rem
}

.kds-step__content .small-txt-group,
.kds-step__content .small-txt-group .bl-txt-group>.txt {
    font-size: 1.4rem
}

.kds-step__content .bl-txt-group .small-txt-group>.txt {
    color: var(--txt-qua)
}

.kds-step__item:after {
    content: "";
    display: block;
    position: absolute;
    left: 1.2rem;
    top: 0;
    width: 0.1rem;
    height: 100%;
    background: var(--border-quin)
}

.kds-step__item:last-child:after {
    content: none
}

.kds-step .section-link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.kds-step .section-link .col-state {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-item-align: start;
    align-self: flex-start;
    min-height: 2.4rem;
    margin-left: 0.8rem
}

.small .kds-step__item {
    padding-bottom: 3.6rem;
    font-size: 1.5rem
}

.small .kds-step__title {
    padding-top: 0.3rem;
    font-size: 1.6rem;
    line-height: 2rem
}

.small .kds-step__content {
    margin-top: 0.8rem
}

.small .kds-step__content>*+* {
    margin-top: 0.8rem
}

.small .kds-step__content .bl-txt-group {
    font-size: 1.5rem
}

.small .kds-step__content .small-txt-group,
.small .kds-step__content .small-txt-group .bl-txt-group>.txt {
    font-size: 1.2rem;
    line-height: 1.6rem
}

.completed .kds-step__number,
.completed>.kds-step__title:first-child:before,
.completed> :first-child .kds-step__title:before {
    background: var(--bg-sec);
    border-color: transparent;
    color: transparent
}

.completed .kds-step__number:after,
.completed>.kds-step__title:first-child:before,
.completed>.kds-step__title:first-child:before,
.completed> :first-child .kds-step__title:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: var(--bg-sec) url("/resource/img/mmk/common/ico_check_loan.png") center center no-repeat;
    background-size: 1.6rem 1.6rem
}

.completed>.kds-step__title:first-child:before,
.completed> :first-child .kds-step__title:before {
    width: 2.4rem;
    height: 2.4rem
}

.inprogress {}

.inprogress.num-empty::after {
    top: .8rem
}

.inprogress.num-empty .kds-step__empty::after {
    background: var(--bg-sec-active)
}

.inprogress.num-empty .kds-step__title {
    padding-top: 0
}

.inprogress .kds-step__number,
.inprogress>.kds-step__title:first-child:before,
.inprogress> :first-child .kds-step__title:before {
    background: var(--bg-sec-active);
    color: var(--txt-pri-invert);
    border-color: transparent
}

.inprogress .kds-step__title {
    color: var(--txt-sec-active)
}

.inprogress .kds-step__title+.kds-step__content {
    display: block
}

.inprogress .kds-step__title .tag {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin-top: -0.1rem
}

.accent .kds-step__number,
.accent>.kds-step__title:first-child:before,
.accent> :first-child .kds-step__title:before {
    background: var(--bg-accent-pri);
    color: var(--color-white-w100);
    border-color: transparent
}

.accent .kds-step__title {
    color: var(--txt-accent-sec)
}

.accent .kds-step__title+.kds-step__content {
    display: block
}

.accent .kds-step__title .tag {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin-top: -0.1rem
}

.kds-step__content .txt {
    color: var(--txt-sec)
}

.kds-step__content .bl-txt-group>.txt {
    padding-right: 1rem
}

.small .kds-step__content .bl-txt-group>.txt {
    font-size: 1.5rem
}

.kds-step__content .bl-txt-group .small-txt-group {
    margin-top: 0.4rem
}

.kds-step__content .bl-txt-group .small-txt-group .txt {
    margin-top: 0.4rem
}

.kds-step__content .bl-txt-group .small-txt-group .bl-txt-group {
    margin-top: 0
}

.kds-step__content .bl-txt-group .dash-txt-group {
    margin-top: .4rem
}

.kds-step__content .bl-txt-group .dash-txt-group>.txt {
    font-size: 1.4rem;
    line-height: 2rem;
    color: var(--color-g700)
}

.kds-step__content .bl-txt-group .dash-txt-group>.txt+.txt {
    margin-top: .4rem
}

.kds-step__content .card-group {
    display: none
}

.accent .kds-step__content .card-group,
.inprogress .kds-step__content .card-group {
    display: block
}

.kds-step__content .card-group .txt {
    font-size: inherit
}

.kds-step__content .card-group .btn-group .txt {
    color: inherit;
    font-weight: 500;
    font-size: 1.6rem
}

.kds-step [class*=ico-arrow] {
    -webkit-filter: var(--filter-ico-sec);
    filter: var(--filter-ico-sec)
}

.kds-step .defalutOpen [class*=ico-arrow] {
    display: none
}

.kds-step .defalutOpen .ui-accordion-btn {
    cursor: default
}

.kds-step .defalutOpen .ui-accordion-cont {
    display: block
}

.kds-step.type01 {
    margin-top: 2.4rem
}

.kds-step.type01 .kds-step__item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.kds-step.type01 .kds-step__title {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding-top: 0;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.kds-step.type01 .kds-step__title .kds-step__title__completed-txt {
    margin-left: auto;
    font-size: 1.4rem;
    font-weight: 500;
    line-height: 2rem;
    color: var(--txt-quin)
}

.kds-step.type01 .kds-step__title .kds-step__title__inprogress-txt {
    margin-left: auto;
    font-size: 1.4rem;
    font-weight: 500;
    line-height: 2rem;
    color: var(--txt-pri)
}

.kds-step.kds-step-large .kds-step__item .kds-step__number {
    width: 3.2rem;
    height: 3.2rem
}

.kds-step.kds-step-small .kds-step__item {
    padding-left: 1.6rem
}

.kds-step.kds-step-small .kds-step__item .kds-step__number {
    top: 0.8rem;
    width: 0.8rem;
    height: 0.8rem
}

.kds-step.kds-step-small .kds-step__item .kds-step__title {
    font-size: 1.6rem
}

.kds-step.kds-step-small .kds-step__item .kds-step__title .tag {
    margin-top: -0.4rem
}

.kds-step.kds-step-small .kds-step__item.default .kds-step__number {
    background: var(--bg-sec)
}

.kds-step.kds-step-small .kds-step__item.completed .kds-step__number::after {
    content: none
}

.kds-step.kds-step-small .kds-step__item.inprogress .kds-step__number {
    background: var(--bg-sec-active)
}

.kds-step.kds-step-small .kds-step__item.accent .kds-step__number {
    background: var(--bg-accent-pri)
}

/*!
* [kds] list / trn_item
*/

.kds-trn-group {
    margin-top: 2.4rem
}

.kds-trn-btn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
    padding: 1.6rem 0;
    border-bottom: 1px solid var(--border-qua)
}

.kds-trn-btn.selected {
    position: relative
}

.kds-trn-btn.selected::after {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    right: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 2.4rem;
    height: 2.4rem;
    background-image: var(--path-solid-colored-check-ico-pri-success);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    -webkit-filter: var(--filter-in900);
    filter: var(--filter-in900)
}

.kds-trn-btn[disabled] .kds-trn-options__balance,
.kds-trn-btn[disabled] .kds-trn-options__label {
    color: var(--txt-quin)
}

.kds-trn-btn [class^="ico-"] {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    margin-right: 1.2rem
}

.kds-trn-options {
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.kds-trn-options [class^="ico-"] {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    margin-right: 1.2rem
}

.kds-trn-options__label {
    text-align: left;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 1.6rem;
    font-weight: 500;
    line-height: 2rem;
    color: var(--txt-pri)
}

.kds-trn-btn[disabled] .kds-trn-options__label {
    max-width: calc(100% - 6rem)
}

.kds-trn-btn.selected .kds-trn-options__label {
    max-width: unset;
    margin-right: 2.4rem
}

.kds-trn-options .tag {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    margin-left: .4rem
}

.kds-trn-options__balance {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    width: 100%;
    text-align: left;
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 2rem;
    color: var(--txt-ter);
    margin-top: .4rem
}

/*!
* KDS컴포넌트 : list / linebox_item버전(ico) 기본사용(커스텀시 참고 사용)
*/

.kds-linebox-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 1.6rem 0;
    text-align: left;
    width: 100%;
    border-bottom: 1px solid var(--border-qua)
}

.kds-linebox-item__group__label {
    font-size: 1.6rem;
    font-weight: 500;
    line-height: 2rem;
    color: var(--txt-pri)
}

.kds-linebox-item__group__desc {
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 2rem;
    color: var(--txt-ter);
    margin-top: .4rem
}

:root .kds-ai-border>* {
    overflow: inherit !important;
    border: none !important;
    border-radius: calc(var(--kds-ai-border-radius) - var(--kds-ai-border-width))
}

.kds-ai-border {
    --kds-ai-border-radius: 2rem;
    --kds-ai-border-width: 0.15rem;
    overflow: hidden;
    position: relative;
    padding: var(--kds-ai-border-width);
    border-radius: var(--kds-ai-border-radius)
}

.kds-ai-border::after {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: -2;
    background: -o-radial-gradient(0 0, circle, #be93ff 0, transparent 50%), -o-radial-gradient(100% 0, circle, #8489ff 0, transparent 50%), -o-radial-gradient(100% 100%, circle, #b3e3ff 0, transparent 50%), -o-radial-gradient(0 100%, circle, #be93ff 0, transparent 50%), -o-radial-gradient(50% 50%, circle, #8489ff 0, transparent 50%);
    background: radial-gradient(circle at 0 0, #be93ff 0, transparent 50%), radial-gradient(circle at 100% 0, #8489ff 0, transparent 50%), radial-gradient(circle at 100% 100%, #b3e3ff 0, transparent 50%), radial-gradient(circle at 0 100%, #be93ff 0, transparent 50%), radial-gradient(circle at 50% 50%, #8489ff 0, transparent 50%);
    background-size: 200% 200%;
    background-position: 0 0;
    -webkit-animation: movemeshgradient 8s ease-in-out infinite;
    animation: movemeshgradient 8s ease-in-out infinite
}

@-webkit-keyframes movemeshgradient {
    0% {
        background-position: 0 0;
        background-image: radial-gradient(circle at 0 0, #be93ff 0, transparent 50%), radial-gradient(circle at 100% 0, #8489ff 0, transparent 50%), radial-gradient(circle at 100% 100%, #b3e3ff 0, transparent 50%), radial-gradient(circle at 0 100%, #be93ff 0, transparent 50%), radial-gradient(circle at 50% 50%, #8489ff 0, transparent 50%)
    }
    25% {
        background-position: 100% 0;
        background-image: radial-gradient(circle at 0 0, #c193ff 0, transparent 50%), radial-gradient(circle at 100% 0, #8489ff 0, transparent 50%), radial-gradient(circle at 100% 100%, #b5e5ff 0, transparent 50%), radial-gradient(circle at 0 100%, #c193ff 0, transparent 50%), radial-gradient(circle at 50% 50%, #868bff 0, transparent 50%)
    }
    50% {
        background-position: 100% 100%;
        background-image: radial-gradient(circle at 0 0, #c493ff 0, transparent 50%), radial-gradient(circle at 100% 0, #868bff 0, transparent 50%), radial-gradient(circle at 100% 100%, #b5e5ff 0, transparent 50%), radial-gradient(circle at 0 100%, #c493ff 0, transparent 50%), radial-gradient(circle at 50% 50%, #868bff 0, transparent 50%)
    }
    75% {
        background-position: 0 100%;
        background-image: radial-gradient(circle at 0 0, #c193ff 0, transparent 50%), radial-gradient(circle at 100% 0, #8489ff 0, transparent 50%), radial-gradient(circle at 100% 100%, #b5e5ff 0, transparent 50%), radial-gradient(circle at 0 100%, #c193ff 0, transparent 50%), radial-gradient(circle at 50% 50%, #868bff 0, transparent 50%)
    }
    100% {
        background-position: 0 0;
        background-image: radial-gradient(circle at 0 0, #be93ff 0, transparent 50%), radial-gradient(circle at 100% 0, #8489ff 0, transparent 50%), radial-gradient(circle at 100% 100%, #b3e3ff 0, transparent 50%), radial-gradient(circle at 0 100%, #be93ff 0, transparent 50%), radial-gradient(circle at 50% 50%, #8489ff 0, transparent 50%)
    }
}

@keyframes movemeshgradient {
    0% {
        background-position: 0 0;
        background-image: -o-radial-gradient(0 0, circle, #be93ff 0, transparent 50%), -o-radial-gradient(100% 0, circle, #8489ff 0, transparent 50%), -o-radial-gradient(100% 100%, circle, #b3e3ff 0, transparent 50%), -o-radial-gradient(0 100%, circle, #be93ff 0, transparent 50%), -o-radial-gradient(50% 50%, circle, #8489ff 0, transparent 50%);
        background-image: radial-gradient(circle at 0 0, #be93ff 0, transparent 50%), radial-gradient(circle at 100% 0, #8489ff 0, transparent 50%), radial-gradient(circle at 100% 100%, #b3e3ff 0, transparent 50%), radial-gradient(circle at 0 100%, #be93ff 0, transparent 50%), radial-gradient(circle at 50% 50%, #8489ff 0, transparent 50%)
    }
    25% {
        background-position: 100% 0;
        background-image: -o-radial-gradient(0 0, circle, #c193ff 0, transparent 50%), -o-radial-gradient(100% 0, circle, #8489ff 0, transparent 50%), -o-radial-gradient(100% 100%, circle, #b5e5ff 0, transparent 50%), -o-radial-gradient(0 100%, circle, #c193ff 0, transparent 50%), -o-radial-gradient(50% 50%, circle, #868bff 0, transparent 50%);
        background-image: radial-gradient(circle at 0 0, #c193ff 0, transparent 50%), radial-gradient(circle at 100% 0, #8489ff 0, transparent 50%), radial-gradient(circle at 100% 100%, #b5e5ff 0, transparent 50%), radial-gradient(circle at 0 100%, #c193ff 0, transparent 50%), radial-gradient(circle at 50% 50%, #868bff 0, transparent 50%)
    }
    50% {
        background-position: 100% 100%;
        background-image: -o-radial-gradient(0 0, circle, #c493ff 0, transparent 50%), -o-radial-gradient(100% 0, circle, #868bff 0, transparent 50%), -o-radial-gradient(100% 100%, circle, #b5e5ff 0, transparent 50%), -o-radial-gradient(0 100%, circle, #c493ff 0, transparent 50%), -o-radial-gradient(50% 50%, circle, #868bff 0, transparent 50%);
        background-image: radial-gradient(circle at 0 0, #c493ff 0, transparent 50%), radial-gradient(circle at 100% 0, #868bff 0, transparent 50%), radial-gradient(circle at 100% 100%, #b5e5ff 0, transparent 50%), radial-gradient(circle at 0 100%, #c493ff 0, transparent 50%), radial-gradient(circle at 50% 50%, #868bff 0, transparent 50%)
    }
    75% {
        background-position: 0 100%;
        background-image: -o-radial-gradient(0 0, circle, #c193ff 0, transparent 50%), -o-radial-gradient(100% 0, circle, #8489ff 0, transparent 50%), -o-radial-gradient(100% 100%, circle, #b5e5ff 0, transparent 50%), -o-radial-gradient(0 100%, circle, #c193ff 0, transparent 50%), -o-radial-gradient(50% 50%, circle, #868bff 0, transparent 50%);
        background-image: radial-gradient(circle at 0 0, #c193ff 0, transparent 50%), radial-gradient(circle at 100% 0, #8489ff 0, transparent 50%), radial-gradient(circle at 100% 100%, #b5e5ff 0, transparent 50%), radial-gradient(circle at 0 100%, #c193ff 0, transparent 50%), radial-gradient(circle at 50% 50%, #868bff 0, transparent 50%)
    }
    100% {
        background-position: 0 0;
        background-image: -o-radial-gradient(0 0, circle, #be93ff 0, transparent 50%), -o-radial-gradient(100% 0, circle, #8489ff 0, transparent 50%), -o-radial-gradient(100% 100%, circle, #b3e3ff 0, transparent 50%), -o-radial-gradient(0 100%, circle, #be93ff 0, transparent 50%), -o-radial-gradient(50% 50%, circle, #8489ff 0, transparent 50%);
        background-image: radial-gradient(circle at 0 0, #be93ff 0, transparent 50%), radial-gradient(circle at 100% 0, #8489ff 0, transparent 50%), radial-gradient(circle at 100% 100%, #b3e3ff 0, transparent 50%), radial-gradient(circle at 0 100%, #be93ff 0, transparent 50%), radial-gradient(circle at 50% 50%, #8489ff 0, transparent 50%)
    }
}

.kds-ai-border.shadow {
    -webkit-box-shadow: 0 0.4rem 2rem 0 var(--color-pb5);
    box-shadow: 0 0.4rem 2rem 0 var(--color-pb5)
}

.component-kds-arrow-scroll {
    text-align: center;
    height: 6rem;
    padding: 3.2rem 2rem 0
}

.component-kds-arrow-scroll .ico-arrow_down.kds-interaction-scroll_down {
    -webkit-animation: kds-interactionScrollDown 1.8s var(--kds-easing-steady) 0.1s infinite;
    animation: kds-interactionScrollDown 1.8s var(--kds-easing-steady) 0.1s infinite
}

@keyframes kds-interactionScrollDown {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1
    }
    50% {
        -webkit-transform: translateY(-1.2rem);
        transform: translateY(-1.2rem);
        opacity: 0
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1
    }
}

.component-kds-arrow-scroll .ico-arrow_down.kds-interaction-scroll_up {
    -webkit-animation: kds-interactionScrollUp 0.8s var(--kds-easing-steady) 0.1s infinite;
    animation: kds-interactionScrollUp 0.8s var(--kds-easing-steady) 0.1s infinite
}

@keyframes kds-interactionScrollUp {
    0% {
        -webkit-transform: translateY(-1.2rem);
        transform: translateY(-1.2rem);
        opacity: 1
    }
    50% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 0
    }
    100% {
        -webkit-transform: translateY(-1.2rem);
        transform: translateY(-1.2rem);
        opacity: 1
    }
}

[data-role="animation-item"] [data-ani-type="fade-up"].active,
[data-role="animation-item"].active [data-ani-type="fade-up"] {
    -webkit-animation-name: kds-interactionFadeUp;
    animation-name: kds-interactionFadeUp;
    -webkit-animation-duration: .7s;
    animation-duration: .7s;
    -webkit-animation-timing-function: var(--kds-easing-float);
    animation-timing-function: var(--kds-easing-float)
}

@keyframes kds-interactionFadeUp {
    0% {
        -webkit-transform: translateY(6.4rem);
        transform: translateY(6.4rem);
        opacity: 0
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1
    }
}

[data-role="animation-item"] [data-ani-type="fade-up"].active[data-ani-delay-list="true"]:nth-of-type(1),
[data-role="animation-item"].active [data-ani-type="fade-up"][data-ani-delay-list="true"]:nth-of-type(1) {
    -webkit-animation-delay: 0s;
    animation-delay: 0s
}

[data-role="animation-item"] [data-ani-type="fade-up"].active[data-ani-delay-list="true"]:nth-of-type(2),
[data-role="animation-item"].active [data-ani-type="fade-up"][data-ani-delay-list="true"]:nth-of-type(2) {
    -webkit-animation-delay: 0.05s;
    animation-delay: 0.05s
}

[data-role="animation-item"] [data-ani-type="fade-up"].active[data-ani-delay-list="true"]:nth-of-type(3),
[data-role="animation-item"].active [data-ani-type="fade-up"][data-ani-delay-list="true"]:nth-of-type(3) {
    -webkit-animation-delay: 0.1s;
    animation-delay: 0.1s
}

[data-role="animation-item"] [data-ani-type="fade-up"].active[data-ani-delay-list="true"]:nth-of-type(4),
[data-role="animation-item"].active [data-ani-type="fade-up"][data-ani-delay-list="true"]:nth-of-type(4) {
    -webkit-animation-delay: 0.15s;
    animation-delay: 0.15s
}

[data-role="animation-item"] [data-ani-type="fade-up"].active[data-ani-delay-list="true"]:nth-of-type(5),
[data-role="animation-item"].active [data-ani-type="fade-up"][data-ani-delay-list="true"]:nth-of-type(5) {
    -webkit-animation-delay: 0.2s;
    animation-delay: 0.2s
}

[data-role="animation-item"] [data-ani-type="fade-up"].active[data-ani-delay-list="true"]:nth-of-type(6),
[data-role="animation-item"].active [data-ani-type="fade-up"][data-ani-delay-list="true"]:nth-of-type(6) {
    -webkit-animation-delay: 0.25s;
    animation-delay: 0.25s
}

[data-role="animation-item"] [data-ani-type="fade-up"].active[data-ani-delay-list="true"]:nth-of-type(7),
[data-role="animation-item"].active [data-ani-type="fade-up"][data-ani-delay-list="true"]:nth-of-type(7) {
    -webkit-animation-delay: 0.3s;
    animation-delay: 0.3s
}

[data-role="animation-item"] [data-ani-type="fade-up"].active[data-ani-delay-list="true"]:nth-of-type(8),
[data-role="animation-item"].active [data-ani-type="fade-up"][data-ani-delay-list="true"]:nth-of-type(8) {
    -webkit-animation-delay: 0.35s;
    animation-delay: 0.35s
}

[data-role="animation-item"] [data-ani-type="fade-up"].active[data-ani-delay-list="true"]:nth-of-type(9),
[data-role="animation-item"].active [data-ani-type="fade-up"][data-ani-delay-list="true"]:nth-of-type(9) {
    -webkit-animation-delay: 0.4s;
    animation-delay: 0.4s
}

[data-role="animation-item"] [data-ani-type="fade-up"].active[data-ani-delay-list="true"]:nth-of-type(10),
[data-role="animation-item"].active [data-ani-type="fade-up"][data-ani-delay-list="true"]:nth-of-type(10) {
    -webkit-animation-delay: 0.45s;
    animation-delay: 0.45s
}