@charset "UTF-8";

/*-----------------------------------------------------------------*/
/*----------------------------------------------------------共通設定*/
/*-----------------------------------------------------------------*/
/*カラーサンプル
/*グレー
	background:#F8F8F8;
/*グレーボーダー
	border-bottom: 1px solid #D0D0D0;
/*赤
	background: #CC1111;
/*青
	background: #334488;
/*リンク色:青
	color: #1177bb;
/*-----------------------------------------------------------------*/
/*-----------------------------------------------------------------*/
/*------------------------------------------------スマホ用ページ用設定*/
@media screen and (max-width: 767px) {
  /*-----------------------------------------------------------------*/
  /*スマホ用 767px以下の場合*/
  /*-----------------------------------------------------------------*/
  /*メイン*/
  .manganogokui {
    background: #cb000c;
    margin: 0 auto;
    padding: 0 0 10px 0;
    text-align: center;
  }
  /*メイン画像*/
  .manganogokui .menu {
  }
  ul.sns {
    margin: 0 0 24px;
  }
  /*ナビゲーション*/
  .manganogokui .menu ul {
    position: relative;
    margin: 5px;
    padding: 0;
    font-size: 0;
    list-style: none;
    text-align: center;
  }
  .manganogokui .menu ul li {
    display: inline-block;
    width: 50%;
    margin: 0;
    font-size: 0;
  }
  /*-----------------------------------------------------------------*/
  /*ナビゲーションリンク*/
  .manganogokui .menu ul li a {
    display: block;
    width: 100%;
    padding: 24% 0 0 0;
  }
  /*-----------------------------------------------------------------*/
  /*ボタン*/
  .manganogokui ul li a:hover {
    display: block;
    opacity: 1;
    filter: alpha(opacity=100);
    -ms-filter: 'alpha( opacity=100 )';
    background: transparent;
  }
  /*-----------------------------------------------------------------*/
  /*ナビゲーションリンク*/
  /*第1回*/
  .manganogokui .menu ul li.nav1 a:link,
  .manganogokui .menu ul li.nav1 a:visited {
    background: url(_image/menu1.png) no-repeat;
    background-size: 100%;
  }
  .manganogokui .menu ul li.nav1 a:hover {
    background: url(_image/menu1_on.png) no-repeat;
    background-size: 100%;
  }
  .manganogokui .menu ul li.nav1.on a:link,
  .manganogokui .menu ul li.nav1.on a:visited {
    background: url(_image/menu1_on.png) no-repeat;
    background-size: 100%;
  }
  /*第2回*/
  .manganogokui .menu ul li.nav2 a:link,
  .manganogokui .menu ul li.nav2 a:visited {
    background: url(_image/menu2.png) no-repeat;
    background-size: 100%;
  }
  .manganogokui .menu ul li.nav2 a:hover {
    background: url(_image/menu2_on.png) no-repeat;
    background-size: 100%;
  }
  .manganogokui .menu ul li.nav2.on a:link,
  .manganogokui .menu ul li.nav2.on a:visited {
    background: url(_image/menu2_on.png) no-repeat;
    background-size: 100%;
  }
  /*第3回*/
  .manganogokui .menu ul li.nav3 a:link,
  .manganogokui .menu ul li.nav3 a:visited {
    background: url(_image/menu3.png) no-repeat;
    background-size: 100%;
  }
  .manganogokui .menu ul li.nav3 a:hover {
    background: url(_image/menu3_on.png) no-repeat;
    background-size: 100%;
  }
  .manganogokui .menu ul li.nav3.on a:link,
  .manganogokui .menu ul li.nav3.on a:visited {
    background: url(_image/menu3_on.png) no-repeat;
    background-size: 100%;
  }
  /*第4回*/
  .manganogokui .menu ul li.nav4 a:link,
  .manganogokui .menu ul li.nav4 a:visited {
    background: url(_image/menu4.png) no-repeat;
    background-size: 100%;
  }
  .manganogokui .menu ul li.nav4 a:hover {
    background: url(_image/menu4_on.png) no-repeat;
    background-size: 100%;
  }
  .manganogokui .menu ul li.nav4.on a:link,
  .manganogokui .menu ul li.nav4.on a:visited {
    background: url(_image/menu4_on.png) no-repeat;
    background-size: 100%;
  }
  /*第5回*/
  .manganogokui .menu ul li.nav5 a:link,
  .manganogokui .menu ul li.nav5 a:visited {
    background: url(_image/menu5.png) no-repeat;
    background-size: 100%;
  }
  .manganogokui .menu ul li.nav5 a:hover {
    background: url(_image/menu5_on.png) no-repeat;
    background-size: 100%;
  }
  .manganogokui .menu ul li.nav5.on a:link,
  .manganogokui .menu ul li.nav5.on a:visited {
    background: url(_image/menu5_on.png) no-repeat;
  }
  /*第5回*/
  .manganogokui .menu ul li.nav6 a:link,
  .manganogokui .menu ul li.nav6 a:visited {
    background: url(_image/menu6.png) no-repeat;
    background-size: 100%;
  }
  .manganogokui .menu ul li.nav6 a:hover {
    background: url(_image/menu6_on.png) no-repeat;
    background-size: 100%;
  }
  .manganogokui .menu ul li.nav6.on a:link,
  .manganogokui .menu ul li.nav6.on a:visited {
    background: url(_image/menu6_on.png) no-repeat;
    background-size: 100%;
  }
  /*-----------------------------------------------------------------*/
  /*次へボタン*/
  .manganogokui .next {
    font-size: 28px;
    margin: 20px 10px 20px;
    background: #ffd200;
    border-radius: 10px; /* CSS3草案 */
    -webkit-border-radius: 10px; /* Safari,Google Chrome用 */
    -moz-border-radius: 10px; /* Firefox用 */
  }
  .manganogokui .next a {
    display: block;
    padding: 16px 0 12px;
    font-size: 18px;
    color: #000;
    font-weight: bold;
    text-decoration: none;
  }
  /*-----------------------------------------------------------------*/
  /*マンガ*/
  .manganogokui .main {
    background: #fff;
    margin: 12px 10px;
    padding: 0px 0 20px 0;
  }
  .manganogokui .main strong {
    display: block;
    padding: 12px 8px 4px;
    margin: 0 0 4px;
    border-bottom: 1px solid #d0d0d0;
  }
  .manganogokui .main img {
    margin: 0 auto 30px auto;
  }
  /*-----------------------------------------------------------------*/
  /*取材漫画家*/
  .mgttl {
    margin: 0 auto;
    margin: 20px 10px 20px;
    font-size: 14px;
    text-align: left;
    border: none;
  }
  /*-----------------------------------------------------------------*/
  /*バックナンバー*/
  .manganogokui .main .mglink {
    overflow: scroll;
    width: 94%;
    height: 400px;
    margin: 0 auto;
    padding: 0;
    list-style: none;
    text-align: left;
  }
  .manganogokui .main .mglink li {
    width: 100%;
    margin: 0 auto;
    padding: 0;
    font-size: 14px;
    border-bottom: #ccc 1px solid;
  }
  .manganogokui .main .mglink li.ttl {
    color: #f00;
    font-weight: bold;
    padding: 10px 0 0 0;
  }
  .manganogokui .main .mglink li a {
    display: block;
    text-decoration: none;
    padding: 5px 0;
  }
  .manganogokui .main .mglink li a:hover {
    background: #f1f1f1;
  }
  /*-----------------------------------------------------------------*/
  /*-------------------------------------------------------インタビュー*/
  /*-----------------------------------------------------------------*/
  /*インタビュー*/
  .interview {
    margin: 0 auto;
    text-align: left;
  }
  /*画像*/
  img.ph {
    max-width: 90%;
    margin: 0 auto;
  }
  .interview h3 {
    font-size: 20px;
    line-height: 1.2;
    padding: 10px 8px;
    border-bottom: 1px #ccc solid;
    margin: 0 0 10px 0;
    font-weight: bold;
    color: #c30;
  }
  .interview p {
    font-size: 14px;
    line-height: 1.6;
    color: #09c;
    letter-spacing: 0.5pt;
    margin: 0;
    padding: 10px 12px 0;
  }
  .interview p.author {
    font-size: 14px;
    line-height: 1.6;
    color: #545e55;
    letter-spacing: 0.5pt;
    margin: 0;
  }
  hr {
    border: 0;
    height: 0;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    border-bottom: 1px solid rgba(255, 255, 255, 0.3);
    margin: 10px 0;
  }
  /*-----------------------------------------------------------------*/
  /*メニュー*/
  .interview .interviewMenu {
  }
  .interview .interviewMenu ul {
    margin: 0 auto;
    padding: 20px 0;
    list-style: none;
    font-size: 0;
    text-align: center;
  }
  .interview .interviewMenu ul li {
    display: inline-block;
    width: 40px;
    height: 40px;
    margin: 0 2px;
    padding: 0;
    font-size: 0;
    line-height: 40px;
    vertical-align: middle;
  }

  .interview .interviewMenu ul li:first-child {
    display: inline-block;
    height: 40px;
    margin: 0;
    padding: 0 4px 0 0;
    font-size: 14px;
    line-height: 40px;
    color: #333;
    vertical-align: middle;
  }
  .interview .interviewMenu ul li a:link,
  .interview .interviewMenu ul li a:visited {
    display: block;
    width: 40px;
    height: 40px;
    background: #ffd200;
    font-size: 16px;
    line-height: 40px;
    text-align: center;
    border-radius: 2px;
  }
  .interview .interviewMenu ul li a:hover {
    display: block;
    width: 40px;
    height: 40px;
    background: #ffd200;
    font-size: 16px;
    line-height: 40px;
    text-align: center;
    border-radius: 2px;
  }
  /*-------------------------------------------------------end@media*/
}

/*-----------------------------------------------------------------*/
/*---------------------------------------------------PC用ページ用設定*/
@media screen and (min-width: 768px) {
  /*-----------------------------------------------------------------*/
  /*PC用 768px以上の場合*/
  /*-----------------------------------------------------------------*/
  /*メイン*/
  .manganogokui {
    width: 670px;
    background: #cb000c;
    margin: 0 auto;
    padding: 0 0 10px 0;
    text-align: center;
  }
  /*メイン画像*/
  .manganogokui .menu {
    position: relative;
    height: 413px;
    background: url(_image/main.jpg);
  }

  ul.sns {
    margin: 0 0 24px;
  }

  /*ナビゲーション*/
  .manganogokui .menu ul {
    position: absolute;
    width: 651px;
    margin: 0 0 0 -325px;
    padding: 0;
    font-size: 0;
    list-style: none;
    text-align: center;
    left: 50%;
    top: 280px;
  }
  .manganogokui .menu ul li {
    display: inline-block;
    width: 207px;
    height: 50px;
    margin: 0 5px;
    font-size: 0;
  }
  /*-----------------------------------------------------------------*/
  /*ナビゲーションリンク*/
  .manganogokui .menu ul li a {
    display: block;
    width: 207px;
    height: 50px;
  }
  /*-----------------------------------------------------------------*/
  /*ボタン*/
  .manganogokui ul li a:hover {
    display: block;
    opacity: 1;
    filter: alpha(opacity=100);
    -ms-filter: 'alpha( opacity=100 )';
    background: transparent;
  }
  /*-----------------------------------------------------------------*/
  /*ナビゲーションリンク*/
  /*第1回*/
  .manganogokui .menu ul li.nav1 a:link,
  .manganogokui .menu ul li.nav1 a:visited {
    background: url(_image/menu1.png);
  }
  .manganogokui .menu ul li.nav1 a:hover {
    background: url(_image/menu1_on.png);
  }
  .manganogokui .menu ul li.nav1.on a:link,
  .manganogokui .menu ul li.nav1.on a:visited {
    background: url(_image/menu1_on.png);
  }
  /*第2回*/
  .manganogokui .menu ul li.nav2 a:link,
  .manganogokui .menu ul li.nav2 a:visited {
    background: url(_image/menu2.png);
  }
  .manganogokui .menu ul li.nav2 a:hover {
    background: url(_image/menu2_on.png);
  }
  .manganogokui .menu ul li.nav2.on a:link,
  .manganogokui .menu ul li.nav2.on a:visited {
    background: url(_image/menu2_on.png);
  }
  /*第3回*/
  .manganogokui .menu ul li.nav3 a:link,
  .manganogokui .menu ul li.nav3 a:visited {
    background: url(_image/menu3.png);
  }
  .manganogokui .menu ul li.nav3 a:hover {
    background: url(_image/menu3_on.png);
  }
  .manganogokui .menu ul li.nav3.on a:link,
  .manganogokui .menu ul li.nav3.on a:visited {
    background: url(_image/menu3_on.png);
  }
  /*第4回*/
  .manganogokui .menu ul li.nav4 a:link,
  .manganogokui .menu ul li.nav4 a:visited {
    background: url(_image/menu4.png);
  }
  .manganogokui .menu ul li.nav4 a:hover {
    background: url(_image/menu4_on.png);
  }
  .manganogokui .menu ul li.nav4.on a:link,
  .manganogokui .menu ul li.nav4.on a:visited {
    background: url(_image/menu4_on.png);
  }
  /*第5回*/
  .manganogokui .menu ul li.nav5 a:link,
  .manganogokui .menu ul li.nav5 a:visited {
    background: url(_image/menu5.png);
  }
  .manganogokui .menu ul li.nav5 a:hover {
    background: url(_image/menu5_on.png);
  }
  .manganogokui .menu ul li.nav5.on a:link,
  .manganogokui .menu ul li.nav5.on a:visited {
    background: url(_image/menu5_on.png);
  }
  /*第5回*/
  .manganogokui .menu ul li.nav6 a:link,
  .manganogokui .menu ul li.nav6 a:visited {
    background: url(_image/menu6.png);
  }
  .manganogokui .menu ul li.nav6 a:hover {
    background: url(_image/menu6_on.png);
  }
  .manganogokui .menu ul li.nav6.on a:link,
  .manganogokui .menu ul li.nav6.on a:visited {
    background: url(_image/menu6_on.png);
  }
  /*-----------------------------------------------------------------*/
  /*次へボタン*/
  .manganogokui .next {
    font-size: 28px;
    margin: 20px auto 20px;
    width: 610px;
    background: #ffd200;
    border-radius: 10px; /* CSS3草案 */
    -webkit-border-radius: 10px; /* Safari,Google Chrome用 */
    -moz-border-radius: 10px; /* Firefox用 */
  }
  .manganogokui .next a {
    display: block;
    padding: 16px 0 14px;
    font-size: 18px;
    color: #000;
    font-weight: bold;
    text-decoration: none;
  }
  /*-----------------------------------------------------------------*/
  /*マンガ*/
  .manganogokui .main {
    width: 650px;
    background: #fff;
    margin: 0 auto;
    padding: 0 0 20px 0;
  }
  .manganogokui .main img {
    margin: 0 auto 30px auto;
  }
  /*-----------------------------------------------------------------*/
  /*取材漫画家*/
  .mgttl {
    width: 610px;
    margin: 0 auto;
    padding: 10px 0;
    font-size: 14px;
    text-align: left;
    border: none;
  }
  /*-----------------------------------------------------------------*/
  /*バックナンバー*/
  .manganogokui .main .mglink {
    overflow: scroll;
    height: 400px;
    width: 610px;
    margin: 0 auto;
    padding: 0;
    list-style: none;
    text-align: left;
  }
  .manganogokui .main .mglink li {
    width: 610px;
    margin: 0;
    padding: 0;
    font-size: 14px;
    border-bottom: #ccc 1px solid;
  }
  .manganogokui .main .mglink li.ttl {
    color: #f00;
    font-weight: bold;
    padding: 10px 0 0 0;
  }
  .manganogokui .main .mglink li a {
    display: block;
    text-decoration: none;
    padding: 5px 0;
  }
  .manganogokui .main .mglink li a:hover {
    background: #f1f1f1;
  }
  /*-----------------------------------------------------------------*/
  /*-------------------------------------------------------インタビュー*/
  /*-----------------------------------------------------------------*/
  /*インタビュー*/
  .interview {
    margin: 0 auto;
    text-align: left;
    width: 570px;
  }
  /*画像*/
  img.ph {
    width: 500px;
    margin: 0 auto;
  }
  .interview h3 {
    font-size: 24px;
    line-height: 1.6;
    padding: 10px 0;
    border-bottom: 1px #ccc solid;
    margin: 0 0 10px 0;
    font-weight: bold;
    color: #c30;
  }
  .interview p {
    font-size: 14px;
    line-height: 1.6;
    color: #09c;
    letter-spacing: 0.5pt;
    margin: 0 0 15px 0;
  }
  .interview p.author {
    font-size: 14px;
    line-height: 1.6;
    color: #545e55;
    letter-spacing: 0.5pt;
    margin: 0 0 15px 0;
  }
  hr {
    border: 0;
    height: 0;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    border-bottom: 1px solid rgba(255, 255, 255, 0.3);
    margin: 10px 0;
  }
  /*-----------------------------------------------------------------*/
  /*メニュー*/
  .interview .interviewMenu {
  }
  .interview .interviewMenu ul {
    margin: 0 auto;
    padding: 20px 0;
    list-style: none;
    font-size: 0;
    text-align: center;
  }
  .interview .interviewMenu ul li {
    display: inline-block;
    width: 40px;
    height: 40px;
    margin: 0 2px;
    padding: 0;
    font-size: 0;
    line-height: 40px;
    vertical-align: middle;
  }
  .interview .interviewMenu ul li:first-child {
  }
  .interview .interviewMenu ul li a:link,
  .interview .interviewMenu ul li a:visited {
    display: block;
    width: 40px;
    height: 40px;
    background: #ffd200;
    font-size: 16px;
    line-height: 40px;
    text-align: center;
    border-radius: 2px;
  }
  .interview .interviewMenu ul li a:hover {
    display: block;
    width: 40px;
    height: 40px;
    background: #ffd200;
    font-size: 16px;
    line-height: 40px;
    text-align: center;
    border-radius: 2px;
  }
  /*-------------------------------------------------------end@media*/
}