/*

2020-04-07 Jinsung Board Common Style
제작자 : 김진성

스타일 축약 사용을 위해 제작

*/

/* 바디는 기본만 적용 다른스타일과 충돌을 막기위함. */
body{margin:0px;}

/* 테이블 기본스타일만 적용 */
table{border-spacing:0px;padding:0px;border:0px;border-collapse:collapse;}

/* 입력 버튼 UL 스타일 */
input[type="text"],[type="password"]{border:solid 1px #d0d3d8;background-color:white;padding:5px;
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
    box-sizing: border-box;         /* Opera/IE 8+ */}

textarea,div,table{
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
    box-sizing: border-box;        /* Opera/IE 8+ */
	resize: none;
}

button{padding:5px;background-color:white;border:solid 1px #d0d3d8;font-size:11px}
ul{list-style:none;}

input:focus, select:focus, option:focus, textarea:focus, button:focus{
	outline: none;
}

label{display:block;padding-left:15px;text-indent:-15px;}
input[type="checkbox"]{width:13px;height:13px;padding:0;margin:0;vertical-align:bottom;position:relative;top:-1px;*overflow: hidden;}
input[type="radio"]{width:13px;height:13px;padding:0;margin:0;vertical-align:bottom;position:relative;top:-1px;*overflow: hidden;}


/* jsLoading */
#jsLoading{display:none;position:fixed;top:0px;left:0px;right:0px;bottom:0px;background-color:#000;opacity:0.5;z-index:50000}
#jsLoadingSpinner{display:none;position:fixed;top:50%;left:50%;margin-left:-50px;margin-top:-150px;z-index:50001;}

.loader,
.loader:after {border-radius: 50%;width: 10em;height: 10em;}
.loader {margin: 60px auto;font-size: 10px;position: relative;text-indent: -9999em;border-top: 1.1em solid rgba(255, 255, 255, 0.2);border-right: 1.1em solid rgba(255, 255, 255, 0.2);
  border-bottom: 1.1em solid rgba(255, 255, 255, 0.2);border-left: 1.1em solid #ffffff;-webkit-transform: translateZ(0);-ms-transform: translateZ(0);transform: translateZ(0);-webkit-animation: load8 1.1s infinite linear;
  animation: load8 1.1s infinite linear;
}

@-webkit-keyframes load8 {0% { -webkit-transform: rotate(0deg); transform: rotate(0deg);}
  100% { -webkit-transform: rotate(360deg); transform: rotate(360deg);}
}
@keyframes load8 {0% { -webkit-transform: rotate(0deg); transform: rotate(0deg);}
  100% {  -webkit-transform: rotate(360deg); transform: rotate(360deg);}
}
/* 로딩아이콘 끝 */


/* 화이트 테이블(White) */
.table_style1{width: 100%;border: 1px solid #d0d3d8;border-collapse: collapse;background-color:#fff}
	table.table_style1 tr{border: 1px solid #d0d3d8;height:30px}
	table.table_style1 td{border: 1px solid #d0d3d8;font-size:12px}
	table.table_style1 th{border: 1px solid #d0d3d8;font-size:12px;background-color:#eeeeee}
/* 화이트 테이블 끝 */



/* 다크 테이블(Dark) */
.table_style2{width: 100%;border: 1px solid #313131;border-collapse: collapse;background-color:#3c3c3c;}
	.table_style2 tr{border: 1px solid #313131;height:30px;}
	.table_style2 td{border: 1px solid #313131;font-size:12px;color:white;}
	.table_style2 th{border: 1px solid #313131;font-size:12px;color:white;background-color:#242424}
/* 다크 테이블 끝 */


/* 깜빡이는 글씨효과 */
.blink {
  animation: blinker 1s linear infinite;
}

@keyframes blinker {  
  50% { opacity: 0.7; }
}

/* 자주사용하는 Border style */
.bd0d3d8{border:solid 1px #d0d3d8}


/* 테스트시 사용하는 빨간선 */
.btest{border:solid 1px red}


/* 정렬 */
.center{text-align:center}
.left{text-align:left}
.right{text-align:right}

/* border bottom line */
.line{border-bottom:solid 1px #d0d3d8;}

/* display:none */
.displayNone{display:none}

.border_black{border:solid 1px #000}

/* 자주사용하는 배경색상 */
.bg_gray{background-color:#f1f1f1}
.bg_white{background-color:#fff}
.bg_black{background-color:#000}
.bg_red{background-color:#d11b1b}
.bg_orange{background-color:#ff9900}
.bg_yellow{background-color:#ffcc00}
.bg_green{background-color:#a4cb3d}
.bg_blue{background-color:#0066ff}
.bg_darkblue{background-color:#000099}
.bg_purple{background-color:#9425be}

/* letter-spacing */
.letterSpacing1{letter-spacing:1px}
.letterSpacing2{letter-spacing:2px}
.letterSpacing-1{letter-spacing:-1px}
.letterSpacing-2{letter-spacing:-2px}
.letterSpacing-3{letter-spacing:-3px}


/* font color */
.fontWhite{color:white;}
.fontRed{color:#ff3737;}
.fontBlue{color:#336199;}
.fontGray{color:#333}
.fontLightGray{color:#868686}
.fontOrange{color:orange;font}

/* bold */
.bold{font-weight:bold}


/* Cursor Pointer , Hover Background Color */
.cursor{cursor:pointer}
.hover:hover{background-color:#ebebeb;cursor:pointer}
.hover_dark:hover{
	background-color:#1f1f1f;
	  transition: 0.3s;
	  transition-delay: 0.0s;
	cursor:pointer
}

.hover_gray:hover{
	background-color:#35373c;
	color:white;
	  transition: 0.3s;
	  transition-delay: 0.0s;
	cursor:pointer
}

.imgCrop1_1{width:150px;height:150px;overflow:hidden;}

.selected{background-color:#d7dddf;cursor:pointer}

#out_div {width: 100%;text-align: center;}
#in_div {display: inline-block;}


/* float */
.fl{float:left}.floatLeft{float:left}
.cb{clear:both}.clearBoth{clear:both}

/* position */
.fixPosition{position:fixed;}
.absPosition{position:absolute}

/* overflow */
.overflowAuto{overflow-y:auto}
.overflowHidden{overflow-y:Hidden}








/* left,right,top,bottom */
.left0{left:0px}.left10{left:10px}.left20{left:20px}.left30{left:30px}.left40{left:40px}.left50{left:50px}.left60{left:60px}.left70{left:70px}.left80{left:80px}.left90{left:90px}.left100{left:100px}.left110{left:110px}.left120{left:120px}.left130{left:130px}.left140{left:140px}.left150{left:150px}.left160{left:160px}.left170{left:170px}.left180{left:180px}.left190{left:190px}.left200{left:200px}.left210{left:210px}
.top0{top:0px}.top10{top:10px}.top20{top:20px}.top30{top:30px}.top40{top:40px}.top50{top:50px}.top60{top:60px}.top70{top:70px}.top80{top:80px}.top90{top:90px}.top100{top:100px}
.right0{right:0px}.right10{right:10px}.right20{right:20px}.right30{right:30px}.right40{right:40px}.right50{right:50px}.right60{right:60px}.right70{right:70px}.right80{right:80px}.right90{right:90px}.right100{right:100px}
.bottom0{bottom:0px}.bottom10{bottom:10px}.bottom20{bottom:20px}.bottom30{bottom:30px}.bottom40{bottom:40px}.bottom50{bottom:50px}.bottom60{bottom:60px}.bottom70{bottom:70px}.bottom80{bottom:80px}.bottom90{bottom:90px}.bottom100{bottom:100px}

/* 투명도 */
.opacity1{opacity:0.1}.opacity2{opacity:0.2}.opacity3{opacity:0.3}.opacity4{opacity:0.4}.opacity5{opacity:0.5}.opacity6{opacity:0.6}.opacity7{opacity:0.7}.opacity8{opacity:0.8}.opacity9{opacity:0.9}

/* 폰트사이즈 */
.fonts10{font-size:10px !important}.fonts11{font-size:11px !important}.fonts12{font-size:12px !important}.fonts13{font-size:13px !important}.fonts14{font-size:14px !important}.fonts15{font-size:15px !important}.fonts16{font-size:16px !important}.fonts17{font-size:17px !important}.fonts18{font-size:18px !important}.fonts19{font-size:19px !important}.fonts20{font-size:20px !important}.fonts25{font-size:25px !important}.fonts30{font-size:30px !important}.fonts40{font-size:40px !important}.fonts50{font-size:50px !important}.fonts80{font-size:80px !important}
.lh10{line-height:10px}.lh20{line-height:20px}.lh30{line-height:30px}.lh40{line-height:40px}.lh50{line-height:50px}.lh200{line-height:200px}
.lineHeight10{line-height:10px}.lineHeight20{line-height:20px}.lineHeight30{line-height:30px}.lineHeight40{line-height:40px}.lineHeight50{line-height:50px}


/* 폰트굵기 조절 700부터 굵어짐 */
.font100{font-weight:100}.font200{font-weight:200}.font300{font-weight:300}.font400{font-weight:400}.font500{font-weight:500}.font600{font-weight:600}.font700{font-weight:700}.font800{font-weight:800}
.fb{font-weight:bold}.fontBold{font-weight:bold}.fontbold{font:bold}.fn{font-weight:normal !important}

/* 여백조절 */
.pt5{padding-top:5px}.pt10{padding-top:10px}.pt20{padding-top:20px}.pt30{padding-top:30px}.pt40{padding-top:40px}.pt50{padding-top:50px}
.pl0{padding-left:0px}.pl3{padding-left:3px}.pl5{padding-left:5px}.pl10{padding-left:10px}.pl20{padding-left:20px}.pl30{padding-left:30px}.pl40{padding-left:40px}.pl50{padding-left:50px}
.pr5{padding-right:5px}.pr10{padding-right:10px}.pr20{padding-right:20px}.pr30{padding-right:30px}.pr40{padding-right:40px}.pr50{padding-right:50px}
.pb5{padding-bottom:5px}.pb10{padding-bottom:10px}.pb20{padding-bottom:20px}.pb30{padding-bottom:30px}.pb40{padding-bottom:40px}.pb50{padding-bottom:50px}
.p5{padding:5px}.p10{padding:10px}.p20{padding:20px}.p30{padding:30px}.p40{padding:40px}.p50{padding:50px}.p60{padding:60px}.p70{padding:70px}.p80{padding:80px}.p90{padding:90px}.p100{padding:100px}



/* 마진조절 */
.mt0{margin-top:0px}.mt5{margin-top:5px}.mt10{margin-top:10px}.mt15{margin-top:15px}.mt20{margin-top:20px}.mt30{margin-top:30px}.mt40{margin-top:40px}.mt50{margin-top:50px}.mt60{margin-top:60px}.mt70{margin-top:70px}.mt80{margin-top:80px}.mt90{margin-top:90px}.mt100{margin-top:100px}.mt100{margin-top:200px}
.ml0{margin-left:0px}.ml5{margin-left:5px}.ml10{margin-left:10px}.ml15{margin-left:15px}.ml20{margin-left:20px}.ml30{margin-left:30px}.ml40{margin-left:40px}.ml50{margin-left:50px}.ml60{margin-left:60px}.ml70{margin-left:70px}.ml80{margin-left:80px}.ml90{margin-left:90px}.ml100{margin-left:100px}
.mr0{margin-right:0px}.mr5{margin-right:5px}.mr10{margin-right:10px}.mr15{margin-right:15px}.mr20{margin-right:20px}.mr30{margin-right:30px}.mr40{margin-right:40px}.mr50{margin-right:50px}.mr60{margin-right:60px}.mr70{margin-right:70px}.mr80{margin-right:80px}.mr90{margin-right:90px}.mr100{margin-right:100px}
.mb0{margin-bottom:0px}.mb5{margin-bottom:5px}.mb10{margin-bottom:10px}.mb15{margin-bottom:15px}.mb20{margin-bottom:20px}.mb30{margin-bottom:30px}.mb40{margin-bottom:40px}.mb50{margin-bottom:50px}.mb60{margin-bottom:60px}.mb70{margin-bottom:70px}.mb80{margin-bottom:80px}.mb90{margin-bottom:90px}.mb100{margin-bottom:100px}
.m0{margin:0px}.m5{margin:5px}.m10{margin:10px}.m20{margin:20px}.m30{margin:30px}

.mt-5{margin-top:-5px}.mt-50{margin-top:-50px}.mt-100{margin-top:-100px}


/* 가로,세로*/
.w10{width:10px}.w20{width:20px}.w30{width:30px}.w40{width:40px}.w50{width:50px}.w60{width:60px}.w70{width:70px}.w80{width:80px}.w90{width:90px}.w100{width:100px}.w110{width:110px}.w120{width:120px}.w130{width:130px}.w140{width:140px}.w150{width:150px}.w160{width:160px}.w170{width:170px}.w180{width:180px}.w190{width:190px}.w200{width:200px}.w300{width:300px}.w380{width:380px}.w400{width:400px}.w500{width:500px}.w600{width:600px}.w700{width:700px}.w800{width:800px}.w900{width:900px}.w1000{width:1000px}.w1100{width:1100px}.w1200{width:1200px}
.w10p{width:10%}.w20p{width:20%}.w30p{width:30%}.w40p{width:40%}.w50p{width:50%}.w60p{width:60%}.w70p{width:70%}.w80p{width:80%}.w90p{width:90%}.w97p{width:97%}.w98p{width:98%}.w99p{width:99%}.w100p{width:100%}
.h10{height:10px}.h20{height:20px}.h30{height:30px}.h40{height:40px}.h50{height:50px}.h60{height:60px}.h70{height:70px}.h80{height:80px}.h90{height:90px}.h100{height:100px}.h150{height:150px}.h200{height:200px}.h250{height:250px}.h300{height:300px}.h320{height:320px}.h350{height:350px}.h400{height:400px}.h500{height:500px}.h550{height:550px}.h600{height:600px}

/* 최소사이즈 */
.min-width500{min-width:500px;}.min-width600{min-width:600px;}.min-width700{min-width:700px;}.min-width800{min-width:800px;}.min-width900{min-width:900px;}.min-width1000{min-width:1000px;}

/* 투명배경 */
.bg_tp{background-color:transparent !important}
.border0{border:0px !important}

/* ************************ 데스크탑 (992~) ************************ */
@media screen and (min-width: 992px), print {
	.mobile{display:none}
}


/* ************************ 태블릿 이하(~991) ************************ */
@media screen and (max-width: 991px) {
	.pc{display:none}
}