@media (max-width: 980px) and (min-width: 310px) {

	.google { display:none; }

	.navs { font-size:1.3em; }

	.bann img { width:70%; }

	.box { width:90%; }

	.box_main { width:90%; margin:auto; margin-bottom:20px; }

	.box_head { font-size:1.2em; }

	.box_bottom { padding:10px; line-height:1.2em; font-size:1.3em; }

	.prods, .pack { font-size:1.3em; }

	.gframe {
		width:80%;
		display:block;
		margin:auto;
		margin-bottom:20px;
		text-align:center;
	}

	iframe { height: 380px; }

	.foot { font-size: 0.8em; }
}


@media (max-width: 1346px) and (min-width: 990px) {

	.gframe { display: none; }

	.navs { font-size:1.0em; }
		
	.bann img { width:60%; }

	.box { width:50%; }

	.box_main { width:48%; float:left; margin:0px 0px 20px 4px; }

	.box_head { font-size:1.2em; }

	.box_bottom { line-height:1.2em; font-size:1.0em; }

	.google {
		width:48%;
		display:block;
		float:right;
		margin:0px 4px 25px 0px;
		text-align:center;
	}

	iframe { height: 420px; }

	.foot { font-size: 1.1em; }

	.prods, .pack { font-size:1.3em; }
}

@media (max-width: 3850px) and (min-width: 1350px) {

	.gframe { display: none; }

	.navs { font-size:1.2em; }

	.bann img { width:50%; }

	.box { width:60%; }

	.box_main { width:48%; float:left; margin:0px 0px 20px 4px; }

	.box_head { font-size:1.4em; }

	.box_bottom { line-height:1.3em; font-size:1.1em; }

	.google {
		width:48%;
		display:block;
		float:right;
		margin:0px 4px 0px 0px;
		text-align:center;
	}

	iframe { height: 480px; }

	.foot { font-size: 1.1em; }

	.prods, .pack { font-size:1.2em; }
}

/* ============================= MAIN CSS ========================================= */

html {
	width:100%;
}

body {
	width:98%;
	margin:auto;
	color:#000;
	border:8px solid #8b44b3;
	border-radius:0.4em;
}
 
* {
	margin:0; 
	padding:0; 
	box-sizing:border-box;
}

.header {
	width:98%;
	margin:auto;
	padding:2%;
	text-align:center;
	line-height:1.3em;
	font-size:1.3em;
}

.navs {
	width:90%;
	margin:auto;
	margin-bottom:20px;
	font-weight:bold;
}

.bann {
	width: 100%;
	text-align:center;
}

.clear { clear: both; }

a, a:hover, a:visited, a:active { text-decoration: none; }

a, a:visited, a:active { color:#8b44b3; }

a:hover { color: #c110d6; }

.foot {
	width:100%;
	text-align:center;
}

.box {
	display:block;
	margin:auto;
	margin-bottom:20px;
	border:2px solid #ddd;
	border-radius:0.4em;
}

.box_main {
	display:block;
	border:2px solid #ddd;
	border-radius:0.4em;
}

.box_head {
	width:100%;
	background:#ddd;
	font-weight:bold;
}

.box_bottom {
	width:100%;
	padding:10px;
	text-align: justify;
	text-justify: inter-word;
}

iframe { width: 100%; }

.phon {
	width:100%;
	margin:8px 0px 8px 0px;
	text-align:center;
	font-size:1.3em;
	font-weight:bold;
}

.prods {
	width:48%;
	display:inline-block;
	padding:4px;
	margin:3px;
	text-align:center;
	font-weight:bold;
}

.pack {
	width:80%;
	display:block;
	padding:4px;
	margin:auto;
	margin-top:8px;
	margin-bottom:8px;
	text-align:center;
	font-weight:bold;
}