/* =Typography
-----------------------------------------------------------------------------*/
body {
	padding-top: 50px;
	color: #555;
	background: #f0f0f0 url(../img/bg_body.jpg);
	font-family:'Lucida Grande','Hiragino Kaku Gothic ProN',Meiryo, sans-serif;
	text-shadow: 1px 1px 1px #fff;
}
h1, h2, h3, h4, h5 {
	color: #555;
}

.attention {
	color: #888;
	font-size: 80%;
}


/* =Common
-----------------------------------------------------------------------------*/
.clearfix:after {
  content: ".";  /* 新しいコンテンツ */
  display: block;
  clear: both;
  height: 0;
  visibility: hidden; /* 非表示に */
}

.textoverflow {
	white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.mt0 {
	margin-top: 0;
}

.pt0 {
	padding-top: 0;
}

.mb0 {
	margin-bottom: 0;
}

.mb15em {
	margin-bottom: 1.5em;
}


/* =LinkArea
-----------------------------------------------------------------------------*/
html body p.linkarea a {
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	height: 100%;
	width: 100%;
	text-align: left;
	text-indent: -9999px;
}


/* =Layout
-----------------------------------------------------------------------------*/
.wrapper {
	padding: 1.5em 0;
	width: 100%;
	max-width: 1300px;
	margin: auto;
}

.units-row {
	margin-bottom: 1.5em;
}

/* =Header
-----------------------------------------------------------------------------*/
header {
	position: fixed !important;  
    position: absolute;  
    top: 0;  
    left: 0;
	z-index: 1030;
	margin-bottom: 0;
	padding: 10px;
	width: 100%;
	height: 30px;
	background: #333;
	border-bottom: 2px #303030 solid;
	box-shadow: 0 2px 5px #aaa;
}

header h1 {
	float: left;
}

header nav {
	float: right;
	padding-right: 20px;
}


/* =Banner
-----------------------------------------------------------------------------*/

div.banner {
	padding: 0 30px;
}


/* =Items
-----------------------------------------------------------------------------*/

div#items {
	padding: 0 30px;
}

div#items div {
	background-color: #fff;
	border-radius: 3px;
	box-shadow: 0 2px 3px #ddd;
}

div#items div.itemlink {
	background: #fff url(../img/arrow_right.png) no-repeat right center;
	position: relative;
}

div#items div.itemlink:hover {
	background: #e9f1f7 url(../img/arrow_right.png) no-repeat right center;
}

div#items dl {
	padding: 2%;
	margin-bottom: 0;
}

div#items dt {
	float: left;
	width: 22%;
	margin-right: 4%;
}

div#items dt img {
	padding: 4px;
}

div#items  dd {
	margin: 0;
	float: left;
	width: 68%;
}
div#items  dd h3 {
	width: 100%;
}

div#items a#buy {
	padding: 3px 30px;
	color: #fff;
	background-color: #3f9fe0;
	text-shadow: none;
	text-decoration: none;
	border-radius: 2px;
}
div#items a#buy:hover {
	background-color: #62c0ff;
}

/* =Description
-----------------------------------------------------------------------------*/
.description {
	padding: 32px;
}

.description .icon img {
	padding: 0 5px 5px 0;
}


/* =Footer
-----------------------------------------------------------------------------*/
#footer {
	color: #888;
	margin-top: 3em;
	padding-bottom: 100px;
	font-size: .9em;
	padding-top: 3em;
	background-color: #fff;
	overflow: hidden;
	box-shadow: 0 2px 4px #bbb inset;
}
#footer section {
	float: left;
}
#footer nav {
	float: right;
}
#footer nav ul {
	list-style: none;
	margin: 0;
}
#footer nav ul li {
	float: left;
	margin-left: 2em;
}


/* =Tablet (Portrait)
-----------------------------------------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
}


/* =Mobile (Portrait)
-----------------------------------------------------------------------------*/
@media only screen and (max-width: 767px) {
    #partners ul li { padding-bottom: 1em; text-align: center; }
    #feedback { padding: 1.5em; }
    #banner { text-align: center; margin-bottom: 1.5em; }
	#footer section, #footer nav { float: none; }
	#footer nav ul { margin-top: 1em; }
	#footer nav ul li { margin: 0; margin-right: 1em; }
	div#items { padding: 0 10px; margin-bottom: 0; }
	div#items div { padding: 0 15px;}
	div.banner { padding: 0 10px; }
	div.description { padding: 30px 20px; }
}


/* =Mobile (Landscape)
-----------------------------------------------------------------------------*/
@media only screen and (min-width: 480px) and (max-width: 767px) {
	div#items { padding: 0 10px; margin-bottom: 0; }
	div#items div { padding: 0 15px;}
	div.banner { padding: 0 10px; }
	div.description { padding: 30px 20px; }
}


/* =Mobile (old)
-----------------------------------------------------------------------------*/
@media only screen and (max-width: 340px) {
	div#items { padding: 0 10px; margin-bottom: 0; }
	div#items dt, div#items dd { float: none; width: 100%; }
	div#items dt img { margin: 0 auto; }
	div#items div { padding: 0 15px;}
	div.banner { padding: 0 10px; }
	div.description { padding: 30px 20px; }
}

/* =StoreTab (old)
-----------------------------------------------------------------------------*/
#container {
	width: 66.6%;
	margin: 0 auto;
	text-align: left;
}
#tab {
	margin-left: 0;
	padding-left: 0;
	margin-bottom: 1em;
	border-bottom: 2px solid #333;
	height: 2em;
	overflow: hidden;
}
#tab li {
	list-style-type: none;
	float: left;
	height: 2em;
}
#tab li a {
	padding-top: 5px;
	display: block;
	height: 2em;
	border: 2px solid #ccc;
	border-bottom: 0;
	color: #777;
	text-align: center;
}
#tab li a:hover, #tab li.present a {
	border-color: #333;
	color: #FFF;
	background-color: #333333;
}
#page1, #page2, #page3, #page4 {
	margin-bottom: 12em;
	padding-top: 1em;
}

/* =datepicker
-----------------------------------------------------------------------------*/
.sunday .ui-state-default {
	color: red;
}
.saturday .ui-state-default {
	color: blue;
}
.holiday .ui-state-default {
	color: red;
}
.ui-widget-header {
	border: 1px solid white;
	background: #787878;
	color: white;
	font-weight: bold;
}
.ui-widget-header a {
  color: white;
}