#header{ position: fixed; width: 100%; top: 0; left: 0; width: 100%; z-index: 10; }
.top_menu{ background-color: #fff; /*padding: 5px 0;*/ text-align: right; border-bottom: 1px solid #ccc; }
.top_menu::after{ content: ""; clear: both; display: block; }
.logo{ display: inline-block; padding-left: 215px; height: 55px; margin-top: 5px; background-image: url('../images/logo.jpg'); background-repeat: no-repeat; float: left; }
	.logo::after{ display: inline-block; vertical-align: middle; content: "關懷臨終 珍惜所託"; font-size: 16px; border-left: 1px dotted #374152; padding-left: 20px; margin: 16px 0; color: #333; }

nav{ display: inline-block; vertical-align: top; }
.menu{ background-color: #e00b0b; display: inline-block; }
/* #374252 */
	.menu_item{ display: inline-block; vertical-align: top; color: #fff; padding: 25px; font-size: 17px; position: relative; }
	.menu_item::after{ content: ""; display: block; height: 20px; width: 1px; background-color: #fff; position: absolute; right: -1px; top: 23px; }
	.menu_item:last-child::after{ display: none; }
		.menu_item em{ font-style: normal; }
		.inside_nav{ display: none; position: absolute; top: 100%; left: 0; background-color: rgba(255, 255, 255, .95); border: 1px solid #eee; width: 150%; padding: 0 35px; }
		.inside_nav a{ color: #333 !important; text-align: left !important; display: block; width: 100%; padding:  15px 0; border-bottom: 1px solid #bbb; }
		.inside_nav li:last-child a{ border-bottom: 0; }
		.menu_item a{ color: #fff; }

.phone{ display: inline-block; text-align: left; color: #374152; font-size: 25px; font-family: Verdana;  padding: 0 10px; padding-bottom: 5px; }
	.phone::before{content: "免費服務專線"; display: block; font-size: 15px; padding: 5px 0; }
.fa-bars{ display: none; }

@media screen and (min-width: 1024px){
.menu_item:hover .inside_nav{ display: block!important; }
}

@media screen and (orientation: portrait) and (max-width: 767px){
.logo{ padding-left: 155px; background-size: auto 90%; height: auto; }
	.logo::after{ font-size: 14px; border-left: 0; }
}

@media screen and (min-width: 1024px) and (max-width:1240px){
	.logo{ position:relative;padding-left:185px;height:45px;margin:5px 0;background-size: auto 100%;}
	.logo::after{ position:absolute;bottom:-10px;left:60px;border:0;padding:0;margin:0;font-size:14px;}
	.menu_item{padding:22px 10px;font-size:16px;}
}
@media screen and (min-width: 1241px) and (max-width:1450px){
	.menu_item{padding:22px 20px;font-size:16px;}
}
@media screen and (max-width: 1024px){
.logo{ padding-left:185px;height:45px;margin:9px 0;background-size: auto 100%;}
.logo::after{ margin-top: 12px; }
.menu_item{ padding: 22px 10px; font-size: 16px; }
}

@media screen and (max-width: 1023px){
._fixed{ position: fixed; height: 100%; overflow-y: hidden; }
.menu,.phone{ display: none; }
.logo::after{ padding-left: 0; border-left: 0; }
.fa-bars{ display: block; float: right; padding: 15px; }

/*menu*/
.top_menu{ position:relative;height:66px;}
	.menu{ position: fixed; top: 66px; bottom: 0; left: 0; width: 0; overflow-x: hidden; background-color: rgba(55, 66, 82, .95); padding: 20px 0; overflow-y: scroll; -webkit-transition: all .5s ease-in-out; -o-transition: all .5s ease-in-out; transition: all .5s ease-in-out; }
	.menu_item{ width: 90%; margin: 0 5%; font-size: 17px; border-bottom: 1px solid #ddd; text-align: center; }
		.menu_item a{ width: 100%; padding: 30px 0;}
	.menu_item:last-child{ border-bottom: 0; }
	.menu_item::after{ display: none; }

	.active .menu{ display: block; width: 100%; }
	.active .inside_nav{ padding: 0 0 15px; margin-top: -10px; background-color: transparent; position: relative; border: 0; width: auto; }
	.active .menu_item{ padding: 0; }
	.active .menu_item > a,.active .menu_item > em{ display: block; padding: 6%; display: block; }
	.active .inside_nav a{ border-bottom: 0; font-size: 14px; color: #fff !important; padding: 15px 0; text-align: center !important; letter-spacing: 2px; }
}

@media screen and (max-width: 375px){
.logo{ padding-left: 153px; background-size: auto 40px; }
.fa-bars{ padding: 15px 12px; }
}

#cart{
	position: fixed;  /*固定在網頁上不隨卷軸移動，若要隨卷軸移動用absolute*/
	top: 70%;  /*設置垂直位置*/
	right: 0px;  /*設置水平位置，依所放的內容多寡需要自行手動調整*/
	z-index: 99;
	background-color:#3490dc;
	 border-radius: 10px;
	 padding:5px;
	 border:3px solid #ffffff;
	 margin-right: 3px;
}

#cart .num {
	border-radius: 10px;
	background-color: red;
	color: #ffffff;
	width:20px;
	height:20px;
	position: relative;
	left: 30px;
	top: -15px;
	text-align: center;
	margin-bottom: -15px;
	font-size: 12px;
}
