﻿@charset "utf-8";

/* ---------------------------------
  _01 スタイルリセット
------------------------------------*/

body {
	margin: 0;
	padding: 0;
	line-height: 1.6;
	color: #333;
	background-color: #e5f5c9;
	font-size: small;
}

h1, h2, h3, h4, h5 {
	margin: 0;
	padding: 0;
}

p {
	margin: 0;
	padding: 0;
}

form {
	margin: 0;
	padding: 0;
}

ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

ol {
	margin: 0;
	padding: 0;
}

li {
	margin: 0;
	padding: 0;
}

dl, dt, dd {
	margin: 0;
	padding: 0;
}

img {
	border: 0;
}

hr {
	display: none;
}

a {
	text-decoration: inherit; /* 必要に応じて「none」に */
}

a:link {
	color: #00c;
}

a:visited {
	color: #999;
}

a:hover {
	color: #fc3;
}

/* ---------------------------------
  _02 基本レイアウト
------------------------------------*/

#index h1 {
	margin: 20px 0 10px 10px;
	width: 230px;
	height: 80px;
	background-image: url(../../images/logo.jpg);
	background-position: top left;
	background-repeat: no-repeat;
	text-indent: -10000em;
}

.mainview {
	margin: 0 auto;
	padding-top: 30px;
	position: relative;
	width: 930px;
	height: 470px;
	background-color: #74a173;
	background-image: url(../../images/mainview_bg.jpg);
	background-position: right top;
	background-repeat: no-repeat;
}

.mainview p.link {
	position: absolute;
	top: 24px;
	left: 238px;
}

.mainview p.link a {
	display: block;
	width: 127px;
	height: 114px;
	background-image: url(../../images/link_shopInfo.png);
	text-indent: -10000em;
}

dl#contentsList {
	position: absolute;
	top: 0;
	left: 354px;
}

dl#contentsList dd#content01 {
	position: absolute;
	left: 276px;
	top: 10px;
	width: 216px;
	height: 216px;
}

dl#contentsList dd#content01 a {
	display: block;
	width: 216px;
	height: 216px;
	background-image: url(../../images/content01.png);
	text-indent: -10000em;
}

dl#contentsList dd#content02 {
	position: absolute;
	top: 150px;
	left: 133px;
	width: 168px;
	height: 168px;
}

dl#contentsList dd#content02 a {
	display: block;
	width: 168px;
	height: 168px;
	background-image: url(../../images/content02.png);
	text-indent: -10000em;
}

dl#contentsList dd#content03 {
	position: absolute;
	top: 70px;
	left: 0;
	width: 158px;
	height: 158px;
}

dl#contentsList dd#content03 a {
	display: block;
	width: 158px;
	height: 158px;
	background-image: url(../../images/content03.png);
	text-indent: -10000em;
}

dl#contentsList dd#content04 {
	position: absolute;
	top: 98px;
	left: 492px;
	width: 136px;
	height: 136px;
}

dl#contentsList dd#content04 a {
	display: block;
	width: 136px;
	height: 136px;
	background-image: url(../../images/content04.png);
	text-indent: -10000em;
}

dl#like {
	padding-left: 45px;
	padding-right: 40px;
	position: absolute;
	overflow: hidden;
	left: 642px;
	top: 230px;
	height: 270px;
}

dl#like dt {
	position: absolute;
	top: 102px;
	left: 0;
	width: 143px;
	height: 200px;
	background-image: url(../../images/like_title.png);
	text-indent: -10000em;
}

dl#like dd.photo {
	border: solid 3px #fff;
	overflow: hidden;
	width: 294px;
	height: 294px;
	border-radius: 147px;
	box-shadow: 2px 2px 5px #ccc;
	behavior: url(_common/css/PIE.htc);
}

dl#like dd.photo img.horizontal {
	height: 296px;
}

dl#like dd.photo img.vertical {
	width: 296px;
}

dl#like dd.link {
	position: absolute;
	left: 290px;
	top: 170px;
}

dl#like dd.link a {
	display: block;
	width: 88px;
	height: 88px;
	background-image: url(../../images/like_btn.png);
	text-indent: -10000em;
}

#album {
	padding-left: 10px;
	width: 360px;
}

#album dd {
	margin-right: 10px;
	margin-bottom: 10px;
	float: left;
	overflow: hidden;
	width: 110px;
	height: 110px;
	border-radius: 10px;
	behavior: url(_common/css/PIE.htc);
}

#album dd.horizontal img {
	height: 110px;
}

#album dd.vertical img {
	width: 110px;
}

#facebook {
	padding-top: 23px;
	padding-left: 24px;
	position: absolute;
	left: 320px;
	bottom: 0;
	width: 292px;
	height: 177px;
	background-image: url(../../images/facebook_bg.png);
}

#facebook #fbPhoto {
	float: left;
	overflow: hidden;
	width: 137px;
	height: 137px;
}

#facebook #fbPhoto img {
	height: 137px;
}

#facebook #fbFeeds {
	padding: 10px 0 10px 10px;
	float: left;
	width: 120px;
	color: #fff;
}

#facebook #fbFeeds dl {
	margin-bottom: 10px;
	width: 110px;
}

#facebook #fbFeeds dl dd {
	line-height: 1.2;
}

#facebook #fbFeeds ul li {
	margin-right: 5px;
	float: left;
}

#facebook #fbFeeds ul li a {
	border: solid 1px #999;
	display: block;
	width: 52px;
	height: 20px;
	line-height: 20px;
	background-color: #fff;
	text-align: center;
	border-radius: 4px;
	behavior: url(_common/css/PIE.htc);
}

.information {
	margin: 0 auto;
	width: 930px;
}

.information .leftbox {
	width: 530px;
	float: left;
}

.news {
	margin-bottom: 15px;
	padding: 10px 10px 0 10px;
	border: solid 3px #fff;
	position: relative;
	float: left;
	width: 505px;
	background-color: #f7f7f7;
	border-radius: 5px;
	box-shadow: 0 0 5px #ccc;
	behavior: url(_common/css/PIE.htc);
}

.news h2 {
	margin-bottom: 6px;
	width: 270px;
	height: 20px;
	background-image: url(../../images/news_title.jpg);
	text-indent: -10000em;
}

.news dl {
	width: 505px;
}

.news dt {
	padding: 3px 0 4px 25px;
	border-top: dotted 1px #ccc;
	float: left;
	clear: left;
	width: 90px;
	background-image: url(../../images/news_marker.jpg);
	background-position: 8px center;
	background-repeat: no-repeat;
}

.news dd {
	padding: 3px 0 4px 0;
	width: 390px;
	float: left;
	border-top: dotted 1px #ccc;
}

.news p.link {
	position: absolute;
	top: 10px;
	right: 10px;
}

.news p.link a {
	display: block;
	width: 150px;
	height: 20px;
	background-image: url(../../images/news_btn.jpg);
	background-position: top left;
	background-repeat: no-repeat;
	text-indent: -10000em;
}

.information .banner_chirashi,
.information .banner_technology{
	width: 260px;
	float: left;
    border: solid 1px #ccc;
}

.information .banner_chirashi{
    margin-right: 6px;
}

.information ul.banners {
	float: right;
	width: 390px;
}

.information ul.banners li {
	margin-left: 10px;
	margin-bottom: 10px;
	float: left;
}

.information ul.banners li img {
	display: block;
}

.reco {
	padding-bottom: 30px;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	background-image: url(../../images/reco_bg.png);
}

.reco .container {
	margin: 0 auto;
	position: relative;
	width: 930px;
	height: 470px;
	text-align: center;
}

.reco .container h2 {
	position: absolute;
	top: 332px;
	right: 0;
	width: 143px;
	height: 168px;
	background-image: url(../../images/reco_title.png);
	background-position: top center;
	background-repeat: no-repeat;
	text-indent: -10000em;
	z-index: 100;
}

.reco .container .comment {
	position: absolute;
	top: 210px;
	right: 20px;
	padding-bottom: 15px;
	width: 300px;
	background-image: url(../../images/comment_bg.png);
	background-repeat: no-repeat;
	background-position: bottom left;
	text-align: left;
	z-index: 50;
}

.reco .container .comment .box {
	padding: 15px 15px 20px 15px;
	background-image: url(../../images/comment_box_bg.png);
	border-radius: 5px;
	behavior: url(_common/css/PIE.htc);
}

.reco .container img {
	margin-top: 50px;
	border: solid 10px #fff;
	height: 390px;
	border-radius: 5px;
	box-shadow: 0 0 5px #004000;
	behavior: url(_common/css/PIE.htc);
}

.reco .container p.close {
	display: none;
	position: absolute;
	top: 20px;
	right: 20px;
	color: #fff;
	cursor: pointer;
}

.footer {
	margin: 0 auto;
	width: 930px;
}

.footer dl.contactInfo {
	margin-bottom: 10px;
	padding: 14px 20px 10px 20px;
	border: solid 1px #ccc;
	background-color: #fff;
	border-radius: 5px;
	behavior: url(_common/css/PIE.htc);
}


.footer dl.contactInfo dt {
	padding-right: 15px;
	float: left;
	width: 230px;
	height: 34px;
	background-image: url(../../images/contactInfo_logo.gif);
	background-repeat: no-repeat;
	background-position: top left;
	text-indent: -10000em;
}

.footer dl.contactInfo dd {
	line-height: 1.3;
}

.footer dl.contactInfo dd.tel {
	padding-right: 15px;
	float: left;
	width: 260px;
	height: 34px;
	background-image: url(../../images/contactInfo_tel.jpg);
	text-indent: -10000em;
	background-repeat: no-repeat;
	background-position: top left;
}

.footer p.link {
	padding-left: 15px;
	float: left;
	background-image: url(../../images/link_marker.jpg);
	background-repeat: no-repeat;
	background-position: left center;
}

.footer p.copyright {
	float: right;
}

/* ---------------------------------
  _03 共通項目
------------------------------------*/

.siteName {
	margin-bottom: 5px;
	margin-left: 20px;
	width: 240px;
	height: 40px;
	background-image: url(../images/logo.gif);
	background-repeat: no-repeat;
	background-position: top left;
	text-indent: -10000em;
}

.supplement { /* 補助的にいれる見出しを表示しないようにするクラス */
	position: absolute;
	left: -10000em;
}

.article {
	margin-bottom: 20px;
}

.column {
	padding: 15px;
	background-color: #fcc;
	border-radius: 10px; /* CSS3 */
	-webkit-border-radius: 10px; /* Safari, Google Chrome */
	-moz-border-radius: 10px; /* Firefox */
	behavior: url(_common/css/PIE.htc); /* IE対策（サーバーによってはパスが変わる可能性あり） */
}

/* ---------------------------------
  _01 グローバルナビゲーション
------------------------------------*/

dl.globalNav {
	margin-bottom: 20px;
	border-top: solid 2px #fff;
	border-bottom: solid 2px #fff;
	background-color: #155a2b;
	box-shadow: 0 0 5px #ccc;
	behavior: url(_common/css/PIE.htc);
}

dl.globalNav dd {
	margin: 0 auto;
	border-left: solid 1px #fff;
	width: 932px;
	height: 50px;
}

dl.globalNav dd ul li {
	border-right: solid 1px #fff;
	float: left;
	width: 132px;
	height: 50px;
}

dl.globalNav dd ul li a {
	display: block;
	width: 132px;
	height: 50px;
	text-indent: -10000em;
	background-image: url(../../images/globalNav.jpg);
}

dl.globalNav dd ul li#globalNav01 a {
	background-position: 0 0;
}

dl.globalNav dd ul li#globalNav01 a:hover {
	background-position: 0 -50px;
}

dl.globalNav dd ul li#globalNav02 a {
	background-position: -133px 0;
}

dl.globalNav dd ul li#globalNav02 a:hover {
	background-position: -133px -50px;
}

dl.globalNav dd ul li#globalNav03 a {
	background-position: -266px 0;
}

dl.globalNav dd ul li#globalNav03 a:hover {
	background-position: -266px -50px;
}

dl.globalNav dd ul li#globalNav04 a {
	background-position: -399px 0;
}

dl.globalNav dd ul li#globalNav04 a:hover {
	background-position: -399px -50px;
}

dl.globalNav dd ul li#globalNav05 a {
	background-position: -532px 0;
}

dl.globalNav dd ul li#globalNav05 a:hover {
	background-position: -532px -50px;
}

dl.globalNav dd ul li#globalNav06 a {
	background-position: -665px 0;
}

dl.globalNav dd ul li#globalNav06 a:hover {
	background-position: -665px -50px;
}

dl.globalNav dd ul li#globalNav07 a {
	background-position: -798px 0;
}

dl.globalNav dd ul li#globalNav07 a:hover {
	background-position: -798px -50px;
}

/* ---------------------------------
  _ clearfix
------------------------------------*/

.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

.clearfix {
	display: inline-block;
}

/* Hides from IE-mac \*/
* html .clearfix {
	height: 1%;
}

.clearfix {
	display: block;
}
/* End hide from IE-mac */