@charset "utf-8";

.top_link { position:relative; width:100%; margin:28px auto 8px; }
.top_link:after { display:block; padding-bottom:15px;  content:""; clear:both; } 
.top_link ul { }
.top_link ul li { float:left; width:25%; height:90px; border-left:1px solid #e6e6e6; border-top:1px solid #e6e6e6; border-right:1px solid #e6e6e6; border-bottom:1px solid #e6e6e6; box-sizing:border-box; }
.top_link ul li a { display:block; line-height:24px; padding-top:20px; padding-left:90px; }
.top_link ul li span { font-size:14px; font-weight:300; }
.top_link .business { border-right:0; font-size:18px; font-weight:600; background:#f9f9f9 url('/open_content/welfare/images/main/main_t01_icon.gif') no-repeat 25px 9px; }
.top_link .community { border-right:0; font-size:18px; font-weight:600; background:#f9f9f9 url('/open_content/welfare/images/main/main_t02_icon.gif') no-repeat 25px 9px; }
.top_link .help { border-right:0; font-size:18px; font-weight:600; background:#f9f9f9 url('/open_content/welfare/images/main/main_t03_icon.gif') no-repeat 25px 9px; }
.top_link .happy { width:27%; padding:0; background:#d7ecf0 url('/open_content/welfare/images/main/main_t04_bg.gif') no-repeat left; }
.top_link .happy img { position:absolute; top:0; right:0; margin-top:-25px; }

/*#con_btn { overflow:hidden; }*/
#con_btn ul { width:100%; overflow:hidden; }
#con_btn ul li { position:relative; float:left; font-weight:bold; }
#con_btn ul li a { display:block; width:512px; height:227px; text-decoration:none; }

#con_btn ul li span.img { display:block; }
#con_btn ul li span.txt { position:absolute; top:50px; line-height:28px; font-size:20px; color:#fff; }
#con_btn ul li a:hover span.txt { top:40px; line-height:30px; font-size:22px; }

#con_btn ul li a .txt1 { left:37px; }
#con_btn ul li a:hover .txt1 { color:#5ba115; }

#con_btn ul li a .txt2 { left:37px; }
#con_btn ul li a:hover .txt2 { color:#0fa15d; }

#con_btn ul li a .txt3 { left:283px; }
#con_btn ul li a:hover .txt3 { color:#e45c71; }

#con_btn ul li a .txt4 { left:283px; letter-spacing:-2px; }
#con_btn ul li a:hover .txt4 { letter-spacing:-1px; color:#b85eaf; }

#con_btn ul li a .txt5 { left:37px; letter-spacing:-2px; }
#con_btn ul li a:hover .txt5 { letter-spacing:-1px; color:#0b5cb6; }

#con_btn ul li a .txt6 { left:37px; letter-spacing:-2px; }
#con_btn ul li a:hover .txt6 { letter-spacing:-1px; color:#683b0b; }

#con_btn ul li a .txt7 { left:283px; letter-spacing:-2px; }
#con_btn ul li a:hover .txt7 { letter-spacing:-1px; color:#06a792; }

#con_btn ul li a .txt8 { left:283px; letter-spacing:-2px; }
#con_btn ul li a:hover .txt8 { letter-spacing:-1px; color:#5ba115; }

/*****************************************************************************************************************************************************************************************/


@media all and (min-width:1141px) { 
	#con_btn h3.tit { margin-left:0px; }
	#con_btn div.txt>p { margin-top:39px; }
	#con_btn ul li { float:left; font-weight:bold; }


} 

@media all and (max-width:1024px) {
	/*.wrapper { width:95% !important; }*/
	#con_btn ul { width:100%; margin:0 22%; }
	/*#con_btn ul li { float:none; }*/

} 

@media all and (min-width:931px) { 

	.borderL { border-left:1px solid #e6e6e6; }
	.borderR { border-right:1px solid #e6e6e6; }
	.borderT { border-top:1px solid #e6e6e6; }
	.borderLT { border-left:1px solid #e6e6e6; border-top:1px solid #e6e6e6; }
	.borderRT { border-right:1px solid #e6e6e6; border-top:1px solid #e6e6e6; }
	.borderLR { border-left:1px solid #e6e6e6; border-right:1px solid #e6e6e6; }
	.borderLTR { border-left:1px solid #e6e6e6; border-right:1px solid #e6e6e6; border-top:1px solid #e6e6e6; }

} 

@media all and (max-width:930px) { 
	.wrapper { width:98% !important; }
	.dp_mb { display:none; }

	.top_link { margin-left:2%; }
	.top_link ul li { width:48%; border-left:1px solid #e6e6e6; border-top:1px solid #e6e6e6; border-right:1px solid #e6e6e6; border-bottom:1px solid #e6e6e6; }
	.top_link .business { border-right:0; border-bottom:0; }
	.top_link .community { border-right:1px solid #e6e6e6; border-bottom:0; }
	.top_link .help { border-right:0; }
	.top_link .happy { width:48%; }
	.top_link .happy img { top:46%; text-align:center; margin-right:70px; }



} 

@media all and (max-width:768px) { 
	.dp_pc { display:none; } 
	
	#con_btn ul { width:100%; margin:0 10%; }

} 

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

	#con_btn ul { margin:0 3%; }

} 

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

	.top_link ul li { width:96% }
	.top_link .business { border-right:1px solid #e6e6e6; border-bottom:0; }
	.top_link .community { border-right:1px solid #e6e6e6; border-bottom:0; }
	.top_link .help { border:1px solid #e6e6e6; }
	.top_link .happy { width:96%; }
	.top_link .happy img { width:auto; top:275px; }

	#con_btn ul { margin:0 3px; }
	#con_btn ul li img{ display:none; }
	#con_btn ul li { position:relative; width:100%; height:150px; border-bottom:1px solid #fff; }
	#con_btn ul li span.txt { top:40px; left:40px !important; color:#fff; }
	#con_btn ul li a:hover span.txt { color:#fff; top:30px; left:37px !important; font-size:24px; line-height:33px; }

	#con_btn ul .box1 { background:#5ba115 url('/open_content/welfare/images/main/box1.png') no-repeat 90% bottom; }
	#con_btn ul .box2 { background:#0fa15d url('/open_content/welfare/images/main/box2.png') no-repeat 90% bottom; }
	#con_btn ul .box3 { background:#e45c71 url('/open_content/welfare/images/main/box3.png') no-repeat 90% bottom; }
	#con_btn ul .box4 { background:#b85eaf url('/open_content/welfare/images/main/box4.png') no-repeat 90% bottom; }
	#con_btn ul .box5 { padding-bottom:30px; background:#0b5cb6 url('/open_content/welfare/images/main/box5.png') no-repeat 90% bottom; }
	#con_btn ul .box6 { padding-bottom:70px; background:#683b0b url('/open_content/welfare/images/main/box6.png') no-repeat 90% bottom; }
	#con_btn ul .box7 { background:#06a792 url('/open_content/welfare/images/main/box7.png') no-repeat 90% bottom; }
	#con_btn ul .box8 { background:#5ba115 url('/open_content/welfare/images/main/box8.png') no-repeat 90% bottom; }
} 

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

	.top_link .happy img { margin-right:0; }
	#con_btn ul li span.txt { top:20px; left:10px !important; color:#fff; }
	#con_btn ul li a:hover span.txt { top:20px; left:10px !important; font-size:24px; line-height:33px; }
	#con_btn ul .box3, #con_btn ul .box8 { padding-bottom:30px; }

}