@charset "utf-8";
/* ===================================================

◇　Responsive Home CSS　◇

====================================================== */
@media screen and (max-width: 1000px) {
	#charm #contents { width: 100%; margin: 0;}

	#charm section h4,
	#charm .detail { width: 35%;}
	#charm .detail a { max-width: 100%;}
	#charm .flexslider_con,
	#charm .photo { width: 62%;}
}
@media screen and (max-width: 768px) {
	#charm section { padding-top: 100px;}
	#charm .slides img,
	#charm .photo img { width: 100%;}
	#charm .flexslider_con,
	#charm .photo,
	#charm .detail { clear: both; width: 100%; float: none;}
	#charm section h4 { width: 100%; padding: 0 0 30px 0;}
	#charm section h4 span,
	#charm section h4>img { float: left;}
	#charm section h4 span{ width: auto; padding: 20px 20px 10px 0; margin: 0; background: none; text-align: left;}
	#charm .detail p { padding: 20px 0;}
	#charm .detail a { margin-top: 0;}
	#charm .bg { display: none;}
	
	#charm #sec7 { background-position: 71px 240px, center 80px;}
}
@media screen and (max-width: 640px) {
	#charm h3 {}
	#charm section h4 span, #charm h4>img { float: none;}
	#charm section h4 span { padding-top: 0;}
}