/*------------------------------------------------------------------------------------------------ html tag */

body{font-family:Myriad, Verdana, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; line-height:1.44em; margin:0;color:#666;}
a{color:#000; text-decoration:none; outline:none;}
a:hover{color:#cc9; text-decoration:underline;}
a.active{color:#cc9; text-decoration:underline;}
table, td, th{border-color:#ccc;}
h3{border-bottom:1px dotted #ccc;}
label{font-weight:bold; text-transform:uppercase; color:#666;}
input, textarea{width:98%; border:1px solid #ccc; padding:3px; background-color:#fff; -moz-border-radius:3px; -webkit-border-radius:3px;}
input:hover, textarea:hover{border-color:#666;}
input:focus, textarea:focus{border:1px solid #ee0; background:#ffe; color:#333;}
input[type=button]{width:30%;}
noscript{color:#c00;}

/*------------------------------------------------------------------------------------------------ for id */

#wrap{padding:40px 20px; margin:auto; max-width:1100px; font-size:85%;}
#header, #footer{clear:both; float:left; position:relative; width:100%;}
#footer{font-size:9px;}
#header-inner, #footer-inner, .breadcrumbs{width:96%; padding:2em 0; position:relative; left:2%;}
#site-seal{float:left;}
#logo{font-size:150%; font-weight:normal; line-height:1; margin:0; padding:0; text-transform:uppercase; font-family:'Lucida Grande',Helvetica,sans-serif;}

#description{font-size:9px; font-weight:normal; line-height:1; margin:.5em 0; padding:0; display:block;}


.navi{float:right; margin:5px 0 0 50px;}
.navi li, #sidenavi li{list-style:none; margin:0;}
.navi li{float:left;}

.navi li{margin-left:2em;}
.navi a{display:block; line-height:1; text-transform:uppercase; margin:0 1px 1px 0; text-align:center; color:#000;}
.navi a:hover, .navi a.active{color:#cc9; text-decoration:underline;}




#sidenavi{margin:0 0 3em 0;}
#sidenavi li{width:100%;}
#sidenavi a{display:block; line-height:1; margin:0 0 1px 0; padding:1em; text-transform:uppercase; -moz-border-radius:3px; -webkit-border-radius:3px;}
#sidenavi li ul{margin:0;}
#sidenavi a{background-color:#000; color:#fff;}
#sidenavi a:hover,
#sidenavi li.active a{background:#eee; color:#666; text-shadow: 1px 1px 0px #fff;}



#mainImg{text-align:center; clear:both; width:100%; height:400px; overflow:hidden; margin:0 auto 2em; position:relative;}
#mainImg img{display:block; margin:auto;}
#mainImg .widget{position:absolute; top:10px; right:10px; width:30%; padding:0 15px; text-align:left; background:url(img/50.png); -moz-border-radius:7px; -webkit-border-radius:7px;}
#mainImg .widget h3{margin-top:1em;}



#copy{float:right; font-weight:normal; font-size:9px;}

#main h3{margin:2em 0 1em; font-weight:normal; color:#000;}

#newsBox{width:100%; margin:0 auto;}
#newsBox a{display:block; color:#fff; line-height:30px;}
#newsBox h3{float:left; width:13%; border:none; text-align:center; background:#222; color:#fff; margin:0; line-height:30px; -moz-border-radius-topleft:5px; -moz-border-radius-bottomleft:5px; -webkit-border-top-left-radius:5px; -webkit-border-bottom-left-radius:5px;}
#newsBox #newsW{float:left; width:87%; margin:0; background:#444; overflow:hidden; -moz-border-radius-topright:5px; -moz-border-radius-bottomright:5px; -webkit-border-top-right-radius:5px; -webkit-border-bottom-right-radius:5px;}
#newsBox ul{margin:0;}
#newsBox #slideCase li{list-style:none; padding:0 1.5em;}

/*------------------------------------------------------------------------------------------------ class */

.L{float:left; margin:0 1.5em 1em 0;}
.R{float:right; margin:0 0 1em 1.5em;}
.C{clear:both; text-align:center; margin:0 0 1em 0;}
.inner{padding:1em;}
.clear{clear:both;}
#main h1,
.catch{font-size:250%; line-height:1.1; color:#ccc; margin:0 0 .8em 0; font-weight:normal;}

.thumb{}
.thumb a{display:inline-block; border-top:1px solid #eee; border-left:1px solid #ccc; border-right:1px solid #999; border-bottom:1px solid #888; padding:5px; background:#fff;}
.thumb a:hover{border-color:#cc9;}
.thumb a img{display:block;}
.hyde{display:none;}

.content ul li{list-style:circle;}

.tb-dl{margin:1.5em 0 2em;}
.tb-dl dt{float:left; width:18%; margin:0 0 1em; clear:both;}
.tb-dl dd{margin:0 0 1em 20%;}

.breadcrumbs{border:1px solid #ccc; margin:2em 0; padding:0; background:#fff; -moz-border-radius:5px; -webkit-border-radius:5px;}
.breadcrumbs a,
.breadcrumbs span{float:left; padding:.5em 0 .5em 1em;}
.breadcrumbs .separator{padding:0.5em 1.2em 0.5em 0; background:url(img/separator.png) center right no-repeat; text-indent:-9999px;}
.breadcrumbs a.pageTop{float:right; padding:0.5em 1em;}

.container{margin-bottom:5em; width:100%;}
.entry-body{margin-bottom:1em;}
.entry-more{clear:both;}
.entry-more-link{text-align:right;}

.trackbacks-header, .comments-open-header, .comments-header{line-height:2em; border-bottom:1px solid;}
.trackbacks-info{float:right; text-align:right; width:200px; font-size:9px; font-weight:normal; text-transform:lowercase;}
.trackbacks-info input{width:100px;}
.trackbacks-content, .comments-content{padding-bottom:20px; position:relative; float:left; width:100%;}
.trackback, .comment{margin-bottom:10px; position:relative; width:100%; float:left;}
.trackback .inner, .comment .inner{border:2px dotted #ccc; background:#eee; -moz-border-radius:5px; -webkit-border-radius:5px; overflow:hidden;}
.trackback p, .comment p{margin:0;}
.userpic{float:right; width:75px; height:75px; overflow:hidden; clear:both; border:5px solid #eee; position:relative;}
.userpic img{position:absolute;}
.comment-content{float:right; width:83%; padding:0 20px 0 0; background:url(img/comment_arrow.png) right 20px no-repeat;}
.entry-author-comment .comment-content{float:left; padding:0 0 0 20px; background:url(img/comment_arrow.png) left 20px no-repeat;}
.entry-author-comment .userpic{float:left;}
.entry-author-comment .inner{background:#fefefe;}
.comment-reply .inner{background:#eef; border-color:#aac;}
.comment img{vertical-align:top; margin-right:.5em;}

#mail-form-type input[type=radio]{width:auto; margin:1em .5em 1em 0;}
#mail-form-type label{margin-right:1em;}

.content-nav{clear:both; padding:1em 0; text-align:center; font-size:85%;}
.content-nav a{display:inline-block; padding:.2em 1.2em; background:#fff; color:#666; border:1px solid #ccc;}
.content-nav a:hover{background:#ccc; color:#fff; border-color:#fff; text-decoration:none;}
.content-nav .separator{display:none;}
.prev{float:left;}
.next{float:right; text-align:right;}

.pagenavi{margin:0; padding:0; clear:both; text-align:center; font-size:9px;}
ul.pagenavi li{display:inline-block; list-style:none; margin:1px; border:1px solid #ccc;}
.pagenavi span,
.pagenavi a{display:inline-block; padding:0 .8em;}
.pagenavi a{background:#999; color:#fff;}
.pagenavi a:hover{background:#eee; color:#666;}

#tags-list{margin:0;}
#tags-list li{display:inline; margin-right:.5em;}
#tags-list a{display:inline-block;}
.rank-1 a{font-size:160%; color:#cc3;}
.rank-2 a{font-size:150%; color:#cc4;}
.rank-3 a{font-size:140%; color:#cc5;}
.rank-4 a{font-size:130%; color:#cc6;}
.rank-5 a{font-size:120%; color:#cc7;}
.rank-6 a{font-size:110%; color:#cc8;}
.rank-7 a{font-size:100%; color:#cc9;}
.rank-8 a{font-size:90%; color:#cca;}
.rank-9 a{font-size:80%; color:#ccb;}
.rank-10 a{font-size:70%; color:#ccc;}

.asset-meta{font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif; font-size:9px;}
.asset-meta abbr{border:none;}
.asset-meta a{color:#000;}
.container .asset-meta{text-align:right;}

/*------------------------------------------------------------------------------------------------ for page */


#portfolio #sidenavi{margin:0 2%; text-align:right; border-bottom:1px solid #cc9;}
#portfolio #sidenavi li{display:inline-block; margin:0; width:auto; border:1px solid #fff; border-bottom:none;}
#portfolio #sidenavi li a{display:block; line-height:1; text-transform:uppercase; margin:0; padding:.5em 1em; text-align:center; color:#000; background:#fff; -moz-border-radius:0; -webkit-border-radius:0; border:1px solid #fff; border-bottom:none;}
#portfolio #sidenavi li a:hover,
#portfolio #sidenavi li.active a{color:#cc9; text-decoration:none; border:1px solid; border-bottom-color:#fff; margin:0 0 -1px;}


.works{width:19.5%; display:inline-block; vertical-align:top; margin:0;}
.works .entry-image{float:none; width:100%;}
.works .entry-image a{width:100%; height:100px; text-indent:-9999px;}
.works .asset-meta{text-align:left; margin:0;}
#main .works h3{margin:5px 0; border:none;}

.entry-body{margin:bottom:2em;}
.entry-title{font-size:160%; font-weight:normal; color:#000; line-height:1.3;}
.entry-image{float:left; margin:0 2em 1em 0; background:#fff;}
.entry-image a{display:block; border:1px solid #ccc; text-indent:-9999px; -moz-border-radius:5px; -webkit-border-radius:5px;}

#monthly .entry-image{float:right; margin:0 0 1em 2em;}

/*
#about .content h2{margin:2em 0 1em; padding:.3em .8em; letter-spacing:.1em; border-left:10px solid #aa9; line-height:1.5; text-transform:uppercase; background:#fafafa; color:#666; text-shadow: 1px 1px 0px #fff;}
*/
#about .content h2{margin:2em 0 1em; padding:.3em 0; letter-spacing:.1em; line-height:1.5; text-transform:uppercase; color:#000; text-shadow: 1px 1px 0px #fff; font-weight:normal;}
#search .catch, #monthly .catch{border-bottom:3px double;}
#search .container, #monthly .container{width:47%; margin:0 0 4em 0;}
#monthly .container.L{clear:both;}

/*------------------------------------------------------------------------------------------------ for slide */

#slideW{overflow:hidden;margin-bottom:30px;}
#slide{margin:0;padding:0;}
#slideW #slideCase #pageNavi{position:absolute; top:0; left:0; width:2%; text-align:center;}
#slideW #slideCase .slider{padding:0;margin:0; text-align:center;}
#slideW #slideCase .slider li{margin:0; padding:0;list-style:none;}
.pages{display:inline-block; margin-bottom:1px; padding:5px 7px; border:3px solid #888; font-size:9px; line-height:1; text-align:center;}
.pages{color:#000;text-decoration:none;color:#fff;background:#000;}
.pages:hover{color:#fff;background:#800;text-decoration:none;}
.pages.selected{color:#000;background:#fff;}

#comments-open-data,#comments-open-footer,#comments-open-captcha,#mail-form-footer{width:38%;}
#comments-open-text,#mail-form-text,#comment-form-reply{width:58%;}
#comments-open-data,#comments-open-footer,#comments-open-captcha,#mail-form-footer{float:left;}
#comments-open-footer,#mail-form-footer{margin-top:20px;}
#comments-open-text,#comment-form-reply,#mail-form-text{float:right; margin-right:2px;}
#mail_text{height:200px;}
#comments-open-footer,#comment-form-remember-me{margin:10px 0;}
#comment-bake-cookie, #comment-reply{display:inline; width:auto;}
#comment-preview,#comment-submit{width:30%;}
#comments-open-footer{clear:left;}
.field input{float:left; margin:6px 5px 0 0; width:75px;}
.field img{float:left;}
.field p{clear:both;}
.error,.require{color:#c00;}

/*------------------------------------------------------------------------------------------------ for bg image */

.breadcrumbs a.pageTop{display:block; width:20px; height:20px; padding:0; margin:5px 10px 0; line-height:20px; background:url(img/ico_pagetop.png) top left no-repeat; text-indent:-9999px;}
.breadcrumbs a.pageTop:hover{background-position:0 -20px;}
#monthly-archive-list{margin:0;}
#monthly-archive-list li{list-style:none; background:url(img/ico_monthly.png) center left no-repeat; padding-left:15px;}


.widget h3{font-weight:normal; color:#000; letter-spacing:.1em;}

.widget-search{float:right; margin:0 0 0 20px;}
.widget-search input.ti{width:140px; background:#fff url(img/ico_search.png) 5px center no-repeat; padding-left:22px; color:#ccc; -moz-border-radius:7px; -webkit-border-radius:7px;}
.widget-search input.ti:focus{color:#333;}

.widget-calendar table{width:99.5%; text-align:center; font-size:9px; line-height:1.44;}
.widget-calendar a{display:block; color:#c00;}
.widget-archive ul, .widget-pages ul, .widget-recent-assets ul, .widget-tag-cloud ul, .widget-recent-comments ul{margin:0;}
.widget-archive ul li, .widget-pages ul li,.widget-recent-comments ul li{list-style:none; background:url(img/ico_monthly.png) 0 .45em no-repeat; padding-left:15px;}
.widget-recent-assets li{list-style:none; width:50px; height:50px; overflow:hidden; display:inline-block;}
.widget-tag-cloud ul li{list-style:none; display:inline-block; margin-right:.5em;}
.widget-recent-comments ul li ul li{background-image:url(img/ico_commented.png);}
.widget-related-entries{margin-bottom:30px; clear:both;}

.page-image{height:160px; text-indent:-9999px; margin-bottom:20px; background-color:#ccc;}
.caption{display:inline-block; margin:5px 0 0; font-size:85%; line-height:1.33;}


html{background:url(http://5five.net/img/bg.png) -30% -300px no-repeat;}
body{background:url(http://5five.net/img/bg.png) 160% 60% no-repeat;}


html{background:url(http://5five.net/img/bg_block.png);}


.btn{padding-left:5px; background:url(img/btn_bg_l.png) top left no-repeat;}
.btn a{display:inline-block; line-height:32px; height:34px; padding:0 30px 0 25px; background:url(img/btn_bg_r.png) top right no-repeat;}

.blank{display:inline-block; width:6px; height:6px; vertical-align:top; background:url(img/blank.png) no-repeat;}

.works-image{width:50%; float:left; text-align:center;}
.works-note{width:45%; float:right;}
.works-title{font-weight:normal; font-size:120%; color:#000;}

#sub .widget{width:33.3%; float:left;}
#sub h3,
#sub .widget-content,
#sub .module-content{margin-right:2em;}

.tooltips{font-size:9px; color:#eee; display:inline-block; line-height:1.2;-moz-border-radius:7px; -webkit-border-radius:7px; background:#222;}
.tooltips .tip-title{font-size:11px; padding:5px 8px;}
.tooltips .tip-text{padding:5px 8px; border-top:1px dotted;}

@media screen and (max-device-width: 480px){
 #index #wrap{width:100%; height:160px; position:absolute; top:50%; left:auto; margin:-80px auto 0;}
 #wrap{padding:5px;-webkit-text-size-adjust:none;}
 #site-seal, .navi, .widget-search{float:none; margin:5px 0; text-align:center;}
 .navi li{float:none; display:inline-block; margin:0 -2px;}
 .navi li a{background:#000; padding:.5em 1em; color:#fff;}
 #portfolio .layout-one #sidenavi{text-align:center;}
 #portfolio .layout-one #sidenavi li a{padding:.4em;}
 #footer{text-align:center;}
 #copy{float:none;}
 .widget-search input.ti{text-align:center; padding-right:22px;}
 #wrap .col1{width:96%;}
 #wrap .col2{width:92%;}
 .works{width:100%;}
 .works .entry-image{float:left; width:40%;}
 .works-image,
 .works-note{width:100%; float:none;}
 #comments-open-data,#comments-open-footer,#comments-open-captcha,#mail-form-footer,
 #comments-open-text,#mail-form-text,#comment-form-reply{width:99.5%; float:none; clear:both;}
 .comment-content{width:60%;}
}

.widget-lastfm ul{margin:0;}
.widget-lastfm ul li{display:inline-block; width:19.5%; vertical-align:top; cursor:pointer;}
.widget-lastfm img{float:left;}
.last-data{margin:0 10px 0 70px; padding:0; font-size:10px; line-height:1.2;}
.nowplaying{background:#c00; color:#fff; font-size:9px; line-height:1; padding:0 .5em;}
.last-title,
.last-artist{margin:5px 0;}

#page-setting{visibility:hidden;position:fixed;bottom:0;right:0;z-index:1000;font-size:9px;border:1px solid #eee;-moz-border-radius:5px;-webkit-border-radius:5px;background:#eee;}
#page-setting ul{margin:0; padding:.5em;border-top:1px solid #fff;border-bottom:1px solid #ccc;}
#page-setting li{display:inline-block;border:1px solid #fff;-moz-border-radius:5px;-webkit-border-radius:5px;background:#fff;}
#page-setting .listname,
#page-setting li a{display:inline-block;padding:0 1em;border:1px solid #ccc;-moz-border-radius:5px;-webkit-border-radius:5px;background:#fff;color:#999;}
#page-setting li a:hover{background:#eee;}
#page-setting .active a{color:#fff; background:#555;}
#page-setting #color{border-top:none}
#page-setting #etc{border-bottom:none;}
#page-setting .listname{background:#ccc; color:#fff;}

.ad{text-align:center;padding:2em 0 0;}
.breadcrumbs a.switch{background:url(img/switch.png) center no-repeat; text-indent:-9999px; padding:0; margin:6px 7px 0 0; width:16px; height:16px; float:right;}

/*last*/
.last{margin:0;padding:0;overflow:hidden;list-style:none;font-size:9px;text-align:center;}
.last li{vertical-align:top;margin:3px;padding:0;display:inline-block;-moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.6);-webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.6);}
.last-thumb{background:#000;color:#999;text-decoration:none;position:relative;float:left;height:80px;border:1px solid #eee;}
.last-thumb img{display:block;border:none;}
.last-thumb .playing{position:absolute;bottom:1px;right:2px;}
.last-text{overflow:hidden;}
.no-img{width:80px;}
#info{position:fixed;right:20px;bottom:20px;z-index:1000;background:#fff;font-size:10px;}
.info{overflow:hidden;display:inline-block;max-width:600px;border:1px solid #ccc;-moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.6);-webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.6);}
.info .title{font-weight:bold;padding-bottom:5px;padding-left:15px;text-align:center;}
.info .thumb{float:left;width:200px;padding:5px;}
.info .thumb-img{width:200px;}
.info .text{padding:5px 0 0 0;}
.info .name{font-weight:bold;font-size:11px;}
.info .wiki{overflow:hidden;margin:10px 10px 10px 220px;line-height:1.6;}
.info .listeners{display:inline-block;}
.info .playcount{display:inline-block; margin-left:1em; padding-left:1em; border-left:1px solid #ccc;}
.amazon{position:absolute;left:5px;}
.amazon img{border:none;}