@charset "UTF-8";
@import url(reset.css);
@import url(common.css);
@import url(styles.css);

/* headline */
/* ---------*---------*---------*---------*---------*---------*---------*---------* */

#topimage {
	height: 88px;
	background: url(../images/common/h1_bg.gif) no-repeat left top;
	text-align: left;
	padding-left: 35px;
}

body.web #topimage { background-image: url(../images/web/h1_bg.gif); }

body.logo #topimage { background-image: url(../images/logo/h1_bg.gif); }

body.service #topimage { background-image: url(../images/service/h1_bg.gif); }

body.works #topimage { background-image: url(../images/works/h1_bg.gif); }

body.news #topimage { background-image: url(../images/news/h1_bg.gif); }

body.about #topimage { background-image: url(../images/about/h1_bg.gif); }

body.contact #topimage { background-image: url(../images/contact/h1_bg.gif); }

/* h1 */

h1 { padding-top: 34px; }

body.web h2 span,
body.web h3 span { color: #C00; }

body.logo h2 span,
body.logo h3 span { color: #FF7F00; }

body.service h2 span,
body.service h3 span,
body.service h4 span { color: #690; }

body.works h2 span,
body.works h3 span { color: #44B3B4; }

body.about h2 span,
body.about h3 span { color: #969; }

body.contact h2 span,
body.contact h3 span { color: #F69; }

/* submenu */
/* ---------*---------*---------*---------*---------*---------*---------*---------* */

.sitemap #menu { padding-top: 39px; }

#menu dl {
	background: url(../images/common/menu_bg.gif) repeat-y left top;
	margin-bottom: 10px;
}

#menu dt {
	background: url(../images/common/menu_bg_t.gif) no-repeat left top;
	padding: 0 5px;
}

#menu dd {
	background: url(../images/common/menu_bg_b.gif) no-repeat left bottom;
	padding: 0 5px 5px 5px;
}

/* list */

#submenu li {
	border-bottom: 1px solid #E6E2DA;
	line-height: 0;
}

#submenu li.la,
#submenu li.on_la { border-bottom: none; }

/* on */

body.web #submenu .on { background-color: #C00; }

body.logo #submenu .on { background-color: #FFB300; }

body.service #submenu .on { background-color: #9C0; }

body.works #submenu .on { background-color: #6CC; }

body.news #submenu .on { background-color: #6CC; }

body.about #submenu .on { background-color: #A779AD; }

body.contact #submenu .on { background-color: #f69; }

#submenu .on_la {
	background-repeat: no-repeat;
	background-position: left bottom;
}

body.web #submenu .on_la { background-image: url(../images/web/submenu_bg_on.gif); }

body.logo #submenu .on_la { background-image: url(../images/logo/submenu_bg_on.gif); }

body.service #submenu .on_la { background-image: url(../images/service/submenu_bg_on.gif); }

body.works #submenu .on_la { background-image: url(../images/works/submenu_bg_on.gif); }

body.news #submenu .on_la { background-image: url(../images/news/submenu_bg_on.gif); }

body.about #submenu .on_la { background-image: url(../images/about/submenu_bg_on.gif); }

body.contact #submenu .on_la { background-image: url(../images/contact/submenu_bg_on.gif); }

/* a */

#submenu a {
	display: block;
	padding: 10px;
	text-decoration: none;
	line-height: normal;
}

* html #submenu a { zoom: 1; }

#submenu .on a { color: #FFF; }

/* a:hover */

#submenu a:hover { background: url(../images/common/submenu_on.gif) no-repeat 181px center; }

body.web #submenu a:hover { color: #C00; }

body.logo #submenu a:hover { color: #FFB300; }

body.service#submenu a:hover { color: #9C0; }

body.works #submenu a:hover { color: #6CC; }

body.news #submenu a:hover { color: #6CC; }

body.contact #submenu a:hover { color: #F69; }

#submenu .on a:hover {
	background-image: none;
	color: #FFF !important;
}

/* Ebox */
/* ---------*---------*---------*---------*---------*---------*---------*---------* */

body.web strong.point { color: #C00; }

/* WEB */
/* ---------*---------*---------*---------*---------*---------*---------*---------* */

/* index */

#webin .merit { background: url(../images/web/in_merit_bg.jpg) no-repeat right 3.23em; }

#webin .merit .einner { margin-right: 320px; }

#webin .lady .border01 p,
#webin .lady h3 { margin-right: 430px; }

#webin .lady .photo {
	float: right;
	width: 410px;
}

#webin .lady .photo li { width: 200px; }

#webin .lady .photo .m { margin-right: 10px; }

/* hearing */

#webhe .list .border01 { padding-bottom: 0; }

#webhe .list .question {
	float: left;
	width: 380px;
}

#webhe .list .question h2 { margin-bottom: 5px; }

#webhe .list .answer {
	background: url(../images/web/he_list_answer.gif) no-repeat right bottom;
	float: right;
	width: 300px;
	min-height: 156px;
	height: auto !important;
	height: 156px;
	color: #807566;
}

#webhe .list .answer p { padding-right: 130px; }

/* process */

#webpr .einner h2 {
	border-top: 2px dotted #C9C4B5;
	padding-top: 20px;
	margin-bottom: 5px;
}

#webpr .einner h2.fi {
	border-top: none;
	padding-top: 0;
}

#webpr .einner p {
	background: url(../images/web/pr_bg.gif) no-repeat left bottom;
	padding-left: 40px;
}

#webpr .einner p.la {
	background: none;
	padding-left: 0;
	margin-bottom: 0;
}

/* price */

#webpri .web .cf { margin-bottom: 10px; }

#webpri .web .cf h3 { float: left; }

#webpri .web p.price {
	font-weight: bold;
	font-size: 116%;
	color: #C00;
	text-align: right;
	float: right;
	margin-bottom: 0;
}

#webpri .web p.plan {
	background: #E2DFD6;
	padding: 3px 10px;
	color: #2C281E;
	margin-bottom: 10px;
	font-size: 93%;
}

#webpri .tbl02 td { vertical-align: bottom; }

/* interview */

#webint p.client {
	font-style: italic;
	margin-bottom: 0;
}

/* template */

#webte .chara .design { margin-bottom: 20px; }

#webte #map_canvas {
	width: 220px;
	height: 100px;
}

#webte .sample { padding-bottom: 0; }

#webte .sample .bg { background: url(../images/index/sample_bg.gif) no-repeat left top; }

#webte .sample p { padding: 0 520px 0 20px; }

/* logo */
/* ---------*---------*---------*---------*---------*---------*---------*---------* */

/* sample */

#logosa .einner { margin-right: 0; }

#logosa .ebox li {
	width: 220px;
	margin: 0 20px 20px 0;
	display: inline-block;
}

* html #logosa .ebox li {
	display: inline;
	width: 220px;
	zoom: 1;
}

*:first-child+html #logosa .ebox li {
	display: inline;
	zoom: 1;
}

#logosa .ebox p { margin-right: 20px; }

/* service */
/* ---------*---------*---------*---------*---------*---------*---------*---------* */

/* hosting */

#serviceho .ebox dt {
	background: url(../images/common/p-check2.gif) no-repeat left center;
	padding-left: 18px;
	border-bottom: 1px dotted #CCC;
	font-weight: bold;
	margin-bottom: 5px;
}

#serviceho .ebox dd {
	padding-left: 18px;
	margin-bottom: 10px;
}

#serviceho .tbl01 { margin-top: 5px; }

/* blog */

#servicebl .r3 {
	font-size: 85%;
}


/* works */
/* ---------*---------*---------*---------*---------*---------*---------*---------* */

/* index */

#worksin .ebox li {
	margin: 0 20px 20px 0;
	display:inline-block;
	vertical-align: top;
	text-align: center;
	font-size: 83%;
}

* html #worksin .ebox li {
	display: inline;
	zoom: 1;
}

*:first-child+html #worksin .ebox li {
	display: inline;
	zoom: 1;
}

#worksin .ebox li img { margin-bottom: 5px; }

#worksin .ebox li a {
	text-decoration: none;
	color: #666;
}

/* landing */

#worksla .ebox img.m { margin-right: 10px; }

/* logo */

#workslo .einner { margin-right: 0; }

#workslo .ebox li {
	width: 220px;
	margin: 0 20px 20px 0;
	display: inline-block;
}

* html #workslo .ebox li {
	display: inline;
	width: 220px;
	zoom: 1;
}

*:first-child+html #workslo .ebox li {
	display: inline;
	zoom: 1;
}

#workslo .ebox p { margin-right: 20px; }

/* about */
/* ---------*---------*---------*---------*---------*---------*---------*---------* */

/* index */

#aboutin .tbl01 thead th { text-align: left; }

/* staff */

#aboutst h2 {
	letter-spacing: 0.2em;
	margin-bottom: 10px;
}

#aboutst h2 span { font-size: 80%; }

#aboutst .ebox .profile,
#aboutst .ebox .photo { margin-bottom: 20px; }

#aboutst .noda .profile,
#aboutst .noda .photo { margin-bottom: 0; }

#aboutst .ebox .profile {
	float: left;
	width: 330px;
}

#aboutst .noda .profile table { margin-bottom: 20px; }

#aboutst .ebox .profile th { padding-right: 20px; }

#aboutst .ebox .photo {
	float: right;
	width: 350px;
}

#aboutst .ebox .photo .face { margin-bottom: 10px; }

#aboutst .ebox .photo img.mgn { margin-right: 10px; }

#aboutst .other .einner {
	border-top: 2px dotted #C9C4B5;
	padding-top: 20px;
}

/* company */

#aboutco .ebox th {
	font-weight: bold;
	padding-right: 20px;
	letter-spacing: 2px;
}

#aboutco .ebox th:first-letter { color: #969; }

/* access */

#aboutac .map { padding-bottom: 0; }

#aboutac #map_canvas {
	width: 740px;
	height: 500px;
}

/* contact */
/* ---------*---------*---------*---------*---------*---------*---------*---------* */

#contactin .ebox {
	padding-right: 320px;
	background: url(../images/contact/in_contact_bg.jpg) no-repeat right top;
}

#contactin .einner {
	min-height: 480px;
	height: auto;
	height: 480px;
}

#contactpo ol.list01 { margin-bottom: 0; }

/* policy */

#contactpo .ebox li { margin-bottom: 20px; }

#contactpo .ebox li.mgnb0 { margin-bottom: 0; }

/* news */
/* ---------*---------*---------*---------*---------*---------*---------*---------* */

body.news p.date {
	margin: 40px 20px 0 20px;
	font-size: 85%;
	text-align: right;
}

body.news p.date a { color: #666; }

body.news h2 a { text-decoration: none; }

body#newsen .ebox {
	margin-bottom: 20px;
	border-bottom: 2px dotted #CCC;
}

/* ---------------------------------------------------------------------------------------------------- */
/* pagenavi */

.pagenavi {
	margin-left: 20px;
	margin-right: 20px;
	margin-bottom: 20px;
}

.pagenavi li.n {
	width: 30%;
	float: left;
}

.pagenavi li.p {
	width: 30%;
	text-align: right;
	float: right;
}

.pagenavi li.l {
	width: 40%;
	text-align: center;
	margin: 0 30%;
}

/* ---------------------------------------------------------------------------------------------------- */
/* sitemap */

#sitemapin .sub { padding-left: 10px; }

#sitemapin .border01 {
	margin-bottom: 10px;
	padding-bottom: 10px;
}

#sitemapin .ebox li {
	color: #333029;
	font-weight: bold;
}

#sitemapin .sub li {
	color: #666;
	font-weight: normal;
}

#sitemapin .ebox a,
#sitemapin .ebox strong {
	background: url(../images/common/p-ar2-03.gif) no-repeat left center;
	padding-left: 16px;
}

#sitemapin .ebox a:hover { background: url(../images/common/p-ar2-02.gif) no-repeat left center; }

#sitemapin .ebox strong { color: #690; }