html{
	overflow-y:scroll;
}

#main {
	width : 864px;
	margin : auto;
	
}

#header
{
    position: fixed;            /* ヘッダーの固定 */
    top: 0px;                   /* 位置(上0px) */
    width: 864px;                /* 横幅100%　*/
    height: 83px;
    background-color:#202020;
}

#headerPortfolio
{
    position: fixed;            /* ヘッダーの固定 */
    top: 0px;                   /* 位置(上0px) */
    width: 864px;                /* 横幅100%　*/
    height: 115px;
    background-color:#202020;
}

.logo {
	font-family : arial,sans-serif;
	font-size : x-large;
	font-weight : bold;
	color : #444444; 
	padding : 0px 0px 0px 5px;
	margin : 0px 0px; 
	text-align: center;  /* 文章を左寄せする(※) */
	float: left; 
}

.maintitle {
	font-family : arial,sans-serif;
	font-size : x-large;
	font-weight : bold;
	color : #444444; 
	padding : 13px 2px 0px;
	margin : 0px 0px; 
	text-align: left;  /* 文章を左寄せする(※) */
	float: left; 
}


.mail {
	font-family : arial,sans-serif;
	font-size : 85%;
	font-weight : normal;
	color : #cdcdcd;
	padding : 30px 13px 0px;
	margin : 0px 0px; 
	text-align: right;  /* 文章を左寄せする(※) */
}

.mail img {
	padding : 0px 0px;
}


/*---------------------Menu-----------------------*/

.menu {
	clear:both;
	border-top : 2px solid #4c4c4c;
	font-family : arial,sans-serif;
	font-weight : bold;
	text-align : right;
	padding : 3px 10px ;
	margin : 0px 0px;
	border-bottom : 2px solid #4c4c4c;
}

.menu ul {
	display: inline; /* 横並びにさせる */
	padding-left:0px;
}

.menu li {
	padding: 0 3px;
	display: inline; /* 横並びにさせる */
	border-left: 1px solid #4c4c4c; /* 区切り線 */
}

.menu li:first-child {
	border: none; /* 親要素から見て一番目のli要素のボーダーを無しに */
}

/*---------------------Subtitles-----------------------*/

.boxSubtitle{
	width: 288px;
	margin: 0px ;
    padding: 3px 0px 3px 0px;
	font-family : arial ,sans-serif;
	color : #888888;
	font-size : 70%;
	font-weight : normal;
	text-align : center;
    float:left;
    border-bottom: 2px solid #4c4c4c;
}

.borderSubtitle {
    clear : both ;
	border-bottom: 2px solid #4c4c4c;
	padding: 0px 0px 0px 0px;
}

/*---------------------Contents-----------------------*/

.contents {
	clear : both ; 
	width : 864px ;
	padding : 65px 0px 0px;  
	text-align: center;
	*border-bottom : 2px solid #4c4c4c;*
}

.contentsPortfolio {
	clear : both ; 
	width : 864px ;
	padding : 102px 0px 0px;  
	text-align: center;
	*border-bottom : 2px solid #4c4c4c;*
}

.contents2 {
	clear : both ; 
	width : 864px ;
	padding : 0px 0px 0px;  
	text-align: center;
	border-top : 2px solid #4c4c4c;
}

.title {
	font-family : Yu Gothic ,sans-serif;
	color : #dbe2e8;
	font-size : 80%;
	font-weight : bold;
	text-align : center;
}

.subtitle {
	font-family : arial ,sans-serif;
	color : #888888;
	font-size : 70%;
	font-weight : normal;
	text-align : center;
	padding: 8px 0px 0px 0px;
}

.subtitlePort {
	font-family : arial ,sans-serif;
	color : #888888;
	font-size : 70%;
	font-weight : normal;
	text-align : center;
	padding: 3px 0px 0px 0px;
}

.text {
	font-family : arial ,sans-serif;
	color : #888888;
	font-size : 70%;
	font-weight : normal;
	text-align : center;
}

.thumbnail img {
	margin : 4px 4px;
}

.picture img {
	max-width: 864px;
	padding: 5px 0px 5px 0px;
	margin : 0px 0px;
}



.contents div.box2{
	width: 432px;
	margin: 0px ;
	font-family : arial,sans-serif;
	color : #AAAAAA;
	font-size : 100%;
	font-weight : normal;
	text-align : center;
	float:left;
}

.contents div.box3{
	width: 432px;
	margin: 0px ;
	font-family : arial,sans-serif;
	color : #AAAAAA;
	font-size : 100%;
	font-weight : normal;
	text-align : center;
}

.border {
	border-bottom: 1px solid #333333;
	margin: 20px 230px;
}



/*---------------------Copyright-----------------------*/

.copyright {
	clear:both;
	border-top : 2px solid #4c4c4c;
	font-family : arial,sans-serif;
	color : #585858;
	font-size : 80%;
	text-align : center;
	padding : 5px 10px;
}

/*-----------------------------------------------------*/
a {
	text-decoration : none;
}

a:link { color : #dbe2e8; }
a:visited { color : #dbe2e8; }
a:hover { color : #888888; }
a:active { color : #888888; }

p {
	color : #AAAAAA; 
}