@charset "utf-8";

/*************************************
	base
*************************************/

*
{
	margin: 0;
	padding: 0;
	border: none;
}

html, body, #wrap	{ width: 100%; height: 100%; }

html	{ font-size: 62.5%; }

body
{
	font-family: "ＭＳ Ｐゴシック", "MS PGothic", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, sans-serif;
	font-size: 12px;
	font-size: 1.2rem;
	line-height: 1.6;
	
	/*-webkit-font-smoothing: antialiased;*/
	-moz-osx-font-smoothing: grayscale;
	
	-webkit-font-smoothing: subpixel-antialiased;
	text-rendering: geometricPrecision;
	text-rendering: optimizeLegibility;
	text-rendering: optimizeSpeed;
	text-rendering: auto;
}

body.win
{
	font-family: "ＭＳ Ｐゴシック", "MS PGothic", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, sans-serif;
	letter-spacing: 0.07em;
}

body.mac
{
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", sans-serif;
	letter-spacing: -0.02em;
}

img	{ vertical-align: bottom; }

a	{ color: #000000; }

#wrap
{
	min-width: 980px;
}

#container h2
{
	display: none;
}

/*************************************
	foot
*************************************/

#foot
{
	width: 100%;
	height: 163px;
	overflow: hidden;
	position: relative;
	background: url(../img/common/foot_bg.png) repeat 0 0;
}

#foot h1
{
	width: 100%;
	height: auto;
	padding: 26px 28px 0;
	font-size: 14px;
	font-size: 1.4rem;
	font-weight: bold;
	line-height: 3;
	text-indent: 0;
}

#foot a	{ color: #000000; }

#foot p
{
	padding: 0 28px;
	font-size: 12px;
	font-size: 1.2rem;
	line-height: 1.5;
}

#foot p.number
{
	font-family: HelveticaNeue-Light, "aktiv-grotesk-std-n3", "aktiv-grotesk-std", Arial, sans-serif;
	font-weight: 300;
	letter-spacing: 0;
}

#foot a.map
{
	display: inline-block;
	background: url(../img/common/foot_icon_map.png) no-repeat 2px 50%;
	text-indent: 17px;
}

#foot p strong
{
	padding-right: 7px;
	color: #999999;
	font-weight: normal;
}

#foot p.number span
{
	padding: 0 6px;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size: 11px;
	font-size: 1.1rem;
}

#foot div.copy
{
	font-family: HelveticaNeue-Light, "aktiv-grotesk-std-n3", "aktiv-grotesk-std", Arial, sans-serif;
	font-weight: 300;
	letter-spacing: 0;
	font-size: 9px;
	font-size: 0.9rem;
	position: absolute;
	bottom: 20px;
	left: 8%;
	line-height: 1.4em;
}

#foot ul.sns
{
	width: 110px;
	height: 30px;
	position: absolute;
	bottom: 17px;
	left: 30px;
}

#foot ul.sns li
{
	width: 30px;
	height: 30px;
	float: left;
	margin-right: 8px;
	list-style: none;
}

#foot ul.sns li.ig	{ margin-right: 0; }

#foot ul.sns li a
{
	display: block;
	width: 30px;
	height: 30px;
	overflow: hidden;
	background: url(../img/common/foot_bttn_sns.png) no-repeat -1px -1px;
	text-indent: 100%;
	white-space: nowrap;
}

#foot ul.sns li a:hover
{
	opacity: 0.6;
}

#foot ul.sns li.tw a	{ background-position: -32px -1px; }
#foot ul.sns li.ig a	{ background-position: -63px -1px; }

#foot ul.link
{
/** widrh: 415px **/
	width: 660px;
	overflow: hidden;
	position: absolute;
	bottom: 0;
	right: 13px;
}

#foot ul.link li
{
	list-style: none;
	float: left;
}

#foot ul.link li a
{
	display: block;
	height: 94px;
	overflow: hidden;
	background: url(../img/common/foot_link_logo.png) no-repeat;
	text-indent: 100%;
	white-space: nowrap;
}

#foot ul.link li a:hover
{
	opacity: 0.6;
}

#foot ul.link li.cccscd a 	{ width: 134px; background-position: 0 21px; }
#foot ul.link li.mon a 		{ width: 77px; background-position: -349px 21px; }
#foot ul.link li.kenbi a 	{ width: 78px; background-position: -426px 21px; }
#foot ul.link li.stand a 	{ width: 126px; background-position: -504px 21px; }
#foot ul.link li.cccscdgekijo a 	{ width: 90px; background-position: -230px 21px; }
#foot ul.link li.soco a 	{ width: 96px; background-position: -134px 21px; }


/*************************************
	headlogo
*************************************/

#headlogo
{
	width: 100%;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 80;
	background: rgba(255,255,255,0.8);
}

#headlogo a
{
	display: block;
	width: 187px;
	height: 44px;
	overflow: hidden;
	margin: 16px 30px 20px;
	background: url(../img/common/head_logo.png) no-repeat 0 0;
	text-indent: 100%;
	white-space: nowrap;
}

#headlogo a:hover 	{ opacity: 0.6; }

/*************************************
	menu
*************************************/

#menu
{
	width: 676px;
	height: 59px;
	position: fixed;
	top: 0px;
	right: 30px;
	z-index: 80;
}

#menu ul
{
	width: 676px;
	height: 59px;
	overflow: hidden;
}

#menu ul li
{
	height: 59px;
	float: left;
	position: relative;
	list-style: none;
}

#menu ul li.news 		{ width: 84px; }
#menu ul li.works 		{ width: 96px; }
#menu ul li.shop 		{ width: 84px; }
#menu ul li.about 		{ width: 118px; }
#menu ul li.contact 	{ width: 110px; }
#menu ul li.blog 		{ width: 82px; }
#menu ul li.recruit 	{ width: 102px; }

#menu ul li a, #menu ul li div
{
	display: block;
	width: 100%;
	height: 59px;
	overflow: hidden;
	background: url(../img/common/menu_list.png) no-repeat 0 0;
}

#menu ul li.shop a, #menu ul li.shop div
{
	background: url(../img/common/menu_list_shop.png) no-repeat 0 0;
}

#menu ul li.news a 		{ background-position: 0 0; }
#menu ul li.works a 	{ background-position: -84px 0; }
#menu ul li.shop a 		{ background-position: 0 0; }
#menu ul li.about a 	{ background-position: -180px 0; }
#menu ul li.contact a 	{ background-position: -298px 0; }
#menu ul li.blog a 		{ background-position: -408px 0; }
#menu ul li.recruit a 	{ background-position: -490px 0; }

#menu ul li.news div 	{ background-position: 0 -59px; }
#menu ul li.works div 	{ background-position: -84px -59px; }
#menu ul li.shop div 	{ background-position: 0 -59px; }
#menu ul li.about div 	{ background-position: -180px -59px; }
#menu ul li.contact div 	{ background-position: -298px -59px; }
#menu ul li.blog div 	{ background-position: -408px -59px; }
#menu ul li.recruit div 	{ background-position: -490px -59px; }

#menu ul li span
{
	display: block;
	width: 8px;
	height: 8px;
	overflow: hidden;
	background: #767676;
	position: absolute;
	bottom: 0;
	left: 50%;
	margin-left: -4px;
	text-indent: 100%;
	white-space: nowrap;
	
	transition: height 50ms linear 50ms, width 100ms linear, left 100ms linear, margin-left 100ms linear;
	-webkit-transition: height 50ms linear 50ms, width 100ms linear, left 100ms linear, margin-left 100ms linear;
}

#menu ul li div span 		{ background: #000000; }

#menu ul li.about div span, #menu ul li.works div span
{ background: #000000; }

#menu ul li a:hover span, #menu ul li div span
{
	width: 100%;
	height: 2px;
	left: 0;
	margin-left: 0;
	
	transition: height 50ms linear, width 100ms linear, left 100ms linear, margin-left 100ms linear;
	-webkit-transition: height 50ms linear, width 100ms linear, left 100ms linear, margin-left 100ms linear;
}

/*************************************
	returnBtn
*************************************/

#returnBtn
{
	display: block;
	width: 45px;
	height: 45px;
	position: fixed;
	top: 0;
	left: 0;
	overflow: hidden;
	text-indent: 100%;
	white-space: nowrap;
	background: url(../img/common/btn_list.png) no-repeat 50% 50%;
	z-index: 79;
}