@CHARSET "UTF-8";

.txtVertical
{
	vertical-align : top;
}
@media screen and (min-width:1px) and (max-width:480px) {
    .wrapper{
        font-size : 1em;
    }
    .tpHidden{
        display : none;
    }
    .tphello{
        display : none;
    }

    .tpHome{
        display: none;
    }
/*     .mobilehidden{
       display: none;
    } */
    .dropdown{
        display : none;
    }
    .dt-buttons{
        display : none;
    }
    .dataTables_info{
        display : none;
    }
    

    input{
        font-size : 1em;
        margin-top : 2px;
        margin-bottom : 2px;
    }
    
    .usephone{
        display : block;
    }
    .useweb{
        display : none;
    }
    
    .sicon{
    width : 30px;
    height : 30px;
    margin-right : 1px;
    margin-left : 1px;
    vertical-align : middle;
    }
    
    .window{
        display: none;
        position:fixed;  
        top:50%;
        z-index:2;
        width : 100%;
        height : 400px;
        margin-top : -200px;
        overflow : auto;
        background-color : #FFF;
        border:2px solid #1F96C9;
    } 
    .windowH200{
	    display: none;
        position:fixed;  
        top:50%;
        z-index:2;
        width : 100%;
        height : 200px;
        margin-top : -200px;
        overflow : auto;
        background-color : #FFF;
        border:2px solid #1F96C9;
	}
	.window80{
		display: none;
        position:fixed;  
        top:50%;
        z-index:2;
        width : 100%;
        height : 400px;
        margin-top : -200px;
        overflow : auto;
        background-color : #FFF;
        border:2px solid #1F96C9;
	}
    .windowpad{
        display: none;
        position:fixed;  
        top:50%;
        z-index:2;
        width : 100%;
        height : 310px;
        margin-top : -200px;
        overflow : auto;
        background-color : #FFF;
        border:2px solid #1F96C9;
    }
    
    .windowd{
        display: none;
        position:fixed;  
        top:50%;
        z-index:4;
        width : 100%;
        height : 400px;
        margin-top : -200px;
        overflow : auto;
        background-color : #FFF;
        border:2px solid #1F96C9;
    }
    #clientresult{
        position : absolute;
        width: 100%;
        max-width : 250px;
        cursor : pointer;
        overflow-y : auto;
        max-height : 400px;
        box-sizing : border-box;
        z-index : 1001;
        background-color : #F5F7FA;
    }
    
  
.basis{
	flex-grow : 1;
	flex-basis : 90px;
}
.basispop{
	flex-grow : 1;
    flex-basis : 120px;
}

.mainbasis{
    flex-grow : 1;
    flex-basis : 20px;
}
.mainsearchbtn{
    text-decoration: none;
    display: inline-block;
    padding: 4px 5px 4px 5px;
    border-radius: 3px;
    line-height: 13px;
    height: 13px;
    background: #fff;
    border: 1px solid #ccc;
    color: #666;
}


	/* 로그 이미지 크기 조절 */
	#pulmuone_logo {
		width : 150px;
		height : 26px;
	}


}	
/* //(min-width:1px) and (max-width:480px)  */

@media screen and (min-width:481px) {
	
	

    .wrapper{
        font-size : 0.8em;
    }
    .tpHidden{
        display : none;
    }
    .dt-buttons{
        display : inline;
    }
    .dataTables_info{
        display: inline;
    }
    .usephone{
        display : none;
    }
    .useweb{
        display : block;
    }
    
    
    .sicon{
    width : 25px;
    height : 25px;
    margin-right : 2px;
    margin-left : 2px;
    vertical-align : middle;
    }
.window{
    display: none;
    position:fixed;  
    left:50%;
    top:50%;
    z-index:2;
    width : 40%;
    margin-left : -20%;
    height : 400px;
    margin-top : -200px;
    overflow : auto;
    background-color : #FFF;
    border:2px solid #1F96C9;
    font-size : 0.8em;
}
.windowH200{
    display: none;
    position:fixed;  
    left:50%;
    top:50%;
    z-index:2;
    width : 40%;
    margin-left : -20%;
    height : 200px;
    margin-top : -200px;
    overflow : auto;
    background-color : #FFF;
    border:2px solid #1F96C9;
    font-size : 0.8em;
}
.window80{
    display: none;
    position:fixed;  
    left:30%;
    top:30%;
    z-index:2;
    width : 80%;
    margin-left : -20%;
    height : 600px;
    margin-top : -200px;
    overflow : auto;
    background-color : #FFF;
    border:2px solid #1F96C9;
    font-size : 0.8em;
}
.windowpad{
    display: none;
    position:fixed;  
    left:50%;
    top:50%;
    z-index:2;
    width : 20%;
    margin-left : -10%;
    height : 310px;
    margin-top : -200px;
    overflow : auto;
    background-color : #FFF;
    border:2px solid #1F96C9;
}
.windowd{
    display: none;
    position:fixed;  
    left:50%;
    top:50%;
    z-index:4;
    width : 40%;
    margin-left : -20%;
    height : 400px;
    margin-top : -200px;
    overflow : auto;
    background-color : #FFF;
    border:2px solid #1F96C9;
}
#clientresult{
        position : absolute;
        width: 100%;
        max-width : 250px;
        cursor : pointer;
        overflow-y : auto;
        max-height : 400px;
        box-sizing : border-box;
        z-index : 1001;
        background-color : #F5F7FA;
    }
.basis{
    flex-basis : 150px;
}
.basispop{
	flex-basis : 80px;
}

.basispop120{
	flex-basis : 120px;
}
.mainsearchbtn{
    text-decoration: none;
    display: inline-block;
    padding: 4px 10px 6px 10px;
    border-radius: 3px;
    line-height: 13px;
    background:#fff;
    border:1px solid #ccc;
    color:#666;
}

}
/* @media screen and (min-width:481px) */

/* --------------------전체 속성 지정 시작 */
* { 
    /* color : #555; */
    margin: 0;
    padding: 0; 
    cursor: pointer;
}

body {
    font:Malgun Gothic, Verdana, Sans-serif;
    color : #5A738E;
    overflow-x:hidden;
    height : 100%;
}
html{
    height : 100%;
}

li {
    list-style: none;
}
.gContent > li {
    overflow:hidden;
     word-wrap:break-word;
}

p{
    overflow : hidden;
    word-wrap: break-word;
    word-break: break-all;
}

a{
    /* overflow : hidden; */
    text-decoration: none;
}
table{
	width : 100%;
}
/* .gTitle > li {
    overflow:hidden;
     word-wrap:break-word;
} */

/* .scol > input{
    overflow:hidden;
    word-wrap:break-word;
} */
 .scol{
    /* overflow:hidden; */ /* 콤보박스 3개 연달아 있을때 내려가게 하기 위함 */
    word-wrap:break-word;
} 
 .icol{
    /* overflow:hidden; */
    word-wrap:break-word;
}

/* .gridList ul li {
    padding : 5px;
} */
.mainGray{
	background-color : #F7F7F7;
}


/* --------------------버튼 속성 지정 시작 */
.btn {
    text-decoration: none;  
    display: inline-block;
    padding: 4px 5px 6px 5px; 
    border-radius: 3px;
    line-height: 13px;
    margin-left : 5px;
/*     margin-top : 5px;
    margin-bottom : 5px; */
}
/* 마우스 오버시 이벤트 */
.btn:hover {
    background: #0684F9;
    border: 1px solid #1f96c9;
    color: #FFF;
}
.mainbtn{
	text-decoration: none;  
    display: inline-block;
    padding: 4px 10px 6px 10px; 
    border-radius: 3px;
    line-height: 13px;
    margin-left : 5px;
    margin-top : 2px;
    margin-bottom : 5px;
    background: #1ABB9C;
    color: #FFF;
}


.btnRev {
    background:#fff;
    border:1px solid #ccc;
    color:#666;
}

.btnEdit, .btnHome {
    background: #337ab7;
    border: 1px solid #267ecb;
    color: #FFF;
}

.btnDel, .btnLogout, .btnAddcol, .btnDelcol, .btnrewrite {
    background: #F6F6F6;
    border: 1px solid #ccc;
    color: #666;
}
.btnExcel, .btnURL{
    background: #337ab7;
    border: 1px solid #ccc;
    color: #FFF;
}

button{
	padding: 0.5em 1em;
}


/* --------------------h태그 속성 지정 시작*/
h2,h3{
    margin: 0px;
}



/* --------------------top 영역 속성 지정 시작 */

.topArea{/* top 영역 */
display:flex;
    flex-wrap : wrap;
    border : 1px solid #EEE;
    /* margin-bottom : 5px; */
    width : 100%;
    background-color : #FFF;
}

.tpmenu{/* 메뉴 아이콘 */
    /* display : none; */
    margin-right : 10px;
    /* position : absolute; */
    left : 0px;
    top : 0px;
    z-index : 1;
    background-size:50%;
    background-repeat : no-repeat;
    background-position : center;;
    cursor:pointer;
}

.tprow{/* top 영역의 행 */
    display : flex;
    flex-wrap : wrap;
    padding :5px;
    margin : 0px; 
    width : 100%;
    /* line-height : 35px; */
}

.tpcol{/* top 영역의 열 */
    height : 35px;
    line-height : 35px;
}

.tpcol > img {/* top 영역의 이미지 중앙정렬 */  
    vertical-align: middle;
}




/* --------------------content 전체 영역 속성 지정 시작  */
.content{/* content 전체 영역(top,bottom 영역을 제외한 영역) */
/*     margin-bottom : 5px; */
}




/* --------------------leftmenu 영역 속성 지정 시작 */
.menuArea ul{/* leftmenu 영역 속성지정 */
    color : #FFF;
    padding : 5px;
}

/* .menuArea{leftmenu 영역 배경색
    text-align : left;
    background-color : #49555B;
    width : 15%;
    width : 250px;
    margin-right : 5px;
    height : 100%;
    position : fixed;
    top : 0px;
    left : -20%;
    z-index : 10;
    transition : All 0.2s ease;
    -webkit-transition : All 0.2s ease;
    -moz-transition : All 0.2s ease;
    -o-transition : All 0.2s ease;
    border : 1px solid #c9c9c9;
} */
.menuArea li > a{
  	color : #FFF; 
    text-decoration: none;
}
.gnb ul{
    overflow : hidden;
}
.gnb li{
    /* float : left; */
    width : 100%;
    vertical-align: middle;
}
.gnb li ul{
    width : 100%;
    /* display : none; */
    font-size : 10px;
}
.gnb li a{
    /* display:block; */
    height:25px;
    /* font-size:10px; */
    color:#fff;
    text-align:left;
    line-height:25px;
    vertical-align: bottom;
/*  background-color:#fff; */
}
.gnb_top{
    font-size:13px;
}
.gnb li img{
    vertical-align : middle;
}
/* .gnb li:nth-child(2) {
    width:34%;
} */
/* .gnb li:nth-child(2) a{
    border-left:1px solid #75c5f2;
    border-right:1px solid #75c5f2;
} */
.btn_close{
    position : absolute;
    top:0;
    right : 0;
    z-index:3;
    width:31px;
    height:35px;
    text-indent:-10000em;
    /* background:url("../../resources/images/baseline_clear_white_18dp.png") no-repeat 50% 50%; */
    background-size : 20px auto;
    -webkit-background-size:20px auto;
}


/* --------------------mainArea 전체 영역 속성 지정 시작  */
.mainArea {/* mainArea 전체 영역(top,bottom,leftmenu 영역을 제외한 영역) */
    width : 100%;
    /* border : 1px solid #EEE; */
    /* margin-left : 5px; */
     /* padding-left : 5px;  */
}



/* --------------------titleArea 영역 속성 지정 시작 */
.titleArea {
    border-bottom: 1px solid #EEE; 
    
}


.trow{/* title 영역의 행 */
    display : flex;
}
.maintrow{
	display : flex;
	color: #73879C;
    height: 30px;
    line-height: 30px;
    border-bottom: 2px solid #E6E9ED;
    /* margin-top : 10px; */
    /* margin-bottom: 10px; */
}

.tcol{/* title 영역의 열 */
    height : 35px;
    line-height : 35px;
}



.group {	/* 영역을 하나로 묶음*/
	display : inline-flex;
}

.group > li:nth-child(2n-1){/* group 라벨 색상 변경  */
    background-color:#F5F7FA;
    text-align : right;
}

.group2 {	/* 영역을 하나로 묶음*/
	display : inline-flex;
}

.group2 > li:nth-child(2n-1){/* group 라벨 색상 변경  */
    background-color:#EBF1DE;
    text-align : right;
    color:#8B9D3F;
}

/* --------------------searchArea 영역 속성 지정 시작 */

.searchArea {
    margin-top : 5px;
    border-top : 1px solid #D8D8D8;
    border-left : 1px solid #D8D8D8;
    margin-bottom : 10px;
    
}

.srow{/* searchArea 영역의 행  */	
    flex-wrap : wrap;
    display : flex;
    margin : 0px;
    
    /* ie11 대응 (display : flex) */    
    display: -ms-flexbox;
    -ms-flex-wrap: wrap;      
    
}

.scol{/* searchArea 영역의 열  */
    width : 100%;
    /* padding : 2px; */
    border-right : 1px solid #D8D8D8;
    border-bottom : 1px solid #D8D8D8;
    /* height : 25px;   /* 콤보박스 3개 연달아 있을때 내려가게 하기 위함 */
    /* height : 30px; */
    line-height : 30px;
    padding : 5px;
}


/* --------------------inputArea 영역 속성 지정 시작 */
.inputArea {    
    margin-top : 5px;
    border-top : 1px solid #D8D8D8;
    border-left : 1px solid #D8D8D8;
    margin-bottom : 10px;    
}
.inputAreaex{
	margin-top : 5px;
}

.irow{/* inputArea 영역의 행  */
    flex-wrap : wrap;
    display : flex;
    margin : 0px;
    
    /* ie11 대응 (display : flex) */    
    display: -ms-flexbox;
    -ms-flex-wrap: wrap;     
}


.icol{/* inputArea 영역의 열  */
    width : 100%;
    /* padding : 2px; */
    border-right : 1px solid #D8D8D8;
    border-bottom : 1px solid #D8D8D8;
    /* height : 25px; */
    line-height : 25px;
    padding : 5px;
}

/* .igroup > li:nth-child(2n-1){ inputArea 영역의 라벨부분 
    background-color:#F5F7FA;
    text-align : right;
}  */





/* --------------------subTitle 영역 속성 지정 시작 */
.subTitle{/* subTitle 영역 속성 지정  */
    margin:0px;
    padding:0px;
}

.sbrow{/* subTitle 영역의 행 */
    display: flex;
    margin : 0px;
}

.sbcol{/* subTitle 영역의 열 */
    height : 35px;
    line-height:35px;
}



/* --------------------gridList 영역 속성 지정 시작 */
.grow{/* gridList 영역의 행 */
    display : flex;
    flex-wrap : wrap;    
    
    /* ie11 대응 (display : flex) */    
    display: -ms-flexbox;
    -ms-flex-wrap: wrap;    
    
}
.gridList, .pList {
    /* border-top : 1px solid #D8D8D8; */
    border-left : 1px solid #D8D8D8;
}


.gcol {/* gridList 영역의 열 */
    border-right : 1px solid #D8D8D8;
    border-bottom : 1px solid #D8D8D8;
    /* 
    height : 25px; 
    line-height : 25px; 
    */
    min-height:25px;
    padding : 5px;
    justify-content: center;		/* flex 세로 - 가운데 정렬 */ 
}


.gtimecol{
	border-right : 1px solid #D8D8D8;
    border-bottom : 1px solid #D8D8D8;
}

.gTitle {
    border-top : 1px solid #DDD;
    border-bottom : 2px solid #DDD;
}

.gTitle > li{/* gridList 영역의 타이틀 부분 */
    background-color : #F0F0F0;
    font-weight : bold;
    text-align : center;
    height : 25px;
    line-height : 25px;
    padding : 5px;
}

.gTitle > th{/* gridList 영역의 타이틀 부분 */
    background-color : #F0F0F0;
    font-weight : bold;
    text-align : center;
    /* height : 25px;
    line-height : 25px; */
    padding : 5px;
}

.gContent >li{/* gridList 영역의 내용 부분 */
    padding : 5px;
}

.gContent >td{/* gridList 영역의 내용 부분 */
    padding : 5px;
}


.gContent:nth-child(2n-1){
    background-color : #F9F9F9;
}

.inputColor{
    background-color : #E6F0F9;
}





/* --------------------bottom 영역 속성 지정 시작 */
.frow{/* bottom 영역의 행 */
    text-align : center;
}

.fcol{/* bottom 영역의 열 */
    display:inline-block;
}

.fcol > img {/* bottom 영역의 이미지 중앙 정렬 */
    vertical-align: middle;
}

/* --------------------col width 조절 속성 시작 */


.flex0{
    /* flex : 1 1 45px; */
    flex-grow : 1;
    flex-basis : auto;    
}
.flex1 {
    /* flex : 1 1 90px; */
    flex-grow : 1;
    flex-basis : 45px;  
}
    
.flex2 {
    /* flex : 2 1 90px; */
    flex-grow : 2;
    flex-basis : 60px;
}
.flex75{
	flex-grow : 2;
    flex-basis : 85px;
}  

.flex2h{
    flex-grow : 2;
    flex-basis : 300px;
}            
.flex3 {
    /* flex : 3 1 90px; */
    flex-grow : 3;
    flex-basis : 90px;     
}

        
.flex4 {
    /* flex : 4 1 90px; */
    flex-grow : 4;
    flex-basis : 120px;    
}   

.flex5 {
    /* flex : 4 1 90px; */
    flex-grow : 5;
    flex-basis : 150px;    
}

.flex6 {
    /* flex : 4 1 90px; */
    flex-grow : 6;
    flex-basis : 180px;     
}

.flex7{
    /* flex : 4 1 90px; */
    flex-grow : 7;
    flex-basis : 210px;
}

.flex8 {
    /* flex : 4 1 90px; */
    flex-grow : 8;
    flex-basis : 240px;   
}
.flex9 {
    flex-grow : 9;
    flex-basis : 270px;    
}
.flex10 {
    flex-grow : 10;
    flex-basis : 300px;      
}
.flex12 {
    flex-grow : 12;
    flex-basis : 500px;      
}

.flex5gray {
    /* flex : 4 1 90px; */
    flex-grow : 5;
    flex-basis : 150px;    
    background:"#F2F2F2";
}




.framelayoout{
    padding : 5px;
}


/* 넓이 조절 (풀무원) */
.width1{
    width : 10%;
}
.width2{
    width : 20%;
}
.width3{
    width : 30%;
}
.width4{
    width : 40%;
}
.width45{
    width : 45%;
}
.width5{
    width : 50%;
}
.width6{
    width : 60%;
}
.width7{
    width : 70%;
}
.width8{
    width : 80%;
}
/* input 오른쪽 텍스트 */
.width78{
    width : 78%;
}
.width9{
    width : 90%;
}
.width10{
    width : 100%;
} 
/* 넓이 조절 (풀무원) */



/* 여백 조절 */
.margin-r1{
    margin-right : 5px;
} 

.margin-r2{
    margin-right : 10px;
} 

.margin-r3{
    margin-right : 15px;
} 

.margin-r4{
    margin-right : 20px;
} 

.margin-r5{
    margin-right : 25px;
}
/* // 여백 조절 */


.marginR6{
    margin-right : 30px;
}


.txtcolor{
    background-color : #F0F0F0;
}
.inputcolor{
	background-color : #F5F7FA;
	text-align : right;
}
input{
    border : 1px solid #CCC;
    height : 25px;     
    /* padding-left: 1px; */
}
textarea{
	border : 1px solid #CCC;
	padding-left: 1px;
}

input[type='search'] {
    border : 1px solid #CCC;
    height : 27px;
    padding-left: 5px;
    
}

.ckbox{
    width : 18px;
    height : 18px;
    vertical-align : -2px;
}

.decrease{
	overflow: hidden;
    text-overflow: ellipsis;
    /* white-space: nowrap; */    
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    line-height:1;
}  

.colleft {
	text-align : left;	
}
.colcenter{
    text-align : center;    
    /* 이미지 가운데 정렬 - gcol에서 세로 가운데 정렬 하므로 막음 */
    justify-content: center;
  	align-items: center;
}
.colright{
    text-align : right;
    /* margin-right : 10px; */
    float : right;
}
.colheight0{
    height : 0px;
}
.content{
    min-height: 100vh;
}
select{
        height : 27px;
    }
.textRed{
    color : #d9534f;
}
.vcent{
    margin-bottom : 5px;
}
.monthsum{
    background-color :#F2F2F2;
}
.allsum{
    background-color :#FFEEDD;
}

/* .eformArea{
    display: grid;
    grid-template-columns : repeat(4,1fr);
    height : 200px;
} */
.eformArea{
    margin-bottom : 5px;
}
.signature-pad{
    margin-right : 100px;
}


.srow2{/* searchArea 영역의 행  */
    flex-wrap : wrap;
    display : flex;
    margin : 0px;
}

.scol2{/* searchArea 영역의 열  */
    width : 100%;
    /* padding : 2px; */
    border-right : 1px solid #D8D8D8;
    border-bottom : 1px solid #D8D8D8;
/*      height : 30px;
    line-height : 30px; */
    padding : 5px;
}

.srow2 > li:nth-child(2n-1){/* searchArea 영역의 라벨부분  */
    background-color:#E6F0F9;
    text-align : right;
    
    /* padding-right : 5px; */
}

.irow2{/* inputArea 영역의 행  */
    flex-wrap : wrap;
    display : flex;
    margin : 0px;
}

.icol2{/* inputArea 영역의 열  */
    width : 100%;
    /* padding : 2px; */
    border-right : 1px solid #D8D8D8;
    border-bottom : 1px solid #D8D8D8;
/*      height : 30px;
    line-height : 30px; */
    padding : 5px;
}

.irow2 > li:nth-child(2n-1){/* inputArea 영역의 라벨부분  */
    background-color:#E6F0F9;
    text-align : right;
    
    /* padding-right : 5px; */
}

.dpnone{
    display:none;
}
.gridWrap{
    display : flex;
    flex-wrap : wrap;
}
#mask{
    position:absolute;  
    left:0;
    top:0;
    z-index:1;  
    background-color:#000;  
    display:none;
}

#mask1{
    position:absolute;  
    left:0;
    top:0;
    z-index:3;  
    background-color:#000;  
    display:none;
}

#maskP{
    position:absolute;  
    left:0;
    top:0;
    z-index:3;  
    background-color:#000;  
    display:none;
}

.windowMenu{
    background-color : #1F96C9;
    padding : 5px;
    color : #FFF;
    font-size : 1.2em;
    height : 30px;
    line-height : 30px;
}

.windowSearch{
    margin-top : 5px;
    border-top : 1px solid #D8D8D8;
    border-left : 1px solid #D8D8D8;
}
.windowGrid{
    margin-top : 5px;
    border-top : 1px solid #D8D8D8;
    border-left : 1px solid #D8D8D8;
}
.windowMargin{
    margin : 10px;
}
.clearIcon{
    width : 25px;
    height : 25px;
}
.wrow{
    display : flex;
}
.wcol{
    vertical-align : middle;
}
.makeFlex{
    padding: 0px;
    margin : 0px;
    display: flex;    
    flex-wrap : nowrap;
    justify-content: center;       
}
.signDiv{
    margin-top : 10px;
    margin-bottom : 10px;
    height : 273px;
    width : 240px;
    justify-content: center;  
}
.signPad{
    margin : 1px;
    /* background-color : #EEE; */
    height : 200px;
    width : 90%;
}
.scol3{
    width : 100%;
    padding : 5px;
    border-right : 1px solid #D8D8D8;
    border-bottom : 1px solid #D8D8D8;
}
.icol3{
    width : 100%;
    padding : 5px;
    border-right : 1px solid #D8D8D8;
    border-bottom : 1px solid #D8D8D8;
}
.secret{
    display:none;
}

#s0, #s1, #s2, #s3{ 
    display: block;
    margin-left : auto;
    margin-right : auto;
    width:100%;
    height:100%;
}
#img_container {
       display: block;
    margin-left : auto;
    margin-right : auto;
     border : 1px solid #CCC;
     width:200px;
     height:200px;
     margin-top : 10px;
     margin-bottom : 10px;
}
#img_li{
    display: block;
    margin-left : auto;
    margin-right : auto;
}

img {
  vertical-align: middle;
}
.img-responsive,
.thumbnail > img,
.thumbnail a > img,
.carousel-inner > .item > img,
.carousel-inner > .item > a > img {
  display: block;
  max-width: 100%;
  height: auto;
}
.img-rounded {
  border-radius: 6px;
}
.img-thumbnail {
  display: inline-block;
  max-width: 100%;
  height: auto;
  padding: 4px;
  line-height: 1.42857143;
  background-color: #fff;
  border: 1px solid #ddd;
  border-radius: 4px;
  -webkit-transition: all .2s ease-in-out;
       -o-transition: all .2s ease-in-out;
          transition: all .2s ease-in-out;
}
.img-circle {
  border-radius: 50%;
}
.thumbnail {
  display: block;
  padding: 4px;
  /* margin-bottom: 20px; */
  line-height: 1.42857143;
  background-color: #fff;
  border: 1px solid #ddd;
  border-radius: 4px;
  -webkit-transition: border .2s ease-in-out;
       -o-transition: border .2s ease-in-out;
          transition: border .2s ease-in-out;
}
.thumbnail > img,
.thumbnail a > img {
  margin-right: auto;
  margin-left: auto;
  max-width: 300px;
  height: auto;
}
a.thumbnail:hover,
a.thumbnail:focus,
a.thumbnail.active {
  border-color: #337ab7;
}
.thumbnail .caption {
  /* padding: 9px; */
  margin-left : 10px;
  color: #333;
}
/* gellery에 여백 주기 */
#grid .item
{ 
    padding-right: 10px;
    padding-bottom: 10px; 
}

Style Attribute {
    visibility: visible;
    position: relative;
}

/* e브로셔 구분 텍스트 */
.bro-gubun {
    color : #337ab7;'
    /* color : #FC7D49; 주황색 */
    /* font-size : 0.8em; */
    
}
/* e브로셔 타이틀 텍스트 */
.bro-title > a {
    color : #555555;
    
}

/* e브로셔 품목 구분 */
#itemList {
    margin-top : 2px;
}

#itemList1 {
    margin-top : 2px;
}

#itemList2 {
    margin-top : 2px;
}
#MEDIUM_GUBUN{
	margin-top : 2px;
}
#SMALL_GUBUN{
	margin-top : 2px;
}

.dataTables_wrapper{
	margin-top : 5px;
}
.todayAct{
    display: inline-block;
    padding: 4px 0px 4px 0px;
    width : 100px;
    text-align : center;
    border-radius: 3px;
    line-height: 13px;
    margin-left : 20px;
    margin-top : 5px;
    margin-bottom : 5px;

}
.makeborder{
    border : 2px solid #E6E9ED;
    padding : 10px 10px 10px 10px;
    margin : 5px 5px 5px 5px;
    background-color : #FFFFFF;
}
.makecontent{
    border-left : 2px solid #E6E9ED;
    border-bottom : 2px solid #E6E9ED;
    border-right : 2px solid #E6E9ED;
    margin : 0 10px 10px 10px;
    background-color : #FFFFFF;
}
.makebgc{
	background-color : #97A1A9;
	margin: 10px 10px 0 10px;
}
.makebgc1{
    background-color : #4B545B;
    margin: 10px 10px 0 10px;
}
.borderbottom{
    border-bottom : 1px solid red;
}
.mainWrap{
    background-color : #F7F7F7;
    height : 100%;
}
.mainSubTitle{
    color : #73879C;
    font-size : 1.3em;
    height : 35px;
    line-height : 35px;
    border-bottom : 2px solid #E6E9ED;
    margin-bottom : 10px;
    text-align: left;
}
.makeSubTitle{
	color : #FFFFFF;
    font-size : 1.2em;
    height: 40px;
    line-height: 40px;
}
.mainContentTitle{
    margin : auto auto auto 0;
    border-left : 1px solid red;
    font-size : 1em;
}
.gridMainmenu{
    height : 100%;
}
.imageCenter{
    vertical-align : middle; 
    margin : auto auto auto 0;
    
}
.mainIcon{
    height : 50%;
    margin : auto; 
}

#fullcalendar{
	width : 100%;
}
#makeInline{
	display : inline;
}
#centertext{
	text-align : center;
}
#todayActSub{
	border-right : 2px solid #ADB2B5;
	color : #73879C;
	width : 80%;
	padding-left : 5px;
}
#todayActSub1{
	color : #73879C;
    width : 80%;
    padding-left : 5px;
}
#PLAN_NUM{
	border-right : 2px solid #ADB2B5;
	width : 80%;
	padding-left : 5px;
	font-size : 2.2em;
	font-weight : bold;
	text-align : center;
}
#RESULT_NUM{
	width : 80%;
	padding-left : 5px;
	font-size : 2.2em;
	font-weight : bold;
	text-align : center;
	color : #1ABB9C;	
}
.typeStatus{
	height : 30px;
	line-height : 30px;
}
.makelineheight{
	height : 50px;
    line-height : 50px;
}
.makeTopLine{
	border-top : 1px solid #EEEEEE;
}
.actType{
	height : 288px;
}
.bgc-red{
	background-color: #ff3c7e;
    border-radius: 50px;
    color: #fff;
    font-size: 10px;
    line-height: 1;
    padding: 3px 5.5px;
    position: absolute;
    right: 4px;
}
.dropdown{
	position : relative;
	width : 30px;
}
.makeNew{
	background-color: #ff3c7e;
    border-radius: 25px;
    color: #fff;
    font-size: 10px;
}
.mailsend{
	text-align : right;
	padding-right : 2px;
	font-size : 1.5em;
}


.gridList > tbody > .even, .gridList > tbody > .odd{
	display : flex;
    flex-wrap : wrap;
}

/* .gridList > tbody > tr{
	display : flex;
    flex-wrap : wrap;
}
 */

.gridList > tfoot > tr{
	display : flex;
    flex-wrap : wrap;
}

.windowGrid > tbody > .even, .windowGrid > tbody > .odd{
    display : flex;
    flex-wrap : wrap;
}


.windowGrid > tfoot > tr{
    display : flex;
    flex-wrap : wrap;
}

thead>tr>td.sorting{
	padding-right : 0px;
}
tfoot>tr>td{
	padding : 5px;
	/* background-color : #F9F2F4; */
 background-color : #F2F5F7;
}
.gTitle > th {
	border-right : 1px solid #D8D8D8;
    border-bottom : 1px solid #D8D8D8;
/*     height : 25px;
    line-height : 25px; */
    overflow :  hidden;
}
.even{
	background-color : #F9F9F9;
}
.dataTables_empty{
	flex-grow : 10;
    flex-basis : 300px;
}
.row{
	display : flex;
	flex-wrap : wrap;
}
.col-sm-5, .col-sm-6, .col-sm-7 {
    flex-grow : 1;
    flex-basis : 200px;
}
.col-sm-12{
	width : 100%;
}
.highlight {
    font-weight: bold;
    color: blue;
}
.group > td {
	height : 25px;
	line-height : 25px;
	padding : 5px;
	background-color : #F9F2F4;
	border-right : 1px solid #D8D8D8;
    border-bottom : 1px solid #D8D8D8;
}

.dataTables_filter{
	display : inline;
	float : right;
	margin-bottom : 5px;
}

/* 페이징 css */
.pagination {
    display : inline-block;
    padding-left: 0;
    border-radius : 4px;
}
.pagination > li {
	display : inline;
}
.pagination > li:first-child > a, .pagination > li:first-child > span{
    margin-left: 0;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
}
.pagination > li:last-child > a, .pagination > li:last-child > span {
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}

.pagination > li > a, .pagination > li > span {
    position: relative;    		
    padding: 6px 12px;
    margin-left: -1px;
    color: #337ab7;
    text-decoration: none;
    background-color: #fff;
    border: 1px solid #ddd;
    
    /* float: left; paging 버튼이 이상해 져서 막음 */
}

.pagination>.disabled>a, .pagination>.disabled>a:focus, .pagination>.disabled>a:hover, .pagination>.disabled>span, .pagination>.disabled>span:focus, .pagination>.disabled>span:hover {
    color: #777;
    cursor: not-allowed;
    background-color: #fff;
    border-color: #ddd;
}
.pagination>.active>a, .pagination>.active>a:focus, .pagination>.active>a:hover, .pagination>.active>span, .pagination>.active>span:focus, .pagination>.active>span:hover {
    z-index: 1;
    color: #fff;
    cursor: default;
    background-color: #337ab7;
    border-color: #337ab7;
}

.windowWrap{
	margin-bottom : 5px;
}





.intro {
  background: #F45B69;
  padding: 100px 0;
}

.timecontain {
  width: 90%;
  max-width: 1200px;
  margin: 0 auto;
  text-align: center;
}

h1 {
  font-size: 2.5rem;
}


/* TIMELINE
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.timeline ul {
  background: #FFF;
  padding: 50px 0;
}
.timeline ul li {
  list-style-type: none;
  position: relative;
  width: 3px;
  margin: 0 auto;
  padding-top: 50px;
  background: #5A738E;
}

.timeline ul li::after {
  content: '';
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: inherit;
}

.timeline ul li div {
  position: relative;
  bottom: 0;
  width: 400px;
  padding: 15px;
  background: #F5F7FA;
}

.timeline ul li div::before {
  content: '';
  position: absolute;
  bottom: 7px;
  width: 0;
  height: 0;
  border-style: solid;
}

.timeline ul li:nth-child(odd) div {
  left: 45px;
}

.timeline ul li:nth-child(odd) div::before {
  left: -15px;
  border-width: 8px 16px 8px 0;
  border-color: transparent #F5F7FA transparent transparent;
}

.timeline ul li:nth-child(even) div {
  left: -439px;
}

.timeline ul li:nth-child(even) div::before {
  right: -15px;
  border-width: 8px 0 8px 16px;
  border-color: transparent transparent transparent #F5F7FA;
}
time {
  display: block;
  font-size: 1.2rem;
  font-weight: bold;
  margin-bottom: 8px;
}


/******************************************************************************/

.timeline ul li::after {
  transition: background .5s ease-in-out;
}

.timeline ul li.in-view::after {
  background: #F45B69;
}


/* .timeline ul li div {
  visibility: hidden;
  opacity: 0;
  transition: all .5s ease-in-out;
} */

/* .timeline ul li:nth-child(odd) div {
  transform: translate3d(200px, 0, 0);
}

.timeline ul li:nth-child(even) div {
  transform: translate3d(-200px, 0, 0);
} */

.timeline ul li.in-view div {
  transform: none;
  visibility: visible;
  opacity: 1;
  word-wrap: break-word;
  word-break: break-all;
}

/***********************************************************************************/

/* GENERAL MEDIA QUERIES
–––––––––––––––––––––––––––––––––––––––––––––––––– */

@media screen and (min-width: 601px) {
  .timeline ul li div {
    width: 300px;
    /* color : #FFFFFF; */
    box-sizing: border-box;
  }
  .timeline ul li:nth-child(even) div {
    left: -335px;
  }
}

@media screen and (max-width: 600px) {
  .timeline ul li {
    margin-left: 20px;
  }
  .timeline ul li div {
    width: calc(100vw - 91px);
    /* color : #FFFFFF; */
    box-sizing: border-box;
  }
  .timeline ul li:nth-child(even) div {
    left: 45px;
  }
  .timeline ul li:nth-child(even) div::before {
    left: -15px;
    border-width: 8px 16px 8px 0;
    border-color: transparent #F5F7FA transparent transparent;
  }
}

/* 데이터테이블 selected 폰트 및 Background Color */
table.dataTable tbody tr.selected {
    background-color: #08C;
    color: white;
}





.selected {
    background-color: #B0BED9;
}
td.details-control {
    background: url('/resources/images/add_circle.png') no-repeat center center;
    cursor: pointer;
}
.shown td.details-control {
    background: url('/resources/images/remove_circle.png') no-repeat center center;
}

tbody tr td{
	overflow: hidden;
    word-wrap: break-word;
}

/* 거래처 등록에서 우측으로 값이 넘어갈때 이쁘게 만들어줌 */
.regclient > ul{
	border-left : 1px solid #D8D8D8;
}
.regclient > ul:first-child{
	border-top : 1px solid #D8D8D8;
}

.timelinestep{
	color : #FFFFFF;
	/* background-color : #4D5F70; */
	padding: 2px 10px;
}
.upbold{
	font-size : 13px;
	font-weight: bold;
}
/* .timeline ul li div p{
	height : 25px;
} */

.makebutton {
    text-decoration: none;
    display: inline-block;
    padding: 4px 20px 6px 20px;
    border-radius: 3px;
    line-height: 13px;
    margin-left: 5px;
    margin-top: 5px;
    margin-bottom: 5px;
    font-size: 1.2em;
    width: 30px;
    height: 20px;
    line-height: 20px;
    text-align: center;
}


.buttonbgc {
    background:#337ab7;
    border:1px solid #ccc;
    color:#fff;
}
.buttonbgc1 {
    background:#1ABB9C;
    border:1px solid #ccc;
    color:#fff;
}
#selectbgc:first-child{
    background-color : red;
    font-size : 1.5em;	
}

/* 거래처 등록 담당자 */
.choiceline{
	height: 35px;
    line-height: 40px;
}
.choiceman{
	font-weight: bold;
    padding: 4px;
    margin-right : 10px;
    background-color : #8B9D3F;
    color : #FFFFFF;
    display: inline-block;
    width: 100px;
    height: 20px;
    line-height: 20px;
    text-align: center;
}


/* 메인화면 css */
.mainrow{
    flex-wrap : wrap;
    display : flex;
    height: 35px;
    line-height: 35px;    
}
.noAct{
	height : 318px;
	overflow: auto;
}
.noActheight{
    height : 324px;
    overflow: auto;
}
.noActcol{
	font-size : 1.1em;
	margin-right : 5px;
	margin-bottom : 5px;
	margin-left : 5px;
}
.noActcolRight{
	margin-left : 50px;
}
.mainnoActrow{
	display : flex;
	border-bottom : 1px solid #D8D8D8;
	height : 30px;
	line-height : 30px;
	font-size: 1.2em;
	overflow: hidden;
}
.makemainFlex{
    padding: 0px;
    margin : 0px;
    display: flex;
    flex-wrap : wrap;
       width : 100%;
    /* padding : 2px; */
    text-align : center;
    /*  padding-left :30px; */   
}
.makemainborder{
	border : 1px solid #D8D8D8;
	margin: 8px;
    /* height: 250px; */
    width : 100%;
    text-align : center;
    padding : 10px;
}


/* 메인화면 - 설치현황 Layout */
.p{
    padding: 0px;
    margin : 0px;
    display: flex;
    flex-wrap : wrap;
       width : 100%;
    /* padding : 2px; */
    text-align : center;
    /*  padding-left :30px; */   
}



/* .actState{
	height : 315px;
} */
.stateContract{
	margin-top: 30px;
	background-color : #337ab7;
	height: 140px;
    border-radius: 70px;
    width: 140px;
    display: inline-block;	
}
.stateNoContract{
	margin-top: 30px;
	background-color : #1ABB9C;
	height: 140px;
    border-radius: 70px;
    width: 140px;
    display: inline-block;
}
.stateNewContract{
	margin-top: 30px;
    background-color : #4B545B;
    height: 140px;
    border-radius: 70px;
    width: 140px;
    display: inline-block;
}
.contractName{
	background-color : #6A7F95;
	height : 40px;
	line-height : 40px;
	margin-top: 20px;
    margin-left: 10px;
    margin-right: 10px;
    margin-bottom: 20px;
    color : #FFFFFF;
    font-size: 1.3em;
    font-weight: bold;
}
.processName{
	background-color : #337ab7;
	height : 40px;
	line-height : 40px;
	margin-top: 20px;
    margin-left: 10px;
    margin-right: 10px;
    margin-bottom: 20px;
    color : #FFFFFF;
    font-size: 1.3em;
    font-weight: bold;
}
.bIcon{
	width: 50px;
    height: 50px;
    margin-right: 2px;
    margin-left: 2px;
    margin-top: 30px;
}
.whiteup{
	color: #FFFFFF;
    font-size: 2.5em;
    font-weight: bold;
}
.actMainborder{
	border : 1px solid #D8D8D8;
    margin: 10px;  
    
}
.comeLeft{
	text-align: left;
    font-size: 1.5em;
    margin-left : 10px;
}
.actMainNum{
	font-weight : bold;
	text-align: right;
    margin-right: 10px;
    margin-top: 20px;
    font-size: 2.5em;
}
.actMainNumOk{
	font-weight : bold;
	color : #1ABB9C;
    text-align: right;
    margin-right: 10px;
    margin-top: 20px;
    font-size: 1.7em;
}
.mainForNum{
	font-weight : bold;
	font-size: 1.7em;
}
.foricon{
	width:20px;
	height: 20px;
}

.forMainState{
	font-weight: bold;
    text-align: left;
    margin-top: 10px;
    margin-bottom: 10px;
    font-size: 1.5em;
    margin-left: 10px;
    color : #999;
}
.maincal{
	/* font-size: 1.2em; */
    font-weight: bold;
    margin-left: 10px;
    text-align : right;    
    margin-right : 5px;
    height: 30px;
    line-height : 30px;
}
.toppadding{
	padding-top : 7px;
}
.paddingbot13{
	padding-bottom: 13px;
}
.paddingbot18{
    padding-bottom: 18px;
}


/** 모바일 탭이 있어서 주석 처리 함 **/
/* 탭 */
/* ul.tabs {
    margin: 0;
    padding: 0;
    float: left;
    list-style: none;
    height: 32px;
    border-bottom: 1px solid #eee;
    border-left: 1px solid #eee;
    width: 100%;
    font-family:"dotum";
    font-size:12px;
}
ul.tabs li {
    float: left;
    text-align:center;
    cursor: pointer;
    width:82px;
    height: 31px;
    line-height: 31px;
    border: 1px solid #eee;
    border-left: none;
    font-weight: bold;
    background: #fafafa;
    overflow: hidden;
    position: relative;
}
ul.tabs li.active {
    background: #FFFFFF;
    border-bottom: 1px solid #FFFFFF;
}
.tab_container {
    border: 1px solid #eee;
    border-top: none;
    clear: both;
    float: left;
    width: 248px;
    background: #FFFFFF;
}
.tab_content {
    padding: 5px;
    font-size: 12px;
    display: none;
}
.tab_container .tab_content ul {
    width:100%;
    margin:0px;
    padding:0px;
}
.tab_container .tab_content ul li {
    padding:5px;
    list-style:none;
} */
/*  #container {
    width: 249px;
    margin: 0 auto;
} */
/* // 탭  */


@media screen and (max-width:480px) {
.makemainborder {
    border: 1px solid #D8D8D8;
    margin: 5px;
    /* height: 250px; */
    width: 100%;
    text-align: center;
}
.stateContract {
    margin-top: 30px;
    background-color: #27AAE1;
    height: 70px;
    border-radius: 35px;
    width: 70px;
    display: inline-block;
}
.stateNoContract{
	margin-top: 30px;
    background-color: #1ABB9C;
    height: 70px;
    border-radius: 35px;
    width: 70px;
    display: inline-block;
}
.stateNewContract{
	margin-top: 30px;
    background-color: #4B545B;
    height: 70px;
    border-radius: 35px;
    width: 70px;
    display: inline-block;
}

.bIcon {
    width: 36px;
    height: 36px;
    /* margin-right: 2px; */
    /* margin-left: 2px; */
    margin-top: 5px;
}
.whiteup {
    color: #FFFFFF;
    font-size: 1em;
    font-weight: bold;
}
.contractName {
    background-color: #6A7F95;
    height: 30px;
    line-height: 30px;
    margin-top: 15px;
    margin-left: 10px;
    margin-right: 10px;
    margin-bottom: 10px;
    color: #FFFFFF;
    font-size: 0.9em;
}
.processName {
    background-color: #337ab7;
    height: 30px;
    line-height: 30px;
    margin-top: 15px;
    margin-left: 10px;
    margin-right: 10px;
    margin-bottom: 10px;
    color: #FFFFFF;
    font-size: 0.9em;
}
.mainnoActrow {
    display: flex;
    border-bottom: 1px solid #D8D8D8;
    height: 30px;
    line-height: 30px;
    font-size: 1.0em;
    overflow: hidden;
}
.typeStatus {
    height: 30px;
    line-height: 30px;
    font-size: 1.0em;
}
.mainSubTitle {
    color: #73879C;
    font-size: 1.1em;
    height: 30px;
    line-height: 30px;
    border-bottom: 2px solid #E6E9ED;
    margin-bottom: 10px;
}
.fa{
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: 13px;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
}
.actMainNum{
    font-weight: bold;
    text-align: right;
    margin-right: 10px;
    /* margin-top: 20px; */
    font-size: 2.0em;
}
.actMainNumOk{
    font-weight : bold;
    color : #1ABB9C;
    text-align: right;
    margin-right: 10px;
    /* margin-top: 20px; */
    font-size: 1.0em;
}
.forMainState {
    font-weight: bold;
    text-align: left;
    margin-top: 10px;
    font-size: 0.9em;
    margin-left: 10px;
    color: #C8C8C8;
}
.mainForNum {
    font-weight: bold;
    font-size: 1.0em;
}

.mobilehide{
	display : none;
}

}

.flextop{
    flex-grow : 1;
    flex-basis :30px;
}


/* ### Datatables CSS ### */   
table.dataTable td.focus {							/* keyTable */ 
    outline: 1px solid #ac1212;
    outline-offset: -3px;
    background-color: #f8e6e6 !important;
}




/* ### IE11 GridList Flex 변경 ### */
/* ie11 때문에 비율로 조정 함 */

.gridList .flex1 {
    display : inline-flex;
    flex-direction : column;
    width : 10%;      
}

.gridList .flex2 {
    display : inline-flex;
    flex-direction : column;
    width : 20%;       
}

.gridList .flex3 {
    display : inline-flex;
    flex-direction : column;
    width : 30%;       
}

.gridList .flex4 {
    display : inline-flex;
    flex-direction : column;
    width : 40%;       
}

.gridList .flex5 {
    display : inline-flex;
    flex-direction : column;
    width : 50%;       
}

.gridList .flex6 {
    display : inline-flex;
    flex-direction : column;
    width : 60%;       
}

.gridList .flex7 {
    display : inline-flex;
    flex-direction : column;
    width : 70%;       
}

.gridList .flex8 {
    display : inline-flex;
    flex-direction : column;
    width : 80%;       
}

.gridList .flex9 {
    display : inline-flex;
    flex-direction : column;
    width : 90%;       
}

.gridList .flex10 {
    display : inline-flex;
    flex-direction : column;
    width : 100%;       
}


/* ie11 에서 데이터가 없을 경우 넓이 조절 */
.gridList .dataTables_empty{
    display : inline-flex;
    flex-direction : column;
    width : 100%;
}



/* ie11 때문에 비율로 조정 함(팝업창) */
.windowGrid .flex1 {
    display : inline-flex;
    flex-direction : column;
    width : 10%;      
}

.windowGrid .flex2 {
    display : inline-flex;
    flex-direction : column;
    width : 20%;       
}

.windowGrid .flex3 {
    display : inline-flex;
    flex-direction : column;
    width : 30%;       
}

.windowGrid .flex4 {
    display : inline-flex;
    flex-direction : column;
    width : 40%;       
}

.windowGrid .flex5 {
    display : inline-flex;
    flex-direction : column;
    width : 50%;       
}

.windowGrid .flex6 {
    display : inline-flex;
    flex-direction : column;
    width : 60%;       
}

.windowGrid .flex7 {
    display : inline-flex;
    flex-direction : column;
    width : 70%;       
}

.windowGrid .flex8 {
    display : inline-flex;
    flex-direction : column;
    width : 80%;       
}

.windowGrid .flex9 {
    display : inline-flex;
    flex-direction : column;
    width : 90%;       
}

.windowGrid .flex10 {
    display : inline-flex;
    flex-direction : column;
    width : 100%;       
}

/* ie11 에서 데이터가 없을 경우 넓이 조절 */
.windowGrid .dataTables_empty{
    display : inline-flex;
    flex-direction : column;
    width : 100%;
}


/* ### mobile CSS ### */

/* 모바일 메인화면 상단 버튼 CSS */
.mobileButton
{
    display			: flex;
    flex-wrap 		: wrap;    
    height 			: 100px;
    line-height		: 80px;
	
} 

/* 모바일 처리현황 원배경 CSS */
.mobileCircle {
    display			: flex;
    flex-wrap 		: wrap;   
	height			: 160px;	
}

/* 블루 서클 */
.mobileCircleBlue
{	
	background-color: #337ab7;
	width			: 140px;
	height			: 140px;   
	line-height		: 30px; 	 
    border-radius	: 70px;
    margin-top		: 10px; 
    margin-left		: 5%;  
}

/* 녹색 서클 */ 
.mobileCircleGreen
{	
	background-color: #1ABB9C;
	width			: 140px;
	height			: 140px;
	line-height		: 30px; 	     
    border-radius	: 70px;
    margin-top		: 10px;   
    margin-left		: 5%;   
}

/* 서클 폰트 css */
.mobileCircleFont
{
	color			: #ffffff;
    font-size		: 1.5em;
    font-weight		: bold;        
    height			: 140px;   
	line-height		: 35px; 
}


/* 모바일 Tab CSS */
ul.tabs {
    margin: 0;
    padding: 0;
    float: left;
    list-style: none;
    height: 32px;
    border-bottom: 1px solid #eee;
    border-left: 1px solid #eee;
    width: 100%;
    font-family:"dotum";
    font-size:12px;
}
ul.tabs li {
    float: left;
    text-align:center;
    cursor: pointer;
    width:100px;
    height: 31px;
    line-height: 31px;
    border: 1px solid #eee;
    border-left: none;
    font-weight: bold;
    background: #fafafa;
    overflow: hidden;
    position: relative;
}
ul.tabs li.active {
    background: #FFFFFF;
    border-bottom: 1px solid #FFFFFF;
    color: #6C829A;
}
.tab_container {
    border: 1px solid #eee;
    border-top: none;
    clear: both;
    float: left;
    width: 100%;
    background: #FFFFFF;
}
.tab_content {
    padding: 5px;
    font-size: 12px;
    display: none;
}
.tab_container .tab_content ul {
    width:100%;
    margin:0px;
    padding:0px;
}
.tab_container .tab_content ul li {
    padding:5px;
    list-style:none
}
#container {
    width: 100%;
    margin: 0 auto;
}
/* // Tab CSS */


/* main CSS */
.colmargin{
	text-align : left;
	margin-left : 10px;
	margin-top  : 5px;
	margin-bottom : 5px;
	margin-right : 10px;
}

/* input CSS */
.input-icon-search {
	background-image : url('/resources/images/outline_search_black_18dp.png'); 
	background-size: 20px;
	background-position: right;
  	background-repeat:no-repeat;
}


.input-icon-calendar {
	background-image : url('/resources/images/outline_today_black_18dp.png'); 
	background-size: 20px;
	background-position: right;
  	background-repeat:no-repeat;
}

.input-icon-history {
	background-image : url('/resources/images/baseline_history_black_18dp.png'); 
	background-size: 20px;
	background-position: right;
  	background-repeat:no-repeat;
}

/* input 박스 테두리없애기  */
.input-invisible {
	clear:none;
	border:0px none;
	float:none;
	background-color:#fff;
	color:#fff;
	outline:none;
}