﻿@charset "utf-8";

/* COMMON
---------------------------------------------*/

html {background-color: #000;width: 100%;height: 100%;}

body,div,
dl,dt,dd,ul,ol,li,
h1,h2,h3,h4,h5,h6,strong,
pre,form,fieldset,input,textarea,p,blockquote,th,td {
	margin: 0;
	padding: 0;
	font-size: 100%;
	font-weight: normal;
	list-style: none;}

body {
        text-align: center;
	font-family: Meiryo, "メイリオ", Verdana, "Hiragino Kaku Gothic Pro W3", "ヒラギノ角ゴ Pro W3", Osaka, "MS P Gothic", "ＭＳ Ｐゴシック", sans-serif;
	color: #333;
	font-size: 12px;}

table { border-collapse:collapse; border-spacing:0; }
input, select {padding: 1px;}
img { vertical-align: bottom;border: none;}
a   {color:#03419a;text-decoration: underline;}
a:hover {color: #ff6f6f;text-decoration: none;}
em,address {font-style: normal;}
.clear {clear: both;}

/* ALL
---------------------------------------------*/

#all {
	width: 990px;
	text-align: left;
        margin: 0 auto;}

/* HEADER
---------------------------------------------*/

#header {padding-top: 25px;}

#header #logobox {
	float: left;
	width: 210px;
	margin-left: -7px;}

#header #logobox a {margin-left: 12px;}

#header #msgbox {
	z-index: -1; 
	float: right;
	text-align: right;
	width: 745px;}

.top #msgbox {margin: 203px 30px 0 0;}
.sub #msgbox {margin: 120px 30px 0 0;}

/* forIE6 */
* html .top #msgbox {margin: 198px 10px 0 0;} 
* html .sub #msgbox {margin: 120px 10px 0 0;} 

.top h2 {
	position: absolute;
	left: 50%; top: 40px;
	font-size: 10px;
	margin: 320px 0 0 -450px;}

/* CLIENTS AREA
---------------------------------------------*/

#clients {
	padding: 20px 0 0 10px;}

#clients .clientsbox {
	float: left;
	position: relative;
	display: block;
	width: 188px;
	height: 250px;
	margin-right: 8px;
	background: url(../img/shadow.jpg) left 143px no-repeat;}

.clientsbox strong {
	font-size: 12px;
	font-weight: bold;
	color: #fff;
	line-height: 1.8em;}

.clientsbox p {
	font-size: 10px;
	color: #666;
	line-height: 1.2em;
	letter-spacing: 0;
	margin: 0 10px; }

.new {
	position: absolute;
	right: 0;
	top: 72px;
	z-index: 2;}

/* WE ARE MONSTERA DESIGN CODE
---------------------------------------------*/

#wearemdc {
	clear: both;
	width: 785px;
	overflow: auto;
	padding: 20px 0 0 172px;
	background: url(../img/bg_mdc02.jpg) left 20px no-repeat;}

#wearemdc h3 {margin-bottom: 10px;}

#wearemdc #add {
	width: 580px;
	color: #fff;
	line-height: 1.4em;
	border-bottom: 6px solid #9c0;}

#add .matsuyama {
	float: left; 
	width: 280px;}

#add .hiroshima {
	float: right; 
	width: 280px;
	text-align: right;}

#add dl {margin-bottom: 25px;}

#add dl dt {
	font-size: 16px;
	font-weight: bold;
	line-height: 1.7em;}

#add dl dd strong {
	font-size: 14px;}

#add dl dd span {
	font-size: 10px;}

#add dl dd address {
	color: #666;
	margin-top: 0.5em;
	line-height: 1.4em;}

#wearemdc .msg {
	clear: both;
	width: 586px;
	color: #fff;
	padding: 1.5em 0;
	line-height: 1.7em;}


#wearemdc .msg p {
	margin-bottom: 1em;
	letter-spacing: 0.05em;}


/* FOOTER
---------------------------------------------*/

#footer {	
	clear: both;
	width: 100%;
	text-align: center;
	color: #fff;
	padding: 12px 0 40px 0;}


#footnavi {	
	color: #fff;
	margin-bottom: 10px;
	padding: 12px 0;
	border-top: 1px solid #333;
	border-bottom: 1px solid #333;}

#footnavi li {	
	display: inline;
	color: #fff;}

#footnavi li a {
	color: #fff;
	margin-right: 3px;
	text-decoration: none;}

#footnavi li a:hover {text-decoration: underline;}

#footer #thanks {
	display: block;
	margin: -18px auto 0 auto;
	width: 965px;
	padding-right: 25px;
	text-align: right;
	font-size: 10px;
	color: #999;}


/* CLEARFIX
---------------------------------------------*/

.clearfix:after{
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

.clearfix{ display: inline-block; }

/* Hides from IE-mac \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* End hide from IE-mac */



/* HIGHSLIDE
---------------------------------------------*/

.highslide {
	outline: none;}

.highslide-active-anchor img {visibility: hidden;}

.highslide-image {border: 8px solid #444;}

.caption {
	display: none;
	text-align: left;
	font-size: 10px;
	padding: 0 10px 8px 10px;
	color: #fff;
	background-color: #444;
	border: 2px solid #444;}

.caption img {
	display: block;
	float: right;
	margin-top: 3px;}

.caption p {letter-spacing: 0.05em;}

.highslide-loading {
	display: block;
	color: white;
	font-size: 9px;
	font-weight: bold;
	text-transform: uppercase;
	text-decoration: none;
	padding: 3px 3px 3px 22px;
	background-color: black;}

.comment {margin-top: 1em;}

/* PROFILE
---------------------------------------------*/

.highslide-html { background-color: #333;}


.highslide-html-content {
	position: absolute;
	display: none;}

/* Styles for the popup */
.highslide-wrapper {background-color: #666;}

.highslide-wrapper .highslide-html-content {
	width: 265px;
	padding: 10px 5px 5px 10px;
	color: #fff;
	text-align: left;}

.highslide-wrapper .profheader a {
	font-weight: bold;
	color: gray;
	text-transform: uppercase;
	text-decoration: none;}

.highslide-wrapper .highslide-footer {height: 11px;}
.highslide-wrapper .highslide-body {
	padding-top: 15px;}

.highslide-body p {margin-bottom: 1em;}

/* forIE6 */
* html .highslide-body {height: 1%;}

.highslide-move {cursor: move;}

/* These must be the last of the Highslide rules */
.highslide-display-block {display: block;}
.highslide-display-none {display: none;}

.profclose {
	display: block;
	height: 15px;
	margin: 1em 0 2px 0;
	text-align: center;}

/* POPUP
---------------------------------------------*/

.imgctrl {
	position: relative;
	margin: 0 0 6px 0;}

.imgctrl a.highslide .over {
	display: none;
	height: 0;
	width: 0;}

.imgctrl a#thumb1 {
	display: block;
	left: 0; top: 0;
	width: 175px; height: 140px;
	text-decoration: none;}

.imgctrl a.highslide:hover .over {
	display: block;
	position: absolute;
	top: 0; left: 0;
	width: 175px;
	height: 140px;}

.over {
	filter: alpha(opacity=70);
	-moz-opacity:0.70;
	opacity:0.70;}

/* SIDEBAR
---------------------------------------------*/

#sideBar{
	position: absolute;
	width: auto;
	height: auto;
	z-index: 1200;
	top: 0;
	right:0;
	text-align:left;
	padding-top: 0;
}

#sideBarTab{
	float:left;
	height:173px;
	width:32px;
}

#sideBarTab img{
	border:0px solid #FFFFFF;
	cursor:pointer;
}

/* ここがサイドバーのサイズを指定している部分 */
#sideBarContents{
	float:left;
	overflow:hidden !important;
	width:715px;
	padding: 0 0 20px 0;
}

/* CONTACT
---------------------------------------------*/

#GB_overlay {
    background-color: #000;
    position: absolute;
    margin: auto;
    top: 0;
    left: 0;
    z-index: 2000;
}

#GB_window {
    left: 0;
    top: 0;
    position: absolute;
    overflow: visible;
    z-index: 2200;
    border:1px solid #fff;
}

#GB_window .content {
    width: auto;
    margin: 0;
    padding: 0;
    border-bottom: 1px solid #fff;
}

.GB_Window .content {
    background-color: #fff;
    border-top: none;
}

.GB_Window .header {
    color: #333;
    background-color: #fff;
}

.GB_Window .close { 
	text-align: right;
	padding: 5px 6px 9px 0;}

.GB_Window .close img { 
	width: 53px;
	height:13px;
	cursor: hand}


.GB_Window .close span { 
	font-size: 12px;
	font-weight: bold;
	color: #88b500;}

