templates/pages/index/index.html.twig line 1

Open in your IDE?
  1. {% extends 'base.html.twig' %}
  2. {% set page = "top" %}
  3. {% block title %}【公式】「とこワク」は三重県のワーケーションポータルサイト
  4. {% endblock %}
  5. {% block meta_og_title %}【公式】「とこワク」は三重県のワーケーションポータルサイト
  6. {% endblock %}
  7. {% block meta_twitter_title %}【公式】「とこワク」は三重県のワーケーションポータルサイト
  8. {% endblock %}
  9. {% block meta_description %}
  10.   {{ parent() }}
  11.   「とこワク」は三重県のワーケーションポータルサイトです。とこわか(常若)の地・三重でWork + Innovation!
  12. {% endblock %}
  13. {% block meta_og_description %}
  14.   {{ parent() }}
  15.   「とこワク」は三重県のワーケーションポータルサイトです。とこわか(常若)の地・三重でWork + Innovation!
  16. {% endblock %}
  17. {% block body %}
  18.   <section id="OBSERVE_TARGET" class="top">
  19.     <div class="topSlide">
  20.       <div class="swiper-wrapper">
  21.         {% for image in hero %}
  22.           <div class="swiper-slide topSlide__item">
  23.             <div style="background-image:url({{ path('hero_image', {filename: isSp() ? image.getSpFile(app.request.locale) : image.getPcFile(app.request.locale)}) }})"></div>
  24.           </div>
  25.         {% endfor %}
  26.       </div>
  27.     </div>
  28.     <div class="headerContainer">
  29.       <div class="headerContainer__link">
  30.         <div class="headerContainerLink__logo">
  31.           <a href="/" class="img__tokowakaLogo">
  32.             <img src="{{ asset('build/images/common/logo_white.png') }}" alt="ロゴ">
  33.           </a>
  34.           <span>{{ 'index.header.head-title'|trans }}</span>
  35.         </div>
  36.         <div class="headerContainer__right">
  37.           <div class="headerContainerLink__item">
  38.             <a href="{{ path('news_index') }}">{{ 'index.header.nav5'|trans }}</a>
  39.             <a href="{{ path('search_index') }}">{{ 'index.header.nav2'|trans }}</a>
  40.             <a href="{{ path('map_search_index') }}">{{ 'index.header.nav3'|trans }}</a>
  41.             <a href="{{ path('life') }}">{{ 'index.header.nav4'|trans }}</a>
  42.           </div>
  43.           <div class="headerContainerLink__language">
  44.             <img src="{{ asset('build/images/common/earth_icon_white.png') }}" alt="言語">
  45.             <button class="js-language-button">
  46.               {{ 'index.header.languCurrent'|trans }}
  47.             </button>
  48.             <div class="headerContainerLinkLanguage__list js-language-list">
  49.               {% if app.request.locale != "ja" %}
  50.                 <a href="{{ path('top', {_locale: 'ja'}) }}">{{ 'index.header.languJa'|trans }}</a>
  51.               {% endif %}
  52.               {% if app.request.locale != "en" %}
  53.                 <a href="{{ path('top', {_locale: 'en'}) }}">{{ 'index.header.languEn'|trans }}</a>
  54.               {% endif %}
  55.               {% if app.request.locale != "cn" %}
  56.                 <a href="{{ path('top', {_locale: 'cn'}) }}">{{ 'index.header.languCh1'|trans }}</a>
  57.               {% endif %}
  58.               {% if app.request.locale != "tw" %}
  59.                 <a href="{{ path('top', {_locale: 'tw'}) }}">{{ 'index.header.languCh2'|trans }}</a>
  60.               {% endif %}
  61.             </div>
  62.           </div>
  63.           <button class="js-hamburger-toggle">
  64.             <span class="line line--01"></span>
  65.             <span class="line line--02"></span>
  66.             <span class="line line--03"></span>
  67.           </button>
  68.         </div>
  69.       </div>
  70.       {{ form_start(form) }}
  71.       {{ form_widget(form.word) }}
  72.       <button type="submit">
  73.         <img src="{{ asset('build/images/common/search_icon.png') }}" alt="">
  74.       </button>
  75.       {{ form_end(form) }}
  76.       <div class="js-spMenu-toggle spMenu">
  77.         <div class="spMenu__head"></div>
  78.         <div class="spMenuLinkContainer">
  79.           <a href="{{ path('top') }}">{{ 'common.top'|trans|raw }}</a>
  80.           <a href="{{ path('tokowaku') }}">{{ 'index.header.nav1'|trans }}</a>
  81.           <a href="{{ path('news_index') }}">{{ 'news.newsPage.title'|trans|raw }}</a>
  82.           <a href="{{ path('life') }}">{{ 'life.breadcrumbsHead'|trans|raw }}</a>
  83.           <a href="{{ path('report_index') }}">{{ 'report.header.text3'|trans|raw }}</a>
  84.           <a href="{{ path('simulation01') }}">{{ 'common.entry.simulation'|trans|raw }}</a>
  85.         </div>
  86.         <div class="spMenuSearchContainer">
  87.           <h3>{{ 'common.sp_title'|trans|raw }}</h3>
  88.           <div class="spMenuSearchContainer__link">
  89.             <a href="{{ path('map_search_index') }}" class="link_map">{{ 'common.entry.map'|trans|raw }}</a>
  90.             <a href="{{ path('modelplan_index') }}" class="link_modelplan">{{ 'common.entry.modelplan'|trans|raw }}</a>
  91.             <a href="{{ path('workspace_index') }}" class="link_work">{{ 'common.entry.workspace'|trans|raw }}</a>
  92.             <a href="{{ path('facility_index') }}" class="link_facility">{{ 'common.entry.facility'|trans|raw }}</a>
  93.             <a href="{{ path('activity_index') }}" class="link_activity">{{ 'common.entry.activity'|trans|raw }}</a>
  94.             <a href="{{ path('activity_index', {category: 16}) }}" class="link_mobility">{{ 'common.entry.mobility'|trans|raw }}</a>
  95.           </div>
  96.         </div>
  97.         <div class="spMenuTranslationContainer">
  98.           <a href="{{ path('top', {_locale: 'ja'}) }}">{{ 'index.header.languJa'|trans }}</a>
  99.           <a href="{{ path('top', {_locale: 'en'}) }}">{{ 'index.header.languEn'|trans }}</a>
  100.           <a href="{{ path('top', {_locale: 'cn'}) }}">{{ 'index.header.languCh1'|trans }}</a>
  101.           <a href="{{ path('top', {_locale: 'tw'}) }}">{{ 'index.header.languCh2'|trans }}</a>
  102.         </div>
  103.         <div class="spMenuSNSContainer">
  104.           <a href="https://twitter.com/mie_workation" target="_blank" rel="noopener noreferrer" class="sns_tw">
  105.             <img src="{{ asset('build/images/common/tw_white.png') }}" alt="Twitter">
  106.           </a>
  107.           <a href="https://www.instagram.com/mie_workation/" target="_blank" rel="noopener noreferrer" class="sns_ins">
  108.             <img src="{{ asset('build/images/common/inst_white.png') }}" alt="Instagram">
  109.           </a>
  110.         </div>
  111.       </div>
  112.     </div>
  113.     {# <span> {{ 'index.mainImg.text1'|trans }} <br class="br__spStyle">{{ 'index.mainImg.text2'|trans }} </span> #}
  114.   </section>
  115.   <section class="news">
  116.     <div class="newsContainer">
  117.       <h1>
  118.         {{ 'index.news.head'|trans }}
  119.       </h1>
  120.       {# ajaxで新着を読み込む #}
  121.       <div class="js-cms-headline newsContainer__headline" data-endpoint="{{ path('news_headline') }}?only_topics=1&view=topics&add_top=1&limit=4" data-complete-event="news"></div>
  122.       {# <a href="{{ path('news_index') }}">{{ 'index.news.all'|trans|raw }}</a> #}
  123.     </div>
  124.   </section>
  125.   <section class="mieSearch">
  126.     <div class="mieSearchContainer">
  127.       <a href="{{ path('workspace_index') }}">
  128.         <div>
  129.           <img src="{{ asset('build/images/top/wark.jpg') }}" alt="みえで働く">
  130.         </div>
  131.         <h3>{{ 'index.mieSearch.work'|trans|raw }}</h3>
  132.         <span>{{ 'index.mieSearch.work_search'|trans|raw }}</span>
  133.       </a>
  134.       <a href="{{ path('facility_index') }}">
  135.         <div>
  136.           <img src="{{ asset('build/images/top/stay.jpg') }}" alt="みえに泊まる">
  137.         </div>
  138.         <h3>{{ 'index.mieSearch.stayAt'|trans|raw }}</h3>
  139.         <span>{{ 'index.mieSearch.stayAt_search'|trans|raw }}</span>
  140.       </a>
  141.       <a href="{{ path('activity_index') }}">
  142.         <div>
  143.           <img src="{{ asset('build/images/top/play.jpg') }}" alt="みえで遊ぶ・学ぶ">
  144.         </div>
  145.         <h3>{{ 'index.mieSearch.hangOut'|trans|raw }}</h3>
  146.         <span>{{ 'index.mieSearch.hangOut_search'|trans|raw }}</span>
  147.       </a>
  148.     </div>
  149.   </section>
  150.   <section class="warkAndVacation">
  151.     <div class="warkAndVacationContainer">
  152.       <div class="warkAndVacationContainer__title">
  153.         <h1>{{ 'index.vacation.title'|trans|raw }}</h1>
  154.         <div class="img__WarkAndVacation">
  155.           <img src="{{ asset('build/images/top/wark_innovation.png') }}" alt="WarkAndVacation">
  156.         </div>
  157.       </div>
  158.       <div class="warkAndVacationContainer__item">
  159.         <h2>{{ 'index.vacation.h2'|trans|raw }}</h2>
  160.         <p>{{ 'index.vacation.text'|trans|raw }}</p>
  161.         <a href="{{ path('tokowaku') }}">{{ 'index.vacation.btn'|trans|raw }}</a>
  162.       </div>
  163.     </div>
  164.   </section>
  165.   <section class="topReport">
  166.     <div class="img_report_text"></div>
  167.     <div class="reportWrapper">
  168.       <div class="reportWrapper__text">
  169.         <h2>{{ 'index.report.title'|trans|raw }}</h2>
  170.         <p>{{ 'index.report.text'|trans|raw }}</p>
  171.         <a href="{{ path('report_index') }}">{{ 'index.report.btn'|trans|raw }}</a>
  172.       </div>
  173.       <div class="reportListContainer js-cms-headline" data-endpoint="{{ path('report_headline') }}"></div>
  174.     </div>
  175.   </section>
  176.   <section class="modelPlan">
  177.     <div class="img__modelPlan"></div>
  178.     <div class="modelPlanContainer">
  179.       <h2>{{ 'index.modelPlan.head-title'|trans|raw }}</h2>
  180.       <p>{{ 'index.modelPlan.text'|trans|raw }}</p>
  181.       <div class="js-swiper-top modelPlanContainer__slick">
  182.         <div class="swiper-wrapper js-cms-headline" data-endpoint="{{ path('modelplan_recommend') }}" data-complete-event="recommendEntry"></div>
  183.         <div class="swiper-pagination"></div>
  184.         <div class="swiper-button-prev"></div>
  185.         <div class="swiper-button-next"></div>
  186.       </div>
  187.     </div>
  188.   </section>
  189.   <section class="simulationMap">
  190.     <a href="{{ path('simulation01') }}">
  191.       <div class="simulationMapButton__img">
  192.         <img src="{{ asset('build/images/top/simulation.png') }}" alt="">
  193.         <span>{{ 'index.simulationMap.btn1'|trans|raw }}</span>
  194.       </div>
  195.       <div class="simulationMapButton__items">
  196.         <h3>{{ 'index.simulationMap.head1'|trans|raw }}</h3>
  197.         <p>{{ 'index.simulationMap.text1'|trans|raw }}</p>
  198.       </div>
  199.     </a>
  200.     <a href="{{ path('map_search_index') }}">
  201.       <div class="simulationMapButton__img">
  202.         <img src="{{ asset('build/images/top/map_search.png') }}" alt="">
  203.         <span>{{ 'index.simulationMap.btn2'|trans|raw }}</span>
  204.       </div>
  205.       <div class="simulationMapButton__items">
  206.         <h3>{{ 'index.simulationMap.head2'|trans|raw }}</h3>
  207.         <p>{{ 'index.simulationMap.text2'|trans|raw }}</p>
  208.       </div>
  209.     </a>
  210.   </section>
  211.   <section class="mobilitySearch">
  212.     <div class="mobilitySearchContainer">
  213.       <div class="img__mobility">
  214.         <img src="{{ asset('build/images/top/mobility.jpg') }}" alt="">
  215.       </div>
  216.       <div class="mobilitySearchContainer__item">
  217.         <h2>{{ 'index.mobilitySearch.head-title'|trans|raw }}</h2>
  218.         <p>{{ 'index.mobilitySearch.text'|trans|raw }}</p>
  219.         <a href="{{ path('activity_index', {category: 16}) }}">{{ 'index.mobilitySearch.btn'|trans|raw }}</a>
  220.       </div>
  221.     </div>
  222.   </section>
  223.   <section class="experience">
  224.     <div class="experienceItemContainer">
  225.       <div class="experienceContainer__item">
  226.         <h2>{{ 'index.experience.head-title'|trans|raw }}</h2>
  227.         <p>{{ 'index.experience.text'|trans|raw }}</p>
  228.         <a href="{{ path('life') }}">{{ 'index.experience.btn'|trans|raw }}</a>
  229.       </div>
  230.     </div>
  231.     <div class="experienceImgContainer"></div>
  232.   </section>
  233.   <section class="bannerWrapper">
  234.     <a href="{{ path('contact_index') }}" class="bannerWrapper__anchor">
  235.       {% if isSp() %}
  236.         <img src="{{ asset('build/images/top/banner_sp.jpg') }}" alt="掲載希望の方はこちら">
  237.       {% else %}
  238.         <img src="{{ asset('build/images/top/banner_pc.jpg') }}" alt="掲載希望の方はこちら">
  239.       {% endif %}
  240.     </a>
  241.   </section>
  242.   <section class="tokowakaInfo">
  243.     <div class="tokowakaInfoContainer">
  244.       <div class="tokowakaInfoContainer__left">
  245.         <h2>{{ 'index.tokowakaInfo.head-title'|trans|raw }}</h2>
  246.         <p>{{ 'index.tokowakaInfo.text'|trans|raw }}</p>
  247.         <a href="{{ path('news_index') }}">{{ 'index.tokowakaInfo.btn'|trans|raw }}</a>
  248.       </div>
  249.       <div class="tokowakaInfoContainer__right js-cms-headline" data-endpoint="{{ path('news_headline', {without_topics: 1, limit: 3, add_top: 1}) }}"></div>
  250.       <a href="{{ path('news_index') }}">{{ 'index.tokowakaInfo.btn'|trans|raw }}</a>
  251.     </div>
  252.   </section>
  253.   <section
  254.     class="movie js-cms-headline" data-endpoint="{{ path('top_movie') }}">{#
  255.                             <div class="movie__item">
  256.                               <img src="{{ asset('build/images/top/movie.jpg') }}" alt="">
  257.                               <span>{{ 'index.movie.movie-title1'|trans|raw }}</span>
  258.                             </div>
  259.                             <div class="movie__item">
  260.                               <img src="{{ asset('build/images/top/movie.jpg') }}" alt="">
  261.                               <span>{{ 'index.movie.movie-title2'|trans|raw }}</span>
  262.                             </div>
  263.                             <div class="movie__item">
  264.                               <img src="{{ asset('build/images/top/movie.jpg') }}" alt="">
  265.                               <span>{{ 'index.movie.movie-title3'|trans|raw }}</span>
  266.                             </div>
  267.                             <div class="movie__item">
  268.                               <img src="{{ asset('build/images/top/movie.jpg') }}" alt="">
  269.                               <span>{{ 'index.movie.movie-title4'|trans|raw }}</span>
  270.                             </div> #}
  271.   </section>
  272. {% endblock %}