@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+KR:100,300,400,500,700,900&display=swap');
@import url('https://fonts.googleapis.com/css?family=Cormorant+Garamond:400,400i,500,500i&display=swap');

/*font-family: 'Noto Sans KR', sans-serif;*/

.iframebox {
  position: relative;
  padding-bottom: 56.25%;
}

.iframebox iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;  
}
*{margin:0; padding:0}
li{list-style:none;margin:0;padding:0;}
img{border: none;}
a{text-decoration:none}
address{font-style:normal;}
iframe{margin:0;padding:0;border:none;}
table{border-spacing: 0;border-collapse: collapse;}
button, input, select, textarea {
    background: transparent;
    position: relative;
    zoom: 1;
    font-family: 'Lato','NotoSansKR','Noto Sans KR','Apple SD Gothic Neo',sans-serif; border:none
}

.xi-kakaotalk:before {
  content: "\ebee";
}
h1,h2,h3,h4,h5,h6,p,div,section,td,th,label,adddress,a,body,li, button, em{font-family: 'Noto Sans KR', sans-serif; font-size:14px; font-weight:400; color:#000;  font-style:normal;word-break:keep-all !important; letter-spacing:0 }

.pc{display:block !important}
.mob{display:none !important}
.main_no{display:none}
.scroll_box{display:none}
.po_re{position:relative}
#header{position:relative; width:100%; background-color:#017cbf}
.header_wrap{padding:15px 0}
#contents{position:relative; background-color:#017cbf; height:100vh; overflow:hidden}
.main_header{position:relative; width:100%;  padding:15px 0}
.right_menu{position:absolute; right:100px; top:30px}
.right_menu>ul{overflow:hidden}
.right_menu>ul>li{float:left; margin-right:15px}
.right_menu>ul>li img{width:25px}
.logo{margin-left:100px}
.logo a{color:#FFF; font-size:20px; font-weight:700; letter-spacing:-1px; line-height:24px}


.main_img{position:absolute; left:50%; top:50%; transform:translate(-50%,-60%)}
.main_img img{max-width:450px}

/*¸ÞÀιöÆ°ÀÔ´Ï´Ù.*/
.main_menu{position:absolute; left:100px; top:50%; transform:translateY(-50%)}
.main_gnb>ul>li{padding:10px 0; border-radius:10px; background-color:#d70717; margin-bottom:5px; transition:0.5s}
.main_gnb>ul>li:hover{background-color:#C0000E}
.main_gnb>ul>li a{  width:220px; display:block}
.main_gnb>ul>li:hover .main_text{font-weight:bold;}
.main_gnb>ul>li div{vertical-align:bottom; width:100%; text-align:center}
.main_text{color:#FFF; font-size:16px; padding:0 15px; box-sizing:border-box; font-weight:bold}

/*¾ØÄÄ ¹öÆ° css*/
.change_button {
   box-shadow:inset 0px 1px 0px 0px #cf866c;
   background:linear-gradient(to bottom, #d0451b 5%, #bc3315 100%);
   background-color:#d0451b;
   border-radius:3px;
   border:1px solid #942911;
   /*display:inline-block;*/
   cursor:pointer;
   color:#ffffff;
   font-family:Arial;
   font-size:15px;
   font-weight:bold;
   padding:6px 24px;
   text-decoration:none;
   text-shadow:0px 1px 0px #854629;
}
.change_button:hover {
   background:linear-gradient(to bottom, #bc3315 5%, #d0451b 100%);
   background-color:#bc3315;
}
.change_button:active {
   position:relative;
   top:1px;
}

.heart{padding:15px 0; display:table}
.heart>div{display:table-cell; vertical-align:middle; padding:0 15px 10px 0}
.heart div.main_text{font-size:16px}
.main_footer{position:absolute ; bottom:50px; width:98%}
.main_footer p{color:#FFF; text-align:center}

.gnb{position:absolute; right:280px; bottom:20px}
.gnb>ul{display:table}
.gnb>ul>li{display:table-cell}
.gnb>ul>li.select a{font-weight:bold}
.gnb>ul>li>a{font-size:20px; color:#FFF; padding:0 25px;}
.gnb>ul>li:hover a{ font-weight:bold;}

.sub{ max-width:1000px; margin:0 auto; position:relative; padding:80px 0}
.org_title {
	display: flex;
	margin-bottom: 50px;
	padding: 50px 40px;
	background-color: #28a5c3;
	color: #fff;
}
.org_title .tx1{
	margin-right: 40px;
	font-size: 24px;
}
.org_title .tx2{
	line-height: 1.5;
}

.sub_title{text-align:center; font-weight:bold; font-size:25px; position:relative; margin-bottom:20px}
.sub_title::after{position:absolute; content:""; width:50px; height:4px; background-color:#017cbf; left:50%; margin-left:-25px; top:-10px}
.table_sub{max-width:1200px}
.tab{position:relative; margin-bottom:20px}
.tab>ul{display:table; width:100%}
.tab>ul>li{display:table-cell; width:25%; border-bottom:2px solid #333; text-align:center; padding:10px 0; position:relative; font-size:18px; cursor:pointer}
.tab>ul>li.select::after{position:absolute; content:""; bottom:-3px; border:2px solid #017cbf; width:100%; /*transition:0.5s;*/ left:0; opacity:1; z-index:99; box-sizing:border-box}
/*.tab>ul>li:hover::after{width:100%; opacity:1}
.tab>ul>li.select::after{opacity:1; width:100%}*/
.form_box{position:relative; width:100%; margin:0 auto; border-bottom:1px solid #AAA; border-top:1px solid #AAA; padding:20px; box-sizing:border-box}
/*agree*/
.agree_text{text-align:center; font-size:18px; color:#555; margin-top:20px}
.agree-wrap .textarea {width: 98%; margin:0 auto;height: 150px; background-color: #fbfbfb; padding: 20px;color: #777; line-height: 1.5em; overflow: auto;box-sizing: border-box; border: 1px solid #ccc;}
.terms-wrap .chapter {/*font-size: 16px;*/ margin-bottom: 15px;}
.terms-wrap > dl dt { font-size: 14px; font-weight: 600; margin-bottom: 5px;}
.terms-wrap > dl dd + dt {margin-top: 20px;}
.agree-wrap{padding-bottom:10px; position:relative}
.form_box h2{font-size:18px; font-weight:bold; margin:0 0 10px}
.form_box h2 span label{font-size:15px; font-weight:500; margin-left:10px; color:#40311c}
.textarea{margin-bottom:10px}
.privacy-wrap > dl dt { font-size: 15px; font-weight: 600;margin-bottom: 5px;}
.privacy-wrap > dl dd + dt { margin-top: 20px;}
.agree_btn{overflow:hidden; width:410px; margin:20px auto}
.agree_btn>li{float:left; margin-left:10px; width:200px; box-sizing:border-box}
.agree_btn>li:first-child{margin-left:0}
.agree_btn>li>button{width:100%; padding:15px 0; border:1px solid #CCC}
.agree_btn>li.select button{background-color:#017cbf; color:#FFF; border:1px solid #017cbf}

.board_write{position:relative; width:100%; margin:0 auto; }
.board_write table{width:100%;}
.board_write th { padding: 10px 0 10px 20px;
    text-align: left;
    font-size: 16px;
    box-sizing: border-box; font-weight:500
}
.board_write td { padding: 10px 20px;
    text-align: left;
    box-sizing: border-box;
    position: relative; width:100%
}
.board_write td label{margin-right:5px}
.board_write td select{border:1px solid #CCC; padding:9px 20px 9px 5px; box-sizing:border-box; display:inline-flex; vertical-align:middle; /*font-size:16px*/}
.board_write td checkbox{vertical-align:middle}
.board_write input[type="text"], .board_write input[type="number"]{border:1px solid #CCC; padding:10px; box-sizing:border-box; background-color:#FFF; vertical-align:middle}
.board_write textarea{width:100%; border:1px solid #CCC; background-color:#FFF}
.phone button{color:#FFF; background-color:#666; padding:10px 30px; /*margin:0 auto; display:block; width:125px*/ vertical-align:middle; margin-left:5px}

#footer{position:relative; width:100%; background-color:#AAA;padding:20px 0 }
#footer p{position:relative; width:100%; text-align:center;}
#footer p span{color:#017cbf}
.foot_logo{
	padding: 15px 15px;
	color: #fff;
	font-size: 24px;
	text-align:center

}
.foot_logo img{max-width:200px}
.row4 select{width:23.5%; margin-right:2%}
.radio_btn label {
    width: 100%;
    display: inline-block; padding:11px 0;text-align:center; /*font-size:16px;*/ vertical-align:middle; border:1px solid #CCC; box-sizing:border-box
}
.check_box label{width:49%;display: inline-block; padding:8px 0;text-align:center; /*font-size:16px;*/ vertical-align:middle; border:1px solid #CCC; box-sizing:border-box; margin-bottom:10px}
input[type=radio], input[type=checkbox]  {
    display: none;
}
input[type=checkbox]:checked+label {
    background-color: #017cbf; 
    border: 1px solid #017cbf;
    color: #fff;
}
input[type=radio]:checked+label {
    background-color: #017cbf; 
    border: 1px solid #017cbf;
    color: #fff;
}
input[type=checkbox]:checked+label {
    background-color: #017cbf; 
    border: 1px solid #017cbf;
    color: #fff;
}

.agree label{display:block; padding:10px; box-sizing:border-box; width:98%; margin:0 auto; text-align:center; border:1px solid #CCC}
/*.agree{padding:0 10px; box-sizing:border-box}
.agree input[type="checkbox"]{display:inline-block; vertical-align:middle; margin-right:5px; margin-top:-3px}
.agree input[type=checkbox]:checked+label{background-color:transparent; color:#000; border:none;}*/
.certi{text-align:center}
.certi input[type="number"]{width:75px}
.certi select{width:75px; border:1px solid #CCC; padding:9px 0; vertical-align:middle}
.certi button{background-color:#666; padding:10px; box-sizing:border-box; vertical-align:middle; color:#FFF; margin-left:5px}
.certi p{margin-top:10px; margin-bottom:5px}
.row4 .row2{overflow:hidden}
.row4 select{width:100%}
.row4>div{float:left; width:23.5%; margin-left:2%}
.row2>div{float:left; width:49%; margin-left:2%}
.row2 button{width:100%; background-color:#017cbf; color:#FFF; padding:10px 0; /*font-size:16px*/}
.row2 input[type="text"], .row2 input[type="number"]{width:100%}
.row4>div:nth-child(4n+1), .row2>div:nth-child(2n+1){margin-left:0}
.row4>div:nth-child(n+5){margin-top:10px}
ul.radio_btn{overflow:hidden; margin-top:2%}
ul.radio_btn>li{float:left; width:49%; margin-left:2%}
ul.radio_btn>li:first-child{margin-left:0}

.table_wrap{position:relative; width:100%}
.table_wrap table{width:100%;  }
.table_wrap table th{padding:10px 0;background-color:#EEE }
.table_wrap table td{text-align:center; padding:10px 0; border-bottom:1px solid #CCC;}


.table_top{position:relative; width:100%}
.table_top p{padding:10px 0; font-size:16px}
.table_top p br{display:none}
.table_top p span{color:#D30000; font-weight:bold}
.table_top .search{position:absolute;  right:0; top:7px}
.table_top .search select{border:1px solid #CCC; padding:5px}
#month{margin-right:5px}
.table_top .search input[type="text"]{border:1px solid #CCC; padding:5px; box-sizing:border-box; width:150px}
.table_top .search button{color:#FFF; padding:5px 15px; background-color:#333}
.bottom_btn{background-color:#333; color:#FFF; width:150px; padding:10px 0; text-align:center; position:relative; margin:20px auto; display:block }
.middle_text{text-align:center; font-size:16px; padding:15px 0; border-bottom:1px solid #AAA}
.btn_wrap{text-align:center}
.next_btn{position:relative; background-color:#017cbf; color:#FFF; width:200px;   margin:15px auto; padding:15px 0; display:block; text-align:center}
.prev{background-color:transparent; border:1px solid #CCC; color:#000}
.btn_wrap .next_btn{display:inline-block}
.form2, .form3, .form4{ overflow:hidden; position:relative }
.form1{overflow:hidden; position:relative}

.open_wrap2{display:none}
.open_wrap1 .form_box{border-top:none; padding-top:0}
.scroll_box{position:absolute;background-color:rgba(255,255,255,0.5); right:0; top:0; width:30px; height:100%; z-index:99}
.scroll_arrow{text-align:center; position:absolute; top:50%; transform:translate(-50%,-50%); left:50%}
.scroll_arrow i{font-weight:bold; font-size:20px;}

.date{text-align:center; margin-top:10px}
.sign_text{text-align:center; margin-top:10px}
.sign_text input[type="text"]{border:1px solid #AAA; padding:5px; box-sizing:border-box; margin:0 15px}
.sign_box>p{text-align:center; margin:10px auto}
.sign{border:1px solid #000; width:250px; height:150px; margin:0 auto}
@media all and (max-width:1250px) {
.main_menu{left:20px}	
.logo{margin-left:10px}
.gnb>ul>li>a{padding:0 10px}
.right_menu{right:0}
.gnb{right:180px}
.main_img img{width:350px}
}
@media all and (max-width:1100px) {
.main_wrap{position:absolute; left:50%; transform:translate(-50%,-60%); top:50%;}
.main_img img{width:400px}	
.main_menu{position:relative; left:0; width:600px; margin:180px auto 0; top:auto; transform:none}
.main_gnb>ul>li a{width:100%}
.main_icon{text-align:center; width:60px}

.main_img{position:relative; text-align:center; width:100%; /*max-width:180px;*/ top:0; transform:translate(-50%,25%); margin-bottom:30px}
.main_gnb>ul>li{padding:12px 0}
.right_menu>ul>li img{width:25px}

.mob{display:block !important}
.pc{display:none !important}
.main_no{display:block}
.main_img img{max-width:100%}
.mob_close{position:absolute; right:10px; cursor:pointer; top:8px; z-index:999}
.mob_close i{font-size:35px; color:#FFF}
.gnb_wrap{position:fixed; left:-280px; top:0; width:250px; height:100%; z-index:999; background-color:#FFF}
.over{position:fixed; width:100%; height:100%; background-color:rgba(0,0,0,0.5); z-index:999; left:0; top:0; display:none}
.gnb{width:100%; right:0; bottom:auto; top:-20px;}
.gnb>ul{display:block; padding-top:69px}
.gnb>ul>li{display:block; border-bottom:1px solid #CCC; transition:0.5s}
.gnb>ul>li:first-child{border-top:1px solid #CCC}
.gnb>ul>li:hover{background-color:#f4f4f4}
.gnb>ul>li>a{color:#000; text-align:left; padding:10px; box-sizing:border-box; display:block}
.gnb_top{background-color:#017cbf; position:relative; height:50px}


.logo img{width:130px}
.mob_btn{position:absolute; right:10px; top:23px; cursor:pointer}
.mob_btn i{font-size:45px; color:#FFF}
.mob_btn img{width:40px}
.right_menu{top:13px; right:auto; left:10px; z-index:999}
}
@media all and (max-width:1050px) {
.sub{width:98%}	
.board_write td{padding:10px 0 10px 10px}
}
@media all and (max-width:950px) {
.main_text{font-size:16px; width:170px}
/*.main_gnb>ul>li:last-child .main_text{font-size:14px}	*/
.main_icon img{width:40px}
/*.main_gnb>ul>li a{width:180px}*/
.table_wrap table{width:1200px; margin-right:30px}
.scroll_box{display:block}
}
@media all and (max-width:850px) {
.logo img{width:150px}
.gnb{ bottom:25px}
.gnb>ul>li>a{padding:10px 15px; font-size:18px}	
.right_menu{top:15px; right:50px}
.mob_btn i{font-size:35px}


.main_wrap{width:95%}
.main_img{max-width:180px;}
.main_menu{width:100%; margin:100px auto 0}
.heart{width:220px; }	
.main_footer p{font-size:12px}
.tab>ul>li{font-size:15px}
.main_footer{bottom:30px; left:2%}
.right_menu>ul>li{margin-right:10px}
.next_btn{width:125px; padding:10px 0}

.radio_btn label{font-size:14px}
.check_box label{font-size:14px}
}
@media all and (max-width:800px) {
.board_write th{font-size:14px}	
.logo{margin-left:20px}

}
@media all and (max-width:750px) {

}
@media all and (max-width:600px) {
.sub{padding:40px 0}
.agree_btn{width:310px}
.agree_btn>li{width:150px}
.form_box{padding:20px 10px 20px 10px}
.table_top .search{position:relative; top:0; margin-bottom:10px; text-align:center}
.tab>ul>li{transition:0}
.tab>ul>li::after{width:100%;}

.board_write th{padding:10px 0}
.agree_btn{width:210px}
.agree_btn>li{width:100px}
.agree_btn>li>button{padding:10px 0;}
.tab>ul>li{font-size:12px}
.table_top p{font-size:13px; text-align:center}

.board_write td select{font-size:14px}
.row2 button{font-size:14px; padding:10px 0}
.phone button{padding:10px}
}

@media all and (max-width:500px) {
.phone button{margin-top:10px}	
}
@media all and (max-width:450px) {
#footer p{font-size:10px}	
}

@media all and (max-width:380px) {
.board_write th{font-size:12px; width:25%}	
}
@media all and (max-height:400px) and (max-width:1100px) {
#contents{height:auto}
.main_wrap{position:relative; top:auto; transform:translate(-50%,0)}
.main_footer{position:relative; bottom:10px}
.main_menu{margin-top:80px; position:relative; margin-bottom:20px}

}
@media all and (min-width:1100px) and (max-height:400px){
	.main_img img{width:200px}
	}
/*width important*/

.wd240{width:240px}
.wd5per{width:5% !important}
.wd10per{width:10% !important}
.wd15per{width:15% !important}
.wd20per{width:20% !important}
.wd25per{width:25% !important}
.wd30per{width:30% !important}
.wd40per{width:40% !important}
.wd50per{width:50% !important}
.wd60per{width:50% !important}
.wd70per{width:60% !important}
.wd80per{width:70% !important}
.wd90per{width:80% !important}
.wd100per{width:100% !important}

.wd50{width:50px !important}
.wd100{width:100px !important}
.wd150{width:150px !important}
.wd200{width:200px !important}
.wd250{width:250px !important}
.wd300{width:100% !important}
.wd350{width:350px !important}
.wd400{width:400px !important}
.wd450{width:450px !important}
.wd500{width:500px !important}
.wd550{width:550px !important}

.mt10{margin-top:10px}
.mt30{margin-top:30px}
.acenter{text-align:center}

/*scroll*/
.scroll-x{overflow-x:scroll; -ms-overflow-style:none}
.scroll-x::-webkit-scrollbar-track{background-color: #CCC;}
.scroll-x::-webkit-scrollbar	{height: 3px; display:none}
.scroll_block::-webkit-scrollbar{display:block}
.scroll-x::-webkit-scrollbar-thumb{background-color: #999;}

input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.str_asterisk:after {
  content: "* ";
  color:red;
  font-weight: bold;
  white-space: pre;
}