@media only screen and (max-width: 640px) { html { font-size: 87.5%; }
  @import url(http://fonts.googleapis.com/earlyaccess/notosansjapanese.css);
  html, body { width: 100%; margin: 0; padding: 0; background-color: #000; line-height: 1.5; font-family: "Noto Sans Japanese", "\30D2\30E9\30AE\30CE\89D2\30B4\20\50\72\6F\20\57\33", "Hiragino Kaku Gothic Pro", "\30e1\30a4\30ea\30aa", Meiryo, "\FF2D\FF33\20\FF30\30B4\30B7\30C3\30AF", sans-serif; color: #000; }
  section, article, aside, div, p, img, hr { margin: 0; padding: 0; vertical-align: top; border: 0; }
  ul, li { margin: 0; padding: 0; list-style: none; }
  h1, h2, h3, h4 { font-size: 1em; font-weight: normal; margin: 0; padding: 0; }
  a { border: 0; color: #0c79cc; text-decoration: none; }
  .cf { *zoom: 1; }
  .cf:after { content: ''; display: block; clear: both; }
  span.swapimg { display: block; position: relative; z-index: -1; text-align: center; overflow: hidden; }
  header { width: 640px; }
  header ul.head { position: relative; width: 100%; background: #000; }
  header ul.head li { float: left; }
  header ul.head a { display: block; position: relative; overflow: hidden; }
  header ul.head span { position: absolute; top: 100%; left: 100%; }
  header ul.head ul.menu { display: none; position: absolute; z-index: 2; top: 100%; left: 0; width: 100%; background-color: #d2c800; }
  header ul.head ul.menu li { width: 100%; text-align: center; padding: 10px 0; border-bottom: 1px #000 solid; }
  header ul.head ul.menu span { position: static; font-size: 1.2em; color: #000; }
  header ul.head ul.menu li.blank { display: none; }
  header ul.head li.sns { float: right; }
  header ul.head a.menu_logo { position: absolute; width: 90px; height: 60px; left: 270px; background: url(../images/sp_menu_logo.png) no-repeat; background-size: contain; }
  header ul.head a.menu_twitter { width: 80px; height: 60px; background: url(../images/sp_menu_twitter.png) no-repeat; background-size: contain; }
  header ul.head a.menu_facebook { width: 80px; height: 60px; background: url(../images/sp_menu_facebook.png) no-repeat; background-size: contain; }
  header.fixed { position: fixed; top: 0; z-index: 10000; box-shadow: 0 2px 1px rgba(0, 0, 0, 0.4); }
  div#contents { width: 640px; margin: 0 auto; padding-bottom: 20px; background-color: #fff8a2; overflow: hidden; }
  section.blog { width: 600px; margin: 20px auto 0 auto; background-color: #fff; }
  section.blog div.title { position: relative; width: 100%; height: 30px; margin-bottom: 15px; background: url(../images/sp_icon_blog.png) no-repeat 10px 4px; background-color: #4c4600; overflow: hidden; }
  section.blog div.title span { position: absolute; top: 100%; left: 100%; }
  section.blog p { padding: 0 10px 15px 10px; }
  section.blog span { font-size: 0.833em; color: #817a00; }
  section.blog div.line { width: 100%; height: 15px; border-top: 1px #d2c801 dotted; }
  section.sns { width: 600px; margin: 20px auto 0 auto; }
  section.fbpc { display: none; }
  section.fbmobile { display: block; width: 600px; margin: 20px auto 0 auto; background-color: #fff; }
  section.banner { width: 620px; margin: 0 -20px 0 20px; }
  section.banner img { float: left; width: 290px; height: auto; margin: 20px 20px 0 0; }
  a.try { display: block; width: 146px; padding: 12px 0 8px 0; margin-top: 20px; border: 1px #827b00 dotted; font-size: 1.5em; line-height: 1.2; text-indent: 47px; font-weight: bold; background: url(../images/icon_try.png) no-repeat 12px 6px; }
  a.buy { display: block; width: 146px; padding: 12px 0 8px 0; margin-top: 20px; border: 1px #827b00 dotted; font-size: 1.5em; line-height: 1.2; text-indent: 47px; font-weight: bold; background: url(../images/icon_buy.png) no-repeat 12px 6px; }
  a.detail { display: block; width: 146px; padding: 12px 0 8px 0; margin-top: 20px; border: 1px #827b00 dotted; font-size: 1.5em; line-height: 1.2; text-indent: 47px; font-weight: bold; background: url(../images/icon_detail.png) no-repeat 12px 6px; }
  div.storelink { display: none; width: 147px; background-color: #fff; overflow: hidden; }
  div.storelink img.icon { margin-top: 1px; }
  div.storelink a { display: block; width: 145px; margin: 0 !important; padding: 0 !important; margin-top: 1px !important; border: 1px #4c4600 solid; background: none; }
  section.caution, section.caution_pc, section.caution_mobile { width: 100%; margin-top: 20px; text-align: center; }
  section.caution_pc { display: none; }
  section.caution_mobile { display: block; padding: 20px 0; margin-top: 0; background-color: #e8d700; font-size: 1.2em; } }
@media only screen and (min-width: 641px) { html { font-size: 75%; }
  @import url(http://fonts.googleapis.com/earlyaccess/notosansjapanese.css);
  html, body { width: 100%; margin: 0; padding: 0; background-color: #000; line-height: 1.5; font-family: "Noto Sans Japanese", "\30D2\30E9\30AE\30CE\89D2\30B4\20\50\72\6F\20\57\33", "Hiragino Kaku Gothic Pro", "\30e1\30a4\30ea\30aa", Meiryo, "\FF2D\FF33\20\FF30\30B4\30B7\30C3\30AF", sans-serif; color: #000; min-width: 980px; }
  section, article, aside, div, p, img, hr { margin: 0; padding: 0; vertical-align: top; border: 0; }
  ul, li { margin: 0; padding: 0; list-style: none; }
  h1, h2, h3, h4 { font-size: 1em; font-weight: normal; margin: 0; padding: 0; }
  a { border: 0; color: #0c79cc; text-decoration: none; }
  .cf { *zoom: 1; }
  .cf:after { content: ''; display: block; clear: both; }
  span.swapimg { display: block; position: relative; z-index: -1; text-align: center; overflow: hidden; }
  header { width: 640px; width: 980px; margin: 0 auto; }
  header ul.head { position: relative; width: 100%; background: #000; }
  header ul.head li { float: left; }
  header ul.head a { display: block; position: relative; overflow: hidden; }
  header ul.head span { position: absolute; top: 100%; left: 100%; }
  header ul.head ul.menu { display: none; position: absolute; z-index: 2; top: 100%; left: 0; width: 100%; background-color: #d2c800; display: block; position: static; width: 590px; }
  header ul.head li.sns { float: right; }
  header ul.head a.menu_logo { position: absolute; width: 90px; height: 60px; left: 270px; background: url(../images/sp_menu_logo.png) no-repeat; background-size: contain; }
  header ul.head a.menu_twitter { width: 80px; height: 60px; background: url(../images/sp_menu_twitter.png) no-repeat; background-size: contain; }
  header ul.head a.menu_facebook { width: 80px; height: 60px; background: url(../images/sp_menu_facebook.png) no-repeat; background-size: contain; }
  header ul.head a.menu_button { display: none; }
  header ul.head a.menu_logo { position: relative; width: 130px; height: 80px; left: 0; background: url(../images/menu_logo.png) no-repeat; }
  header ul.head a.menu_twitter { width: 130px; height: 80px; background: url(../images/menu_twitter.png) no-repeat; }
  header ul.head a.menu_facebook { width: 130px; height: 80px; background: url(../images/menu_facebook.png) no-repeat; }
  header ul.head a.menu01 { width: 148px; height: 40px; background: url(../images/menu01.png) no-repeat; }
  header ul.head a.menu02 { width: 148px; height: 40px; background: url(../images/menu02.png) no-repeat; }
  header ul.head a.menu03 { width: 148px; height: 40px; background: url(../images/menu03.png) no-repeat; }
  header ul.head a.menu04 { width: 146px; height: 40px; background: url(../images/menu04.png) no-repeat; }
  header ul.head a.menu05 { width: 148px; height: 40px; background: url(../images/menu05.png) no-repeat; }
  header ul.head a.menu06 { width: 148px; height: 40px; background: url(../images/menu06.png) no-repeat; }
  header ul.head a.menu07 { width: 148px; height: 40px; background: url(../images/menu07.png) no-repeat; }
  header ul.head a.menu08 { width: 146px; height: 40px; background: url(../images/menu08.png) no-repeat; }
  header ul.head a.menu_logo:hover { background-position: bottom; }
  header ul.head a.menu01:hover, header ul.head a.menu02:hover, header ul.head a.menu03:hover, header ul.head a.menu04:hover, header ul.head a.menu05:hover, header ul.head a.menu06:hover, header ul.head a.menu07:hover, header ul.head a.menu08:hover { background-position: 0 -40px; }
  header ul.head a.select { background-position: bottom; }
  header.fixed { position: fixed; top: 0; z-index: 10000; box-shadow: 0 2px 1px rgba(0, 0, 0, 0.4); }
  div#contents { width: 640px; margin: 0 auto; padding-bottom: 20px; background-color: #fff8a2; overflow: hidden; width: 980px; }
  section.blog { width: 600px; margin: 20px auto 0 auto; background-color: #fff; width: 220px; }
  section.blog div.title { position: relative; width: 100%; height: 30px; margin-bottom: 15px; background: url(../images/sp_icon_blog.png) no-repeat 10px 4px; background: url(../images/icon_blog.png) no-repeat 10px 4px; background-color: #4c4600; overflow: hidden; }
  section.blog div.title span { position: absolute; top: 100%; left: 100%; }
  section.blog p { padding: 0 10px 15px 10px; }
  section.blog span { font-size: 0.833em; color: #817a00; }
  section.blog div.line { width: 100%; height: 15px; border-top: 1px #d2c801 dotted; }
  section.sns { width: 600px; margin: 20px auto 0 auto; width: 220px; }
  section.fbpc { display: none; display: block; width: 220px; margin: 20px auto 0 auto; background-color: #fff; }
  section.fbmobile { display: block; width: 600px; margin: 20px auto 0 auto; background-color: #fff; display: none; }
  section.banner { width: 620px; margin: 0 -20px 0 20px; width: 220px; margin: 0 auto; }
  section.banner img { float: left; width: 290px; height: auto; margin: 20px 20px 0 0; float: none; width: 220px; margin-right: 0; }
  a.try { display: block; width: 146px; padding: 12px 0 8px 0; margin-top: 20px; border: 1px #827b00 dotted; font-size: 1.5em; line-height: 1.2; text-indent: 47px; font-weight: bold; background: url(../images/icon_try.png) no-repeat 12px 6px; padding: 10px 0; margin-top: 10px; text-indent: 52px; background-position: 15px 5px; }
  a.buy { display: block; width: 146px; padding: 12px 0 8px 0; margin-top: 20px; border: 1px #827b00 dotted; font-size: 1.5em; line-height: 1.2; text-indent: 47px; font-weight: bold; background: url(../images/icon_buy.png) no-repeat 12px 6px; padding: 10px 0; margin-top: 10px; text-indent: 52px; background-position: 15px 5px; }
  a.detail { display: block; width: 146px; padding: 12px 0 8px 0; margin-top: 20px; border: 1px #827b00 dotted; font-size: 1.5em; line-height: 1.2; text-indent: 47px; font-weight: bold; background: url(../images/icon_detail.png) no-repeat 12px 6px; padding: 10px 0; margin-top: 10px; text-indent: 52px; background-position: 15px 5px; }
  div.storelink { display: none; width: 147px; background-color: #fff; overflow: hidden; }
  div.storelink img.icon { margin-top: 1px; }
  div.storelink a { display: block; width: 145px; margin: 0 !important; padding: 0 !important; margin-top: 1px !important; border: 1px #4c4600 solid; background: none; }
  section.caution, section.caution_pc, section.caution_mobile { width: 100%; margin-top: 20px; text-align: center; }
  section.caution_pc { display: none; display: block; }
  section.caution_mobile { display: block; padding: 20px 0; margin-top: 0; background-color: #e8d700; font-size: 1.2em; display: none; } }