@charset "utf-8";

body { 
   overflow-y:hidden;
   overflow-x:hidden;
   top:50%;
   left:50%;
   margin-left:-540px;
   margin-top:-320px;
   position:absolute;
   /* margin-left: auto;
   margin-right: auto;
   display: table;
   position: relative; */ 
}
	/*자체모달*/
.container{
  width:100%;
}
.modal-btn-box{
  width:100%;
  text-align:center;
}
.modal-btn-box button{
  display:inline-block;
  width:150px;
  height:50px;
  background-color:#ffffff;
  border:1px solid #e1e1e1;
  cursor:pointer;
  padding-top:8px;
}
.popup-wrap{
  background-color:rgba(0,0,0,.3);
  justify-content:center;
  align-items:center;
  position:fixed;
  top:0;
  left:0;
  right:0;
  bottom:0;
  display:none;
  padding:15px;
}
.popup{
  width:100%;
  max-width:800px;
  background-color:#ffffff;
  border-radius:10px;
  overflow:hidden;
  background-color:#b00e30;
  box-shadow: 5px 10px 10px 1px rgba(0,0,0,.3);
}

.container2{
	 display:flex;
}
.popup-head{
  width:100%;
  height:50px;
  display:flex;
  align-items:center;
  justify-content:center;
 color:#ffffff;
}
.head-title {
    font-size: 30px;
   
    font-weight: 300;
    letter-spacing: -3px;
    text-align: center;
}
.popup-body{
  width:100%;
  background-color:#ffffff;
}
.body-content{
  width:100%;
  padding:30px;
}
.body-titlebox{
  text-align:center;
  width:100%;
  height:40px;
  margin-bottom:10px;
}
.body-contentbox{
  word-break:break-word;
  overflow-y:auto;
  min-height:100px;
  max-height:300px;
}
.popup-foot{
  width:100%;
  height:50px;
  display:flex;
  background-color:#b00e30;
}
.pop-btn{
  display:inline-flex;
  width:50%;
  height:100%;
  float:left;
  justify-content:center;
  align-items:center;
  color:#ffffff;
  cursor:pointer;
}
.pop-btn.join{
  border-right:1px solid #3b5fbf;
}
/* ---------   CONTENT   영역  --------------*/
div#content{
	width:1080px;
	/* height:1200px; */
	/* margin:0 auto; */
	position:relative;
}
div.contentWrap {
	
}
div.header {
  position:relative;
  width:796px; height:150px;
  left:55px; top:20px;
  
}

div.header img {
	width:780px;
}

div.header p.htis_title{
	font-size:29px;
	font-weight:bold;
	color:#fff;
	position:relative;
	top:-66px;
	left:10px;
}

div.header p.htis{
	position:relative;
	top:-77px;
	left:10px;
	color:#fff;
	font-weight:bold;
	text-indent:1px;
	font-size:11px;
}

div.gnblogo{
	position:absolute;
	width:385px; height:149px;
	left:433px; top:185px;
}

div.gnblogo img{
	width:605px;
}

div.hp_text{
	position:relative;
	left:815px;
	top:-19px;
}


div.hp_text img{
	width:226px;
}

.container3{
	display:flex;
}

/*-----------------login 영역-----------------*/
div.container {
  position:relative;
  width:470px;
  top:-276px; left:-85px;
}

div.contranct{
	position:absolute;
	top:10px; left:10px;
}

/* form */
input {
  display: block;
  width: 84%;
  height: 23px;
  padding: 5px 10px;
  font-size: 11px;
  line-height: 1.42857143;
  color: #555;
  background-color: #fff;
  background-image: none;
  border: 1px solid #e5b9bb;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
          box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
  -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
       -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
          transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}

.contract{
	position:relative;
	top:-314px; left:50px;
}



.conWrap{
	width:390px; height:84px; margin:0;
}
.conWrap  li {
	width:90px; height:31px;
	margin-left:5px;
}

ul.conWrap li p.quick_lunch {
	width: 348px;
	/*  background: #00049E; */
    background: #b00e30; 
    border-radius: 6px;
    height: 34px;
    text-align: center;
    line-height: 2.42em;
    color: #fff;
    font-size: 14px
}
ul.conWrap li p.quick_lunch a img{
	width:21px;
	margin-left:198px;
}

div.contract_email{
	position:relative;
	top:-285px; left:45px;
}

ul.con_email{
	width:90px; height:31px;
	margin-left:5px;
}

ul.con_email li{
	width:90px; height:31px;
	margin-left:5px;
}

ul.con_email li p.con_title_text{
	width: 348px;
    background: rgba(73, 130, 232, 0.52);
    border-radius: 6px;
    height: 34px;
    text-align: center;
    line-height: 2.42em;
    color: #fff;
    font-size: 14px;
    
}

ul.con_email li p.con_title_text a img{
	width:21px;
	margin-left:227px;
}

ul.con_email li p.con_email_text{
	display: block;
    width: 348px;
    height: 31px;
    color: #333;
    background-color: #fff;
    border: 1px solid #b8b8b8;
    font-size: 14px;
    line-height: 0.234;
    padding: 14px 18px;
    text-align:center;
}



/* login new */

.row{
	margin-right:5px;
	margin-left:5px;
	position:relative;
	left:-200px;
	width:377px;
	top:-39px;
}

.panel{
	margin-bottom:10px;
	background-color:#fff;
	border:1px solid #f4cfd0;
	border-radius:4px;
	box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
}

.panel-default > .panel-heading {
    color: #333;
    background-color: #f5f5f5;
    border-color: #f4cfd0;
}

.panel-heading {
    padding: 10px 15px;
    border-bottom: 1px solid transparent;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    height:40px;
    display:flex;
   
}

.form-group{
	margin-bottom:8px;
	width:280px;
}

.checkbox {
    position: relative;
    width:330px;
    left:-15px;
    display: block;
    margin-bottom: 5px;
    float:left;
}

.login_button{
    position:absolute;
    width:300px;
    top:148px;
    left:30px;
}

.btn-block{
	display:block;
	width:25%;
	height:54px;
	position:relative;
	top:-94px;
	left:245px;
}


.btn-lg, .btn-group-lg > .btn {
    padding: 14px 18px;
    font-size: 15px;
    line-height: 1.3333333;
    border-radius: 6px;
}

.btn-success {
    color: #fff;
   /*   background-color:#00049E; */
    margin-top:25px;
     background-color: #d4003c; 
    border-color: #85384c;
}

.btn-success:hover {
    color: #fff;
    background-color: #ef1653;
    border-color: #ecbfcb;
}

.btn-default {
    color:#b00e30;
    background-color: transparent;
    border-color: transparent;
    
    
    
}
.panal-title-btn{
	margin-left:50px;
}

.button{
	overflow:visible;
	text-transform:none;
	margin:0;
	font:inherit;
	cursor:pointer;
	touch-action:manipulation;
	vertical-align:middle;
	white-space:nowrap;
	text-align:center;
	font-weight:normal;
	margin-bottom:normal;
}



button.con{
	display:block;
	width:348px;
	height:31px;
	color:#333;
	background-color:#fff;
	border:1px solid #b8b8b8;
	font-size:14px;
	line-height:0.234;
	padding:14px 18px;
	cursor:pointer;
}

button.con:hover {
	color:#fff;
	background-color:#749bd6;
	border-color:#bacce7;
}

/*footer*/

footer {
	clear:both;
	width:1000px;
	margin:0 auto;
}

.footWrap{
   /*  position:relative; */
	 top:-595px; 
	/*  top:-220px;  */
	margin-left:15px;
}

.footWrap p.footName{
	text-align:left;
	color:#191919;
    text-indent:0.2em;
	line-height:1.62em;
	font-size:0.7em;
}
div#myModalNorm{
	display:none;
	/* margin-left:259px; */
}

/*-------------------Responsive Web---------------------*/

@media screen and (min-width:100px) and (max-width:920px) {
body { 
       overflow-x:scroll;
       overflow-y:scroll;
}

div.contentwrap{
	width:180%;
}

div.header{
	position:relative;
	width:59%; height:108px;
	left:4px; top:5px;
}
div.header img{
	width:85%;
	
}
div.header p.htis_title{
	font-size:15px;
	position:relative;
	top:-40px;
	left:10px;
}

div.header p.htis{
	position:relaitve;
	top:-50px;
	left:8px;
	font-size:8px;
}


div.gnblogo{
	width:42%;
	height:318px;
	left:264px;
	top:119px;
}

div.gnblogo img{
	width:99%;
	height:314px;
}

div.hp_text{
	position:relative;
	left:527px;
	top:-37px;
}
div.hp_text img{
	width:17%;
}

div.container{
	position:relative;
	width:465px;
	top:-298px;
	left:-135px;
}

div.row{
	position:relative;
	left:-203px;
	top:34px;
	width:65%;
}

h3.panel-title{
	font-size:11px;
}

div.form_group{
	width:85%;
}

input{
	width:55%;
	height:23px;
	
}

div.checkbox label{
	padding-left:1px;
}

div.login_button{
	width:85%;
	height:100px;
	top:143px;
}

.btn-lg, .btn-group-lg > .btn{
	padding:11px 16px;
	font-size:10px;
}
.btn-block{
	width:25%;
	position:relative;
	top:-94px;
	left:163px;
}

div.contract{
	position:relative;
	top:-268px;
	left:-1px;
}
ul.conWrap{
	width:24%;
}

ul.conWrap li{
	width:100%;
	height:18px;
}
ul.conWrap li p.quick_lunch{
	width:97.8%;
	font-size:12px;
	height:29px;
	line-height:2.52em;
}

ul.conWrap li p.quick_lunch a img{
	width:5%;
	margin-left:142px;
}

ul.conWrap li button.con{
	width:97.8%;
	height:31px;
	margin-top:5px;
	font-size:10px;
	
}

div.contract_email{
	position:relative;
	top:-243px;
	left:-6px;
}

ul.con_email{
	width:24%;
}
ul.con_email li{
	width:96%;
	height:19px;
	amrgin-top:-2px;
}

ul.con_email li p.con_email_text{
	width:101.7%;
	height:30px;
	line-height:0.72em;
	font-size:12px;
}

ul.con_email li p.con_title_text{
	width:101.7%;
	height:30px;
	line-height:1.72em;
	font-size:12px;
}

ul.con_email li p.con_title_text a img{
	width:5%;
	margin-left:174px;
}

div.footWrap{
	top:-745px;
	left:5px;
}

div#myModalNorm{
	/* margin-left:24px; */
}


    
}

