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

 body {
     margin: 0 auto;
     color: 333;
     font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
     background-color: #edede6;
 }

 img {
     max-width: 100%;
 }

 ul {
     margin: 0 auto;
     padding: 0;
     list-style: none;
 }

 ul li {
     margin: 0 auto;
     padding: 0;
 }

 em {
     font-style: normal;
 }



 strong {
     color: #db3a34;
     font-size: 1.4em;
     font-weight: bold;
 }










 @media screen and (max-width: 767px) {

     /*-----------------------------------------------------------------*/
     /*767px以下の場合*/
     /*----------------------------------------------------------------------------*/
     /*スマホ・タブレットでは非表示*/
     .nosp {
         display: none;
     }

     section {
         padding: 30px 0;
         background-image: url(_image/bg1.png);
         background-color: #000;
         background-attachment: fixed;
         background-size: 50%;
     }



     /*-----------------------------------------------------------------*/
     /*メイン画像*/
     .CHAIN-top_main {
         text-align: center;
         width: 100%;
         padding-top: calc(1606 / 769 * 100%);
         /* calc(画像高さ ÷ 画像横幅 × 100%) */
         background: url(_image/top-mainSP.png) center center / cover no-repeat;
     }


     /*-----------------------------------------------------------------*/
     /*コンテンツ*/
     .CHAIN-inner {
         width: 95%;
         margin: 0 auto;
         padding: 30px 0;
     }

     /*２段組*/
     .CHAIN-inner ul.col2 {
         width: 100%;
         font-size: 0;
     }

     .CHAIN-inner ul.col2 li {
         display: inline-block;
         vertical-align: top;
         width: 48%;
         margin: 2% 1%;
         font-size: 14px;
         color: #fff;
     }

     /*4段組*/
     .CHAIN-inner ul.col4 {
         width: 100%;
         font-size: 0;
     }

     .CHAIN-inner ul.col4 li {
         display: inline-block;
         vertical-align: top;
         width: 31.333%;
         margin: 2% 1%;
         font-size: 14px;
         color: #fff;
     }

     /*5段組*/
     .CHAIN-inner ul.col5 {
         width: 100%;
         font-size: 0;
     }

     .CHAIN-inner ul.col5 li {
         display: inline-block;
         vertical-align: top;
         width: 31.333%;
         margin: 2% 1%;
         font-size: 14px;
         color: #fff;
     }

     /*ランキング*/
     .ranking {
         font-size: 18px;
         float: left;
         padding: 1px;
     }

     .col4 .ranking,
     .col5 .ranking {
         font-size: 12px;
         padding: 0 2px 0 0;
     }

     .ranking i {
         color: #fff;
         padding: 0 8px 0 0;
     }

     .ranking1 i {
         color: #e5b81a;
     }

     .ranking2 i {
         color: #b0b0b0;
     }

     .ranking3 i {
         color: #915a0b;
     }


     /*票数*/

     .number {
         text-align: center;
         border-radius: 100px;
         background-color: #c7c7c7;
         float: right;
         width: 55%;
         padding: 1px;
         color: #333;
         font-size: 16px;
         margin-bottom: 3px;
     }

     .col4 .number,
     .col5 .number {
         width: 50%;
         padding: 1px;
         font-size: 12px;
     }


     

     /*名前*/
     .name {
         font-size: 34px
     }

     .col4 .name,
     .col5 .name {
         font-size: 15px
     }

     .read {
         font-size: 12px;
         color: #aaa;
     }

     /*-----------------------------------------------------------------*/
     /*休憩コラム*/
     .break {
         padding: 30px 0;
         background-color: #f6f7e9;
         font-size: 0;
     }

     .break_inner {
         width: 95%;
         margin: 0 auto;
     }

     .break_txt {
         width: 100%;
         font-size: 14px;
         vertical-align: top;
         padding: 0 8px 0 0;
         box-sizing: border-box;
     }

     .break_img {
         width: 50%;
         margin: 0 auto;
     }

     .break_img img {
         border: 1px solid #666;
         width: 100%;
     }


     .break_txt_img {
         width: 7%;
         margin: 0 auto;
     }


     .break_txt_txt {
         text-align: center;
         display: inline-block;
         width: 100%;
         vertical-align: middle;

     }

     p.ttl {
         padding-top: 12px;
         border-top: 1px solid #dbdfcf;
         line-height: 1.5;
     }



     /*-----------------------------------------------------------------*/
     /*テーブル*/

     table {
         width: 95%;
         margin: 0 auto;
         color: #fff;
         font-size: 13px
     }

     tr:nth-child(odd) {
         background-color: #333;
     }

     .td1,
     .td4 {
         border-right: 1px solid #000;
         width: 10%;
         text-align: center;
     }

     .td2,
     .td5 {
         width: 10%;
         text-align: center;


     }

     .td3,
     .td6 {
         border-left: 1px solid #000;
         width: 80%;
         padding: 0 0 0 8px;

     }



     /*-----------------------------------------------------------------*/
     /*注意事項*/
     .note {
         padding: 20px;
         box-sizing: border-box;
         width: 100%;
         margin: 0 auto;
         font-size: 14px;
     }
     .note_ttl{font-size: 16px;}
     .note_strong{font-size: 24px;font-weight: bold;color: #ffd800}
     

     /*-----------------------------------------------------------------*/
     /*コメント*/
     .comment {
         background-color: #f4f4f4;
         padding: 30px 20px 20px;
         width: 100%;
         margin: 20px auto 0;
         position: relative;
         box-sizing: border-box;

     }
     .comment p{
         font-size: 16px;
     }
     .hujimoto {
         position: absolute;
         top: 1%;
         left: 50%;
         transform: translate(-50%, -50%);

     }

     .hujimoto img {
         width: 70%;

     }

     /*-----------------------------------------------------------------*/
     /*サンクス*/
     .thanks {
         width: 95%;
         margin: 0 auto 100px;
     }



     /*************************　　　コミックス　　　**************************/
     .comics {
         width: 95%;
         margin: 30px auto 0;
     }

     .comics-ttl {
         font-size: 14px;
         color: #fff;
         text-align: center;
         border-bottom: 1px solid #666;
         padding-bottom: 8px;
         margin: 0 auto 16px;
     }

     .comics ul {
         font-size: 0;
         padding: 0;
         margin: 0;

     }

     .comics ul li {
         padding: 0;
         margin: 0 auto;
         width: 48%;
         display: inline-block;
         vertical-align: middle;
     }

     .comics ul li a {
         font-size: 14px;
         text-decoration: none;
         text-align: center;
         color: #000;
         display: block;
         width: 90%;
         padding: 20px 0;
         margin: 10px auto;
         background-color: #fff;
     }

     /*************************　　　ジャンプ　　　**************************/
     .wj {
         width: 95%;
         margin: 0 auto;
     }

     .wj a {
         font-size: 14px;
         text-decoration: none;
         text-align: center;
         color: #000;
         display: block;
         padding: 20px 0;
         margin: 20px auto;
         background-color: #c20303;

     }

     /*************************　　　ジャンププラス　　　**************************/
     .plus {
         width: 95%;
         margin: 30px auto 0;
     }

     .plus-ttl {
         font-size: 14px;
         color: #fff;
         text-align: center;
         border-bottom: 1px solid #666;
         padding-bottom: 8px;
         margin: 0 auto 16px;
     }

     .plus ul {
         font-size: 0;
         margin: 0 auto;
         padding: 0;
     }

     .plus ul li {
         width: 47%;
         display: inline-block;
         padding: 0;
         margin: 0 auto;
     }

     .plus ul li a {
         text-align: center;
         display: block;
         width: 90%;
         margin: 10px auto;
     }
     .app{width: 83%;}

     /*************************　　　 SNS　　 　**************************/
     ul.sns-list {
         width: 1100px;
         margin: 30px auto 0;
         font-size: 0;
     }

     ul.sns-list li {
         display: inline-block;
         background: #54abee;
         width: 33.33333%;
         font-size: 0;
     }

     ul.sns-list li:nth-of-type(2) {
         background: #00ba01;
     }

     ul.sns-list li:nth-of-type(3) {
         background: #385495;
     }

     ul.sns-list li img {
         display: block;
         width: 54px;
         margin: 0 auto;
         padding: 4px 0;
     }


     /*************************　　フッター　　　**************************/
     footer {
         padding: 30px 0;
         background-color: #c60000;
         text-align: center;
         font-size: 11px;
     }

     /*************************　　メニュー　　　**************************/
     .CHAIN_menu {
         padding: 0;
         text-align: center;
         font-size: 12px;
         position: fixed;
         bottom: 20px;
     }

     .rank {
         display: inline-block;
         background-color: #fff;
         margin: 3px;
         border-radius: 100px;
     }

     .rank a {
         color: #000;
         text-decoration: none;
         display: block;
         padding: 5px
     }


     /*-------------------------------------------------------end@media*/
 }






     
 @media screen and (max-width: 320px) {
          .number {
         font-size: 14px;
     }

     .ranking i {
         padding: 0 1px 0 0;
     }

     .col4 .number,
     .col5 .number {
         font-size: 8px;
        width: 48%;

     }
        .CHAIN_menu {
         padding: 0;
         text-align: center;
         font-size: 11px;
         position: fixed;
         bottom: 20px;
     }

     .rank {
         display: inline-block;
         background-color: #fff;
         margin: 1px;
         border-radius: 100px;
     }

     .rank a {
         color: #000;
         text-decoration: none;
         display: block;
         padding: 4px
     }
     
     
     }




































 /*------------------------------------------------PC用ページ用設定*/

 @media screen and (min-width: 768px) {

     /*-----------------------------------------------------------------*/
     /*768px以上の場合*/
     /*-----------------------------------------------------------------*/
     /*PCでは非表示*/
     .nopc {
         display: none;
     }

     section {
         padding: 30px 0;
         background-image: url(_image/bg1.png);
         background-color: #000;
         background-attachment: fixed;
     }



     /*-----------------------------------------------------------------*/
     /*メイン画像*/
     .CHAIN-top_main {
         text-align: center;
         width: 100%;
         padding-top: calc(742 / 1400 * 100%);
         /* calc(画像高さ ÷ 画像横幅 × 100%) */
         background: url(_image/top-main.png) center center / cover no-repeat;
     }


     /*-----------------------------------------------------------------*/
     /*コンテンツ*/
     .CHAIN-inner {
         width: 950px;
         margin: 0 auto;
         padding: 30px 0;
     }

     /*２段組*/
     .CHAIN-inner ul.col2 {
         width: 750px;
         font-size: 0;
         margin: 0 auto;
     }

     .CHAIN-inner ul.col2 li {
         display: inline-block;
         vertical-align: top;
         width: 48%;
         margin: 2% 1%;
         font-size: 14px;
         color: #fff;
     }

     /*4段組*/
     .CHAIN-inner ul.col4 {
         width: 950px;
         font-size: 0;
     }

     .CHAIN-inner ul.col4 li {
         display: inline-block;
         vertical-align: top;
         width: 23%;
         margin: 2% 1%;
         font-size: 14px;
         color: #fff;
     }

     /*5段組*/
     .CHAIN-inner ul.col5 {
         width: 950px;
         font-size: 0;
     }

     .CHAIN-inner ul.col5 li {
         display: inline-block;
         vertical-align: top;
         width: 18%;
         margin: 2% 1%;
         font-size: 14px;
         color: #fff;
     }

     /*ランキング*/
     .ranking {
         font-size: 24px;
         float: left;
         padding: 1px;
     }

     .col4 .ranking,
     .col5 .ranking {
         font-size: 16px;
     }

     .ranking i {
         color: #fff;
         padding: 0 8px 0 0;
     }

     .ranking1 i {
         color: #e5b81a;
     }

     .ranking2 i {
         color: #b0b0b0;
     }

     .ranking3 i {
         color: #915a0b;
     }


     /*票数*/

     .number {
         text-align: center;
         border-radius: 100px;
         background-color: #c7c7c7;
         float: right;
         width: 30%;
         padding: 1px;
         color: #333;
         font-size: 16px;
     }

     .col4 .number,
     .col5 .number {
         width: 40%;
         padding: 1px;
         font-size: 12px;
     }

     /*名前*/
     .name {
         font-size: 34px
     }

     .col4 .name,
     .col5 .name {
         font-size: 16px
     }

     .read {
         font-size: 12px;
         color: #aaa;
     }

     /*-----------------------------------------------------------------*/
     /*休憩コラム*/
     .break {
         padding: 30px 0;
         background-color: #f6f7e9;
         font-size: 0;
     }

     .break_inner {
         width: 800px;
         margin: 0 auto;
     }

     .break_txt {
         display: inline-block;
         width: 70%;
         font-size: 16px;
         vertical-align: top;
         padding: 0 8px 0 0;
         box-sizing: border-box;
     }

     .break_img {
         display: inline-block;
         width: 30%;
     }

     .break_img img {
         border: 1px solid #666;
     }

     .break_txt_img {
         display: inline-block;
         width: 8%;
         vertical-align: middle;
         padding: 5px 0 0 0;
     }

     .break_txt_txt {
         display: inline-block;
         width: 85%;
         vertical-align: middle;

     }

     p.ttl {
         padding-top: 24px;
         border-top: 1px solid #dbdfcf;
         line-height: 1.8;
     }



     /*-----------------------------------------------------------------*/
     /*テーブル*/

     table {
         width: 700px;
         margin: 0 auto;
         color: #fff;
         font-size: 13px
     }

     tr:nth-child(odd) {
         background-color: #333;
     }

     .td1,
     .td4 {
         border-right: 1px solid #000;
         width: 10%;
         text-align: center;
     }

     .td2,
     .td5 {
         width: 10%;
         text-align: center;


     }

     .td3,
     .td6 {
         border-left: 1px solid #000;
         width: 80%;
         padding: 0 0 0 8px;

     }



     /*-----------------------------------------------------------------*/
     /*注意事項*/
     .note {
         background-color: #c60000;
         padding: 30px;
         width: 700px;
         margin: 0 auto;
         font-size: 14px;
         color: #fff;
     }
     .note_ttl{font-size: 16px;}
     .note_strong{font-size: 24px;font-weight: bold;color: #ffd800}
     
     

     /*-----------------------------------------------------------------*/
     /*コメント*/
     .comment {
         background-color: #f4f4f4;
         padding: 30px;
         width: 700px;
         margin: 20px auto 0;
         position: relative;
     }

     .hujimoto {
         position: absolute;

         top: 7%;
         left: 50%;
         transform: translate(-50%, -50%);

     }

     /*-----------------------------------------------------------------*/
     /*サンクス*/
     .thanks {
         width: 700px;
         margin: 0 auto 100px;
     }



     /*************************　　　コミックス　　　**************************/
     .comics {
         width: 500px;
         margin: 0 auto;
     }

     .comics-ttl {
         font-size: 14px;
         color: #fff;
         text-align: center;
         border-bottom: 1px solid #666;
         padding-bottom: 8px;
         margin: 0 auto 16px;
     }

     .comics ul {
         font-size: 0;

     }

     .comics ul li {
         width: 50%;
         display: inline-block;
         vertical-align: middle;
     }

     .comics ul li a {
         font-size: 14px;
         text-decoration: none;
         text-align: center;
         color: #000;
         display: block;
         width: 90%;
         padding: 20px 0;
         margin: 10px auto;
         background-color: #fff;
     }

     /*************************　　　ジャンプ　　　**************************/
     .wj {
         width: 500px;
         margin: 0 auto;
     }

     .wj a {
         font-size: 14px;
         text-decoration: none;
         text-align: center;
         color: #000;
         display: block;
         padding: 20px 0;
         margin: 20px auto;
         background-color: #c20303;

     }

     /*************************　　　ジャンププラス　　　**************************/
     .plus {
         width: 500px;
         margin: 30px auto 0;
     }

     .plus-ttl {
         font-size: 14px;
         color: #fff;
         text-align: center;
         border-bottom: 1px solid #666;
         padding-bottom: 8px;
         margin: 0 auto 16px;
     }

     .plus ul {
         font-size: 0;
     }

     .plus ul li {
         width: 50%;
         display: inline-block;
     }

     .plus ul li a {
         text-align: center;
         display: block;
         width: 90%;
         margin: 10px auto;
     }
     .app{width: 191px;}


     /*************************　　　 SNS　　 　**************************/
     ul.sns-list {
         width: 1100px;
         margin: 30px auto 0;
         font-size: 0;
     }

     ul.sns-list li {
         display: inline-block;
         background: #54abee;
         width: 33.33333%;
         font-size: 0;
     }

     ul.sns-list li:nth-of-type(2) {
         background: #00ba01;
     }

     ul.sns-list li:nth-of-type(3) {
         background: #385495;
     }

     ul.sns-list li img {
         display: block;
         width: 54px;
         margin: 0 auto;
         padding: 4px 0;
     }


     /*************************　　フッター　　　**************************/
     footer {
         padding: 30px 0;
         background-color: #c60000;
         text-align: center;
         font-size: 11px;
     }




     /*-------------------------------------------------------end@media*/
 }