/*클럽메인(소개)*/
#main-club {margin-top:120px;}
#main-club.main-club_pad1 {margin-top:15px;}
#main-club .section01 { padding:50px 10px 30px;}
#main-club .section01 .inner { max-width:1190px; margin:0 auto; text-align:center;}
#main-club .section01 .inner .tmp { display:inline-block;max-width:400px; font-size:28px; font-weight:bold; text-align:center; line-height:400px; padding:10px;}
#main-club .section01 .inner .tmp img { width:100%;height:auto;}

#main-club .section02 { padding:50px 10px; background:#f7f6f0; border-bottom:solid 1px #e8e8e2;}
#main-club .section02 .inner { max-width:1190px; margin:0 auto; padding:10px; }
#main-club .section02 .inner .join { max-width:800px; margin:0 auto;text-align:center; }
#main-club .section02 .inner h4 { display:inline-block; zoom:1; *display:inline; font-size:28px; font-weight:bold; padding:0 30px 25px ; border-bottom: solid 3px #99968a; letter-spacing:-2px;}
#main-club .section02 .inner h5 { display:inline-block; zoom:1; *display:inline; font-size:14px; font-weight:bold; padding:13px 0 8px ;}
#main-club .section02 .inner .about { display:block; font-size:16px; font-weight:normal; padding:20px 0 ;text-align:center; line-height:25px;letter-spacing:-1px;}
#main-club .section02 .inner .center_area1 {display:inline-block; margin:0 auto;}
#main-club .section02 .inner .center_area2 {width:100%; text-align:center; padding:20px 0 0;}
#main-club .section02 .inner .btn { text-align:center; padding-top:9px; }
#main-club .section02 .inner .btn a { display:inline-block; zoom:1; *display:inline; padding:10px 40px; font-size:23px; font-weight:bold; text-align:center; background:#ffed00; border-radius:4px; }
#main-club .section02 .inner ul { padding-top:4px; }
#main-club .section02 .inner ul li { font-size:14px; font-weight:normal; margin:0 0 6px;}
#main-club .section02_type1 { padding:0 10px; background:#ffffff; border-bottom:solid 0px #e8e8e2;}

#main-club .section02 .inner .club_out { margin-top:30px;}
#main-club .section02 .inner .club_out .club_out_button {display:inline-block;padding:3px;background:#000;color:#aaa;cursor:pointer;}
#main-club .section03 { overflow:hidden; clear:both; padding:0 10px 50px;}
#main-club .section03 .notice { max-width:400px; margin:0 auto; text-align:center;}
#main-club .section03 .notice .inner { padding:0; }
#main-club .section03 .notice .inner h4 { font-size:18px; font-weight:800; color:#4d4b45; position:relative; border-bottom:solid 1px #e6e4df; height:37px; text-indent:3px; }
#main-club .section03 .notice .inner h4 span { position:absolute; top:0px; right:2px; margin-top:-2px; }
#main-club .section03 .notice .inner ul { padding-top:4px; }
#main-club .section03 .notice .inner ul li { background:url(../images/commons/bullet_dot.png) no-repeat 3px center; margin:16px 0 16px 0;  }
#main-club .section03 .notice .inner ul li a { color:#66635c; font-size:14px; font-weight:normal; padding:0 80px 0 12px; display:block; height:17px; position:relative;  overflow: hidden; text-overflow: ellipsis;  display: -webkit-box !important; -webkit-line-clamp: 1; -webkit-box-orient: vertical;  *display:block;letter-spacing:-0.5px;}
#main-club .section03 .notice .inner ul li a span { position:absolute; top:0px; right:0px; color:#99968a; font-size:14px; }
#main-club .section03 .notice .inner ul li a:hover { text-decoration:underline; }


.join-reg { text-align:center; border-bottom:solid 1px #e8e8e2; border-top:solid 3px #e8e8e2; padding:50px 20px;  }
.join-reg h4 { font-size:32px; font-weight:bold; border-bottom:solid 3px #99968a; display:inline-block; zoom:1; *display:inline; padding:0 30px 15px 30px; margin-bottom:30px; }
.join-reg .desc { font-size:17px; max-width:800px; margin:0 auto; line-height:29px; }
.join-reg .form { background:#f7f6f0; border:solid 1px #cccac4;max-width:800px; margin:0 auto; margin-top:40px; padding:20px; text-align:center; }
.join-reg .form h5 { font-size:17px; font-weight:bold; padding-bottom:10px; }
.join-reg .form textarea { width:100%; border:solid 1px #e8e8e2; height:110px; }
.join-reg .form a { display:inline-block; zoom:1; *display:inline; padding:10px 40px; font-size:18px; font-weight:bold; text-align:center; background:#99968a; color:#fff; border-radius:4px; margin-top:20px; }

.joinlist { }
.joinlist table { border-top:solid 2px #cccac4; width:100%; }
.joinlist table thead th { font-size:14px; font-weight:bold; color:#4d4b45; padding:17px 5px;  border-bottom:solid 1px #cccac4 }
.joinlist table tbody td { font-size:14px; font-weight:normal; color:#4d4b45; padding:17px 5px; border-bottom:solid 1px #e5e4df; line-height:16px; vertical-align:middle;  }
.joinlist table tbody td a { color:inherit; font-size:inherit; font-weight:inherit; }
.joinlist table tbody td a:hover { font-weight:bold;  }
.joinlist table tbody td.photo { vertical-align:top; }
.joinlist table tbody td.profile { vertical-align:top; }
.joinlist table tbody td.profile > span { display:block; }
.joinlist table tbody td.profile > span.name { font-size:15px; font-weight:bold; padding:5px 0; }
.joinlist table tbody td.profile > span.name .date { font-size:14px; font-weight:normal; padding:5px 0; }
.joinlist table tbody td.profile > span.desc { line-height:21px; padding-right:10px; margin-top:5px; }

.joinlist table tbody td.profile .btn { margin-top:10px; }
.joinlist table tbody td.profile .btn > span.state { display:inline-block; zoom:1; *display:inline; font-size:16px; font-weight:bold; padding-bottom:8px; margin-right:10px; }
.joinlist table tbody td.profile .btn > a { display:inline-block; zoom:1; *display:inline; padding:8px 30px; font-size:14px; font-weight:bold; text-align:center; background:#99968a; color:#fff; border-radius:4px; margin-top:5px; }

.memberlist {  overflow-x:auto; }
.memberlist table { border-top:solid 2px #cccac4; width:100%;min-width:300px; }
.memberlist table thead th { font-size:13px; font-weight:bold; color:#4d4b45; padding:17px 5px; text-align:center;  border-bottom:solid 1px #cccac4 ;letter-spacing:-0.5px;}
.memberlist table tbody td { font-size:13px; font-weight:normal; color:#4d4b45; padding:17px 5px; text-align:center; border-bottom:solid 1px #e5e4df; line-height:16px; vertical-align:middle; word-break:break-all; letter-spacing:-0.5px}
.memberlist table tbody td select { border:solid 1px #cccac4; height:30px; width:95%;  }

.setting { }
.setting table { width:100%; border-top:solid 2px #cccac4;  }
.setting table tr > th { font-size:14px;  vertical-align:middle; border-bottom:solid 1px #cccac4; padding:6px 15px; height:32px; line-height:19px; width:110px; text-align:left; font-weight:bold; background:#f7f6f0; letter-spacing:-1px}
.setting table tr > td { font-size:14px;  vertical-align:middle; border-bottom:solid 1px #cccac4; padding:8px 15px 8px 10px; height:32px; line-height:19px;word-break:break-all; }
.setting table tr > td input {border:solid 1px #e6e4df; height:28px; width:100%; text-indent:10px; font-size:14px; vertical-align:middle; }
.setting table tr > td input.file {border:solid 0px #e6e4df; text-indent:0px; }
.setting table tr > td.option input { border:none; font-size:14px; font-weight:normal; width:auto; height:auto; vertical-align:middle; margin-top:-1px;  }
.setting table tr > td.option label { font-weight:bold; padding-right:6px; color:#777; }
.setting table tr > td.option > ul > li { float:left; }
.setting table tr > td textarea { width:100%; min-height:100px; line-height:19px; border:solid 1px #e6e4df; font-size:13px;  }
.setting .btn { text-align:center; margin-top:22px; padding-bottom:40px; }
.setting .btn a { color:#fff; font-size:14px; font-weight:bold; background-color:#99968a; display:inline-block; zoom:1; *display:inline; padding:0px 35px; height:38px; line-height:36px; white-space:nowrap; vertical-align:middle; border-radius:4px; border:solid 1px #888; } 

.setting .btn2 { text-align:center; margin-top:22px; padding-bottom:40px; }
.setting .btn2 a { color:#fff; font-size:14px; font-weight:bold; background-color:#666; display:inline-block; zoom:1; *display:inline; padding:0px 10px; height:38px; line-height:36px; white-space:nowrap; vertical-align:middle; border-radius:0px; border:solid 1px #333; letter-spacing:-0.5px;} 


.setting table tr > td a.btn { display:inline-block; zoom:1; *display:inline; padding:6px 30px; font-size:14px; font-weight:bold; text-align:center; background:#99968a; color:#fff; border-radius:4px; margin-top:5px; }

.setting .tip { padding:3px 0 0 0;}
.setting h4 { background:url(../images/member/icon01.png) no-repeat left center; padding-left:29px; font-size:17px; font-weight:bold; margin-bottom:10px; letter-spacing:-1px}
.setting .reg { margin-top:40px; }
.setting .etc { margin-top:40px; }
.setting .adminlist table { width:auto; border-top:none;  }
.setting .adminlist table td,.setting .adminlist table th { border:none; background:#fff; width:auto; padding:3px 0; color:#777;}
.setting .adminlist table td { padding-left:10px; text-align:right; color:#777;}
.setting .adminlist table td  select { border:solid 1px #cccac4; height:28px;  }

.setting .reg table td a.btn { display:inline-block; zoom:1; *display:inline; padding:3px 30px; font-size:14px; font-weight:bold; text-align:center; background:#99968a; color:#fff; border-radius:4px; margin-top:3px; }
.setting .reg .tip { font-weight:bold; background:#f7f6f0; margin-top:8px; padding:5px 3px; }
.setting .reg .people table { clear:both; width:100%; border-top:none; border:solid 1px #ddd; }
.setting .reg .people table td { border:none; font-size:13px; background:#fff; width:auto; padding:2px 5px; color:#777; height:27px; text-align:center; border-bottom:solid 1px #f4f4f4;}
.setting .reg .people table tr:last-child td { border-bottom:solid 1px #ddd; }
.setting .reg .people table th { border:none; background:#f7f6f0; width:auto; padding:2px 5px; color:#777; height:27px; text-align:center; border-bottom:solid 1px #eee; }

.setting .reg select { border:solid 1px #cccac4;  }
.setting .reg .form { padding-bottom:10px; }
.setting .reg .form ul > li { float:left; }
.setting .reg .form ul > li label { font-weight:bold; color:#777; } 
.setting .reg .form ul > li label input { width:auto; margin:0 5px; height:22px; vertical-align:middle; }
.setting .reg .form ul > li a { margin-top:0px; }

.chat .stage { display:table; border:solid 1px #e6e4df; width:100%; height:550px; }
.chat .stage > div { display:table-cell; vertical-align:top; }
.chat .stage > div.user { width:227px; border-left:solid 1px #eee; background:#fafafa; }
.chat .stage > div.user h4 { font-size:16px; font-weight:bold;  }
.chat .stage > div.user .list { padding:20px; }
.chat .stage > div.user .list li { display:block; padding:5px 10px 5px 20px;  font-weight:bold; font-size:14px; background:url(../images/commons/icon_people.png) no-repeat left center; background-size:16px 16px;  }
.chat .form { margin-top:10px; }
.chat .form input { float:left; width:80%; height:38px; font-size:14px; line-height:38px; border:solid 1px #e6e4df; text-indent:10px; }
.chat .form a { float:right; display:block; width:19%; height:42px; line-height:42px; text-align:center; font-size:14px; font-weight:bold; background:#99968a; color:#fff; }

.chat .stage > div.chatlog {  }
.chat .stage > div .container { height:100%; overflow-y:scroll; padding:10px ; }
.chat .stage > div .container ul li { display:table; width:100%; font-size:14px; line-height:21px; padding:6px 0; clear:both; }
.chat .stage > div .container ul li.alert { font-weight:bold; color:#F63; padding-bottom:5px;  }
.chat .stage > div .container ul li.noti { display:block; font-weight:bold; color:#000; padding:3px 3px 3px 3px; background:#f6f6f6; margin:4px 0; }
.chat .stage > div .container ul li.user {  }
.chat .stage > div .container ul li.user .img { display:table-cell; vertical-align:top; width:57px;  }
.chat .stage > div .container ul li.user .img img { border-radius:50%; overflow:hidden; border:solid 1px #eeedea; }
.chat .stage > div .container ul li.user dl { display:table-cell; vertical-align:top;  }
.chat .stage > div .container ul li.user dl dt { font-size:13px; font-weight:bold; padding-left:8px; }
.chat .stage > div .container ul li.user dl dd { font-weight:normal; background:url(../images/commons/box_left_pointer.png) no-repeat left 14px; padding:5px 0 0 10px; }
.chat .stage > div .container ul li.user dl dd p { font-size:13px; display:inline-block; zoom:1; *display:inline; background:#f7f6f0; border-radius:5px; padding:8px 10px; max-width:65%; text-align:justify; }
.chat .stage > div .container ul li.me { color:#FC0 }
.chat .stage > div .container ul li.me dl { display:table-cell; vertical-align:top;  }
.chat .stage > div .container ul li.me dl dt { font-size:13px; font-weight:bold; padding-left:8px; }
.chat .stage > div .container ul li.me dl dd { font-weight:normal; background:url(../images/commons/box_right_pointer.png) no-repeat right 14px; padding:5px 10px 0 0px; text-align:right; }
.chat .stage > div .container ul li.me dl dd p { font-size:13px; display:inline-block; zoom:1; *display:inline; background:#ffd333; border-radius:5px; padding:8px 10px; max-width:65%; text-align:justify; color:#4d4b45; }


@media all and (max-width: 820px) {
	.chat .stage > div .container ul li.user dl dd p { max-width:80%; }
	.chat .stage > div .container ul li.me dl dd p { max-width:80%; }
}


@media all and (max-width: 640px) {
	.joinlist table tbody td.photo { width:90px !important; }
	.joinlist table tbody td.photo	img { width:100px; height:auto !important; }
	
	.setting .reg .form ul > li { width:100%; padding-bottom:3px; }
	.setting .reg .form ul > li label input { width:100%; margin-left:0px; }
	
	.chat .stage > div.user { display:none; }
	.chat .stage > div .container ul li.user .img { display:table-cell; vertical-align:top; width:44px;  }
	.chat .stage > div .container ul li.user .img img { border-radius:50%; overflow:hidden; border:solid 1px #eeedea; width:40px; height:40px; }
	.chat .stage > div .container ul li.user dl dt  { font-size:12px; }
	.chat .stage > div .container ul li.user dl dd p { font-size:12px; line-height:19px;padding:8px 10px; max-width:70%; }
	.chat .stage > div .container ul li.me dl dd p { font-size:12px; line-height:19px;padding:8px 10px; max-width:70%; }

	#main-club .section01 .inner .tmp img { margin-top:0px;}
	#main-club .section01 { padding:50px 10px 30px;margin-top:-50px;}
}

@media all and (max-width: 460px) {
	.joinlist table tbody td.profile .btn > span.state { display:block; }
	.joinlist table tbody td.photo { display:none; }
	
	.setting table tr > th { width:50px; font-size:13px; }
	.setting table tr > td { font-size:13px; }
	
}


@media all and (max-width: 370px) {

}