@charset "UTF-8";
/******初期設定ここから******/
html, body, div, h1, h2, h3, h4, h5, h6, p, blockquote, pre,
addres, ul, ol, dl, dt, dd, table, th, td, form, fieldset, header, article, figure, section {
  margin: 0;
  padding: 0;
  line-height: 140%;
  font-familu: "Hiragino Kaku Gothic ProN", meiryo, sans-serif; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

ul, ol {
  list-style: none;
  /*黒丸を消す*/ }

a {
  text-decoration: none;
  /*下線を消す*/ }

img {
  border: 0; }

ing, input {
  vertical-aligin: bottom; }

/*クリア*/
.clearfix:after {
  visibility: hidden;
  height: 0;
  display: block;
  font-size: 0;
  content: " ";
  clear: both; }

/******初期設定ここまで******/
/***********コンテンツエリア***********/
html, body, div, h1, h2, h3, h4, h5, h6, p, blockquote, pre,
addres, ul, ol, dl, dt, dd, table, th, td, form, fieldset, header, article, figure, section {
  margin: 0;
  padding: 0;
  line-height: 140%;
  font-familu: "Hiragino Kaku Gothic ProN", meiryo, sans-serif; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

ul, ol {
  list-style: none;
  /*黒丸を消す*/ }

a {
  text-decoration: none;
  /*下線を消す*/ }

img {
  border: 0; }

ing, input {
  vertical-aligin: bottom; }

button {
  background: none;
  padding: 0px;
  margin: 0px; }

/*クリア*/
.clearfix:after {
  visibility: hidden;
  height: 0;
  display: block;
  font-size: 0;
  content: " ";
  clear: both; }

/******初期設定ここまで******/
body {
  background: url(../common/bg_red.png);
  margin: 0;
  padding: 0; }

#main {
  width: 950px;
  margin: 0 auto;
  background: #eee;
  padding: 0 10px; }

header {
  background: url(../common/head_bg.jpg?2) no-repeat center bottom; }

header h1 {
  text-align: center;
  padding: 40px 0; }

@media (max-width: 768px) {
  #main {
    width: 100%;
    padding: 0px; }

  header {
    text-align: center;
    background-size: 100%; }
    header img {
      width: 80%;
      height: auto; } }
nav {
  background: #ddd;
  padding: 5px 0; }
  nav ul {
    width: 940px;
    margin: 0 auto;
    overflow: auto; }
  nav li {
    display: inline; }

@media (max-width: 768px) {
  nav {
    padding: 2px 0; }
    nav ul {
      width: 100%;
      margin: 0 auto;
      display: table; }
    nav li {
      display: block;
      float: left;
      width: 50%;
      line-height: 0;
      padding: 2px 0; }
    nav img {
      width: 100%;
      height: auto; } }
#contents {
  background: url(../top/bg_gold.jpg);
  border-left: 7px solid #99090d;
  border-right: 7px solid #99090d;
  padding: 50px 0; }

.texttyuui {
  width: 800px;
  margin: 0 auto;
  margin-bottom: 50px;
  background: #fff2f0;
  border: 2px dotted #d1697a; }
  .texttyuui p.tyuui {
    background: url(../top/tyuui.png) no-repeat left center;
    padding: 20px 10px 20px 120px;
    margin: 0 30px;
    color: #362926;
    font-size: 16px;
    line-height: 150%; }

section.rankarea {
  width: 800px;
  margin: 0 auto;
  margin-bottom: 50px;
  background: url(../top/bg_rank.jpg);
  border: 1px solid #ddd;
  border-radius: 10px;
  /* CSS3草案 */
  -webkit-border-radius: 10px;
  /* Safari,Google Chrome用 */
  -moz-border-radius: 10px;
  /* Firefox用 */
  display: table; }

div.rank, div.rankmain {
  display: table-cell; }

div.rank {
  width: 120px;
  background: url(../top/rankmaku.jpg?3) repeat-y center center;
  text-align: center;
  vertical-align: middle; }

div.rankmain {
  vertical-align: top;
  padding: 25px 30px 25px 0; }
  div.rankmain ul {
    margin-top: 20px; }
  div.rankmain li {
    background: #eee;
    border: 1px solid #ddd;
    border-radius: 5px;
    /* CSS3草案 */
    -webkit-border-radius: 5px;
    /* Safari,Google Chrome用 */
    -moz-border-radius: 5px;
    /* Firefox用 */
    padding: 10px 10px 5px 10px;
    text-align: center; }
    div.rankmain li button {
      border: none;
      background: none; }

div.sampleplayer {
  margin: 20px 0; }
  div.sampleplayer iframe {
    width: 100%;
    height: 215px; }

.in_rmain {
  display: table;
  widows: 100%; }

div.rimg, div.rtxt {
  display: table-cell; }

div.rimg {
  text-align: left;
  width: 270px; }

div.rtxt {
  width: 380px;
  vertical-align: top; }
  div.rtxt h2 {
    width: 100%;
    font-size: 18px;
    color: #3975a7;
    border-bottom: 2px dotted #bbb;
    margin-bottom: 15px;
    padding-bottom: 15px; }
  div.rtxt p {
    font-size: 14px;
    line-height: 160%; }

div.rsetumei {
  margin: 15px 0 10px 0; }
  div.rsetumei p {
    font-size: 14px;
    line-height: 160%;
    border: 1px solid #ccc;
    padding: 10px;
    height: auto;
    background: #eee; }

@media (max-width: 768px) {
  .texttyuui {
    width: auto;
    margin: 0 auto;
    margin-bottom: 50px; }
    .texttyuui p.tyuui {
      background: url(../top/tyuui.png) no-repeat top center;
      padding: 100px 10px 10px 10px;
      margin: 10px 10px;
      color: #362926;
      font-size: 14px;
      line-height: 150%;
      font-family: "MS PGothic", "Osaka", Arial, sans-serif; }

  section.rankarea {
    width: 100%; }

  div.rank, div.rankmain {
    display: block; }

  div.rank {
    width: 100%;
    background: url(../top/rankmaku_yoko.jpg) no-repeat center center;
    line-height: 0; }

  div.rankmain {
    vertical-align: top;
    padding: 25px 0 25px 0; }
    div.rankmain ul {
      margin-top: 20px; }
    div.rankmain li {
      padding: 10px 0px 5px 0px; }

  div.sampleplayer {
    margin: 20px 0;
    -webkit-overflow-scrolling: touch;
    position: relative;
    width: 100%;
    height: 215px;
    overflow: auto; }
    div.sampleplayer iframe {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%; }

  div.rimg, div.rtxt {
    display: block; }

  div.rimg {
    padding-right: 0;
    width: 100%; }
    div.rimg img {
      width: 100%;
      height: auto; }

  div.rtxt {
    vertical-align: top;
    width: 100%;
    overflow: hidden; }
    div.rtxt h2 {
      font-size: 18px;
      color: #3975a7;
      border-bottom: 2px dotted #bbb;
      margin-bottom: 15px;
      padding: 5px 15px; }
    div.rtxt p {
      padding: 10px; } }
.textOverflowTest4 {
  overflow: auto;
  border: 1px solid #ccc;
  padding: 10px;
  height: auto;
  background: #eee; }

footer {
  width: 100%;
  background-color: #FFF;
  background: #FFF url(../common/footer_line.png) repeat-x;
  background-position: 0px -5px; }

div#in-footer {
  margin-top: 30px;
  padding: 50px 0 100px 0;
  width: 950px;
  margin: 0 auto; }
  div#in-footer p {
    color: #4b5c27; }
  div#in-footer p a {
    color: #4b5c27; }
  div#in-footer p.footlink {
    float: left; }
  div#in-footer p.copy {
    float: right; }

@media (max-width: 768px) {
  .textOverflowTest4 {
    overflow: hidden;
    border: 1px solid #ccc;
    padding: 0px;
    height: 70px;
    background: #eee; }

  footer {
    width: 100%;
    background-color: #FFF;
    background: #FFF url(../common/footer_line.png) repeat-x;
    background-position: 0px -5px; }

  div#in-footer {
    margin-top: 30px;
    padding: 50px 0;
    width: 100%;
    margin: 0 auto; }
    div#in-footer p {
      color: #4b5c27;
      font-size: 12px;
      text-align: center; }
    div#in-footer p a {
      color: #4b5c27; }
    div#in-footer p.footlink {
      float: none;
      margin-bottom: 10px; }
    div#in-footer p.copy {
      float: none;
      margin: 0; } }
.prdarea {
  width: 800px;
  margin: 0 auto;
  margin-bottom: 50px;
  background: url(../top/bg_rank.jpg);
  border: 1px solid #ddd;
  border-radius: 10px;
  /* CSS3草案 */
  -webkit-border-radius: 10px;
  /* Safari,Google Chrome用 */
  -moz-border-radius: 10px;
  /* Firefox用 */
  display: table;
  padding: 30px 0; }

.prdtitle {
  background: url(../product/image/bar_product.jpg) no-repeat;
  width: 755px;
  height: 82px;
  margin: 0 auto; }
  .prdtitle h1 {
    height: 82px;
    vertical-align: middle;
    font-size: 16px;
    display: table-cell;
    padding: 0 30px 0 120px;
    color: #333; }

.prdmain {
  width: 755px;
  margin: 0 auto;
  display: table;
  margin-top: 20px; }

.primg, .prlink {
  display: table-cell;
  vertical-align: top; }

.prlink {
  text-align: right; }
  .prlink li {
    background: #eee;
    border: 1px solid #ddd;
    margin-bottom: 15px;
    text-align: center;
    padding: 10px 0 5px 0;
    border-radius: 10px;
    /* CSS3草案 */
    -webkit-border-radius: 10px;
    /* Safari,Google Chrome用 */
    -moz-border-radius: 10px;
    /* Firefox用 */ }

@media (max-width: 768px) {
  .prdarea {
    width: 100%;
    display: block;
    padding: 15px 0; }

  .prdtitle {
    background: none;
    width: 100%;
    height: 82px;
    margin: 0 auto; }
    .prdtitle h1 {
      padding: 0 10px;
      font-size: 18px;
      color: #3975a7;
      border-bottom: 2px dotted #bbb;
      margin-bottom: 15px;
      padding: 5px 15px; }

  .prdmain {
    width: 100%;
    margin: 0 auto;
    display: block;
    margin-top: 20px; }

  .primg, .prlink {
    display: block;
    vertical-align: top; }

  .primg img {
    width: 100%;
    height: auto; }

  .prlink {
    text-align: right;
    margin: 10px 0; }
    .prlink li {
      background: #eee;
      border: 1px solid #ddd;
      margin-bottom: 15px;
      text-align: center;
      padding: 10px 0 5px 0;
      border-radius: 10px;
      /* CSS3草案 */
      -webkit-border-radius: 10px;
      /* Safari,Google Chrome用 */
      -moz-border-radius: 10px;
      /* Firefox用 */ } }
/****展開後のページ****/
#subcontents {
  background: url(../common/bg_silver.jpg);
  border-left: 7px solid #99090d;
  border-right: 7px solid #99090d;
  padding: 0 0 0px 0;
  overflow: hidden; }
  #subcontents h1 {
    margin-bottom: 50px; }

#text1c {
  width: 800px;
  margin: 0 auto; }
  #text1c p {
    font-size: 20px;
    line-height: 280%; }
    #text1c p span {
      background: url(../common/pinksita.jpg) repeat-x;
      padding: 3px 0; }
  #text1c h2 {
    font-size: 30px;
    text-align: center;
    background: url(../common/sitasen.png) no-repeat bottom center;
    padding-bottom: 40px;
    margin: 40px 0; }
  #text1c dl {
    display: table;
    padding-top: 40px; }
  #text1c dd, #text1c dt {
    display: table-cell;
    vertical-align: top; }
  #text1c dd {
    padding-left: 25px; }
    #text1c dd p {
      text-align: center;
      margin: 0px 0 30px 0;
      font-size: 14px;
      color: #333; }
  #text1c h3 {
    text-align: center;
    margin: 50px 0; }

@media (max-width: 768px) {
  #subcontents {
    overflow: hidden; }
    #subcontents h1 img {
      width: 100%;
      height: auto; }

  #text1c {
    width: 100%;
    margin: 0 auto; }
    #text1c p {
      font-size: 16px;
      line-height: 200%;
      padding: 0 10px; }
    #text1c h2 {
      font-size: 25px;
      padding: 0 10px 40px; }
    #text1c dl {
      display: block;
      padding-top: 20px; }
    #text1c dd, #text1c dt {
      display: block;
      vertical-align: top; }
    #text1c dd {
      padding-left: 0px;
      padding-top: 20px; }
      #text1c dd img {
        width: 90%;
        height: auto; }
    #text1c h3 {
      text-align: center;
      margin: 50px 0; }
      #text1c h3 img {
        width: 90%;
        height: auto; } }
#subredarea {
  background: url(../common/bg_redcommon.jpg);
  border-left: 7px solid #99090d;
  border-right: 7px solid #99090d;
  padding: 60px 0 50px 0;
  margin: 0; }
  #subredarea h1 {
    margin-bottom: 30px;
    text-align: center; }
  #subredarea nav {
    background: none;
    margin: 0; }

.btsample {
  background: #333;
  border: 1px solid #666;
  width: 740px;
  padding: 10px;
  text-align: center;
  margin: 20px auto 0;
  line-height: 0; }

.headimg {
  text-align: center;
  padding: 20px 0; }

@media (max-width: 768px) {
  #subredarea h1 {
    margin-bottom: 30px;
    text-align: center; }
    #subredarea h1 img {
      width: 90%;
      height: auto; }

  .btsample {
    background: #333;
    border: 1px solid #666;
    width: 100%;
    padding: 0px;
    -webkit-overflow-scrolling: touch;
    overflow: auto; }
    .btsample iframe {
      width: 100%;
      height: 215px; }

  .headimg {
    text-align: center;
    padding: 20px 0; } }
#bunnerarea {
  width: 700px;
  margin: 0 auto;
  background: none; }
  #bunnerarea ul {
    width: auto;
    display: table;
    width: 675px;
    text-align: center;
    margin: 0 auto; }
  #bunnerarea li {
    display: table-cell;
    text-align: center;
    vertical-align: middle;
    width: 323px;
    height: 299px;
    background: url(../binfo/image/bunnerbg.png?1) no-repeat; }
  #bunnerarea .bnleft {
    padding-left: 10px; }
  #bunnerarea .bnright {
    padding-right: 10px; }

ul.step3 {
  width: 820px;
  margin-top: 70px !important;
  margin: 0 auto; }
  ul.step3 li {
    height: 120px;
    margin-bottom: 20px; }
  ul.step3 .s1 {
    background: url(../binfo/image/step1.png) no-repeat; }
  ul.step3 .s2 {
    background: url(../binfo/image/step2.png) no-repeat; }
  ul.step3 .s3 {
    background: url(../binfo/image/step3.png) no-repeat; }
  ul.step3 p {
    padding: 25px 0 0 250px;
    font-size: 24px !important; }

.midasiy {
  text-align: center;
  font-size: 55px;
  line-height: 120%;
  color: #f4c816;
  font-weight: bold;
  margin-bottom: 100px; }

@media (max-width: 768px) {
  #bunnerarea {
    width: 100%;
    margin: 0 auto;
    background: none; }
    #bunnerarea ul {
      width: auto;
      display: table;
      width: 100%;
      text-align: center;
      background-color: #fff;
      border-top: 5px solid #ddd;
      border-bottom: 5px solid #ddd; }
    #bunnerarea li {
      display: table-cell;
      text-align: center;
      vertical-align: middle;
      padding: 60px 0;
      width: 49%;
      height: auto;
      background: none; }
      #bunnerarea li img {
        width: 50%;
        height: auto; }
    #bunnerarea .bnleft {
      padding-left: 0px;
      border-right: 1px dotted #ddd; }
    #bunnerarea .bnright {
      padding-right: 0px; }

  ul.step3 {
    width: 100%;
    margin-top: 70px !important;
    margin: 0 auto; }
    ul.step3 li {
      height: auto;
      margin-bottom: 20px; }
    ul.step3 .s1 {
      background: url(../binfo/image/sp_step1.jpg?1) no-repeat; }
    ul.step3 .s2 {
      background: url(../binfo/image/sp_step2.jpg?1) no-repeat; }
    ul.step3 .s3 {
      background: url(../binfo/image/sp_step3.jpg?1) no-repeat; }
    ul.step3 p {
      padding: 0px 0 0 0px;
      padding-top: 75px !important;
      font-size: 24px !important; }

  .midasiy {
    text-align: center;
    font-size: 30px;
    line-height: 120%;
    color: #f4c816;
    font-weight: bold;
    margin-bottom: 100px; } }
.himgtxt {
  display: table;
  width: 100%; }

.hi_limg {
  display: table-cell;
  width: 50%;
  vertical-align: middle;
  line-height: 0; }
  .hi_limg img {
    width: 100%;
    height: auto; }

.hi_rtxt {
  display: table-cell;
  vertical-align: middle;
  width: 50%;
  line-height: 0; }
  .hi_rtxt img {
    width: 100%;
    height: auto; }

.text_l {
  text-align: left;
  padding-left: 20px;
  margin: 30px 0;
  margin-left: auto;
  width: 90%;
  line-height: 0; }
  .text_l p {
    font-size: 18px;
    margin: 10px 0;
    font-weight: bold;
    color: #666; }
  .text_l img {
    width: 90%;
    height: auto; }

.text_r {
  text-align: left;
  margin: 30px 0;
  width: 90%;
  padding-left: 20px;
  line-height: 0; }
  .text_r p {
    font-size: 18px;
    margin: 10px 0;
    font-weight: bold;
    color: #666; }
  .text_r img {
    width: 100%;
    height: auto; }

@media (max-width: 768px) {
  .himgtxt {
    display: block;
    width: 100%; }

  .hi_limg {
    display: block;
    width: 100%;
    vertical-align: middle;
    line-height: 0; }
    .hi_limg img {
      width: 100%;
      height: auto; }

  .hi_rtxt {
    display: block;
    vertical-align: middle;
    width: 100%;
    line-height: 0; }
    .hi_rtxt img {
      width: 100%;
      height: auto; }

  .text_l {
    text-align: center;
    padding-left: 0px;
    margin: 30px 0;
    margin-left: auto;
    width: 90%;
    line-height: 0; }
    .text_l p {
      font-size: 18px;
      margin: 10px 0;
      font-weight: bold;
      color: #666; }
    .text_l img {
      width: 90%;
      height: auto; }

  .text_r {
    text-align: center;
    margin: 30px 0;
    width: 90%;
    padding-left: 10px;
    line-height: 0; }
    .text_r p {
      font-size: 18px;
      margin: 10px 0;
      font-weight: bold;
      color: #666; }
    .text_r img {
      width: 100%;
      height: auto; } }
#ccarea {
  background: #fff;
  line-height: 0;
  width: 100%;
  margin: 0px;
  padding-bottom: 2px; }

/*# sourceMappingURL=style.css.map */