/*------------박스크기(%)------------ */
.per10 { width:10%; }
.per20 { width:20%; }
.per25 { width:25%; }
.per30 { width:30%; }
.per31 { width:31%; }
.per32 { width:32%; }
.per33 { width:33%; }
.per333 { width:33.3%; }
.per34 { width:34%; }
.per35 { width:35%; }
.per40 { width:40%; }
.per49 { width:49%; }
.per50 { width:50%; }
.per60 { width:60%; }
.per70 { width:70%; }
.per80 { width:80%; }
.per90 { width:90%; }
.per100 { width:100%; }



/*------------박스크기(px)----------*/
.px5 { width:5px; }
.px10 { width:10px; }
.px15 { width:15px; }
.px20 { width:20px; }
.px25 { width:25px; }
.px30 { width:30px; }
.px35 { width:35px; }
.px40 { width:40px; }
.px45 { width:45px; }
.px50 { width:50px; }
.px55 { width:55px; }
.px60 { width:60px; }
.px65 { width:65px; }
.px70 { width:70px; }
.px75 { width:75px; }
.px80 { width:80px; }
.px85 { width:85px; }
.px90 { width:90px; }
.px95 { width:95px; }
.px100 { width:100px; }
.px105 { width:105px; }
.px110 { width:110px; }
.px115 { width:115px; }
.px120 { width:120px; }
.px125 { width:125px; }
.px130 { width:130px; }
.px135 { width:135px; }
.px140 { width:140px; }
.px145 { width:145px; }
.px150 { width:150px; }
.px155 { width:155px; }
.px160 { width:160px; }
.px165 { width:165px; }
.px170 { width:170px; }
.px175 { width:175px; }
.px180 { width:180px; }
.px185 { width:185px; }
.px190 { width:190px; }
.px195 { width:195px; }
.px200 { width:200px; }
.px205 { width:205px; }
.px210 { width:210px; }
.px215 { width:215px; }
.px220 { width:220px; }
.px225 { width:225px; }
.px230 { width:230px; }
.px250 { width:250px; }
.px300 { width:300px; }
.px305 { width:305px; }
.px310 { width:310px; }
.px315 { width:315px; }
.px320 { width:320px; }
/* 여기 까지 px5단위 */

.px350 { width:350px; }
.px380 { width:380px; }
.px390 { width:390px; }
.px400 { width:400px; }
.px500 { width:500px; }
.px600 { width:600px; }
.px700 { width:700px; }
.px800 { width:800px; }
.px900 { width:900px; }
.px1000 { width:1000px; }


.maxpx100{max-width:100px;}
.maxpx200{max-width:200px;}


/* 버튼 스타일 */
.button-type1{  color:#fff; font-size:17px; padding:5px 20px;  color:#fff !important; font-weight:bold; border-radius:3px; cursor:pointer; border:none; display:inline-block; }

.button-type2{ border-radius:4px; color:#fff !important; font-weight:bold; padding:5px 20px 6px 20px; font-size:17px !important; line-height:24px; display:inline-block; border:none; cursor:pointer; }

/* 인풋 스타일 */
.input-01{ font-size:15px; color:#333; line-height:24px; padding:3px 10px; border-radius:3px; height:20px; margin:0 0px 0 0; border:1px solid #dbdbdb}
.input-02{ font-size:15px; color:#333; line-height:24px; padding:6px 10px; border-radius:4px; height:20px; margin:0 0px 0 0; border:1px solid #dbdbdb}

/*------------폰트사이즈(px)------------ */
.font-s12 { font-size:12px; }
.font-s13 { font-size:13px; }
.font-s14 { font-size:14px; }
.font-s15 { font-size:15px; }
.font-s16 { font-size:16px; }
.font-s17 { font-size:17px; }
.font-s18 { font-size:18px; }
.font-s19 { font-size:19px; }
.font-s20 { font-size:20px; }
.font-s21 { font-size:21px; }
.font-s25 { font-size:25px; }


/*------------폰트 컬러------------*/
.color-333 { color:#333333; }
.color-666 { color:#666666; }
.color-999 { color:#999999; }
.color-2472d9 { color:#2472d9; }
.color-fff { color:#ffffff; }
.color-000 { color:#000000; }

.color-black    { color:#000000; }
.color-grey1    { color:#727272; }
.color-red      { color:#ce2929; }
.color-red2      { color:#f04b52; }
.color-green    { color:#8aab61; }
.color-blue     { color:#5889ab; }
.color-iv      { color:#d5cbca; }
.color-ae8a79  {color:#ae8a79;}
.color-695154  {color:#695154;}
/*------------BG컬러------------*/
.bg-blue { background:#3897f0; }
.bg-black { background:#333; }
.bg-black2 { background:#666; }
.bg-red{background:#ee760c; }
.bg-orange { background:#e9700f; }
.bg-orange2 { background:#ee960c; } 
.bg-green { background:#419923; }
.bg-green2 {background:#73b748; }
.bg-gray { background:#f0f0f0; }
.bg-gray1 { background:#f9f9f9; }
.bg-ivory { background:#fafafa; }


/*------------float 속성------------*/
.fl { float:left; }
.fr { float:right; }


/*------------overflow 속성-----------*/
.o-hidden { overflow:hidden; }

/*-------------포지션 속성------------*/
.absolute { position:absolute; }
.static { position:static; }
.fixed { position:fixed; }
.relative { position:relative; }

/*--------------vertical 속성---------*/
.ver-middle { vertical-align:middle; }
.ver-bottom { vertical-align:bottom; }
.ver-top { vertical-align:top; }
.ver-base { vertical-align:baseline; }

/*------------display속성-----------*/
.block { display:block; }
.inline { display:inline; }
.inline-block { display:inline-block; }
.none { display:none !important; }

/*------------text 정렬 속성------------*/
.text-l { text-align:left; }
.text-r { text-align:right; }
.text-c { text-align:center; }

/*------------글자가길어졌을때 한줄(...)로 나오게 하는 CSS------------*/
.text-break { white-space:nowrap; text-overflow:ellipsis; overflow:hidden; }

/*------------margin 속성------------*/
.mg0 { margin:0px; }
.mg5 { margin:5px; }
.mg10 { margin:10px; }
.mg15 { margin:15px; }
.mg20 { margin:20px; }
.mg25 { margin:25px; }
.mg30 { margin:30px; }
.mg40 { margin:40px; }
.mg50 { margin:50px; }
.mg60 { margin:60px; }
.mg70 { margin:70px; }
.mg80 { margin:80px; }
.mg90 { margin:90px; }
.mg100 { margin:100px; }

.mg-l0 { margin-left:0px; }
.mg-l5 { margin-left:5px; }
.mg-l10 { margin-left:10px; }
.mg-l15 { margin-left:15px; }
.mg-l20 { margin-left:20px; }
.mg-l25 { margin-left:25px; }
.mg-l30 { margin-left:30px; }
.mg-l35 { margin-left:35px; }
.mg-l40 { margin-left:40px; }
.mg-l42 { margin-left:42px; }
.mg-l45 { margin-left:45px; }
.mg-l50 { margin-left:50px; }
.mg-l55 { margin-left:55px; }
.mg-l60 { margin-left:60px; }
.mg-l65 { margin-left:65px; }
.mg-l70 { margin-left:70px; }
.mg-l75 { margin-left:75px; }
.mg-l80 { margin-left:80px; }
.mg-l85 { margin-left:85px; }
.mg-l90 { margin-left:90px; }
.mg-l95 { margin-left:95px; }
.mg-l100 { margin-left:100px; }

.mg-l100 { margin-left:100px; }
.mg-l150 { margin-left:150px; }
.mg-l200 { margin-left:200px; }
.mg-l250 { margin-left:250px; }
.mg-l300 { margin-left:300px; }
.mg-l350 { margin-left:350px; }
.mg-l400 { margin-left:400px; }
.mg-l450 { margin-left:450px; }
.mg-l500 { margin-left:500px; }
 
.mg-r1 { margin-right:1px; }
.mg-r0 { margin-right:0px; }
.mg-r5 { margin-right:5px; }
.mg-r10 { margin-right:10px; }
.mg-r15 { margin-right:15px; }
.mg-r20 { margin-right:20px; }
.mg-r25 { margin-right:25px; }
.mg-r30 { margin-right:30px; }
.mg-r35 { margin-right:35px; }
.mg-r40 { margin-right:40px; }
.mg-r45 { margin-right:45px; }
.mg-r50 { margin-right:50px; }
.mg-r55 { margin-right:55px; }
.mg-r60 { margin-right:60px; }
.mg-r65 { margin-right:65px; }
.mg-r70 { margin-right:70px; }
.mg-r75 { margin-right:75px; }
.mg-r80 { margin-right:80px; }
.mg-r85 { margin-right:85px; }
.mg-r90 { margin-right:90px; }
.mg-r95 { margin-right:95px; }
.mg-r100 { margin-right:100px; }

.mg-t0 { margin-top:0px; }
.mg-t5 { margin-top:5px; }
.mg-t10 { margin-top:10px; }
.mg-t15 { margin-top:15px; }
.mg-t20 { margin-top:20px; }
.mg-t25 { margin-top:25px; }
.mg-t30 { margin-top:30px; }
.mg-t35 { margin-top:35px; }
.mg-t40 { margin-top:40px; }
.mg-t45 { margin-top:45px; }
.mg-t50 { margin-top:50px; }
.mg-t55 { margin-top:55px; }
.mg-t60 { margin-top:60px; }
.mg-t65 { margin-top:65px; }
.mg-t70 { margin-top:70px; }
.mg-t75 { margin-top:75px; }
.mg-t80 { margin-top:80px; }
.mg-t85 { margin-top:85px; }
.mg-t90 { margin-top:90px; }
.mg-t95 { margin-top:95px; }
.mg-t100 { margin-top:100px; }

.mg-b0 { margin-bottom:0px; }
.mg-b5 { margin-bottom:5px; }
.mg-b10 { margin-bottom:10px; }
.mg-b15 { margin-bottom:15px; }
.mg-b20 { margin-bottom:20px; }
.mg-b25 { margin-bottom:25px; }
.mg-b30 { margin-bottom:30px; }
.mg-b35 { margin-bottom:35px; }
.mg-b40 { margin-bottom:40px; }
.mg-b45 { margin-bottom:45px; }
.mg-b50 { margin-bottom:50px; }
.mg-b55 { margin-bottom:55px; }
.mg-b60 { margin-bottom:60px; }
.mg-b65 { margin-bottom:65px; }
.mg-b70 { margin-bottom:70px; }
.mg-b75 { margin-bottom:75px; }
.mg-b80 { margin-bottom:80px; }
.mg-b85 { margin-bottom:85px; }
.mg-b90 { margin-bottom:90px; }
.mg-b95 { margin-bottom:95px; }
.mg-b100 { margin-bottom:100px; }
.mg-b200 { margin-bottom:200px; }


/*------------padding 속성------------*/
.pd0 { padding:0px; }
.pd5 { padding:5px; }
.pd10 { padding:10px; }
.pd15 { padding:15px; }
.pd20 { padding:20px; }
.pd25 { padding:25px; }
.pd30 { padding:30px; }
.pd40 { padding:40px; }
.pd50 { padding:50px; }
.pd60 { padding:60px; }
.pd70 { padding:70px; }
.pd80 { padding:80px; }
.pd90 { padding:90px; }
.pd100 { padding:100px; }

.pd-l0 { padding-left:0px; }
.pd-l5 { padding-left:5px; }
.pd-l10 { padding-left:10px; }
.pd-l15 { padding-left:15px; }
.pd-l20 { padding-left:20px; }
.pd-l25 { padding-left:25px; }
.pd-l30 { padding-left:30px; }
.pd-l35 { padding-left:35px; }
.pd-l40 { padding-left:40px; }
.pd-l45 { padding-left:45px; }
.pd-l50 { padding-left:50px; }
.pd-l55 { padding-left:55px; }
.pd-l60 { padding-left:60px; }
.pd-l65 { padding-left:65px; }
.pd-l70 { padding-left:70px; }
.pd-l75 { padding-left:75px; }
.pd-l80 { padding-left:80px; }
.pd-l85 { padding-left:85px; }
.pd-l90 { padding-left:90px; }
.pd-l95 { padding-left:95px; }
.pd-l100 { padding-left:100px; }
.pd-l145 { padding-left:145px;}

.pd-r0 { padding-right:0px; }
.pd-r5 { padding-right:5px; }
.pd-r10 { padding-right:10px; }
.pd-r15 { padding-right:15px; }
.pd-r20 { padding-right:20px; }
.pd-r25 { padding-right:25px; }
.pd-r30 { padding-right:30px; }
.pd-r35 { padding-right:35px; }
.pd-r40 { padding-right:40px; }
.pd-r45 { padding-right:45px; }
.pd-r50 { padding-right:50px; }
.pd-r55 { padding-right:55px; }
.pd-r60 { padding-right:60px; }
.pd-r65 { padding-right:65px; }
.pd-r70 { padding-right:70px; }
.pd-r75 { padding-right:75px; }
.pd-r80 { padding-right:80px; }
.pd-r85 { padding-right:85px; }
.pd-r90 { padding-right:90px; }
.pd-r95 { padding-right:95px; }
.pd-r100 { padding-right:100px; }

.pd-b0 { padding-bottom:0px; }
.pd-b5 { padding-bottom:5px; }
.pd-b10 { padding-bottom:10px; }
.pd-b15 { padding-bottom:15px; }
.pd-b20 { padding-bottom:20px; }
.pd-b25 { padding-bottom:25px; }
.pd-b30 { padding-bottom:30px; }
.pd-b35 { padding-bottom:35px; }
.pd-b40 { padding-bottom:40px; }
.pd-b45 { padding-bottom:45px; }
.pd-b50 { padding-bottom:50px; }
.pd-b55 { padding-bottom:55px; }
.pd-b60 { padding-bottom:60px; }
.pd-b65 { padding-bottom:65px; }
.pd-b70 { padding-bottom:70px; }
.pd-b75 { padding-bottom:75px; }
.pd-b80 { padding-bottom:80px; }
.pd-b85 { padding-bottom:85px; }
.pd-b90 { padding-bottom:90px; }
.pd-b95 { padding-bottom:95px; }
.pd-b100 { padding-bottom:100px; }

.pd-t0 { padding-top:0px; }
.pd-t5 { padding-top:5px; }
.pd-t10 { padding-top:10px; }
.pd-t15 { padding-top:15px; }
.pd-t20 { padding-top:20px; }
.pd-t25 { padding-top:25px; }
.pd-t30 { padding-top:30px; }
.pd-t35 { padding-top:35px; }
.pd-t40 { padding-top:40px; }
.pd-t45 { padding-top:45px; }
.pd-t50 { padding-top:50px; }
.pd-t55 { padding-top:55px; }
.pd-t60 { padding-top:60px; }
.pd-t65 { padding-top:65px; }
.pd-t70 { padding-top:70px; }
.pd-t75 { padding-top:75px; }
.pd-t80 { padding-top:80px; }
.pd-t85 { padding-top:85px; }
.pd-t90 { padding-top:90px; }
.pd-t95 { padding-top:95px; }
.pd-t100 { padding-top:100px; }


/* 기타 */
.bold{ font-weight:bold; color:#333}
.error{color: red;}