@charset "utf-8";
/* CSS Document */

@media all {
body {
	padding:0px;
}
#mbox1 .fill {
	background-image:url(images/tengboo1.jpg)
}
#mbox2 .fill {
	background-image:url(images/bamboo1.jpg)
}
#mbox3 .fill {
	background-image:url(images/3i1.jpg)
}
#mbox4 .fill {
	background-image:url(images/interview2c.jpg)
}
/*main-pc*/
	
	
#main .wrap {
	max-width:1200px;
	margin: 0 auto;
}
#summary, #black, #red, #boring, #extras {
	overflow:auto;
	padding:25px 0px;
}
#header2 {
	text-align:center;
	overflow:visible;
}
#header2 .fill {
	height:180px;
}
#header2 .floater {
	display:inline;
	color:black;
	opacity:1;
	text-align:center;
	top: -75px;
	float:left;
}
#header2 h2 {
	background-color:white;
	display:inline;
	padding:10px 20px;
	color:red;
}
#header2 ul {
	display:inline;
	margin: 0 auto;
	overflow:auto;
	top: -50px;
	border-bottom:1px solid black;
	overflow:auto;
}
#header2 li {
	padding:0px 10px;
	display:inline;
}
#summary p {
	text-align:center;
}
#summary {
	margin: 0 auto;
	padding:20px 100px;
	top:-20px;
}
#red {
	background-color:#EF363E;
}
#red textarea {
	width:75%;
	height:100px;
}
#black ul, #black h2 {padding:25px 0px;}
.block img {
	padding:10px;
}
.block:text {
color:white;
}
.block {
	float:left;
	color:white;
	padding:0px 25px;
}
.block li {
	float:left;
	padding-bottom:10px;
}
#boring {
	padding:30px 25px;
}

#boring p {margin:20px 0px;}
#bulleted {
	padding-top:10px;
	overflow:auto;
}
#extras {
	overflow:auto;
	background:url(graphics/mm_hatchbg.png) repeat;
}
#extras ul {
	padding:20px;
	margin:10px;
	background-color:white;

}
#extras li, #extras p {
	padding:5px 0px;
}
.contactbox li {
	padding:4px 0px;
}
#extras li:first-child {
	border-bottom:1px dotted red;
}
#extras textarea, #extras input {
	display:block;
	margin-bottom:10px;
	padding:2px;
	width:100%;
	background-color: #EEE;
	border:1px solid gray;
}
#extras .button {
	cursor:pointer;
	display:block;
	width:50px;
	height:25px;
	background-color:#000000;
	color:white;
	border:none;
	box-shadow:1px 1px 0px #CCCCCC;
}
#extras .button:hover {
	box-shadow:2px 2px 0px #CCCCCC;
	left:-1px;
	top:-1px;
}

.clear {width:100%; text-align:center; clear:both;  padding-top:25px;}

#black .clear {color:#FFF;}
}

#black {
	color:#FFF;
	background-color:black;
}
 @media (max-width: 850px ) {
html, body, #container, #main {
	height:auto;
}
#header2 li {
	display:block;
	width:100%;
}
h3 {
	text-align:center;
	width:100%;
}
/*main-pc*/
#summary {
	padding:20px 20px;
}

#main > div {
	text-align:center;
}
#black .block {
	border-bottom:10px solid white;
	padding:25px 10px;
	background-color:black;
}
}
 @media (min-width: 850px) {
/*main-pc*/
#header2 li:hover {
	border-bottom:2px solid red;
}
#main h3 {
	text-align:left;
}
#header2 .focus {
	border-bottom:2px solid red;
}

.bulleted li {
	background-image:url(graphics/g_bullet.png);
	background-repeat:no-repeat;
	background-position:0px 5px;
	padding-left:20px;
}
#extras ul {
	width:31%;
	float:left;
		min-height:270px;
}
#mbox1:hover .fill {
	background-image:url(images/tengboo1c.jpg)
}
#mbox2:hover .fill {
	background-image:url(images/bamboo1c.jpg)
}
#mbox3:hover .fill {
	background-image:url(images/3i1c.jpg)
}
#mbox4:hover .fill {
	background-image:url(images/interview2.jpg);
}
}