@charset "UTF-8";
/*******

PYH CSS RESET
반응형을 위한 css입니다.

*******/


@media screen and (max-width:639px) {

	/*main*/
	
	.ma1_box { overflow: hidden;  width: 100%; }
	/*menu*/
	.m_menu {width:100%;}
	.m_menu .nav-top {padding:20px;}
	.m_menu .nav-top .btn-x {right:20px;}
	.board .List p { width:63% !important; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size:0.875em; color:#333;}
	.logo a img { vertical-align: middle;margin: 0 auto; display: table-cell;}
	#header {padding: 5px 10px;}

}
@media screen and (max-width:570px) {
	.top-left a img {height: 40px;}
	.top-right a img {height: 40px;}
	#header {height: 80px;padding: 0 10px;}
}
@media screen and (max-width:520px) {
	.search-bar .txt {width: 79% !important;}
	.search-bar span.detail {font-size: 11px !important;}
	#frm2 .modify-infos li .tit ,#frm2 .modify-infos .desc ,#frm2 .modify-info.layer .modify-infos .full ,#frm2 .modify-info.layer .modify-infos input[type=text] , #frm2 .modify-info.layer .modify-infos select {font-size: 11px !important;}
	#frm2 .modify-infos .desc {padding:10px 3% 10px 33% !important;}
	#frm2 .modify-infos li .tit {width: 31% !important;}
	#frm2 .modify-infos .desc select#email_domain {width: 100%; margin-top: 5px;}
	#frm2 .modify-infos .full {width: 98% !important;}
	#frm2 .modify-infos .desc input.small,.modify-info.layer .modify-infos select[name="mphone1"]{width: 29% !important;}
}
@media screen and (max-width:425px) {
	#frm2 .modify-infos .desc input.small {width: 30%;}
	#frm2 .modify-infos .modify-t {width: 3.5% !important; }
	.modify-info.layer .modify-infos select[name="mphone1"] {width: 30%;}
	.modify-info.layer .modify-infos select[name="email_domain"] {width: 100% !important; margin-top: 5px;}
	.modify-info.layer .modify-infos input[name="email_id"] {width: 48% !important;}
	.btnArea img {height:auto !important;width: 22%;}
	.modify-info.layer .modify-infos input[name="email_name"] {width: 47% !important;}
}
@media screen and (max-width:409px) {
	.sub-listbox li a {font-size:11px;}
	.row-inner .member-btn a:last-child {margin-right:0;}
	.row-inner .member-btn a:before {margin:0 auto;background-size:35px !important;width:40px;}
	.member-btn a.member-btn2 {margin-right: 0;}
	.search-bar span.search {width: 18% !important;}
	.modify-info.layer .modify-infos select[name="email_domain"] {width: 98% !important;}
	#frm2 .modify-infos .modify-t {font-size: 10px !important;}
	.modify-info.layer .modify-infos input[name="email_id"] {width: 47% !important;}
	.modify-info.layer .modify-infos input[name="email_name"] {width: 46% !important;}
}

@media screen and (max-width:390px) {
	.footer_r {margin-top:0;} 
	.top-left a img {height: 35px;}
	.top-right a img {height: 35px;}
	.member-list .row-inner .desc {font-size: 12px;}
	.member-list .desc .note-tit ,.member-list .desc .numt {font-size: 13px !important;}
	.member-list .row-inner .tit {font-size: 13px;}
	.m_menu .nav-top .nav-tit {font-size: 15px;}
	.m_menu .nav-top {padding: 20px 15px;}
	.m_menu .nav-top .btn-x {right: 15px; top: 17px;}
	#header {height: auto; padding: 15px 10px;}
	.search-bar .txt {width: 76% !important;}
	.search-bar span.detail {width: 22% !important;}
	.modify-info.layer .modify-infos input[type=button] {font-size: 10px !important;}

}

@media screen and (max-width:330px) {
	.member-list .row-inner .img {width: 25%;}
	.member-list .row-inner .info {width: 70%;}
	.row-inner .member-btn {overflow: hidden; width: 80%; text-align: right; float: right; padding-top: 10px;}
	.row-inner .member-btn a {width: auto;}
	.row-inner .member-btn a:before {background-size: 100% 100% !important; width: 40px;}
	.member-btn a {margin-right: 2% !important;}
	.m_menu .nav-top .nav-tit {font-size: 15px;}
}