TOPページの体験セミナー自動更新機能の追加

parent 768b952e
...@@ -17,32 +17,58 @@ ...@@ -17,32 +17,58 @@
<script type="text/javascript" src="/common_previous/js/lib/jquery.matchHeight-min.js" charset="utf-8"></script> <script type="text/javascript" src="/common_previous/js/lib/jquery.matchHeight-min.js" charset="utf-8"></script>
<script> <script>
$(document).ready(function() { $(document).ready(function() {
/*
$('.c-slide1__inner').on('init', function(event, slick) { $.ajax({
$(slick.$slides[0]).addClass('slick-animated'); url: "/pub/api/experiences",
}).on('beforeChange', function(event, slick, currentSlide) { type: 'GET',
$('.slick-animated').removeClass('slick-animated'); async: true,
}).on('afterChange', function(event, slick, currentSlide) { data: {},
$(slick.$slides[currentSlide]).addClass('slick-animated'); dataType: 'json',
}).slick({ success: function (response) {
dots: true, $.each(response['data'], function (key, val) {
arrows: false, var appendItem = '' +
infinite: true, ' <div class="c-slide1__item">\n' +
centerMode: true, ' <a href="' + val['link_url'] + '" target="_blank">\n' +
centerPadding: '100px', ' <div class="c-slide1__img">\n' +
slidesToShow: 1, ' <img src="' + val['img_path'] + '" alt="">\n' +
slidesToScroll: 1, ' </div>\n' +
variableWidth: true, ' <div class="c-slide1__info">\n' +
autoplay: true, ' <p class="c-slide1__txt">\n' +
responsive: [{ ' <span>' + val['top_description'] + '</span>\n' +
breakpoint: 768, ' </p>\n' +
settings: { ' </div>\n' +
centerPadding: '50px' ' </a>\n' +
} ' </div>\n';
}] $('.c-slide1__inner').append(appendItem);
}); });
*/
$(".c-list2__info").matchHeight(); $('.c-slide1__inner').slick({
autoplay: true,
autoplaySpeed: 5000,
dots: false,
centerMode: true,
centerPadding: '30px',
arrows: true,
prevArrow: '<a href="javascript:void(0);" style="position: absolute; top: 50%; left: 20px; transform: translateY(-50%); -webkit-transform: translateY(-50%); z-index: 1;"><img src="/assets/img/common/icon-slick-arrow-left.png"></a>',
nextArrow: '<a href="javascript:void(0);" style="position: absolute; top: 50%; right: 20px; transform: translateY(-50%); -webkit-transform: translateY(-50%); z-index: 1;"><img src="/assets/img/common/icon-slick-arrow-right.png"></a>',
slidesToShow: 3,
slidesToScroll: 1,
infinite: true,
responsive: [{
breakpoint: 768,
settings: {
slidesToShow: 2,
}
}]
});
},
error: function (data) {
var response = $.parseJSON(data.responseText);
console.log(response.message);
}
});
$(".c-list2__info").matchHeight();
}); });
</script> </script>
......
/* Slider */ /* Slider */
.slick-slider .slick-slider
{ {
position: relative; position: relative;
display: block; display: block;
-moz-box-sizing: border-box; -moz-box-sizing: border-box;
box-sizing: border-box; box-sizing: border-box;
-webkit-user-select: none; -webkit-user-select: none;
-moz-user-select: none; -moz-user-select: none;
-ms-user-select: none; -ms-user-select: none;
user-select: none; user-select: none;
-webkit-touch-callout: none; -webkit-touch-callout: none;
-khtml-user-select: none; -khtml-user-select: none;
-ms-touch-action: pan-y; -ms-touch-action: pan-y;
touch-action: pan-y; touch-action: pan-y;
-webkit-tap-highlight-color: transparent; -webkit-tap-highlight-color: transparent;
} }
.slick-list .slick-list
{ {
position: relative; position: relative;
display: block; display: block;
overflow: hidden; overflow: hidden;
margin: 0; margin: 0;
padding: 0; padding: 0;
} }
.slick-list:focus .slick-list:focus
{ {
outline: none; outline: none;
} }
.slick-list.dragging .slick-list.dragging
{ {
cursor: pointer; cursor: pointer;
cursor: hand; cursor: hand;
} }
.slick-slider .slick-track, .slick-slider .slick-track,
.slick-slider .slick-list .slick-slider .slick-list
{ {
-webkit-transform: translate3d(0, 0, 0); -webkit-transform: translate3d(0, 0, 0);
-moz-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0);
-ms-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0);
-o-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0);
} }
.slick-track .slick-track
{ {
position: relative; position: relative;
top: 0; top: 0;
left: 0; left: 0;
display: block; display: block;
} }
.slick-track:before, .slick-track:before,
.slick-track:after .slick-track:after
{ {
display: table; display: table;
content: ''; content: '';
} }
.slick-track:after .slick-track:after
{ {
clear: both; clear: both;
} }
.slick-loading .slick-track .slick-loading .slick-track
{ {
visibility: hidden; visibility: hidden;
} }
.slick-slide .slick-slide
{ {
display: none; display: none;
float: left; float: left;
height: 100%; height: 100%;
min-height: 1px; min-height: 1px;
} }
[dir='rtl'] .slick-slide [dir='rtl'] .slick-slide
{ {
float: right; float: right;
} }
.slick-slide img .slick-slide img
{ {
display: block; display: block;
} }
.slick-slide.slick-loading img .slick-slide.slick-loading img
{ {
display: none; display: none;
} }
.slick-slide.dragging img .slick-slide.dragging img
{ {
pointer-events: none; pointer-events: none;
} }
.slick-initialized .slick-slide .slick-initialized .slick-slide
{ {
display: block; display: block;
} }
.slick-loading .slick-slide .slick-loading .slick-slide
{ {
visibility: hidden; visibility: hidden;
} }
.slick-vertical .slick-slide .slick-vertical .slick-slide
{ {
display: block; display: block;
height: auto; height: auto;
border: 1px solid transparent; border: 1px solid transparent;
} }
.slick-arrow.slick-hidden { .slick-arrow.slick-hidden {
display: none; display: none;
} }
/* Slider */ /* Slider */
.slick-loading .slick-list .slick-loading .slick-list
{ {
background: #fff url('./ajax-loader.gif') center center no-repeat; background: #fff url('../img/ajax-loader.gif') center center no-repeat;
} }
<?php $pageid="top";?> <?php $pageid="top";?>
<?php include($_SERVER['DOCUMENT_ROOT'] . '/assets/include/header.php'); ?> <?php include($_SERVER['DOCUMENT_ROOT'] . '/assets/include/header.php'); ?>
<main class="top"> <main class="top">
<div class="top-mainvisual"> <div class="top-mainvisual">
<div class="top-mainvisual__video"> <div class="top-mainvisual__video">
<video src="/common_previous/mov/OS_TOP5.mp4" preload="auto" class="movie-player-image" id="movie-preview" height="100%" width="100%" autoplay="" loop="" muted="" playsinline=""></video> <video src="/common_previous/mov/OS_TOP5.mp4" preload="auto" class="movie-player-image" id="movie-preview" height="100%" width="100%" autoplay="" loop="" muted="" playsinline=""></video>
</div> </div>
<div class="top-mainvisual__btn"> <div class="top-mainvisual__btn">
<div class="c-btn1"> <div class="c-btn1">
<a href="/service/" class="c-btn1__txt">サービス一覧</a> <a href="/service/" class="c-btn1__txt">サービス一覧</a>
</div> </div>
<div class="c-btn1"> <div class="c-btn1">
<a href="/strategy/" class="c-btn1__txt">『頂点への道』講座 <a href="/strategy/" class="c-btn1__txt">『頂点への道』講座
<br class="sp-only">体験説明会</a> <br class="sp-only">体験説明会</a>
</div> </div>
</div> </div>
</div> </div>
<section class="top1"> <section class="top1">
<div class="c-heading"> <div class="c-heading">
<div class="c-title1"> <div class="c-title1">
<h2 class="c-title1__main">お知らせ</h2> <h2 class="c-title1__main">お知らせ</h2>
<p class="c-title1__sub">news</p> <p class="c-title1__sub">news</p>
</div> </div>
<div class="c-btn2"> <div class="c-btn2">
<a href="/news/" class="c-btn2__txt">一覧を見る</a> <a href="/news/" class="c-btn2__txt">一覧を見る</a>
</div> </div>
</div> </div>
<div class="top1__wrap"> <div class="top1__wrap">
<div class="container"> <div class="container">
<ul class="c-list1"> <ul class="c-list1">
<li class="c-list1__item"> <li class="c-list1__item">
<div class="c-list1__intro"> <div class="c-list1__intro">
<time datetime="2020-04-07" class="c-list1__date">2020年04月07日</time> <time datetime="2020-04-07" class="c-list1__date">2020年04月07日</time>
<p class="c-list1__tag"> <p class="c-list1__tag">
<span>会社情報</span> <span>会社情報</span>
</p> </p>
</div> </div>
<div class="c-list1__link"> <div class="c-list1__link">
<a href="/news/info/details/20200407/" class="c-list1__txt">新型コロナウイルス感染対策に伴う、各種講座・セミナー開催中止のお知らせ(4月7日更新)</a> <a href="/news/info/details/20200407/" class="c-list1__txt">新型コロナウイルス感染対策に伴う、各種講座・セミナー開催中止のお知らせ(4月7日更新)</a>
</div> </div>
</li> </li>
<li class="c-list1__item"> <li class="c-list1__item">
<div class="c-list1__intro"> <div class="c-list1__intro">
<time datetime="2020-04-01" class="c-list1__date">2020年04月01日</time> <time datetime="2020-04-01" class="c-list1__date">2020年04月01日</time>
<p class="c-list1__tag"> <p class="c-list1__tag">
<span>会社情報</span> <span>会社情報</span>
</p> </p>
</div> </div>
<div class="c-list1__link"> <div class="c-list1__link">
<a href="/news/info/details/20200401/" class="c-list1__txt">新型コロナウイルス感染対策に伴う、各種講座・セミナー開催中止のお知らせ(4月1日更新)</a> <a href="/news/info/details/20200401/" class="c-list1__txt">新型コロナウイルス感染対策に伴う、各種講座・セミナー開催中止のお知らせ(4月1日更新)</a>
</div> </div>
</li> </li>
<li class="c-list1__item"> <li class="c-list1__item">
<div class="c-list1__intro"> <div class="c-list1__intro">
<time datetime="2020-03-28" class="c-list1__date">2020年03月28日</time> <time datetime="2020-03-28" class="c-list1__date">2020年03月28日</time>
<p class="c-list1__tag"> <p class="c-list1__tag">
<span>会社情報</span> <span>会社情報</span>
</p> </p>
</div> </div>
<div class="c-list1__link"> <div class="c-list1__link">
<a href="/news/info/details/20200328/" class="c-list1__txt">東京都外出自粛要請に伴う、在宅勤務切り替えのお知らせ</a> <a href="/news/info/details/20200328/" class="c-list1__txt">東京都外出自粛要請に伴う、在宅勤務切り替えのお知らせ</a>
</div> </div>
</li> </li>
<li class="c-list1__item"> <li class="c-list1__item">
<div class="c-list1__intro"> <div class="c-list1__intro">
<time datetime="2020-03-27" class="c-list1__date">2020年03月27日</time> <time datetime="2020-03-27" class="c-list1__date">2020年03月27日</time>
<p class="c-list1__tag"> <p class="c-list1__tag">
<span>会社情報</span> <span>会社情報</span>
</p> </p>
</div> </div>
<div class="c-list1__link"> <div class="c-list1__link">
<a href="/news/info/details/20200327/" class="c-list1__txt">基本的欲求サーベイWeb版システムメンテナンスのお知らせ</a> <a href="/news/info/details/20200327/" class="c-list1__txt">基本的欲求サーベイWeb版システムメンテナンスのお知らせ</a>
</div> </div>
</li> </li>
<li class="c-list1__item"> <li class="c-list1__item">
<div class="c-list1__intro"> <div class="c-list1__intro">
<time datetime="2020-03-26" class="c-list1__date">2020年03月26日</time> <time datetime="2020-03-26" class="c-list1__date">2020年03月26日</time>
<p class="c-list1__tag"> <p class="c-list1__tag">
<span>会社情報</span> <span>会社情報</span>
</p> </p>
</div> </div>
<div class="c-list1__link"> <div class="c-list1__link">
<a href="/news/info/details/20200326/" class="c-list1__txt">新型コロナウイルス感染対策に伴う、各種講座・セミナー開催中止のお知らせ(3月26日更新)</a> <a href="/news/info/details/20200326/" class="c-list1__txt">新型コロナウイルス感染対策に伴う、各種講座・セミナー開催中止のお知らせ(3月26日更新)</a>
</div> </div>
</li> </li>
</ul> </ul>
</div> </div>
</div> </div>
</section> </section>
<section class="top2"> <section class="top2">
<div class="c-heading"> <div class="c-heading">
<div class="c-title1"> <div class="c-title1">
<h2 class="c-title1__main">会社情報</h2> <h2 class="c-title1__main">会社情報</h2>
<p class="c-title1__sub">company</p> <p class="c-title1__sub">company</p>
</div> </div>
<div class="c-btn2"> <div class="c-btn2">
<a href="/company/" class="c-btn2__txt">一覧を見る</a> <a href="/company/" class="c-btn2__txt">一覧を見る</a>
</div> </div>
</div> </div>
<div class="container"> <div class="container">
<div class="top2__wrap"> <div class="top2__wrap">
<div class="c-imgtext1"> <div class="c-imgtext1">
<div class="c-imgtext1__img"> <div class="c-imgtext1__img">
<img src="/common_previous/img/img_top_100.jpg" alt="「働きがいのある会社」5年連続選出!"> <img src="/common_previous/img/img_top_100.jpg" alt="「働きがいのある会社」5年連続選出!">
</div> </div>
<div class="c-imgtext1__info"> <div class="c-imgtext1__info">
<h3 class="c-imgtext1__ttl">「働きがいのある会社」5年連続選出!</h3> <h3 class="c-imgtext1__ttl">「働きがいのある会社」5年連続選出!</h3>
<p class="c-imgtext1__txt">2016年~2020年度版の「働きがいのある会<br class="pc-only">社ランキング」従業員100~999人部門にて、<br class="pc-only">ベストカンパニーに選出されました。</p> <p class="c-imgtext1__txt">2016年~2020年度版の「働きがいのある会<br class="pc-only">社ランキング」従業員100~999人部門にて、<br class="pc-only">ベストカンパニーに選出されました。</p>
</div> </div>
</div> </div>
<div class="c-imgtext1 c-imgtext1--reverse"> <div class="c-imgtext1 c-imgtext1--reverse">
<div class="c-imgtext1__img"> <div class="c-imgtext1__img">
<img src="/common_previous/img/img_top_101.jpg" alt="「働きがいのある会社」5年連続選出!"> <img src="/common_previous/img/img_top_101.jpg" alt="「働きがいのある会社」5年連続選出!">
</div> </div>
<div class="c-imgtext1__info"> <div class="c-imgtext1__info">
<p class="c-imgtext1__subttl">2014年卒対象・日本経済新聞社調べ</p> <p class="c-imgtext1__subttl">2014年卒対象・日本経済新聞社調べ</p>
<h3 class="c-imgtext1__ttl">就職希望企業ランキング第93位</h3> <h3 class="c-imgtext1__ttl">就職希望企業ランキング第93位</h3>
<p class="c-imgtext1__txt">業種別ランキングの「サービス・その他」で13位、<br class="pc-only">社員数300名以下の中小企業の中では最高位</p> <p class="c-imgtext1__txt">業種別ランキングの「サービス・その他」で13位、<br class="pc-only">社員数300名以下の中小企業の中では最高位</p>
</div> </div>
</div> </div>
</div> </div>
<div class="c-box"> <div class="c-box">
<div class="c-box__img"> <div class="c-box__img">
<img src="/common_previous/img/img_top_102.png" alt=""> <img src="/common_previous/img/img_top_102.png" alt="">
</div> </div>
<div class="c-box__btn"> <div class="c-box__btn">
<div class="c-btn3"> <div class="c-btn3">
<a href="/company/csr/" class="c-btn3__txt">SDGsについての取り組み</a> <a href="/company/csr/" class="c-btn3__txt">SDGsについての取り組み</a>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</section> </section>
<section class="top3"> <section class="top3">
<div class="c-heading"> <div class="c-heading">
<div class="c-title1"> <div class="c-title1">
<h2 class="c-title1__main">体験セミナー・講演会</h2> <h2 class="c-title1__main">体験セミナー・講演会</h2>
<p class="c-title1__sub">seminar</p> <p class="c-title1__sub">seminar</p>
</div> </div>
<div class="c-btn2"> <div class="c-btn2">
<a href="/pub/schedule#seminar" class="c-btn2__txt">一覧を見る</a> <a href="/pub/schedule#seminar" class="c-btn2__txt">一覧を見る</a>
</div> </div>
</div> </div>
<div class="c-slide1"> <div class="c-slide1">
<div class="c-slide1__inner"> <div class="c-slide1__inner">
<div class="c-slide1__item"> <!--
<a href="/Impressed/"> <div class="c-slide1__item">
<div class="c-slide1__img"> <a href="/Impressed/">
<img src="/common_previous/img/20200605.jpg" alt=""> <div class="c-slide1__img">
</div> <img src="/common_previous/img/20200605.jpg" alt="">
<div class="c-slide1__info"> </div>
<p class="c-slide1__txt"> <div class="c-slide1__info">
<span>東京</span> <p class="c-slide1__txt">
<span>2020年06月05日</span> <span>東京</span>
<span>18:30〜</span> <span>2020年06月05日</span>
</p> <span>18:30〜</span>
</div> </p>
</a> </div>
</div> </a>
<div class="c-slide1__item"> </div>
<a href="http://www.achibook.co.jp/chotassei/" target="_blank"> <div class="c-slide1__item">
<div class="c-slide1__img"> <a href="http://www.achibook.co.jp/chotassei/" target="_blank">
<img src="/common_previous/img/cc17_0317.jpg" alt=""> <div class="c-slide1__img">
</div> <img src="/common_previous/img/cc17_0317.jpg" alt="">
<div class="c-slide1__info"> </div>
<p class="c-slide1__txt"> <div class="c-slide1__info">
<span>東京・名古屋・大阪・福岡・仙台にて開催</span> <p class="c-slide1__txt">
</p> <span>東京・名古屋・大阪・福岡・仙台にて開催</span>
</div> </p>
</a> </div>
</div> </a>
<!-- </div>
<div class="c-slide1__item"> -->
<a href="#"> <!--
<div class="c-slide1__img"> <div class="c-slide1__item">
<img src="/common_previous/img/img_top_105.jpg" alt=""> <a href="#">
</div> <div class="c-slide1__img">
<div class="c-slide1__info"> <img src="/common_previous/img/img_top_105.jpg" alt="">
<p class="c-slide1__txt"> </div>
<span>東京</span> <div class="c-slide1__info">
<span>2020年01月01日</span> <p class="c-slide1__txt">
<span>14:00〜</span> <span>東京</span>
</p> <span>2020年01月01日</span>
</div> <span>14:00〜</span>
</a> </p>
</div> </div>
<div class="c-slide1__item"> </a>
<a href="#"> </div>
<div class="c-slide1__img"> <div class="c-slide1__item">
<img src="/common_previous/img/img_top_103.jpg" alt=""> <a href="#">
</div> <div class="c-slide1__img">
<div class="c-slide1__info"> <img src="/common_previous/img/img_top_103.jpg" alt="">
<p class="c-slide1__txt"> </div>
<span>東京</span> <div class="c-slide1__info">
<span>2020年01月01日</span> <p class="c-slide1__txt">
<span>14:00〜</span> <span>東京</span>
</p> <span>2020年01月01日</span>
</div> <span>14:00〜</span>
</a> </p>
</div> </div>
--> </a>
</div> </div>
</div> -->
</section> </div>
<!-- </div>
<section class="top4"> </section>
<div class="c-heading"> <!--
<div class="c-title1"> <section class="top4">
<h2 class="c-title1__main">コラム</h2> <div class="c-heading">
<p class="c-title1__sub">column</p> <div class="c-title1">
</div> <h2 class="c-title1__main">コラム</h2>
<div class="c-btn2"> <p class="c-title1__sub">column</p>
<a href="#" class="c-btn2__txt">一覧を見る</a> </div>
</div> <div class="c-btn2">
</div> <a href="#" class="c-btn2__txt">一覧を見る</a>
</div>
<div class="container"> </div>
<ul class="c-list2">
<li class="c-list2__item"> <div class="container">
<a href="/service/case/special05/" class="c-list2__inner"> <ul class="c-list2">
<p class="c-list2__tag">内山 正宏氏</p> <li class="c-list2__item">
<div class="c-list2__img"> <a href="/service/case/special05/" class="c-list2__inner">
<img src="/common_previous/img/img_top_106.jpg" alt=""> <p class="c-list2__tag">内山 正宏氏</p>
</div> <div class="c-list2__img">
<div class="c-list2__info"> <img src="/common_previous/img/img_top_106.jpg" alt="">
<p class="c-list2__ttl">トップリーダーの達成ストーリー</p> </div>
<p class="c-list2__txt">飲食業に惚れ込んだ「原点」 自社と業界の発展への決意</p> <div class="c-list2__info">
</div> <p class="c-list2__ttl">トップリーダーの達成ストーリー</p>
</a> <p class="c-list2__txt">飲食業に惚れ込んだ「原点」 自社と業界の発展への決意</p>
</li> </div>
<li class="c-list2__item"> </a>
<a href="/service/case/special02/" class="c-list2__inner"> </li>
<p class="c-list2__tag">小路 晃氏</p> <li class="c-list2__item">
<div class="c-list2__img"> <a href="/service/case/special02/" class="c-list2__inner">
<img src="/common_previous/img/img_top_107.jpg" alt=""> <p class="c-list2__tag">小路 晃氏</p>
</div> <div class="c-list2__img">
<div class="c-list2__info"> <img src="/common_previous/img/img_top_107.jpg" alt="">
<p class="c-list2__ttl">逆転の秘訣</p> </div>
<p class="c-list2__txt">格闘家の栄光と挫折 第二の人生で見出した光</p> <div class="c-list2__info">
</div> <p class="c-list2__ttl">逆転の秘訣</p>
</a> <p class="c-list2__txt">格闘家の栄光と挫折 第二の人生で見出した光</p>
</li> </div>
<li class="c-list2__item"> </a>
<a href="/service/case/special03/" class="c-list2__inner"> </li>
<p class="c-list2__tag">白井一幸氏</p> <li class="c-list2__item">
<div class="c-list2__img"> <a href="/service/case/special03/" class="c-list2__inner">
<img src="/common_previous/img/img_top_108.jpg" alt=""> <p class="c-list2__tag">白井一幸氏</p>
</div> <div class="c-list2__img">
<div class="c-list2__info"> <img src="/common_previous/img/img_top_108.jpg" alt="">
<p class="c-list2__ttl">組織を勝たせるリーダーの発想法</p> </div>
<p class="c-list2__txt">弱小チームを日本一にした“非常識な指導法”</p> <div class="c-list2__info">
</div> <p class="c-list2__ttl">組織を勝たせるリーダーの発想法</p>
</a> <p class="c-list2__txt">弱小チームを日本一にした“非常識な指導法”</p>
</li> </div>
</ul> </a>
</div> </li>
</ul>
</section> </div>
-->
</main> </section>
-->
</main>
<?php include($_SERVER['DOCUMENT_ROOT'] . '/assets/include/footer.php'); ?>
<?php include($_SERVER['DOCUMENT_ROOT'] . '/assets/include/footer.php'); ?>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment