@import url('animate.css');

/* reset */
*{margin: 0; padding: 0;}
html,body{font-size:15px;font-family: 'Malgun Gothic';font-style: normal;letter-spacing: -0.05em;overflow:hidden;line-height: 1.7;color:#4f5458;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;height: 100%}
a, a:hover, a:focus{text-decoration: none;color:inherit;}
button{background:none;border:0;outline: none;color:inherit;}
img{display: block;max-width:100%;}
p{white-space:normal;}

.hide {display:block; position:absolute; height: 0; width: 0; font-size: 0; line-height: 0; margin: 0; padding: 0; overflow:hidden;}

.ico, .btn.ico{background: url(/imf/images/ico.png) no-repeat;display:block;font-size:0;}
*[class^="btn"]{cursor:pointer;}
::placeholder{color:#bebebe;}

/* for Animation */
@-webkit-keyframes mainmenuAnimation{
    25%{width:93%;height:0;}
    50%{width:93%;height:92%;}
    100%{width:93%;height:92%;}
}
@-moz-keyframes mainmenuAnimation{
    25%{width:93%;height:0;}
    50%{width:93%;height:92%;}
    100%{width:93%;height:92%;}
}
@-ms-keyframes mainmenuAnimation{
    25%{width:93%;height:0;}
    50%{width:93%;height:92%;}
    100%{width:93%;height:92%;}
}
@-o-keyframes mainmenuAnimation{
    25%{width:93%;height:0;}
    50%{width:93%;height:92%;}
    100%{width:93%;height:92%;}
}
@keyframes mainmenuAnimation{
    25%{width:93%;height:0;}
    50%{width:93%;height:92%;}
    100%{width:93%;height:92%;}
}

@-webkit-keyframes mainmenuAnimationMobile{
    25%{width:calc(100% - 10px);height:0;}
    50%{width:calc(100% - 10px);height:calc(100% - 10px);}
    100%{width:calc(100% - 10px);height:calc(100% - 10px);}
}
@-moz-keyframes mainmenuAnimationMobile{
    25%{width:calc(100% - 10px);height:0;}
    50%{width:calc(100% - 10px);height:calc(100% - 10px);}
    100%{width:calc(100% - 10px);height:calc(100% - 10px);}
}
@-ms-keyframes mainmenuAnimationMobile{
    25%{width:calc(100% - 10px);height:0;}
    50%{width:calc(100% - 10px);height:calc(100% - 10px);}
    100%{width:calc(100% - 10px);height:calc(100% - 10px);}
}
@-o-keyframes mainmenuAnimationMobile{
    25%{width:calc(100% - 10px);height:0;}
    50%{width:calc(100% - 10px);height:calc(100% - 10px);}
    100%{width:calc(100% - 10px);height:calc(100% - 10px);}
}
@keyframes mainmenuAnimationMobile{
    25%{width:calc(100% - 10px);height:0;}
    50%{width:calc(100% - 10px);height:calc(100% - 10px);}
    100%{width:calc(100% - 10px);height:calc(100% - 10px);}
}

/* layout */
.wrap{max-width:1080px;margin:0 auto;}
#header{background:#043b72;}
#header .wrap{position: relative;padding:0 0px;width:100%;display:table;}
#header .logo{float:left;padding:10px 0 12px; margin-right:40px; position: relative;}
#header .logo:after{content:'|'; color:#fff; position:absolute;right:-20px;top:50%;margin-top:-.8em;font-weight: lighter}
#header .faq{padding: 17px 0; float:right;position:relative;}
#header .faq:before{content:'|';color:#fff; position:absolute;left:-15px;top:50%;margin-top:-.9em;}
#header .mob-menu{display:none; color:#fff; height:45px;margin:0 0 0 -15px;padding: 12px 15px;}
#header .mob-menu > span{font-size:0;display: block;width:23px;height:23px;background:url(/imf/images/mobile-menu.png) no-repeat;background-size:100% auto;}
#header .area-gnb{float:left;width:calc(100% - 207px);}
#header nav ul{list-style: none;}
#header .gnb{color:#fff;padding:0;margin-bottom:0;display:table;float:left;position:relative;/*z-index: 99;*/}
#header .gnb > li{float:left;position:relative;}
/*#header .gnb > li > input[type="checkbox"]{position:absolute;width:100%;height:100%;background:transparent;top:0;left:0;visibility: hidden;}
#header .gnb label{margin-bottom:0;}*/
#header .gnb > li/*,
#header .gnb > li > label*/{display:block;text-align: center;line-height:1;margin-bottom:0;}
#header .gnb > li > a {display: block;display: block;padding: 26px 11px;}
/*#header .gnb > li > label > a {display: block;padding: 26px 12px;}*/
#header .gnb li.active{color:#f58220}
#header .gnb li:hover,
#header .gnb li.show,
#header .gnb li a:hover,
#header .gnb li a:focus/*,
#header .gnb li:hover > label*/{background:#fff;color:#f58220;}
/*#header .gnb li.active > label,*/
.ie .submenu label{font-weight:700 !important;}
.submenu li.active > a,
#header .gnb li a.active{color:#f58220;}
#header .ico-search2{/*position:absolute;right:20px;top:15px;*/float:right;font-size:0;display:block;width:33px;height:33px;border:2px solid #829db9;border-radius: 2px;background-size: auto 34px;background-position:-2px -3px;-webkit-animation-duration: 2s;-ms-animation-duration: 2s;-moz-animation-duration: 2s;-o-animation-duration: 2s;animation-duration: 2s;margin:17px 0;}
#header{position:relative;}
#header .gnb .submenu{color:#000;position:fixed;top:67px;left:0;width:100%;z-index: 99;display: none;background:#fff;}
.wrap-submenu{padding:28px 35px; max-width:1080px;margin:0 auto;}
.submenu .row{max-width:890px;}
.submenu .row > div{margin-bottom:20px;}
.submenu li{line-height: 1;}
.submenu li > a{font-size:0.95rem;line-height: 1.5;font-weight: 300;}
.submenu label{font-size:1rem;line-height: 1.5;font-weight: 500;margin:0;}
#header .area-search{position:absolute;width:100%;top:100%;left:0;transition:all 0.3s ease-in;z-index: 4;background:#f7f5fa;animation-duration: 1s;}
#header .wrap-search{position:relative;padding: 50px 15px;max-width:1080px;margin: 0 auto;}
#header .btn-close{position:absolute;top:0;right:0;padding:14px 22px;}
#header .ico-close{width:20px;height:20px;background-position: -103px -13px;}
#header .searchbar{max-width:615px;margin:0 auto;background:#fff;border-radius: 5px;height:48px;box-shadow: inset 1px 1px 2px rgba(0,0,0,.2);border: 1px solid #cfcfcf;padding:12px;position:relative;border-bottom-color:#e1e1e1;}
#header .searchbar input{border:0;outline:0;font-size:1.143rem;width: calc(100% - 40px);}
#header .ico-search{width:30px;height:30px;position:absolute;right:12px;top:9px;background-position: -54px}

::-webkit-scrollbar{display:none;}
#content{position: relative;height:calc(100% - 67px);overflow-x:hidden;overflow-y: auto;background:#f4f5f8; -ms-overflow-style: none;}
#content > .wrap{padding: 8.3vh 60px 0;min-height:calc(100% - 170px);}
#content.main > .wrap{padding:44px 35px 0;}
#content.board > .wrap{padding-top:70px}
#content > .wrap > div[id^="sub"]{padding-top:8.3vh;padding-bottom:11.7vh;clear:both;}
/*#content > .wrap > div[id^="sub"]:first-child{padding-top:8.3vh;}*/
#content > .wrap > div[id^="sub"]:last-child{padding-bottom:20vh;}
#content .tab-content > div[id^="sub"]{padding-bottom:10vh;}

#footer{padding-bottom: 25px;}
#footer h5{font-size:1.467em;font-weight:700}
#footer p{font-size:0.867em}

.dim{position:fixed;top:67px;left:0;background:rgba(0,0,0,.2);width:100%;height:calc(100% - 67px);display: none;z-index: 5}
.d-flex .flex-item{flex-grow: 1;}
.top-line{border-top:1px solid #d4d4d5;padding-top:40px;}
.row {margin-left: 0; margin-right: 0;}

/* main */
.main .col-12 h2{font-size:2rem;color:#424242}
.main .col-12 h2:before{content: '';display:inline-block;width:3px;height:.8em;background:#ababab;vertical-align: middle;margin:0 8px 4px 0;}
.main-ico{background: url(/imf/images/menu.png) no-repeat;display:inline-block;width:70px;height:64px;margin-bottom:15px}
#content.main .row div[class^="col"]{margin: 15px 0;}
.main-menu{display:block;background: #edeef1;border: 1px solid #e1e2e4;text-align: center;padding: 35px 23px;color:#4a4a4a;position:relative;height:230px;}
/*.main-menu:after, .main-menu:before{content:'';position:absolute;width:calc(100% - 20px);height:calc(100% - 20px);border:3px solid transparent;top:10px;left:10px;transition: all .3s ease-in;}*/
.main-menu:after{content:'';position:absolute;width:0;height:0;border:3px solid transparent;bottom:10px;right:10px;/*transition: all .3s ease-in;*/}
.main-menu:before{content:'';position:absolute;width:0;height:0;border:3px solid transparent;top:10px;left:10px;}
.main-menu h2{font-size:1.7rem;font-weight: 500;margin: 0 -20px;margin-bottom:10px;}
.main-menu h6{font-size:0.95rem;color:#717171;line-height: 1.4;font-weight: 300;}
.main-menu:hover{background:#3d516c;color:#fff;}
/*.main-menu:hover:after{border-color:rgba(255,255,255,.35);}*/
.main-menu:hover:before{
    /*-webkit-animation: mainmenuAnimation 1s forwards;
    -ms-animation: mainmenuAnimation 1s forwards;
    animation: mainmenuAnimation 1s forwards;*/
    -webkit-animation-name: mainmenuAnimation;
    -webkit-animation-duration : 1s;
    -webkit-animation-fill-mode: forwards;
    animation-name: mainmenuAnimation;
    animation-duration : 1s;
    animation-fill-mode: forwards;
    border-top-color:rgba(255,255,255,.35);
    border-left-color:rgba(255,255,255,.35);
}
.main-menu:hover:after{
    /*-webkit-animation: mainmenuAnimation 1s forwards;
    -ms-animation: mainmenuAnimation 1s forwards;
    animation: mainmenuAnimation 1s forwards;*/
    -webkit-animation-name: mainmenuAnimation;
    -webkit-animation-duration : 1s;
    -webkit-animation-fill-mode: forwards;
    animation-name: mainmenuAnimation;
    animation-duration : 1s;
    animation-fill-mode: forwards;
    border-bottom-color:rgba(255,255,255,.35);
    border-right-color:rgba(255,255,255,.35);
}
.main-menu:hover h6{color:#fff;}
.main-menu:hover > .main-ico{background-position-y: 100%;animation: flash 1s;}
#shortcutMenu .col-6:nth-child(2) .main-ico{background-position-x: -70px}
#shortcutMenu .col-6:nth-child(3) .main-ico{background-position-x: -140px}
#shortcutMenu .col-6:nth-child(4) .main-ico{background-position-x: -210px}
#shortcutMenu .col-6:nth-child(5) .main-ico{background-position-x: -280px}
#shortcutMenu .col-6:nth-child(6) .main-ico{background-position-x: -350px}
/*#shortcutMenu .col-6:nth-child(4) h2{letter-spacing: -0.12em;}*/

/* typo */
h1,h2,h3,h4,h5,h6{margin:0;line-height: 1.3;}
li > p:last-child{margin-bottom: 0;}
p{margin-bottom:.7em;}
.datainfo{font-size:0.95rem;}
.red{color: #f5552e;}
.blue{color: #003c7f;}
h3.section-title{font-size:1.4em;color:#043b72;margin-bottom:20px;font-weight: 500;}
h4.section-title{font-size:1.25em;color:#272b2f;font-weight:500;margin-bottom:1em;}
.wrap-section.row h4.section-title:after{content:'';display:block;width:.8em;height:2px;background:#272b2f;margin-top: 1em;}
.wrap > h2,
div[id^="sub"] > h2{font-size:2.2rem; color:#043b72; margin-bottom: 20px;font-weight: 300;}

/* sections */
.wrap-section {position: relative;}
.wrap-section > .section{margin-bottom:/*80px*/8.3vh;}
.wrap-section.inner:not(first-child){margin-top:40px}
.wrap-section.inner > .section{margin-bottom: 40px;}
.wrap-section.inner.row{border-top:1px solid #d4d4d5;margin:0;margin-bottom:40px;overflow: hidden;}
.wrap-section.inner.row > .section[class^="col"]{padding:/*40px*/4.11vh;border-bottom:1px solid #d4d4d5;border-left:1px solid #d4d4d5;margin:0;margin-left:-1px;}
.section-content > p:first-child{margin-top: -8px;}
.list .section{margin-bottom:20px;}
.list .section:last-child{margin-bottom:0;}
.wrap-scroll {position: relative;overflow-y: scroll;/*height: 60vh;*/border-top:2px solid #333; border-bottom:1px solid #d4d4d5;}
.wrap-scroll.expand{height:70vh;margin-bottom:5vh;}
.wrap-scroll .section {margin-bottom: 40px;padding-top:40px;}

/* table */
table{position: relative; border-collapse: collapse;width:100%;border-top:2px solid #6e7876;table-layout : fixed;text-align: center;margin-bottom:40px}
.section table:last-child, li table:last-child, table table{margin-bottom: 0;}
table th{border:1px solid #c8c8c8; background: #eceff4;padding: 1.059em;font-size:1.143rem;color:#272b2f;word-break: break-all;font-weight:500;}
table tbody > tr > th{text-align: left;padding-left: 2.059em;padding-right: 2.059em;}
table td{border:1px solid #c8c8c8; padding: 1em; font-size:1em; word-break: break-all;}
table td ul[class$="list"], table td ol[class$="list"]{text-align: left;}
table tr th:first-child,
table tr td:first-child{border-left:0;}
table tr th:last-child,
table tr td:last-child{border-right:0;}
table.horizontal{text-align: left;}
table.horizontal th{vertical-align: top; padding: 2.3em 2em; width:35.2%;}
table.horizontal td{padding: 2.3em 2em;}
table table th, table table td{padding: 0.5em 1em !important;font-size:0.825em;}
table caption{font-size:0;height: 0; padding: 0; /* visibility: hidden */}
table .al {text-align:left !important;}

table.horizontal.pd-sm th, table.horizontal.pd-sm td{padding: 1em 1em 1em 2.3em;}
/* list */
*[class$="list"] *[class$="list"], td{margin-bottom:0;}
ul[class$="list"], ul.datainfo, .board-cont ul{list-style: none;padding-left:0;}
*[class$="list"] li, ul.datainfo li, .board-cont li{position: relative;padding-left:.8em;}
ol.list > li, .board-cont ol > li{padding-left:0;}
*[class$="list"] li:before, ul.datainfo > li:before, .board-cont li:before{position: absolute;left:0;}
ul.list > li:before, .board-cont ul > li:before{content: '¡¤';font-weight: 500;}
ul.dash-list > li:before,
.list > li > ul.list > li:before,
.board-cont ul > li > ul > li:before{content: '-';font-weight: inherit;}
ul.star-list > li:before,
.list > li > .list > li > ul.list > li:before,
.board-cont ul > li > ul > li > ul > li:before,
ul.datainfo > li:before{content: '*';font-weight: inherit;}
ol.list{margin-left:1.2em;}
.list > li > ol.list{margin-left:0;}
.list > li > ol.list, ol[class$="-list"]{list-style: none;}
ol.sub-num-list > li, *[class$="list"] > li > ol.list > li{padding-left:1.2em}
ol.sub-num-list > li:nth-child(1):before,
*[class$="list"] > li > ol.list > li:nth-child(1):before{content: '1)'}
ol.sub-num-list > li:nth-child(2):before,
*[class$="list"] > li > ol.list > li:nth-child(2):before{content: '2)'}
ol.sub-num-list > li:nth-child(3):before,
*[class$="list"] > li > ol.list > li:nth-child(3):before{content: '3)'}
ol.sub-num-list > li:nth-child(4):before,
*[class$="list"] > li > ol.list > li:nth-child(4):before{content: '4)'}
ol.sub-num-list > li:nth-child(5):before,
*[class$="list"] > li > ol.list > li:nth-child(5):before{content: '5)'}
ol.sub-num-list > li:nth-child(6):before,
*[class$="list"] > li > ol.list > li:nth-child(6):before{content: '6)'}
ol.sub-num-list > li:nth-child(7):before,
*[class$="list"] > li > ol.list > li:nth-child(7):before{content: '7)'}
ol.sub-num-list > li:nth-child(8):before,
*[class$="list"] > li > ol.list > li:nth-child(8):before{content: '8)'}
ol.sub-num-list > li:nth-child(9):before,
*[class$="list"] > li > ol.list > li:nth-child(9):before{content: '9)'}

ol.circle-num-list > li, *[class$="list"] > li > ol.list > li{padding-left:1.2em}
ol.circle-num-list > li:nth-child(1):before,
*[class$="list"] > li > *[class$="list"] > li > ol.list > li:nth-child(1):before{content: '¨ç'}
ol.circle-num-list > li:nth-child(2):before,
*[class$="list"] > li > *[class$="list"] > li > ol.list > li:nth-child(2):before{content: '¨è'}
ol.circle-num-list > li:nth-child(3):before,
*[class$="list"] > li > *[class$="list"] > li > ol.list > li:nth-child(3):before{content: '¨é'}
ol.circle-num-list > li:nth-child(4):before,
*[class$="list"] > li > *[class$="list"] > li > ol.list > li:nth-child(4):before{content: '¨ê'}
ol.circle-num-list > li:nth-child(5):before,
*[class$="list"] > li > *[class$="list"] > li > ol.list > li:nth-child(5):before{content: '¨ë'}
ol.circle-num-list > li:nth-child(6):before,
*[class$="list"] > li > *[class$="list"] > li > ol.list > li:nth-child(6):before{content: '¨ì'}
ol.circle-num-list > li:nth-child(7):before,
*[class$="list"] > li > *[class$="list"] > li > ol.list > li:nth-child(7):before{content: '¨í'}
ol.circle-num-list > li:nth-child(8):before,
*[class$="list"] > li > *[class$="list"] > li > ol.list > li:nth-child(8):before{content: '¨î'}

ol.ganada-list > li, *[class$="list"] > li > .list > li > ol.list > li{padding-left:1.5em}
ol.ganada-list > li:nth-child(1):before,
*[class$="list"] > li > *[class$="list"] > li > *[class$="list"] > li > ol.list > li:nth-child(1):before{content: '°¡.'}
ol.ganada-list > li:nth-child(2):before,
*[class$="list"] > li > *[class$="list"] > li > *[class$="list"] > li > ol.list > li:nth-child(2):before{content: '³ª.'}
ol.ganada-list > li:nth-child(3):before,
*[class$="list"] > li > *[class$="list"] > li > *[class$="list"] > li > ol.list > li:nth-child(3):before{content: '´Ù.'}
ol.ganada-list > li:nth-child(4):before,
*[class$="list"] > li > *[class$="list"] > li > *[class$="list"] > li > ol.list > li:nth-child(4):before{content: '¶ó.'}
ol.ganada-list > li:nth-child(5):before,
*[class$="list"] > li > *[class$="list"] > li > *[class$="list"] > li > ol.list > li:nth-child(5):before{content: '¸¶.'}
ol.ganada-list > li:nth-child(6):before,
*[class$="list"] > li > *[class$="list"] > li > *[class$="list"] > li > ol.list > li:nth-child(6):before{content: '¹Ù.'}

td *[class$="list"]:last-child{margin-bottom:0;}

/* ¾Ë·Áµå¸³´Ï´Ù*/
div[id^="sub"] > .notice-with-icon:last-child{margin-top:80px;}
.collapse > .notice-with-icon:last-child{margin-bottom:80px;}
.notice-with-icon h4{color:#043b72;font-size:1.25em; line-height: 19px;font-weight: 500;margin-bottom:10px;}
.notice-with-icon h4:before{content:'';display:inline-block;width:19px;height:19px;background:url(/imf/images/ico-notice.png) no-repeat;vertical-align: middle;margin-right:5px;}
.notice-with-icon li{font-size:0.938em;}
.notice {padding: 2rem; border: 1px solid #e3e3e3;}
.notice ul, .notice ol {margin-bottom: 0;}

/* 'ÀÚ¼¼È÷º¸±â'(Æ®·¹À̵ù) */
.area-accordion{display:none;}
.area-accordion.show{display:block;}

/* µå·Ó´Ù¿î ¸Þ´º */
#dropdown-tab{float:right;position:relative;}
#dropdown-tab label{display: block;border:1px solid #ddd;width:200px;}
#dropdown-tab .nav-tabs{display: block; width: 200px; border: 1px solid #ddd;position:absolute; top:100%;left:0;z-index: 1;}
#dropdown-tab .nav-tabs a{background:#fff;border: 0;border-bottom:1px solid #ddd;margin-bottom:0;border-radius: 0;}
#dropdown-tab .nav-tabs a.active,
#dropdown-tab .nav-tabs a:hover{background:#eaeaea}
#nav-tabContent{clear:both;}

/* ÅÇ */
.nav-tabs{padding-bottom:10px;border-bottom:0;padding-bottom:60px;font-size:0;}
.nav-tabs.inner-nav-tabs{border-top:1px solid #d4d4d5; border-bottom: 1px solid #d4d4d5;padding-bottom:2px;margin-bottom:20px;}
.nav-tabs .nav-link{font-size:1.222rem;font-weight: 500;padding:1em;line-height: 1;border-radius: 0;border:1px solid #043b72 !important;margin-left:-1px;color:#043b72;position:relative;background:transparent;text-align: center;display:inline-block;}
#futureVue .nav-tabs .nav-link{letter-spacing: -2px;}
.nav-tabs.inner-nav-tabs .nav-link{font-size:1rem;font-weight: normal;padding:9px 1em;padding-right:0;border:0 !important;color:#d4d4d5;background:transparent;}
.nav-tabs.inner-nav-tabs .nav-link:after{content: '|';margin-left:1em;color:#d4d4d5;}
.nav-tabs.inner-nav-tabs .nav-link:last-child:after{display: none;}
.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active{background: #043b72;color:#fff;border-color:#043b72 !important;font-weight: 400;}
.nav-tabs.inner-nav-tabs .nav-item.show .nav-link, .nav-tabs.inner-nav-tabs .nav-link.active{background:transparent;color:#043b72;text-decoration: underline;}
/*.nav-tabs:not(.inner-nav-tabs) .nav-item.show .nav-link, .nav-tabs:not(.inner-nav-tabs) .nav-link.active:after{content:'';display:block;width:0;height:0;border:10px solid transparent;border-top-color:#042b72;position:absolute;top:100%;left:50%;margin-left:-10px;z-index: 1;}*/
.nav-tabs.inner-nav-tabs.type-radio{border:0;}
.nav-tabs.inner-nav-tabs.type-radio .nav-link{padding-left:30px;padding-right:2em;position:relative;color:#333;margin-right:15px;}
.nav-tabs.inner-nav-tabs.type-radio .nav-link:after{content:'';display:block;width:8px;height:8px;background:#ddd;border-radius: 100%;position:absolute;left:0;top:50%;margin-top:-4px;}
.nav-tabs.inner-nav-tabs.type-radio .nav-link.active:before{content:'';display:block;width:14px;height:14px;background:transparent;border:1px solid #043b72; border-radius: 100%; position:absolute;left:12px;top:50%;margin-top:-7px;}
.nav-tabs.inner-nav-tabs.type-radio .nav-link.active{text-decoration: none;color:#043b72;}
.nav-tabs.inner-nav-tabs.type-radio .nav-link.active:after{background:#043b72;}

/* Å×À̺íÇü ÅÇ */
.menu-accordion.table-nav > table{border-top:0;}
.menu-accordion.table-nav > table th, .menu-accordion.table-nav > table td{padding:8px 27px;line-height: 1;}
.menu-accordion.table-nav > table th{color:#043b72;background:transparent;}
.menu-accordion.table-nav > table th.active{color:#fff;background:#043b72}
.menu-accordion.table-nav > table td{text-align: left;}
.menu-accordion.table-nav > table td button{cursor:pointer;text-decoration: underline;color:#053c74;}
.menu-accordion.table-nav > table td button.collapsed{text-decoration: none;color:#c8c8c8;}
/* .menu-accordion.table-nav > table td button:hover {} */
.menu-accordion.table-nav > table td button:after{content: '|';margin: 0 .5em;}
.menu-accordion.table-nav > table td button:last-child:after{display: none;}

/* ½ºÅÃÇü ¸®½ºÆ® */
.stack {border: 1px solid #ababab; padding: 5px; margin-bottom: 1rem}
.stack dl {border: 3px solid #053c74; margin-bottom: 0; padding: 10px 0; padding-left: 15px;}
.stack dt {margin-bottom: 0; padding-left: 30px; width: 35%; font-size: 16px; font-weight: 900; color: #043b72;}
.stack.step-stack dt {padding-left: 65px;}
.stack dt:after {content: ''; position: absolute; top: 0; right: 0; width: 1px; height: 100%; background-color: #ddd;}
.stack:nth-child(1) dt:before {content: '01.'; position: absolute; left: 0;}
.stack:nth-child(2) dt:before {content: '02.'; position: absolute; left: 0;}
.stack:nth-child(3) dt:before {content: '03.'; position: absolute; left: 0;}
.stack:nth-child(4) dt:before {content: '04.'; position: absolute; left: 0;}
.stack:nth-child(5) dt:before {content: '05.'; position: absolute; left: 0;}
.stack:nth-child(6) dt:before {content: '06.'; position: absolute; left: 0;}
.stack:nth-child(7) dt:before {content: '07.'; position: absolute; left: 0;}
.stack.step-stack:nth-child(1) dt:before {content: 'Step 01.'; position: absolute; left: 0;}
.stack.step-stack:nth-child(2) dt:before {content: 'Step 02.'; position: absolute; left: 0;}
.stack.step-stack:nth-child(3) dt:before {content: 'Step 03.'; position: absolute; left: 0;}
.stack.step-stack:nth-child(4) dt:before {content: 'Step 04.'; position: absolute; left: 0;}
.stack.step-stack:nth-child(5) dt:before {content: 'Step 05.'; position: absolute; left: 0;}
.stack.step-stack:nth-child(6) dt:before {content: 'Step 06.'; position: absolute; left: 0;}
.stack.step-stack:nth-child(7) dt:before {content: 'Step 07.'; position: absolute; left: 0;}
.stack dd {margin-bottom: 0; width: 100%; font-size: 13px;}
.stack dd .list {margin-bottom: 0;}

/* ¹öÆ° */
.wrap-title-btn{margin-left:10px;}
.btn{border-radius: 0;background:#053c74;color:#fff;font-size:1.125em;font-weight: 500;padding: 1.25em 1.875em;line-height: 1.125;display:block;}
.btn.big{padding: 2.25em 1.875em 6.6em;}
.btn:hover, .btn:focus{color:#fff;opacity:.9}
.btn-link{text-decoration: underline;color:#043b72;}
.btn.btn-sm{background:#3a3a3a;font-size:0.95rem;line-height: 30px;padding:0 15px;font-weight: normal;}
.btn.btn-sm:after{content: '>';margin-left:1em;font-weight: 500;}
.btn.btn-sm.close-all{float:right;margin-top:10px;}
.btn.btn-sm.close-all:after{display: none;}
.btn.btn-lg{padding: 10px 80px;font-size:1.15rem;line-height: 30px;}
.btn.btn-arrow{width: 100%;font-size:0.95rem;line-height: 30px;padding:3px 15px;font-weight: 700;text-align: left;}
.btn.btn-arrow:after {content: ">";float: right;}
.btn.btn-tail{padding-right:35px;position:relative;}
.btn.btn-tail:after{content:'';display: block;width:9px;height:15px;background:url(/imf/images/btn_tail.png) no-repeat;position: absolute;right:14px;top:50%;margin-top:-7.5px;}
.btn.btn-download{background:transparent;border:1px solid #ababab; color:#4f5458;font-size:1rem;min-width:270px;position: relative;margin-left:15px;font-weight: 300}
.btn.btn-download:hover{color:#4f5458}
.btn.btn-download:before{content:'';display: block;width:30px;height:1px;background:#ababab;position:absolute;left:-15px;top:50%;}
.btn.btn-download span:after{content:'';display: inline-block;width:16px;height:15px;background:url(/imf/images/btn_tail.png) no-repeat;background-position: 100% 0;margin: 0 0 0 .8em;vertical-align: middle;}
.btn.btn-xs {background-color: #A6A6A6; color: #fff; font-size: 1em; font-weight: 500; padding: 0.3em 0.7em;}

/* STEPS */
.steps{text-align: center;border-top:1px solid #d4d4d5;border-bottom:1px solid #d4d4d5;padding-bottom: 10px;}
.steps .step-title{position:relative;}
.steps .step-title h5{font-size:1.333em;line-height: 1.25;font-weight: 500;color:#52575c;}
.steps .step-title:before, .steps .step-title h5:before{content: '';display:block;width:61px;height:61px;margin:0 auto;background:url(/imf/images/steps.png) no-repeat;}
.steps .step-title h5:before{width:50px;height:50px;background-position:0 -61px;}
.steps p:before{content:'';display:block;width:.8em;height:2px;background:#52575c;margin:1em auto;}
.steps p{padding: 0 1em;margin:0;}
.steps > div[class^="col"]{padding-top:40px;padding-bottom:30px;overflow: hidden}
.steps > div[class^="col"]:before{content:'';display:block;width:calc(100% + 30px);height:1px;background:#7e97b6;position:absolute;left:-15px;top:125px;z-index: 0}
.steps > div[class^="col"]:first-child:before{left:50%}
.steps > div[class^="col"]:last-child:before{left:auto;right:50%;}
.steps.blue1 div[class^="col"] .step-title:before{background-position-y: -121px;}
.steps.blue2 div[class^="col"] .step-title:before{background-position-y: -182px;}
.steps.blue3 div[class^="col"] .step-title:before{background-position-y: -243px;}
.steps div[class^="col"]:nth-child(1) .step-title:before{background-position-x: 0;}
.steps div[class^="col"]:nth-child(2) .step-title:before{background-position-x: -61px;}
.steps div[class^="col"]:nth-child(3) .step-title:before{background-position-x: -122px;}
.steps div[class^="col"]:nth-child(4) .step-title:before{background-position-x: -183px;}
.steps div[class^="col"]:nth-child(5) .step-title:before{background-position-x: -244px;}
.steps div[class^="col"]:nth-child(6) .step-title:before{background-position-x: -305px;}
.steps div[class^="col"]:nth-child(7) .step-title:before{background-position-x: -366px;}
.steps div[class^="col"]:nth-child(8) .step-title:before{background-position-x: -421px;}
.steps div[class^="col"]:nth-child(9) .step-title:before{background-position-x: -481px;}
.steps div[class^="col"]:hover .step-title h5:before{background-position: -61px -61px;}

.steps.vertical{text-align: left;}
.steps.vertical .step-title{padding-left:122px;position: relative;width:30%;display: table;}
.steps.vertical .step-title:before, .steps.vertical .step-title h5:before{position: absolute;left:0;top:50%;margin-top:-35px;}
/*.steps.vertical .step-title h5{display: table-cell;vertical-align: middle;}*/
.steps.vertical .step-title h5:before{left:61px;margin-top:-22px;}
.steps.vertical .step-content{width:70%}
.steps.vertical p{padding:0;width:70%;}
.steps.vertical p:before{display: none;}
.steps.vertical > div[class^="col"]{clear:both;align-items: center;}
.steps.vertical > div[class^="col"]:before{width:1px;height:100%;left:100px;top:0}
.steps.vertical > div[class^="col"]:first-child:before{top:60px}
.steps.vertical > div[class^="col"]:last-child:before{top:-60px}

img + .steps{margin-top: 20px;}
.steps + img{margin-top: 80px;}

.steps2{background:#fff;padding: 30px;border-top:2px solid #65686d; margin-bottom:20px;}
.steps2 h4{background:#52575b;width:300px;margin:0 auto;color:#fff;text-align: center;padding:10px;font-size:1.2rem;margin-bottom:20px;}
.steps2 > div{margin-bottom:100px;position:relative;}
.steps2 > div:after{content:'';display:block;width:35px;height:35px;background:url(/imf/images/online/img-steps/arrow.png) no-repeat;position:absolute;left:100%;top:50%;margin-left:-17px;}
.steps2 > div:nth-child(even):after{top:100%;left:0;margin-top:40px;transform:rotate(135deg)}
.steps2 > div:last-child:after{display: none;}
.steps2 > div:nth-last-child(1),
.steps2 > div:nth-last-child(2){margin-bottom:0;}

/* VERTICAL-STEPS */
.vertical-steps {text-align: left; border-top: 2px solid #000; border-bottom: 2px solid #d4d4d5;}
.vertical-steps .step-title {position: relative; width: 30%;}
.vertical-steps .step-title h5 {position: relative;padding-left: 3.5em;display: inline-block;font-size: 20px;line-height: 1.25;font-weight:500;color: #52575c;}
.vertical-steps .step-title:before, .vertical-steps .step-title h5:before{content: '';display: inline-block;width: 61px;height: 61px;background: url(/imf/images/steps.png) no-repeat;}
.vertical-steps .step-title h5:before{width: 50px;height: 50px;background-position: 0 -61px;position: absolute;left: 0;}
.vertical-steps .step-content {width: 70%}
.vertical-steps div[class^="col"]{padding-top:40px;padding-bottom:30px;}
.vertical-steps div[class^="col"]:nth-child(1) .step-title:before{background-position-x: 0;}
.vertical-steps div[class^="col"]:nth-child(2) .step-title:before{background-position-x: -61px;}
.vertical-steps div[class^="col"]:nth-child(3) .step-title:before{background-position-x: -122px;}
.vertical-steps div[class^="col"]:nth-child(4) .step-title:before{background-position-x: -183px;}
.vertical-steps div[class^="col"]:nth-child(5) .step-title:before{background-position-x: -244px;}
.vertical-steps div[class^="col"]:nth-child(6) .step-title:before{background-position-x: -305px;}
.vertical-steps div[class^="col"]:hover .step-title h5:before{background-position: -61px -61px;}

/* À̹ÌÁö Àִ ŸÀÌƲ */
.title-with-img{display:table;width:100%;}
.title-with-img > *{display:table-cell;vertical-align: middle;}
.title-with-img > div:last-child{padding-left:30px;}

/*  */
table + .datainfo{margin-top:-30px;}
p.datainfo{position:relative;padding-left:1em;}
p.datainfo:before{content: '*';margin-right:.5em;position:absolute;left:0;}

/* ¾ÆÄÚµð¾ð */
.accordion-title h4{font-size:1.467rem/*22px*/;color:#333;font-weight: 400;padding:20px 100px 20px 10px;border-top:2px solid #65696e;border-bottom:1px solid #d4d4d5;position:relative;cursor:pointer;margin-bottom:-1px;line-height: 1;margin-top:-2px;}
.accordion-title h4.collapsed{border-bottom:2px solid #65696e;}
.accordion-title h4:after{content: '';display:block;width:18px;height:2px;margin-top:-1px;background:url(/imf/images/accordion-tail.png); position:absolute;right:10px;top:50%;background-position:center center;transition: all 0.3s ease;}
.accordion-title h4.collapsed:after{height:18px;margin-top:-9px;}
.accordion-title{position:relative;}
.accordion-title button{position:absolute;right:40px;top:50%;margin-top:-8px;font-size:0;cursor: pointer}
.accordion-title button.collapseOpen{right:10px;width:19px;height:19px;}
.menu-accordion div[id^="collapse"]:not(.wrap-accordion){padding-top: 40px;padding-bottom:20px;border-bottom:2px solid #65696e;/*border-top:1px solid #e1e1e1;*/}
.collapse > ul:last-child, .collapse > ol:last-child{margin-bottom:0;}

/* ¿µ»ó ºÎºÐ */
.movie_txt{height:300px;overflow: auto;border:1px solid #ddd;padding:20px;background:#fff;}
.wrap-video{width:100%;height:0;padding-bottom:55%;position:relative;margin-bottom:20px;}
.wrap-video object{width:100%;height:100%;position:absolute;top:0;left:0;}

/* qrÄÚµå */
.qr-code{width:60px;height:60px;background:url(/imf/images/trading/qrcode.jpg) no-repeat;font-size:0;float:left;border:3px solid #dadada;box-sizing: content-box;border-radius: 3px;}
.qr-code.android{background-position-x: 0}
.qr-code.ios{background-position-x: 100%;}
.qr-code.stock{background-position-y: 0}
.qr-code.global{background-position-y: 100%}
.qr-code + span{line-height: 1.5;margin-top:10px;margin-left:10px;}

/* box */
.item-box{background: transparent; border-top:1px solid #d4d4d5; border-bottom: 1px solid #d4d4d5;padding:40px;}
.item-box.white,
.img-box.white{background:#fff;}
.item-box.grey{background:#e7e7ea;border:0;padding:0 10px;text-align: center;}
.item-box.grey img{margin: 0 auto;}
.img-box{border-top:1px solid #d4d4d5;padding:40px 0;border-bottom:1px solid #d4d4d5;position:relative;}
.img-box + .img-box{border-top:0;}
.ex-box {padding: 15px; background: #f1f1f1; color: #666; border: 1px solid #e3e3e3;}
.img-box .caption{background:#e7e7ea;text-align: center;padding:8px 0;margin:0 5px;position:relative;top:34px;}
/* notice-box */
.notice-box{background-color: #FFFFFF; padding: /*40px 32px*/2.667rem 2.133rem; border-top: 1px solid #d4d4d5; border-bottom: 1px solid #d4d4d5}
.notice-box .red{margin-bottom:1em;}

/* agree-box */
.agree-box label {margin-bottom: 0; margin-right: 2rem; margin-left: 0.5rem;}
.agree-box .btn-close {border: 1px solid #d4d4d5; padding: 0 10px; cursor: pointer;}
.all-agree {padding: 10px 20px; background-color: #e9eaef; box-shadow: 0 2px #e0dfe2; border-top: 1px solid #d3d3d3;}
.all-agree label {margin-right: 0;}

.futures-option-box.fixed {
    position: fixed;
    top: 67px;
    max-width: calc(1080px - 90px);
    width: 100%;
    background: #f4f5f8;
    z-index: 4;
    padding:1rem 0;
    border-bottom:2px solid #333;
}

/* °Ë»öâ  */
.search-box {
/*    position: absolute;*/
/*    top: -30px;
    right: 0;*/
    /*width: 26.04166666667%;*/
    float:right;
    width: 250px;
    min-width: 200px;
    height: 30px;
    margin-top: -30px;
    margin-bottom:10px;
}
.search-box input[type="text"] {
    padding: 5px;
    float: left;
    width: 200px;
    height: 100%;
    box-sizing: border-box;
    border: 1px solid #ababab;
}
.search-box input[type="button"] {
    float: left;
    width: 50px;
    height: 100%;
    background-color: #043b72;
    border: none;
    font-weight: 500;
    color: #fff;
}
.board-header{background: #eaebef; border-top:1px solid #d7d7d7; border-bottom: 1px solid #d7d7d7;padding:10px 0;line-height: 27px;margin-bottom:20px;}
.board-header .search-box{width:100%;}
.board-header .search-box input[type="text"]{width:calc(100% - 50px)}
.board-header .custom-select{height:30px;line-height:30px;padding: 0 10px;background-color:#fff;}

.search-result{padding-top:20px;border-bottom:1px solid #d4d4d5;margin-bottom:8.3vh;}

/* ¸ñ·Ïº¸±â ¹öÆ° */
.view-list {margin-top: 7.1em; text-align: right;}
.btn-view-list {padding: 17px 40px; border: 1px solid #d4d4d5; display: inline-block; margin-bottom:20px !important; line-height: 1;}
.view-prev, .view-next{text-align: left;border-top:1px solid #c8c8c8;border-bottom: 1px solid #c8c8c8; padding:3px 0  5px;font-size:0.95em;}
.view-prev{border-bottom:2px solid #65696e}
.view-next{margin-bottom:8.3vh;}
.view-prev b, .view-next b{padding-right:5px;}
.view-prev:before, .view-next:before{content:'';display: inline-block;width:17px;height: 10px;background:url(/imf/images/board-item.jpg) no-repeat;margin-right:1em;}
.view-next:before{background-position-y:100%;}

/* °Ô½Ã±Û */
.board-title,
.board-cont h3{margin-bottom: 80px;font-size:1.867rem;font-weight: 500;}
.board-sub-title{font-size:1.667rem;font-weight: lighter;}
.board-cont{margin:0 !important;}
.board-cont h4{font-size: 1.4em;color: #043b72;margin-bottom: 20px;font-weight: 500;margin-top:8.3vh;}
.board-cont h4:first-child{margin-top:0;}
.board-cont img{margin-bottom:2em;}
.board-cont h5{margin-bottom:.8em;margin-top:30px;}
.board-cont table + h5{margin-top:-10px}

/* ÆäÀÌÁö³×ÀÌ¼Ç */
.pagination{justify-content: center;}
.page-link{background:transparent;font-weight:500;border:0;}
.page-link:focus, .page-link:hover{background:inherit;color:inherit;border:0;}
.page-item.active .page-link:focus, .page-item.active .page-link:hover{color:#fff;}
.page-link:after{content: '|';position:absolute;right:0;top:0;font-weight: lighter;line-height:2.25em;color:#c8c8c8}
.page-item:nth-child(1) .page-link,
.page-item:nth-child(2) .page-link,
.page-item:nth-last-child(1) .page-link,
.page-item:nth-last-child(2) .page-link{padding: .6em .2em;}
.page-item:nth-child(1) .page-link:after,
.page-item:nth-child(2) .page-link:after,
.page-item:nth-last-child(1) .page-link:after,
.page-item:nth-last-child(2) .page-link:after,
.page-item:nth-last-child(3) .page-link:after{display: none;}
.page-item.active .page-link{background: transparent;}
.page-item.active .page-link span{background:orange;padding:0 5px;}
.page-item:nth-child(1) .page-link span:not(.sr-only){font-size:0;display:block;width:17px;height:17px;background: url(/imf/images/pagination.png) no-repeat 0 0;}
.page-item:nth-child(2) .page-link span:not(.sr-only){font-size:0;display:block;width:17px;height:17px;background: url(/imf/images/pagination.png) no-repeat -17px 0;}
.page-item:nth-last-child(2) .page-link span:not(.sr-only){font-size:0;display:block;width:17px;height:17px;background: url(/imf/images/pagination.png) no-repeat -34px 0;}
.page-item:nth-last-child(1) .page-link span:not(.sr-only){font-size:0;display:block;width:17px;height:17px;background: url(/imf/images/pagination.png) no-repeat -51px 0;}

/* margin / padding */
.margin-top-1rem{margin-top:1rem;}
.margin-top-2rem{margin-top:2rem;}
.margin-bottom-0{margin-bottom: 0;}
.margin-bottom-40{margin-bottom:4.2vh;}
.margin-bottom-80{margin-bottom:8.4vh;}
.margin-bottom-1rem{margin-bottom:1rem;}
.margin-bottom-2rem{margin-bottom:2rem;}
.margin-right-1rem{margin-right: 1rem;}
.padding-left-1rem{padding-left: 1rem;}
.padding-right-0{padding-right: 0;}

/* text-color */
.text-orange {color: orange;}
.text-gray {color: gray;}

/* background-color */
.bg-gray {background-color: #8F8F93;}

/* top ¹öÆ° */
#link-top{position:fixed;right:27px;bottom:27px;}
/*#link-top:focus{outline:0;border:0;}*/

/* ´ÙÀ̾î±×·¥ */
.diagram.triangle .col-md-6 span{position:relative;display: block;}
.diagram.triangle .col-md-6:nth-child(2) span{padding-bottom:40px;}
.diagram.triangle .col-md-6:nth-child(2) span:before,
.diagram.triangle .col-md-6:nth-child(2) span:after{content:'';position:absolute;bottom:0px;width:55px;height:1px;background:#c8c8c8;display:block;}
.diagram.triangle .col-md-6:nth-child(2) span:before{right:100%;transform:rotate(-45deg);transform-origin: 0 0;margin-right:-20px}
.diagram.triangle .col-md-6:nth-child(2) span:after{left:100%;transform:rotate(45deg);transform-origin: 100% 100%;margin-left:-20px;}
.diagram.triangle .col-md-6:nth-child(3) span:after{content:'';display: block;width:40px;height:1px;background:#c8c8c8;position:absolute;left:100%;top:50%;margin-left:-5px;}

/* Æû ±×·ì */
.form-group .row h5 span {font-size: 1rem; font-weight: 300;}
.form-group .row div[class^="col"] {padding-left: 0; padding-right: 0;}
.form-group .row div[class^="col"] span {margin-left: 10px; margin-right: 10px;}
.form-group .row input[type="tel"] {width: 30%;}

.form-group table th{background:#e9eaef}
.form-group table th:before{content:'*';line-height: 1em;color:#f58220;margin-right:.2em;}
.form-group table th, .form-group table td{padding:1em 1.8em;}

.form-control{border-radius: 0;}

/* table °¡·Î ½ºÅ©·Ñ */
.table-responsive{overflow-y:hidden;}
.table-responsive > table{min-width:600px;}

/* shortmenu ÆäÀÌÁö */
.shortmenu h2{font-size:1.867rem;color:#000;font-weight: 500;margin-bottom:40px;}
.shortmenu h2 span{font-size:0.75em;font-weight: 300;color:#4f5458;}
.shortmenu .breadcrumbs{display:table;width:100%;margin-bottom:15px;}
.shortmenu .breadcrumbs li{list-style: none; float:left;border:1px solid #ababab;font-size:1.2rem;padding:5px 20px;margin-left:-1px;color:#4f5458;}
.shortmenu .breadcrumbs li.active{background:#e7e7e7}
.shortmenu .section-title h5{background:#e7e7e7;color:#4a4a4a;font-size:1rem;font-weight: 400;line-height: 2;margin-bottom:20px;padding: 0 20px;display:table;width:100%;}
.shortmenu .section-title h5 .float-right{font-size:0.933rem;color:#868686;line-height:2rem;}
.shortmenu .section {margin-bottom:6.2vh;}
.shortmenu .section > .row{margin: 0 -15px;}
.shortmenu .section > .row > div:nth-child(2){padding-left:10px;}
.shortmenu img{margin-bottom:20px;}
.shortmenu ol li{font-size:1.067rem;list-style: none;display:table;width:100%;margin-bottom:1em;}
.shortmenu ol li > *{float:left;vertical-align: top;}
.shortmenu ol li > span{font-size:.6em;font-weight: 900;color:#fff;display: inline-block;background:#f58220;width:16px;height:16px;line-height: 16px;text-align: center;border-radius: 100%;margin-right:5px;}
.shortmenu ol li > p{width:calc(100% - 22px);line-height: 1.2;margin-top:-2px;}

/* °Ë»ö */
#guide_auto_keyword {
    background: #fff;
    list-style: none;
    position: absolute;
    width: 100%;
    margin-left: -13px;
    top: 100%;
    border-radius: 5px;
    padding: 10px 0;
    border: 1px solid #cfcfcf;
    box-sizing: content-box;
}
#guide_auto_keyword li {
    padding: 5px 15px;
}
#guide_auto_keyword li:hover{
    background: #f4f4f4;
}
#guide_auto_keyword li a {
    display: block;
}


@media all and (min-width: 809px){
    #header .gnb > li:hover .submenu,
    #header .gnb > li > a:hover + .submenu,
    #header .gnb > li > a:focus .submenu,
    #header .gnb > li.show .submenu{display: block;}
    #header .gnb > li > a:focus-within .submenu{display: block;}
    /*.gnb:hover ~ .dim,
    .gnb:focus-within ~ .dim*/
    .dim.active{display: block;}
}

@media all and (max-width: 1080px){
    #header .logo{float:none;margin:0 auto;display:table;}
    #header .logo:after{display: none;}
    #header .gnb .submenu, .dim{top:132px;}
  #header .area-gnb{width:100%;}
    #content{height:calc(100% - 132px)}
    #content  > .wrap{padding: 6.4vw 5.5vw;min-height: calc(100% - 85px);}
    #content.main .row{padding: 6.5vh 7.22vh;}
    .main-menu{padding:3.24vw 3.05vw;height:260px;}
    .main-menu h2{margin: 0 0 10px;}
    .wrap-submenu{padding:  4.62vw}
    .main-ico{margin-bottom:1.38vw}
    .vertical-steps .step-title {text-align: center;}
    .vertical-steps .step-title h5 {padding-left: 0; font-size: 16px;}
    .vertical-steps .step-title h5:before {display: block; position: static; margin: 0 auto;}
    .futures-option-box.fixed{top:132px;width:calc(100% - 11vw)}
}
@media all and (max-width: 810px){
    html{overflow-y:auto;}
    body{padding-top:47px;height:auto;min-height:100%;}
    #header{width:100%;position:fixed;top:0;left:0;z-index: 50;}
    #header .mob-menu{display:table;}
    #header .wrap{padding: 0 15px;}
    #header .logo{position:absolute;left:50%;margin-left:-43px;margin-right:0;padding:4px 0 12px;}
    #header .logo img{height:30px}
    #header .faq{width:216px;background:#043b72;padding:5px 0;float:none;display:block;}
    #header .faq img{margin: 0 auto;}
    #header .area-gnb:after{display: none;}
    #header .dim{transition: all 0.5s ease;width:100%;display:none;left:0;opacity:0;z-index: -1;}
    /*#header .gnb{width:50%;margin: 0 -15px;border-top:1px solid rgba(255,255,255,.5);}*/
    /*#header .gnb*/#header nav{width:100%; height:calc(100% - 47px); position:fixed;/*background:#fff;*/color:#333;left:0;overflow-y:auto;display:block;left:-100%;transition: all 0.5s ease;z-index:99;}
    #header .gnb{min-height:calc(100% - 43px);width:216px;background:#fff;float:none;}
    #header .gnb .submenu{position:static;}
    /*#header .gnb > li:focus .submenu{display: block;}*/
    #header .gnb input[type="checkbox"]:checked ~ .submenu,
    #header .gnb li.show .submenu{display: block;}
    #header .gnb > li{width:100%;float:none;padding:0}
    #header .gnb > li > a{text-align: left;padding-left:20px;color:#333;}
    /*#header .gnb > li > a*/
    #header .gnb .submenu label{width:100%;padding-left:20px;word-break:break-all;}
    #header .gnb .submenu a{padding-left:20px;}
    #header .gnb > li > label{/*padding: 20px 0;*/padding-left:20px;font-size:1rem;border:1px solid rgba(255,255,255,.2);border-left:0;border-top:0;text-align:left; color:#545454;width:100%;}
    .submenu .row{padding-top:10px}
    .submenu .row > div{margin-bottom:30px;}
    .submenu ul{display: none;padding-left:12px;padding-top:.2em}
    .submenu li > a{color:#545454;padding:.5em 0;display:block;}
    .submenu input:checked ~ ul{display: block;}
    #mob-menu-toggle:checked ~ nav{left:0;}
    #mob-menu-toggle:checked ~ nav .dim{display:block;opacity:1;}
    #mob-menu-toggle:checked + label{background:#fff;}
    #mob-menu-toggle:checked + label span{background-position-y:100%;}
    #header .ico-search2{top:11px;right:15px;width:23px;height:23px;background-size: auto 22px;background-position: -1px -1px;margin:11px 0;}
    .wrap-submenu{padding:0 10px 0 6px;}
    #content{height:auto;}
    .form-group .row div[class^="col"]:nth-child(2) {margin-top: 5px;}
    .form-group .row div[class^="col"] span {margin-left: 0;}
    .futures-option-box.fixed{top:47px;}
}
@media all and (max-width: 767px){
    html, body{font-size:12px;}
    /* .row{margin-left: -5px; margin-right: -5px;} */
    .col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-auto, .col-lg, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-auto, .col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-auto, .col-sm, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-auto, .col-xl, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-auto{padding-left:5px;padding-right:5px;}
    sup{top:0;margin-left:.3em;}
    #header .gnb > li > a:focus + .submenu{display: block !important;}
    #header .gnb li a:focus{outline: 0;}
    #content > .wrap{padding: 6.4vw 15px; min-height:calc(100% - 72px)}
    #content.main > .wrap{padding: 6.4vw 5px;}
    .dim{height: calc(100% - 47px);top:47px;}
    /*#content.menu-slideDown{height: calc(100% - 112px);transition:all 1s ease}*/
    #content.main .row{padding: 4.16vw 15px;}
    #content.main .row div[class^="col"]{margin: 5px 0;}
    .main-menu{padding:3.24vw 3.5vw;height:160px;}
    .main-menu h2{font-size:1.1rem;}
    .main-menu h6{font-size:0.85rem;}
    .main-ico{width:56px;height:50px;background-size: 336px auto;}
    #shortcutMenu .col-6:nth-child(2) .main-ico{background-position-x: -56px}
    #shortcutMenu .col-6:nth-child(3) .main-ico{background-position-x: -112px}
    #shortcutMenu .col-6:nth-child(4) .main-ico{background-position-x: -168px}
    #shortcutMenu .col-6:nth-child(5) .main-ico{background-position-x: -224px}
    #shortcutMenu .col-6:nth-child(6) .main-ico{background-position-x: -280px}
    .main-menu:hover > .main-ico{background-position-y: -50px;}
    .main-menu:before{top:5px;left:5px;border-width: 2px;}
    .main-menu:after{bottom:5px;right:5px;border-width: 2px;}
    .main-menu:hover:before, .main-menu:hover:after{animation:mainmenuAnimationMobile 1s forwards}
    table th, table td{padding: 0.5em 0.75em;font-size:1rem;line-height: 1.2rem;}
    table.horizontal th, table.horizontal td{padding: 1.8em 1.3em}
    table.horizontal th{width:30%;}
    table tbody > tr > th{padding-left:1.3em;padding-right:1.3em;}
    table.horizontal.pd-sm th, table.horizontal.pd-sm td{padding:1em !important;}
    .btn.btn-download{min-width:auto;width:calc(100% - 15px);margin-bottom:10px;}
    .nav-tabs .nav-link{font-size:1.16rem;margin-bottom:-1px;}
    .notice{padding:3.1vh;}
    .wrap-title-btn{display:block;margin:0;margin-top:10px;}
    .steps.vertical .step-title{width:100%;min-width: auto;max-width: none;margin-bottom:30px}
    .steps.vertical div[class^="col"]{padding-left:15px;padding-right:15px;}
    .steps.vertical > div[class^="col"]:before{display: none;}
    .steps.vertical > div[class^="col"]:first-child{margin-top:20px;}
    .steps2 h4{width:100%;}
    .steps2 > div:after{top:100%;left:50% !important;margin: 30px 0 0 -17px !important; transform:rotate(90deg) !important;}
    .steps2 > div:nth-last-child(2){margin-bottom: 100px;}
    .title-with-img{display:block;}
    .title-with-img > div:last-child{padding:20px 0 0 0;}
    .item-box{padding:20px;}
    .item-box div[class^="col"]{margin-bottom:1rem;}
    .item-box li{margin-top:1rem;margin-bottom:-1rem;}
    .steps + img{margin-top: 50px;}
    .stack dl {padding-right: 15px;}
    .stack dt {margin-bottom: 5px;}
    .stack dd {margin-bottom: 5px;}
    .stack dt:after {display: none;}
    .btn.btn-lg {padding: 5px 20px;}
    .futures-option-box{padding: 0 10px;}
    .movie_txt{height:150px;padding:1em;}
    .nav-tabs .nav-link[class*="col"]{padding:1em .7em;}
    .shortmenu .section > .row{margin: 0 -5px;}
    .shortmenu h2 span{display:block;margin-top:.5em;}

    .diagram.triangle .col-md-6:nth-child(2) span{padding-bottom:0;}
    .diagram.triangle .col-md-6:nth-child(2) span:before,
    .diagram.triangle .col-md-6:nth-child(2) span:after,
    .diagram.triangle .col-md-6:nth-child(3) span:after{display: none;}
    .diagram.triangle .col-md-6{margin-bottom: 10px;}

    .nav-tabs.inner-nav-tabs.type-radio .nav-link{width:33.3%;margin-right:0;text-align: left;}
    .nav-tabs.inner-nav-tabs.type-radio .nav-link.active:before{left:9px;}
  
  .futures-option-box.fixed{width:calc(100% - 30px);margin:0 !important;}
  .futures-option-box.fixed h2{margin-bottom:10px;}
}
.with-icon .section img.icon{margin: 0 auto 20px;}
@media all and (min-width: 768px){
    .with-icon .section {display: table; width: 100%;}
    .with-icon .section img.icon{float: left; margin : 0;}
    .with-icon .section img.icon + div{width: calc(100% - 80px); float: right;}
}