@charset "utf-8";

/* 目次
---------------------------------------------------- */
/*

 1. base         (基本設定)
 2. Layout       (基本レイアウト枠)
 3. Header       (ヘッダ内要素)
 4. GlobalNavi   (グローバルナビゲーション内要素)
 5. Content      (サイト内枠)
 6. Main         (メインカラム内要素)
 7. Sub          (サブカラム内要素)
 8. Footer       (フッタ内要素)
 9. 汎用	

/*

/* ==================================================================================================
+01: CSS Reset
================================================================================================== */
html,body {width:100%;height:100%;}
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, p, th, td {margin:0;padding:0;}
h1, h2, h3, h4, h5, h6 {font-size:100%;font-weight:normal;}
ol, ul {list-style:none;}
img {margin:0;padding:0;vertical-align: bottom;border:0;}
address, em, strong {font-style:normal;font-weight:normal;}
strong {font-weight:bold;}
/* table */
table {border-collapse:separate;border-spacing:0;empty-cells: show;}
th {text-align:left;font-style:normal;font-weight:normal;}
/* scroll bar */
html {overflow-y: -moz-scrollbars-vertical;overflow-y: scroll;}

body {
	font-family: "メイリオ", meiryo,"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka,  "ＭＳ Ｐゴシック", sans-serif;
	background:#E4E4E4 url(../../images/header.gif) left top repeat-x;	
	text-align:center;
	color: #222;
	font-size:14px;
	}

/* link ------------------------------ */
a:link, 
a:visited,  
a:active {
	color: #000;
	text-decoration: underline;
	}
a:hover{text-decoration:none;}

a.img-over:hover img {
	-moz-opacity:0.6;
	opacity:0.6;
	filter: alpha(opacity=60);
	}
a.img-softover:hover img {
	-moz-opacity:0.8;
	opacity:0.8;
	filter: alpha(opacity=80);
	}
a.arrow{
	color:#001862;
	border:#001862 1px solid;
	border-radius:4px;
	padding:8px 8px 8px 35px;
	font-size:12px;
	font-weight:bold;
	background:url(../../projects/images/arrow_off.gif) 8px center no-repeat;
	text-decoration:none;
	margin-top:5px;
	display:inline-block;
	line-height:1;
}
a.arrow:hover{
	color:#fd870b;
	background-image:url(../../projects/images/arrow_on.gif);
	border-color:#fd870b;
	}

/* link-pdf */
.pdf{margin-left:0.5em;}
.pdf a{background: url(../../images/pdficon_small.gif) 0 0 no-repeat;padding-left:21px;}

/* Clearfix ------------------------------ */
.clearfix {clear:both;}
.clearfix:after {clear:both;content:".";display:block;height:0;visibility:hidden;overflow:hidden;}

/* text ------------------------------ */
.text{line-height:1.6;}

.red{color:#F00;}
.text10{font-size:10px;}
.text12{font-size:12px;}
.text14{font-size:14px;}
.text p{margin-top:1em;}

.pos-center{text-align:center;}

/* image ------------------------------ */
.img-right{
	float:right;
	margin:0 0 1em 2em;
	}
.img-right img{
	background-color:#FFFFFF;
	padding:1px;
	border:#CCC 1px solid;
	}
.text p.img-right{margin-top:0.25em;}
.text .one-results p.img-right{margin-top:1.25em;}

/* ==================================================================================================
+02: Layout
================================================================================================== */
#DocBody {
	width: 958px;
	margin: 0 auto;
	text-align: left;
	background-color:#FFF;
	}
#Contents {margin:10px 15px 0;}
#Main{float: left;width: 658px;padding-bottom: 20px;}
#Sub {float:right;width: 250px;padding-bottom: 20px;}

.half-left {float: left;width:454px;padding-bottom:10px;}
.half-right{float:right;width:454px;padding-bottom:10px;}
.feedtext{
	font-size:10px;
	text-align:right;
	}

#social-btn{margin-top:10px;}
#social-btn li{
	float:right;
	padding-right:10px;
	}

/* Header
---------------------------------------------------- */
#pagetop{
	position:relative;
	height:82px;
	padding:0 10px;
	}
#pagetop h1{
	color:#666;
	font-size:12px;
	padding:9px 0 5px;
	}
#pagetop p{
	position:absolute;
	top:12px;
	right:0px;
	}

/* navi
---------------------------------------------------- */
#nav li{float: left;}
#nav li a{
	width:160px;
	height:56px;
	display:block;
	background-image:url(../../images/nav.gif);
	text-indent:-99999px;
	overflow:hidden;
	}
#nav li.nav01 a{width:158px;}

.nav01 a{ background-position:   0px 0;}
.nav02 a{ background-position:-158px 0;}
.nav03 a{ background-position:-318px 0;}
.nav04 a{ background-position:-478px 0;}
.nav05 a{ background-position:-638px 0;}
.nav06 a{ background-position:-798px 0;}

.nav01 a:hover{ background-position:   0px -56px;}
.nav02 a:hover{ background-position:-158px -56px;}
.nav03 a:hover{ background-position:-318px -56px;}
.nav04 a:hover{ background-position:-478px -56px;}
.nav05 a:hover{ background-position:-638px -56px;}
.nav06 a:hover{ background-position:-798px -56px;}

#home     .nav01 a{ background-position:   0px -56px;}
#whats    .nav02 a{ background-position:-158px -56px;}
#projects .nav03 a{ background-position:-318px -56px;}
#news     .nav04 a{ background-position:-478px -56px;}
#about    .nav05 a{ background-position:-638px -56px;}
#consult  .nav06 a{ background-position:-798px -56px;}


/* breadcrumbslist
---------------------------------------------------- */
#breadcrumbslist{
	padding:5px 5px 10px;
	font-size:12px;
	}

/* pagetop
---------------------------------------------------- */
.pagetop{
	clear:both;
	text-align:right;
	padding-top:1em;
	}

/* Footer
---------------------------------------------------- */
#footer-nav{
	background:#001741 url(../../images/header.gif) 0% 85% repeat-x;
	text-align:center;
	padding:10px 0;
	}
#footer-nav a{color:#ccc;}
#footer-nav ul{
	width:530px;
	height:1em;
	margin:0 auto;
	background:url(../../images/nav_line.gif) right center no-repeat;
	}
#footer-nav li{
	float:left;
	font-size:11px;
	margin-right:10px;
	padding-left:10px;
	background:url(../../images/nav_line.gif) left center no-repeat;
	}
address{
	text-align: right;
	padding:10px;
	font-size:10px;
	color:#666666;
	}



/* Banner
---------------------------------------------------- */
#bnr li{
	width:250px;
	
}


/* ==================================================================================================
+03: Home
================================================================================================== */
/* NEWS
---------------------------------------------------- */
#NewsColumn{
	height:190px;
	overflow-y:scroll;
	}
#NewsColumn dl{
	background:url(../../images/line_top.jpg) center bottom repeat-x;
	padding:0 5px 5px;
	margin-top:5px;
	margin-right:10px;
	font-size:12px;
	}
#NewsColumn dt{
	float:left;
	width:55px;
	}
#NewsColumn dd{
	float:left;
	width:565px;
	}
	
/* Twitter */
.twtr-doc,
.twtr-timeline,
.twtr-popular{
	-moz-border-radius:0px!important;
	-webkit-border-radius:0px!important;
	border-radius:0px!important;
	}

/* ==================================================================================================
+04: Common Contents
================================================================================================== */
/* ページタイトル */
h3#PageTtl{
	background:url(../../images/ttl_bg.jpg) left top no-repeat;
	width:612px;
	height:33px;
	color:#FFFFFF;
	padding-top:15px;
	padding-left:50px;
	font-size:15px;
	margin-bottom:15px;
	}
#projects h3#PageTtl{margin-bottom:30px;}

/* リード文 */
#Main h4{
	background: url(../../images/gray_line.gif) center bottom no-repeat;
	margin-bottom:20px;
	padding-bottom:10px;
	}
#about   #Main h4{margin:0 5px 10px;}
#news    #Main h4,
#consult #Main h4.lead-text{
	font-size:18px;
	font-weight:bold;
	margin-bottom:30px;
	padding-bottom:10px;
	color:#333;
	margin-top:15px;
	}

/* 制作実績 */
.one-results{
	border-bottom:#ccc 2px solid;
	padding-bottom:40px;
	margin-bottom:40px;
	font-size:13px;
	}
.poster-pos{
	float:left;
	padding-right:20px;
	padding-top:1.5em;
	}
.results-title{
	float:left;
	}
.one-results h5{
	font-size:21px;
	font-weight:bold;
	color:#001862;
	line-height:1.2;
	}
.results-lead{
	font-size:16px;
	font-weight:bold;
	line-height:1.35;
	margin-top:0;
	padding-bottom:5px;
	}
.results-biling{
	line-height:1.5;
	font-size:13px;
	padding-left:0.25em;
	}
.results-biling strong{
	font-size:14px;
	font-weight: normal;
	color:#ff7200;
	line-height:1.35;
	}
.results-story{border-bottom:#ccc 1px dotted;}
.results-photo{
	width:560px;
	margin:15px auto 0;
	}
.results-photo li{
	float:left;
	padding:0 5px;
	}

/* マネジメント */
.photo{
	float:left;
	width:493px;
}
.thumb{
	float:right;
	width:140px;
}
.thumb li{
	margin-bottom:5px;
	cursor:pointer;
	-moz-opacity:0.25;
	opacity:0.25;
	filter: alpha(opacity=25);
	}
.thumb li.last-child{margin-bottom:0;}
.thumb li.now{
	-moz-opacity:1;
	opacity:1;
	filter: alpha(opacity=100);
}

.basic-profile{
	width:100%;
	border-collapse:collapse;
	border-top:#ccc 1px solid;
	margin-top:10px;
}
.basic-profile th,
.basic-profile td{
	padding:5px 10px;
	border-bottom:#ccc 1px solid;
	line-height:1.25;
	font-size:87%;
}
.basic-profile th{
	background:#f0f0f0;
	white-space:nowrap;
	width:60px;
	}

#management h5{
	background:#f0f0f0;
	padding:5px 10px;
	line-height:1.25;
	margin-top:20px;
	margin-bottom:10px;
	border-bottom:#ccc 1px solid;
}
#management h6{
	font-size:16px;
	font-weight:bold;
	margin:20px 0 10px;
	}
#management h6:before{content:"◎";}
#management em{color:#dd0011;}
.discography{
	width:100%;
	border-collapse:collapse;
	border-top:#ccc 1px solid;
}
.discography th,
.discography td{
	padding:5px 10px;
	border-bottom:#ccc 1px solid;
	line-height:1.5;
	font-size:87%;
}
.discography th{
	width:70px;
	vertical-align:top;
	}

.management-btn a{
	-moz-box-sizing: border-box;
	-webkit-box-sizing:border-box;
    box-sizing: border-box;
	
	width:100%;
	display:block;
	height:80px;
	line-height:80px;
	text-align:center;
	border-radius:6px;
	border:#204d9a 2px solid;

	color:#fff;
	margin-bottom:5px;
	text-decoration:none;
	font-weight:bold;
	
	background: -prefix-linear-gradient(top, #204d9a, #0d1e3e);
	background: linear-gradient(to bottom, #204d9a, #0d1e3e);
}
.management-btn li a span{	background: 15px center no-repeat; display:block;padding-left:40px;text-align:center;}
.management-btn li:nth-child(1) a span{background-image:url(../../projects/images/btn_mail.png);}
.management-btn li:nth-child(2) a span{background-image:url(../../projects/images/btn_profile.png);}
.management-btn a:hover{
	background: -prefix-linear-gradient(top, #0d1e3e, #204d9a);
	background: linear-gradient(to bottom, #0d1e3e, #204d9a);
}

/* ご相談フォーム */

#consult h5{
	font-size:16px;
	margin-top:20px;
	color:#001862;
	font-weight:bold;
	background:url(../../consult/images/arrow.gif) left center no-repeat;
	padding-left:50px;
	line-height:1.25;
}

#consult #Main ul{margin-top:1.5em;}
#consult #Main li{
	list-style-type:circle;
	margin-left:1.5em;
	list-style-position:outside;
}


/* ==================================================================================================
+05: About us Contents
================================================================================================== */
.table-list{
	width:100%;
	border-collapse:separate;
	border-spacing:5px;
	margin-bottom:20px;
	
	
	}
#contact .table-list{
	border-collapse: collapse;
	border-spacing:0px;
	}
.table-list th,
.table-list td{
	border:#CCCCCC 1px solid;
	padding:8px 10px;
	
	vertical-align:top;
	}
.table-list th{background-color:#f7f7f7; width:120px;}
.table-list td{}
.table-list input,
.table-list textarea{
	width:400px;
	padding:5px;
}
.table-list .telArea input{width:70px;}
.table-list td.form-btn{
	text-align:center;
	border:none;
	}
/* consult */
#consult .table-list th,
#consult .table-list td{padding:2px 10px;}
#consult .table-list input,
#consult .table-list textarea{padding:2px; font-size:12px;}

.form30{width:30%;}

.map{
	background-color:#FFFFFF;
	padding:1px;
	border:#CCC 1px solid;
	margin:1px auto 1em;
	width:624px;
}
.map-text{
	border:#CCCCCC 1px solid;
	padding:10px;
	margin:0 5px;
	font-size:13px;
}

/* タブ
---------------------------------------------------- */
#tab-list{margin-bottom:5px;}
#tab-list li{
	float: right;
	background:url(../../images/arrow.gif) left center no-repeat;
	padding-left:1.25em;
	font-size:12px;
}

/* ==================================================================================================
+08: NEWS
================================================================================================== */
	
#news #Main .ul-list li{
	border-bottom:#666 1px dotted;
	padding-bottom:5px;
	margin-bottom:5px;
	font-size:13px;
	}
#news #Main .ul-list li dt{
	float:left;
	width:120px;
	}
#news #Main .ul-list li dd{
	float:left;
	width:430px;
	}
#news #Main .ul-list li dd.category-name{
	width:105px;
	height:16px;
	margin-top:1px;
	}

/* 短編ワークショップ用 */
.form-table{
	width:100%;
	border-collapse:separate;
	border-spacing:5px;
	}
.form90{width:90%;}
.form-table th,
.form-table td{
	padding:5px;
	border:#bbb 1px solid;
	font-size:12px;
	line-height:1.25;
	}
.form-table th{background-color:#eee;}

/* ==================================================================================================
+10: Form
================================================================================================== */
input.error,
textarea.error{background-color:#ffdfdf;}
span.error{
	font-weight: bold;
	color:#FF0000;
	}





.products-list li{
	border-bottom:#CCC 1px dotted;
	padding-bottom:1.5em;
	margin-bottom:1.5em;
}
.products-list dt{
	float:left;
	width:100px;
	text-align:center;
	margin-right:20px;
}
.products-list dd{
	float:left;
	width:518px;
	font-size:13px;
	line-height:1.25;
}
.text .products-list dd p{margin-top:0.75em;}
.products-list dd a{
	background:url(../../images/arrow.gif) left center no-repeat;
	padding-left:1.5em;
}
.kakko{margin-left:-0.5em;}
.products-list dd h5{
	font-size:18px;
	font-weight:bold;
	color:#001862;
	line-height:1.2;
}