@charset "utf-8";
/* CSS Document */

input {border:1px solid #dadada;}
.clear {clear: both !important;}


.selectBox {position: relative;display:inline-block;min-width:105px;min-height:28px;vertical-align:middle;background:transparent url(../images/bg_selectbox_arrow.png) no-repeat right center; background-size: 27px 26px;background-color: #fff; border:1px solid #dadada; padding-left:10px; padding-right:35px;}


select:disabled {
    background: rgb(235, 235, 228);
}
/* text-align */
.float-left {
    float: left;
}
.float-right {
    float: right;
}
.vertical-top {
    vertical-align: top;
}
.vertical-middle {
    vertical-align: middle;
}
.vertical-bottom {
    vertical-align: bottom;
}
.clear {
    clear: both !important;
}
.text-bold {
    font-weight: 600;
}
.text-left {
    text-align: left !important;
}
.text-right {
    text-align: right !important;
}
.text-center {
    text-align: center !important;
}
.text-justify {
    text-align: justify !important;
}
.text-nowrap {
    white-space: nowrap !important;
}
.text-lowercase {
    text-transform: lowercase !important;
}
.text-uppercase {
    text-transform: uppercase !important;
}
.text-capitalize {
    text-transform: capitalize !important;
}
.text-purple {
    color: #5d70b2;
}
.text-muted {
    color: #777;
}
.text-primary {
    color: #337ab7;
}
a.text-primary:focus,
a.text-primary:hover {
    color: #286090;
}
.text-success {
    color: #3c763d;
}
a.text-success:focus,
a.text-success:hover {
    color: #2b542c;
}
.text-info {
    color: #31708f;
}
a.text-info:focus,
a.text-info:hover {
    color: #245269;
}
.text-warning {
    color: #8a6d3b;
}
a.text-warning:focus,
a.text-warning:hover {
    color: #66512c;
}
.text-danger {
    color: #a94442;
}
a.text-danger:focus,
a.text-danger:hover {
    color: #843534;
}
.bg-primary {
    color: #fff;
    background-color: #337ab7;
}
a.bg-primary:focus,
a.bg-primary:hover {
    background-color: #286090;
}
.bg-success {
    background-color: #dff0d8; 
}
a.bg-success:focus,
a.bg-success:hover {
    background-color: #c1e2b3;
}
.bg-info {
    background-color: #d9edf7;
}
a.bg-info:focus,
a.bg-info:hover {
    background-color: #afd9ee;
}
.bg-warning {
    background-color: #fcf8e3;
}
a.bg-warning:focus,
a.bg-warning:hover {
    background-color: #f7ecb5;
}
.bg-danger {
    background-color: #f2dede;
}
a.bg-danger:focus,
a.bg-danger:hover {
    background-color: #e4b9b9;
}
/* margin, padding */
.m0 {
    margin: 0 !important;
}
.m2 {
    margin: 2px;
}
.m5 {
    margin: 5px;
}
.m10 {
    margin: 10px;
}
.m20 {
    margin: 20px;
}
.m30 {
    margin: 30px;
}
.m40 {
    margin: 30px;
}
.m50 {
    margin: 50px;
}
.mt0 {
    margin-top: 0 !important;
}
.mt5 {
    margin-top: 5px !important;
}
.mt10 {
    margin-top: 10px !important;
}
.mt20 {
    margin-top: 20px !important;
}
.mt25 {
    margin-top: 25px !important;
}
.mt30 {
    margin-top: 30px !important;
}
.mt40 {
    margin-top: 40px !important;
}
.mt50 {
    margin-top: 50px !important;
}
.mt60 {
    margin-top: 60px !important;
}
.mt70 {
    margin-top: 70px !important;
}
.mt80 {
    margin-top: 80px !important;
}
.mt90 {
    margin-top: 90px !important;
}
.mt100 {
    margin-top: 100px !important;
}
.ml0 {
    margin-left: 0 !important;
}
.ml5 {
    margin-left: 5px !important;
}
.ml10 {
    margin-left: 10px !important;
}
.ml20 {
    margin-left: 20px !important;
}
.ml30 {
    margin-left: 30px !important;
}
.ml40 {
    margin-left: 40px !important;
}
.ml50 {
    margin-left: 50px !important;
}
.ml60 {
    margin-left: 60px !important;
}
.ml70 {
    margin-left: 70px !important;
}
.ml80 {
    margin-left: 80px !important;
}
.ml90 {
    margin-left: 90px !important;
}
.ml100 {
    margin-left: 100px !important;
}
.ml130 {
    margin-left: 130px !important;
}
.ml150 {
    margin-left: 150px !important;
}
.ml170 {
    margin-left: 170px !important;
}
.mlr10 {
    margin-left: 10px !important;
    margin-right: 10px !important;
}
.mlr20 {
    margin-left: 20px !important;
    margin-right: 20px !important;
}
.mlr30 {
    margin-left: 30px !important;
    margin-right: 30px !important;
}
.mlr40 {
    margin-left: 40px !important;
    margin-right: 40px !important;
}
.mlr50 {
    margin-left: 50px !important;
    margin-right: 50px !important;
}
.mr0 {
    margin-right: 0 !important;
}
.mr5 {
    margin-right: 5px !important;
}
.mr10 {
    margin-right: 10px !important;
}
.mr20 {
    margin-right: 20px !important;
}
.mr30 {
    margin-right: 30px !important;
}
.mr40 {
    margin-right: 40px !important;
}
.mr50 {
    margin-right: 50px !important;
}
.mr60 {
    margin-right: 60px !important;
}
.mr70 {
    margin-right: 70px !important;
}
.mr80 {
    margin-right: 80px !important;
}
.mr90 {
    margin-right: 90px !important;
}
.mr100 {
    margin-right: 100px !important;
}
.mb0 {
    margin-bottom: 0 !important;
}
.mb3 {
    margin-bottom: 3px !important;
}
.mb5 {
    margin-bottom: 5px !important;
}
.mb10 {
    margin-bottom: 10px !important;
}
.mb20 {
    margin-bottom: 20px !important;
}
.mb30 {
    margin-bottom: 30px !important;
}
.mb40 {
    margin-bottom: 40px !important;
}
.mb50 {
    margin-bottom: 50px!important;
}
.mb60 {
    margin-bottom: 60px!important;
}
.mb70 {
    margin-bottom: 70px!important;
}
.mb80 {
    margin-bottom: 80px!important;
}
.mb90 {
    margin-bottom: 90px!important;
}
.mb100 {
    margin-bottom: 100px!important;
}
.p0 {
    padding: 0 !important;
}
.p5 {
    padding: 5px !important;
}
.p10 {
    padding: 10px !important;
}
.p20 {
    padding: 20px !important;
}
.p30 {
    padding: 30px !important;
}
.p40 {
    padding: 40px !important;
}
.p50 {
    padding: 50px !important;
}
.p13 {
    padding: 13px !important;
}
.pt0 {
    padding-top: 0 !important;
}
.pt5 {
    padding-top: 5px !important;
}
.pt10 {
    padding-top: 10px !important;
}
.pt15 {
    padding-top: 15px !important;
}
.pt20 {
    padding-top: 20px !important;
}
.pt30 {
    padding-top: 30px !important;
}
.pt40 {
    padding-top: 40px !important;
}
.pt45 {
    padding-top: 45px !important;
}
.pt50 {
    padding-top: 50px !important;
}
.pt60 {
    padding-top: 60px !important;
}
.pb10 {
    padding-bottom: 10px !important;
}
.pb20 {
    padding-bottom: 20px !important;
}
.pb30 {
    padding-bottom: 30px !important;
}
.pl0 {
    padding-left: 0 !important;
}
.pl5 {
    padding-left: 5px !important;
}
.pl10 {
    padding-left: 10px !important;
}
.pl20 {
    padding-left: 20px !important;
}
.pl30 {
    padding-left: 30px !important;
}
.pl40 {
    padding-left: 40px !important;
}
.pl50 {
    padding-left: 50px !important;
}
.pr5 {
    padding-right: 5px !important;
}
.pr10 {
    padding-right: 10px !important;
}
.pr20 {
    padding-right: 20px !important;
}
.pr30 {
    padding-right: 30px !important;
}
.border-tnone {
    border-top: none !important;
}
.border-t0 {
    border-top: 0 !important;
}
.border-t1 {
    border-top: 1px solid #d7d7d7 !important;
}
.border-l1 {
    border-left: 1px solid #d7d7d7 !important;
}
.border-r1 {
    border-right: 1px solid #d7d7d7 !important;
}
.border-0 {
    border: 0 !important;
}
.border-1 {
    border: 1px solid #d7d7d7 !important;
}
.border-2 {
    border: 2px solid #d7d7d7 !important;
}
.border-3 {
    border: 3px solid #d7d7d7 !important;
}
.border-b0 {
    border-bottom: 0 !important;
}
.border-b1 {
    border-bottom: 1px solid #d7d7d7 !important;
}
.border-b2 {
    border-bottom: 2px solid #d7d7d7 !important;
}
.border-b3 {
    border-bottom: 3px solid #d7d7d7 !important;
}
.border-l1 {
    border-left: 1px solid #d7d7d7 !important;
}
.border-r1 {
    border-right: 1px solid #d7d7d7 !important;
}
.border-ra3 {
    border-radius: 3px !important;
    -webkit-border-radius: 3px !important;
    -moz-border-radius: 3px !important;
}
.border-ra7 {
    border-radius: 7px !important;
    -webkit-border-radius: 7px !important;
    -moz-border-radius: 7px !important;
}
.border-rnone {
    border-right: none !important;
}
/* height */
.height-25 {
    height: 25px;
}
.height-30 {
    height: 30px;
}
.height-35 {
    height: 35px;
}
.height-40 {
    height: 40px;
}
.height-135 {
    height: 135px;
}
.height-210 {
    height: 210px;
}
.height-240 {
    height: 240px;
}
.height-290 {
    height: 290px;
}
.height-30per {
    height: 30%;
}
.height-50per {
    height: 50%;
}
.height-100per {
    height: 100%;
}
/* width */
.width-20 {
    width: 20px;
}

.width-50 {
    width: 50px;
}

.width-200 {
    width: 200px;
}
.width-210 {
    width: 210px;
}
.width-370 {
    width: 370px;
}
.width-390 {
    width: 390px;
}
.width-20per {
    width: 20%;
}
.width-25per {
    width: 50%;
}
.width-30per {
    width: 30%;
}
.width-35per {
    width: 35%;
}
.width-40per {
    width: 40%;
}
.width-45per {
    width: 45%;
}
.width-50per {
    width: 50%;
}
.width-55per {
    width: 55%;
}
.width-60per {
    width: 60%;
}
.width-65per {
    width: 65%;
}
.width-70per {
    width:70%;
}
.width-75per {
    width: 75%;
}
.width-80per {
    width: 80%;
}
.width-85per {
    width: 85%;
}
.width-90per {
    width: 90%;
}
.width-99per {
    width: 99% !important;
}
.width-100per {
    width: 100%;
}
/* color */
.text-yellow {
    color: #ffea3c;
}
.text-navy {
    color: #004e79;
}
.text-lightgray {
    color: #f4f4f4;
}
.text-gray {
    color: #ebebeb;
}
.text-darkgray {
    color: #727479;
}
.text-lightpink {
    color: #fbe4ea;
}
.text-pink {
    color: #e44a73;
}
.text-red {
    color: #c8212f;
}
/* background color */
.bg-color-yellow {
    background-color: #ffea3c;
}
.bg-gra-yellow {
    background: #ffea3c;
    /* For browsers that do not support gradients */
    background: -webkit-linear-gradient(left, #fde265 , #f4ca53);
    /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(right, #fde265, #f4ca53);
    /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(right, #fde265, #f4ca53);
    /* For Firefox 3.6 to 15 */
    background: linear-gradient(to right, #fde265 , #f4ca53);
    /* Standard syntax */
}
.bg-color-orange {
    background-color: #f69f42;
}
.bg-gra-orange {
    background: #f69f42;
    /* For browsers that do not support gradients */
    background: -webkit-linear-gradient(left, #f6ae42 , #f68c42);
    /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(right, #f6ae42, #f68c42);
    /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(right, #f6ae42, #f68c42);
    /* For Firefox 3.6 to 15 */
    background: linear-gradient(to right, #f6ae42 , #f68c42);
    /* Standard syntax */
}
/*20180717 추가 시작*/
.bg-gra-blue {
    background: #8b97d7;
    /* For browsers that do not support gradients */
    background: -webkit-linear-gradient(left, #8b97d7 , #a8b3ef);
    /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(right, #8b97d7, #a8b3ef);
    /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(right, #8b97d7, #a8b3ef);
    /* For Firefox 3.6 to 15 */
    background: linear-gradient(to right, #8b97d7 , #a8b3ef);
    /* Standard syntax */
}
.bg-gra-green {
    background: #9ac25f;
    /* For browsers that do not support gradients */
    background: -webkit-linear-gradient(left, #9ac25f , #a7d664);
    /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(right, #9ac25f, #a7d664);
    /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(right, #9ac25f, #a7d664);
    /* For Firefox 3.6 to 15 */
    background: linear-gradient(to right, #9ac25f , #a7d664);
    /* Standard syntax */
}
.bg-gra-pink {
    background: #ea798d;
    /* For browsers that do not support gradients */
    background: -webkit-linear-gradient(left, #ea798d , #ff93a6);
    /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(right, #ea798d, #ff93a6);
    /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(right, #ea798d, #ff93a6);
    /* For Firefox 3.6 to 15 */
    background: linear-gradient(to right, #ea798d , #ff93a6);
    /* Standard syntax */
}
.bg-gra-purple {
    background: #ba8ad3;
    /* For browsers that do not support gradients */
    background: -webkit-linear-gradient(left, #ba8ad3 , #d2ace6);
    /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(right, #ba8ad3, #d2ace6);
    /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(right, #ba8ad3, #d2ace6);
    /* For Firefox 3.6 to 15 */
    background: linear-gradient(to right, #ba8ad3 , #d2ace6);
    /* Standard syntax */
}
/*20180717 추가 끝*/
.bg-navy {
    background-color: #004e79;
}
.bg-lightgray {
    background-color: #f4f4f4;
}
.bg-gray {
    background-color: #ebebeb !important;
}
.bg-deepgray {
    background-color: #bcbcbc;
}
.bg-darkgray {
    background-color: #727479;
}
.bg-lightpink {
    background-color: #fbe4ea;
}
.bg-pink {
    background-color: #e44a73;
}
.bg-white {
    background-color: #fff;
}

.display_none{display: none !important;}
.display_block{display: block !important;}

/*color 컬러 */

.f_blue {color:#2d89d7 !important;}
.f_red {color:#f15641 !important;}
.f_orange {color:#fe9423 !important;}
.f_green {color:#0ebba1 !important;}
.f_gray {color:#969696 !important;}
.f_purple {color:#ca74ff !important;}

.bold {font-weight: 600;}

/* width css col-sm 좌우 12기본 */
.row {
    display: flex;
    flex-wrap: wrap;
}

.col {
    max-width: 100%;
    flex-basis: 0;
    flex-grow: 1;
}

.col-sm-1 {
    max-width: 33.33333%;
    flex: 0 0 33.33333%;
}
.col-sm-2 {
    max-width: 16.66667%;
    flex: 0 0 16.66667%;
}
.col-sm-3 {
    max-width: 25%;
    flex: 0 0 25%;
}
.col-sm-4 {
    max-width: 33.33333%;
    flex: 0 0 33.33333%;
}
.col-sm-5 {
    max-width: 41.66667%;
    flex: 0 0 41.66667%;
}
.col-sm-6 {
    max-width: 50%;
    flex: 0 0 50%;
}
.col-sm-7 {
    max-width: 58.33333%;
    flex: 0 0 58.33333%;
}
.col-sm-8 {
    max-width: 66.66667%;
    flex: 0 0 66.66667%;
}
.col-sm-9 {
    max-width: 75%;
    flex: 0 0 75%;
}
.col-sm-10 {
    max-width: 83.33333%;
    flex: 0 0 83.33333%;
}
.col-sm-11 {
    max-width: 91.66667%;
    flex: 0 0 91.66667%;
}
.col-sm-12 {
    max-width: 100%;
    flex: 0 0 100%;
}




/* 추가 */
.w10 {width:10% !important;}
.w15 {width:15% !important;}
.w20 {width:20% !important;}
.w25 {width:25% !important;}
.w30 {width:30% !important;}
.w35 {width:35% !important;}
.w40 {width:40% !important;}
.w45 {width:45% !important;}
.w50 {width:50% !important;}
.w52 {width:52% !important;}
.w55 {width:55% !important;}
.w60 {width:60% !important;}
.w65 {width:65% !important;}
.w70 {width:70% !important;}
.w80 {width:80% !important;}
.w85 {width:85% !important;}
.w90 {width:90% !important;}
.w95 {width:95% !important;}
.w100 {width:100% !important;}

.fl {float:left !important; }
.fr {float:right !important; }
.fn {float:none !important; }
