@charset "utf-8";

/* ===================================================================
 common
=================================================================== */

* { margin: 0; padding: 0; font-size: 100%; font-style: normal;}

body {
	text-align: center;
	background: #fff;
	color: #000;
	cursor: auto;
	font: normal normal 14px/1.5 Arial, Helvetica, "Hiragino Kaku Gothic Pro W3", "ヒラギノ角ゴ Pro W3", "MS PGothic", "ＭＳ Ｐゴシック", sans-serif;
	letter-spacing: 0.1em;
	word-spacing: 0.1em;
}

*:first-child + html body { font-size: 75%;} /* for IE 7 */

h1 { padding-top: 2px; color: #636363; font-size: 10px; font-weight: normal; font-family: "MS PGothic", "ＭＳ Ｐゴシック", sans-serif; }
h2 {}
h3, h4, h5, h6 { padding: 25px 0 5px; letter-spacing: 0;}
p { padding: 5px 0 10px;}
blockquote { margin: 15px 0; padding: 10px 15px 3px; background: #faf6ed;}
pre { background: #eee; margin: 1em 0; padding: 0 20px; overflow: auto; width: auto;}
code { color: #5b5905; font-family: "Lucida Grande", "Courier New", Courier, mono, Verdana, sans-serif; letter-spacing: 0;}
ul, ol { margin: 10px 0; padding: 0 0 0 30px; }
ul { padding: 0; list-style: none; }
dl { margin: 10px 0;}

a         { color: #6E6E6E; text-decoration: underline; cursor: pointer;}
a:visited { color: #919191;}
a:hover   { color: #47A100;}
a:focus,
a:active  { color: #47A100;}

em     { font-weight: bold; color: #666;}
strong { font-weight: bold; color: #AB0707;}
abbr, acronym { cursor: help;}
sup { vertical-align: super; font-size: 70%;}
sub { vertical-align: baseline; font-size: 70%;}
*:first-child + html sup { line-height: 1.5; font-size: 80%;} /* for IE 7 */
* html sup               { line-height: 1.5; font-size: 80%;} /* for IE 6 or sooner */

hr { display: none;}
img { border: none; color: #fff; background: transparent; vertical-align: bottom;}
embed, object { outline: 0; vertical-align: bottom;}

table { border: 1px solid #aaa; border-collapse: collapse; margin-bottom: 15px;}
caption { text-align: left;}
thead {}
tbody {}
th { white-space: nowrap;}
th, td {
	padding: 5px 10px;
	border-collapse: collapse;
	border: 1px solid #aaa;
	text-align: left;
}

fieldset {
	border: 1px solid #ddd;
	margin-bottom: 15px;
	padding: 10px;
}
* html legend { margin: 0 0 10px;}
input,
textarea { padding: 1px; font-family: Arial, Helvetica, "Hiragino Kaku Gothic Pro W3", "ヒラギノ角ゴ Pro W3", "MS PGothic", "ＭＳ Ｐゴシック", sans-serif;}
select option { padding: 0 5px;}
input:focus,
select:focus,
textarea:focus { background-color: #fafafa;}
label { cursor: pointer;}


/******************************************************************** clearfix
*/

#container:after,
.section:after,
.clearfix:after {
  content: "";
  clear: both;
  display: block;
}

/******************************************************************** utilities
*/

.aL { text-align: left;}
.aC { text-align: center;}
.aR { text-align: right;}
.fR { float: right;}
.fL { float: left;}
.clr { float: none; clear: both;}

.jp { font-family: "ヒラギノ角ゴ Pro W3", Osaka, "ＭＳ Ｐゴシック", sans-serif;}
.verdana { font-family: Verdana, sans-serif;}
.times { font-family: "Times New Roman", Times, serif;}

.tempNotes { font-size: 120%; color: #c00; font-weight: bold; background: #f8f8f8; margin: 1em; padding: 1em;}

.attention { color: #AB0707;}

.link { letter-spacing: 0; }
a .link { color: #262626; width: 140px; margin: 0 auto; padding: 2px 0; display: block; border: 1px solid #262626; text-align: center; text-decoration: none; }
a:hover .link { color: #47A100; border: 1px solid #47A100; }


/* ===================================================================
 module
=================================================================== */


/******************************************************************** structure
*/

#wrapper { width: 100%; min-width: 980px; background : url(../img/home/bg.png) repeat-x;}

header,
#contents,
#commonContents { width: 980px; margin: 0 auto; text-align: left;}

header {
	position: relative;
	height: 147px;
}

#container {}

#contents h2 {}

#contents .chargeName {}



footer {
	clear: both;
	background: #EDEDED;
}

/******************************************************************** header
*/

header .logo { position: absolute; top: 8px; left: 50%; margin-left: -110px; padding: 0; }

/******************************************************************** globalNav
*/

#glovalNav { width: 800px; position: absolute; left: 0; top: 107px; padding-top: 6px; padding-left:180px; border-top: 1px solid #3d3e3e; }
#glovalNav ul { width: 827px; margin: 0 auto; }
#glovalNav li { float: left; margin-right: 20px; }
#glovalNav li:last-child { margin-right: 0; }

/******************************************************************** main
*/

.home #main ul { margin: 0; }

/******************************************************************** container
*/

#container { background: #EDEDED; }

/******************************************************************** contents
*/

#contents{ width: 980px; }
#breadcrumbsList { padding-top: 10px; text-align: left; font-size: 12px; }


/******************************************************************** sideNav
*/

#sideNav ul {
	margin: 0;
	padding: 0;
}

/******************************************************************** footer
*/

footer a {}
footer a:hover {}

/**
 * @23:15 2009/03/21
 * #footer address { background: #aaa;}
 * 'background: #aaa;' は 'margin-right: 12em' の確認用です
 * 'background: #aaa;' は消してOK
 * 'margin-right: 12em' は適宜調整してください
 * 尚、このコメントは自動的に削除されないので手動的に消してください
 */

.footerNav { width: 980px; margin: 0 auto; border-bottom: 1px solid #e7e7e7; }
.footerNav ul { margin: 0 0 0 325px; padding: 15px 0; }
.footerNav ul li { float: left; margin-right: 14px; font-size: 12px;  }
.footerNav ul li a { text-decoration: none; }

footer address { font-size: 10px; padding: 4px 0 2px; text-align: center; color: #6E6E6E; letter-spacing: 0.05em; line-height: 1.5;}

.pagetop { position: fixed; right: 2%; bottom: 10%; padding: 0; text-align: right;}


/******************************************************************** contentsBanner
*/

#contentsBanner { padding: 35px 0; }
#contentsBanner ul { margin: 0; }
#contentsBanner ul li { float: left; position: relative; }
#contentsBanner ul li a { text-decoration: none; letter-spacing: 0; }
#contentsBanner ul li a span { position: absolute; top: 198px; left: 51px; color: #262626; width: 140px; padding: 2px 0; display: block; border: 1px solid #262626; text-align: center; }
#contentsBanner ul li a:hover span { color: #47A100; border: 1px solid #47A100; }

/******************************************************************** featureBox
*/

.featureBox { margin: 0 0 20px; }
.featureBox h2 { margin: 22px auto 17px; text-align: center; }
.featureBox .item { padding: 12px 0 20px; width: 320px; float: left; margin-right: 10px; display: block; color: #262626; text-align: center; background: #EDEDED; text-decoration: none; }
.featureBox .adjust { margin-right: 0; }

/******************************************************************** facebookBox
*/

.facebookBox { margin: 40px 0; }

/******************************************************************** shoppingGuide
*/

.shoppingGuide { margin: 40px 0; font-size: 11px; }
.shoppingGuide .jra { float: left; width: 187px; }
.shoppingGuide .jra p { padding: 0; }
.shoppingGuide .guide { float: right; width: 695px; padding: 5px 40px 25px; color: #4D4D4D; border: 1px solid #D1D1D1; }
.shoppingGuide .guide h4 { font-size: 13px; padding-top: 20px; color: #262626; }
.shoppingGuide .guide h5 { padding: 4px 0 2px; }
.shoppingGuide .guide .leftBox { float: left; width: 323px; }
.shoppingGuide .guide .rightBox { float: right; width: 323px; }

/******************************************************************** defaultBox
*/

.defaultBox { padding: 56px 70px; background: #fff; }
.defaultBox h3.first { margin-top: 25px !important; }
.defaultBox h3 { margin-top: 60px; margin-bottom: 15px; font-size: 34px; text-align: center; }
.defaultBox h4 { margin-top: 20px; margin-bottom: 5px; padding-bottom: 0; font-size: 25px; text-align: center; }

/* ===================================================================
 contents
=================================================================== */


/******************************************************************** history
*/



/******************************************************************** craftsman
*/

.craftsman .defaultBox { text-align: center; }
.craftsman .defaultBox #main { margin-bottom: 25px; }
.craftsman .defaultBox .logo { text-align: left; }
.craftsman .defaultBox .logo .photo { float: left; margin: 0 2em 0 0; }
.craftsman .defaultBox .macbookair  { margin-left: -70px; padding-bottom: 20px; text-align: left; position: relative; background: url(../craftsman/img/macbook.png) no-repeat -180px 45px; }
.craftsman .defaultBox .macbookair h3 { margin-bottom: 20px; }
.craftsman .defaultBox .macbookair p { margin-left: 380px; }
.craftsman .defaultBox .jra { text-align: left; }
.craftsman .defaultBox .jra .photo { float: right; margin: 0 0 0 1em; }
.craftsman .defaultBox .leatherVoice { text-align: center; }

/******************************************************************** detail
*/

.detail .defaultBox p { text-align: center; }
.detail .defaultBox a { text-decoration: none; }
.detail .defaultBox a .link { width: 460px; padding: 8px 0; }
.detail .defaultBox .gallery ul { overflow: hidden; margin-right: -16px; }
.detail .defaultBox .gallery ul li { width: 198px; float: left; margin: 0 16px 16px 0; }

/******************************************************************** voice
*/

.voice .defaultBox h3 { clear: both; }
.voice .defaultBox .python .photo { float: left; margin: 0 1.5em 1.5em 0; }
.voice .defaultBox .ostrich .photo { float: right; }
.voice .defaultBox .crocodile .photo { float: left; margin: 0 1.5em 1.5em 0; }

/******************************************************************** collection
*/

.collection .defaultBox .jra .photo { float: right; }
.collection .defaultBox .leatherVoice { text-align: center; }
.collection .itemCollection { margin-top: 20px; }
.collection .itemCollection .item { padding: 10px 0 18px; width: 274px; float: left; margin-right: 9px; display: block; color: #262626; text-align: center; background: #EDEDED; text-decoration: none; }
.collection .itemCollection .item p { padding: 2px 0 5px; }
.collection .itemCollection .adjust { margin-right: 0; }

/******************************************************************** gmap
*/

#sectionGmaps { margin: 0;}

#gmaps {
	width: 694px;
	height: 450px;
	margin: 0;
	padding: 4px;
	border: 1px solid #ccc;
}

#googlemapsContainer {
	width: 100%;
	height: 100%;
	color: #333;
}


/******************************************************************** contact
*/
#inputTypeHidden { padding: 0; height: 0;}
#transmissionFailure {}

/* set styles of form */
fieldset th { width: 9em;}
fieldset p { text-align: center; }

/* added classes in formutil.js */
input.typeText  { border: 1px solid #aaa;}
input.typeRadio { border: none;}

/* set width of inputs */
.level1 { width:  70px;}
.level2 { width: 140px;}
.level3 { width: 280px;}
.level4 { width: 400px;}

#cOpinions { width: 385px;}


/* set styles of input type="button" */
.cButton {
	cursor: pointer;
	width: auto;
	padding: 5px 10px;
	border: 3px solid #ddd;
	background: #ddd;
	color: #888;
}
#cSubmit {
	margin: 0 20px 0 0;
	padding: 5px 15px;
	border: 3px solid #777;
	background: #333;
	color: #fff;
	font-weight: bold;
}