@charset "UTF-8";
@import url("base.css");
@import url("side.css");

#h1_index {
	width: 648px;
	height: 240px;
	background:url(../images/service/ourservice_main.jpg);
	background-repeat: no-repeat;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	margin: 0 0 0 20px;
}

#h1_office_cafe {
	width: 648px;
	height: 240px;
	background:url(../images/service/office_cafe/officecafe_main.jpg);
	background-repeat: no-repeat;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	margin: 0 0 0 20px;
}

#h1_fresh_brew {
	width: 648px;
	height: 240px;
	background:url(../images/service/fresh_brew/fresh_brew_main.jpg);
	background-repeat: no-repeat;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	margin: 0 0 0 20px;
}

#h1_whole_bean {
	width: 648px;
	height: 240px;
	background:url(../images/service/whole_bean/wholebean_main.jpg);
	background-repeat: no-repeat;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	margin: 0 0 0 20px;
}

#h1_nespresso_professional {
	width: 648px;
	height: 240px;
	background:url(../images/service/nespresso_professional/nespresso_pro_main.jpg);
	background-repeat: no-repeat;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	margin: 0 0 0 20px;
}

#h1_nespresso {
	width: 648px;
	height: 240px;
	background:url(../images/service/nespresso/nespresso_main.jpg);
	background-repeat: no-repeat;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	margin: 0 0 0 20px;
}

#h1_mars {
	width: 648px;
	height: 240px;
	background:url(../images/service/mars/mars_main.jpg);
	background-repeat: no-repeat;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	margin: 0 0 0 20px;
}

#h1_tea {
	width: 648px;
	height: 240px;
	background:url(../images/service/tea/tea_main.jpg);
	background-repeat: no-repeat;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	margin: 0 0 0 20px;
}

#h1_water_server {
	width: 648px;
	height: 240px;
	background:url(../images/service/water_server/waterserver_main.jpg);
	background-repeat: no-repeat;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	margin: 0 0 0 20px;
}

#h1_drink_catering {
	width: 648px;
	height: 240px;
	background:url(../images/service/drink_catering/drinkcatering_main.jpg);
	background-repeat: no-repeat;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	margin: 0 0 0 20px;
}

#h1_total_management {
	width: 648px;
	height: 240px;
	background:url(../images/service/total_management/totalmanagement_main.jpg);
	background-repeat: no-repeat;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	margin: 0 0 0 20px;
}

#h1_water_server_stock {
	width: 648px;
	height: 240px;
	background:url(../images/service/water_server_stock/waterserverstock_main.jpg);
	background-repeat: no-repeat;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	margin: 0 0 0 20px;
}

.h2_red_text {
	clear: both;
	font-size: 15px;
	color: #e50000;
	margin: 0 0 10px 0;
	padding: 0;
}

.h2_blue_text {
	clear: both;
	font-size: 15px;
	color: #00afee;
	margin: 0 0 10px 0;
	padding: 0;
}

.h2_fb_text {
	clear: both;
	font-size: 15px;
	color: #4fc1e4;
	margin: 0 0 10px 0;
	padding: 0;
}

.h2_line_red {
	clear: both;
	display: block;
	width: 608px;
	height: 32px;
	margin: 0 0 15px 0;
	padding: 18px 0 0 10px;
	font-size: 15px;
	color: #e50000;
	background:url(../images/service/h2_red_bg.gif);
	background-repeat: repeat-x;
}

.h2_line_blue {
	clear: both;
	display: block;
	width: 608px;
	height: 32px;
	margin: 0 0 15px 0;
	padding: 18px 0 0 10px;
	font-size: 15px;
	color: #07ADE9;
	background:url(../images/service/h2_blue_bg.gif);
	background-repeat: repeat-x;
}

.h2_line_fb {
	clear: both;
	display: block;
	width: 608px;
	height: 32px;
	margin: 0 0 15px 0;
	padding: 18px 0 0 10px;
	font-size: 15px;
	color: #4fc1e4;
	background:url(../images/service/h2_fb_bg.gif);
	background-repeat: repeat-x;
}

.h2_line_green {
	clear: both;
	display: block;
	width: 608px;
	height: 32px;
	margin: 0 0 15px 0;
	padding: 18px 0 0 10px;
	font-size: 15px;
	color: #00A096;
	background:url(../images/service/h2_green_bg.gif);
	background-repeat: repeat-x;
}

.h3_red_text {
	clear: both;
	font-size: 14px;
	color: #310004;
	margin: 0 0 5px 0;
	padding: 0;
}

.h3_brown_text {
	clear: both;
	font-size: 11px;
	color: #7e4852;
	margin: 0;
	padding: 0;
}

.h2_red_text_13 {
	clear: both;
	font-size: 13px;
	color: #e50000;
	margin: 0 0 10px 0;
	padding: 0;
}

.h3_gray_bg {
	clear: both;
	display: block;
	width: 610px;
	height: 26px;
	margin: 0 0 20px 0;
	padding: 10px 0 0 10px;
	color: #ffffff;
	font-size: 12px;
	background:url(../images/service/h3_gray_bg.gif);
	background-repeat: no-repeat;
}

.h3_green_bg {
	clear: both;
	display: block;
	width: 610px;
	height: 26px;
	margin: 0 0 20px 0;
	padding: 10px 0 0 10px;
	color: #ffffff;
	font-size: 12px;
	background:url(../images/service/h3_green_bg.gif);
	background-repeat: no-repeat;
}

.h4_red_text {
	clear: both;
	font-size: 14px;
	color: #e50000;
	margin: 0 0 5px 0;
	padding: 0;
}

#main h5 {
	clear: both;
	font-size: 11px;
	color: #7e4852;
	margin: 0;
	padding: 0;
}

.service_menu {
	float: left;
	width: 644px;
	margin: 0 0 0 20px;
}

.service_menu ul {
	clear: both;
	width: 644px;
	height: 82px;
	margin: 0;
	padding: 0;
}

.service_menu li {
	margin: 0;
	padding: 0;
	height: 82px;
	float: left;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}

.service_menu a {
	display: block;
	width: 644px;
	height: 82px;
	background: url(../images/service/service_menu.jpg) left top;
}

.service_menu_border {
	clear: both;
	width: 680px;
	height: 3px;
	margin: 0 0 0 4px;
	background:url(../images/service/service_menu_border.gif);
	background-repeat: repeat-x;
}

.office_cafe_icon a {
	background-position: 0 -82px;
	display: block;
	height: 82px;
	width: 108px;
}

.office_cafe_icon a:hover, .office_cafe_icon .on {
	background-position: 0 0;
}

.fresh_brew_icon a {
	background-position: 536px -82px;
	display: block;
	height: 82px;
	width: 107px;
}

.fresh_brew_icon a:hover, .fresh_brew_icon .on {
	background-position: 536px 0;
}
/*
.whole_bean_icon a {
	background-position: 552px -82px;
	display: block;
	height: 82px;
	width: 107px;
}

.whole_bean_icon a:hover, .whole_bean_icon .on {
	background-position: 552px 0;
}

.nespresso_professional_icon a {
	background-position: 460px -82px;
	display: block;
	height: 82px;
	width: 107px;
}

.nespresso_professional_icon a:hover, .nespresso_professional_icon .on {
	background-position: 460px 0;
}
*/
.nespresso_icon a {
	background-position: 429px -82px;
	display: block;
	height: 82px;
	width: 107px;
}

.nespresso_icon a:hover, .nespresso_icon .on {
	background-position: 429px 0;
}

.mars_icon a {
	background-position: 322px -82px;
	display: block;
	height: 82px;
	width: 107px;
}

.mars_icon a:hover, .mars_icon .on {
	background-position: 322px 0;
}

.tea_icon a {
	background-position: 215px -82px;
	display: block;
	height: 82px;
	width: 107px;
}

.tea_icon a:hover, .tea_icon .on {
	background-position: 215px 0;
}

.water_server_icon a {
	background-position: 108px -82px;
	display: block;
	height: 82px;
	width: 108px;
}

.water_server_icon a:hover, .water_server_icon .on {
	background-position: 108px 0;
}

.service_menu_b {
	float: left;
	width: 644px;
	margin: 0 0 0 20px;
}

.service_menu_b ul {
	clear: both;
	width: 644px;
	height: 82px;
	margin: 0;
	padding: 0;
}

.service_menu_b li {
	margin: 0;
	padding: 0;
	height: 82px;
	float: left;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}

.service_menu_b a {
	display: block;
	width: 644px;
	height: 82px;
	background: url(../images/service/service_menu_bottom.jpg) left top;
}

.office_cafe_icon_b a {
	background-position: 0 -82px;
	display: block;
	height: 82px;
	width: 108px;
}

.office_cafe_icon_b a:hover, .office_cafe_icon_b .on {
	background-position: 0 0;
}

.fresh_brew_icon_b a {
	background-position: 536px -82px;
	display: block;
	height: 82px;
	width: 107px;
}

.fresh_brew_icon_b a:hover, .fresh_brew_icon_b .on {
	background-position: 536px 0;
}
/*
.whole_bean_icon_b a {
	background-position: 552px -82px;
	display: block;
	height: 82px;
	width: 107px;
}

.whole_bean_icon_b a:hover, .whole_bean_icon_b .on {
	background-position: 552px 0;
}

.nespresso_professional_icon_b a {
	background-position: 460px -82px;
	display: block;
	height: 82px;
	width: 107px;
}

.nespresso_professional_icon_b a:hover, .nespresso_professional_icon_b .on {
	background-position: 460px 0;
}
*/
.nespresso_icon_b a {
	background-position: 429px -82px;
	display: block;
	height: 82px;
	width: 107px;
}

.nespresso_icon_b a:hover, .nespresso_icon_b .on {
	background-position: 429px 0;
}

.mars_icon_b a {
	background-position: 322px -82px;
	display: block;
	height: 82px;
	width: 107px;
}

.mars_icon_b a:hover, .mars_icon_b .on {
	background-position: 322px 0;
}

.tea_icon_b a {
	background-position: 215px -82px;
	display: block;
	height: 82px;
	width: 107px;
}

.tea_icon_b a:hover, .tea_icon_b .on {
	background-position: 215px 0;
}

.water_server_icon_b a {
	background-position: 108px -82px;
	display: block;
	height: 82px;
	width: 107px;
}

.water_server_icon_b a:hover, .water_server_icon_b .on {
	background-position: 108px 0;
}

.service_box {
	clear: both;
/*	width: 620px;*/
	padding: 0;
	margin: 0 0 30px 0;
	overflow:auto;
}

.service_box02 {
	clear: both;
	padding: 0;
	margin: 0 0 30px 0;
	overflow:auto;
}

.service_box03 {
	clear: both;
	padding: 0;
	margin: 0 0 30px 0;
	overflow:auto;
}

.service_box04 {
	float: left;
	width: 310px;
	padding: 0;
	margin: 0 0 30px 0;
	overflow:auto;
}

/*\*/
　* html div.parent{overflow: visible;}
/**/

.service_box img {
	float: left;
	border: 1px solid #cccccc;
	padding: 6px;
	margin: 0 20px 10px 0;
}

.service_box p {
	float: left;
	width: 340px;
}

.service_box02 img {
	float: left;
	margin: 0 20px 10px 0;
}

.service_box03 img {
	float: left;
	margin: 0 10px 10px 0;
}

.service_box04 img {
	float: left;
	margin: 0 10px 10px 0;
}

.service_box02 p {
	float: left;
	width: 360px;
}

.service_box04 p {
	float: left;
	width: 210px;
}

.service_box_r {
	float: left;
	width: 340px;
}

.service_box_r02 {
	float: left;
	width: 210px;
}

.service_box_l {
	float: left;
	width: 490px;
	margin: 0 20px 0 0;
}

.gray_border {
	border: 1px solid #cccccc;
	overflow:auto;
}

.officecafebox01 {
	float: left;
	width: 280px;
	height: 330px;
	padding: 0 20px 10px 0;
	margin: 0 0 40px 0;
	border-right: 1px dotted #cccccc;
}

.officecafebox02 {
	float: left;
	width: 280px;
	height: 330px;
	padding: 0 0 10px 20px;
	margin: 0 0 40px 0;
}

.officecafebox01 img, .officecafebox02 img {
	float: left;
}

.officecafebox_name {
	float: left;
	color: #7e4652;
	padding: 50px 0 0 10px;
	font-size: 13px;
	font-weight: bold;
}

.officecafebox_name02 {
	float: left;
	color: #7e4652;
	padding: 30px 0 0 10px;
	font-size: 13px;
	font-weight: bold;
}

.officecafebox_comment {
	clear: both;
	width: 280px;
	padding: 20px 0 20px 0;
}

.officecafebox_info {
	width: 260px;
	font-size: 11px;
	background-color: #f7f7f1;
	color: #666666;
	padding: 10px;
}

.marsbox {
	clear: both;
	width: 620px;
	padding: 0 0 20px 0;
	margin: 0 0 20px 0;
	border-bottom: 1px dotted #cccccc;
	overflow:auto;
}

/*\*/
　* html div.parent{overflow: visible;}
/**/

.marsbox img {
	float: left;
	margin: 20px 20px 0 0;
}

.marsbox_name {
	float: left;
	width: 450px;
	color: #7e4652;
	padding: 10px 0 0 10px;
	font-size: 13px;
	font-weight: bold;
}

.marsbox_comment {
	float: left;
	width: 450px;
	padding: 20px 0 20px 0;
}

.marsbox_info {
	float: left;
	width: 450px;
	font-size: 11px;
	background-color: #f7f7f1;
	color: #666666;
	padding: 10px;
}

.teabox01 {
	float: left;
	width: 186px;
	padding: 10px;
}

.teabox01 img {
	float: left;
}

.teabox01_name {
	float: left;
	height: 106px;
	line-height: 106px;
	color: #7e4652;
	font-size: 13px;
	font-weight: bold;
}

.teabox01_comment {
	clear: both;
	width: 186px;
	padding: 20px 0 20px 0;
}

.teabox01_rate {
	width: 186px;
	font-size: 11px;
	background:url(../images/service/tea/tea_fresh_icon.jpg);
	background-repeat: no-repeat;
	padding: 4px 0 0 22px;
}

.teabox02 {
	float: left;
	width: 123px;
	margin: 0 0 20px 0;
}

.teabox02_name {
	width: 123px;
	text-align: center;
	color: #7e4652;
	font-size: 13px;
	font-weight: bold;
}

.dotted_right {
	border-right: 1px dotted #cccccc;
}

.font16 {
	font-size: 16px;
}

#teabox03 {
	float: left;
	width: 580px;
	margin: 0 0 0 0;
	padding: 20px 15px 20px 15px;
	border: 6px solid #f7f7f1;
	font-size: 14px;
}

#teabox03 strong {
	color: #009f96;
}

#tea_service_fresh_balloon {
	position: relative;
	z-index: 1;
	top: -300px;
	margin: 0 0 0 330px;
}

#tea_service_fresh_balloon img {
	border: none;
}

.fresh_brew_box01 {
	float: left;
	width: 280px;
	height: 350px;
	padding: 0 20px 10px 0;
	margin: 0 0 40px 0;
	border-right: 1px dotted #cccccc;
}

.fresh_brew_box02 {
	float: left;
	width: 280px;
	height: 350px;
	padding: 0 0 10px 20px;
	margin: 0 0 40px 0;
}

.fresh_brew_box01 img, .fresh_brew_box02 img {
	float: left;
}

.fresh_brew_box_name {
	float: left;
	color: #7e4652;
	padding: 23px 0 0 10px;
	font-size: 13px;
	font-weight: bold;
}

.fresh_brew_box_name02 {
	float: left;
	color: #7e4652;
	padding: 30px 0 0 10px;
	font-size: 13px;
	font-weight: bold;
}

.fresh_brew_box_comment {
	clear: both;
	width: 280px;
	padding: 20px 0 20px 0;
}

.fresh_brew_box_info {
	width: 260px;
	font-size: 11px;
	background-color: #f7f7f1;
	color: #666666;
	padding: 10px;
}

.fresh_brew_roast2, .fresh_brew_roast3, .fresh_brew_roast5 {
	float: left;
	width: 152px;
	height: 27px;
	box-sizing: border-box;
	font-size: 10px;
	color: #ffffff;
	margin: 0 0 0 10px;
	padding: 5px 0 0 8px;
}

.fresh_brew_roast2 {
	background-color: #c79f63;
}

.fresh_brew_roast3 {
	background-color: #7d5934;
}

.fresh_brew_roast5 {
	background-color: #41210f;
}