@charset "utf-8";
/* THEETHRU (http://www.theethru.com) */

/*  Reset */
 body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,p,table,th,td,form,fieldset,legend,textarea,input,select,textarea,button{margin:0;padding:0}
html,body{height:100%}
body{font-family:'NanumGothic','나눔고딕','ng','돋음',dotum,sans-serif;color:#808080;letter-spacing:-0.5px;margin:0;font-size:medium; overflow-x:auto;}
ul, ol{list-style: none}
ul li{display: inline-block;}
a{color:inherit; text-decoration: none;}


/*  set font */
@font-face {
font-family:ng;
src:url(font/NanumGothic.eot);
src:url(font/NanumGothic.eot?#iefix) format('embedded-opentype'), url(font/NanumGothic.woff) format('woff'),url(font/NanumGothic.ttf) format('truetype');
}

/*  common setting */
ul.t2{    list-style: disc;}
ul.t2 li{display:block;}

.half{width:50%; float:left; box-sizing:border-box}
.trisection {width:33.33333%;float:left; box-sizing:border-box;}

.invisible{visibility: hidden;}

.img-wrapper {display: inline-block; position: relative; vertical-align: middle;}
.img-wrapper img{width:100%; border:0px;}
a img{border:0px}
.m {display:none !important;}
.pc{display:block !important;}
.pc-inline{display:inline-block !important;}
.pc-table{display: table-cell !important;}
.opacity50{
            -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
            -moz-opacity: 0.50;
            -khtml-opacity: 0.50;
            opacity: 0.50;
          }
.opacity25{
            -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=25)";
            -moz-opacity: 0.25;
            -khtml-opacity: 0.25;
            opacity: 0.25;
            }

.float-left{float:left;}
.float-right{float:right;}

.text-skyblue{color:#07abea;}
.text-gray{color:#3f5358}
.text-lightgreen{color:#94D5E5;}
.text-orange{color:#E3701B;}

.text-center{text-align: center !important;}
.text-left{text-align: left !important;}
.text-right{text-align: right !important;}

.block{display: block;}
.inline-block{display: inline-block;}


.bg-black{background-color:#000;}

.text-underline{text-decoration: underline;}

.font-size-1em{font-size:1em;}
.font-size-0-875em{font-size:0.875em;}
.font-size-1-25em{font-size:1.25em;}

.disabled{opacity: 0.0; cursor:default;}
.link{color:#07abea; cursor:pointer;}

a.disabled{opacity:1.0}
button.disabled{opacity:1.0}

/*  set placeholder colors */
::-webkit-input-placeholder {   color: #aaaaaa;}
:-moz-placeholder { color: #aaaaaa;  }  /* Firefox 18- */   
::-moz-placeholder {  color: #aaaaaa;  }    /* Firefox 19+ */  
:-ms-input-placeholder {     color: #aaaaaa;  }

.input-wrapper{vertical-align: middle;}
.input-wrapper input{background-color: transparent;    outline: 0;    width: 100%;    height: 100%;    border: 0;    padding: 0 20px; position: absolute; color:#000000;}
.input-wrapper input:disabled{ background-color: #fff;color:#000000; opacity: 1}

.input-wrapper.disabled{opacity:1.0; border:1px solid #afafaf; }
.input-wrapper.disabled input{color:#afafaf; background-color:#efefef;}

.input-wrapper.t1{    border: 1px solid #fff;    position: relative;    height: 35px;    box-sizing: border-box; text-align: left;}
.input-wrapper.t1 .bg{    background-color: #fff;    width: 100%;    height: 100%;    position: absolute;}

.input-wrapper.t2{    border: 1px solid #b8b8b8;    position: relative;    height: 35px;    box-sizing: border-box; text-align: left;}
.input-wrapper.t2 .bg{    background-color: #fff;    width: 100%;    height: 100%;    position: absolute;}
.input-wrapper.t2 input{padding:5px 8px 5px 8px; color:#555; font-size:0.875em;}

.input-wrapper.t3{     position: relative;    height: 50px;    border: 0}
.input-wrapper.t3 .bg{}
.input-wrapper.t3 input{    color: #808080;}

.input-wrapper.t2.disabled input{color:#afafaf;}
.input-wrapper.t3.disabled input{color:#afafaf;}

input[type=date] {
    font-family: 'NanumGothic','나눔고딕','ng','돋음',dotum,sans-serif;
    font-size:1.4em;
}


.border-1px-gray{border:1px solid #d2d2d2;}
.border-bottom-none{border-bottom: 0 !important}


.select-wrapper {    border: 1px solid #b8b8b8;    position: relative;    height: 35px; box-sizing: border-box; vertical-align: middle;    padding: 3px;    padding-left: 0;background: url('../image/arrow.png')  97% no-repeat; /* 화살표 이미지 */}
.select-wrapper label{position: absolute; top: 10px;left: 5px; color:#555; font-size: 0.875em; font-weight: 400; }
.select-wrapper select{color:#000000;margin-right: 30px; opacity: 0;filter: alpha(opacity=0);}

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

.select-wrapper select {padding:5px 8px; width:100%; border:none; box-shadow: none; background-color: transparent; background-image: none; -webkit-appearance:none; -moz-appearance:none; -o-appearance:none; -ms-appearance:none; appearance:none;    font-size: 0.875em; outline:none;}
.select-wrapper select option{text-align: center; color:#808080;}
.select-wrapper .arrow {    background-image: url('../image/arrow.png');    width: 16px;    height: 14px;    position: absolute;    right: 10px;    top: 10px;}
.select-wrapper.t1 {    border: 1px solid #b8b8b8;    position: relative;    height: 35px;    box-sizing: border-box; vertical-align: middle}
.select-wrapper.t2 {    border: 1px solid #D3D3D3;    position: relative;    height: 35px;    box-sizing: border-box; vertical-align: middle}
.select-wrapper.t2 select{color:#aaa;margin-left: 15px; margin-right: 30px;}
.select-wrapper.t2.fit{    display: inline-block;    height: auto;}
.select-wrapper.t2.fit .arrow{top:7px;}
.select-wrapper.t2 select{    }
/*.select-wrapper.t3 {    border: 1px solid #b8b8b8;    position: relative;    height: 35px;    box-sizing: border-box; vertical-align: middle;    padding: 3px;    padding-left: 0;}
*/
.select-wrapper.disabled{background-color:#efefef; opacity:1;}
.select-wrapper.disabled label{color:#efefef;}

button.btn{background-color:#fff; outline: 0; border:0; padding: 10px; cursor:pointer;}
button.btn-submit{background-color: #07abea; color:#fff;}
button.btn-default{background-color:#d2d2d2; color:#fff;}
button.btn-delete{background-color: #B4B4B4; color:#fff;}

button.btn-md{font-size: 1.0em; padding:6px 20px;}
button.btn-lg{font-size: 1.25em;}
button.btn-wide{padding:10px 50px}
button.btn-lightgreen{background-color:#94D5E5; color:#fff;}


/*  custom radio set */
.radio-wrapper{  position:relative; height:20px; width:20px; display:inline-block;}
.radio-wrapper input[type='radio']{
    opacity: 0.00;
    height:100%; width:100%;    position:absolute; top: 0;    left: 0;   z-index: 2; cursor:pointer;}
}
.radio-wrapper input[type='radio'] + label{
    display:inline-block;
    padding:0;
    position:absolute;
    top:0;
    left:0;
    z-index: 1;
}

.radio-wrapper.t1 input[type='radio'] + label{
    width:20px;height:20px;
    background:url('../image/radio_btn.png') no-repeat;
    background-size:20px;
    background :none\9;
    position: absolute;
    left: 0;

}


.radio-wrapper.v2 input[type='radio'] + label{
    width:20px;height:20px;
    background:url('../image/radio_btn.png') no-repeat;
    background-size:20px;
    background :none\9;
    position: absolute;
    left: 0;
    top:5px;
}

.radio-wrapper input[type='radio']:checked + label{
    display:inline-block;
}

.radio-wrapper.t1 input[type='radio']:checked + label{
    background:url('../image/radio_btn_active.png') no-repeat;
    background-size:20px;
    background :none\9;
}

.radio-wrapper.v2 input[type='radio']:checked + label{
    background:url('../image/radio_btn_active.png') no-repeat;
    background-size:20px;
    background :none\9;
}
.rdio{
    font-size:1.0em;
}


.cbox-wrapper{    position: relative;    height: 16px;    width: 16px; display: inline-block;    vertical-align: middle;    margin-top: -5px;}
.cbox-wrapper input[type="checkbox"] {
    opacity: 0.00;
    height: 100%;    width: 100%;    
    position: absolute;    top: 0;    left: 0;   
    z-index: 2; cursor:pointer;}

.cbox-wrapper input[type="checkbox"] + label{
    display:inline-block;
    padding: 0 0 0 0px;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}
.cbox-wrapper input[type="checkbox"]:checked + label{
    display:inline-block;
    padding: 0 0 0 0px;
}

/*  round shape checkbox img */
.cbox-wrapper.cbox-round input[type='checkbox'] + label{
    height: 20px;
    width: 20px;
    background:url('../image/login_web_off.png');
    background-size: 20px;
    background :none\9;
}
.cbox-wrapper.cbox-round input[type="checkbox"]:checked + label{
    height: 20px;
    width: 20px;
    background:url('../image/login_web_on.png') no-repeat;
    background-size: 20px;
    background :none\9;

   /*  filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../image/login_web_on.png', sizingMethod='scale');
    -ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../image/login_web_on.png', sizingMethod='scale')"; */
}

/* rectangle shape checkbox img */
.cbox-wrapper.cbox-rectangle {height: 20px;width: 20px; margin-top: 0;vertical-align: middle;}
.cbox-wrapper.cbox-rectangle input[type='checkbox'] + label{
    height: 20px;
    width: 20px;
    background:url('../image/check_off.png') no-repeat;
    background-size: 20px;
    background :none\9;
}
.cbox-wrapper.cbox-rectangle input[type="checkbox"]:checked + label{
    height: 20px;
    width: 20px;
    background:url('../image/check_on.png') no-repeat;
    background-size: 20px;
    background :none\9;
}

.accordeon-chkbox {
    display: none;
}

.accordeon{
    cursor: pointer;
}

.accordeon-content {
    height: 0;
    overflow:hidden;
    background-color: gold;
    
    -webkit-transition: height 1s ease;
    -moz-transition: height 1s ease;
    -ms-transition: height 1s ease;
    -o-transition: height 1s ease;
    transition: height 1s ease;
}

.accordeon-chkbox:checked ~ .accordeon-content {
    height: 400px;
}


.rounded-corner-5{border-radius: 5px; 
-moz-border-radius: 5px; 
-webkit-border-radius: 5px; 
border: 1px solid #D2D2D2;}

.rounded-corner-7{border-radius: 7px; 
-moz-border-radius: 7px; 
-webkit-border-radius: 7px; 
border: 1px solid #D2D2D2;}

.rounded-corner-10{border-radius: 10px; 
-moz-border-radius: 10px; 
-webkit-border-radius: 10px; 
border: 1px solid #D2D2D2;}

.circle{
    -moz-border-radius: 50px/50px;
    -webkit-border-radius: 50px 50px;
    border-radius: 50px/50px;
    width:50px;
    height:50px;
    background-color: #D5D7EE
}

@media screen and (max-width:640px)
{
	body{font-size:medium;}
	.m {display:block !important;}
	.pc{display:none !important;}
    .pc-inline{display:none !important;}
    .pc-table{display:none !important;}
    
    .header{margin-top:40px;}	
}