@charset "utf-8";
/*
------------------------------------------------------------------------------
	Sitename: SAP 有限会社サップ Official WebSite
	URL: http://sap-j.jp/
	Date: 2012-05
	Copyright (C) SAP All rights reserved.
	
	初期設定、コンテンツエリアファイル
	YUI Font-size
 	10px = 77%     11px = 85%     12px = 93%     13px = 100%
 	14px = 108%    15px = 116%    16px = 123.1%  17px = 131%
 	18px = 138.5%  19px = 146.5%  20px = 153.9%  21px = 161.6%
 	22px = 167%    23px = 174%    24px = 182%    25px = 189%
 	26px = 197%
------------------------------------------------------------------------------
*/

/*	ベーシックスタイル
------------------------------------------------------------------------------
*/
/* Firefoxスクロールバーの有無によるズレ対策 */
html {
	overflow-y: scroll;/*縦スクロールバーあり*/
	overflow-x: hidden;/*横スクロールバーなし*/
}
body {
	font-family: "メイリオ", Meiryo, "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "ＭＳ Ｐゴシック", "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif;
}
/*----- IE6 -----*/
* html body {
	text-align:center;
}
input, textarea {
	font-family: "メイリオ", Meiryo, "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "ＭＳ Ｐゴシック", "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif;
}
/* for IE6 */
* html body {
	font-family: "ＭＳ Ｐゴシック", "MS PGothic", Sans-Serif;
}
* html input, * html textarea {
	font-family: "ＭＳ Ｐゴシック", "MS PGothic", Sans-Serif;
}

/*	link color
------------------------------------------------------------------------------
*/	
a:link {
	color:#0f4592;
	text-decoration:underline;
}
a:visited {
	color:#0f4592;
	text-decoration:underline;
}
a:hover {
	text-decoration:underline;
	color:#3399CC;
}
a:active {
	color:#3399CC;
	text-decoration:underline;
}
/*	clearfix
------------------------------------------------------------------------------
*/	
.clearfix:after {
	content: " ";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
	font-size: 0.1em; 
	line-height: 0; 
}
.clearfix {
	display: inline-table;
}
/* Hides from IE-mac \*/
* html .clearfix {
	height: 1%;
}
*:first-child+html .clearfix {
	height:1%;
}
.clearfix {
	display: block;
}
/* End hide from IE-mac */




/*	
------------------------------------------------------------------------------
	ここからメインレイアウト
------------------------------------------------------------------------------
*/
#page {
	width:100%;
	overflow:hidden;
}
#wrapper {
	padding: 0px;
	text-align: left;
	position: relative;
	margin: 0px auto;
	width: 960px;
}
#contents h1 {
	margin-bottom:20px;
	}

/*	header
------------------------------------------------------------------------------
*/
#globalHeader {
	position:fixed;
	z-index:80;
	top: 0px;
	}
*html #globalHeader {
	position:absolute;/*ie6*/
	}
#globalHeader h1{
	margin-left:10px;
	}
#globalHeader nav h1{
	display:none;
	}

/*	globalNavigation
------------------------------------------------------------------------------
*/
#globalNav {
	position:absolute;
	height: 50px;
	width:810px/*804*/;	
	margin-left:150px;/*左右3pxグラデ*/
	top:0;
}

#globalNav li {
	float:left;/*ie6,7用*/
	}

#globalNav a{
	float:left;
	display:block;
	height:50px;
	width:133px;
	background-image: url(../img/btn.png);
	text-indent:-9999px;
    overflow: hidden;
}
#globalNav #about a, #globalNav #recruit a{
	width:136px;
	}
#about a {
	background-position: 0px 0px;
}
#works a {
	background-position: -136px 0px;
	}
#item a {
	background-position: -269px 0px;
	}
#blog a {
	background-position: -402px 0px;
	}
#contact a {
	background-position: -535px 0px;
	}
#recruit a {
	background-position: -668px 0px;
	}
/*hover*/
#about a:hover {
	background-position: 0px -50px;
}
#works a:hover {
	background-position: -136px -50px;
	}
#item a:hover {
	background-position: -269px -50px;
	}
#blog a:hover {
	background-position: -402px -50px;
	}
#contact a:hover {
	background-position: -535px -50px;
	}
#recruit a:hover {
	background-position: -668px -50px;
	}
/*選択*/
#EntryAbout #about a {
	background-position: 0px -100px;
}
#EntryWorks #works a {
	background-position: -136px -100px;
	}
#EntryItem #item a {
	background-position: -269px -100px;
	}
#EntryBlog #blog a {
	background-position: -402px -100px;
	}
#EntryContact #contact a {
	background-position: -535px -100px;
	}
#EntryRecruit #recruit a {
	background-position: -668px -100px;
	}


#contents article {
	padding-bottom:200px;
	}

/*	トップページ
------------------------------------------------------------------------------
*/
#CategoryIndex {
	padding-top:150px;
	min-height:800px;
	/*background-color:#9FC;*/
	}
#CategoryIndex hgroup {
	margin-left:380px;
	}
#CategoryIndex h1 {
	margin-bottom:0px;
	height:200px;/*ie7.8用*/
	}

#CategoryIndex p {
	margin-top:60px;
	margin-left:305px;
	}

/*	about
------------------------------------------------------------------------------
*/
#CategoryAbout {
	/*background-color:#CCCCFF;*/
	margin-left:110px;
	width:740px;
	min-height:800px;
	padding-top:150px;
	}
#CategoryAbout h2 {
	font-size:138.5%;
	padding: 0px 20px 20px;
	}
/*---------- 会社概要 ----------*/
#company dl {
	width:380px;
	float:left;
	margin-left:20px;
	display:inline;/*ie6*/
	}
#company dt{
	width:5em;
	float:left;
	clear:left;
	}
#company dd {
	margin-left:5em;
	padding-bottom:15px;
	zoom:1;/*ie6*/
	}
#sapMap {
	float:left;
	width:320px;
	margin-top:-40px;
	/* [disabled]position:relative; */
	}
#sapMap figcaption {
	text-align:center;
	margin-top:10px;
	}
#sapMap p{
	margin-top:10px;
	text-align:center;
	}
/*---------- 業務内容 ----------*/
#business {
	clear:both;
	width:740px;
	}
#business h2 {
	padding-top:50px;
	}
#business ul {
	margin-left:20px;
	}
	
#business ul li {
	/*margin-bottom:15px; ie chrom 下あき*/
	padding-bottom:15px;
	padding-left: 18px;
	background: url(../img/about_mark.png) no-repeat left 1px;
	}
#business ul li ul {
	margin-top:10px;
	margin-left:0px;
	}
#business ul li ul li {
	/*margin-bottom:10px;*/
	padding-bottom:10px;
	}

/*	works
------------------------------------------------------------------------------
*/
#CategoryWorks {
	/*background-color:#FFCC66;*/
	margin-left:110px;
	width:740px;
	/*min-height:800px;*/
	
	padding-top:230px;/*本編までの距離*/
	position:relative;
	
	
	
	}
/*javascript 見出し*/	
#CategoryWorks h1 {
	z-index:50;
	position:absolute;
	/*top:150px;*/
	top:150px;
	}

/*マスク*/
#workMask {
	top:0px;
	background-color:#FFF;
	height:210px;/*height:230px;*/
	width:740px;
	z-index:10;
	}

/*---------- 作品ナビ ----------*/
#CategoryWorks nav {
	width:120px;
	font-weight:bold;
	font-size:108%;
	position: absolute;
	/*left: 20px;*/
	top: 230px;
	margin-left:0px;
	}
#CategoryWorks nav h2{
	display:none;
	}
#CategoryWorks nav li{
	margin-bottom:10px;
	padding-top: 5px;
	padding-left:20px;
	padding-bottom: 5px;
	cursor:pointer;
	/*background: #CCCCCC;*/
	}
#CategoryWorks nav li:hover{
	color:#24C9FF;
	}
#CategoryWorks nav li.worksPoint {
	color:#0099CC;
	font-weight:bold;
	}
/*---------- 作品内容 ----------*/

#worksInner {
	margin-top:0px;
	width:620px;
	margin-left:120px;
	}
*:first-child+html #worksInner {
	margin-left:0px;
	padding-left:120px;
	}
#worksInner h2 {
	/*font-size:131%;*/
	font-size:153.9%;
	font-weight:bold;
	padding-bottom:20px;
	color:#0099CC;
	}
#worksPrint h2 {
	margin-top:20px;
	}
#worksPrint, #worksWriting{
	margin-right:20px;
	}
/*あとで*/
#worksWeb, #worksPrint, #worksWriting, #worksIllust {
	padding-bottom:100px;	
	}
#worksInner p b {
	margin-bottom:10px;
	display:block;
	font-size:108%;
	}
/*#worksWeb{
	background-color:#00CC33;
} #worksPrint{
	background-color:#0099CC;
} 
#worksWriting{
	background-color:#990066;
}#worksIllust{
	background-color:#99CCCC;
}*/

/*---------- ウェブ ----------*/
#worksWeb header {
	margin-bottom:20px;
	}
/*閉じた状態*/
#worksWeb section{
	width:248px;/*290px*/
	background: #FFFFFF;
	margin-bottom:10px;
	/*margin-top:10px;*/
	border: 1px solid #666666;
	padding: 10px 20px;
	float:left;
	margin-right:20px;
	cursor:pointer;	
	}
/*左ブロックフロート解除*/
#worksWeb section .webDate{
	float:none;
	width:100%;
	}
/*閉じた状態 見出し*/
#worksWeb section h3 {
	text-align:center;
	color:#333333;
	margin-bottom:0px;
	padding-bottom:0px;
	border-bottom: none;
	}
/*閉じた状態 不可視要素*/
#worksWeb section .webDate p, #worksWeb section .webImg{
	display:none;
	}

/*開いた状態*/
#worksWeb .webOpen {
	width:558px;/*600px*/
	background: #d8ecfb;
	margin-bottom:10px;
	border: 1px solid #2d94de;
	padding: 20px;
	min-height:240px;/*280px*/
	float:none;
	cursor:default;
	}
#worksWeb .webOpen .webDate{
	float:left;
	width:338px;/*右空き20px*/
	}
#worksWeb .webOpen .webDate h3{
	margin-bottom:30px;
	color: #003366;
	text-align:center;
	padding-bottom: 10px;
	border-bottom: 1px solid #036;
	}
#worksWeb .webOpen h3 strong, #worksWeb h3 strong{
	display:block;
	font-size:131%;
	}
/*こころの遺伝子用*/
#worksWeb section h3 strong span {
	font-size:77%;
	}
#worksWeb .webOpen .webDate p {
	margin-bottom: 10px;
	margin-left:20px;
	margin-right:20px;
	display:block;
	}
#worksWeb .webOpen .webDate p a{
	padding-right:16px;
	background: url(../img/blank_icon.png) no-repeat right center;
	}

#worksWeb .webOpen .webImg{
	float:right;
	width:200px;
	display:inline;
	}
.web_other {
	clear: both;
	border: 1px solid #666;
    margin-right: 20px;
    padding: 20px;
}
.web_other h3 {
	font-size: 123.1%;
	margin-bottom: 10px;
}
.web_other h4 {
	font-size: 108%;
	margin-bottom: 10px;
}
.web_other ul {
	margin-bottom: 20px;
	padding-left: 20px;
}
.web_other ul li {
	margin-bottom: 10px;
}
/*---------- プリント ----------*/
#worksPrintImg {
	position:relative;
	height:200px;
	width:600px;
	}
/* #worksPrintImg li {
	position:absolute;
	} */
#worksPrint dl {
	margin: 20px 10px 0px;
	}
#worksPrint dt {
	font-size:116%;
	}
#worksPrint dd {
	margin-bottom:10px;
	}
#worksPrint aside {
	margin-left:10px;
	}
/*---------- ライティング ----------*/	
#worksWriting ul, #worksPrint ul  {
	margin: 20px 10px 0px;
	}
#worksWriting ul li, #worksPrint ul li{
	margin-bottom:10px;
	font-size:116%;
	} 
#worksWriting ul li a {
	padding-right:16px;
	background: url(../img/blank_icon.png) no-repeat right center;
	}
/*---------- イラスト ----------*/
#worksIllust #worksIllustGallery {	
	margin-top: 20px;
	}

#worksIllust li {
	float:left;
	width:127px;/*135px*/
	margin-right:20px;
	margin-bottom:10px;
	display:inline;
	zoom:1;
	border: 1px solid #CCC;
	background: #F9F9F9;
	padding: 3px;
	height:127px;/*135px*/
	}



/*	item
------------------------------------------------------------------------------
*/
#CategoryItems {
	/*background-color:#CC9999;*/
	margin-left:110px;
	width:740px;
	min-height:800px;
	padding-top:150px;
	}
	
#CategoryItems p {
	padding:0px 20px 20px;
	}
#itemList {
	margin-left:20px;
	margin-top:20px;
	}
#itemList li {
	float:left;
	width:152px/*160*/;
	margin-right:20px;
	margin-bottom:20px;
	background: #F9F9F9;
	padding: 3px;
	border: 1px solid #CCC;
	height:152px;
	}
#CategoryItems #blogTxt {
	text-align:center;
	margin-top:200px;
	}
/*	blog
------------------------------------------------------------------------------
*/
#CategoryBlog {
	/*background-color:#CCFF33;*/
	margin-left:110px;
	width:740px;
	min-height:800px;
	padding-top:150px;
	}
#CategoryBlog #blogTxt {
	/*padding:0px 20px 20px;*/
	text-align:center;
	margin-top:200px;
	}

/*	Contact
------------------------------------------------------------------------------
*/
#CategoryContact {
	/*background-color:#FF66FF;*/
	margin-left:110px;
	width:740px;
	min-height:800px;
	padding-top:150px;
	}
#CategoryContact p {
	padding:0px 20px;
	}
#mailform {
	margin-left:20px;
	margin-right:20px;
	margin-top:20px;
	}
#mailform legend {
	font-size:108%;
	font-weight:bold;
	padding-left:10px;
	padding-bottom:10px;
	}
*:first-child+html #mailform legend {
	padding-left:5px;
	}
#mailform table {
	empty-cells:show;
	border-spacing:3px;
	border-collapse:separate;
	width:700px;
	background: #EFEFEF;
	}

#mailform th {
	background: #F8FCFE;
	font-weight: normal;
	padding-top: 10px;
	padding-bottom: 10px;
	width: 160px;/*180*/
	font-weight: normal;
	text-align: right;
	padding-right: 10px;
	border-right: 1px solid #6AB3E8;
	border-bottom: 1px solid #6AB3E8;
	vertical-align: middle;
}
#mailform th em {
	font-size:85%;
	color:#CC0000;
	padding-left:10px;
	}
#mailform td {
	background: #EBF4FC;
	/*background: #ECF9FF;*/
	padding: 15px 10px;
	border-right: 1px solid #6AB3E8;
	border-bottom: 1px solid #6AB3E8;
	width:499px;/*520*/
}
#mailform .bord,#mailform .bordzip,#mailform .bordMess {
	font-size:93%;
	width:300px;
	border-top: 2px solid #666666;
	border-right: 2px solid #CCCCCC;
	border-bottom: 2px solid #CCCCCC;
	border-left: 2px solid #666666;
	/*padding: 2px 3px;*/
	
}
#mailform .bordzip {
	width:200px;
	}
#sapForm .bordMess {
	resize: vertical;	
	}
#sapForm td label.error{
	display:block;
	color:#C00;
	}
	

#thanks{
	text-align:center;
	padding-top:150px;
	}	
#thanks h1{
	font-size:138.5%;
}
#thanks h2{
	margin-top:50px;
}
#thanks p{
	margin-top:50px;
	}
/*	Recruit
------------------------------------------------------------------------------
*/
#CategoryRecruit {
	/*background-color:#CC9966;*/
	margin-left:110px;
	width:740px;
	min-height:800px;
	padding-top:150px;
	padding-bottom:50px;
	}
#CategoryRecruit p {
	padding:0px 20px 20px;
	}
.recruitMain {
	padding:0px 20px 30px;
	}
.recruitMain h2 {
	font-size:123.1%;
	margin-right:20px;
	border-left: 3px solid #2d94de;
	padding-left: 10px;
	}
.recruitMain dl {
	margin-top:10px;
	margin-left:13px;
	margin-right:20px;
	}
*html .recruitMain dl {
	margin-left:6px;
	}
.recruitMain dt {
	float:left;
	width:5em;
	clear:left;
	text-align:right;
	}
.recruitMain dd {
	margin-left:5em;
	margin-bottom:15px;
	zoom:1;/*ie6*/
	}
.recruitMain li {
	font-weight:bold;
	}
.recruitList {
	margin-top:5px;
	margin-bottom:10px;
	font-weight:normal;
	}
.recruitMain .recruitList li{
	margin-left:1.2em;
	list-style: disc outside;
	font-weight:normal;
	margin-bottom:5px;
}
#recruitDesc {
	margin-left:20px;
	margin-right:20px;
	}
#recruitDesc dt {
	float:left;
	width:5em;
	clear:left;
	text-align:right;
	}
#recruitDesc dd {
	margin-left:5em;
	padding-bottom:15px;/*marginはie chrome*/
	zoom:1;/*ie6*/
	}

#recruitDesc dd .recruitDescAddress {
	padding:0px 0px 20px;
	}		

/*	footer
------------------------------------------------------------------------------
*/
#globalFooter {
	margin-left:20px;
	/*background-color:#666;*/
	padding-bottom:10px;
	}
#footLogo {
	float:left;
	width:35px;
	}
#footTxt {
	float:left;
	width:800px;
	font-size:93%;
	/*background-color:#FFFF66;*/
	}
#backTo {
	position:fixed;
	bottom:10px;
	margin-left:880px;
	}
		
/*	Error
------------------------------------------------------------------------------
*/
#CategoryError {
	margin-left:20px;
	margin-right:20px;
	padding-top:50px;
	padding-bottom:200px;
	/*background-color:#33CCCC;*/
	}
#CategoryError hgroup {
	float:left;
	width:400px;
	text-align:center;
	}
#CategoryError section {
	float:left;
	width:520px;
	}
#CategoryError section h1 {
	font-size:189%;
	margin-bottom:50px;
	font-weight:bold;
	}
#CategoryError section p {
	line-height:1.8;
	margin-bottom:20px;
	margin-right:50px;
	}
/*	privacy
------------------------------------------------------------------------------
*/
#CategoryPrivacy {
	padding-top:80px;
	padding-left:20px;
	padding-right:20px;
	line-height:1.8;
	}
#CategoryPrivacy h2{
	font-size:182%;
	margin-bottom:20px;
	}
#CategoryPrivacy p{
	margin-bottom:20px;
	margin-left:20px;
	margin-right:20px;
	}
#CategoryPrivacy h3{
	font-size:138.5%;
	margin-bottom:5px;
	}
#CategoryPrivacy .signature {
	text-align:right;
	}