@charset "UTF-8";
/* ハナマルキ公式ソーシャルメディア
------------------------------ */
#contents { width: 100%; margin: 0; }

#sns { position: relative; font-family: "游ゴシック", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ ゴシック", sans-serif; }
#sns .clearFix:after { display: block; clear: both; content: ""; }
#sns:after { clear: both; display: block; content: ''; }
#sns section { display: block; position: relative; }
#sns img { width: 100%; height: auto; vertical-align: bottom; }
#sns a { cursor: pointer; }
#sns .snsKv { position: relative; width: 100%; }
#sns .snsPanel { padding: 9.375% 6.25% 0; background: #fafafa; z-index: 0; }
#sns .snsPanel:after { clear: both; display: block; content: ''; }
#sns .snsPanel ul { width: 100%; margin: 0 auto 3.125%; padding: 0 0 9.375%; }
#sns .snsPanel li { position: relative; width: 100%; padding: 10.7142857143% 0 7.1428571429%; border: solid 2px #eee; border-radius: 5px; background: #fff; text-align: center; box-sizing: border-box; }
#sns .snsPanel li + li { margin-top: 8.9285714286%; }
#sns .snsPanel li:after { display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; margin: 1.09375% 0 0 1.09375%; border-radius: 5px; background: url(../images/panel-shadow.png) no-repeat center center; background-size: cover; z-index: -1; content: ""; }
#sns .snsPanel li h2 { padding-top: .75em; line-height: 1; }
#sns .snsPanel li h2 small { display: block; padding-bottom: 1.7985611511%; }
#sns .snsPanel li > a { display: block; padding-top: 7.1942446043%; }

/* sp-side
-------------------------------------------------- */
@media only screen and (max-width: 640px) { .font24 { font-size: 24px; font-size: 3.75vw; }
  #sns, #sns .snsPanel li h2 small { font-size: 24px; font-size: 3.75vw; }
  #sns .snsPanel li h2 p { font-size: 30px; font-size: 4.6875vw; } }
/* iPhone5-side
-------------------------------------------------- */
@media only screen and (max-width: 568px) { .font24 { font-size: 21.3px; font-size: 3.75vw; }
  #sns, #sns .snsPanel li h2 small { font-size: 21.3px; font-size: 3.75vw; }
  #sns .snsPanel li h2 p { font-size: 26.625px; font-size: 4.6875vw; } }
/* android-w
-------------------------------------------------- */
@media only screen and (max-width: 540px) { .font24 { font-size: 20.25px; font-size: 3.75vw; }
  #sns, #sns .snsPanel li h2 small { font-size: 20.25px; font-size: 3.75vw; }
  #sns .snsPanel li h2 p { font-size: 25.3125px; font-size: 4.6875vw; } }
/* android-m
-------------------------------------------------- */
@media only screen and (max-width: 480px) { .font24 { font-size: 18px; font-size: 3.75vw; }
  #sns, #sns .snsPanel li h2 small { font-size: 18px; font-size: 3.75vw; }
  #sns .snsPanel li h2 p { font-size: 22.5px; font-size: 4.6875vw; } }
/* iphone6plus
-------------------------------------------------- */
@media only screen and (max-width: 414px) { .font24 { font-size: 15.525px; font-size: 3.75vw; }
  #sns, #sns .snsPanel li h2 small { font-size: 15.525px; font-size: 3.75vw; }
  #sns .snsPanel li h2 p { font-size: 19.40625px; font-size: 4.6875vw; } }
/* iphone6
-------------------------------------------------- */
@media only screen and (max-width: 375px) { .font24 { font-size: 14.0625px; font-size: 3.75vw; }
  #sns, #sns .snsPanel li h2 small { font-size: 14.0625px; font-size: 3.75vw; }
  #sns .snsPanel li h2 p { font-size: 17.578125px; font-size: 4.6875vw; } }
/* android
-------------------------------------------------- */
@media only screen and (max-width: 360px) { .font24 { font-size: 13.5px; font-size: 3.75vw; }
  #sns, #sns .snsPanel li h2 small { font-size: 13.5px; font-size: 3.75vw; }
  #sns .snsPanel li h2 p { font-size: 16.875px; font-size: 4.6875vw; } }
/* iphone5, android-s
-------------------------------------------------- */
@media only screen and (max-width: 320px) { .font24 { font-size: 12px; font-size: 3.75vw; }
  #sns, #sns .snsPanel li h2 small { font-size: 12px; font-size: 3.75vw; }
  #sns .snsPanel li h2 p { font-size: 15px; font-size: 4.6875vw; } }