{% extends 'base.html.twig' %}
{% set page = "top" %}
{% block title %}【公式】「とこワク」は三重県のワーケーションポータルサイト
{% endblock %}
{% block meta_og_title %}【公式】「とこワク」は三重県のワーケーションポータルサイト
{% endblock %}
{% block meta_twitter_title %}【公式】「とこワク」は三重県のワーケーションポータルサイト
{% endblock %}
{% block meta_description %}
{{ parent() }}
「とこワク」は三重県のワーケーションポータルサイトです。とこわか(常若)の地・三重でWork + Innovation!
{% endblock %}
{% block meta_og_description %}
{{ parent() }}
「とこワク」は三重県のワーケーションポータルサイトです。とこわか(常若)の地・三重でWork + Innovation!
{% endblock %}
{% block body %}
<section id="OBSERVE_TARGET" class="top">
<div class="topSlide">
<div class="swiper-wrapper">
{% for image in hero %}
<div class="swiper-slide topSlide__item">
<div style="background-image:url({{ path('hero_image', {filename: isSp() ? image.getSpFile(app.request.locale) : image.getPcFile(app.request.locale)}) }})"></div>
</div>
{% endfor %}
</div>
</div>
<div class="headerContainer">
<div class="headerContainer__link">
<div class="headerContainerLink__logo">
<a href="/" class="img__tokowakaLogo">
<img src="{{ asset('build/images/common/logo_white.png') }}" alt="ロゴ">
</a>
<span>{{ 'index.header.head-title'|trans }}</span>
</div>
<div class="headerContainer__right">
<div class="headerContainerLink__item">
<a href="{{ path('news_index') }}">{{ 'index.header.nav5'|trans }}</a>
<a href="{{ path('search_index') }}">{{ 'index.header.nav2'|trans }}</a>
<a href="{{ path('map_search_index') }}">{{ 'index.header.nav3'|trans }}</a>
<a href="{{ path('life') }}">{{ 'index.header.nav4'|trans }}</a>
</div>
<div class="headerContainerLink__language">
<img src="{{ asset('build/images/common/earth_icon_white.png') }}" alt="言語">
<button class="js-language-button">
{{ 'index.header.languCurrent'|trans }}
</button>
<div class="headerContainerLinkLanguage__list js-language-list">
{% if app.request.locale != "ja" %}
<a href="{{ path('top', {_locale: 'ja'}) }}">{{ 'index.header.languJa'|trans }}</a>
{% endif %}
{% if app.request.locale != "en" %}
<a href="{{ path('top', {_locale: 'en'}) }}">{{ 'index.header.languEn'|trans }}</a>
{% endif %}
{% if app.request.locale != "cn" %}
<a href="{{ path('top', {_locale: 'cn'}) }}">{{ 'index.header.languCh1'|trans }}</a>
{% endif %}
{% if app.request.locale != "tw" %}
<a href="{{ path('top', {_locale: 'tw'}) }}">{{ 'index.header.languCh2'|trans }}</a>
{% endif %}
</div>
</div>
<button class="js-hamburger-toggle">
<span class="line line--01"></span>
<span class="line line--02"></span>
<span class="line line--03"></span>
</button>
</div>
</div>
{{ form_start(form) }}
{{ form_widget(form.word) }}
<button type="submit">
<img src="{{ asset('build/images/common/search_icon.png') }}" alt="">
</button>
{{ form_end(form) }}
<div class="js-spMenu-toggle spMenu">
<div class="spMenu__head"></div>
<div class="spMenuLinkContainer">
<a href="{{ path('top') }}">{{ 'common.top'|trans|raw }}</a>
<a href="{{ path('tokowaku') }}">{{ 'index.header.nav1'|trans }}</a>
<a href="{{ path('news_index') }}">{{ 'news.newsPage.title'|trans|raw }}</a>
<a href="{{ path('life') }}">{{ 'life.breadcrumbsHead'|trans|raw }}</a>
<a href="{{ path('report_index') }}">{{ 'report.header.text3'|trans|raw }}</a>
<a href="{{ path('simulation01') }}">{{ 'common.entry.simulation'|trans|raw }}</a>
</div>
<div class="spMenuSearchContainer">
<h3>{{ 'common.sp_title'|trans|raw }}</h3>
<div class="spMenuSearchContainer__link">
<a href="{{ path('map_search_index') }}" class="link_map">{{ 'common.entry.map'|trans|raw }}</a>
<a href="{{ path('modelplan_index') }}" class="link_modelplan">{{ 'common.entry.modelplan'|trans|raw }}</a>
<a href="{{ path('workspace_index') }}" class="link_work">{{ 'common.entry.workspace'|trans|raw }}</a>
<a href="{{ path('facility_index') }}" class="link_facility">{{ 'common.entry.facility'|trans|raw }}</a>
<a href="{{ path('activity_index') }}" class="link_activity">{{ 'common.entry.activity'|trans|raw }}</a>
<a href="{{ path('activity_index', {category: 16}) }}" class="link_mobility">{{ 'common.entry.mobility'|trans|raw }}</a>
</div>
</div>
<div class="spMenuTranslationContainer">
<a href="{{ path('top', {_locale: 'ja'}) }}">{{ 'index.header.languJa'|trans }}</a>
<a href="{{ path('top', {_locale: 'en'}) }}">{{ 'index.header.languEn'|trans }}</a>
<a href="{{ path('top', {_locale: 'cn'}) }}">{{ 'index.header.languCh1'|trans }}</a>
<a href="{{ path('top', {_locale: 'tw'}) }}">{{ 'index.header.languCh2'|trans }}</a>
</div>
<div class="spMenuSNSContainer">
<a href="https://twitter.com/mie_workation" target="_blank" rel="noopener noreferrer" class="sns_tw">
<img src="{{ asset('build/images/common/tw_white.png') }}" alt="Twitter">
</a>
<a href="https://www.instagram.com/mie_workation/" target="_blank" rel="noopener noreferrer" class="sns_ins">
<img src="{{ asset('build/images/common/inst_white.png') }}" alt="Instagram">
</a>
</div>
</div>
</div>
{# <span> {{ 'index.mainImg.text1'|trans }} <br class="br__spStyle">{{ 'index.mainImg.text2'|trans }} </span> #}
</section>
<section class="news">
<div class="newsContainer">
<h1>
{{ 'index.news.head'|trans }}
</h1>
{# ajaxで新着を読み込む #}
<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>
{# <a href="{{ path('news_index') }}">{{ 'index.news.all'|trans|raw }}</a> #}
</div>
</section>
<section class="mieSearch">
<div class="mieSearchContainer">
<a href="{{ path('workspace_index') }}">
<div>
<img src="{{ asset('build/images/top/wark.jpg') }}" alt="みえで働く">
</div>
<h3>{{ 'index.mieSearch.work'|trans|raw }}</h3>
<span>{{ 'index.mieSearch.work_search'|trans|raw }}</span>
</a>
<a href="{{ path('facility_index') }}">
<div>
<img src="{{ asset('build/images/top/stay.jpg') }}" alt="みえに泊まる">
</div>
<h3>{{ 'index.mieSearch.stayAt'|trans|raw }}</h3>
<span>{{ 'index.mieSearch.stayAt_search'|trans|raw }}</span>
</a>
<a href="{{ path('activity_index') }}">
<div>
<img src="{{ asset('build/images/top/play.jpg') }}" alt="みえで遊ぶ・学ぶ">
</div>
<h3>{{ 'index.mieSearch.hangOut'|trans|raw }}</h3>
<span>{{ 'index.mieSearch.hangOut_search'|trans|raw }}</span>
</a>
</div>
</section>
<section class="warkAndVacation">
<div class="warkAndVacationContainer">
<div class="warkAndVacationContainer__title">
<h1>{{ 'index.vacation.title'|trans|raw }}</h1>
<div class="img__WarkAndVacation">
<img src="{{ asset('build/images/top/wark_innovation.png') }}" alt="WarkAndVacation">
</div>
</div>
<div class="warkAndVacationContainer__item">
<h2>{{ 'index.vacation.h2'|trans|raw }}</h2>
<p>{{ 'index.vacation.text'|trans|raw }}</p>
<a href="{{ path('tokowaku') }}">{{ 'index.vacation.btn'|trans|raw }}</a>
</div>
</div>
</section>
<section class="topReport">
<div class="img_report_text"></div>
<div class="reportWrapper">
<div class="reportWrapper__text">
<h2>{{ 'index.report.title'|trans|raw }}</h2>
<p>{{ 'index.report.text'|trans|raw }}</p>
<a href="{{ path('report_index') }}">{{ 'index.report.btn'|trans|raw }}</a>
</div>
<div class="reportListContainer js-cms-headline" data-endpoint="{{ path('report_headline') }}"></div>
</div>
</section>
<section class="modelPlan">
<div class="img__modelPlan"></div>
<div class="modelPlanContainer">
<h2>{{ 'index.modelPlan.head-title'|trans|raw }}</h2>
<p>{{ 'index.modelPlan.text'|trans|raw }}</p>
<div class="js-swiper-top modelPlanContainer__slick">
<div class="swiper-wrapper js-cms-headline" data-endpoint="{{ path('modelplan_recommend') }}" data-complete-event="recommendEntry"></div>
<div class="swiper-pagination"></div>
<div class="swiper-button-prev"></div>
<div class="swiper-button-next"></div>
</div>
</div>
</section>
<section class="simulationMap">
<a href="{{ path('simulation01') }}">
<div class="simulationMapButton__img">
<img src="{{ asset('build/images/top/simulation.png') }}" alt="">
<span>{{ 'index.simulationMap.btn1'|trans|raw }}</span>
</div>
<div class="simulationMapButton__items">
<h3>{{ 'index.simulationMap.head1'|trans|raw }}</h3>
<p>{{ 'index.simulationMap.text1'|trans|raw }}</p>
</div>
</a>
<a href="{{ path('map_search_index') }}">
<div class="simulationMapButton__img">
<img src="{{ asset('build/images/top/map_search.png') }}" alt="">
<span>{{ 'index.simulationMap.btn2'|trans|raw }}</span>
</div>
<div class="simulationMapButton__items">
<h3>{{ 'index.simulationMap.head2'|trans|raw }}</h3>
<p>{{ 'index.simulationMap.text2'|trans|raw }}</p>
</div>
</a>
</section>
<section class="mobilitySearch">
<div class="mobilitySearchContainer">
<div class="img__mobility">
<img src="{{ asset('build/images/top/mobility.jpg') }}" alt="">
</div>
<div class="mobilitySearchContainer__item">
<h2>{{ 'index.mobilitySearch.head-title'|trans|raw }}</h2>
<p>{{ 'index.mobilitySearch.text'|trans|raw }}</p>
<a href="{{ path('activity_index', {category: 16}) }}">{{ 'index.mobilitySearch.btn'|trans|raw }}</a>
</div>
</div>
</section>
<section class="experience">
<div class="experienceItemContainer">
<div class="experienceContainer__item">
<h2>{{ 'index.experience.head-title'|trans|raw }}</h2>
<p>{{ 'index.experience.text'|trans|raw }}</p>
<a href="{{ path('life') }}">{{ 'index.experience.btn'|trans|raw }}</a>
</div>
</div>
<div class="experienceImgContainer"></div>
</section>
<section class="bannerWrapper">
<a href="{{ path('contact_index') }}" class="bannerWrapper__anchor">
{% if isSp() %}
<img src="{{ asset('build/images/top/banner_sp.jpg') }}" alt="掲載希望の方はこちら">
{% else %}
<img src="{{ asset('build/images/top/banner_pc.jpg') }}" alt="掲載希望の方はこちら">
{% endif %}
</a>
</section>
<section class="tokowakaInfo">
<div class="tokowakaInfoContainer">
<div class="tokowakaInfoContainer__left">
<h2>{{ 'index.tokowakaInfo.head-title'|trans|raw }}</h2>
<p>{{ 'index.tokowakaInfo.text'|trans|raw }}</p>
<a href="{{ path('news_index') }}">{{ 'index.tokowakaInfo.btn'|trans|raw }}</a>
</div>
<div class="tokowakaInfoContainer__right js-cms-headline" data-endpoint="{{ path('news_headline', {without_topics: 1, limit: 3, add_top: 1}) }}"></div>
<a href="{{ path('news_index') }}">{{ 'index.tokowakaInfo.btn'|trans|raw }}</a>
</div>
</section>
<section
class="movie js-cms-headline" data-endpoint="{{ path('top_movie') }}">{#
<div class="movie__item">
<img src="{{ asset('build/images/top/movie.jpg') }}" alt="">
<span>{{ 'index.movie.movie-title1'|trans|raw }}</span>
</div>
<div class="movie__item">
<img src="{{ asset('build/images/top/movie.jpg') }}" alt="">
<span>{{ 'index.movie.movie-title2'|trans|raw }}</span>
</div>
<div class="movie__item">
<img src="{{ asset('build/images/top/movie.jpg') }}" alt="">
<span>{{ 'index.movie.movie-title3'|trans|raw }}</span>
</div>
<div class="movie__item">
<img src="{{ asset('build/images/top/movie.jpg') }}" alt="">
<span>{{ 'index.movie.movie-title4'|trans|raw }}</span>
</div> #}
</section>
{% endblock %}