@charset "utf-8";


/************************************************************************
* COMMON *
************************************************************************/
.container{width:100%;min-width:1260px;max-width:none;padding:0;margin:0 auto;position:relative;overflow:hidden;}

.contents{position:relative;padding:50px 0px 150px 0px;margin:50px auto;text-align:center;max-width:1260px}

.sub_Conts{width:100%;text-align:left;letter-spacing:-0.03em;color:#4d4d4d}
.sub_Conts h3{float:left;font-size:50px;font-weight:600;width:100%;text-align:center;color:#0d0d0d;padding-bottom:30px}
.sub_Conts .notice {text-align:center;padding:2%; border:1px #eee solid; background:#f7f7f7;  display: inline-block;  width: 100%;}

.sub_bar{height:1px;margin:10px 0 30px 0;background:#ddd;width:100%;position:relative;float:left}
.sub_bar span{display:inline-block;text-align:left;padding:0 7%;height:1px;background:#0d0d0d;position:absolute;top:0;left:0}
.sub_Conts h4{float:left;font-size:35px;font-weight:600;width:100%;text-align:center;color:#484848;padding-bottom:20px}


.tabs{width:100%;padding:15px;margin-bottom:25px;}
.tabs button{display:inline-block;border:1px solid #c5c5c5;background:#fff;font-size:16px;text-align:center;color:#555;padding:20px;border-radius:4px}
.tabs .tabs_on{border:1px solid #0096cd;color:#0096cd}

/*****/

.etc{padding:25px;border-radius:15px;font-size:15px;line-height:22px;text-align:left}
.etc textarea {
  width: 100%;
  height: 650px;
  padding: 20px 20px;
  box-sizing: border-box;
  border: 1px solid #ddd;
  border-radius: 15px;
  background: #f8f8f8;
  font-size: 15px;
  resize: none;color:#616161;line-height:28px;
}
.etc_email{border-radius:15px;background:#f8f8f8;padding:60px;border:1px solid #ddd;line-height:30px;font-size:18px;color:#616161;}

.etc .pri {
  width: 100%;
  padding: 20px 20px;
  box-sizing: border-box;
  border: 1px solid #ddd;
  border-radius: 15px;
  background: #f8f8f8;
  font-size: 15px;
  resize: none;color:#616161;line-height:28px;
}

.pri h5{font-size:17px;font-weight:600;line-height:30px;color:#111}
/*****/


@media screen and (max-width:1100px) {
.container{min-width:100%;}
}


@media screen and (max-width:760px) {
.tabs{width:100%;padding:5px;margin-bottom:25px;}
.tabs button{display:inline-block;border:1px solid #c5c5c5;background:#fff;font-size:14px;text-align:center;color:#555;padding:8px;border-radius:4px}
.etc{padding:0px 10px;border-radius:15px;font-size:15px;line-height:22px;text-align:left}

}


/************************/


/************************
* sub top *
**********************/



.subtitleTop { z-index:10;margin:130px auto 0 auto;text-align:center;position:relative; }
.subtitleTop .bg { position:relative; height:420px; background:#009ad2 url('../img/stop.png') center 25px no-repeat;background-size:contain;}
.subtitleTop .bg .sub_top{border:0;width:1100px;margin:0 auto;padding:150px 0 0 15%;font-size:55px;letter-spacing:-0.02em;line-height:65px;font-weight:600;color:#fff}



.info{margin:20px 0 160px 0;float:left;width:100%}
.info_left{float:left;width:45%;}
.info_left img{border-radius:0px;max-width:500px;max-height:600px}

.info_right{float:right;width:53%}
.info_right dl{float:left;width:100%;padding:15px 0;border-bottom:1px solid #d8d8d8}
.info_right dt{float:left;width:20%;text-align:left;font-size:23px;font-weight:600}
.info_right dd{float:right;width:78%;text-align:left;font-size:23px;font-weight:400;line-height:32px;}
.info_right dd span{float:left;text-align:left;font-size:17px ! important;font-weight:400;line-height:40px;}


.listboardStyle{ width:100%; border-collapse:collapse; border-spacing:0; table-layout:fixed; word-creak:break-all; text-align:center;font-size:16px;}
.listboardStyle thead th{ border:1px solid #ddd; background:#009ad2; height:60px;color:#fff; font-weight:400; font-size:18px;line-height:60px}
.listboardStyle tbody{border-left:1px solid #ddd; border-right:1px solid #ddd;}
.listboardStyle tbody td{border-top:1px solid #ddd; border-bottom:1px solid #ddd; padding:23px 0; word-break:keep-all;}
.listboardStyle tbody td span{color:#777; font-weight:400;}
.listboardStyle tbody td *{display:inline-block;}
.listboardStyle tbody td font{font-size:17px ! important;font-weight:400;line-height:30px;}
.listboardStyle tbody th{ border:1px solid #ddd; background:#fafafa; height:60px;color:#373737; font-weight:400;font-size:18px;line-height:60px;padding:7px 0;}



.listboardStyle_pop{ width:100%; border-collapse:collapse; border-spacing:0; table-layout:fixed; word-creak:break-all; text-align:center;font-size:16px;}
.listboardStyle_pop thead th{ border:1px solid #ddd; background:#009ad2; height:40px;color:#fff; font-weight:400; line-height:1.2;font-size:16px;line-height:35px}
.listboardStyle_pop tbody{border-left:1px solid #ddd; border-right:1px solid #ddd;}
.listboardStyle_pop tbody td{border-top:1px solid #ddd; border-bottom:1px solid #ddd; padding:8px 0; word-break:keep-all;}
.listboardStyle_pop tbody td span{color:#777; font-weight:400; line-height:1.1;}
.listboardStyle_pop tbody td *{display:inline-block;}
.listboardStyle_pop tbody td font{font-size:14px ! important;font-weight:400;line-height:30px;}
.listboardStyle_pop tbody th{ border:1px solid #ddd; background:#fafafa; height:60px;color:#373737; font-weight:400; line-height:1.2;font-size:16px;line-height:35px}

@media screen and (max-width:768px){
.listboardStyle thead th{ border:1px solid #ddd; background:#009ad2; height:50px;color:#fff; font-weight:400; line-height:1.2;font-size:16px;line-height:50px}
.listboardStyle tbody td{border-top:1px solid #ddd; border-bottom:1px solid #ddd; padding:23px 0; word-break:keep-all;font-size:14px;line-height:20px}
.listboardStyle tbody td font{font-size:14px ! important;font-weight:400;line-height:30px;}

.listboardStyle_pop thead th{ border:1px solid #ddd; background:#009ad2; height:50px;color:#fff; font-weight:400; line-height:1.2;font-size:16px;line-height:30px}
.listboardStyle_pop tbody td{border-top:1px solid #ddd; border-bottom:1px solid #ddd; padding:5px 0; word-break:keep-all;font-size:14px;line-height:18px}
.listboardStyle_pop tbody td font{font-size:14px ! important;font-weight:400;line-height:30px;}

.info{margin:20px 0 160px 0;float:left;width:100%}
.info_left{float:left;width:45%;}
.info_left img{border-radius:0px;max-width:500px;max-height:600px}

.info_right{float:right;width:53%}
.info_right dl{float:left;width:100%;padding:15px 0;border-bottom:1px solid #d8d8d8}
.info_right dt{float:left;width:20%;text-align:left;font-size:18px;font-weight:600}
.info_right dd{float:right;width:78%;text-align:left;font-size:18px;font-weight:400;line-height:32px;}
.info_right dd span{float:left;text-align:left;font-size:14px ! important;font-weight:400;line-height:32px;}

}


@media screen and (max-width:760px){

.info{margin:20px 2% 100px 2%;float:left;width:96%}
.info_left{float:left;width:100%;text-align:center}
.info_left img{border-radius:0px;max-width:100%;max-height:400px}

.info_right{float:left;width:100%}
.info_right dl{float:left;width:100%;padding:15px 0;border-bottom:1px solid #d8d8d8}
.info_right dt{float:left;width:20%;text-align:left;font-size:16px;font-weight:600}
.info_right dd{float:right;width:78%;text-align:left;font-size:16px;font-weight:400;line-height:32px;}

}


.state{float:left;width:100%}
.state dl{float:left;width:100%;padding:15px 0;border-bottom:1px solid #d8d8d8}
.state dt{float:left;width:24%;text-align:center;font-size:30px;font-weight:600;border-radius:15px;background:#009ad2;color:#fff;min-height:145px;padding-top:40px}
.state dt span{font-size:23px;font-weight:400;border-radius:15px;background:#009ad2;color:#fff;}
.state dd{float:right;width:72%;text-align:left;font-size:20px;font-weight:400;line-height:32px;padding-top:20px}



/**** input***/


.sign{float:left;width:100%;padding:30px;text-align:center;border-radius:15px;border:1px solid #c0cdd2;background:#e9eff2}
.sign {font-size:16px;line-height:24px;}


.order{margin:40px 2%;width:96%;float:left;}
.order dl{float:left;width:100%;padding:15px 0;border-bottom:1px solid #d8d8d8;position:relative}
.order dt{float:left;width:15%;text-align:left;font-size:20px;font-weight:500;padding-top:15px;padding-left:20px}
.order dd{float:right;width:83%;text-align:left;font-size:16px;font-weight:400;line-height:32px;position:relative}
.order_btn{position:absolute;right:20px;top:0px;padding:12px 20px;border:0;background:#333;color:#fff;font-size:14px;cursor:pointer}


.order dd.custom-checkbox div {display: inline-block; margin:0 5px 5px 0; width:calc(100% / 8);  font-size:16px;}
.order .notice {font-size:14px;  color: #333;}

@media screen and (max-width:620px){	
.order dd.custom-checkbox div {display: inline-block; margin:0 5px 5px 0; width:auto;  font-size:14px;}
}

/*환영추가*/
.order_btn2{position:absolute;right:30px;top:10px;padding:0px;border:0; font-size:14px;cursor:pointer;}
.order_btn3{  display: inline-block;  border:0;padding:12px 20px; background:#333;color:#fff;font-size:14px;cursor:pointer}
.order_btn4 { width:100%; margin:40px 0 0 0;text-align:center;  display: inline-block;  border:0;padding:22px 20px; background:#009ad2;color:#fff;font-size:16px;cursor:pointer;border-radius: 6px;  border: solid 1px rgba(0,0,0,.15);}



/*login*/
.login{margin:40px 2%;width:30%;margin:0 auto}
.login dl{ width:100%;padding:15px 0;border-bottom:1px solid #d8d8d8;position:relative} 
.login dd{ width:100%;text-align:left;font-size:16px;font-weight:400;line-height:32px;position:relative}
.login_btn{ padding:17px 20px; font-weight: 700;background:#009ad2;color:#fff;font-size:14px;cursor:pointer;width:100%;margin:10px 0 15px 0px;  border-radius: 6px;  border: solid 1px rgba(0,0,0,.15); box-sizing: border-box;} 
.login input[type=text], input[type=password] {  width:100%;  padding: 12px 15px;  margin:0px 0 12px 0;  display: inline-block;  border: none;  background: #f1f1f1;}
.login input[type=text]:focus, input[type=password]:focus {  background-color: #ddd;  outline: none;}
.login label{font-size:16px;padding:7px 15px;border-radius:60px;background:#ddd;margin:10px}
 .find_wrap {width:100%; text-align: center;padding: 20px 0 35px;  clear: both;}
 .find_wrap li {padding:0 28px; display: inline-block;position: relative;}
 .find_wrap li a{font-size: 14px;    line-height: 17px;  text-decoration: none;  color: #888; }
 .find_wrap li + li::before, .relogin_find_wrap li + li::before {  content: '';  position: absolute;  top: 3px;  left: 0px;  width: 1px;  height: 12px;  border-radius: .5px;  background-color: #dadada;}

/*member*/
.member {margin:40px 2%;width:30%;margin:0 auto;clear: both; }
.member dl{ width:100%;padding:10px 0 10px 0; position:relative}
.member dt{ font-size:0}
.member dd{ width:100%;text-align:left;font-size:16px;font-weight:400;line-height:32px;position:relative}
.member input[type=text], input[type=password] {  width:100%;  padding: 12px 15px;  margin:0px 0 0px 0;  display: inline-block;  border: none;  background: #f1f1f1;}
.member .input {  width:75% !important;}
.member input[type=text]:focus, input[type=password]:focus {  background-color: #ddd;  outline: none;}
.member label{font-size:16px;padding:7px 15px;border-radius:60px;background:#ddd;margin:10px} 
.member .member_btn{position:absolute;right:0px;top:0px;padding:12px 20px;border:0;background:#333;color:#fff;font-size:14px;cursor:pointer}
.member .member_btn2{ padding:17px 20px; font-weight:500;background:#b32f92;color:#fff;font-size:14px;cursor:pointer;width:100%;margin:10px 0 15px 0px;  border-radius: 6px;  border: solid 1px rgba(0,0,0,.15); box-sizing: border-box;} 
.member .member_btn3 {border-top:1px solid #d8d8d8;  }
.member .member_btn3 li {margin-top:20px}
.member .member_btn3 li a {padding:12px 20px; color:#fff;font-size:14px;cursor:pointer; border:0;border-radius: 6px;}
.member .member_btn3 li a.gologin{ background:#7fc341;float:left;}
.member .member_btn3 li a.signup { background:#009ad2;float:right;}
.member-select {width:100%}
.member h5 {text-align:left;font-size:20px;font-weight:600;}

.application .part {padding: 30px 0;  display: inline-block;  width: 100%; }
.application .part .title {color:#000; font-size:26px;font-weight:700;border-bottom:3px solid #ddd;padding-bottom:15px;}
.application dl{float:left; width: 100%; padding:15px 0;border-bottom:1px solid #d8d8d8;position:relative}
.application dt{float:left;width:15%;text-align:left;font-size:20px;font-weight:500;padding-top:0px;padding-left:20px}
.application dd{float:right;width:83%;text-align:left;font-size:16px;font-weight:400;line-height:24px;position:relative}
.application_btn {  padding-bottom: 20px; margin:20px auto;  display: inline-block;  width: 100%;  text-align: center;}
.application_btn li {  display: inline-block;position: relative;}
.application_btn li a {padding:12px 40px;border:0;color:#fff;font-size:16px;cursor:pointer;border-radius: 6px;  border: solid 1px rgba(0,0,0,.15); box-sizing: border-box;}
.application_btn li .self{ background:#7fc341;} 
.application_btn li .print{ background:#009ad2;} 
.application_btn li .Close{ background:#333;} 

.application dd.custom-checkbox div {display: inline-block; margin:0 5px 5px 0; width:calc(100% / 8);  font-size:16px;}
.application .notice {font-size:14px;  color: #ccc;}

/* Full-width input fields */
.application input[type=text], input[type=password] { 
  padding: 12px 15px;
  margin:0px 0 0px 0;
  display: inline-block;
  border: none;
  background: #f1f1f1;
}

.application input[type=text]:focus, input[type=password]:focus {
  background-color: #ddd;
  outline: none;
}


.application label{font-size:16px;padding:7px 15px;border-radius:60px;background:#ddd;margin:10px}



/* Full-width input fields */
.order input[type=text], input[type=password] {
  width: 85%;
  padding: 12px 15px;
  margin:0px 0 22px 0;
  display: inline-block;
  border: none;
  background: #f1f1f1;
}

.order input[type=text]:focus, input[type=password]:focus {
  background-color: #ddd;
  outline: none;
}


.order label.file{font-size:16px;padding:7px 15px;border-radius:60px;background:#ddd;margin:10px}
.data{display:inline-block;}

/* The container must be positioned relative: */
.custom-select {
  position: relative;display:inline-block
}

.custom-select select {border:0;background:#f1f1f1;padding:12px 25px;font-size:14px}

.select-selected {
  background-color: DodgerBlue;
}



.ordeBtn{padding:20px 40px;border:0;background:#009ad2;color:#fff;font-size:22px;cursor:pointer;margin:30px auto;text-align:center;border-radius:7px}




.custom-checkbox-group.horizontal {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  margin: 10px 0;
  align-items: center;
}

.custom-checkbox-group label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 15px;
  color: #333;
}

.custom-checkbox-group input[type="checkbox"] {
  width: 18px;
  height: 18px;
  accent-color: #007bff;
}


.custom-checkbox-group .input-inline input[type="text"] {
 margin-bottom:0;
  padding: 4px 8px;
  font-size: 14px;
  border: 1px solid #ccc;
  border-radius: 4px;
  width:35%;
  margin-left: 6px;
}








/* Style the arrow inside the select element: */
.select-selected:after {
  position: absolute;
  content: "";
  top: 14px;
  right: 10px;
  width: 0;
  height: 0;
  border: 6px solid transparent;
  border-color: #fff transparent transparent transparent;
}

/* Point the arrow upwards when the select box is open (active): */
.select-selected.select-arrow-active:after {
  border-color: transparent transparent #fff transparent;
  top: 7px;
}

/* style the items (options), including the selected item: */
.select-items div,.select-selected {
  color: #ffffff;
  padding: 8px 16px;
  border: 1px solid transparent;
  border-color: transparent transparent rgba(0, 0, 0, 0.1) transparent;
  cursor: pointer;
}

/* Style items (options): */
.select-items {
  position: absolute;
  background-color: DodgerBlue;
  top: 100%;
  left: 0;
  right: 0;
  z-index: 99;
}

/* Hide the items when the select box is closed: */
.select-hide {
  display: none;
}

.select-items div:hover, .same-as-selected {
  background-color: rgba(0, 0, 0, 0.1);
}



/* The container */
.scontainer {
  display: block;
  position: relative;
  cursor: pointer;
  font-size: 22px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  margin:20px 0 50px 49%;
}

/* Hide the browser's default checkbox */
.scontainer input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom checkbox */
.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  background-color: #ddd;
}

/* On mouse-over, add a grey background color */
.scontainer:hover input ~ .checkmark {
  background-color: #ccc;
}

/* When the checkbox is checked, add a blue background */
.scontainer input:checked ~ .checkmark {
  background-color: #2196F3;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the checkmark when checked */
.scontainer input:checked ~ .checkmark:after {
  display: block;
}

/* Style the checkmark/indicator */
.scontainer .checkmark:after {
  left: 9px;
  top: 5px;
  width: 5px;
  height: 10px;
  border: solid white;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}


@media screen and (max-width:620px){	

.state{width:96%;margin:0px 2%}
.state dl{float:left;width:100%;padding:15px 0;border-bottom:1px solid #d8d8d8}
.state dt{float:left;width:100%;text-align:center;font-size:30px;font-weight:600;border-radius:15px;background:#009ad2;color:#fff;min-height:145px;padding-top:40px;padding-left:0px;padding-bottom:10px}
.state dt span{font-size:16px;font-weight:400;border-radius:15px;background:#009ad2;color:#fff;}
.state dd{float:right;width:100%;text-align:left;font-size:16px;font-weight:400;line-height:25px;padding-top:20px}


.order dl{float:left;width:100%;padding:15px 0;border-bottom:1px solid #d8d8d8;position:relative}
.order dt{float:left;width:100%;text-align:left;font-size:16px;font-weight:500;padding-top:15px;padding-left:0px;padding-bottom:10px}
.order dd{float:right;width:100%;text-align:left;font-size:16px;font-weight:400;line-height:32px;}
.order_btn{position:absolute;right:10px;top:65px;padding:12px 20px;border:0;background:#333;color:#fff;font-size:14px;cursor:pointer}


/* Full-width input fields */
.order input[type=text], input[type=password] {
  width: 80%;
  padding: 15px;
  margin: 5px 0 22px 0;
  display: inline-block;
  border: none;
  background: #f1f1f1;
}

.data{display:block;}
.data label{display:inline-block}
.data input{display:inline-block;width:50%;margin-top:20px}

}

@media screen and (max-width:480px){	
.order_btn{position:absolute;right:10px;top:5px;padding:15px 20px;border:0;background:#333;color:#fff;font-size:14px;cursor:pointer}
.order dd span{line-height:1.3em}
}

/***********/


@media screen and (max-width:1400px){
 
.container{width:100%;min-width:100%;margin:0 auto;position:relative;overflow:hidden;}

.contents{position:relative;padding:50px 0px 150px 0px;margin:50px auto;text-align:center;max-width:100%}

	
}
@media screen and (max-width:1024px){	
}
@media screen and (max-width:640px){	

}



/*********************************************
*  SUB TOP  *
********************************************/
@media screen and (max-width:1120px){	

.subtitleTop { z-index:10;margin:100px auto 0 auto;text-align:center;position:relative; }
.subtitleTop .bg { position:relative; height:240px; background:#009ad2 url('../img/stop.xpng') center 25px no-repeat;background-size:contain;}
.subtitleTop .bg .sub_top{border:0;width:100%;margin:0 auto;padding:100px 0 0 0%;font-size:40px;letter-spacing:-0.04em;line-height:50px;font-weight:600;color:#fff;text-align:center}

}



@media screen and (max-width:960px){	

.subtitleTop { z-index:10;margin:80px auto 0 auto;text-align:center;position:relative; }
.subtitleTop .bg { position:relative; height:160px; background:#009ad2 url('../img/stop.xpng') center 25px no-repeat;background-size:contain;}
.subtitleTop .bg .sub_top{border:0;width:100%;margin:0 auto;padding:60px 0 0 0%;font-size:32px;letter-spacing:-0.04em;line-height:40px;font-weight:600;color:#fff;text-align:center}


.sub_Conts h3{float:left;font-size:35px;font-weight:600;width:100%;text-align:center;color:#0d0d0d;padding-bottom:15px}
.sub_Conts h4{float:left;font-size:24px;font-weight:600;width:100%;text-align:center;color:#484848;padding-bottom:10px}

}

@media screen and (max-width:620px){	
.subtitleTop .bg .sub_top{border:0;width:100%;margin:0 auto;padding:35px 0 0 0%;font-size:30px;letter-spacing:-0.04em;line-height:40px;font-weight:600;color:#fff;text-align:center}
}


@media screen and (max-width:1024px){	

.container{width:100%;min-width:100%;margin:0 auto;position:relative;overflow:hidden;}

.contents{position:relative;padding:30px 0px 100px 0px;margin:30px auto;text-align:center;max-width:100%}

.sub_Conts h3{float:left;font-size:35px;font-weight:600;width:100%;text-align:center;color:#0d0d0d;padding-bottom:30px}
.sub_Conts h4{float:left;font-size:24px;font-weight:600;width:100%;text-align:center;color:#484848;padding-bottom:20px}



}



/****** 관리자 참가신청서 ****/

.ad_table{ width:100%; border-collapse:collapse; border-spacing:0; table-layout:fixed; word-creak:break-all; text-align:center;font-size:16px;}
.ad_table thead th{ border:1px solid #ddd; background:#fafafa; height:60px;color:#373737; font-weight:400; line-height:1.2;font-size:18px;line-height:60px}
.ad_table tbody{border-left:1px solid #ddd; border-right:1px solid #ddd;}
.ad_table tbody td{border-top:1px solid #ddd; border-bottom:1px solid #ddd;border-left:1px solid #ddd; border-right:1px solid #ddd; padding:23px 0; word-break:keep-all;}
.ad_table tbody td span{color:#777; font-weight:400; line-height:1.4;}
.ad_table tbody td *{display:inline-block;}



.ad_t01{text-align:right;padding:20px;display:block;font-size:20px}
.ad_t01 span{padding:0 20px;color:#222 ! important}

.ad_t02{width:100%;text-align:right;display:block;padding:25px 100px 25px 0;font-size:25px}
.ad_t02 span{padding:0 30px;color:#222 ! important}

.ad_t03{text-align:left;width:100%;padding:20px 0 0 20px;line-height:45px;font-size:17px}
.ad_t03 span{padding:0 15px;color:#222 ! important}

.ad_t04{font-weight:600;font-size:35px}



.ab_span{padding:0 25px;}
.ab_input{padding:0 35px;color:#222 ! important}


/****** 2024.05.23********/

.state_btn{display:inline-block;border:0px;background:#009ad2;font-size:18px;text-align:center;color:#fff;padding:2px 20px;border-radius:4px;margin-left:20px}

/* The Modal (background) */
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 99999999999; /* Sit on top */
  padding-top: 70px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}
.modal2 {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 99999999999; /* Sit on top */
  padding-top: 70px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}
.modal3 {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 99999999999; /* Sit on top */
  padding-top: 70px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}
.modal4 {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 99999999999; /* Sit on top */
  padding-top: 70px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

.modal5 {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 99999999999; /* Sit on top */
  padding-top: 70px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}



/* Modal Content */
.modal-content {
  position: relative;
  background-color: #fefefe;
  margin: auto;
  padding: 0;
  border: 1px solid #888;
  width: 600px;
  box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
  -webkit-animation-name: animatetop;
  -webkit-animation-duration: 0.4s;
  animation-name: animatetop;
  animation-duration: 0.4s
}

@media screen and (max-width:1024px){	
.modal-content {width:90%}
}

/* Add Animation */
@-webkit-keyframes animatetop {
  from {top:-300px; opacity:0} 
  to {top:0; opacity:1}
}

@keyframes animatetop {
  from {top:-300px; opacity:0}
  to {top:0; opacity:1}
}

/* The Close Button */
.close {
  color: white;
  float: right;
  font-size: 28px;
  font-weight: bold;
}


.close:hover,
.close:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}
.close2 {
  color: white;
  float: right;
  font-size: 28px;
  font-weight: bold;
}
.close2:hover,
.close2:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}

.close3 {
  color: white;
  float: right;
  font-size: 28px;
  font-weight: bold;
}
.close3:hover,
.close3:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}

.modal-header {
  padding: 12px 16px 6px 16px;
  background-color: #009ad2;
  color: white;
}
.modal-header h2{ text-align:center;font-size:23px;}
.modal-body {padding:20px 16px;}




.custom-select {
    border:none ! important
}