@charset "utf-8";

#joinContainer{position:relative; width:100%; margin:0 auto; border-top:1px solid #000;}

/*join*/
#join{width:100%; margin:0 auto;}
#join h2{margin-bottom:20px;}

@media screen {
#joinBox{position:relative; background:url('/eng/image/member/box.jpg') no-repeat; width:679px; height:265px; margin:0 auto; padding:0 0 50px 0;}
}
@media (min-width:320px) and (max-width:680px) {
#joinBox{position:relative; background:url('/eng/image/member/boxtiny.jpg') no-repeat; width:323px; height:265px; margin:0 auto; padding:0 0 50px 0;}
}

#joinBox .formbox{position:absolute; top:124px; left:55px;}
#joinBox .formbox .input_join{display:block; width:136px; height:24px; border:1px solid #e0e0e0; margin-bottom:8px;}
#joinBox .formbox .formright{position:absolute; top:0px; right:-80px;}
#joinBox .joinline{position:relative; background:#e0e0e0; height:1px; width:215px; top:190px; left:55px;}
#joinBox .text{position:relative; top:200px; left:60px; font:12px "verdana";}
#joinBox .text a{color:#666; padding:0 5px 0 0;}
#joinBox .text a b{color:#555;}
#joinBox .text a:hover{text-decoration:underline;}

#Box{/*border-top:6px solid #ef403c;*/ background:#fff; padding:0 0 40px 0;}
#Box h3{margin:35px 0 20px 40px;}
#Box .arr{width:90%; margin:0 auto; height:180px; overflow:auto; border:1px solid #ccc; color:#666; font:12px "verdana"; padding:10px;}
#Box .radioform{font:12px "verdana"; text-align:center; padding:20px 0 0 0; color:#555;}
.btn{text-align:center; margin-top:50px;}
.btn a{padding:0 5px;}

#Box ul{width:90%; margin:0 auto; overflow:hidden; padding:10px; border:1px solid #ccc; clear:both;}
#Box ul li{clear:both; height:40px; border-bottom:1px solid #fff; line-height:40px;}
#Box ul li .tit{float:left; font:12px "verdana"; width:20%; font-weight:bold; background:#ededed; height:40px; line-height:40px; padding:0 10px;}
#Box ul li .textform{float:right; font:12px "verdana"; color:#555; width:70%; padding:0 10px; height:35px; padding:5px 0 0 0;}
#Box ul li .textform .input_txt{border:1px solid #ccc; width:90%; height:20px; font:12px "verdana"; color:#666; padding:5px 5px 0 5px;}
#Box ul li .textform .input_txt1{border:1px solid #ccc; width:15%; height:20px; font:12px "verdana"; color:#666; padding:5px 5px 0 5px;}
#Box ul li .textform .input_txt2{border:1px solid #ccc; width:38%; height:20px; font:12px "verdana"; color:#666; padding:5px 5px 0 5px;}
#Box ul li .textform .input_txt3{border:1px solid #ccc; width:50%; height:20px; font:12px "verdana"; color:#666; padding:5px 5px 0 5px;}
#Box ul li .textform .input_img{vertical-align:middle; padding:0 0 0 10px;}
#Box ul li .point{font:12px "verdana"; color:#ef403c; padding:0 0 0 10px; letter-spacing:-1px;}

@media screen {
#Box ul li p.textform .point{font:12px "verdana"; color:#ef403c; padding:0 0 0 10px; letter-spacing:-1px;}
}
@media (min-width:680px) and (max-width:1040px) { 
#Box ul li{clear:both; height:50px; border-bottom:1px solid #fff; line-height:40px;}
#Box ul li p.textform .point{display:block; padding-top:10px;height:40px; font:12px "verdana"; color:#ef403c; padding:0 0 0 10px; letter-spacing:-1px;}
}
@media (min-width:320px) and (max-width:680px) {
#Box ul li{clear:both; height:50px; border-bottom:1px solid #fff; line-height:40px;}
#Box ul li p.textform .point{display:block; padding-top:10px;height:40px; font:12px "verdana"; color:#ef403c; padding:0 0 0 10px; letter-spacing:-1px;}
}


#Box ul li .point1{font:12px "verdana"; color:#ef403c; padding:0 0 0 10px;}
#Box ul li .selectfont:13px "verdana"; color:#666; vertical-align:middle;}
#Box #line{margin:0 auto; position:relative; background:#e0e0e0; height:1px; width:735px;}

/*idfind*/
#BoxId{/*border-top:6px solid #ef403c;*/ background:#fff; padding:0 0 00px 0; overflow:hidden;}
.idbox{margin:30px 25px 0 25px; width:45%; height:200px; border:1px solid #ccc; float:left;}
.idbox h4{margin:20px;}
.idbox .formbox{position:relative; margin:20px;}
.idbox .formbox span{position:absolute; font:12px "verdana"; color:#555;}
.idbox .formbox .name{top:0; left:0;}
.idbox .formbox .pw{top:35px; left:0;}
.idbox .formbox .id{top:35px; left:0;}
.idbox .formbox .mail{top:35px; left:0;}
.idbox .formbox .mail1{top:70px; left:0;}
.idbox .formbox .btnlogin{right:0;}
.idbox .formbox .input_txt{border:1px solid #ccc; height:17px; width:200px; font:12px "verdana"; color:#666; padding:3px 0 0 0;}
.idbox .formbox strong{display:inline-block; width:100px;}
.idbox .formbox .point{display:block; margin-top:10px; color:#666; font:12px "verdana";}

@media screen {
.idbox{margin:30px 25px 0 25px; width:45%; height:200px; border:1px solid #ccc; float:left;}
}
@media (min-width:680px) and (max-width:1040px) { 
.idbox{margin:30px 25px 0 25px; width:44%; height:200px; border:1px solid #ccc; float:left;}
.idbox .formbox .input_txt{border:1px solid #ccc; height:17px; width:170px; font:12px "verdana"; color:#666; padding:3px 0 0 0;}
}
@media (min-width:320px) and (max-width:680px) {
.idbox{margin:30px 25px 0 25px; width:80%; height:230px; border:1px solid #ccc;}
.idbox .formbox .input_txt{border:1px solid #ccc; height:17px; width:60%; font:12px "verdana"; color:#666; padding:3px 0 0 0;}
.idbox .formbox .name{top:0; left:0;}
.idbox .formbox .id{top:45px; left:0;}
.idbox .formbox .mail{top:45px; left:0;}
.idbox .formbox .mail1{top:90px; left:0;}
.idbox .formbox .btnlogin{right:0;top:15px;}
}




.img_join {cursor:pointer;}


.fbtext {display:inline-block; position:absolute; bottom:-10px; left:10px;}