<!-- Insta -->
<div class="Insta-Inner">
	<h2 class="Insta-Tit">Instagram</h2>
	<p class="Insta-Text"><a href="URL" target="_blank">アカウント名</a></p>
</div>
<!-- 条件分岐 -->
<?php if ( wp_is_mobile()) : ?>
	<div class="Insta-Main"><?php echo do_shortcode('[instagram-feed num=9 cols=5 imagepadding=1 imagepaddingunit=px imageres=full showheader=false showbutton=false showfollow=false ]'); ?></div>
<?php else: ?>
<div class="Insta-Bg"><div class="Insta-Main"><?php echo do_shortcode('[instagram-feed num=8 cols=4 imagepadding=10 imagepaddingunit=px imageres=full showheader=false showbutton=false showfollow=false ]'); ?></div></div>
<?php endif; ?>
<!-- /> -->
<!-- /> -->
.Insta {
  margin: 5% auto;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

@media (max-width: 640px) {
  .Insta {
    display: block;
    margin: 17% auto;
  }
}

.Insta-Bg {
  background: #778798;
}

.Insta-Main {
  width: 90%;
  margin: 0 auto;
}

@media (max-width: 640px) {
  .Insta-Main {
    margin: 0 auto;
    width: 90%;
  }
}

.Insta-Text {
  position: relative;
  max-width: 200px;
  margin: 0 auto;
}

.Insta-Text a {
  font-family: 'Montserrat', sans-serif;
  font-weight: 300;
}
.Insta #sb_instagram {
  padding-bottom: 0 !important;
}

@media (max-width: 640px) {
  .Insta .sbi_item {
    width: 33% !important;
  }
}

@media (max-width: 640px) {
  .Insta #sbi_images {
    -webkit-flex-wrap: wrap !important;
        -ms-flex-wrap: wrap !important;
            flex-wrap: wrap !important;
  }
}

.Insta-Inner {
  margin: 3% auto;
  text-align: center;
}

@media (max-width: 640px) {
  .Insta-Inner {
    margin: 10% auto;
  }
}

.Insta-Tit {
  font-size: 50px;
  font-size: 5rem;
  text-align: center;
}

@media (max-width: 640px) {
  .Insta-Tit {
    font-size: 35px;
    font-size: 3.5rem;
  }
}

.Insta-Btn {
  max-width: 330px;
  text-align: center;
  margin: 2% auto;
  color: #fff;
  width: auto;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

.Insta-Btn a {
  display: block;
  padding: 6%;
  font-size: 20px;
  font-size: 2rem;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.