@charset "shift-jis";
/*
********************************************************************************
Front   : http://www.tree-web.net/
Private : http://wisp.tree-web.net/
Works   : http://works.tree-web.net/

Copyright (C) 2011-2015 TREE-WEB.NET
Copyright (C) ういすぷ

HTML5 & CSS2,3
********************************************************************************
*/



/*
--------------------------------------------------------------------------
共通コンテンツ
--------------------------------------------------------------------------
*/
#contents {
   margin:auto;
   width:780px;
   padding-top:40px;
   padding-left:10px;
   padding-right:10px;
   padding-bottom:50px;
   margin-bottom:100px;
}

#contents h2 {
   padding:0 10px;
   line-height:32px;
   height:32px;
   display:block;
   margin-bottom:15px;
   font-weight:bold;
   color:#000;
   
   /* CSS 3 */
   border-radius:4px;
}
#contents p {
   margin:0 20px;
}
#contents .list,
#contents .rss {
   background-image:url(sprites.png);
   background-repeat:repeat-x;
   background-position:-200px -166px;
   display:block;
   position:absolute;
   width:60px;
   height:16px;
   top:10px;
   text-indent:-9999px;
}
#contents .list {
   background-position:-200px -150px;
   right:20px;
}
#contents .rss {
   right:85px;
}
#contents #ssi_contents {
   margin-top:20px;
   position:relative;
}


/*
--------------------------------------------------------------------------
WebBoard SSI
--------------------------------------------------------------------------
*/
.TW_WBSSI {
   margin:auto;
   width:100%;
   height:100%;
}
.TW_WBSSI ul{
}
.TW_WBSSI li{
   clear:both;
   display:block;
   min-height:72px;
   width:100%;
   
   padding-bottom:5px;
   margin-bottom:6px;
   border-style:none none dotted none;
   border-width:1px;
   border-color:#eee;
}
.TW_WBSSI .TW_WB_image_medium,
.TW_WBSSI .TW_WB_image_large {
   display:block;
   width:72px;
   height:72px;
   float:left;
}
.TW_WBSSI .TW_WB_date {
   margin-left:80px;
   margin-bottom:5px;
   display:block;
   font-size:10px;
}
.TW_WBSSI .TW_WB_link {} /* A */
.TW_WBSSI .TW_WB_title { /* SPAN */
   margin-left:80px;
   display:block;
   font-size:12px;
   line-height:16px;
}
.TW_WBSSI img:hover {
   -ms-filter:"alpha(opacity=60)";
   filter:alpha(opacity=60);
   opacity:0.6;
}



/*
--------------------------------------------------------------------------
SSI 共通設定
--------------------------------------------------------------------------
*/
#ssi_blog,
#ssi_news,
#ssi_nendroid,
#ssi_gatya,
#ssi_app {
   margin-top:80px;
   position:relative;
   /* CSS 3 */
   border-radius:4px;
}

#ssi_blog h2,
#ssi_news h2,
#ssi_nendroid h2,
#ssi_gatya h2,
#ssi_app h2 {
   background-color:#abc4e5;
}



/*
--------------------------------------------------------------------------
NEWS
--------------------------------------------------------------------------
*/
#ssi_news .TW_WBSSI li {
   min-height:45px;
}
#ssi_news .TW_WBSSI .TW_WB_date,
#ssi_news .TW_WBSSI .TW_WB_link,
#ssi_news .TW_WBSSI .TW_WB_title {
   margin-left:0;
}



/*
--------------------------------------------------------------------------
アプリ
--------------------------------------------------------------------------
*/
#ssi_app .TW_WBSSI ul {
   margin-top:10px;
}




/*
--------------------------------------------------------------------------
サイトについて
--------------------------------------------------------------------------
*/
#site_information {
   margin-top:20px;
}

/**/
#site_information ul {
   border-style:solid;
   border-width:1px;
   border-color:#888;
}
#site_information li {
   padding:5px;
   width:100%;
   border-bottom-style:solid;
   border-bottom-width:1px;
   border-bottom-color:#888;
   box-sizing:border-box;
}
#site_information li:last-child {
   width:100%;
   border-bottom-style:none;
}
#site_information li .key {
   width:180px;
   vertical-align:top;
}
#site_information li .value {
   width:calc(100% - 180px);
   border-left-style:solid;
   border-left-width:1px;
   border-left-color:#eee;
}
#site_information li .key,
#site_information li .value {
   padding:5px;
   display:inline-block;
}
#site_information .message {
   margin:0;
   margin-top:10px;
}
#site_information a {
   color:#30499b;
}



#site_information .mail {
   display:block;
   width:120px;
   text-align:center;
   line-height:20px;
   font-size:12px;
   background-color:#eee;
   margin-bottom:5px;
   
   border-style:solid;
   border-width:1px;
   border-color:#ccc;
   
   /* CSS 3 */
   border-radius:4px;
}
#site_information .twitter {
   background-image:url(twitter_logo.png);
   background-repeat:no-repeat;
   display:block;
   width:230px;
   height:65px;
   font-size:0px;
   margin-bottom:5px;
}
#site_information .pixiv_icon img,
#site_information .rss_icon img{
   display:block;
   padding:0px;
   margin-bottom:5px;
}



/*
--------------------------------------------------------------------------
スマホ向け
--------------------------------------------------------------------------
*/
@media only screen and (max-width:769px) {
   header,
   header nav li a,
   header nav li:hover{
      background-image:none;
   }
   
   
   header {
      width:100%;
      height:100px;
   }
   header h1 img {
      max-width:90%;
      height:auto;
   }
   header .contents {
      width:100%;
   }
   header nav ul {
      padding:5px 0;
      position:relative;
      text-align:center;
      background-color:#eee;
   }
   
   header nav li a {
      width:auto;
      height:auto;
      margin:2px 5px;
      display:inline-block;
      text-indent:0;
   }
   header nav li a:hover {
      color:#aaa;
   }
   
   
   /**/
   footer {
      height:auto;
   }
   footer .contents {
      width:auto;
      height:auto;
   }
   footer #footer_navigation ul {
      margin-top:10px;
   }
   footer #footer_navigation li a {
      margin:0 5px;
   }
   footer address {
      margin:10px 0;
   }
   
   
   #contents {
      width:auto;
      padding:0 10px;
      margin:50px 0 100px 0;
   }
   #contents p {
      padding:0;
      margin:0;
   }
   
}
@media only screen and (max-width:481px) {
   #site_information ul {
      border:none;
   }
   #site_information li,
   #site_information li:last-child {
      margin-bottom:15px;
      border-style:solid;
      border-color:#000;
      border-width:1px;
      
   }
   #site_information li .key,
   #site_information li .value {
      width:100%;
   }
   #site_information li .key {
      background-color:#eee;
   }
   
   
}