@charset "UTF-8";
/*==================================================
-- : Home
================================================== */

#home{
	color:#fff;
}
#home #wrapper{
	width:980px;
	height:768px;
	position:absolute;
	top:50%;
	left:50%;
	margin:-384px 0 0 -490px;
}

#home #wrapper img.bgmaximage{
	position:absolute;
	z-index:0;
}

#home #homeCont{
	position:relative;
	z-index:7;
	line-height:1.7;
	margin:58px 0 0 40px;
	width:272px;
}
#home #homeCont h1{
	height:77px;
	background:url(../images/logo.png) 0 0 no-repeat;
	text-indent:-9999px;
	border-bottom:1px solid #fff;
}

#home #homeCont div#text{
	padding:70px 0;
}
#home #homeCont p{
	margin:1em 0;
}
#home #homeCont .socialMedia ul{
	padding:20px 0 0 0;
}
#home #homeCont .socialMedia ul li{
	width:100px;
	float:left;
	display:inline;
}



#home #gnavi{
	border-bottom:1px solid #ffffff;
}
#home #gnavi li{
	width:auto;
}
#home #gnavi li#gnaviAbout a{background:url(../images/home_nav_about.png) 0 0 no-repeat;}
#home #gnavi li#gnaviInformation a{background:url(../images/home_nav_info.png) 0 0 no-repeat;}
#home #gnavi li#gnaviProduct a{background:url(../images/home_nav_product.png) 0 0 no-repeat;}
#home #gnavi li#gnaviWorks a{background:url(../images/home_nav_works.png) 0 0 no-repeat;}
#home #gnavi li#gnaviKatte a{background:url(../images/home_nav_katte.png) 0 0 no-repeat;}
#home #gnavi li#gnaviProfile a{background:url(../images/home_nav_profile.png) 0 0 no-repeat;}
#home #gnavi li#gnaviBlog a{background:url(../images/home_nav_blog.png) 0 0 no-repeat;}
#home #gnavi li#gnaviMail a{background:url(../images/home_nav_mail.png) 0 0 no-repeat;}


#home #homeItem{
	position:absolute;
	bottom:70px;
	left:40px;
	border-left:3px solid #fff;
}
#home #homeItem dt{
	border-bottom:1px solid #fff;
	padding:3px 0 3px 10px;
}
#home #homeItem dd{
	padding:3px 0 3px 10px;
}

/*==================================================
-- : About
================================================== */

#about #alpha .inner{
	margin:0 0 0 160px;
}
#about #alpha p{
	font-size:93%;
}
#about #alpha p#ja{
	line-height:3;
	padding:53px 0 48px;
}
#about #alpha p#en{
	line-height:1.9;
}
/*==================================================
-- : Information
================================================== */

#information #alpha{
	background:#EEEEEF;
}
#information #alpha .inner{
	background:#fff;
	margin-left:30px;
	padding-left:25px;
}
#information #infoList{
	padding:30px 0 0;
}
#information #infoList li{
	border-bottom:double 4px #595959;
	padding:20px 0 40px;
}
#information #infoList li .title,
#information #infoList li .image,
#information #infoList li .body{
	float:left;
	display:inline;
}
#information #infoList li .title{
	width:180px;
}
#information #infoList li .title span{
	display:block;
}
#information #infoList li .title span.entryDate{
	font-size:85%;
	line-height:1.6;
	padding:0 0 2px;
}
#information #infoList li .title span.entryTitle{
	font-size:93%;
	line-height:1.6;
}


#information #infoList li .image{
	width:270px;
	margin:0 20px;
}
#information #infoList li .image img{
	width:270px;
	height:270px;
}
#information #infoList li .body{
	width:200px;
}
#information #infoList li .body p{
	font-size:77%;
	line-height:1.6;
	margin:0 0 16px;
}
#information #infoList li .body div.socialBtn div.tw{
	float:left;
	display:inline;
}

/*==================================================
-- : リストページ共通
================================================== */

.list #alpha{
	width:555px;
}
.list #beta{
	width:345px;
}
.list #alpha p{
	text-align:right;
	padding:15px 0 35px;
}
.list #alpha ul li{
	float:left;
	display:inline;
	margin:0 0 35px 35px;
}
/*==================================================
-- : 詳細ページ共通
================================================== */
.detail #alpha{
	width:710px;
}

.detail #alpha #contentsTit{
	margin:35px 0 0 35px;
}
.detail #alpha #contentsTit img{
	border-bottom:1px solid #595959;
}
.detail #alpha #contentsMenu{
	margin:20px 0 0 35px;
}
.detail #alpha #contentsMenu ul li{
	float:left;
	display:inline;
	margin-right:20px;
}




.detail #alpha #thumbnailList{
	padding:35px 0;
	position:relative;
	margin:0 0 0 35px;
}
.detail #alpha #slider div.thumbnail{
	float:left;
	display:inline;
	margin:0 30px 30px 0;
}
.detail #alpha #slider div.thumbnail:nth-child(9){
	margin-right:0;
}


.detail #alpha #contents {
	padding:0 0 35px 10px;
}
.detail #alpha #contents #leftArw,
.detail #alpha #contents #rightArw,
.detail #alpha #contents #body{
	vertical-align:middle;
	display:table-cell;
}
.detail #alpha #contents #leftArw,
.detail #alpha #contents #rightArw{
	width:30px;
	max-height:645px;
}
.detail #alpha #contents #leftArw a,
.detail #alpha #contents #rightArw a{
	display:block;
	padding-top:5px;
	padding-bottom:5px;
}
.detail #alpha #contents #leftArw a{
	padding-right:18px;
}
.detail #alpha #contents #rightArw a{
	padding-left:18px;
}
.detail #alpha #contents #body{
	width:645px;
}
.detail #alpha #contents #body #image{
	text-align:center;
	margin:0 0 30px;
}
.detail #alpha #contents #body #image img{
	max-width:645px;
	max-height:645px;
}

.detail #alpha #contents #body #info{
	position:relative;
	margin-bottom:30px;
}
.detail #alpha #contents #body #info span#year{
	font-size:108%;
}
.detail #alpha #contents #body #info h1{
	font-size:108%;
	padding:6px 0 14px;
}

.detail #alpha #contents #body #info p{
	font-size:93%;	
}

.detail #alpha #contents #body #info ul#entrySocialBtn{
	position:absolute;
	top:0;
	right:0;
}
.detail #alpha #contents #body #info ul#entrySocialBtn li{
	float:left;
	display:inline;
	margin-left:5px;
}
.detail #alpha #contents #body #info ul#entrySocialBtn li.fb{
	width:76px;
}
/*==================================================
-- : Product
================================================== */
/*==================================================
-- : Works
================================================== */
#works.list #alpha p{
	padding:20px 0;
	border-bottom:1px solid #595959;
	margin-left:35px;
}
#works.list #alpha ul{
	padding:35px 0 0 0;
}
#works.detail #alpha #contentsMenu p{
	padding:10px 0 0 280px;
}
#works.detail #alpha #contentsMenu p span{
	float:left;
	margin-right:40px;
}

/*==================================================
-- : 勝手にSeries
================================================== */
#katte_series.list #alpha p{
	padding:35px 0 50px;
	margin-left:-60px;
	text-align:left;
}

/*==================================================
-- : Profile
================================================== */

#profile #alpha .inner{
	margin:53px 0 0 160px;
}
#profile #alpha #ja,
#profile #alpha #en{
	padding:0 0 60px;
}

#profile #alpha h1,
#profile #alpha h2{
	font-size:108%;
	padding:0 0 30px 0;
}
#profile #alpha dt,
#profile #alpha dd{
	font-size:93%;
	line-height:2;
	float:left;
	display:inline;
}
#profile #alpha dt{
	clear:left;
	padding-right:20px;
}
#profile #alpha p{
	font-size:93%;
	line-height:2;
}
#profile #alpha #en p{
	padding:0 0 20px;
}
/*==================================================
-- : Blog
================================================== */





#blog #alpha{
	float:left;
	width:500px;
	padding:30px 0;
}
#blog #alpha .inner{
	border-right:2px dotted #999;
	border-left:2px dotted #999;
	padding:0 33px;
}

#blog #alpha .entry{
	border-bottom:2px dotted #999;
	padding:35px 0 10px;
	margin:0 0 25px 0;
}
#blog #alpha .entry .date{
	letter-spacing:4px;
	font-size:77%;
	line-height:1.8;
}
#blog #alpha .entry .title{
	font-size:108%;
	letter-spacing:1px;
	line-height:1.6;
	padding:12px 0 30px;
}
#blog #alpha .body{
	font-size:77%;
	line-height:1.8;
}
#blog #alpha .body img{
	max-width:330px;
}

#blog #gamma{
	width:220px;
	float:right;
}
#blog #gamma .blogModule{
	padding:25px 0;
}

#blog #gamma .blogModule dt,
#blog #gamma .blogModule dd{
	font-size:77%;
}
#blog #gamma .blogModule dt{
	letter-spacing:4px;
	padding:0 0 15px;
}
#blog #gamma .blogModule dd li{
	line-height:1.6;
	padding:0 0 4px;
}

#blog #gamma #blogProf,
#blog #gamma #recentEntry,
#blog #gamma #blogArchive{
	border-bottom:2px dotted #999;
}

#blog #gamma #blogProf{
	padding-top:65px;
	line-height:1.8;
}






/*==================================================
-- : Mail
================================================== */
/*--------------------------------------------------------------エラー*/
#mail #alpha{
	width:665px;
	margin-top:34px;
	margin-bottom:34px;
}
#mail #alpha .inner{
	background:url(/common/images/mail_img.jpg) 0 0 no-repeat;
	height:500px;
}
#mail #alpha .inner #mail_form_container{
	padding:30px 0 0 250px;
}
#mail #alpha .inner dl dt{
/*	font-family:Georgia;*/
	width:105px;
	float:left;
	padding:3px 0;
	margin-bottom:8px;
}
#mail #alpha .inner dl dt span.req{
	color:#cc3a3b;
} 
#mail #alpha .inner dl dd{
	width:260px;
	float:left;
	margin-bottom:8px;
}
#mail #alpha .inner dl dd input,
#mail #alpha .inner dl dd textarea{
	border:1px solid #ccc;
	width:260px;
	padding:2px;
}
#mail #alpha .inner dl dd input{
	font-size:93%;
	line-height:1.5;
}
#mail #alpha .inner dl dd textarea{
	min-height:60px;
	font-size:93%;
	line-height:1.5;
}
#mail #alpha .inner p#mail-form-footer{
	padding:10px 0 0 105px;
}
#mail #alpha .inner p#mail-form-footer input#mail_post{
	width:80px;
	height:25px;
	border:0;
	text-indent:-9999px;
	background:url(/common/images/mail_btn.gif) 0 0 no-repeat;
	cursor:pointer;
}
/*--------------------------------------------------------------エラー*/
#mail #alpha #errorMsg{
	margin:34px 0 0 250px;
	font-size:93%;
	line-height:1.5;
}
#mail #alpha #errorMsg p{
	padding:0 0 10px;
}
#mail #alpha #errorMsg blockquote{
	color:#cc3a3b;
	border-left:2px solid #cc3a3b;
	padding-left:10px;
}

/*------------------------------------------------------------送信完了*/
#mail #alpha #compMsg{
	margin:34px 0 0 250px;
	font-size:93%;
	line-height:1.5;
}



/*
10px → font-size:77%;
11px → font-size:85%;
12px → font-size:93%;
13px → font-size:100%;
14px → font-size:108%;
15px → font-size:116%;
16px → font-size:123.1%;
17px → font-size:131%;
18px → font-size:138.5%;
19px → font-size:146.5%;
20px → font-size:153.9%;
21px → font-size:161.6%;
22px → font-size:167%;
23px → font-size:174%;
24px → font-size:182%;
25px → font-size:189%;
26px → font-size:197%;
*/