@charset "utf-8";

/*!
 *@(주)가민정보시스템
 *@2021.03.10.홍원선
 *@추가수정 : 수정시 작성
 */

/*=================
모바일 및 기본 세팅
===================*/


/*리스트타입*/
.list_basic { overflow:hidden; margin-bottom:20px;}
.list_basic > li{ position:relative; color:#505050; line-height:150%;  margin-bottom:7px; padding-left:17px; font-size:14px; font-weight:400; word-break:keep-all}
.list_basic > li > .list_basic{margin:5px 0;}

.list_basic > li.no_bullet{ padding-left:0px; background:none !important; margin-top:5px; }
.list_basic > li.no_bullet:before{ display:none;}
.list_basic > li:before{ position:absolute; display:block; content:""; left:0; top:9px;}
.lt01 > li:before{width:5px; height:5px; background:#f0be68; left:2px;}
.lt02 > li:before{width:8px; height:2px; background:#d9dadc; left:0;}
.lt03 > li:before{width:5px; height:5px; background:#777; left:0; top:11px;}
@media all and (min-width:1024px){
	.list_basic > li{ font-size:16px; }
}

/*기본테이블*/
.basic_table { width:100%; border-collapse:collapse; border-top:#2e2e2e solid 3px;}
.basic_table thead tr th {padding:15px 5px; border:#dbdee8 solid 1px; background:#f4f4f4;}
.basic_table tbody tr th,.basic_table tbody tr td {padding:15px 5px; border:#dbdee8 solid 1px; }
.basic_table th { font-size:14px; color:#454545; vertical-align:middle; }
.basic_table tbody tr th{background:#f8f8f8;}
.basic_table td { font-size:14px; color:#454545;  line-height:150%; text-align:center;  vertical-align:middle; word-break:keep-all}
.basic_table td a{ padding:3px 10px; font-size:14px;  border:#999 solid 1px;  text-decoration:none; border-radius: 3px }
.basic_table td a.btn_more{ color:#454545; margin-left:20px; }
.basic_table td .num_select{ height:30px; color:#666; border:#d4d4d4 solid 1px; padding:3px 5px; margin-right:20px;   }
.basic_table .no_border { border-right-style: none; }
.basic_table.table_center tbody td{text-align:center;}
.basic_table .td_center { text-align:center }
.basic_table .td_right { text-align:right }
.basic_table .td_left { text-align:left }
.border_none{ border-right:none;}
.basic_table.mobile{ display:table;  }
.basic_table.pc{ display:none;  }

@media all and (min-width:768px){
	.basic_table thead tr th,.basic_table thead tr td, .basic_table tbody tr th,.basic_table tbody tr td {font-size:17px;}
}

@media all and (min-width:1024px){
	.basic_table thead tr th,.basic_table thead tr td, .basic_table tbody tr th,.basic_table tbody tr td { padding:20px 10px; font-size:18px; }
	.basic_table tbody tr th{ }
	.basic_table.mobile{ display:none;  }
	.basic_table.pc{ display:table;  }
}

.basic_table.style01{ border-radius: 15px; overflow:hidden }
.basic_table.style01 thead tr th{ background:#2852db; color:#fff; }
.basic_table.style01 thead tr th.blue{ background:#5272dc; }
.basic_table.style01 tbody tr th,.basic_table.style01 tbody tr td {  border:0; }
.basic_table.style01 tbody tr td{ background:#f4f4f4; padding:30px 0 ; }
.basic_table.style01 tbody tr td em{ font-size:20px; font-weight: bold; color:#333; font-style: normal }
@media all and (min-width:1024px){
	.basic_table.style01 thead tr th{ font-size:20px;  }
	.basic_table.style01 thead tr th.blue{  font-size:16px; padding:10px 0;  }
	.basic_table.style01 tbody tr td em{ font-size:30px;  }
}

.responsive_table thead tr th{ padding:15px 0;}
.responsive_table tbody tr th,.responsive_table  tbody  tr td{  float:left; min-height: 50px;  line-height: 50px; padding:0 10px;   }
.responsive_table tbody tr th{ width:35%; border-right:0;  border-top:0;}
.responsive_table tbody tr td{ width:65%; border-top:0; }
.responsive_table tbody tr td .bold{ font-size:25px; font-weight:bold; color:#b60f5e; display:inline-block; padding:0 5px;  }
.responsive_table tbody .full{ width:100%; border-right:#b7ccc6 solid 1px }
.responsive_table tbody .full.normal{ line-height: normal; padding:10px; } 
.responsive_table tbody .full label{  display:block; font-size:14px; margin:10px 5px; line-height: 14px }
.responsive_table tbody .full label span{ color:#bb316d; font-weight:bold; display:inline-block; margin-left:5px;  }
.responsive_table tbody .w_auto{ width:auto !important;}
.responsive_table tbody .form-style{ margin-bottom:5px; }
@media all and (min-width:1024px){
.responsive_table thead tr th{ line-height: 30px  }
.responsive_table tbody tr th,.responsive_table  tbody  tr td{  display:table-cell; float:none; }
.responsive_table tbody tr th{ width:25%; border-right:0;  border-top:0; }
.responsive_table tbody tr td{ width:auto; border-top:0;   }
.responsive_table tbody .full{  width:auto }
.responsive_table tbody .full label{ display:inline-block; font-size:16px; }
}

/*반응형테이블*/
.responsive{ min-width:600px; }
.scroltable-wrapper { position: relative; }
.scroltable-container { overflow-x:auto}
.scroltable-nav { display: none;  position: absolute;  width: 60px;  height: 100%;  cursor: pointer;}
.scroltable-nav.scroltable-nav-left { left: 0; background: url(../images/arrow-left.png) no-repeat left 50%, linear-gradient(to left, rgba(255,255,255,0), #fff);}
.scroltable-nav.scroltable-nav-right { right: 0; background: url(../images/arrow-right.png) no-repeat right  50%, linear-gradient(to right, rgba(255,255,255,0), #fff);}

#footer{ background:#4b4b55; color:#fff; padding:30px 15px; text-align: center;}
#footer h1{ margin-bottom:10px; }
#footer p{ font-size:14px!important; line-height: 1.3; margin-bottom:10px; font-weight:300;}
@media all and (min-width:1024px){
	#footer p br{display:none;}
}



#wrap{position:relative; }
#header{background:linear-gradient(to right, #57bb73 0%, #009566 100%);}
#header .container{padding:30px 15px;}
#header .logo{float:left;  margin-bottom:40px;}
#header .go_site{float:right; margin-bottom:10px;}
#header .go_site a{ border:#fff solid 1px; border-radius:10px; color:#fff; font-size:14px; padding:5px 15px 8px;}
#header .logo img{ width:100px;} 
#header h1{ font-family:'Gmarket Sans', sans-serif; color:#fff; text-align: center; clear:both; font-size:25px; margin-bottom:15px; line-height:1.5; word-break:keep-all; text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5); } 
#header p{ font-family:'Gmarket Sans', sans-serif; text-align:center; color:#005138; line-height:1.4;  font-size:16px; margin-bottom:25px;  word-break: keep-all; font-weight:600;} 


/* 상단메뉴 */
.menu{background:#ced9e7;}
.menu ul{overflow:hidden;}
.menu ul li{/* width: 100%; */background:#7697bd;border-right:1px solid #ced9e7;float:left;/* width: 50%; */text-align:center;}
.menu ul li:nth-child(2){background: #dc8002;}
.menu ul li:nth-child(3){background:#dc8002;}
.menu ul li:nth-child(4){background:#dc8002;}

.menu ul li{border-bottom: 1px dashed #9db8d7;}
.menu ul li:first-child{border-bottom:0;}
.menu ul li.active{background:#242372;}
.menu ul li a{display: flex;display:block;padding: 15px; color:#fff; line-height:1.3; font-size:14px;/* align-items: center; *//* height: 70px; *//* text-align: center; */}
.menu ul li a br{display:none;}
.menu ul li a:hover{text-decoration:underline;}

.s_menu{padding:20px; overflow:hidden;}
.s_menu li{float:left; border:1px solid #584a26; border-radius:5px; text-align:center; margin-right:10px;}
.s_menu li:last-child{margin-right:0;}
.s_menu li.active{background:#ffcd46;}
.s_menu li a{display:block; padding:7px 20px; color:#584a26; line-height:1.3; font-size:14px;}
.s_menu li.active a{font-weight:500;}

.content_wrap{background:#e1eefd;}
.content{padding:30px 20px;}

.s_content_wrap .content{padding-top:0;}
h2{font-size:24px; color:#242372; text-align:center; margin-bottom:20px;}
p.state{text-align:center; background:#242372; border-radius:10px; padding:10px; color:#fff; font-size:18px; font-weight:300; line-height:1.5;}
p.state span{color:#ffdd3f; font-weight:500;}

.state_cont{margin-top:30px;}
.state_cont > li{margin-top:20px;}
.state_cont > li > span{display:block; text-align:center; padding:15px; color:#fff; font-size:18px;}
.state_cont > li > span.title{background:#ca6682; border-radius:10px 10px 0 0; font-weight:600;}
.state_cont > li > span.text{background:#d98199; border-radius:0 0 10px 10px; font-size:15px;}
.state_cont > li > span.text em{font-style:normal; font-size:22px; font-weight:600; margin-right:3px;}
.state_cont > li > .number{background:#fff; border:3px solid #ec9ab1; margin-top:15px; border-radius:10px; padding:15px 30px;}
.state_cont > li > .number > li{margin-bottom:10px; overflow:hidden;}
.state_cont > li > .number > li:last-child{margin-bottom:0;}
.state_cont > li > .number > li > em{font-style:normal; float:left;}
.state_cont > li > .number > li > span{float:right;}

.state_cont > li:nth-child(2n) > span.title{background:#4876d6;}
.state_cont > li:nth-child(2n) > span.text{background:#5e8ce4;}
.state_cont > li:nth-child(2n) > .number{border:3px solid #89a9ec;}

.state_cont > li:nth-child(3n) > span.title{background:#36a0b8;}
.state_cont > li:nth-child(3n) > span.text{background:#4bb1c8;}
.state_cont > li:nth-child(3n) > .number{border:3px solid #6bc5db;}

.top_box{background:#f4f7fa; padding:20px; border-radius:5px; margin-bottom:40px;}
.top_box h3{font-size:20px; font-weight:600; text-align:center; margin-bottom:15px; line-height:1.3;}
.top_box h3 span{position:relative; z-index:1;}
.top_box p{font-size:17px; font-weight:500; line-height:1.4; margin-bottom:20px; text-align:center;}
.top_box p span{color:#2725d5;}
.top_box ul li{line-height:1.4;}
.top_box ul li span{color:#dc1414; font-weight:400; font-size:16px;}
.btn_area{margin-top:15px; text-align:center;}
.btn_area a{display:inline-block; line-height:1.5; white-space:normal; background:#e2ebf4; border:1px solid #a1b4cc; border-radius:5px; color:#284b76; font-weight:500;}

h3.title{font-size:24px; text-align:center; margin-top:30px;}
.map_area{border:1px solid #dedede; height:500px; margin:30px 0 50px 0;}

.call_box ul{margin-bottom:0;}
.call_box h3{color:#242372}
h4.title{font-size: 24px;color:#242372;margin-bottom:10px;margin-top: 40px;text-align: center;}
.call_wrap{padding:20px 30px; border:1px solid #dedede;}
.call_wrap > div:first-child{margin-bottom:15px; padding-bottom:15px; border-bottom:1px dashed #ccc;}
.call_wrap > div > .title{font-size:16px;text-align:center;display:block;margin-bottom:10px;font-weight: 500;padding: 10px;background: #f8f8f8;border-radius: 5px;}


/*220816추가*/
.call_wrap > div > h4{text-align:center; margin-bottom:10px;font-size: 18px;}
.call_wrap > div > .title{font-size:16px;text-align:center;display:block;margin-bottom:10px;font-weight: 500;padding: 10px;background: #f8f8f8;border-radius: 5px;line-height: 1.2;}
.call_wrap > div > .title > em.color01{font-style:normal; color:#e80000;}
.call_wrap > div > .title > em.color02{font-style:normal; color:#0300d1;}
.call_wrap > div > ul{margin-bottom:0;}



@media all and (min-width:480px){
	#header h1{font-size:30px;}
	#header p{font-size:18px;}
	
	.menu ul li a{font-size:15px;}
	.menu ul li a br{display:none;}
}
@media all and (min-width:640px){
	#header h1{font-size:34px;}
	.content p.state br{display:none;}
	
	.s_menu li a{font-size:16px;}
	.s_menu li a br{display:none;}
	.s_content_wrap .content{margin-top:20px;}
	.top_box{padding:30px;}
	.btn_area a{padding:7px 40px 7px 20px; position:relative;}
	.btn_area a:after{display:block; position:absolute; right:10px; top:7px;}
	.btn_area a.btn_down:after{content:url("../images/btn_down.png");}
	.btn_area a.btn_blank:after{content:url("../images/btn_blank.png");}

	.call_wrap{display:flex; flex-wrap:nowrap; justify-content:space-between; margin-bottom:30px;}
	.call_wrap > div{width:50%;padding: 15px 30px;}
	.call_wrap > div:first-child{margin-bottom:0; padding-bottom:0; border-right:1px dashed #ccc; border-bottom:0;}
}
@media all and (min-width:768px){
	#header h1{font-size:40px;}
	#header p{font-size:20px;}
	
	.menu ul li a, .s_menu li a{font-size:17px;}
	.content{padding:60px 20px 55px 20px;}
	h2{font-size:32px;}
	p.state{font-size:24px;}
	.state_cont{overflow:hidden; margin-top:40px;}
	.state_cont > li{float:left; width:32.33%; margin-right:1.5%; margin-top:0;}
	.state_cont > li:last-child{margin-right:0;}
	.state_cont > li > span.title{font-size:22px;}
	.state_cont > li > span.text em{font-size:26px;}
	.state_cont > li > .number{min-height:127px; padding:20px 30px;}
	.state_cont > li > .number > li{font-size:17px; margin-bottom:15px;}
	
	.top_box{margin-bottom:50px; padding:50px 40px;}
	.top_box h3{font-size:20px; margin-bottom:20px;}
	.top_box p{font-size:20px; margin-bottom:30px;}
	.top_box ul li, .top_box ul li span, .btn_area a{font-size:18px;}
	.top_box ul li{margin-bottom:5px;}
	.btn_area{margin-top:25px;}

	.call_box ul{display:flex; flex-wrap:wrap; justify-content:space-between;}
	.call_box ul li{width:50%; font-size:16px;}
	
	.exp{font-size:16px;}
	h3.title{font-size:30px;}
}



@media all and (min-width:1024px){
	#header .container{ position:relative; max-width:1500px; margin:0 auto; background:url(../images/corona_title.png) no-repeat bottom 0 center;}
	#header .logo{ text-align:left; padding-right:30px;}
	#header h1{font-size:50px; margin-bottom:45px;}
	#header p{font-size:22px;}
	.menu ul, .s_menu, .content{width:1000px; margin:0 auto;}
	.menu ul li{width: 250px;display: block;}
	.menu ul li:first-child, .menu ul li:nth-child(2){border-bottom:0}
	h3.title{margin-top:60px;}
	.exp{display:none;}

}



@media all and (min-width:1100px){
	.menu ul, .s_menu, .content{width:1100px;}
	.s_content_wrap .content{padding:0;}
	.menu ul li a{/* font-size: 16px; */}
	h2{font-size:44px;}
	p.state{width:740px; margin:0 auto; font-size:30px;}
	.state_cont > li > span.title{padding:20px; border-radius:20px 20px 0 0; font-size:24px;}
	.state_cont > li > span.text{padding:20px; font-size:17px; border-radius:0 0 20px 20px;}
	.state_cont > li > span.text em{font-size:36px;}
	.state_cont > li > .number{border-radius:20px; padding:20px 80px;}
	.state_cont > li > .number > li{font-size:18px;}
	
	.s_menu{padding:30px 20px 20px 20px;}
	.top_box h3, .top_box p{font-size: 25px;}
	.top_box ul li, .top_box ul li span{font-size:21px;}

	.call_box ul li{font-size:18px; margin-top:10px;}
}
@media all and (min-width:1300px){
	.menu ul, .s_menu, .content{width:1300px;}
}
@media all and (min-width:1500px){
	.menu ul, .s_menu, .content{width:1500px;}
}



/*인트로페이지*/
.box_flex{width: 100%;display:flex;flex-direction: column;flex-wrap: wrap;}

@media all and (min-width:768px){
.box_flex{width: 100%;display:flex;flex-direction: row;flex-wrap: nowrap;}	
.menu ul li{border-bottom:0;}
}


@media all and (min-width:1024px){
.menu ul li a{display:flex;align-items: center;justify-content: space-around;height: 70px;font-size: 16px;}
}