@charset "UTF-8";

/*
	Document	: buttons.css
	Created on	: 10. 12. 18 오후 3:35
	Author		: Nexist
	Description	: 버튼 스타일을 잡습니다.
*/
#buttons{padding:50px;text-align:center}

/* 버튼 설정 */
.btn,
.btn input ,
.btn a ,
.btn button {display:inline-block;overflow:visible;position:relative;margin:0;padding:0;border:0;background:url('../images/common/btnBg.gif') no-repeat;font-size:12px;font-family:'dotum';color:#333 !important;text-decoration:none !important;vertical-align:middle;white-space:nowrap;cursor:pointer}
.btn-plus button {display:inline-block;width:12px;height:12px;overflow:visible;position:relative;margin:0;padding:0;border:0;background:url('../images/common/icon_plus.gif') no-repeat;cursor:pointer}
.btn-minus button {display:inline-block;width:12px;height:12px;overflow:visible;position:relative;margin:0;padding:0;border:0;background:url('../images/common/icon_minus.gif') no-repeat;cursor:pointer}
.btn-plus.gray button {width:14px;height:14px;background:url('../images/common/icon_plus_gray.png') no-repeat;}
.btn-minus.gray button {width:14px;height:14px;background:url('../images/common/icon_minus_gray.png') no-repeat;}
/* //버튼 설정 */

/* 사이즈 설정 */
.small{padding-right:1px; background-position:right 0;}
.medium{padding-right:1px; background-position:right -100px;}
.large{padding-right:1px; background-position:right -200px;height:30px;;}
/* //사이즈 설정 */

/* 디테일 */
.small a,.small input,.small button{height:17px;padding:3px 7px 0;background-position:0 0;font-size:11px;line-height:15px;letter-spacing:-1px}
.medium a,.medium input,.medium button{height:20px;padding:5px 10px 0;background-position:0 -100px;font-size:12px;line-height:18px;font-weight:bold;letter-spacing:-1px}
.large a,.large input,.large button{height:25px;padding:7px 10px 0;background-position:0 -200px;font-size:12px;line-height:20px;font-weight:bold;letter-spacing:-1px}
.small input,.small button {height:20px;padding:0 7px;font-size:11px;line-height:20px}
.medium input,.medium button {height:25px;padding:0 10px 0 13px;line-height:25px}
.large input,.large button{height:31px;padding:0 13px;line-height:31px}

/* //디테일 */

/* 페이지 버튼 */
.btn .page{padding:4px 9px 0;font-size:12px !important;font-weight:700;color:#666;letter-spacing:-2px}
/* //페이지 버튼 */

/* 오버시 */
.small:hover{background-position:right -50px}
.medium:hover{background-position:right -150px}
.large:hover{background-position:right -250px}
.small:hover a,.small:hover input,.small:hover button{background-position:0 -50px;color:#ff3232}
.medium:hover a,.medium:hover input,.medium:hover button{background-position:0 -150px;color:#ff3232}
.large:hover a,.large:hover input,.large:hover button{background-position:0 -250px;color:#ff3232}



/* //오버시 */

/* 컬러 설정 */
.small.black{background-position:right -350px}
.medium.black{background-position:right -450px}
.large.black{background-position:right -550px}

.small.black a,.small.black input,.small.black button{background-position:0 -350px;color:#FFF !important}
.medium.black a,.medium.black input,.medium.black button{background-position:0 -450px;color:#FFF !important}
.large.black a,.large.black input,.large.black button{background-position:0 -550px;color:#FFF !important}
.small.black input,.small.black button{color:#FFF !important}
.medium.black input,.medium.black button{color:#FFF !important}
.large.black input,.large.black button{color:#FFF !important}

.small.black:hover{background-position:right -400px}
.medium.black:hover{background-position:right -500px}
.large.black:hover{background-position:right -600px}
.small.black:hover a,.small.black:hover input,.small.black:hover button{background-position:0 -400px;color:#DDD !important}
.medium.black:hover a,.medium.black:hover input,.medium.black:hover button{background-position:0 -500px;color:#DDD !important}
.large.black:hover a,.large.black:hover input,.large.black:hover button{background-position:0 -600px;color:#DDD !important}

.small.cyanblue{background-position:right -650px}
.medium.cyanblue{background-position:right -750px}
.large.cyanblue{background-position:right -850px}

.small.cyanblue a,.small.cyanblue input,.small.cyanblue button{background-position:0 -650px;color:#FFF !important}
.medium.cyanblue a,.medium.cyanblue input,.medium.cyanblue button{background-position:0 -750px;color:#FFF !important}
.large.cyanblue a,.large.cyanblue input,.large.cyanblue button{background-position:0 -850px;color:#FFF !important}
.small.cyanblue input,.small.cyanblue button{color:#FFF !important}
.medium.cyanblue input,.medium.cyanblue button{color:#FFF !important}
.large.cyanblue input,.large.cyanblue button{color:#FFF !important}

.small.cyanblue:hover{background-position:right -700px}
.medium.cyanblue:hover{background-position:right -800px}
.large.cyanblue:hover{background-position:right -900px}
.small.cyanblue:hover a,.small.cyanblue:hover input{background-position:0 -700px;color:#EEE}
.medium.cyanblue:hover a,.medium.cyanblue:hover input{background-position:0 -800px;color:#EEE}
.large.cyanblue:hover a,.large.cyanblue:hover input{background-position:0 -900px;color:#EEE}

.small.red{background-position:right -950px}
.medium.red{background-position:right -1050px}
.large.red{background-position:right -1150px}

.small.red a,.small.red input,.small.red button{background-position:0 -950px;color:#FFF !important}
.medium.red a,.medium.red input,.medium.red button{background-position:0 -1050px;color:#FFF !important}
.large.red a,.large.red input,.large.red button{background-position:0 -1150px;color:#FFF !important}
.small.red input,.small.red button{color:#FFF !important}
.medium.red input,.small.red button{color:#FFF !important}
.large.red input,.small.red button{color:#FFF !important}

.small.red:hover{background-position:right -1000px}
.medium.red:hover{background-position:right -1100px}
.large.red:hover{background-position:right -1200px}
.small.red:hover a,.small.red:hover input,.small.red:hover button{background-position:0 -1000px;color:#EEE}
.medium.red:hover a,.medium.red:hover input,.medium.red:hover button{background-position:0 -1100px;color:#EEE}
.large.red:hover a,.large.red:hover input,.large.red:hover button{background-position:0 -1200px;color:#EEE}

.btn.grayarrow {padding:0 15px; background-position:right -1240px}
.btn.grayarrow a,.btn.grayarrow input,.btn.grayarrow button{background-position:0 -1240px;letter-spacing:-1px;height:20px;padding:2px 7px 0;font-size:11px;line-height:20px; color:#333;}
.btn.grayarrow:hover {background-position:right -1240px}
.btn.grayarrow:hover a,.btn.grayarrow:hover input,.btn.grayarrow:hover button{background-position:0 -1240px;}

.btn.bluearrow {padding:0 15px; background-position:right -1270px}
.btn.bluearrow a,.btn.bluearrow input,.btn.bluearrow button{background-position:0 -1270px;letter-spacing:-1px;height:20px;padding:2px 7px 0;font-size:11px;line-height:20px; color:#fff !important}
.btn.bluearrow:hover {background-position:right -1270px}
.btn.bluearrow:hover a,.btn.bluearrow:hover input,.btn.bluearrow:hover button{background-position:0 -1270px; color:#eee !important}

.btn.bluegray {padding-right:2px; background-position:right -1300px}
.btn.bluegray a,.btn.bluegray input,.btn.bluegray button{background-position:0 -1300px;letter-spacing:-1px;height:27px;padding:2px 7px 0;font-size:11px;line-height:25px; color:#fff !important}
.btn.bluegray:hover {background-position:right -1300px}
.btn.bluegray:hover a,.btn.bluegray:hover input,.btn.bluegray:hover button{background-position:0 -1300px; color:#eee !important}

/* //컬러 설정 */

/* 아이콘설정(A태그에만 적용) */
.icon a{vertical-align:middle;}
.icon-right a {padding-right:5px;}
.medium .plus{width:20px;height:14px;background-position:0px -300px; vertical-align:middle; margin-top:-3px;}
.large  .plus{width:20px;height:14px;background-position:0px -300px; vertical-align:middle;}
.medium .pencle{width:20px;height:14px;background-position:-30px -300px; vertical-align:middle; margin-top:-3px;}
.large  .pencle{width:20px;height:14px;background-position:-30px -300px; vertical-align:middle;}
.medium .minus{width:20px;height:14px;background-position:-60px -300px; vertical-align:middle; margin-top:-3px;}
.large  .minus{width:20px;height:14px;background-position:-60px -300px; vertical-align:middle;}
.medium .check{width:20px;height:14px;background-position:-90px -300px; vertical-align:middle; margin-top:-3px;}
.large  .check{width:20px;height:14px;background-position:-90px -300px; vertical-align:middle;}
.medium .people{width:20px;height:14px;background-position:-120px -300px; vertical-align:middle; margin-top:-3px;}
.large  .people{width:20px;height:14px;background-position:-120px -300px; vertical-align:middle;}
.medium .config{width:20px;height:14px;background-position:-150px -300px; vertical-align:middle; margin-top:-3px;}
.large  .config{width:20px;height:14px;background-position:-150px -300px; vertical-align:middle;}
.medium .search{width:20px;height:14px;background-position:-180px -300px; vertical-align:middle; margin-top:-3px;}
.large  .search{width:20px;height:14px;background-position:-180px -300px; vertical-align:middle;}
.large  .arrowleft{background:url('../images/common/btn_arrow_l.gif') no-repeat;width:15px;height:12px;vertical-align:middle; background-position:0px 1px;}
.large  .arrowright{background:url('../images/common/btn_arrow_r.gif') no-repeat;width:15px;height:12px;vertical-align:middle; background-position:10px 1px;}
.small  .checkleft{margin-left:-3px;background:url('../images/common/icon_check.gif') no-repeat;width:13px;height:7px;vertical-align:middle;}
/* //아이콘설정 */


/* Drop */

.drop {background-position:0 -1240px}
.drop.hover,
.drop:hover{background-position:0 -1271px}
.drop.hover a,.drop.hover input,
.drop:hover a,.drop:hover input {background-position:right -1271px;color:#fff !important;}
.drop a,.drop input{height:20px;padding:3px 20px 2px 10px;background-position:right -1240px;font-size:11px;line-height:15px;letter-spacing:-1px; font-weight:normal;}
.drop a {padding:0px 20px 0px 10px; line-height:20px;}

/* Drop 확장형(a태그만 사용가능) */
.drop_multi_main {background-position:0 -1240px}
.drop_multi_main:hover{background-position:0 -1271px}
.drop_multi_main:hover a{background-position:right -1271px;color:#fff !important;}
.drop_multi_main a {height:20px;padding:0px 5px 0px 10px; line-height:20px;background:none;font-size:11px;letter-spacing:-1px; font-weight:normal;}
.drop_multi_sub {background:url('../images/common/select_bg_back.gif') no-repeat; background-position:right 0px}
.drop_multi_sub:hover{background-position:right -20px}
.drop_multi_sub:hover a{background-position:right -1271px;color:#fff !important;}
.drop_multi_sub a {height:20px;padding:0px 20px 0px 0px; line-height:20px;background-position:right -1240px;font-size:11px;line-height:15px;letter-spacing:-1px; font-weight:normal;}



table.mqs-menu {border:0px;border-collapse:collapse;}
table.mqs-menu td {background-color:#fbfbfb; border:1px solid #dfdfe4; border-bottom:1px solid #c5c7ce;}
table.mqs-menu td.selected {background-color:#fff; border-bottom:0px;}
table.mqs-menu td a {display:inline-block; padding:4px 0px; width:135px; text-align:center; color:#9194a1}
table.mqs-menu td.selected a {font-weight:bold; color:#333}


.black_btn {border:0px; background-color:#000; color:#fff; font-family:dotum; font-size:11px; height:20px; line-height:20px; letter-spacing:-1px; padding:0px 5px; cursor:pointer; vertical-align:middle;}
.gray_btn {border:0px; background-color:#777; color:#fff; font-family:dotum; font-size:11px; height:20px; line-height:20px; letter-spacing:-1px; padding:0 5px; cursor:pointer}
.white_btn {display:inline-block; height:20px; line-height:20px; background:url('../images/common/btn_ps_bg.gif') no-repeat right top; padding:0 8px 0 0;}
.white_btn button,.white_btn a,.white_btn input[type='button'] {font-size:11px; color:#515151; border:none; margin:0px; padding:0 0 0 8px; height:20px; line-height:20px; background:url('../images/common/btn_ps_bg.gif') no-repeat left top;}