@charset "utf-8";
/* ---------------------------------------------------------------

忍者ブログ まとめサイト制作用テンプレート

特徴:
・ヘッダーや背景画像など記載してあるサイズに合わせて作成するとURL差し替えで変更可能です
・忍者レコメンドや忍者admax貼り付け位置があらかじめ用意してあります
・スマホなどでも閲覧できるようレスポンシブ対応してあります
（設定→ブログ詳細→ブログ表示の設定でスマートフォン用テンプレートを使用しないにチェックを入れてください)

レスポンシブ対応のため、以下のクラス名をつけると「PCのみ」または「スマホのみ」で表示することができます。
・PCのみ表示 -> .pc
・スマホのみ表示 -> .sp

スマホレイアウトは画面幅が768px以下の場合に適用されます。
スマホレイアウトのcss部分に関しては @media screen and (max-width: 768px) 以下に書いてありますので、
そちらを参照してください。

左右のカラムにはブラグイン設定から設定したプラグインが入ります。
・左側にはプラグインカテゴリー１〜３が入ります
・右側にはプラグインカテゴリー４、５が入ります

2chコピペの場合はthreadというクラスをつけたdivにソースをコピペすると
いい感じに表示してくれます。


文字色など色に関する変更点は▲
背景画像など画像差し替えに関する場所は■
でそれぞれマーキングしてあります。



--------------------------------------------------------------- */

/*  全体の初期化　ブラウザによって各要素にデフォルトで付いているスタイルを初期化しています
------------------------------------------------------- */

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, address, code, img, q, s,
small, strong, tt, var, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
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%;
  font: inherit;
  vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}
body {
  line-height: 1;
}
ol, ul {
  list-style: none;
}
blockquote, q {
  quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none;
}

table{
  border-collapse:collapse;
  border:none;
  border-spacing:0;
}
th,td{
  vertical-align:top;
  border:solid 1px #ddd;
  font-weight:normal;
  text-align:left;
 padding: 10px 10px;
}
caption{
  text-align:left;
} 


/*  アイコンの設定
------------------------------------------------------- */
@font-face {
  font-family: 'awesome';
  src: url('/admin/font/pc/awesome.eot?v=3.0.1');
  src: url('/admin/font/pc/awesome.eot?#iefix&v=3.0.1') format('embedded-opentype'),
  url('/admin/font/pc/awesome.woff?v=3.0.1') format('woff'),
  url('/admin/font/pc/awesome.ttf?v=3.0.1') format('truetype');
  font-weight: normal;
  font-style: normal;
}
[class^="icon-"],
[class*=" icon-"] {
  font-family: 'awesome';
  font-weight: normal;
  font-style: normal;
  text-decoration: inherit;
  -webkit-font-smoothing: antialiased;
}
[class^="icon-"]:before,
[class*=" icon-"]:before {
  text-decoration: inherit;
  display: inline-block;
  speak: none;
}
a [class^="icon-"],
a [class*=" icon-"] {
  display: inline-block;
}
.btn [class^="icon-"],
.btn [class*=" icon-"] {
  display: inline;
}
li [class^="icon-"],
li [class*=" icon-"] {
  display: inline-block;
  width: 1.25em;
  text-align: center;
}
.icon-home:before {
  content: '\f230';
}
.icon-edit:before {
  content: '\270d';
}
.icon-comment:before {
  content: '\e718';
}
.icon-chevron-left:before {
  content: '\e75d';
}
.icon-chevron-right:before {
  content: '\e75e';
}
.icon-double-angle-up:before {
  content: '\f102';
}
.icon-user:before {
  content: '\f464';
}
.icon-folder-close:before {
  content: '\f4c1';
}
.icon-calendar:before {
  content: '\f4c5';
}
.icon-search:before {
  content: '\f50d';
}
.icon-clock:before {
  content: '\f554';
}

/*  全体の基本設定
------------------------------------------------------- */
body {
  background: #BFDBB2 url(""); /*▲▲▲ ■　ヘッダー背景色と背景画像 背景画像を設定する場合は""の中に画像URLを入れてください*/
  font-family: "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
}


h1 {
  padding: 0.5em;
  background: aliceblue;
  box-shadow: 0 0 4px rgba(0, 0, 0, 0.23);
}


h1 span {
  display:none;
}

p {
  color:#2F2933;
  font-size:14px;
}

a {
  color:#68BEAA;/*▲▲▲ リンク色*/
}

a:hover {/*▲▲▲ マウスカーソルを上に乗せたときのリンク色*/
  background:#68BEAA;
  color:#ffffff;
}

h2 {
  position: relative;
  padding-left: 1.2em;/*アイコン分のスペース*/
  line-height: 1.4;
  border-bottom: solid 3px #516ab6;/*下線*/

}

h2:before {
  font-family: FontAwesome;
  content: "\f00c";/*アイコンのユニコード*/
  position: absolute;/*絶対位置*/
  font-size: 1em;/*サイズ*/
  left: 0;/*アイコンの位置*/
  top: 0;/*アイコンの位置*/
  color: #5ab9ff; /*アイコン色*/
}

h3{
  background: #c2edff;/*背景色*/
  padding: 0.5em;/*文字まわり（上下左右）の余白*/
 border-radius: 25px 0px 0px 25px;/*左側の角を丸く*/
}

h3:before {
  content: '●';
  color: white;
  margin-right: 8px;
}


h4 {
  color: #6cb4e4;
  text-align: center;
  padding: 0.25em;
  border-top: solid 2px #6cb4e4;
  border-bottom: solid 2px #6cb4e4;
  background: -webkit-repeating-linear-gradient(-45deg, #f0f8ff, #f0f8ff 3px,#e9f4ff 3px, #e9f4ff 7px);
  background: repeating-linear-gradient(-45deg, #f0f8ff, #f0f8ff 3px,#e9f4ff 3px, #e9f4ff 7px);
}

table{
  border-collapse: collapse;
  border-spacing: 0;
 border:5px;
  table-layout: fixed;
}
table tbody th {
    background: #78bbc7;
    color: #fff;
}
table tbody th {
    background: #78bbc7;
    color: #fff;
}

#table-sc {
overflow-x: scroll;
-webkit-overflow-scrolling: touch;
overflow: auto;
white-space: nowrap;
}

/* PC用 レイアウト設定*/
@media screen and (min-width: 769px) {
  /*  サイトコンテンツ全体を囲む枠
  ------------------------------------------------------- */
  #wrapper {
    width:1170px;
    margin:0 auto;
    background: #ffffff;/*▲▲▲ 記事などが表示される部分の背景色*/
    border: 1px solid #63AF8C;
  }

  /*  ヘッダー設定 サイトタイトルなどの入る箇所です。
  ------------------------------------------------------- */
  #header {
    background: #68BEAA url("http://file.www.app-news.jp/appnews.png") center;
    padding: 10px;
    height:130px;
  }

  #header .headerTitle {
    display:none;
  }

  #header .headerTitleLink {
    width:300px;
    height:130px;
    display:inline-block;
  }

  #header .headerTitleLink:hover {
    background:none;
  }

  #header .rssarea {
    width:810px;
    height:130px;
    /*background:#fff;*/
    /*border:1px dashed #ffffff;/*▲▲▲ ヘッダー内RSS・広告設置位置の点線　不必要であればこの行を消してください*/
    float:right;
  }

  /*  プラグインレイアウト設定
  ------------------------------------------------------- */

  .plugin {
    margin-bottom: 28px;
    margin-left: 0;
    margin-right: 0;
    padding-top: 14px;
    padding-bottom: 14px;
    background: #ffffff;
    border: 0;
    border-radius: 0;
  }
  /* プラグインのタイトルの設定 */
  .pluginTitle {
    margin: 0;
    padding-top: 7px;
    padding-bottom: 7px;
    padding-left: 28px;
    padding-right: 28px;
    line-height: 20px;
    font-weight: bold;
    font-size: 17.5px;
    word-wrap: break-word;
  }
  /* プラグインのコンテンツ部分の設定 */
  .pluginBody {
    overflow: hidden;
    padding: 9px 28px;
  }

  /*各プラグイン処理内の基本デザイン*/
  .plugin_data,
  .plugin_data * {
    line-height: 20px;
  }
  .plugin_data + .plugin_data {
    margin-top: 7px;
  }
  /* 各プラグイン処理内基本デザインの下に記載する日付など */
  .plugin_data_date {
    font-size: 11.9px;
    color: #737373;
    margin-bottom: 7px;
  }

  .plugin_data .right {
    float: right;
  }
  .plugin_data .right:before,
  .plugin_data .right:after {
    display: table;
    content: "";
  }
  .plugin_data .right:after {
    clear: both;
  }

  /* プラグインのカレンダー用テーブル */
  .CalendarMoveTable,
  .CalendarTable {
    width: 100%;
  }
  .CalendarMoveTable td,
  .CalendarTable th,
  .CalendarTable td {
    padding-top: 5px;
    padding-bottom: 5px;
    text-align: center;
    vertical-align: middle;
    border: 1px solid #bfbfbf;
  }
  /* カレンダー日付移動部分のデザイン */
  .CalendarMoveTr {
    padding-top: 5px;
    padding-bottom: 5px;
    text-align: center;
    vertical-align: middle;
    width: 100%;
  }
  .CalendarMoveTr a:link,
  .CalendarMoveTr a:visited,
  .CalendarMoveTr a:hover {
    display: inline-block;
    text-decoration: none;
    margin-top: -5px;
    margin-bottom: -5px;
    padding-top: 5px;
    padding-bottom: 5px;
  }
  .CalendarMoveTr a:hover,
  .CalendarMoveTr a:active {
    color: #b3b3b3;
  }
  /* カレンダー日付移動用左側部分のデザイン */
  .CalendarMoveTr td {
    border-bottom: 0;
  }
  .CalendarMoveTr .CalendarPrevTd {
    text-align: left;
    border-right: 0;
  }
  .CalendarPrevTd a {
    padding-left: 10px;
    color: #999999;
  }
  .CalendarPrevTd a:before {
    font-family: 'awesome';
    font-weight: normal;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    text-decoration: inherit;
    display: inline-block;
    speak: none;
    content: "\e75d";
    color: #cccccc;
    margin-right: 14px;
  }
  /* カレンダー日付移動中央部分のデザイン */
  .CalendarMoveTr .CalendarNowTd {
    text-align: center;
    border-left: 0;
    border-right: 0;
  }
  /* カレンダー日付移動用右側部分のデザイン */
  .CalendarMoveTr .CalendarNextTd {
    text-align: right;
    border-left: 0;
  }
  .CalendarNextTd a {
    padding-right: 10px;
    color: #999999;
  }
  .CalendarNextTd a:after {
    font-family: 'awesome';
    font-weight: normal;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    text-decoration: inherit;
    display: inline-block;
    speak: none;
    content: "\e75e";
    color: #cccccc;
    margin-left: 14px;
  }
  /* 曜日表示部分のデザイン */
  .CalendarWdayTr th {
    text-align: center;
    font-weight: normal;
    color: #333333;
    background: #efefef;
  }
  /* 日付表示部分のデザイン */
  .CalendarTr td {
    text-align: center;
    color: #737373;
  }
  /* 記事が存在する場所の設定 */
  .CalendarTdLink a {
    display: inline-block;
    min-width: 14%;
    padding: 5px;
    margin: -5px;
    text-align: center;
    font-weight: bold;
  }
  /* ブログ内検索用デザイン */
  .blogsearch:before,
  .blogsearch:after {
    display: table;
    content: "";
  }
  .blogsearch:after {
    clear: both;
  }
  .blogsearch .box {
    width: 70%;
    float: left;
  }
  .blogsearch .btn {
    width: 22%;
    float: right;
    text-align: center;
  }
  /* コメント用デザイン */
  .plugin_cm_with_res img {
    margin-left: 7px;
    vertical-align: text-top;
  }
  /* プロフィール用デザイン */
  .profile_image {
    margin-bottom: 10px;
  }
  /* バーコード用デザイン */
  .qrcode_image {
    text-align: center;
  }

  /*  左カラム設定 サイトの左側にある縦長のエリアです
  ------------------------------------------------------- */
  .left-column {
    width: 212px;
    margin:10px 10px 10px 10px;
    /*border: 1px solid #362f3c;/*▲▲▲ カラム 枠線の色と幅*/
    float: left;
    background: #ffffff;/*▲▲▲ カラム背景色*/
  }

  .left-column .category01 h4,
  .left-column .category02 h4,
  .left-column .category03 h4,
  .left-column .category04 h4,
  .left-column .category05 h4 {
    background: ;/*▲▲▲ カラム見出し背景色*/
    padding:6px;
    color: #6cb4e4;/*▲▲▲ カラム見出し文字色*/
    clear:both;
    margin:10px 0;
  }

  .left-column .ad {
    text-align:center;
    margin:0 0 10px;
  }

  .left-column .ad h4 {
    background:;/*▲▲▲ カラム見出し背景色*/
    padding:6px;
    color:#6cb4e4;/*▲▲▲ カラム見出し文字色*/
    text-align:left;
    margin:0 0 10px;
  }

  .left-column .ad.fixed {
    width:212px;
    text-align:center;
    margin:0 0 10px;
  }

  /*  中央カラム設定 サイト中央の記事などが入る箇所の設定です
  ------------------------------------------------------- */
  .center-column {
    width: 732px;
    /*border: 1px solid #362f3c;/*▲▲▲ カラム 枠線の色と幅*/
    float: left;
    margin: 10px 0 10px 0;
  }

  /*中央カラム一番上のrss表示エリア*/
  .center-column .top-rssarea {
    border: 1px solid *▲▲▲ 境界線色*/
    height:250px;
    overflow:scroll;
    background: #ffffff;
 
  }

  .center-column .top-rssarea .full {
    width:728px;
    overflow:hidden;
  }
  .center-column .top-rssarea .full h4{
    background: ;/*▲▲▲ 見出し背景色*/#63AF8C
    padding: 6px;
  }
  .center-column .top-rssarea .full p{
    padding: 6px;
  }

  .center-column .top-rssarea .half {
    width: 350px;
    overflow:hidden;
    float:right;
    font-size:14px;
    font-weight:normal;
    border-left: 1px solid #63AF8C;/*▲▲▲ 中央の分割線色*/
  }
  .center-column .top-rssarea .half.first{
    float:left;
    border-left: none;
    border-right: 1px solid #63AF8C;/*▲▲▲ 中央の分割線色*/
  }

  .center-column .top-rssarea .half h4{
    background: ;/*▲▲▲ 見出し背景色*/#63AF8C
    padding: 6px;
  }
  .center-column .top-rssarea .half p{
    padding: 6px;
  }

  .ninja-recommend.one-line .ninja-recommend-article-title {
    white-space:nowrap;
  }

  /*記事一覧*/
  .article-list {
    margin: 10px 0;
  }

  .article-list .article {
    border: 1px solid #68BEAA;/*▲▲▲ 囲み枠色*/
    margin: 20px 0 ;
    background: #ffffff;/*▲▲▲ 背景色*/
  }

  .article-list .article h3 {
    background:#68BEAA;/*▲▲▲ 記事見出し背景色*/
    padding: 10px;
    color:#ffffff;/*▲▲▲ 記事見出し文字色*/
    font-size: 20px;
    font-weight:bold;
  }

  .article-list .article h3 a {
    color:#ffffff;/*▲▲▲ 記事見出し文字色*/
    text-decoration:none;
  }

  /*記事の画像サムネイルです PCでは表示されません*/
  .entry-image {
    display:none;
  }

  /*記事内のコメント数や投稿日時を表示している部分の設定*/
  .article-list .article ul {
    text-align:right;
    margin:10px 10px 0 0;
  }

  .article-list .article li {
    display:inline;
    color: #71696F;/*▲▲▲ コメント数や投稿日時の文字色*/
    font-size: 10px;
    padding: 6px;
  }

  .article-list .article li a {
    color: #71696F;/*▲▲▲ コメント数や投稿日時の文字色*/
    text-decoration:none;
  }

  .article-list .article li a:hover {
    color: #ffffff;/*▲▲▲ コメント数や投稿日時の文字色*/
    background:none;
  }

  .article-list .article li.comment {
    border: 1px solid #71696F;/*▲▲▲ 囲み枠色*/
  }

  .article-list .article li.comment:hover {
    color: #ffffff;/*▲▲▲ マウスカーソルを重ねたときの文字色*/
    background: #71696F;/*▲▲▲ マウスカーソルを重ねたときの背景色*/
  }

  .article-list .article p,
  .article-list .article .entryText {
    padding:10px;
    line-height:1.6;
  }

  .article-list .article .NinjaEntryCommercial {
    padding:10px;
    text-align:center;
  }

  /*タイトル下　カテゴリー表示部分の設定です*/
  .article-list .article .category-name {
    text-align:right;
    color: #71696F;/*▲▲▲ カテゴリーの文字色*/
    line-height:1;
  }

  .article-list .article .category-name a {
    color: #71696F;/*▲▲▲ カテゴリーの文字色*/
    text-decoration:none;
  }

  .article-list .article .category-name a:hover {
    color: #68BEAA;/*▲▲▲ カテゴリーの文字色*/
    background:none;
    text-decoration:none;
  }

  .article-list .article .top-btn-share {
  }

  /*一覧表示時の続きをみるの表示設定です*/
  .article-list .article .entryPsLink, .article-list .article .entryPsLink a {
    font-size:18px;
    padding:10px;
    color:#68BEAA;/*▲▲▲ 続きを見るの文字色*/
  }
  .article-list .article .entryPsLink a:hover {
    background:#68BEAA;/*▲▲▲ マウスカーソルを重ねたときの背景色です*/
    color:#ffffff;/*▲▲▲ マウスカーソルを重ねたときの背景色です*/
  }

  /*記事詳細*/

  .article-detail .article {
    border: 1px solid #68BEAA;/*▲▲▲ 記事部分の囲み枠色*/
    margin: 20px 0 ;
    background: #ffffff;/*▲▲▲ 記事の背景色*/
  }

  .article-detail .article h1 {
    display:block;
    background:#68BEAA;/*▲▲▲ 記事のタイトルの背景色*/
    padding: 10px;
    color:#ffffff;/*▲▲▲ 記事のタイトルの文字色*/
    font-size: 20px;
    font-weight:bold;
  }

  .article-detail .article .top-btn-share {
    float:right;
    display:inline;
    margin:10px;
  }

  .article-detail .article .bottom-btn-share {
    float:right;
    display:inline;
    margin:10px;
  }

  /*タイトル下　カテゴリー表示部分の設定です*/
  .article-detail .article .category-name {
    text-align:right;
    color: #71696F;/*▲▲▲ カテゴリーの文字色*/
    line-height:1;
  }

  /*記事の一番下に表示される日時の表示設定です*/
  .article-detail .article ul {
    text-align:right;
    margin:10px 10px 0 0;
    color: #71696F;/*▲▲▲ 文字色*/
  }

  .article-detail .article li {
    display:inline;
    color: #71696F;/*▲▲▲ 文字色*/
    font-size: 10px;
    padding: 6px;
  }

  /*記事の本文の設定です*/
  .article-detail .article p,
  .article-detail .article .entryText {
    padding:10px;
    line-height:1.6;
  }

  .article-detail .article .NinjaEntryCommercial {
    padding:10px;
    text-align:center;
  }

  /*記事を読んだあとに表示されるRSSや広告エリアの設定です*/
  .article-detail .article .rssarea {
    min-height:300px;
    width:100%;
    /*margin:10px auto;*/
    /*border:1px dashed #63AF8C;/*▲▲▲ 点線の囲み枠の設定です。不必要な場合はこの行を消してください*/
    clear:both;
  }

  /*記事詳細のコメント部分の表示設定です*/
  .article-detail .comments {
    background: #ffffff;/*▲▲▲ 背景色*/
  }

  .article-detail .comments {
    border: 1px solid #68BEAA;/*▲▲▲ 囲み枠色*/
    margin: 20px 0 ;
  }

  .article-detail .comments h4 {
    background:#68BEAA;/*▲▲▲ コメント一覧　見出し背景色*/
    color:#ffffff;/*▲▲▲ コメント一覧 見出し文字色*/
    padding: 10px;
    font-weight:bold;
  }

  .article-detail .comments .comment {
    margin:10px;
  }

  .article-detail .comments .comment p {
    line-height: 1.6;
    font-size:12px;
  }

  .article-detail .comments .comment .name {
    background: #63AF8C;/*▲▲▲ 名前表示背景色*/
    padding: 10px;
    color:#ffffff;/*▲▲▲ 名前文字色*/
    font-weight:bold;
    margin: 0 0 10px;
    font-size:12px;
  }

  .article-detail .comments .comment .name a {
    color:#ffffff;/*▲▲▲ 名前リンク色*/
  }

  .article-detail .comments .comment .name a:hover {
    color:#BFDBB2;/*▲▲▲ 名前リンク　マウスカーソルを重ねたときの文字色*/
    background:none;
  }

  .article-detail .comments .comment .comment-res {
    margin:10px 10px 10px 30px;
    border-left: 3px solid #63AF8C;/*▲▲▲ 返信コメントの左側のボーダー色*/
    padding-left: 10px;
  }

  /*コメント入力欄の設定です*/
  .article-detail .comments .comment-form {
    margin:30px 0 0;
  }

  .article-detail .comments .comment-form .form-area {
    margin:10px;
    text-align:left;
  }

  .article-detail .comments .comment-form .discription {
    width:100px;
    height:25px;
    margin:0 0 10px 0;
    vertical-align:middle;
    float:left;
  }

  .article-detail .comments .comment-form .inputarea {
    width:250px;
    margin:0 0 10px 0;
    vertical-align:middle;
    float:left;
  }

  .article-detail .comments .comment-form .inputarea.comment-input {
    width:600px;
  }

  .article-detail .comments .comment-form input {
    border: 1px solid #68BEAA;/*▲▲▲ コメント入力欄 囲み枠色*/
    line-height:1.6;
    width:200px;
  }

  .article-detail .comments .comment-form textarea {
    border: 1px solid #68BEAA;/*▲▲▲ コメント入力欄 囲み枠色*/
    line-height:1.6;
    width:600px;
  }

  .article-detail .comments .comment-form .comment-form-submit {
    text-align:center;
    clear:both;
  }

  .article-detail .comments .comment-form .comment-form-submit input {
    background:#68BEAA;/*▲▲▲ コメント送信ボタン色*/
    color:#ffffff;/*▲▲▲ コメント送信ボタン文字色*/
    padding: 6px 10px;
    font-size:16px;
    margin: 0 0 20px 0;
  }

  .article-detail .comments .comment-form .comment-form-submit input:hover,
  .article-detail .comments .comment-form .comment-form-submit input:active {
    background:#63AF8C;/*▲▲▲ コメント送信ボタン　マウスカーソルを重ねたときの背景色*/
    border:1px solid #63AF8C;/*▲▲▲ コメント送信ボタン マウスカーソルを重ねたときの枠色*/
  }

  .article-detail .comments .comment-form .notice {
    margin:10px;
    color:#E97789;/*▲▲▲ コメント受付停止時の注意表記　文字色*/
    font-weight:bold;
    text-align:center;
  }


  .article img {
    max-width:710px;
  }
  /*  右カラム設定　サイト右側の縦長のエリアです
  ------------------------------------------------------- */
  .right-column {
    width:186px;
    margin:10px 10px 10px 10px;
    float:right;
    background: #ffffff;/*▲▲▲ 右カラム背景色*/
  }

  .right-column .category01 h4,
  .right-column .category02 h4,
  .right-column .category03 h4,
  .right-column .category04 h4,
  .right-column .category05 h4 {
    background: ;/*▲▲▲ 見出し背景色*/#362f3c
    padding:6px;
    color: #68BEAA;/*▲▲▲ 見出し文字色*/
    margin:10px 0;
  }

  .right-column .ad {
    text-align:center;
    margin:0 0 10px;
  }

  .right-column .ad h4 {
    background: #362f3c;/*▲▲▲ カラム見出し背景色*/
    padding:6px;
    color: #68BEAA;/*▲▲▲ カラム見出し文字色*/
    text-align:left;
    margin:0 0 10px;
  }

  /*  フッター上の広告・RSSリンクエリア設定
  ------------------------------------------------------- */
  .ad-full {
    padding:10px;
    margin:10px;
    /*border: 1px dashed #68BEAA;/*▲▲▲ フッター上のRSSリンク・広告エリアの点線囲み枠です。必要ない場合はこの行を消してください*/
    clear:both;
  }

  /*  ページ送り
  ------------------------------------------------------- */
  .aside li {
    width:33%;
    float:left;
    text-align:center;
  }

  .aside .prev {
    text-align:left;
  }

  .aside .next {
    text-align:right;
  }

  /*  フッター設定 サイトの一番下の箇所の設定です
  ------------------------------------------------------- */
  #footer {
    background: #68BEAA url("") center;/*▲▲▲ ■　フッター背景色と背景画像 背景画像を設定する場合は""の中に画像URLを入れてください*/
    padding:10px;
    text-align: center;
    clear: both;
  }
  #footer p, #footer a {
    line-height:1.6;
    color: #fff;
    font-size: 12px;
  }
  #footer a:hover {
    color:#BFDBB2;
    background:none;
  }


  .clear {
    clear: both;
    display: inline-block;
    width:0;
    height:0;
    margin:0;
    padding:0;
  }

  .sp {
    display:none;
  }
}

/* スマートフォン用 レイアウト設定*/
@media screen and (max-width: 768px) {
  /*  サイトコンテンツ全体を囲む枠
  ------------------------------------------------------- */
  #wrapper {
    width:100%;
    margin:0 auto;
  }

  /*  ヘッダー設定 サイトタイトルなどの入る箇所です。
  ------------------------------------------------------- */
  #header {
    background: #68BEAA url("http://file.www.app-news.jp/appnews.png") center;/*▲▲▲ ■　ヘッダー背景色と背景画像 背景画像を設定する場合は""の中に画像URLを入れてください*/
    padding: 10px;
    height:100px;
  }

  #header .headerTitle {
    display:none;
  }

  #header .headerTitleLink {
    display:inline-block;
    width:100%;
    height:100px;
  }

#header .headerTitleLink:hover {
    background:none;
  }

  #header .rssarea {
    display:none;
  }

  /*  左カラム設定 スマホレイアウトでは表示しません
  ------------------------------------------------------- */
  .left-column {
    display:none;
  }
  /*  中央カラム設定 サイト中央の記事などが入る箇所の設定です
  ------------------------------------------------------- */
  .center-column {
    width: 96%;
    /*border: 1px solid #362f3c;/*▲▲▲ カラム 枠線の色と幅*/
    margin: 10px 2%;
  }

  /*中央カラム一番上のrss表示エリア スマホではRSSはフルサイズでのみ表示されます。*/
  .center-column .top-rssarea {
    border: 1px solid #63AF8C;/*▲▲▲ 境界線色*/
    height:280px;
    overflow:scroll;
    background: #ffffff;
  }
  .center-column .top-rssarea .full,
  .center-column .top-rssarea .half {
    overflow:hidden;
    font-weight:normal;
    font-size:12px;
  }
  .center-column .top-rssarea .full h4,
  .center-column .top-rssarea .half h4{
    background: #63AF8C;/*▲▲▲ 見出し背景色*/
    padding: 6px;
  }
  .center-column .top-rssarea .full p,
  .center-column .top-rssarea .half p {
    padding: 6px;
  }

  /*記事一覧*/
  .article-list {
    margin: 10px 0;
  }

  .article-list .article {
    border: 1px solid #68BEAA;/*▲▲▲ 囲み枠色*/
    margin: 10px 0 ;
    background: #ffffff;/*▲▲▲ 背景色*/
    position:relative;
  }

  .article-list .article h3 {
    padding: 10px;
    color:#68BEAA;/*▲▲▲ 記事見出し文字色*/
    font-size: 18px;
    font-weight:bold;
    line-height:1.6;
    word-break: break-all;
  }

  .article-list .article h3 a {
    text-decoration:none;
  }

  .article-list .article .entryText {
    display:none;
  }

  .article-list .article .top-btn-share {
    display:none;
  }

  /*記事の画像サムネイルです*/
  .entry-image {
    width:100px;
    height:100px;
    float:left;
    margin: 2%;
    padding:0;
    overflow:hidden;
    background:#aaaaaa;
    color:#ffffff;
    border:none;
    text-align:center;
  }
  .entry-image img{
    width:100%;
    height:auto;
    margin:0;
    padding:0;
  }

  .entry-image.dummy {
    height:60px;
    padding:40px 0 0 0;
  }

  /*記事内のコメント数や投稿日時を表示している部分の設定*/
  .article-list .article ul {
    text-align:left;
    margin:10px 0 0 2%;
  }

  .article-list .article li {
    display:inline;
    color: #71696F;/*▲▲▲ コメント数や投稿日時の文字色*/
    font-size: 10px;
    padding: 6px;
  }

  .article-list .article li:active {
    color: #ffffff;/*▲▲▲ タップしたときの文字色*/
    background: #71696F;/*▲▲▲ タップしたときの背景色*/
  }

  .article-list .article p,
  .article-list .article .entryText {
    padding:10px;
    line-height:1.6;
  }

  .article-list .article .NinjaEntryCommercial {
    padding:10px;
    text-align:center;
  }

  /*タイトル下　カテゴリー表示部分の設定です*/
  .article-list .article .category-name {
    position:absolute;
    top:0;
    left:0;
    padding:1%;
    background:#68BEAA;
    color: #ffffff;/*▲▲▲ カテゴリーの文字色*/
    line-height:1;
  }

  .article-list .article .category-name a {
    color:#ffffff;
    text-decoration:none;
  }

  /*一覧表示時の続きをみるの表示設定です*/
  .article-list .article .entryPsLink, .article-list .article .entryPsLink a {
    font-size:18px;
    padding:10px;
    color:#68BEAA;/*▲▲▲ 続きを見るの文字色*/
  }
  .article-list .article .entryPsLink a:active {
    background:#68BEAA;/*▲▲▲ タップしたときの背景色です*/
    color:#ffffff;/*▲▲▲ タップしたときの背景色です*/
  }

  /*記事詳細*/

  .article-detail .article {
    border: 1px solid #68BEAA;/*▲▲▲ 記事部分の囲み枠色*/
    margin: 20px 0 ;
    background: #ffffff;/*▲▲▲ 記事の背景色*/
  }

  .article-detail .article h1 {
    display:block;
    background:#68BEAA;/*▲▲▲ 記事のタイトルの背景色*/
    padding: 10px;
    color:#ffffff;/*▲▲▲ 記事のタイトルの文字色*/
    font-size: 20px;
    font-weight:bold;
  }

  .article-detail .article img {
    max-width:100%;
  }


  .article-detail .article .top-btn-share {
    display:none;
  }

  .article-detail .article .bottom-btn-share {
    margin:10px;
  }

  /*記事の一番下に表示される日時の表示設定です*/
  .article-detail .article .data-time {
    text-align:right;
    margin:10px 10px 0 0;
  }

  .article-detail .article .date {
    display:inline;
    border: 1px solid #71696F;/*▲▲▲ 囲み枠色*/
    color: #71696F;/*▲▲▲ 文字色*/
    font-size: 10px;
    padding: 6px;
  }

  .article-detail .article li:active {
    color: #ffffff;/*▲▲▲ タップしたときの文字色*/
    background: #71696F;/*▲▲▲ タップしたときの背景色*/
  }

  /*記事の本文の設定です*/
  .article-detail .article p,
  .article-detail .article .entryText {
    padding:10px;
    line-height:1.6;
  }

  .article-detail .article .NinjaEntryCommercial {
    padding:10px;
    text-align:center;
  }

  /*タイトル下　カテゴリー表示部分の設定です*/
  .article-detail .article .category-name {
    text-align:right;
    color: #71696F;/*▲▲▲ カテゴリーの文字色*/
    line-height:1;
  }

  /*記事を読んだあとに表示されるRSSや広告エリアの設定です*/
  .article-detail .article .rssarea {
    min-height:300px;
    width:96%;
    margin:2% auto;
    /*border:1px dashed #63AF8C;/*▲▲▲ 点線の囲み枠の設定です。不必要な場合はこの行を消してください*/
  }

  /*記事詳細のコメント部分の表示設定です*/
  .article-detail .comments {
    background: #ffffff;/*▲▲▲ 背景色*/
  }

  .article-detail .comments {
    border: 1px solid #68BEAA;/*▲▲▲ 囲み枠色*/
    margin: 10px 0 ;
  }

  .article-detail .comments h4 {
    background:#68BEAA;/*▲▲▲ コメント一覧　見出し背景色*/
    color:#ffffff;/*▲▲▲ コメント一覧 見出し文字色*/
    padding: 10px;
    font-weight:bold;
  }

  .article-detail .comments .comment {
    margin:10px;
  }

  .article-detail .comments .comment p {
    line-height: 1.6;
    font-size:12px;
  }

  .article-detail .comments .comment .name {
    border-bottom: 1px solid #63AF8C;
    color:#63AF8C;/*▲▲▲ 名前文字色*/
    font-weight:bold;
    margin: 0 0 10px;
    font-size:12px;
  }

  .article-detail .comments .comment .name a {
    color:#63AF8C;/*▲▲▲ 名前リンク色*/
  }

  .article-detail .comments .comment .name a:active {
    color:#BFDBB2;/*▲▲▲ 名前リンク タップしたときの文字色*/
    background:none;
  }

  .article-detail .comments .comment .comment-res {
    margin:10px 10px 10px 30px;
    border-left: 3px solid #63AF8C;/*▲▲▲ 返信コメントの左側のボーダー色*/
    padding-left: 10px;
  }

  /*コメント入力欄の設定です*/
  .article-detail .comments .comment-form {
    margin:30px 0 0;
    text-align:left;
  }

  .article-detail .comments .comment-form .form-area {
    margin:10px;
    text-align:left;
  }

  .article-detail .comments .comment-form .discription {
    width:30%;
    margin:0 0 20px 2%;
    vertical-align:middle;
    float:left;
  }

  .article-detail .comments .comment-form .inputarea {
    margin: 0 0 20px 0;
    width:66%;
    vertical-align:middle;
    float:left;
  }

  .article-detail .comments .comment-form input {
    border: 1px solid #68BEAA;/*▲▲▲ コメント入力欄 囲み枠色*/
    line-height:1.6;
    width:100%;
  }

  .article-detail .comments .comment-form textarea {
    border: 1px solid #68BEAA;/*▲▲▲ コメント入力欄 囲み枠色*/
    line-height:1.6;
    width:100%;
  }

  .article-detail .comments .comment-form .comment-form-submit {
    text-align:center;
  }

  .article-detail .comments .comment-form .comment-form-submit input {
    background:#68BEAA;/*▲▲▲ コメント送信ボタン色*/
    color:#ffffff;/*▲▲▲ コメント送信ボタン文字色*/
    padding: 6px 10px;
    font-size:16px;
    margin: 20px 0;
    clear:both;
    width:50%;
  }

  .article-detail .comments .comment-form .comment-form-submit input:active,
  .article-detail .comments .comment-form .comment-form-submit input:active {
    background:#63AF8C;/*▲▲▲ コメント送信ボタン タップしたときの背景色*/
    border:1px solid #63AF8C;/*▲▲▲ コメント送信ボタン タップしたときの枠色*/
  }

  .article-detail .comments .comment-form .notice {
    margin:10px;
    color:#E97789;/*▲▲▲ コメント受付停止時の注意表記　文字色*/
    font-weight:bold;
    text-align:center;
  }


  /*広告スペース*/
  .center-column .ad-holizontal {
    text-align:center;
    margin:10px 0 0 -2%;
  }

  /*  右カラム設定　スマホレイアウトでは表示しません
  ------------------------------------------------------- */
  .right-column {
    display:none;
  }

  /*  フッター上の広告・RSSリンクエリア設定
  ------------------------------------------------------- */
  .ad-full {
    margin:10px 2%;
    border: 1px solid #68BEAA;/*▲▲▲ フッター上のRSSリンク・広告エリアの点線囲み枠です。必要ない場合はこの行を消してください*/
    clear:both;
    background:#ffffff;
  }
  /*  ページ送り
  ------------------------------------------------------- */
  .aside li {
    width:33%;
    float:left;
    text-align:center;
    margin:20px 0;
  }

  .aside .prev {
    text-align:left;
  }

  .aside .next {
    text-align:right;
  }

  /*  フッター設定 サイトの一番下の箇所の設定です
  ------------------------------------------------------- */
  #footer {
    background: #68BEAA url("") center;/*▲▲▲ ■　フッター背景色と背景画像 背景画像を設定する場合は""の中に画像URLを入れてください*/
    padding:10px;
    text-align: center;
    clear: both;
  }
  #footer p, #footer a {
    line-height:1.6;
    color: #fff;
    font-size: 12px;
  }
  #footer a:active {
    color:#BFDBB2;
    background:none;
  }

  .clear {
    clear: both;
    display: inline-block;
    width:0;
    height:0;
    margin:0;
    padding:0;
  }

  .pc {
    display:none;
  }

  .NinjaEntryCommercial{
    clear:both;
  }

  .ninja_onebutton {
    display:none;
  }
}


/*  2ch系スレッドのコピペのとき用設定
------------------------------------------------------- */

.thread {
  margin:0 !important;
}

.thread dt {
  font-size:12px;
}

.thread dd {
  line-height:1.6;
  margin:10px 0 20px;
}