/*===============================
	lg 
===============================*/
@media (max-width: 1400px) {
	.shtml .sbg {display:none;}
	#footer .ft_info {width:50%;}

}

/*===============================
	md
===============================*/
@media (max-width: 1024px) {
	body {overflow:auto;}
	body:after {display:block; clear:both; content:""}
	
	#wrap {position:static; height:auto; width:100%; min-width:auto; }
	#header {position:fixed; left:0; top:0; width:100%; max-width:100%; height:80px; background:rgba(255,255,255,1)}
	#header .logo {position:absolute; left:15px;top:15px; height:auto;}
	#header .logo img {position:static; width:80%; height:auto;}
	/*
	#header .nav {position:fixed; display:table; width:100%; height:101%; background:rgba(0,0,0,0.8); overflow:auto; opacity: 1;
		visibility: visible;
		pointer-events: none;
	}
	#header .nav * {transition:1s;}
	#header .nav #nav_navi_r_web {display:table-cell;  vertical-align:middle;}
	#header .nav .web_cate_ul1 {width:100%;}
	#header .nav .web_cate_li1 {width:100%; text-align:center; background:none;}
	#header .nav web_cate_lia1 {display:block;}
	#header .nav .web_cate_ul2 {position:relative; left:0; width:100%; background:none;}
	#header .nav .web_cate_lia2:before {display:none;}
	*/
	.tnb {display:none; position:absolute; right:0; text-align:right; background:none;}	
	.yp-container {position:static; width:100%; margin-top:80px;}
	.yp-container:after {display:block; clear:both; content:""}

	#mvis {position:relative; width:100%;}
	#mvis .item  {width:100%; padding-top:60%; height:0 !important}
	#mvis .mtxt {margin-left:0; width:40%;}
	#st1 {position:static; width:100%; max-width:100%;}
	
	#footer {position:static;width:100%;}
	#footer .ft_logo {display:none; }

	.shtml { width:100%;}
	.shtml:before {display:none; width:0; min-width:0; max-width:0; }
	.shtml #container {width:100%; padding:120px 15px 15px; }
	.shtml .sbg {display:none;}

	.shtml #footer .ft_info {width:80%;}
	.shtml #footer .sns dd {width:30px;}
}


/*===============================
	sm 
===============================*/
@media (max-width: 991px) {
	.shtml .sbg {display:none;}

	#footer .ft_info {display:block; margin:0 auto; margin-top:20px; width:80%; font-size:11px; text-align:center; padding-left:0;}
	#footer .sns {display:block; margin:0 auto; margin-bottom:34px; text-align:center;}


}

/*===============================
	xs 
===============================*/
@media (min-width: 640px) {
	#st1 .mbn3 .btn_more,
	#st1 .mbn4 .btn_more {display:none;}
}

@media (max-width: 640px) {

	#footer {height:100px;}
	
	#st1 .mbn1,
	#st1 .mbn2,
	#st1 .mbn3,
	#st1 .mbn4 {width:50%;}
	#st1 .mbn5 {width:100%;}
	#st1 .mbn1:after,
	#st1 .mbn2:after,
	#st1 .mbn3:after,
	#st1 .mbn4:after {padding-bottom:100%;}
	#st1 > div .mbn_con {padding:10%;}
	#st1 > div[class^="mbn"]:not(.mbn5) i {top:auto; right:10%; bottom:10%;left:auto; width:20%;}
	#st1 > div[class^="mbn"]:not(.mbn5) dl {position:absolute; top:10%; right:auto; bottom:auto;left:10%;}
	#st1 > div[class^="mbn"]:not(.mbn5) dt {font-size:20px; font-weight:500;}
	#st1 > div[class^="mbn"]:not(.mbn5) dd {font-size:1em; font-weight:300;}


}


/*===============================
	xs Portrait 
===============================*/

@media (max-width: 479px) {
	#st1 .mbn3 dt,
	#st1 .mbn4 dt {font-size:2em;}
	#st1 .mbn3 dd,
	#st1 .mbn4 dd {font-size:1em;}

	#footer .ft_info {font-size:11px; text-align:center; padding-left:0;}
}