<?php $__env->startSection('content'); ?>

<div class="hero d-none d-sm-block">
  <div class="hero-inner">

    <div class="temp-hero d-flex pb-5">
      <div>
        <h2 class="mb-4">Most recommended & rated most effective</h2>
        <h1 class="mb-5">Influencer Marketing No. 1</h1>
        <img class="works-logo mb-5" src="<?= App\asset_path('images/works-logo.png'); ?>">
        <div class="d-flex mb-5">
          <a class="btn-gra" href="<?php echo e(home_url('/en/biz-en/contact/')); ?>">Contact</a>
        </div>
        <p class="view-details"><a class="en" href="#main-content">View details <svg width="13.545" height="13.712">
              <use xlink:href="#down-arrow"></use>
            </svg></a></p>
      </div>

      <div class="image ml-3 position-relative" style="z-index: -1;"><img class="img-fluid" src="<?= App\asset_path('images/char3.png'); ?>">
        <div class="hero-shadow" id="longshadowAnimation"></div>
      </div>
    </div>

  </div>
</div>

<div class="hero-sp d-sm-none">
  <img class="img-fluid" src="<?= App\asset_path('images/char3-sp.png'); ?>">
  <div class="text">
    <h2><span>Most recommended & rated most effective</span>Influencer Marketing No. 1</h2>
    <img class="works-logo" src="<?= App\asset_path('images/works-logo.png'); ?>">
  </div>
</div>


<div class="no-1-unit-wrapper">

  <div class="no-1-unit d-flex flex-wrap flex-sm-nowrap align-items-center">
    <div class="pr-sm-5 pb-4 pb-sm-0">Results from 2020</div>
    <div class="px-sm-5 border-left"><img src="<?= App\asset_path('images/se_no1_logo.png'); ?>"></div>
    <div class="pt-4 pt-sm-0">
      <h3>No. 1 influencer marketing service most recommended by marketing professionals</h3>
      <h3>No. 1 influencer marketing service rated most effective by marketing professionals</h3>
    </div>
  </div>

  <div class="no-1-unit-note">
  [Survey Overview] Survey method: Internet survey / Survey period: July 31st to August 7th, 2020; Survey summary: Survey comparing impressions of websites engaged in influencer marketing; Survey sample: 1,026 respondents, male and female, 18 to 69 years old, including employees at advertising agencies, marketing professionals, creators of YouTube video content, influencers, and individuals with at least 1,000 followers (users who added them to Favorites, etc.) on YouTube, Instagram, Twitter, Facebook, TikTok, or their blogs / Survey conducted by: Shopper's Eye / Companies compared: Top 9 companies listed in Google search results for "influencer marketing services" (as of July 29th, 2020, 5:50 PM)
  </div>

</div>

<!-- 私たちについて -->
<div class="about-us py-5 py-md-0 my-5 my-md-0 pb-5 pb-md-0" id="main-content">

  <div class="page-title-unit mb-3 mb-md-5 text-center d-md-none">
    <h3>About Us</h3>
    <h4 class="en">About Us</h4>
  </div>

  <div class="about-us-inner">
    <div class="desc d-md-flex align-items-center mt-md-4">
      <div class="image mr-md-3">
        <?php if (is_ie()) : ?>
          <img class="img-fluid p-md-5" src="<?= App\asset_path('images/fan-creator-biz.png'); ?>">
        <?php else: ?>
          <img class="img-fluid p-md-5" src="<?= App\asset_path('images/fan-creator-biz.svg'); ?>">
        <?php endif; ?>
      </div>
      <div class="text">
        <h4 class="d-none d-md-block">About Us</h4>
        <p class="color-purple en sub mb-1 mb-lg-4 d-none d-md-block">About Us</p>
        <h3 class="mb-4 mb-lg-4"><span>Providing optimal solutions for leveraging influencers</span> by drawing on our expertise based on having the highest transaction volume across the industry</h3>
        <p class="mb-4 mb-lg-4">We can make recommendations and tap on a wide range of creators regardless if they are affiliated with an agency or freelancers.<br>We also implement one-stop promotion strategies that have been optimized in response to your issues and objectives.</p>
      </div>
    </div>
  </div>

  <a class="btn-gra mt-4 d-md-none mx-auto mb-4 mb-md-0" href="/en/biz-en/contact/">Contact</a>
</div>

<!-- 主要なサービスのご紹介-->
<div id="biz-main-service" class="main-services py-md-5 my-md-5">
  <div class="main-services-inner py-md-5 mb-5">
    <div class="page-title-unit mb-5">
      <h3 class="text-left text-md-center">Overview of our main services</h3>
      <h4 class="en text-left text-md-center">Service</h4>
    </div>

    <h2 class="mb-5">We provide one-stop solutions that encompass everything from planning to selection, video production, and reporting.</h2>

    <div class="position-relative biz-main-services-list">
      <ul class="main-service-list d-md-flex justify-content-between">
        <li>
          <div class="card">
            <img class="img-fluid" src="<?= App\asset_path('images/ms1.png'); ?>">
            <div class="card-body">
              <h6 class="card-title-sub">Influencer casting</h6>
              <h5 class="card-title">One of the largest influencer networks in Japan</h5>
              <p class="card-text">We have one of the largest influencer networks in Japan with over 300,000 influencers registered in our proprietary database.</p>
            </div>
          </div>
        </li>
        <li>
          <div class="card">
            <img class="img-fluid" src="<?= App\asset_path('images/ms2.png'); ?>">
            <div class="card-body">
              <h6 class="card-title-sub">Creative production</h6>
              <h5 class="card-title">Quality direction backed by having engaged in numerous projects in Japan</h5>
              <p class="card-text">We provide highly precise direction and superior QA through our creative team and technology under the BitStar system.</p>
            </div>
          </div>
        </li>
        <li>
          <div class="card">
            <img class="img-fluid" src="<?= App\asset_path('images/ms3.png'); ?>">
            <div class="card-body">
              <h6 class="card-title-sub">Research and data analysis</h6>
              <h5 class="card-title">Accurate reporting through data analysis conducted with our in-house tools</h5>
              <p class="card-text">Quantitative analysis of viewer demographics and other kinds of numerical data</p>
            </div>
          </div>
        </li>
      </ul>

      <ul class="main-service-list-arrow d-none d-md-flex justify-content-between">
        <li></li>
        <li></li>
        <li></li>
      </ul>
    </div>
  </div>
</div>

<div id="service-carousel" class="carousel slide py-5" data-ride="carousel" data-interval="false">
  <div class="page-title-unit mb-4 mb-md-5">
    <h3 class="text-left text-md-center">Overview of our main services</h3>
    <h4 class="en text-left text-md-center">Main Service</h4>
  </div>

  <ol class="carousel-indicators my-md-3 d-none d-md-flex">
    <li data-target="#service-carousel" data-slide-to="0" class="tab active"><span>YouTube & Social media tie-ups</span></li>
    <li class="tab" data-target="#service-carousel" data-slide-to="1"><span>Influencer casting</span></li>
    <li class="tab" data-target="#service-carousel" data-slide-to="2"><span>Creative production</span></li>
    <li class="tab" data-target="#service-carousel" data-slide-to="3"><span>Research and data analysis</span></li>
  </ol>

  <div class="carousel-inner">
    <div class="carousel-item active">
      <div class="slide-wrapper">
        <img class="d-none d-md-inline" src="<?= App\asset_path('images/en-slide1.png'); ?>">
        <img class="d-md-none" src="<?= App\asset_path('images/en-slide1_sp.png'); ?>">
      </div>
    </div>
    <div class="carousel-item">
      <div class="slide-wrapper">
        <img class="d-none d-md-inline" src="<?= App\asset_path('images/en-slide2.png'); ?>">
        <img class="d-md-none" src="<?= App\asset_path('images/en-slide2_sp.png'); ?>">
      </div>
    </div>
    <div class="carousel-item">
      <div class="slide-wrapper">
        <img class="d-none d-md-inline" src="<?= App\asset_path('images/en-slide3.png'); ?>">
        <img class="d-md-none" src="<?= App\asset_path('images/en-slide3_sp.png'); ?>">
      </div>
    </div>
    <div class="carousel-item">
      <div class="slide-wrapper">
        <img class="d-none d-md-inline" src="<?= App\asset_path('images/en-slide4.png'); ?>">
        <img class="d-md-none" src="<?= App\asset_path('images/en-slide4_sp.png'); ?>">
      </div>
    </div>

    <a class="carousel-control-prev" href="#service-carousel" role="button" data-slide="prev">
      <img class="d-none d-md-block" src="<?= App\asset_path('images/slide-prev.png'); ?>">
    </a>
    <a class="carousel-control-next" href="#service-carousel" role="button" data-slide="next">
      <img class="d-none d-md-block" src="<?= App\asset_path('images/slide-next.png'); ?>">
    </a>
  </div>

  <ol class="carousel-dots d-flex justify-content-center mt-3">
    <li class="active"></li>
    <li></li>
    <li></li>
    <li></li>
  </ol>

  <script>
    let tabs = jQuery('.tab');
    jQuery('#service-carousel').on('slid.bs.carousel', function() {
      jQuery(tabs).each(function() {
        if (jQuery(this).hasClass('active')) {
          const index = tabs.index(this);
          jQuery('.carousel-dots > li').removeClass('active').eq(index).addClass('active');
        }
      })
    })
  </script>
</div>

<!-- 主要なプラットフォーム -->
<div class="pt-5 mt-5 py-md-5 my-md-5 text-center main-platform">
  <div class="page-title-unit mb-5">
    <h3 class="text-left text-md-center">Major Platforms Supported</h3>
    <h4 class="en text-left text-md-center">Platform</h4>
  </div>
  <?php if (is_ie()) : ?>
    <img class="d-none d-md-inline w-100" style="max-width:755px;" src="<?= App\asset_path('images/main-platform-ie.png'); ?>">
  <?php else: ?>
    <img class="d-none d-md-inline w-100" style="max-width:755px;" src="<?= App\asset_path('images/main-platform.png'); ?>">
    <div class="d-none d-md-flex main-platform-list">
      <ul>
        <li>In-stream ads</li>
        <li>Discovery ads</li>
        <li>Bumper ads</li>
      </ul>
      <ul>
        <li>Promoted tweets</li>
        <li>Promoted accounts</li>
        <li>Sponsorship plans</li>
      </ul>
      <ul>
        <li>Image/video ads</li>
        <li>Stories ads</li>
        <li>Carousel ads</li>
      </ul>
      <ul>
        <li>Carousel ads</li>
        <li>Loading screens</li>
        <li>Hashtag challenges</li>
      </ul>
      <ul>
        <li>Various formats</li>
      </ul>
    </div>
  <?php endif; ?>
  <img class="img-fluid w-100 d-md-none" src="<?= App\asset_path('images/main-platform-sp.png'); ?>">
</div>

<!-- 独自の提供サービス -->
<div class="original-service pb-5 mb-5 mt-5 py-md-5 my-md-5">
  <div class="page-title-unit mb-5">
    <h3 class="text-left text-md-center">Original services</h3>
    <h4 class="en text-left text-md-center">Original Service</h4>
  </div>

  <?php
  $wp_query = new WP_Query(array(
    'post_status' => 'publish',
    'post_type' => array('services_for_client'),
    'posts_per_page' => -1,
    'orderby'     => 'date',
    'order' => 'DESC',
  ));
  ?>

  <?php
  if ($wp_query->have_posts()) : while ($wp_query->have_posts()) : $wp_query->the_post();
  ?>

      <div class="original-service-list shadow d-md-flex align-items-center mb-3">
        <div class="logo"><a href="<?php echo get_field('service_page'); ?>" target="_blank"><img data-src="<?php the_post_thumbnail_url(); ?>" class="lazyload"></a></div>
        <div class="text">
          <h3 class="en">
            <svg class="d-none d-md-inline" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="10" height="10" viewBox="0 0 10 10">
              <defs>
                <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
                  <stop offset="0" stop-color="#b760f4" />
                  <stop offset="1" stop-color="#5f2ab3" />
                </linearGradient>
              </defs>
              <circle cx="5" cy="5" r="5" fill="url(#linear-gradient)" />
            </svg>
            <a href="<?php echo get_field('service_page'); ?>" target="_blank"><?php the_title(); ?></a>
          </h3>
          <div class="desc">
            <?php the_content(); ?>
          </div>
        </div>

        <?php $url = get_field('service_page');
        if ($url) : ?>
          <div class="ml-auto d-none d-lg-block" style="min-width: 213px;">
            <a class="btn-gra position-relative" href="<?php echo $url; ?>" target="_blank">Official Site
              <span class="position-absolute" style="right: 30px;"><svg xmlns="http://www.w3.org/2000/svg" width="8.664" height="8.664" viewBox="0 0 8.664 8.664">
                  <g id="グループ_4010" data-name="グループ 4010" transform="translate(-6 -6)">
                    <path id="パス_165" data-name="パス 165" d="M14.678,13.22a.542.542,0,0,1-.541-.541v-5.6h-5.6A.541.541,0,1,1,8.542,6h6.137a.542.542,0,0,1,.541.541v6.137A.542.542,0,0,1,14.678,13.22Z" transform="translate(-0.556)" />
                    <path id="パス_166" data-name="パス 166" d="M6.542,14.734a.542.542,0,0,1-.383-.924l7.4-7.4a.541.541,0,1,1,.765.765l-7.4,7.4A.537.537,0,0,1,6.542,14.734Z" transform="translate(0 -0.07)" />
                  </g>
                </svg></span></a>
          </div>
        <?php endif ?>

      </div>

  <?php endwhile;
  endif;
  wp_reset_postdata(); ?>

  <!-- Studio -->
  <div class="original-service-list shadow d-md-flex align-items-center mb-3">
    <div class="logo"><a href="https://studio.bitstar.tokyo/" target="_blank"><img class="lazyload" data-src="<?= App\asset_path('images/studio-logo.png'); ?>"></a></div>
    <div class="text">
      <h3 class="en">
        <svg class="d-none d-md-inline" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="10" height="10" viewBox="0 0 10 10">
          <defs>
            <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
              <stop offset="0" stop-color="#b760f4" />
              <stop offset="1" stop-color="#5f2ab3" />
            </linearGradient>
          </defs>
          <circle cx="5" cy="5" r="5" fill="url(#linear-gradient)" />
        </svg>
        <a href="https://studio.bitstar.tokyo/" target="_blank">BitStar Studio</a>
      </h3>
      <div class="desc">
        <p>Our production group with specialized expertise in YouTube program production & consulting</p>
      </div>
    </div>
    <div class="ml-auto d-none d-lg-block" style="min-width: 213px;">
      <a class="btn-gra position-relative" href="https://studio.bitstar.tokyo/" target="_blank">Official Site
        <span class="position-absolute" style="right: 30px;"><svg xmlns="http://www.w3.org/2000/svg" width="8.664" height="8.664" viewBox="0 0 8.664 8.664">
            <g id="グループ_4010" data-name="グループ 4010" transform="translate(-6 -6)">
              <path id="パス_165" data-name="パス 165" d="M14.678,13.22a.542.542,0,0,1-.541-.541v-5.6h-5.6A.541.541,0,1,1,8.542,6h6.137a.542.542,0,0,1,.541.541v6.137A.542.542,0,0,1,14.678,13.22Z" transform="translate(-0.556)" />
              <path id="パス_166" data-name="パス 166" d="M6.542,14.734a.542.542,0,0,1-.383-.924l7.4-7.4a.541.541,0,1,1,.765.765l-7.4,7.4A.537.537,0,0,1,6.542,14.734Z" transform="translate(0 -0.07)" />
            </g>
          </svg></span>
      </a>
    </div>
  </div>


</div>


<div class="forclient-image mt-md-5 mx-auto">
  <img class="img-fluid" src="<?= App\asset_path('images/forclient-image.svg'); ?>">
</div>


<!-- Contact Us -->
<div class="contact-us-unit d-md-flex align-items-center py-5 my-5">
  <div class="d-md-none title-unit mb-4">
    <h2 class="en">Contact</h2>
    <p class="sub mt-2 mt-md-5">Contact</p>
  </div>

  <div class="text pr-md-5">
    <h4 class="en mb-4 text-center text-md-left">Please contact us.</h4>
    <h3 class="mb-3 mb-md-5 text-center text-md-left">Our team with a proven track record will provide you with the necessary support.</h3>
    <p class="mb-3 mb-md-5 text-center text-md-left">We have been tasked with the promotion campaigns of over 1,000 businesses, from major listed companies to start-ups.<br>
Our team with a proven track record will provide you with the necessary support.</p>

    <a class="btn-gra d-none d-md-table" href="/en/biz-en/contact/">Please feel free to get in touch with us.</a>
  </div>
  <div class="image">
    <img class="img-fluid" src="<?= App\asset_path('images/char3.png'); ?>">
  </div>

  <a class="btn-gra d-md-none mt-5 mx-auto footer-contact-btn-sp" href="/en/biz-en/contact/">Please feel free to get in touch with us.</a>

</div>


<?php $__env->stopSection(); ?>

<?php echo $__env->make('layouts.app', array_except(get_defined_vars(), array('__data', '__path')))->render(); ?>