@charset "utf-8";

/* リセット */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	vertical-align: baseline;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}

html{
    overflow-y: scroll;
}

blockquote, q {
	quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

input, textarea,{
	margin: 0;
	padding: 0;
}

ol, ul{
    list-style:none;
}

table{
    border-collapse: collapse; 
    border-spacing:0;
}

caption, th{
    text-align: left;
}

a:focus {
	outline:none;
}

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

.clearfix {
	min-height: 1px;
}

* html .clearfix {
	height: 1px;
}

/* 基本設定 */
body {
width:100%;
font-size:12px;
color:#161616;
text-align:center;
font-family:"ヒラギノ角ゴ Pro W3",sans-serif;
line-height:170%;
}

.clear{
clear:both;
}

ul{
list-style:none;
}

/* リンク設定 */
a {color:#161616;text-decoration:none;}
a:link {color:#161616;text-decoration:none;}
a:visited {color:#161616;text-decoration:none;}
a:hover {color:#7FD4BC;text-decoration:none;}
a:active {color:#161616;text-decoration:none;}


/*ヘッダー（上部）*/
#wrappers {
width:100%;
margin:0 auto 30px;
border-bottom:1px #7A7C7F solid;
}

#topbana {
width:100%;
font-size:10px;
font-family: Helvetica;
letter-spacing: 0.1em;
text-align:right;
padding:3px 0;
background-color: #161616;
}

#topbana a         {color:#FFFFFF; text-decoration:none;}
#topbana a:link    {color:#FFFFFF; text-decoration:none;}
#topbana a:visited {color:#FFFFFF; text-decoration:none;}
#topbana a:active  {color:#FFFFFF; text-decoration:none;}
#topbana a:hover   {color:#a9a9a9; text-decoration:none;}

.menu_title {
padding:0px 30px 0px 0px;
}


/*ヘッダー */
#headers{
width:900px;
height:45px;
margin:50px auto 20px auto;
position:relative;
}

#logos{
float:left;
}

#topmenu{
float:right;
}

#topmenu ul{
list-style:none;
font-weight:bold;
font-family: Helvetica;
font-size:18px;
line-height:16px;
position:absolute;
bottom:0;
right:0;
}

#topmenu li{
float:right;
border-right:#666666 1px solid;
}

#topmenu li:nth-child(1){
padding:0 0px 0 10px;
border-right:none;
}

#topmenu li:nth-child(2),
#topmenu li:nth-child(3),
#topmenu li:nth-child(4),
#topmenu li:nth-child(5),
#topmenu li:nth-child(6){
padding:0 10px 0 10px;
}

#topmenu li h2 span{
font-weight:normal;
padding:0 0 0 10px;
color:#D5D5D5;
}

#topmenu h1{
text-align:right;
font-weight:normal;
font-size:12px;
}

/*メイン */
#webmain{
width:900px;
margin:0 auto;
overflow:hidden;
}

/*サイドメニュー（左） */
#example {
position:relative;
width:170px;
text-align:left;
font-size:12px;
float:left;
}

#example ul {
list-style:none;
}

#example ul li a {
color: #161616;
font-size: 12px;
font-weight:normal;
background: url("../img/share/kazari/category_kazari01.gif") no-repeat; display: block;
margin: 0;
padding: 4px 0 0 17px;
width: 153px;
height: 26px;
}

#example ul li a:hover {
color: #7FD4BC;
text-decoration: none;
background: url("../img/share/kazari/category_kazari02.gif") no-repeat;
}

#example p {
font-size:10px;
line-height:170%;
text-align:justify;
color:#161616;
margin:20px 0px 20px 0px;
list-style:none;
}

#example ul {
font-size:10px;
line-height:170%;
margin-top:10px;
}

#example ul li h2{
font-weight:normal;
}

#example img {
	margin:20px 0px 0px 30px;
}	

.examplebana a:hover{
text-decoration:none;
}

.examplebana a:hover img{
opacity:0.7;
filter:alpha(opacity=50);
-ms-filter:"alpha( opacity=50 )";
}

/*ピックアップ（右） */
#pickup_img {
width:692px;
float:right;
}

/*インフォメーション（右） */
#infomations{
width:692px;
float:right;
}

.newstitle {
width:682px;
font-size:12px;
padding:5px 0px 5px 10px;
margin:30px 0px 0px 0px;
text-align:left;
color:#FFFFFF;
background-color: #161616;
}

.infobox {
width:650px;
height:100px;
font-size:11px;
text-align:left;
overflow:auto;
background:#F3EEEC;
padding:20px 20px 30px 20px;
border-bottom:1px #161616 solid;
}

.infobox h2 {
font-size:11px;
font-weight:bold;
}

.infobox p {
padding:5px 0 10px 0;
margin-bottom:20px;
border-bottom:1px dotted;
}



/*カテゴリ（右） */
#categorytitle {
float:right;
width:682px;
font-size:12px;
padding:5px 0px 5px 10px;
margin:30px 0px 30px 0px;
text-align:left;
color:#FFFFFF;
background-color: #161616;
}

#grid-bace{
float:right;
width:690px;
margin-top:20px;
text-align:left;
}

#grid-graphshop{
clear:both;
}

.grid {
width:200px;
font-size:10px;
background:#F3EEEC;
margin: 10px 5px 10px 5px;
padding:10px;
border-radius: 5px;
color: #7A7C7F;
}

.grid h2 {
font-size:10px;
font-weight:normal;
}

.grid p{
margin:0;
padding:0;
line-height:200%;
}

.grid a:hover img{
opacity:0.7;
filter:alpha(opacity=50);
-ms-filter:"alpha( opacity=50 )";
}

/*ページトップ */
#pagetop {
clear:both;
text-align:right;
font-size:12px;
text-decoration:none;
color:#161616;
padding:30px 0px 20px 0px;
}

#pagetop a:hover{
text-decoration:none;
color:#7FD4BC;
}

/*フッター */
#sitemaps_body {
width:100%;
border-top: 1px solid #7A7C7F;
background-color:#f3eeec;
overflow:hidden;
}

#sitemaps {
width:900px;
margin:50px auto;
overflow:hidden;
}

.sitemapsbox {
width:200px;
float: left;
text-align:left;    
font-size:10px;
margin:0px 25px 30px 0px;
}

.sitemapsbox p{
min-height:50px;
}

.sitemapsbox h3 {
border-bottom: 1px dotted;
padding-bottom:5px;
font-size:13px;
font-weight:bold;
}

.sitemapsbox p {
padding:10px 0;
}

#sitemapsbox2 {
clear:both;
width:900px;
text-align:left;    
font-size:10px;
margin:0px 25px 30px 0px;
}

#sitemapsbox2 h3 {
border-bottom: 1px dotted;
padding-bottom:5px;
font-size:13px;
font-weight:bold;
}

#sitemapsbox2 p {
padding:10px 0;
}

#sitemapsbox2 ul {
float:left;
margin-right:20px;
}


#footersbody {
width:100%;
background-color:#161616;
}

#footers{
width:900px;
padding:20px 0 50px 0;
margin:0 auto;
font-size:10px;
overflow:hidden;
}

#footers p{
float:left;
line-height:180%;
letter-spacing:1px;
font-size:10px;
text-align:left;
color:#FFFFFF;
}

#footers span{
float:right;
}

/*各ページ基本設定*/
#entrys {
float:right;
width:692px;
text-align:left;
}

#entrys h2 {
width:682px;
font-size:12px;
padding:5px 0px 5px 10px;
margin:0px 0px 30px 0px;
text-align:left;
font-weight:normal;
color:#FFFFFF;
background-color: #161616;
}

#entrys h3 {
font-size:10px;
color:#7A7C7F;
margin:20px 0px 0px 0px;	
}

#entrys h4 {
font-size:17px;
color:#3E3B3B;
font-weight:bold;
margin:10px 0px 50px 0px;	
}

#entrys span img{
width:686px;
padding:2px;
border:1px solid #D1D1D1;
}

/*about*/

#entrysleft{
float:left;
width:295px;
font-size:10px;
padding:20px;
background-color:#F3EEEC;
}

#entrysleft ul{
border-top:1px #2C2C2D dotted;
padding-top:20px;
padding-bottom:20px;
}

.title{
font-weight:bold;
}

.title2{
padding-top:20px;
border-top:1px #2C2C2D dotted;
font-weight:bold;
}

#entrysright{
float:right;
width:295px;
font-size:10px;
padding:20px;
background-color:#F3EEEC;
}

/*PLAY*/
.play{
width:692px;
font-size:10px;
color:#3E3B3B;
padding:0 0 20px 0;
border-bottom:1px dotted #D1D1D1;
}

#playtitle{
clear:both;
width:687px;
margin-top:50px;
border-left:5px #008080 solid;
}

#playtitle h3{
font-size:25px;
font-family:"Courier New";
color:#008080;
padding:0 0 0 10px;
font-weight:normal;
}

#playtitle p{
font-size:10px;
color:#008080;
padding:0 0 0 10px;
}

#playdownload{
width:647px;
padding:20px;
}

#playdownload li{
float:left;
margin-right:20px;
}

#playdownload .imgpc{
width:140px;
}

#playdownload .imgmob{
margin-top:20px;
}

#playdownload a{
text-align:center;
display:block;
}

#playdownload p{
clear:both;
font-size:10px;
color:#3E3B3B;
padding-top:30px;
}

#playbox{
clear:both;
width:687px;
overflow:hidden;
}

.playleft{
float:left;
width:500px;
}

.playright{
float:right;
text-align:center;
width:187px;
}

.playright span{
text-align:center;
display:block;
}

#playbox2{
clear:both;
width:647px;
padding:20px;
overflow:hidden;
}

.playleft2 .screensaver{
width:200px;
}

.playleft2{
float:left;
}

.playleft2 a{
display:block;
text-align:center;
}

.playright2{
float:right;
font-size:10px;
color:#3E3B3B;
}

/*design works*/
.designworks{
width:692px;
color:#3E3B3B;
padding:0 0 20px 0;
border-bottom:1px dotted #D1D1D1;
}

#workstitle{
clear:both;
margin:30px 0px 20px 0px;
background-color:#a9a9a9;
}

#workstitle h3{
font-size:13px;
padding:5px 0 5px 8px;
font-weight:bold;
color:#FFFFFF;
}

#workstitle h4{
font-size:13px;
}

#worksbox{
width:692px;
overflow:hidden;
}

.worksbox_left{
float:left;
}

.worksbox_right{
float:right;
}

#worksboxmain{
width:692px;
overflow:hidden;
}

#worksbox2{
float:left;
width:300px;
margin-right:30px;
}

.worksbox2title{
font-weight:bold;
padding:5px 0;
margin-bottom:10px;
border-bottom: 1px dotted;
}

#worksbox3{
float:left;
width:200px;
margin-right:30px;
min-height:300px;
position:relative;
}

#worksbox4{
float:left;
width:200px;
margin-right:30px;
min-height:180px;
}

.p1{
font-size:10px;
position:absolute;
top:170px;
}

.worksbox3title{
font-weight:bold;
padding:5px 0;
margin-bottom:10px;
border-bottom: 1px dotted;
}

#licenseetitle{
clear:both;
margin:30px 0px 20px 0px;
background-color:#ff9900;
border-left:10px #FFFF00 solid;
}

#licenseetitle h3{
font-size:13px;
padding:5px 0 5px 8px;
font-weight:bold;
color:#FFFFFF;
}

#licenseebox{
width:692px;
overflow:hidden;
}

.licensee_left{
float:left;
width:300px;
}

.licensee_right{
float:right;
width:360px;
}

.licensee_left2{
float:left;
margin-bottom:30px;
}

.licensee_right2{
width:450px;
float:right;
font-size:10px;
}

.licensee_box{
width:692px;
margin-bottom:30px;
}

.licensee_title{
font-weight:bold;
color:#e38300;
margin-bottom:10px;
}

/*コラボレーション*/
#navigation {
float:right;
width:682px;
background-color:#F3EEEC;
padding:5px 0px 5px 10px;
margin:0px 0px 30px 0px;
}

li.navi_right{
float:right;
font-size:13px;
letter-spacing: 0.5em;
padding-right:10px;
}

li.navi_left{
float:left;
font-size:13px;
letter-spacing: 0.5em;
padding-left:10px;
}

/*作品*/
.collabos{
width:692px;
font-size:10px;
color:#3E3B3B;
padding:0 0 20px 0;
}

#collabosbox{
width:692px;
overflow:hidden;
}

.collabosbox_left{
float:left;
}

.collabosbox_right{
width:300px;
float:right;
}

.collabosbox_right2{
width:350px;
float:right;
}

.collabosbox_left span{
font-size:10px;
display:block;
}

.collabosbox_right dt{
font-weight:bold;
}

.collabosbox_right dd{
margin-bottom:15px;
}

#collabosbox_min{
width:300px;
margin-top:20px;
float:right;
overflow:hidden;
}

.collabosbox_minleft{
float:left;
}

.collabosbox_minright{
width:130px;
line-height:150%;
float:right;
font-size:10px;
}

#collabosbox_min2{
width:350px;
margin-top:20px;
float:right;
overflow:hidden;
}

.collabosbox_minleft2{
float:left;
}

.collabosbox_minright2{
line-height:150%;
float:right;
font-size:10px;
}

.collabosbox_minright2 li{
float:left;
font-size:10px;
margin-bottom:10px;
margin-right:10px;
}


.soxbox{
float:right;
display:table;
width:350px;
margin-bottom:10px;
}
	
.soxbox ul{
display:table-row;
}
	
.soxbox ul li{
display:table-cell;
}		

/*----------------------------------------------------------------------------------------------------------------作業 */
/*----------------------------------------------------------------------------------------------------------------作業 */
/*----------------------------------------------------------------------------------------------------------------作業 */