@charset "utf-8";
/*
*
*	Title: Petit Philosophe - main
*	Last Modified: 2013-12-26
*	Description: Pages Style
*
*/

/* =========== INDEX LIST ============

	0: WEBFONT
	1: COMMON
	2: LAYOUT
	3: TOP
	4: GUIDE
	5: OTHER

====================================== */

/* ===================================

	0: WEBFONT

====================================== */

@import url("//hello.myfonts.net/count/25612a");
@font-face {font-family: 'DINNextLTPro-Light';src: url('../webfonts/DINNextLTPro-Light/25612A_0_0.eot');src: url('../webfonts/DINNextLTPro-Light/25612A_0_0.eot?#iefix') format('embedded-opentype'),url('../webfonts/DINNextLTPro-Light/25612A_0_0.woff') format('woff'),url('../webfonts/DINNextLTPro-Light/25612A_0_0.ttf') format('truetype');}

/* ===================================

	1: COMMON

====================================== */

body {
	background: #fff;
	color: #2a2f2f;
}
#page {
	min-width: 940px;
	overflow: hidden;
}
#page p,
#page ul,
#page ol,
#page dl {
	font-size: 100%;
	line-height: 1.6;
}
#page img {
	line-height: 1;
	vertical-align: top;
}
a:link {
	text-decoration: none;
	color: #2a2f2f;
	/*color: #4883a5*/
}
a:visited {
	text-decoration: none;
	color: #2a2f2f;
	/*color: #4883a5;*/
}
a:hover {
	text-decoration: underline;
	color: #6a6f6f;
	/*color: #2d5977;*/
}
a:active {
	text-decoration: underline;
	color: #6a6f6f;
	/*color: #2d5977;*/
}
#snsnav {
	position: fixed;
	bottom: 54px;
	right: 0px;
	width: 20px;
	height: 90px;
	padding: 10px 10px 0px 10px;
	background: #dbdbdb url(../images/btn_sns_on.png) no-repeat 10px 10px;
}
#snsnav li {
	width: 20px;
}
#snsnav li a {
	display: block;
	width: 20px;
	height: 20px;
	margin-bottom: 10px;
}
#snsnav li a:hover img {
	visibility: hidden;
}



/* ===================================

	2: LAYOUT

====================================== */

#header {
	background: url(../images/bg_header.png) repeat-x top left;
	margin-bottom: 20px;
}
#header .wrap {
	position: relative;
	width: 940px;
	margin: 0 auto;
}
#header .wrap #corp {
	height: 25px;
	text-align: right;
}
#header .wrap #corp a {
	font-family: Arial, Helvetica, sans-serif;
	color: #b4b4b4;
	font-size: 80%;
	display: inline-block;
	background: url(../images/icn_plogo.png) no-repeat center right;
	padding: 5px 22px 0px 5px;
	letter-spacing: 0.065em;
}
#header .wrap #corp a:hover,
#header .wrap #corp a:active {
	text-decoration: none;
	color: #efefef;
}
#header #logo {
	padding: 15px 20px 15px 0;
}
#header #gnav > ul {
	border-top: 1px solid #dcdcdc;
	border-bottom: 1px solid #dcdcdc;
}
#header #gnav > ul:after {
	content: "";
	display: block;
	clear: both;
}
#header #gnav > ul > li {
	height: 47px;
	margin-left: 30px;
	float: left;
	position: relative;
}
#header #gnav > ul > li > a {
	margin-top: 10px;
	padding: 3px 5px;
	font-family: Arial, Helvetica, sans-serif;
	color: #2a2f2f;
	letter-spacing: 0.065em;
	font-size: 92%;
	display: block;
}
#header #gnav > ul > li > a:hover,
#header #gnav > ul > li > a:active {
	color: #949797;
	padding: 3px 5px 2px;
	border-bottom: 1px dotted #949797;
	text-decoration: none;
}
#header #gnav ul li.home {
	margin-left: 0;
}
#header #gnav ul li.home a {
	width: 77px;
	height: 0;
	background: url(../images/gnav_home.png) no-repeat top left;
	margin: 0;
	padding: 47px 0 0 0;
	overflow: hidden;
	display: block;
}
#header #gnav ul li.home a:hover,
#header #gnav ul li.home a:active,
#header #gnav ul li.cart a:hover,
#header #gnav ul li.cart a:active {
	text-decoration: none;
	border: none;
	padding: 47px 0 0 0;
}
#header #gnav li.cart a {
	width: 105px;
	height: 0;
	background: url(../images/gnav_cart.png) no-repeat top left;
	margin: 0;
	padding: 47px 0 0 0;
	overflow: hidden;
	display: block;
}

/* sub categories */
#header #gnav ul li ul {
	display: none;
	position: absolute;
	top: 47px;
	left: 0px;
	width: 170px;
	border: 1px solid #dcdcdc;
	background: #fff;
	padding: 5px;
	z-index: 100;
}
#header #gnav ul li ul li.all {
	margin-bottom: 5px;
}
#header #gnav ul li ul li.all a {
	border-bottom: 1px solid #dcdcdc;
}
#header #gnav ul li ul li a {
	background: url(../images/icn_gnav_pulldown.png) no-repeat 15px 12px;
	padding: 6px 20px 6px 25px;
	white-space: nowrap;
	font-size: 85%;
	color: #373b3b;
	display: block;
}
#header #gnav ul li ul li span {
	background: url(../images/icn_gnav_pulldown.png) no-repeat 15px 12px;
	padding: 6px 20px 6px 25px;
	white-space: nowrap;
	font-size: 85%;
	color: #999;
	display: block;
}

#header #subnav {
	position: absolute;
	top: 67px;
	right: 0px;
}
#header #subnav li {
	float: right;
	margin-left: 12px;
}
#header #subnav li a {
	background: url(../images/icn_sub_gnav.png) no-repeat center left;
	padding: 0 0 0 13px;
	font-size: 85%;
	color: #2a2f2f;
}

#shortcut {
	background: #f3f3f2;
	border-top: 1px solid #fafafa;
}
#shortcut .wrap {
	width: 940px;
	margin: 0 auto;
	padding: 10px 20px;
	overflow: hidden;
}
#shortcut h2 {
	width: 15%;
	padding-top: 40px;
	display: table-cell;
	font-weight: normal;
	font-size: 92%;
	color: #666;
	text-align: center;
	vertical-align: middle;
	float: left;
}
#shortcut ul {
	width: 27%;
	padding: 5px 0;
	display: table-cell;
	border-left: 1px solid #bbb;
	float: left;
	min-height: 140px;
}
#shortcut li {
	margin-bottom: 7px;
}
#shortcut li span,
#shortcut li a {
	font-size: 85%;
	margin-left: 30px;
	display: block;
	letter-spacing: 0.065em;
}
#shortcut li span {
	color: #999;
}

/* Page top */ 
.pagetop {
	width: 940px;
	margin: 20px auto 10px;
	text-align: right;
}
.pagetop a {
	width: 55px;
	height: 22px;
	display: inline-block;
	background: url(../images/btn_pagetop_on.png) no-repeat top left;
}
.pagetop a:hover img {
	visibility: hidden;
}

#footer {
	background: #dbdbdb;
}
#footer .wrap {
	width: 940px;
	margin: 0 auto;
	padding: 10px 0;
	overflow: hidden;
	position: relative;
}
#footer ul {
	margin-left: -16px;
}
#footer li {
	float: left;
	margin-right: 15px;
	padding-left: 15px;
	border-left: 1px solid #bebebe;
	line-height: 1;
}
#footer li a {
	font-size: 85%;
	line-height: 1;
	color: #838383;
}
#footer #copyright {
	clear: both;
	color: #666;
	font-family: Arial, Helvetica, sans-serif;
	letter-spacing: 0.065em;
}
#footer .shared {
	position: absolute;
	width: auto;
	height: 20px;
	top: 15px;
	right: 0;
	margin: 0;
}
#footer .shared li {
	float: right;
	margin: 0 0 0 10px;
	padding: 0;
	border: none;
}
#footer .shared li a {
	display: block;
}
#footer .shared li a:hover img {
	visibility: hidden;
}
#footer .shared li.fb {
	width: 20px;
	height: 20px;
	background: url(../images/btn_share_on.png) no-repeat top right;
}
#footer .shared li.tw {
	width: 20px;
	height: 20px;
	background: url(../images/btn_share_on.png) no-repeat top left;
}
#footer .shared li.blog {
	border-left: 1px solid #999;
	margin-left: 20px;
	padding: 5px 0 2px 15px;
}
#footer .shared li.blog a {
	font-family: 'DINNextLTPro-Light';
	font-size: 105%;
	color: #2A2F2F;
}

#contents {
	width: 940px;
	margin: auto;
}

.banners {
	width: 940px;
	height: 170px;
	margin: 10px auto auto auto;
}
.banners .r {
	float: right;
	margin-bottom: 5px;
}
.banners .l {
	float: left;
	margin-bottom: 5px;
}

/* for brand list cursel */
#brandlist {
	width: 940px;
	position: relative;
	margin: 0 auto 50px auto;
}
#brandlist h3 {
	margin-bottom: 12px;
	color: #2a2f2f;
	font-family: 'DINNextLTPro-Light';
	font-size: 122%;
	font-weight: normal;
}
#brandlist .prev {
	position: absolute;
	bottom: 25px;
	left: 0;
}
#brandlist .prev a {
	display: block;
	width: 20px;
	height: 0;
	padding: 30px 0px 0px 0px;
	background: url(../../store/images/list_button.png) no-repeat 0 0;
	overflow: hidden;
}
#brandlist .next {
	position: absolute;
	bottom: 25px;
	right: 0;
}
#brandlist .next a {
	display: block;
	width: 20px;
	height: 0;
	padding: 30px 0px 0px 0px;
	background: url(../../store/images/list_button.png) no-repeat 0 -30px;
	overflow: hidden;
}
#brandlist .wrap {
	width:904px;
	margin:auto;
	overflow:hidden;
}
#brandlist .wrap ul {
	height: 85px;
	zoom: 1;
}
#brandlist .wrap ul li {
	margin: 0 3px 0 2px;
	position: relative;
	float: left;
}
#brandlist .wrap ul li a {
	display: block;
}
#brandlist .wrap ul li a.border {
	border: 1px solid #efefef;
}
#brandlist .wrap ul li a.border img {
	height: 83px;
}
#brandlist .wrap ul li span.cap {
	display: none;
	position: absolute;
	bottom: 5px;
	right: 6px;
	color: #666;
	font-size: 85%;
	line-height: 1;
	font-family: Arial, Helvetica, sans-serif;
	letter-spacing: 0.065em;
}

/* QUICK GUIDE */
#quickguide {
	width: 940px;
	position: relative;
	margin: 0 auto 50px auto;
}
#quickguide h3 {
	margin-bottom: 8px;
	color: #2a2f2f;
	font-family: 'DINNextLTPro-Light';
	font-size: 122%;
	font-weight: normal;
}
#quickguide dl {
	height: 32px;
	border-bottom: 1px dotted #dcdcdc;
	zoom: 1;
	margin: 0 20px;
}
#quickguide dl dt {
	width: 195px;
	float: left;
	padding: 7px 0 5px 25px;
	font-size: 92%;
	font-weight: bold;
}
#quickguide dl.guide01 dt {
	background: url(../../store/images/icn_guide.png) no-repeat 0 0;
}
#quickguide dl.guide02 dt {
	background: url(../../store/images/icn_guide.png) no-repeat 0 -30px;
}
#quickguide dl.guide03 dt {
	background: url(../../store/images/icn_guide.png) no-repeat 0 -60px;
}
#quickguide dl.guide04 dt {
	background: url(../../store/images/icn_guide.png) no-repeat 0 -90px;
}
#quickguide dl dd {
	width: 680px;
	float: right;
	padding: 7px 0 5px;
	font-size: 92%;
}


/* ===================================

	3: TOP

====================================== */

#top #main-visual {
	width: 940px;
	position: relative;
	overflow: hidden;
}
#top #main-visual li {
	width: 940px;
	height: 300px;
}
#top #main-visual a {
	position: relative;
	display: block;
}
#top #main-visual a span.cap {
	display: none;
	position: absolute;
	bottom: 10px;
	right: 10px;
	color: #666;
	font-size: 85%;
	line-height: 1;
	font-family: Arial, Helvetica, sans-serif;
	letter-spacing: 0.065em;
}
#top #main-visual #photo-list {
	width: 940px;
	height: 400px;
}
#top #main-visual .bx-pager {
	width: 150px;
	margin: auto;
	text-align: center;
}
#top #main-visual .bx-pager .pager-link {
	display: inline-block;
	width: 10px;
	height: 0;
	margin: 10px 5px 0;
	padding: 10px 0 0 0;
	overflow: hidden;
	background: url(../../images/icn_pager.png) no-repeat left bottom;
}
#top #main-visual .bx-pager .pager-active {
	background: url(../../images/icn_pager.png) no-repeat left top;
}
#top #main-visual .bx-prev {
	left: 0;
	background: url(../../images/btn_prev.png) no-repeat 0 0;
	width: 30px;
	height: 0px;
	margin-top: -15px;
	padding: 30px 0 0 0;
	overflow: hidden;
	position: absolute;
	top: 50%;
	z-index: 999;
	cursor: pointer;
}
#top #main-visual .bx-next {
	right: 0;
	background: url(../../images/btn_next.png) no-repeat 0 0;
	width: 30px;
	height: 0px;
	margin-top: -15px;
	padding: 30px 0 0 0;
	overflow: hidden;
	position: absolute;
	top: 50%;
	z-index: 999;
	cursor: pointer;
}

#top .info {
	width: 900px;
	margin: 30px auto;
}
#top .info h2 {
	width: 90px;
	padding: 0 0 8px 3px;
	border-bottom: 3px solid #2a2f2f;
	font-family: Arial, Helvetica, sans-serif;
	color: #2a2f2f;
	font-size: 114%;
}
#top .info ul {
	border-top: 1px solid #6c6c6c;
}
#top .info ul li {
	padding: 9px 12px 9px 110px;
	position: relative;
	border-bottom: 1px dotted #6c6c6c;
	font-size: 92%;
	color: #2a2f2f;
}
#top .info ul li .datetime {
	position: absolute;
	top: 9px;
	left: 15px;
	padding-left: 15px;
	display: block;
	background: url(../../images/icn_info.png) no-repeat left center;
}


/* ===================================

	4: GUIDE

====================================== */

#guide #contents h1 {
	display: none;
}
#guide #lead-welcome {
	margin: 50px auto 70px;
	text-align: center;
}

.guidelist {
	padding: 0 10px 50px 53px;
}
.guidelist:after {
	content: "";
	display: block;
	clear: both;
}

.guidelist .wrap {
	width: 400px;
	float: left;
	margin-right: 30px;
}
.guidelist h2 {
	width: 830px;
	margin-bottom: 5px;
	padding-bottom: 8px;
	background: url(../../guide/images/line_dotted_guide.png) repeat-x bottom left;
	font-weight: normal;
	font-size: 92%;
	color: #aaa;
}
.guidelist dl dt a {
	display: block;
	padding: 13px 0 13px 22px;
	background: url(../../guide/images/icn_title.png) no-repeat left center;
	border-bottom: 1px solid #bec0c0;
}
.guidelist dl dt a.active {
	background: url(../../guide/images/icn_title_on.png) no-repeat left center;
}

.guidelist dl dd {
	background: #f2f2f2;
	margin: 5px 0 10px;
	padding: 15px 20px;
	font-size: 92%;
	display: none;
}
.guidelist dl dd h3 {
	margin-bottom: 5px;
}
.guidelist dl dd p {
	margin-bottom: 10px;
}

#guide #contact {
	margin: 0 53px 60px 53px;
	height: 43px;
}
#guide #contact h3 {
	width: 20%;
	font-size: 107%;
	font-weight: normal;
	display: table-cell;
	vertical-align: middle;
}
#guide #contact a {
	width: 40%;
	background: url(../../guide/images/btn_mail_on.png) no-repeat top left;
	margin-right: 20px;
	height: 43px;
	display: table-cell;
}
#guide #contact span {
	width: 40%;
	display: table-cell;
}
#guide #contact a:hover img {
	visibility: hidden;
}



/* ===================================

	5: POLICY

====================================== */

#policy #contents h1 {
	display: block;
	width: 830px;
	margin: 50px auto;
	font-size: 152%;
	font-weight: normal;
	color: #999;
}

#policy #contents > h2 {
	width: 830px;
	margin: auto auto 20px;
	font-size: 122%;
	font-weight: normal;
	color: #999;
}
#policy .block {
	width: 830px;
	margin: auto auto 50px;
}
#policy .block h3 {
	margin: 0 0 10px;
	font-size: 107%;
}
#policy .block p {
	line-height: 1.8;
}
#policy .block .txtC {
	line-height: 2;
	text-align: center;
}
#policy .block .txtR {
	line-height: 2;
	text-align: right;
}

#policy .block ul li {
	line-height: 1.5;
	list-style-position: outside;
	list-style-type: decimal;
	margin: 0 0 15px 20px;
}


/* ===================================

	6: SHOP OPEN - YOKOHAMA

====================================== */

body#shop.detail {
}

body#shop.yokohama #contents > h1 {
	background: url(../../images/main06.jpg) no-repeat top left;
	width: 940px;
	height: 0;
	padding: 410px 0 0 0;
	overflow: hidden;
}
body#shop.yokohama #contents {
	position: relative;
}
body#shop.yokohama #contents p {
	margin-bottom: 10px;
	font-size: 114%
}


/* 地図、所在地 */ 
body#shop #place {
	zoom: 1;
	overflow: hidden;
	margin-bottom: 25px;
}
body#shop #place:after {
	content: "";
	display: block;
	clear: both;
}
body#shop .map {
	float: left;
	margin-right: 20px;
}
body#shop .map img {
	border: 1px solid #aaaaaa;
}
body#shop .map .zoom {
	display: block;
}
body#shop .map .zoom a {
	color: #4883a5;	
	font-size: 75%;
	background: url(../images/icn_access.png) no-repeat 0px -153px;
	padding: 2px 0 0px 20px;
}
body#shop #place .title {
	margin-bottom: 7px;
	font-weight: bold;
	color: #5fc1c6;
}
body#shop #place .shop-detail {
	display: table;
	width: 390px;
	margin-bottom: 7px;
}
body#shop #place .shop-detail dt,
body#shop #place .shop-detail dd {
	display: table-cell;
}
body#shop #place .shop-detail dt {
	width: 24%;
	padding-left: 6%;
}
body#shop #place .shop-detail dd {
	width: 70%;
}

body#shop #place .shop-detail.address dt {
	background: url(../images/icn_access.png) no-repeat 0 0;
}
body#shop #place .shop-detail.phone dt {
	background: url(../images/icn_access.png) no-repeat 0 -24px;
}
body#shop #place .shop-detail.open_hours dt {
	background: url(../images/icn_access.png) no-repeat 0 -48px;
}
body#shop #place .shop-detail.items dt {
	background: url(../images/icn_access.png) no-repeat 0 -72px;
}

body#shop #place .shop-access {
	display: table;
	width: 390px;
	margin-top: 20px;
}
body#shop #place .shop-access dt {
	padding-left: 27px;
	font-weight: bold;
	color: #333;
}
body#shop #place .shop-access dd {
	margin-bottom: 7px;
}
body#shop #place .shop-access dt.train {
	background: url(../images/icn_access.png) no-repeat 0 -98px;
}
body#shop #place .shop-access dt.car {
	background: url(../images/icn_access.png) no-repeat 0 -126px;
}

 /* ABOUT */ 
body#shop #about {
	margin-bottom: 30px;
}
body#shop #about h3 {
	background: #51749e;
	margin-bottom: 20px;
	padding: 8px 25px;
	color: #fff;
	font-weight: normal;
	font-size: 95%;
}
body#shop #about h3 span {
	display: inline-block;
	padding-right: 15px;
	margin-right: 15px;
	border-right: 1px solid #869ebb;
	font-family: 'DINNextLTPro-Light';
}
body#shop #about .brandlist {
	display: table;
	width: 100%;
	margin-bottom: 20px;
}
body#shop #about ul {
	display: table-cell;
	width: 35%;
	border-left: 1px solid #e5e5e5;
	padding-left: 15px;
}
body#shop #about li {
	padding: 3px 0;
	font-size: 85%;
}
body#shop #about li a {
}
body#shop #about dl {
	background: #c8e6eb;
	border-radius: 0.5em;
	-moz-border-radius: 0.5em;
	-webkit-border-radius: 0.5em;
	-o-border-radius: 0.5em;
	-ms-border-radius: 0.5em;	
	padding: 15px 5%;
	display: table;
	width: 90%;
}
body#shop #about dl dt {
	width: 25%;
	display: table-cell;
	line-height: 2em;
}
body#shop #about dl dd {
	width: 75%;
	display: table-cell;
	background: url(../images/icn_phone.png) no-repeat left center;
	padding-left: 38px;
	height: 26px;
	line-height: 2.2em;
	font-size: 140%;
}
body#shop #about dl dd span {
	font-size: 65%;
}


/* RECRUIT */
body#shop #recruit {
	margin-bottom: 30px;
	background: #f6f6f6;
	padding: 15px 20px 5px;
	border-radius: 0.5em;
	-moz-border-radius: 0.5em;
	-webkit-border-radius: 0.5em;
	-o-border-radius: 0.5em;
	-ms-border-radius: 0.5em;	
}
body#shop #recruit h3 {
	margin-bottom: 20px;
}
body#shop #recruit h3 span {
	width: 15%;
	display: inline-block;
	font-family: 'DINNextLTPro-Light';
	color: #e68b20;
	font-weight: bold;
	font-size: 140%;
}
body#shop #recruit dl {
	border-top: 1px solid #e5e5e5;
	display: table;
	width: 100%;
	padding: 8px 0;
}
body#shop #recruit dl dt {
	width: 15%;
	display: table-cell;
	color: #898171;
	font-weight: bold;
}
body#shop #recruit dl dd {
	width: 85%;
	display: table-cell;
}

body#shop.yokohama #go-to-blog {
	position: fixed;
	width: 48px;
	height: 234;
	top: 230px;
	right: 0px;
	margin: 0;
	padding: 0;
}
body#shop.yokohama #go-to-blog a {
	display: block;
	width: 48px;
	height: 234px;
	background: url(../../yokohama/images/btn_blog_on.png) no-repeat 0 0;
}
body#shop.yokohama .btn-blog a:hover img {
	display: none;
}