/*reset*/

@charset "utf-8";


* { margin: 0; padding: 0; box-sizing: border-box; }
ul, li { list-style: none; }

a { text-decoration: none; color: #333; }                                                              

.clearfix:after { content: ""; display: block; clear: both; }


/* +++ Use Only this project +++ */


 ::-webkit-scrollbar { display: none; }

@import url('https://fonts.googleapis.com/css2?family=Roboto&display=swap');

/*****웹 폰트*****/
@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@800&display=swap');



html {
  height:100%;
  font-family: -apple-system, system-ui, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif;
}

.raleway{font-family: 'Raleway', sans-serif; line-height:22px;}
   /*타이틀*/
   .titfont{font-size: 1.5em; color:#373737}



@import url('https://fonts.googleapis.com/css2?family=Roboto&display=swap');
.Roboto{
  font-family: 'Roboto', sans-serif;
}

@import url('https://fonts.googleapis.com/css2?family=Open+Sans+Condensed:wght@700&display=swap');
.opensans{
    font-family: 'Open Sans Condensed', sans-serif;
}


*{
   -webkit-border-radius: 0;

}    
html { -webkit-text-size-adjust: none; -moz-text-size-adjust: none; -ms-text-size-adjust: none; }


input {
    font-family: 'Noto Sans KR', sans-serif;
    /*ios대응*/
    -webkit-appearance: none;
    -webkit-border-radius: 0;
    -moz-appearance: none;
    -moz-border-radius: 0;
}

textarea {
  -webkit-appearance: none ; 
}



input[type="checkbox"] {
  -webkit-appearance: checkbox; /* Chrome, Safari, Opera */
  -moz-appearance: checkbox;    /* Firefox */
}


input[type='button']{-webkit-appearance:button;}
input[type='checkbox']{-webkit-appearance:checkbox;}
input[type='radio']{-webkit-appearance:radio; -webkit-appearance:checkbox;}
input{
    font-family:inherit !important;
}

input[type=text], input[type=password], input[type=tel] {
    line-height: 20px !important;
    font-size:1em;
    /*height: 22px;*/
}

select::-ms-expand {
    display: none;
}


select{
    /*ios대응*/
    -webkit-appearance: none;
    -moz-appearance: none;
   -webkit-appearance: none;
    font-size:1em;
    background-image: url(/common/image/selectarrow.png) ;
    background-repeat:no-repeat;  
    background-size:15px 7px;
    background-position:132px 15px;
}


option{
    font-size:13px;
    word-wrap:break-word;
    word-break:break-word;
}



body {
    width: 100%;
    height: 100%;
    margin: 0;
    font-size: 14px;
    line-height: 1.25em;
    position:relative;
     -ms-overflow-style: none; 
     min-width:315px;
     background:#F9F9F9;
     overflow:auto;
    -webkit-overflow-scrolling: touch; /* 추가 */

}

p {
    margin: 0;
    padding: 2px;
}

a {
    text-decoration: none;
    color: #1b1b1b;
    font-size: 1em;
}

ul {
    margin: 0;
    padding: 0;
    width: 100%;
}

li {
    list-style: none;
}

table {
    font-size: 14px;
    border-collapse: collapse;
}
.fl{
    float: left;
}

.wrap {
    width: 100%;
    min-height: 100%;
    margin-left: auto;
    margin-right: auto;
  
}

.wrap_c {
    width: 100%;
    height: 100%;
    margin-left: auto;
    margin-right: auto;
    background: #f9f9f9;
    overflow:scroll;
    padding-bottom:22%;

}

.l_title {
    margin-top: 8px;
    margin-bottom:8px;
}

.ad_title {
    padding-left: 10px;
    border-bottom: 1.5px solid #0076be;
    padding-bottom: 10px;
    font-weight: bold;
}





/* 입력칸 인풋 */
.inform {
background: #FFFFFF;
box-sizing: border-box;
border-radius: 2px;
width: 100%;
margin-bottom:12px;
font-size: 1em;
box-sizing:border-box;
border:1px solid #C9C9C9;    
/*height: 16px;
line-height: 16px;*/
/*border: 1px solid #4f4f4f;*/
font-family: Roboto;
height:42px;
padding-left:10px
}

    .inform:focus {
        /*outline: 1px solid #090052;*/
        border:1px solid #2488FF;
        outline:none;
        font-family: Roboto;
    }

    .inform-style-1{
        width:100%;
        box-sizing:border-box;
        border: 1px solid #aaa;
        padding: 5px;
        margin-bottom: 7px;
        height:35px;
    }

.qna_tx {
    width: 95%;
    padding: 5px;
    margin: 6px 0;
    border: 1px solid #ececec;
    font-size: 1em;
}

.inform_chck {
    width: 57%;
    padding: 10px 5px 10px 14px;   
    border: 1px solid #ccc;
    font-size: 1em;
    float: left;
    margin-right: 1%;
  /*height: 16px;
    line-height: 16px;*/
}

    .inform_chck:focus {
        outline: 1px solid #eb254d;
    }

.selectbox {
    width: 94%;
    padding: 4.5px;
    font-size: 1em;
    margin-left: 15px;
    margin-bottom: 26px;
    border: 1px solid #4f4f4f;
    padding: 10px 5px 10px 14px;
}

.num {
    padding: 5px;
    width: 16%;
    height:20px;
    border: 1px solid #ccc;
    text-align: center;
}
.datewrap{
    margin:11px 0 18px 7px;
}
.datepicker {
    width: 30%;
    padding: 10.5px 7px;
    border: 1px solid #aaaaaa;
    float: left;
    text-align:center;
    box-sizing:border-box;

}


.inform_add {
    width: 40%;
    padding: 10px;
    margin: 0 4px 0 0;
    border: 1px solid #ccc;
    font-size: 1em;
    /*border: 1px solid #4f4f4f;*/
}

/* 사이드바 css  */
.sidenavBg{
      height: 100vh;                                  
      height:100%;
      width: 100%;
      display:none;
      background-color:rgba(0, 0, 0, 0.6);
      z-index: 2; 
      overflow: auto; 
      position: fixed;
 
}

.sidenav {
    height: 100%;
    height:100vh;
    width: 100%;
    position: fixed;
    z-index: 999;
    top: 0;
    left:100%;
    background:#FFFFFF;
    overflow-x: hidden;
    transition: 0.5s;
    box-sizing:border-box;

}

.sidenav.hidden{
  left:0%;
}


.side-bg{
     padding:8px;
     position:relative;
     background:#FFFFFF;
     margin-top:10px;

}

.sidemenu p{
    margin-top: 8px;
    cursor:pointer;
    color:black;
    margin-bottom:10px;
}


    .sidemenu p span {
        vertical-align: middle;
        margin-left:10px;
        display:inline-block;
       margin-top:-22px;
    }




.sidemenu_btm {
    padding-top: 5%;
    padding-right: 0;
}

.sidenav a {
    height: 5%;
    padding-bottom: 5%;
    text-decoration: none;
    font-size: 1em;
    color: #fff;
    display: block;
    transition: 0.3s;
}
.logbtn{
 color:#FFFFFF;
 background:none;
 border:none;
 font-size:inherit;
 padding:0;
 margin:-2px;

}


.Username {
    font-size:15px;
    /*border-top:1px solid rgba(255,255,255,0.5);*/
    padding-top:4px;
    margin-top:0 !important;
}


.Username span{
    font-size:18px;
}


.logoutwrap{ display:flex;
             color:#FFFFFF;
             padding:6px 12px;
             position:relative;
}
.logoutwrap input{
    color:#FFFFFF;
    margin-right:10px;
    position:relative;
    left:70%;
}

.logoutwrap >div{
      background:url(/common/image/icon/logout.svg?ver2) !important;
    top:-12px;
    position:relative;
    left:20%;
    top:-2px;
}


    /*.sidenav a:
         {
        color: #ddd;
    }*/

.namewrap {
min-width:240px;
width:100%;
padding-top:10px;
padding-bottom:10px;
color:#FFFFFF;
font-size:1em;
/*background:#0383db;*/
position:relative;
display:inline-block;
background:linear-gradient(157deg,#0fb172,  #00a2fd);
background:-webkit-linear-gradient(157deg,#0fb172,  #00a2fd);
background:-moz-linear-gradient(157deg,#0fb172,  #00a2fd);
background:-o-linear-gradient(157deg,#0fb172,  #00a2fd);
background:-ms-linear-gradient(157deg,#0fb172,  #00a2fd);
padding:3%;
text-align:center;
}
.namewrap>p {
font-size:1.1em;
font-weight:400;
margin-top:6px;        
}
.namewrap>p span {
font-weight: bold;
}

.sidenav .closebtn {
    position: absolute;
    right: 5%;
    color: #FFFFFF;
    font-size: 3em;
    padding: 0;
    z-index:99;
    width:32px;
    height:32px;
    top:22px;  
}

.closebtn span{
    display:inline-block;
    background:#FFFFFF;
    height:3px;
    border-radius:10px;
    width: 26px;
    position:absolute;

}
.closebtn span:first-child{
    transform:rotate(-45deg);
    bottom:15px;
    left:8%;
}

.closebtn span:last-child{
    transform:rotate(45deg);
    bottom:15px;
    left:8%;
}


.cscenter:before{
    content:'';
    display:block;
    width:120%;
    position:relative;
    left:-30px;
    height:12px;
    background:#eaeaea;
    margin-top:16px;
    margin-bottom:16px;
}



.cscenter h2 {
font-size: 1.5em;
position:relative;
display:block;
width:100%;
}



/* 메인 css  */

#main {
    width: 100%;
    height: 100%;
}

.progress{
    display:none;
}
.topmenu {
    width: 100%;
    padding: 5px 0 2px;
    display:block;
    min-width:300px;
    height:60px;
    position:relative;
    color:black ;
    background:#0065E0;
    /*box-shadow:3px 2px 4px rgba(0,0,0,0.2)*/
}


/*.topmenu:after{
    content:'';
    display:block;
    position:absolute;
    width:100%;
    height:5px;
    bottom:0;
    background:linear-gradient(to right,#2488FF, #45BF8E);
    background:-webkit-linear-gradient(#2488FF, #45BF8E);
    background:-moz-linear-gradient(#2488FF, #45BF8E);
    background:-o-linear-gradient(#2488FF, #45BF8E);
    background:-ms-linear-gradient(to right,#2488FF, #45BF8E);

}*/




        .topmenu span::after, .topmenu span:active {
            text-decoration: none;
        }

 /*.top_logo img{
   width:25%; 
   left:50%;
   position:relative;
   transform:translateX(-50%) !important;
 }*/

/*.top_logo {
    text-align: center;
    float: right;
    width: 38px;
    height:38px;
    background-color:#FFFFFF; 
    position:relative;
    border-radius:50%;
    box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.25);
    left:-10px;
    top:25px;
}*/

.top_logo img{
 width:100px;
 position:absolute;
 left:53%;
 top:52%;
 transform:translate(-55%, -50%);
 -webkit-transform:translate(-55%, -50%);
 -moz-transform:translate(-55%, -50%);
 -o-transform:translate(-55%, -50%);
}


.contant_wrap {
    width: 100%;
    height: 100%;
    min-width:315px;
    padding-bottom:24%;
    padding-top:5px;
    background:#f9f9f9
}

.contants {
    width: 100%;
    height: 100%;
    margin: 0 auto;
    text-align: center;
}

    .contants h2 {
        font-size: 1.6em;
        font-weight: bold;
        color: #0076be;
        margin-bottom: 10px;
        margin-top: 15px;
    }

    .contants h4 {
        font-size: 0.9em;
        font-weight: bold;
        text-align: left;
        /*padding-left: 13px;*/
        margin: 0;
    }
    .contants2{
      width: 100%;
    height: 100%;
    margin: 0 auto;
    text-align: center;
}
@media screen and (max-height: 450px) {
 
        .sidenav a {
            font-size: 2em;
        }
}

.charge_wrap {
    margin: 0 auto;
    position:relative;
     /*margin-left:20px;
     margin-right:20px;*/
     padding-left:3%;
     padding-right:3%;
     padding-top:12px
}

    .charge_wrap h4 {
        margin-bottom: 10px;
    }
    
    


.title {
    color: #333333;
    text-align: center;
    font-size:1.4em;
    font-weight:600;
    padding-left:3%;
    margin:14px 0px;
    
}



.imgcontainer {
    padding-top: 6%;
    /*padding-bottom:5%;*/
    text-align: center;
    background:#FFFFFF;
    padding-bottom:20px;
    position:relative;
}

.imgcontainer:after{
    content:'';
    width:100%;
    height:5px;
    background:linear-gradient(to right,#45BF8E,#2488FF);
    position:absolute;
    left:0;
    bottom:0;
    
}


    /*.imgcontainer img {
        width: 45%;
    }*/

.inform-wrap {
    text-align: center;
    padding-left:3%;
    padding-right:3%;
    margin-left: auto;
    margin-right: auto;

}

.phone_num {
    margin-bottom: 15px;
    margin-left: 15px;
    color: #0076be;
    font-weight: bold;
}
/* 결제페이지 */
.result_wrap {
    padding-left:20px;
    padding-right:20px;
    text-align: center;
}
                                          
    .result_wrap p {
        margin-bottom: 10px;
    }
    .disin{                                                                                                                                                                                                     
    display:inline-block;
    width:100%;
    margin-top: 50px;
    padding-top: 10px;  

 
}



/* 버튼모음 */
.checkbtn {
    width: 33%;
    color: #fff;
    background-color: #f9ae33;
    padding: 9px 0;
    font-size: 1em;
    border: 0;
    border-radius:4px;
    height:42px;
    text-align:center;
}

.checkbtn_c {
    width: 29%;
    color: #fff;
    background-color: #0076be;                                                             
    padding: 9px 0;
    font-size: 0.85em;
    border: 0;
    height:43px;
    text-align:center;
}

.longbtn {
    width: 100%;
    padding: 10px;
    height:42px;
    box-sizing:border-box;
    margin: 10px 0;
    color: #fff;
    font-weight: bold;
    font-size: 1em;
    border: 0;
    outline: 0;
    cursor: pointer;
    -webkit-appearance:button;
    border-radius:4px;
    background: #26217C;
    box-sizing: border-box;
    /*box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);*/

}


.longbtn_g {
    width: 100%;
    height:42px;
    box-sizing:border-box;
    padding: 15px 10px;
    margin: 14px 0;
    font-weight: bold;
    font-size: 1em;
    border: 0;
    outline: 0;
    cursor: pointer;
    background: #26217C;
border: 1px solid #FFFFFF;
box-sizing: border-box;
    
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
}

.longbtn_w {
    width: 100%;
    padding: 10px 10px;
    margin: 14px 0;
    background-color: #2488FF;
    color: #fff;
    font-weight: bold;
    font-size: 1em;
    border: 0;
    outline: 0;
    cursor: pointer;
    height:42px;
    box-sizing:border-box;

    box-sizing: border-box;
    border-radius: 4px;
     box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
}
.findBtn{
    width: 48%;
    padding: 10px 10px;
    background-color: #d6d6d6;
    color: #2d2c2c;
    font-weight: bold;
    font-size: 1em;
    border: 0;
    outline: 0;
    cursor: pointer;
    float:left;
    box-sizing:border-box;
    margin-right:4px;
    padding:2px;
}



.deleteBtn {
    width: 48%;
    padding: 10px 10px;
    background-color: #d6d6d6;
    color: #2d2c2c;
    font-weight: bold;
    font-size: 1em;
    border: 0;
    outline: 0;
    cursor: pointer;
    float:left;
    margin-left:4px;
}

.longbtn_p {
    width: 100%;
    padding: 10px 10px;
    margin: 14px 0;
    background-color: #d6d6d6;
    color: #909090;
    font-weight: bold;
    font-size: 1em;
    border: 0;
    outline: 0;
    cursor: pointer;
}

.charge_btn {
    width: 100%;
    padding: 20px;
    margin: 8px 0;
    background-color: #e8e8e8;
    color: #3e3e3e;
    font-size: 2em;
    border: 0;
    outline: 0;
    cursor: pointer;
}

.joinbtn {
    width: 47%;
    padding: 10px;
    margin-bottom: 14px;
    background-color: #0076be;
    color: #fff;
    font-weight: bold;
    font-size: 1em;
    border: 0;
    outline: 0;
    cursor: pointer;
}

.joinbtn_g {
    width: 47%;
    padding: 10px;
    margin-bottom: 14px;
    background-color: #e8e8e8;
    color: #909090;
    font-weight: bold;
    font-size: 1em;
    border: 0;
    outline: 0;
    cursor: pointer;
}


.btncolor{
    border-radius:4px;
    height:42px !important;
}

/* 프로세스 css 시작*/
.step {
    width: 100%;
    margin-bottom: 25px;
}

.progressbar {
    counter-reset: step;
    padding: 0;
    height: 70px;
}

.progressbar li {
color: #bebebe;
font-size: 16px;
list-style-type: none;
float: left;
width: 25%;
position: relative;
text-align: center;
}

.progressbar li:before {
content: counter(step);
counter-increment: step;
width: 40px;
height: 40px;
line-height: 40px;
border: 2px solid #bebebe;
display: block;
text-align: center;
color: #bebebe;
margin: 0 auto 10px auto;
border-radius: 50%;
background-color: #fff;
}

.progressbar li:after {
content: '';
position: absolute;
width: 100%;
height: 2px;
background-color: #bebebe;
top: 20px;
left: -50%;
z-index: -1;
}

.progressbar li:first-child:after {
content: none;
}

.progressbar li.active {
font-weight: bold;
color: #e24406;
}

.progressbar li.active:before {
border-color: #eb254d;
background-color: #eb254d;
color: #fff;
}

.progressbar li.active + li:after {
background-color: #eb254d;
}

.progressbar li.end:before {
border-color: #e24406;
background-color: #e24406;
color: #fff;
}

.progressbar li.end + li:after {
background-color: #e24406;
}

/* 프로세스 css 끝*/

/* 조회 테이블(가로제목 테이블) */
.charge_tb {
    /*border-top: 1px solid #757575;*/
    width: 100%;
    margin-top: 10px;
}

    .charge_tb tr {
        border-bottom: 1px solid #bdbdbd;
        font-size: 1em;
    }

        .charge_tb tr th {
            padding: 10px 5px;
            /*width: 35%;*/
        }

        .charge_tb tr td {
            padding: 15px 0px 15px 0px;
            text-align: center;
        }


/* 선이 다 있는 테이블 */

.payinfo_tb {
    width: 100%;
}

    .payinfo_tb tr th {
        background-color: #f5f5f5;
        border: 1px solid #a7a7a7;
        padding: 10px 5px;
        width: 33%;
        text-align: center;
    }

    .payinfo_tb tr td {
        border: 1px solid #a7a7a7;
        padding: 10px 25px;
        text-align: left;
    }

/* admin 테이블 배경색 없는거 */
.write_tb {
    width: 100%;
    margin-bottom: 20px;
    table-layout:fixed;
}




    .write_tb tr:nth-of-type(1){
        background:#EDF1F2;

    }

        .write_tb tr th {
            padding: 10px 5px;
            /*width:30%;*/

        }

        .write_tb tr td {
            padding: 10px 10px 10px 20px;
            /*text-align:left*/
        }


/* admin 테이블 배경색 다른거 */
.write_tb2 {
    width: 100%;
    margin-bottom: 20px;
}

    .write_tb2 tr {
        border-top: 1px solid #a7a7a7;
        border-bottom: 1px solid #a7a7a7;
    }

        .write_tb2 tr th {
            background-color: #e7eaeb;
            padding: 10px 5px;
            width: 30%;
        }

        .write_tb2 tr td {
            padding: 10px 10px 10px 20px;
            text-align: left;
        }

        /* 위제목 고정 테이블*/
.write_tb3 {
    width: 100%;
    margin-bottom: 20px;
    border-spacing:0;
    box-sizing:border-box;   
}

.write_tb3 tbody{
      width:calc(100% - 1px);
       display:inline-table;
}

        .write_tb3 tr th {
            background-color: #f5f5f5;  
            padding:7px 4px;
            border: 1px solid #a7a7a7;
            font-size:12px;          
        }
        .write_tb3 tr th.title1, .write_tb3 tr td:nth-child(1) {
            width:46%;
        }
          .write_tb3 tr th.title2, .write_tb3 tr td:nth-child(2){
              width:16%;
          }
          
            .write_tb3 tr th.title4, .write_tb3 tr th.title5, .write_tb3 tr td:nth-child(3), .write_tb3 tr td:nth-child(4){
              width:19%;
          }           

        .write_tb3 tr td {
            padding: 7px 4px;
           border: 1px solid #a7a7a7;
           text-align:right;
        }
               .write_tb3 tr td:nth-child(1){
            text-align:left;           
        }

.write_tb5{
    width:100%;
}

.write_tb6{
    width:100%;
}

/* 와이브로 메인 버튼 부분 */


 /**********메뉴 공통 적용 스타일*******/ 


.wibro_wrap {
   width:100%;
   clear:both; 
   display:block;
   margin-top:50px;
}

    .menu_list a {
       color: #000000;
       margin-left:30px;
       margin-top:10px;
       display:block; !important
    }

    .menu_list li {
        list-style: none;
        height: 70px;
        width: 80%;
        display:inline-block;
        margin-bottom:20px;
        color: #000000;
        font-size: 1em;      
        margin-left:auto;
        margin-right:auto;
        background: #FFFFFF;
        border-top:1px solid #EFEFEF;
        border-left: 1px solid #EFEFEF;
        box-sizing: border-box;
        box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
        border-radius: 7px;
        overflow:hidden;
        position:relative;
        cursor:pointer;
    }



    .menu_list img {
        margin-bottom: 10px;
    }

  /**************메뉴 텍스트**********/
   .title6{
       color:#111111;
       margin-top:10px;
       margin-bottom:4px;
       font-size:1.055em;
       font-weight:500;
      
       
   }


  /*******아이콘 이미지 추가*********/

  .topup_icon{
     width: 34px;
     height:40px;
     background:no-repeat;
     float:left
  }


.topup_icon ~ p{
    float:left;
    margin-top:8px;
    margin-left:5px;
    font-size:1em;
    font-weight:400;
} 







/* 설정 리스트 부분 */
.admin_list li {
    padding: 15px 20px;
    border-bottom: 1px solid #e8e8e8;
}

    .admin_list li i {
        font-size: 1.3em;
        color: #033752;
        margin-right: 10px;
    }

.ans {
    display: none;
    background: #f7f7f7;
    text-align: left;
}

    .ans td {
        padding: 10px 25px !important;
    }


.icon2 {
    font-size: 1.3em;
    margin-right: 15px;
    color: #033752;
}

/*로딩*/
.mloader {
    width:100%;
    position: absolute;
    background-color: #f7f7f7 !important;
    opacity: 0.6;
    display: none;
    font-size: 20px;
    font-weight: bold;
    z-index:5;
    top:0;
    left:0;
}

    .mloader .masterkey_blink {
        text-align: center;
        -webkit-animation: masterkey_blink 3s linear infinite;
    }

@-webkit-keyframes masterkey_blink {
    15% {
        color: white;
        /*color: #eb254d;*/
    }

    40% {
        color: black;
        /*color:  #f9ae33;*/
    }

    75% {
        color: white;
        /*color: #fff;*/
    }
}


/*돌아가는 큰 로딩*/
@import url(https://fonts.googleapis.com/css?family=Roboto:100);

.mloader2 {
    position: absolute;
    background-color: #dce6ef !important;
    opacity: 0.6;
    display: none;
    
}

.bigLoader {   
    margin-left: 5px;
    width: 80px;
    height: 80px;
    border: 8px solid #eb254d;
    border-radius: 50%;
    border-top-color: #f9ae33;
    animation: spin 1s ease-in-out infinite;
    -webkit-animation: spin 1s ease-in-out infinite;
    display: none;
      position: absolute;
    top: 45%;
    left: 37%;  

}

@keyframes spin {
    to {
        -webkit-transform: rotate(360deg);
    }
}

@-webkit-keyframes spin {
    to {
        -webkit-transform: rotate(360deg);
    }
}



/* 구직 부분 css */
.btn-style-2{
       width: 48px;
    color: #fff;
    background-color: #909ba2;
    padding: 2px 5px;
    border: 0;
    height: 30px;
    font-size:13px;
    margin-top: 5px;
    margin-left:10px;
}

.card{
    width:270px;
    margin-top: 8px;
}

/* 페이징 css */
#paging a{
  text-decoration: none;
        color: #444444;
       padding: 2px 9px;       
       font-size: 14px;
     
}


/*버튼스타일*/

.btnWrap {
position:relative;
display:block;
margin-top:20px;
}

.btnWrap:after{
    content:'';
    display:block;
    clear:both;
    visibility:hidden;
}


.btnWrap input{
    width:49%;
  
}
.btnWrap input:nth-child(1){
    margin-right:2%;
    float:left;
}



.btnWrap input:nth-child(2){
  float:right;
}

.btnBlue {
background: #2488FF;
box-sizing: border-box;
position:relative;
border-radius:4px
/*box-shadow:4px 4px 8px rgba(194,194,194,0.8), -4px -4px 10px #ffffff, 0px 0px 15px #ffffff;*/
}

.btnWhite{
   background-color:#FFFFFF;
   color:#4A4A4A;
   box-sizing:border-box;
   border:1px solid #2488FF;
   /*box-shadow:4px 4px 8px rgba(194,194,194,0.8), -4px -4px 10px #ffffff, 0px 0px 15px #ffffff;*/

}

.menutxt{
font-style: normal;
font-weight: 800;
font-size: 2.3em;
line-height: 49px;
letter-spacing: -0.015em;
font-family: 'Roboto', sans-serif;
margin:0 auto;
color:#272727; 
margin-top:7%;
text-align:left;  
width:80%;
}

.box_h{
  height:52px !important;
}




.del{
    display:none !important;
}

.inline{
    display:inline-block;
}

/*mypage부분 공통 css*/

.profilebtn{
  width:100%;
  color:#ffffff;
  height:42px;
 box-sizing: border-box;
 box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
}


.sidemenu_top{
  background-color:transparent;
}
.sidemenu{
 background-color:transparent;
 position:relative;
}





/*******************인풋박스 스타일********************/

 .ipbox input[type="text"]{
   width:100%;
   height:42px;
   background: #FFFFFF;
   border: 1px solid #090052;
   box-sizing: border-box;
   border-radius: 4px;
} 

 .selecbx{
    height:42px;
    width:100%;
    border: 1px solid #c9c9c9;
    border-radius: 4px;
    padding-left:10px;
    word-break:keep-all;
    white-space:pre-wrap;
    font-size: 1em;
    background-image: url(/common/image/selectarrow.png);
 }

 .selecbx option{
    word-break:keep-all !important;
    white-space:pre-wrap !important;

 }


 .boxst{
     border: 1px solid #090052;
      border-radius: 4px;
 }

 .sidemenu_inner{font-size:1em; }
 .sidemenu_inner p > i { background:url(/common/image/icon/navicon.png) no-repeat;margin-right:10px; display:inline-block; width:24px; height:24px; position:relative; background-size:cover !important;}
 
 .sidemenu_inner span { position:relative;margin-left:2px !important; font-size:16px;}
                                                        
 /********************************사이드 메뉴 아이콘********************************************/
/*.sidemenu_inner p:nth-of-type(1) i{background-position-x:-75px}
.sidemenu_inner p:nth-of-type(2) i{background-position-x:-152px}
.sidemenu_inner p:nth-of-type(3) i{background-position-x:-125px}
.sidemenu_inner p:nth-of-type(4) i{background-position-x:-171px}
.sidemenu_inner p:nth-of-type(5) i{background:url(/common/image/icon/navadd.png); background-size:cover;}
.sidemenu_inner p:nth-of-type(6) i{background-position-x:-101px}
.sidemenu_inner p:nth-of-type(7) i{background-position-x:-49px}
.sidemenu_inner p:nth-of-type(8) i{background-position-x:-49px}
.sidemenu_inner p:nth-of-type(9) i{background-position-x:-193px; background-position-y:1px}

.sidemenu_inner p:nth-of-type(10) i{background-position-x:-193px; background-position-y:1px}
.sidemenu_inner p:nth-of-type(11) i{background:url(/common/image/icon/refundicon.png); background-size:cover;}*/


   
   
   /***********포지션 **********/
   
   .po_re{position:relative;}
   .po_ab{position:absolute;} 
   .right{right:0;}
   .left{left:0;}

   /*버튼두개 스타일*/
.inputbtnst {position:relative; margin-left:auto; margin-right:auto; width:88%; height:80px; margin-top:20px;}
.inputbtnst input {
 width:47%;
 position:absolute;
 margin-left:auto !important  ;
 margin-right:auto !important  ;
}

.inputbtnst input:nth-of-type(1) {
left:0;
top:-1px
}

.inputbtnst input:nth-of-type(2) {
right:0;
}

 /*버튼사이즈*/

 .btncenter{
     display: block;
    width: 85%;
    margin-left: auto;
    margin-right: auto;
 }

   /*************버튼사이즈*****/
   .btnwid{ width:47% !important;}


   /* 페이지 별  topmenu 스타일*/

  

   /*select 박스 스타일*/
   .inquiry_box{
   height:32px;
   box-sizing:border-box;
   display:flex;
   border-radius:4px;
   padding-left:3%;
   padding-right:3%;
   } 
 
  .inquiry_box select ,.inquiry_box input{ padding-left:10px; padding-right:10px; box-sizing:border-box;}


    
    
    
    /*계좌번호 입력 작은 화면 미디어쿼리*/

    @media screen and (max-width:357px){
        .num_wrap{margin-left:0 !important;}
        .num{width:14.9%;}
    }



    
.tableline tr{
    border-bottom:1px solid #DADADA !important;
}


.tableline th{
  border-bottom:1px solid #DADADA !important;
}

#cardBirth{
    margin-left:2px;
}
     

.maintit{
    font-size:24px;
    margin:8px 0 ;
    font-weight:500;
    text-align:center;
}


.ptbtn{
    box-shadow: inset 0px 1px 0px 0px #ffffff;
    background: linear-gradient(to bottom, #f9f9f9 5%, #e9e9e9 100%);
    background-color: #f9f9f9;
    border-radius: 6px;
    border: 1px solid #c2c2c2;
    display: inline-block;
    cursor: pointer;
    color: #666666;
    padding: 6px 24px;
    text-decoration: none;
    text-shadow: 0px 1px 0px #ffffff;
}


.whitespace{
    padding-left:20px;
    padding-right:20px;
}

.bgwhite{
    background:#FFFFFF;
}


.clearfix:after{
   content:'';
   display:block;
   clear:both;
   visibility:hidden; 
}

.main_nav{
    padding:2px;
    width:32px;
    height:32px;
    position:absolute;
    right:3%;
    top:50%;
    transform:translateY(-50%);
    -webkit-transform:translateY(-50%);
    -moz-transform:translateY(-50%);
    -o-transform:translateY(-50%);
}


.setWrap{
    width:96%;
    display:inline-block;
    margin-top:16px;
}

.setWrap:after{
    content:'';
    display:table;
    clear:both;
    visibility:hidden;
}

.setWrap span{display:none;}
.setWrap p{display:inline-block; float:left;   width:36px;
    height:36px;
}
.setWrap p i{
    width:24px;
    height:24px;
    display:inline-block;
    margin-right:20px;
    background:url(/common/image/icon/navicon.png) no-repeat;
    background-size:cover;
    padding:5px;
    box-sizing:border-box;
   
}
.setWrap p:nth-of-type(1) i {
background-position-x:-26px;
background-position-y:1px;
}

/*.setWrap p:nth-of-type(1) i {
background-position-x:2px;
background-position-y:1px;

}*/



.nav_btn {
    width:24px;
    height:20px;
    position:relative;
    left:50%;
    top:50%;
    transform:translate(-50%,-50%);
    -webkit-transform:translate(-50%,-50%);
    -moz-transform:translate(-50%,-50%);
    -o-transform:translate(-50%,-50%);

}

.nav_btn span {
    display:block;
    width:100%;
    height:2px;
    border-radius:6px;
    background:#ffffff;
    position:absolute;
  
}

.nav_btn span:nth-of-type(1){ top:0;}
.nav_btn span:nth-of-type(2){
    top:50%;
    transform:translateY(-50%) ;
    -webkit-transform:translateY(-50%) ;
    -moz-transform:translateY(-50%) ;
    -o-transform:translateY(-50%) ;
     -ms-transform:translateY(-50%) ;
   
}
.nav_btn span:nth-of-type(3){
  bottom:0;
}
 

.backbtn{
    display:inline-block;
    width:28px;
    height:26px;
    padding:4px;
    background:url(/common/image/icon/backbtn.svg) no-repeat;
    position:relative;
    left:3%;
    background-size:contain;
    top:12px;
}







.underline{
    position:relative;
    font-weight:600;
}
.underline:after{
    content:'';
    width:90px;
    height:6px;
    background:#56e3a6;
    display:block;
    position:absolute;
    bottom:2px;
    opacity:0.2
}

.price{
    margin-top:24px;
    border: 1px solid #c9c9c9;
    border-radius:6px;
    text-align:center;
    background:#FFFFFF;
}



.price span{
    font-size:28px;
    font-weight:600;
    line-height:60px;
        color: #26217C;
}



.logoutwrap input{left:60% ! important;}
.logoutwrap > div{ left:55% ! important;}

.sidebtnWrap{
    display:flex;
    margin-top:15px;
    padding-top:10px;
    text-align:center;
    word-wrap:break-word;
    word-break:keep-all;
}

.sidebtnWrap>div{
    flex:1;
}

.sidebtnWrap>div span{
   width:40px;
   height:40px;
   display:inline-block;
   background: rgba(255,255,255,0.2);
   border-radius:50%;

}

.sidebtnWrap>div span img{
    width:75%;
    position:relative;
}

.sidebtnWrap>div:nth-of-type(1)>span img{
    top:2px;
}

.sidebtnWrap>div:nth-of-type(2)>span img{
    top:1px;
    width:80%;
}

.sidebtnWrap>div:nth-of-type(3)>span img{
    top:5px;
    left:2px;
    width:66%;
}


.sidebtnWrap>div p{
    margin-top:2px;
    text-align:center;
}

/*조회버튼*/
.OpenList {
   width:25%;
   height:42px;
   display:inline-block;
   float:right;
        border: none;
    color: #FFFFFF;

}


/*.checkSaveCardno{position:absolute; right:10px; top:5px; }*/
/*.checkSaveCardno:before{
    content:'';
    display:inline-block;
    width:30px;
    height:30px;
    background:pink;
    margin-right:10px;
    background:url(/common/image/icon/cardcheck.png) no-repeat;
    background-size:cover;
    position:relative;
    top:-2px;
}*/
.checkSaveCardno input[type=checkbox]{
       width:16px;  
       height:16px;
}


.checkSave{
    margin-bottom:10px;
    padding-left:6px;
   
}


.checkSave span:nth-of-type(1){position:relative; top:2px;}
.checkSave span:nth-of-type(2){
    background:#ffffff!important;
    padding:2px;
    padding-left:6px;
    padding-right:6px;

    border:1px solid #aaaaaa;
    font-size:12px;
    border-radius:10px;
    color:#888888;
    display:inline-block;
    margin-left:6px;
}

.pagination .active{
  background:#0065E0;
  color:#ffffff !important;
}

/*달력*/

.calendar_wrap{ width:100%; text-align:left;}
.calendar {width:calc(50% - 10px);position:relative; display:inline-block;}
.calendar input{width:100%; text-align:left ;padding-right:0;position:relative;background:transparent;z-index:1}
.date2{position:absolute; right:6px; top:50%; transform:translateY(-50%); color:#999999}
.ui-widget-content{
    width:80%;
}

.ui-datepicker .ui-datepicker-header{
  background: linear-gradient(to right,#2488FF, #45BF8E);
  padding:10px;
  border-radius:0 !important;
  -webkit-border-radius:0 !important;
   
}

.ui-widget-header .ui-icon{
    background:url(/common/image/icon/arrow.svg) no-repeat;
    width:19px;
    height:24px;
    background-size:cover;
    background-position-x:-41px;
    background-position-y:2px;
    
}

.ui-datepicker td{
    padding:4px;

}
.ui-datepicker td a{
    padding:2px;
}


.ui-widget{
font-family: 'Heebo', sans-serif;
}

.ui-datepicker-next span {
 transform:rotateY(180deg) ;
}


.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight{
    border:none ;
    background:#eaeaea
}



.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active{
     border:1px solid#2488FF ;
    background:#318fff     ;
    color:#FFFFFF
}

.OpenList {
   width:100%;
   height:42px;
   
}

.tableline{
    margin-top:18px;
}

.ui-datepicker.ui-widget{
    top:168px !important;
    left:50% !important;
    transform:translateX(-50%);
    -webkit-transform:translateX(-50%);
    -moz-transform:translateX(-50%);
    -o-transform:translateX(-50%);
    -ms-transform:translateX(-50%);

}


/*모바일 날짜선택 anypicker*/


.calendar {
    height:40px;
    background:#FFFFFF;
    position:relative;
}

.calendar i{
    position:absolute;
    top:50% !important;
}

.date{
    border:none !important;
    width:100%;
    height:100%;
    display:inline-block;
}

    .ap-header{
        display: none;
    }
    .ap-header__title{
        display: none   ;
    }
    .ap-theme-default .ap-footer{

       padding:15px 0px; 
    }

    .ap-button-cont{
        width:100%;
        float: none !important;
    }

    .ap-button-cont a{
        margin: 0 !important;
    }

    .ap-button-cont a{
        display: inline-block;
    }

    .ap-button-cont a:nth-of-type(1){
        width:40%;
        background-color: #eaeaea;
    }
    .ap-theme-default .ap-footer{
padding-bottom: 0px;
    }

    .ap-button-cont a:nth-of-type(2){
background: #2488FF;
width:60%;
color: #FFFFFF !important;
    }


    .ap-component-selector{
        border-top: 1px solid #dddddd;
        border-bottom: 1px solid #dddddd;
    }
    .ap-theme-default .ap-button{
        color: #191919;
    }

    .ap-theme-default .ap-footer     {
        padding:0 !important
    }

    .ap-theme-default .ap-button{
        color:#333333 !important
    }
    .ap-button-cancel{
        color:#aaaaaa;
    }

    .ap-component-selector{
        border-top-color:#2488FF !important;
        border-bottom-color:#2488FF !important;
    }

   .ap-footer-bottom{
       margin-left:1px !important;
       margin-bottom:-1px !important;
   }



   #isTable{
       background:#FFFFFF;

   }

   #isTable tr:nth-of-type(1) {
       background-color:transparent !important;
   }


   .bottommenu {background: #F2F2F2; height: 50px; text-align: center;}
   .bottommenu p {padding-top: 15px;}