app/template/user_data/gallery.twig line 1

Open in your IDE?
  1. {% extends 'default_frame.twig' %}
  3. {% block stylesheet %}
  4. {% endblock %}
  6. {% block javascript %}
  7. <script src="{{ asset('assets/js/youtube.js') }}"></script>
  8. {% endblock %}
  9. {% block main %}
  10.     <div id="gallery_page">
  11.         <div class="ak-header">
  12.             <div class="ak-pageHeader">
  13.                 <h1>GALLERY</h1>
  14.                 <p>AKRacing シリーズのプロモーションムービーやイメージ写真を掲載しています。</p>
  15.                 <ul class="ak-link">
  16.                     <li><a href="#movie"><img src="{{ asset('assets/img/gallery/button01.png') }}" alt=""></a></li>
  17.                    <!-- 　 <li><a href="#picture"><img src="{{ asset('assets/img/gallery/button02.png') }}" alt=""></a></li>　 -->
  18.                 </ul>
  19.             </div>
  20.         </div><!-- ak-header -->
  21.         <div class="ak-body">
  22.             <h2 id="movie"><img src="{{ asset('assets/img/gallery/promotion_movie.png') }}" alt=""><span>プロモーション</span></h2>
  23.             <div class="ak-row">
  24.                 <div class="ak-item">
  25.                         <!-- 「どんな時にもAKRacing」篇 -->
  26.                         <div class="movie_wrapper">
  27.                             <ul id="list-yt_12" class="list-yt">
  28.                                 <li id="wrapper__yt_12" class="movie_wrapper__yt active">
  29.                                     <div id="yt12"></div>
  30.                                 </li>
  31.                             </ul>
  33.                             <h3>「いつでも座りたい」篇</h3>
  34.                         </div>
  35.                         <p class="movie-text">
  36.                             様々な職業の人物に扮したダンサーと一緒に踊る本田さんが、仕事にも勉強にもゲームにもあらゆる場面で座りたくなってしまうような快適性をアピールします。
  37.                         </p>
  38.                             <div class="movie_wrapper__bottom">
  39.                                 <ul class="ak-sns-icon">
  40.                                     <li class=""><a href="http://www.facebook.com/sharer.php?u=https://akracing.jp/movie/" target="_blank"><span class="fab fa-facebook"></span></a></li>
  41.                                     <li class=""><a href="http://twitter.com/share?url=https://akracing.jp/movie/" target="_blank"><span class="fab fa-twitter"></span></a></li>
  42.                                 </ul>
  43.                             </div>
  44.                 </div><!-- .ak-item -->
  45.                 <div class="ak-item">
  46.                      <!-- 「どんな人にもAKRacing」篇 -->
  47.                         <div class="movie_wrapper">
  48.                             <ul id="list-yt_13" class="list-yt">
  49.                                 <li id="wrapper__yt_13" class="movie_wrapper__yt active">
  50.                                     <div id="yt13"></div>
  51.                                 </li>
  52.                             </ul>
  53.                             <h3>「みんな使いたい」篇</h3>
  54.                         </div>
  55.                         <p class="movie-text">
  56.                             本田さんが小学生・中高生と一緒に踊りながら、コンパクトモデルPinonシリーズの登場でさらに多様性を増したAKRacingのラインナップの幅広さを見せてくれます。
  57.                         </p>
  58.                             <div class="movie_wrapper__bottom">
  59.                                 <ul class="ak-sns-icon">
  60.                                     <li class=""><a href="http://www.facebook.com/sharer.php?u=https://akracing.jp/movie/" target="_blank"><span class="fab fa-facebook"></span></a></li>
  61.                                     <li class=""><a href="http://twitter.com/share?url=https://akracing.jp/movie/" target="_blank"><span class="fab fa-twitter"></span></a></li>
  62.                                 </ul>
  63.                             </div>
  64.                 </div><!-- .ak-item -->
  65.                 <div class="ak-item">
  66.                         <!-- 「どんな時にもAKRacing」篇 -->
  67.                         <div class="movie_wrapper">
  68.                             <ul id="list-yt_10" class="list-yt">
  69.                                 <li id="wrapper__yt_10" class="movie_wrapper__yt active">
  70.                                     <div id="yt10"></div>
  71.                                 </li>
  72.                             </ul>
  74.                             <h3>「どんな時にもAKRacing」編 15秒 本田翼出演</h3>
  75.                         </div>
  76.                         <p class="movie-text">
  77.                             本田さんがゲーム、リモート会議、映画鑑賞、オンライン飲み会と、仕事も遊びも場面を問わずAKRacingチェアに座りつつ快適に過ごす日常を描出します。
  78.                         </p>
  79.                             <div class="movie_wrapper__bottom">
  80.                                 <ul class="ak-sns-icon">
  81.                                     <li class=""><a href="http://www.facebook.com/sharer.php?u=https://akracing.jp/movie/" target="_blank"><span class="fab fa-facebook"></span></a></li>
  82.                                     <li class=""><a href="http://twitter.com/share?url=https://akracing.jp/movie/" target="_blank"><span class="fab fa-twitter"></span></a></li>
  83.                                 </ul>
  84.                             </div>
  85.                 </div><!-- .ak-item -->
  86.                 <div class="ak-item">
  87.                      <!-- 「どんな人にもAKRacing」篇 -->
  88.                         <div class="movie_wrapper">
  89.                             <ul id="list-yt_11" class="list-yt">
  90.                                 <li id="wrapper__yt_11" class="movie_wrapper__yt active">
  91.                                     <div id="yt11"></div>
  92.                                 </li>
  93.                             </ul>
  94.                             <h3>「どんな人にもAKRacing」編 15秒 本田翼出演</h3>
  95.                         </div>
  96.                         <p class="movie-text">
  97.                             本田さんがプロゲーマー、ライター、ビジネスマン、漫画家、ミュージシャンと様々な職業人に扮し、どんな職種でも手放せなくなるほど快適なデスクワーク環境を実現するAKRacingの魅力を伝えます。次々と変わるコスチュームと本田さんの表情に、見ているだけで楽しくなってくるような構成となっています。
  98.                         </p>
  99.                             <div class="movie_wrapper__bottom">
  100.                                 <ul class="ak-sns-icon">
  101.                                     <li class=""><a href="http://www.facebook.com/sharer.php?u=https://akracing.jp/movie/" target="_blank"><span class="fab fa-facebook"></span></a></li>
  102.                                     <li class=""><a href="http://twitter.com/share?url=https://akracing.jp/movie/" target="_blank"><span class="fab fa-twitter"></span></a></li>
  103.                                 </ul>
  104.                             </div>
  105.                 </div><!-- .ak-item -->
  106.                 <div class="ak-item">
  107.                         <div class="movie_wrapper">
  108.                             <ul id="list-yt_8" class="list-yt">
  109.                                 <li id="wrapper__yt_8" class="movie_wrapper__yt active">
  110.                                     <div id="yt8"></div>
  111.                                 </li>
  112.                             </ul>
  114.                             <h3>私のゲーミングチェア【15秒】</h3>
  115.                         </div>
  116.                         <p class="movie-text">
  117.                             撮影のお仕事を終え、自宅に帰る本田さん。AKRacingチェアがセットされた「もう一つの戦場」に身を投じゲームに没頭する本田さんが見せる豊かでかわいらしい表情に注目です。
  118.                         </p>
  119.                             <div class="movie_wrapper__bottom">
  120.                                 <ul class="ak-sns-icon">
  121.                                     <li class=""><a href="http://www.facebook.com/sharer.php?u=https://akracing.jp/movie/" target="_blank"><span class="fab fa-facebook"></span></a></li>
  122.                                     <li class=""><a href="http://twitter.com/share?url=https://akracing.jp/movie/" target="_blank"><span class="fab fa-twitter"></span></a></li>
  123.                                 </ul>
  124.                             </div>
  125.                 </div><!-- .ak-item -->
  126.                 <div class="ak-item">
  127.                         <div class="movie_wrapper">
  128.                             <ul id="list-yt_9" class="list-yt">
  129.                                 <li id="wrapper__yt_9" class="movie_wrapper__yt active">
  130.                                     <div id="yt9"></div>
  131.                                 </li>
  132.                             </ul>
  134.                             <h3>心地良すぎて、終われない【15秒】</h3>
  135.                         </div>
  136.                         <p class="movie-text">
  137.                             快適な座り心地のAKRacingチェアに座ってプレイに熱中していると、気がつけば長い時間が経っていた、という展開。ゲーム画面を見つめる本田さんが失敗を悔しがったり、集中を高めたりと自然で愛らしい表情を見せてくれます。
  138.                         </p>
  139.                         <div class="movie_wrapper__bottom">
  140.                             <ul class="ak-sns-icon">
  141.                                 <li class=""><a href="http://www.facebook.com/sharer.php?u=https://akracing.jp/movie/" target="_blank"><span class="fab fa-facebook"></span></a></li>
  142.                                 <li class=""><a href="http://twitter.com/share?url=https://akracing.jp/movie/" target="_blank"><span class="fab fa-twitter"></span></a></li>
  143.                             </ul>
  144.                         </div>
  145.                 </div><!-- .ak-item -->
  146.                 <div class="ak-item">
  147.                         <div class="movie_wrapper">
  148.                             <ul id="list-yt_1" class="list-yt">
  149.                                 <li id="wrapper__yt_1" class="movie_wrapper__yt active">
  150.                                     <div id="yt1"></div>
  151.                                 </li>
  152.                                 <li id="wrapper__yt_2" class="movie_wrapper__yt">
  153.                                     <div id="yt2"></div>
  154.                                 </li>
  155.                                 <li id="wrapper__yt_3" class="movie_wrapper__yt">
  156.                                     <div id="yt3"></div>
  157.                                 </li>
  158.                             </ul>
  159.                             <div class="movie_wrapper__bottom">
  160.                                 <ul class="list_movie">
  161.                                     <li id="play1"><span>Long version</span></li>
  162.                                     <li id="play2"><span>Short version</span></li>
  163.                                     <li id="play3"><span>English version</span></li>
  164.                                 </ul>
  165.                                 <h3>クリエイティブに生きる全ての人たちへ</h3>
  166.                             </div>
  167.                         </div>
  168.                         <p class="movie-text">
  169.                             AKRacingは、世界市場の絶え間ない繁栄と発展と共に、当社もまた継続的な発展と成長を遂げてきました。お客様に役立つ製品、革新的な製品の継続的な開発、製品の品質向上、細部にまで配慮した顧客サービスの徹底を目標にして、より専門的で高度な洗練された品質を実現するために自社でデザインと 製造を行っています。
  170.                             <br>開発・製造の全工程を通して、「一貫性」、「強さ」、「革新」を具現化することで、企業イメージにも高い評価をいただけるものと確信しています。
  171.                         </p>
  172.                         <ul class="ak-sns-icon">
  173.                             <li class=""><a href="http://www.facebook.com/sharer.php?u=https://akracing.jp/movie/" target="_blank"><span class="fab fa-facebook"></span></a></li>
  174.                             <li class=""><a href="http://twitter.com/share?url=https://akracing.jp/movie/" target="_blank"><span class="fab fa-twitter"></span></a></li>
  175.                         </ul>
  176.                 </div>
  177.                 
  178.                 <!--
  179.                 <div class="ak-item">
  180.                         <div class="movie_wrapper">
  181.                             <div class="ak-end_img">
  182.                                 <img  src="{{ asset('assets/img/gallery/rizin_close.png') }}" alt="" />
  183.                             </div>
  184.                             <div class="movie_wrapper__bottom">
  185.                                 <h3>AKRacing × RIZIN 営業3課 完全版</h3>
  186.                             </div>
  187.                         </div>
  188.                         <p class="movie-text">
  189.                             日本を代表する総合格闘技イベント RIZIN FIGHTING WORLD GRAND-PRIXを2017年の年間スポンサーとして支援するテックウインド株式会社(代表取締役：王夢周、本社：東京都文京区)は、RIZIN出場選手であり日本の総合格闘技界を牽引するRENA選手、那須川天心選手らを起用したAKRacing公式PV第2弾【 AKRacing × RIZIN 営業3課 完全版】を公開しました
  190.                         </p>
  191.                         <ul class="ak-sns-icon">
  192.                             <li class=""><a href="http://www.facebook.com/sharer.php?u=https://akracing.jp/movie/" target="_blank"><span class="fab fa-facebook"></span></a></li>
  193.                             <li class=""><a href="http://twitter.com/share?url=https://akracing.jp/movie/" target="_blank"><span class="fab fa-twitter"></span></a></li>
  194.                         </ul>
  195.                 </div>
  196.             </div>
  197.              -->
  198.              
  199.             
  200.             <!-- 
  201.             <h2 id="picture"><img src="{{ asset('assets/img/gallery/picture_title.png') }}" alt=""><span>イメージ写真</span></h2>
  203.                 <ul class="img_list">
  204.                     <li>
  205.                         <h3>Premiumシリーズ</h3>
  206.                         <p>
  207.                             <img class="spnone" src="{{ asset('assets/img/gallery/img_01.png') }}" alt="">
  208.                             <img class="pcnone" src="{{ asset('assets/img/gallery/sp_img_01.png') }}" alt="">
  209.                         </p>
  210.                     </li>
  211.                     <li>
  212.                         <h3>Pro-xシリーズ</h3>
  213.                         <p>
  214.                             <img class="spnone" src="{{ asset('assets/img/gallery/img_02.png') }}" alt="">
  215.                             <img class="pcnone" src="{{ asset('assets/img/gallery/sp_img_02.png') }}" alt="">
  216.                         </p>
  217.                     </li>
  218.                     <li>
  219.                         <h3>Nitroシリーズ</h3>
  220.                         <p>
  221.                             <img class="spnone" src="{{ asset('assets/img/gallery/img_03.png') }}" alt="">
  222.                             <img class="pcnone" src="{{ asset('assets/img/gallery/sp_img_03.png') }}" alt="">
  223.                         </p>
  224.                     </li>
  225.                     <li>
  226.                         <h3>Wolfシリーズ</h3>
  227.                         <p>
  228.                             <img class="spnone" src="{{ asset('assets/img/gallery/img_04.png') }}" alt="">
  229.                             <img class="pcnone" src="{{ asset('assets/img/gallery/sp_img_04.png') }}" alt="">
  230.                         </p>
  231.                     </li>
  232.                     <li>
  233.                         <h3>極座シリーズ</h3>
  234.                         <p>
  235.                             <img class="spnone" src="{{ asset('assets/img/gallery/img_05.png') }}" alt="">
  236.                             <img class="pcnone" src="{{ asset('assets/img/gallery/sp_img_05.png') }}" alt="">
  237.                         </p>
  238.                     </li>
  239.                     <li>
  240.                         <h3>Overtureシリーズ</h3>
  241.                         <p>
  242.                             <img class="spnone" src="{{ asset('assets/img/gallery/img_06.png') }}" alt="">
  243.                             <img class="pcnone" src="{{ asset('assets/img/gallery/sp_img_06.png') }}" alt="">
  244.                         </p>
  245.                     </li>
  246.                 <ul>
  247.                  -->
  249.         </div><!-- .ak-body -->
  250.     </div><!-- #gallery_page -->
  251. {% endblock %}