@charset "utf-8";
@import "common.css";

/* =====================================================================
	global
====================================================================== */

* {
	margin : 0;
	padding : 0;
	border : none;
	background : transparent;
	font : normal normal 100% Arial,Helvetica,sans-serif;
	font-family : "Lucida Grande", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", Geneva, Arial, Verdana, sans-serif;
}
body {
	background : #FFF;
	color : #464646;
	font-size : 62.5%;
	text-align : center;
}
body#image {
	background : none;
}

/* =====================================================================
	layout
====================================================================== */

div#shell {
	font-size : 1.3em;
	text-align : center;
}
div#header,
div#core {
	clear : both;
	margin : 0 auto;
	width : 960px;
	text-align : left;
}
div#header {
	position : relative;
	height : 135px;
}
div#contents {
	float : left;
	width : 660px;
}
div#utilities {
	float : right;
	width : 270px;
}
div#footer {
	background : url(../images/footer/footer.gif) repeat-x 0 -28px #eee;
}

/* ___________________________________________________________ anchor */

a {
	text-decoration : underline;
}
a:link {
	color : #33a3b7;
}
a:visited {
	color : #33a3b7;
}
a:hover {
	color : #ff7e00;
}
a:active {
	color : #ff7e00;
}
a:focus {
	outline : none;
}

/* ___________________________________________________________ document */

h1 {
	position : absolute;
	left : 200px;
	top : 40px;
}
h2 {
	position : absolute;
	left : 10px;
	top : 5px;
	overflow : hidden;
	background : url(../images/header/logo.gif) no-repeat 0 0;
	width : 188px;
	height : 79px;
}
h2 a {
	display : block;
	padding : 79px 0 0 0;
	width : 188px;
	height : 79px;
}
h3 {
	overflow : hidden;
	margin : 0 0 10px 0;
	background : url(../images/core/contents/headline/h3.gif) no-repeat 0 0;
	height : 35px;
}
h4,h5,h6 {
	padding : 8px 0;
	text-indent : 16px;
	font-weight : bold;
}
h4 {
	margin : 0 0 10px 0;
	border-top : 1px solid #ff7e00;
	background : url(../images/core/contents/headline/h4.gif) no-repeat left bottom;
	font-size : 1.1em;
}
h5 {
	margin : 0 0 10px 0;
	background : url(../images/core/contents/headline/h5.gif) no-repeat 0 2px;
	font-size : 1.1em;
}
h6 {
	margin : 0 0 10px 0;
	background : url(../images/core/contents/headline/h6.gif) no-repeat left bottom;
	font-weight : normal;
	text-indent : 0;
}
ul {
	margin : 0 0 15px 0;
	list-style : none;
}
ol {
	margin : 0 0 15px 0;
	list-style-position : inside;
}
ul li {
	margin : 0 0 5px 0;
	padding : 0.2em 0 0.2em 16px;
	background : url(../images/option/arrow.gif) no-repeat 0 0.3em;
	line-height : 1.0;
	min-height : 1em;
	_height : 1%;
}
ol li {
	margin : 0 0 5px 0;
}
ul li ul li {
	padding : 2px 0 2px 10px;
	background : url(../images/option/list_child.gif) no-repeat 0 0.3em;
}
dl {
	margin : 0 0 20px 0;
}
dl dt {
	margin : 0 0 10px 0;
	padding : 4px;
	background : #F1F1F1;
	color : #444444;
	text-indent : 5px;
}
dl dd {
	margin : 10px 15px 10px 10px;
}
dl dd p {
	padding : 0 0 5px 0;
}
strong {
	font-size : 1.3em;
}
em {
	font-weight : bold;
}
p {
	padding : 0 0 20px 0;
	line-height : 1.6;
}
address {
	margin : 10px 10px 20px 10px;
	padding : 10px 20px;
	border : 1px solid #E0E0E0;
}

/* ___________________________________________________________ table */

table {
	margin : 0 10px 20px 10px;
	border : 1px solid #E0E0E0;
	border-collapse : collapse;
}
table th {
	padding : 5px;
	border : 1px dotted #E0E0E0;
	background : #F1F1F1;
	font-weight : bold;
	text-align : center;
}
table td {
	padding : 5px;
	border : 1px dotted #E0E0E0;
}
caption {
	font-size : 1.1em;
}

/* ___________________________________________________________ image */

img {
	vertical-align : bottom;
}
.thumbs_left {
	float : left;
	margin : 0 10px 10px 0;
}
.thumbs_right {
	float : right;
	margin : 0 0 10px 10px;
}
.thumbnail,
.thumbs_center {
	text-align : center;
}

/* ___________________________________________________________ hr */

hr {
	clear : both;
	visibility : hidden;
}
div#shell hr {
	display : block;
/*	margin : -15px 0 0 0;*/
	height : 1px;
}

/* =====================================================================
	header
====================================================================== */

div#header ul {
	padding-top : 8px;
	text-align : right;
	font-size : 0.9em;
}
div#header ul li {
	display : inline;
	margin : 0;
	padding : 0;
	background : none;
}
div#header ul.guide li {
	padding : 0 6px 0 3px;
	border-right : 1px solid #666;
}
div#header ul.guide li.break {
	padding-right : 0;
	border-right : 0;
}
div#header p.request {
	position : absolute;
	top : 31px;
	right : 0;
	marign : 0;
	padding : 0;
	background : url(../images/header/tel.gif) no-repeat 0 0;
	width : 351px;
	height : 40px;
}
div#header p.request a {
	display : block;
	margin-left : 180px;
	background : url(../images/header/request.gif) no-repeat 0 -40px;
	text-indent : -2000px;
	width : 170px;
	height : 40px;
}
div#header p.request a:hover {
	background-position : 0 0;
}

/* ___________________________________________________________ navigation */

div#header ul.navigation {
	position : absolute;
	bottom : 10px;
	overflow : hidden;
	margin : 0;
	padding : 0;
	background : url(../images/intro/navigation.gif) no-repeat 0 0;
	height : 45px;
}
div#header ul.navigation li {
	overflow : hidden;
	float : left;
	margin : 0;
	padding : 0;
	height : 45px;
}
div#header ul.navigation li a {
	overflow : hidden;
	display : block;
	background : url(../images/header/home.gif) no-repeat 0 -45px;
	margin : 0 0 0 0;
	padding : 45px 0 0 0;
	height : 45px;
}
div#header ul.navigation li a:hover,
div#header ul.navigation li.stay a {
	background-position : 0 0;
}
div#header ul.navigation li.home a {
	margin-right : 14px;
	background-image : url(../images/header/home.gif);
	width : 75px;
}
div#header ul.navigation li.college a {
	background-image : url(../images/header/college.gif);
	width : 169px;
}
div#header ul.navigation li.about a {
	background-image : url(../images/header/about.gif);
	width : 126px;
}
div#header ul.navigation li.case a {
	background-image : url(../images/header/case.gif);
	width : 127px;
}
div#header ul.navigation li.price a {
	background-image : url(../images/header/price.gif);
	width : 141px;
}
div#header ul.navigation li.design a {
	margin-right : 12px;
	background-image : url(../images/header/design.gif);
	width : 125px;
}
div#header ul.navigation li.inquiry a {
	background-image : url(../images/header/inquiry.gif);
	width : 171px;
}

/* =====================================================================
	core
====================================================================== */

div.section {
	overflow : hidden;
}
p.thumb {
	padding : 0 0 3px 0;
}
p.thumb a {
	display : block;
	border : 3px solid #ddd;
}
p.thumb a:hover {
	border-color : #ff7e00;
}
div.column4 .column {
	float : left;
	margin-right : 20px;
	width : 150px;
}
div.column3 .column {
	float : left;
	margin-right : 15px;
	width : 210px;
}
div.column2 .column {
	float : left;
	margin-right : 20px;
	width : 320px;
}
.column {
	margin-bottom : 15px;
}
.column a {
	letter-spacing : -1px;
}
.turn {
	margin-right : 0 !important;
}
div.column4 p.label,
div.column3 p.label,
div.column2 p.label {
	padding-bottom : 10px;
	text-align : center;
}
p.more {
	text-align : right;
}

/* ___________________________________________________________ detail */

div.summary {
	
}
ul.summary li {
	background : none !important;
	margin : 0 0 10px 0;
	padding : 0 0 0 5px;
	list-style : inside url(../images/option/arrow.gif);
	line-height : 1.0 !important;
	height : 100%;
}
p.date {
	text-align : right;
	margin : -6px 0 4px 0;
	padding : 0;
}
p.navigation {
	text-align : center;
}

/* ___________________________________________________________ active */


ul.active {
	padding : 5px 0 0 0;
	border-top : 1px dotted #DDD;
	text-align : right;
}
ul.active li {
	display : inline;
	padding : 0;
	background : none;
}
dt.active {
	border : none;
	text-align : right;
}
dd.active {
	margin : 0 0 15px 0;
	padding : 3px 0 0 0;
	text-align : right;
}
p.apply {
	width : 250px;
}
p.apply a {
	display : block;
	background : url(../images/option/apply.gif) no-repeat 0 -40px;
	color : #FFF;
	text-decoration : none;
	text-indent : 16px;
	line-height : 40px;
	font-weight : bold;
	width : 250px;
	height : 40px;
}
p.apply a:hover {
	background-position : 0 0;
}
.design p.apply {
	margin-left : 205px;
}

/* =====================================================================
	intro
====================================================================== */

ul.topic_path {
	margin : 0 0 10px 0;
}
ul.topic_path li {
	margin : 0;
	padding : 0 5px 0 0;
	background : none;
	display : inline;
}

/* ___________________________________________________________ shortcut */

div#intro div.shortcut {
	margin : 0 0 30px 0;
}
div#intro div.shortcut div.section {
	overflow : hidden;
	float : left;
	margin : 0 15px 0 0;
	width : 310px;
	height : 100px;
}
div#intro div.shortcut div.third {
	margin-right : 0;
}
div#intro div.shortcut h3 {
	margin : 0;
	padding : 0;
	height : 100px;
}
div#intro div.shortcut h3 a {
	display : block;
	text-indent : -3000px;
	height : 100px;
}
div#intro div.shortcut div.first h3 a {
	background-image : url(../images/home/shortcut1.jpg);
}
div#intro div.shortcut div.second h3 a {
	background-image : url(../images/home/shortcut2.jpg);
}
div#intro div.shortcut div.third h3 a {
	background-image : url(../images/home/shortcut3.jpg);
}

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

p.request {
	padding-top : 20px;
	padding-bottom : 40px;
}
p.sign {
	text-align : right;
}

/* =====================================================================
	utilities
====================================================================== */

div#utilities div.guide h4 {
	padding : 0;
	border : 0;
	background : url(../images/core/utilities/headline/h4.gif) no-repeat 0 0;
	color : #FFF;
	font-weight : bold;
	line-height : 35px;
	height : 35px;
}
div#utilities div.guide ul {
	margin-bottom : 20px;
}
div#utilities div.guide ul li {
	padding : 0 0 0 25px;
	border-bottom : 1px solid #ddd;
	background-image : url(../images/option/arrow_s.gif);
	background-position : 10px 0.5em !important;
}
div#utilities div.about ul li {
	border : none;
}
div#utilities div.guide ul li a {
	padding : 0.3em 0 0.6em 0;
	display : block;
}
div#utilities div.about ul li a {
	padding : 0.3em 0;
}
div#utilities div.guide h5 {
	margin : 0 0 5px 0;
	padding : 0;
	background : url(../images/core/utilities/guide/h5.gif) no-repeat 0 0;
	text-indent : -3000px;
	height : 38px;
}
div#utilities div.design div.topics {
	margin-bottom : 15px;
}
div#utilities div.design h4 {
	background : url(../images/home/design/h4.gif) no-repeat 0 0;
	text-indent : -2000px;
}
div#utilities div.design h5 {
	padding : 0 10px 0 0;
	text-align : right;
	height : 38px;
}
div#utilities div.design h5 a  {
	line-height : 38px;
}
div#utilities div.design .rank1 h5 {
	background : url(../images/home/design/rank1.gif) no-repeat 0 0;
}
div#utilities div.design .rank2 h5 {
	background : url(../images/home/design/rank2.gif) no-repeat 0 0;
}
div#utilities div.design .rank3 h5 {
	background : url(../images/home/design/rank3.gif) no-repeat 0 0;
}
div#utilities div.design p.thumb a {
	display : block;
	float : left;
	border : 1px solid #ddd;
	width : 100px;
	height : 91px;
}
div#utilities div.design p.thumb a:hover {
	border-color : #ff7e00;
}
div#utilities div.design ul {
	margin-left : 110px;
}
div#utilities div.about h5 {
	background : url(../images/core/utilities/guide/h5.gif) no-repeat 0 0;
	text-indent : -2000px;
}


/* =====================================================================
	footer
====================================================================== */

div#footer {
	position : relative;
	text-align : center;
}
div#footer p.return_top,
div#footer div.sitemap,
div#footer ul.guide,
div#footer .section p,
div#footer address {
	margin : 0 auto;
	padding : 0 0 0 10px;
	text-align : left;
	width : 950px;
	_width : 960px;
}
div#footer p.return_top {
	position : relative;
	background : transparent;
}
div#footer p.return_top a {
	position : absolute;
	right : 0;
	display : block;
	background : url(../images/footer/return_top.gif) no-repeat 0 0;
	text-indent : -3000px;
	width : 140px;
	height : 30px;
}
div#footer p.return_top a:hover {
	background-position : 0 -30px;
}
div#footer h5,
div#footer h6 {
	margin : 0;
	padding : 0;
	border : 0;
	background : none;
	text-indent : 0;
}
div#footer div.sitemap {
	padding-top : 55px;
}
div#footer div.sitemap .column {
	float : left;
	margin-bottom : 20px;
	width : 190px;
}
div#footer div.sitemap .about {
	width : 240px;
}
div#footer div.sitemap .case,
div#footer div.sitemap .price,
div#footer div.sitemap .design {
	width : 160px;
}

div#footer div.sitemap h5 {
	padding : 0 0 15px 0;
}
div#footer div.sitemap a {
	padding-left : 20px;
	background : url(../images/footer/arrow.gif) no-repeat 0 1px;
}
div#footer div.sitemap h5 a {
	background-image : url(../images/footer/home.gif);
}
div#footer div.sitemap h6 a {
	background-image : url(../images/footer/arrow.gif);
}
div#footer div.sitemap ul li a {
	padding-left : 15px;
	background-image : url(../images/footer/arrow_s.gif);
	font-size : 0.9em;
}
div#footer div.sitemap ul {
	margin : 5px 0 0 0;
	padding : 0;
}
div#footer div.sitemap ul li {
	background : none;
}
div#footer div.section {
	padding : 0 0 20px 0;
	background : #888;
	color : #FFF;
	text-align : center;
}
div#footer div.section ul {
	padding-top : 20px;
	text-align : left;
}
div#footer div.section ul.guide li {
	display : inline;
	margin : 0 8px 0 0;
	padding : 0 6px 0 0;
	border-right : 1px solid #FFF;
	background : none;
}
div#footer div.section ul li.break {
	border : none;
}
div#footer div.section a {
	color : #FFF;
}
div#footer address {
	margin-top : -15px;
	padding : 0;
	border : none;
	font-size : 0.86em;
	text-align : right;
}
div#footer address a {
	text-decoration : none;
}
div#footer .section p {
	clear : both;
	padding-top : 20px;
	line-height : 1.2;
}