/* 기본 */
html, body{height:auto;}
html body{position: relative; background: #f0f0f0 !important; font-family: 'NanumSquare', sans-serif;}
body>section{min-height: calc(100vh - 269px);}
.clear_fix::after{content:''; display:block; clear: both; overflow: hidden;}
.clear_fix>li{float: left;}
ul, li{list-style:none; padding:0; margin:0;}
.red_color{color: #C34042;}
.green_color{color: #009245;}
.blue_color{color: #0966C6;}
.font_bold{font-weight: bold;}
/* .container{padding-top: 55px;} */
.default_margin{
    margin:80px auto 50px;
    min-height: calc(100vh - 369px);
}
a:link, a:visited{color:#333;}
body a:hover, body a:focus{color:rgba(0,0,0,.3); text-decoration: none;}
.fx_center{width:90%; margin:0 auto;}
/*  textarea:focus, button:focus, input:focus, select:focus {outline: none;}   */  
.pc_view{display: none;}
.br_m{display:block;}
.night_view{display:none;}
.btn:hover{background: #e9ecf1;}
input[type="text"], input[type="tel"]{border:1px solid #ddd; padding: 5px;}
input[type="password"]{font-family: 'Noto Sans', sans-serif;}
pre{font-family: 'NanumSquare', sans-serif !important;  transform: skew(-0.03deg) !important; font-size: 1em !important;}
a:focus, button:focus, /* input:focus{outline:none;} */


/* table */
table{border-collapse:collapse; border-spacing: 0; width: 100%; text-align:center;}
table th, table td{padding:15px 5px; border-bottom: 1px solid #B3B3B3; border-collapse: collapse;}
table th{border-top: 1px solid #B3B3B3; background: #f0f0f0;}

/* table 잘림현상 */
.overflow_table_wrap{overflow-y:auto;}
.overflow_table_wrap table{min-width: 400px;}
.table_scroll{text-align: right;}
.table_scroll>img{width: 30px;}
@media (min-width:410px){
    .table_scroll{display: none;}
}


/* paging */
/* .paging_wrap{text-align: center;margin:10px;}
.paging_wrap .on{font-size:1.2em; font-weight:600; display: inline-block; padding:2px; margin:0px 5px;} */


/* gnb */
.main{background: #fff; color:#333; position: fixed; padding:10px; width:100%; z-index:999; top:0; left:0;}
.main a:link ,.main a:visited{color: #333;}
.main a:hover ,.main a:focus{color: rgba(0,0,0,.3);}
.m_gnb ul, .m_gnb li{list-style:none; padding:0; margin: 0;}
.gnb, .log_wrap, .logout_wrap{display: none; font-family: 'NanumSquare', sans-serif; transform: skew(-0.03deg); font-weight:600;}
.gnb_wrap {text-align: center;}
.i_border{
    border: 1px solid rgba(255,255,255,0);
    border-radius: 4px;
    display: inline-block;
    padding: 2px;
    height: 18px;
    width: 18px;
    position: relative;
    top: 5px;
    text-align: center;
}
/* a:hover .i_border{border-color: rgba(255,255,255,.3);} */
.main .fa{color:#c2a485;}
.i_border i {font-size: 12px; position: relative; bottom: 4px; color:#c2a485;}
.gnb_logo{display: inline-block; height:35px; margin-right: 20px;}
.gnb_logo img{max-height:100%;}
.m_gnb{float:left; text-align: left;}
.m_gnb_btn{display:block; margin-top:7px;}
.m_gnb_btn>span {
    width: 30px;
    height: 2px;
    background: #333;
    display: block;
    transition: all .2s linear;
    margin-bottom: 6px;
}
.m_gnb_main{position:absolute; top:55px; left:-82%; background: #fff; height: 100vh; width:80%;}
.m_gnb_main a{display: block;}
.m_gnb_main li{padding:7px 0px;}
.m_gnb_main>li{border-bottom: 1px solid rgba(0,0,0,.1); font-size:1.05em; padding:7px 10%;}
.m_gnb_main ul{display: none; border-top: 1px solid rgba(0,0,0,.1); padding:0 10px; margin-top:8px;}
.m_gnb_main ul li{font-size:0.9em; padding-right:0;}
li.m_log{display: flex; align-items: center; padding: 7px 5px; font-size: 0.82em;}
.m_log>a{display:block; text-align:center; flex: 1; word-break: break-all; padding: 0 2px;}
.m_log>a:nth-child(2){border-left: 1px solid rgba(0,0,0,.1); border-right: 1px solid rgba(0,0,0,.1);}
/* .m_log>a:nth-child(3){border-left: 1px solid rgba(255,255,255,.1);} */
li.m_gnb_money{background: #f0f0f0; display: flex; align-items: center; justify-content: center;}
.m_gnb_money a{flex:1;}
.m_gnb_money p{flex:1; margin-bottom: 0; text-align:center;}
.m_gnb_money .i_border{top: 6px;}
.m_gnb_money .i_border i{bottom: 8px;}
.dim{position:fixed; width:100%; height:100vh; background:rgba(0,0,0,.6);top: 0; left: 0; z-index: 998; display:none;}
@media (max-width:340px){
  .m_gnb_main{font-size: 0.8em;}
}


/* footer */
footer{
    background: #fff;
    line-height: 1.8;
    color: #777;
    padding-top:40px;
    padding-bottom:40px;
    font-family: 'NanumSquare', sans-serif;
    transform: skew(-0.03deg);
    font-size: 14px;
}
footer .row>div{margin-top: 20px; margin-bottom: 20px;}
footer ul, footer li{margin:0; padding:0; list-style:none;}
footer a:link, footer a:visited{color: #fff;}
footer a:hover, footer a:focus{color: #4386f9; transition: all .2s linear 0s;}
footer .container{margin-top:0; padding-top:0;}
.logo{margin-bottom:15px; display:inline-block; }
.logo img{max-width:100%; height:auto;}
footer h3{
    font-size: 14px;
    color: #000;
    font-weight: 800;
    margin-bottom: 20px;
}
.page_footer .highlight {
    color: #b62d65;
}
.info li:first-child, .foot_icon div:first-child{font-size:1.2em; margin-bottom:12px; font-weight:500;}
.info li:last-child{margin-top:15px;}
.foot_icon a{color:#777;}
.foot_icon ul{display: flex; justify-content: flex-start; flex: 0 0 33.333%;}
.foot_icon ul li:last-child{opacity:0;}
.foot_icon ul li:last-child a{cursor:default;}
.foot_icon ul a{width:60%; display:block;}
.foot_icon img{width: 100%;}
.page_copyright{
    color: #96999e;
    background-color: #272d34;
    padding-top: 25px;
    padding-bottom: 25px;
    font-size: 14px;
    transform: skew(-0.03deg);
}
.page_copyright .col-xs-12{padding-left: 20px; padding-right: 20px;}
.page_copyright p {
    float: none;
    margin-top: 10px;
    margin-bottom: 0;
  }


@media (min-width: 575px) and (max-width: 768px) {
    footer .row{
      display: grid;
      grid-template-columns: 50% 50%;
    }
    footer .col-xs-6 {
      flex: none;
      max-width: 100%;
    }
}



.col-xs-12{width: 100%;}


/* 서브페이지 기본 레이아웃 */
.main+section{min-height: calc(100vh - 269px);}
.contents_wrap{width:90%; font-size:14px;}
.left_contents{display:none;}
.contents_div{background: #fff;}
.right_contents>h3{
    padding: 17px 15px;
    border-bottom: 1px solid #ddd;
    background: #fff;
    font-size:1.4em;
    font-family: 'NanumSquare', sans-serif;
    transform: skew(-0.03deg);
    font-weight: 800;
    margin-bottom:0px;
}
.contents_div{
  padding:20px;
  font-family: 'NanumSquare', sans-serif;
  transform: skew(-0.03deg);
}
.contents_div h4{font-size: 1.25em; font-weight: 600; color:#353535; margin-bottom:12px;}
.contents_div>div:first-child{margin-top:0px;}
.contents_div>div{margin-top:40px;}


/* 버튼 */
.btn_wrap{text-align: center; padding:10px 0;}
.btn_wrap a, .btn_wrap button, .btn_wrap input[type=button]{display: inline-block; padding: 10px 28px; color: #fff; border:none; background: #333;}
.btn_wrap a:hover, .btn_wrap button:hover, .btn_wrap input[type=button]:hover{background:#666; color: #fff;}
.btn_top_wrap{text-align: right; margin:0px 0 15px;}
.btn_top_wrap a, .btn_top_wrap button, .btn_top_wrap input[type=button]{display: inline-block; padding: 5px 15px; border-radius: 8px; color: #fff; border:none; text-align: center;}
.btn_gray{background: #2B2B2B;}
.btn_blue{background: #0966C6;}
a.btn_gray:link, a.btn_gray:visited{color:#fff;}
a.btn_gray:hover, a.btn_gray:focus{color:rgba(255,255,255,.8);}
.btn_blue:hover, .btn_blue:focus{background: #2B2B2B;}
.full_a_wrap a{width:100%; display:block; padding:7px; border-radius: 5px;}



/*  200525추가 버튼 색상 css */
.bor_red_a:link, .bor_red_a:visited{border:#c34042 1px solid; color:#c34042;}
a.bor_red_a:hover{background:#edc5c6; border-color:#edc5c6; color:#c34042;}
.bor_blue_a:link, .bor_blue_a:visited{border:#1763b6 1px solid; color:#1763b6; }
a.bor_blue_a:hover{border-color:#c4d9f0; background:#c4d9f0; color:#1763b6;  }
.bor_green_a:link, .bor_green_a:visited{border:#24b647 1px solid; color:#24b647; }
a.bor_green_a:hover{background: #caefd3; color:#24b647;}
.bor_gray_a:link, .bor_gray_a:visited{border:#424242 1px solid; color:#424242;}
.bor_gray_a:hover{border:#424242 1px solid; color:#424242;}
.bor_lightgray_a:link, .bor_lightgray_a:visited{border:#d7d7d7 1px solid; color:#bbb;}
.bg_red_a:link, .bg_red_a:visited{background: #f75467; color:#fff;}
.bg_red_a:hover{background: #edc5c6;}
.bg_lightred_a:link, .bg_lightred_a:visited{background: #fdcbd1; border:2px solid #fdcbd1; color:#333;}
.bg_lightred_a:hover{border-color:#f75467;}
.bg_blue_a:link, .bg_blue_a:visited{background: #4386f9; color:#fff;}
.bg_blue_a:hover{background: #c4d9f0;}
.bg_lightblue_a:link, .bg_lightblue_a:visited{background: #c6dafd; border:2px solid #c6dafd; color:#333;}
.bg_lightblue_a:hover{border-color:#4386f9;}
.bg_gray_a:link, .bg_gray_a:visited{background: #424242; color:#fff;}
.bg_gray_a:hover{background: #666; color:#fff;}
.bg_lightgray_a:link, .bg_lightgray_a:visited{background: #f0f0f0;}
.bg_lightgray_a:hover{background: #666; color:#fff;}

.btn_right_wrap{
    margin-top: 30px;
    text-align: right;
}
.btn_right_wrap a{
    padding:10px 45px;
    display: inline-block;
}
.btn_center_wrap{
    margin-top: 30px;
    text-align: center;
}
.btn_center_wrap a{
    padding:10px 45px;
    display: inline-block;
}

.pager_wrap{
    text-align: center;
    margin-top: 35px;
    margin-bottom: 10px;
}
.pager_wrap a{
    width: 28px;
    height: 28px;
    line-height: 25px;
    background: #424242;
    display: inline-block;
    color:#fff;
    font-weight:300;
    font-size: 0.9em;
    font-family:sans-serif;
}




/* select */
select {
    background: url(../img/icon/select_arrow.png) no-repeat 95% 50%;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-size:15px;
}
select::-ms-expand {/* for IE 11 */display: none; }


/* 체크박스 */
.round_chk {
    position: relative;
}
.round_chk input[type="checkbox"] {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip:rect(0,0,0,0);
  border: 0
}
.round_chk input[type="checkbox"] + label {
  display: inline-block;
  position: relative;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
}
.round_chk input[type="checkbox"] + label:before {
  content: ' ';
  display: inline-block;
  width: 20px;
  height: 20px;
  line-height: 20px;
  margin: -2px 8px 0 0;
  text-align: center;
  vertical-align: middle;
  background: #fafafa;
  border: 1px solid #cacece;
  border-radius : 100%;
}
.round_chk.small input[type="checkbox"] + label {
  font-size: 12px;
}
.round_chk.small input[type="checkbox"] + label:before {
  width: 17px;
  height: 17px;
  line-height: 17px;
  font-size: 11px;
}
.round_chk input[type="checkbox"]:checked + label:after {
    content: '';
    position: absolute;
    top: 7px;
    left: 4px;
    width: 12px;
    height: 12px;
    background: #333;
    border-radius: 100%;
}

/* radio_div */
.radio_div {position: relative;}
.radio_div input[type="radio"] {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip:rect(0,0,0,0);
  border: 0;
}
.radio_div input[type="radio"] + label {
  display: inline-block;
  position: relative;
  padding-left: 30px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
}
.radio_div input[type="radio"] + label:before {
  content: '';
  position: absolute;
  left: 0;
  top: -4px;
  width: 21px;
  height: 21px;
  text-align: center;
  background: #fafafa;
  border: 1px solid #cacece;
  border-radius: 100%;
  box-shadow: 0px 1px 2px rgba(0,0,0,0.05), inset 0px -15px 10px -12px rgba(0,0,0,0.05);
}
.radio_div input[type="radio"] + label:active:before,
.radio_div input[type="radio"]:checked + label:active:before  {
  box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px 1px 3px rgba(0,0,0,0.1);
}
.radio_div input[type="radio"]:checked + label:before {
  background: #E9ECEE;
  border-color: #adb8c0;
}
.radio_div input[type="radio"]:checked + label:after {
  content: '';
  position: absolute;
  top: 0px;
  left: 4px;
  width: 13px;
  height: 13px;
  background: #99a1a7;
  border-radius: 100%;
  box-shadow: inset 0px 0px 10px rgba(0,0,0,0.3);
}


/* quick_menu */
.quick_menu{
    position: fixed;
    right: 10px;
    bottom:10px;
    z-index:99;
}
.quick_menu>p {
    background: url(../img/icon/quick_menu1.png) #4B5FA2 no-repeat 13px center;
    color: #fff;
    font-size: 15px;
    font-family: 'NanumSquare', sans-serif;
    transform: skew(-0.03deg);
    font-weight: 700;
    margin-bottom: 0;
    border-radius: 50px;
    padding: 10px 10px 7px 35px;
    -webkit-background-size: 28px;
    background-size: 18px;
    cursor: pointer;
    position: absolute;
    bottom: 0;
    right: 0;
    width: 105px;
}
.quick_menu>p:hover{background-color: #7080b4;}
.quick_menu>div{
    background: #fff;
    -webkit-box-shadow: 0px 0px 9px 2px rgba(0,0,0,0.22);
    -moz-box-shadow: 0px 0px 9px 2px rgba(0,0,0,0.22);
    box-shadow: 0px 0px 9px 2px rgba(0,0,0,0.22);
    border-radius: 10px;
    padding: 20px 10px;
    position: fixed;
    bottom:-140px;
    right: 10px;
    opacity:0;
}
.quick_menu i{
    position:absolute;
    right: 10px;
    top: 3px;
    cursor: pointer;
}
.quick_menu ul{width:285px; margin-bottom:0;}
.quick_menu li{
    text-align:center;
    font-weight:600;
    width: 33.333%;
    font-family: 'NanumSquare', sans-serif;
    transform: skew(-0.03deg);
}
.quick_menu li span{
    width: 50px;
    height:50px;
    display: block;
    margin:auto;
    background: no-repeat center;
    -webkit-background-size:28px;
    background-size:28px;
    border-radius: 100%;
    margin-bottom:5px;
}
.quick_menu li:first-of-type span{
    background-image:url(../img/icon/quick_menu1.png);
    background-color:#4B5FA2;
}
.quick_menu li:nth-of-type(2) span{
    background-image:url(../img/icon/quick_menu2.png);
    background-color:#F5C61D;
}
.quick_menu li:last-of-type span{
    background-image:url(../img/icon/quick_menu3.png);
    background-color:#F5C61D;
}


/* chg_thema 테마바꾸기 */
.chg_thema{
    position: fixed;
    top: 20vh;
    right: 0;
    width:35px;
    height:35px;
    background: url(../img/icon/chage_thema.png) #fff no-repeat center;
    border-radius:5px 0 0 5px;
    -webkit-box-shadow: -2px 0px 10px 0px rgba(0,0,0,0.05);
    -moz-box-shadow: -2px 0px 10px 0px rgba(0,0,0,0.05);
    box-shadow: -2px 0px 10px 0px rgba(0,0,0,0.05);
    cursor: pointer;
    background-size:18px;
}
#night .chg_thema{
    background-color: #202028;
    border: 1px solid rgb(255,255,255,.1);
    background-image:url(../img/icon/chage_thema_night.png);
}









@media (min-width:576px){
  /* footer */
  footer{font-size:0.9em;}

  .contents_div {min-height: 55vh;}

  .page_copyright .col-xs-12{padding-left:0px; padding-right:0px;}


}



@media (min-width:768px){

    .br_span{display:block;}
    .m_view{display: none;}
    .pc_view{display: block;}

    /* gnb */
    .gnb_wrap {width: 720px; margin:auto;}

    .contents_div {padding: 40px;}
    .right_contents>h3{padding:25px 50px;}

    .contents_wrap{font-size:16px;}

    .br_m{display:inline;}


    /* quick_menu */
    .quick_menu>p{
      background:url(../img/icon/quick_menu1.png) #4B5FA2 no-repeat 17px center;
      font-size:18px;
      padding:15px 20px 12px 50px;
      -webkit-background-size:28px;
      background-size:28px;
      width:140px;
    }



}





@media (min-width:992px){

    .container{padding-top:0px;}
    .default_margin{margin-bottom: 110px;}

    .main{position: relative; padding:0;}
    .gnb, .log_wrap, .logout_wrap{display: block;}
    .gnb ul, .gnb li{list-style:none; padding:0; margin: 0;}
    .gnb_bg{
      display: none;
      background: #fff;
      position:absolute;
      width:100%;
      height:190px;
      left:0;
      top:96px;
      border-top: 1px solid rgba(0,0,0,0.1);
    }
    .gnb_wrap{width:960px; margin:auto; padding-top:25px;}
    .gnb_logo{display: block; width:120px; float: left; margin-right:15px;}
    .gnb_logo img{margin-top: 3px;}
    .gnb{float: left; padding-top: 12px;}
    .gnb_main>li{padding:0px 20px 35px; float: left; position: relative;}
    .gnb_main>li>a{z-index:1; position: relative;}
    .gnb_main ul{display: none; position:absolute; padding:80px 0 0; width:100%; top:0; left:0; transform: skew(-0.03deg);}
    .gnb_main ul li{font-size:0.9em; padding: 5px 0; text-align:center;}
    .logout_wrap{float: right; font-size: 0.95em; padding-top: 12px;}
    .logout_wrap a{margin-left: 20px;}
    .log_wrap a{padding-left: 20px;}
    .main .logout_wrap .fa{vertical-align:middle; display:none}
    .log_wrap{float: right; font-size: 0.95em; padding-left: 30px; text-align: left; margin-top: 13px;}
    /* .main .fa{width:16px; text-align:center; vertical-align: super;}
    .log_wrap>a{display: inline-block; width:49%;}
    .log_wrap span{display:inline-block; width:calc(100% - 20px); margin-left:2px; text-overflow:ellipsis; white-space:nowrap; word-wrap:normal; overflow:hidden; text-align: left;}  */
    /* .log_wrap a:link, .log_wrap a:visited{color:#ccc;} */
    .log_wrap a:first-child{border:none}

    .navbar-toggler{display:none;}
    .m_gnb_main{display:none;}
    .m_gnb_btn{display:none;}
    .dim{display:none;}

    /* footer */
    .foot_icon ul{justify-content: space-between;}
    .page_copyright p {
        float: right;
        margin-bottom: 0;
        margin-top: 0;
    }


    .contents_div{min-height:55vh;}



}




@media (min-width:1200px){

        /* 기본 */
        .fx_center{width:1100px;}

        /* gnb */
        .gnb_wrap{width:100%; position: relative; padding-left:50px; padding-right: 50px;}
        /* .gnb, .log_wrap, .logout_wrap {font-weight: 500;} */

        /* 서브페이지 기본 레이아웃 */
        .contents_wrap{width:1100px; }
        .default_margin{margin:60px auto 110px;}
        .contents_wrap::after{content:''; display:block; clear: both; overflow: hidden;}




}






/* 익스 */

/* IE9,10 */
@media screen and (min-width:0\0) and (max-width:992px){

  /* trade */
  .container section#T1{padding:0; padding-bottom:1px;}
  #T1 .inner{display: block;}
  .container #T1 .tradeType{padding-bottom:0; margin-bottom:11px;}

}


@media screen and (min-width:0\0) and (max-width:768px){

  /* trade */
  #T3 .table .tfoot .tr .td{flex:0 0 33.333%;}
  #T3 .table .tfoot :last-of-type.tr :nth-of-type(2).td{padding-right:0; margin-bottom:10px;}
  #T3 .table .tfoot :last-of-type.tr :nth-of-type(3).td{padding-left:0;}
  #T3 .table .tfoot :last-of-type.tr .td{flex: .5 .5 100%;}


}












/* night */
#night{color:#fff; background:#19191f!important;}
#night a:link, #night a:visited {color: #fff;}
#night table th{ background: #2b2b33;}
/* #night table tr:hover th{background:#2b2b33;} */
#night tr:hover td{background: #2b2b33; }
#night table *{transform:none; }
#night .btn_gray{background: #36363d;}
#night .btn_gray:hover{background: #2b2b33;}
#night input{background:rgba(255,255,255,0); color:#dfdfdf;}
#night select{color:#dfdfdf;}
#night option{color:#333;}
#night input[type=button]{background: #2b2b33;}

#night .main {background: #141419; box-shadow:none;}

#night .m_gnb_main{background: #141419;}

#night footer {background: #202028;}

#night .right_contents>h3{background: #202028;}
#night .contents_div{background: #202028;}
#night .contents_div h4 {color: #fff;}


#night .quick_menu i{color: #333;}
#night .quick_menu a:link, #night .quick_menu a:visited{color:#333}

#night #fsModaldoc{
    color:#333;
}




@media (min-width: 992px){
    #night .gnb_bg {background: #141419;}
}


@media (min-width:1200px){

}





@media (min-width:992px) and (max-width:1199px){
  .gnb_wrap{width:calc(100% - 50px); font-size:0.9em; position: relative;}
  .gnb_logo {margin-right: 0;}
  .gnb {padding-top:14px;}
  .log_wrap {padding-left: 15px; height: 45px;}
  .gnb_bg{top:95px; height: 145px;}
  /* .log_wrap>a {margin-left:10px;} */
  .gnb_main>li {padding: 0px 13px 35px;}
  .gnb_main ul {padding: 75px 0 0;}
  .i_border {height: 16px;  width: 16px; top: 5px;}
  .i_border i{font-size: 10px; bottom: 5px;}


}




/*----기존--*/