/*
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6,  blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form,  legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
*/

* {
    margin: 0;
    padding: 0;
    list-style: none;
}

* a {
    text-decoration: none;
    color: #222;
}

html {height: 100%; min-height: 730px; }

body {
    background-color: #ffffff;
	height:100%;
    margin: 0;
    padding: 0;
    font-family: 'Malgun Gothic', sans-serif;
}

/* 모바일 수평 스크롤 금지 */
html, body {
max-width: 100%;
overflow-x: hidden;
}


	/* header { width:100%; background:#4c4949 url("../../images/login/login_logo_brown.png") no-repeat  ; 
				height:50px;background-position: center left; box-shadow: 0 0 10px 0 grey; border-bottom:1px solid #343434; } */
	.outer {  display: table;  position: absolute;  top: -60px;  left: 0;  height: 100%;  width: 100%; }
	.middle {   display: flex; height: calc(100% - 185px); justify-content: center; align-items: center; }
	
	.inner { box-sizing : border-box; width:710px; padding-top:62px; height:355px; border-radius:1.3em; -moz-border-radius: 1.3em; -webkit-border-radius: 1.3em; background: rgba(255, 255, 255, 0.17); }
	/*로고영역 너비 */ .inner h1 { width:84%; height:59px; margin:0 auto; background-image: url('../images/login/login_logo.png'); background-repeat:no-repeat; font-size:0; }
	
	.box:after { content:"";display:block;clear:both; }
	/*로그인 영역 너비 */.box { width:85%; margin:0 auto ; padding-bottom:25px; border-top:1px solid rgb(255, 255, 255, .3); }

	/*아이디 영역 상단위치 */ .login { float:left; width:100%; padding:40px 45px 0px 45px; position:relative; font-size:0.77em; color:#fff; font-weight:normal; }
	
	#inputs input {  margin-left:20px; width:300px; border: 1px solid #d1d1d1; margin-bottom:8px; padding:12px;   }  
	#inputs input:focus { background-color: #fff; border-color: #00a564; outline: none;}
	/*로그인버튼 상단위치 */ #loginBtn {width:150px; padding:36px 0px;  background-color: #00a564; border:none; cursor: pointer; color: #fff; 
				     position:absolute; top:40px; right:37px; font-size:1.3em; font-weight:bold;}
	#loginBtn:hover,#loginBtn:focus  { background-color:#009451;	 }	
	#loginBtn2 { display:none; }
	.login .save-id, .login .save-session { float:left; padding:9px 0 0 64px; font-size:0.8em;position:relative; width:50%; color:#fff; font-weight:normal;}

	.login ul { font-size:1.2em; margin-top:50px; }
	.login li { display:inline-block; padding:40px 20px 0; color:#4b4948; font-size:0.8em; }
	.login li a { text-decoration:none; color:#4b4948; }
	.login li a:hover { color:#009451 /*009451   236ab9  */ ;display:block; }
	.login ul span { color:#999; }

	.beo-checkbox { font-weight:normal; font-size:1.5em;}
	/* Image */
	.mySlides { float:right; width:425px;display: none;  }
	.mySlides img { vertical-align: middle;}
	/* Fading animation */
	.fade {
	  -webkit-animation-name: fade;
	  -webkit-animation-duration: 1.5s;
	  animation-name: fade;
	  animation-duration: 1.5s;
	}

	@-webkit-keyframes fade {
	  from {opacity: .4} 
	  to {opacity: 1}
	}

	@keyframes fade {
	  from {opacity: .4} 
	  to {opacity: 1}
	}

.bx-wrapper .bx-pager {
	z-index : 99999;
	padding-left: 40px;
}

.slider {
	float:right;width: 425px;
}

.footer div.footer_wrap { width:100%; }
.footer div.sub_wrap { width:100%; padding:30px; border-top:1px solid rgba(255, 255, 255, 0.15); }
.footer ul.sub_menu { width:800px; margin:0 auto; text-align:center;font-size:12px; }
.footer ul.sub_menu li { color:rgba(255, 255, 255, 0.7); }
.footer ul.sub_menu li a { padding: 0 52px; cursor: pointer;}
.footer ul.sub_menu li a:hover { color:#236ab9; }


.sns { position:relative; }
.toggle { display:none; position:absolute; bottom:25px; left:0;  border:1px solid #d7d7d7; text-align:left; background:#fff;}
.toggle li { line-height:38px;  }
.toggle li a { color:#444; padding:10px 0 0 15px !important; }

.footer div.company_wrap { width:100%; }
.footer ul.address { width:800px;margin:0 auto; font-size:13px; position:relative;padding:40px 0; }
.footer div.company_wrap img { position:absolute; top:40%; }
.footer div.company_wrap li { padding:0 0 4px 160px; list-style: none; color:#c7c7c7; }
.footer div.company_wrap li.tel_num { font-weight:bold; color:#c7c7c7; }


/*  비디오 추가 */
#myVideo {
  position: fixed;
  right: 0;
  bottom: 0;
  min-width: 100%; 
  min-height: 100%;
  z-index: -10001;
}

.content {
  position: fixed;
  top: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.7);
  color: #000;
  width: 100%;
  height: 100%;
  padding: 0px;
  z-index: -10000;
}



@media only screen and (max-width:1024px) {
	.inner { width:570px; height:330px; padding-top:49px; }
	.inner h1 { width:80%; height:59px; }
	.login { padding:40px 21px 0px 30px; }
	.box { width:82%; margin:0 auto ; padding-bottom:25px; border-top:1px solid rgb(255, 255, 255, .3); }
	#inputs input {  width:207px; }  
	#loginBtn {width:129px; position:absolute;  right:30px; height:92px; }
	.footer { display:none; }

}



/* 미디어 쿼리 320-600 */
@media only screen and (max-device-width : 768px) {
	.inner { width:89%; height:440px; margin-top:100px; margin:0 auto; padding-top:69px;}
	.inner h1 { width:83%; border:0px solid red;  margin: 0 auto; background-repeat:no-repeat; }	

	.login { float:none;width:100%;  margin:0 auto; padding:0; position:relative; padding-top:30px;    }
	
	#inputs input { margin:0 0 8px; padding-bottom:10px; width:100%; border: 1px solid #d1d1d1; padding:12px;  font-size:14px; color:#333; } 
	
	.login .save-id, .login .save-session { float:left; padding:9px 0 0 0; font-size:0.8em;position:relative;width:50%;margin-bottom:15px; }

	#loginBtn2 { display:block; width:100%; padding:15px 0px; background-color: #00a564; font-size:1.5em; border:none; cursor: pointer; color: #fff; 
				     font-size:1.3em; font-weight:bold;}
	#loginBtn2:hover,#loginBtn2:focus  { background-color:#009451;	 }

	#loginBtn { display:none; }

	#inputs img { display:none; } 
	
	.login ul { font-size:0.9em; margin:0 0 10px 0;text-align:center; } 
	.login ul li:first-child { display:none; }
	.login ul span.join { display:none; }

}


@media only screen and (max-device-width : 403px) {
	.inner { width:89%; height:425px; margin-top:0px; padding-bottom:20px; padding-top:61px;  }
	.inner h1 { width:83%; border:0px solid red;  padding:0 0 20px 2px; margin: 0 auto; background-image: url('../images/login/login_logo2.png'); background-repeat:no-repeat; }	
	.login { padding-top:30px; }
}



@media only screen and (max-device-width : 354px) {
	.inner { width:89%; height:387px; margin-top:0px; padding-bottom:0px; padding-top:56px;   }
	.inner h1 { width:82%; height: 42px;  border:0px solid red;  padding:0 0 0px 2px; margin: 0 auto; background-image: url('../images/login/login_logo3.png'); background-repeat:no-repeat; }	
	.login { padding-top:20px; }
}