@charset "UTF-8";
/*!職る人トップ用スタイル*/
#content2{overflow:hidden}
.heroimg::after,.heroimg::before{content:"";position:absolute;bottom:0;left:calc(50% - 1px);display:block;width:1px;z-index:10}
.heroimg::before{background-color:#fff}
.heroimg::after{background-color:#a0a0a0}
.heroimg .bg{-webkit-animation-duration:24s;animation-duration:24s}
.heroimg .bg_01{background-image:url(../img/index/heroimg_01.jpg);-webkit-animation-delay:-3s;animation-delay:-3s}
.heroimg .bg_02{background-image:url(../img/index/heroimg_02.jpg);-webkit-animation-delay:5s;animation-delay:5s}
.heroimg .bg_03{background-image:url(../img/index/heroimg_03.jpg);-webkit-animation-delay:13s;animation-delay:13s}
.intro{background-color:#f7f6f2}
.intro .container{position:relative}
.intro .series{position:absolute}
.intro .copy{position:relative;font-family:"游明朝体","Yu Mincho",YuMincho,serif;letter-spacing:.25em}
.intro .copy p{position:relative;display:inline-block}
.intro .copy p::before{content:"";position:absolute;left:calc(50% - 1em);top:0;display:block;width:2em;height:100%}
.intro .copy p::before{background-color:#fff}
.intro .copy p span{position:relative;display:inline-block;padding:1em 0}
.intro .copy p.animated{opacity:1}
.intro .copy p.animated::before{opacity:0;-webkit-transition:opacity;-o-transition:opacity;transition:opacity}
.intro .copy p.animated::after{content:"";position:absolute;left:calc(50% - 1em);top:0;display:block;width:2em;height:0;background-color:#f4f3ed}
.intro .copy p.animated span{opacity:0;-webkit-transition:opacity;-o-transition:opacity;transition:opacity}
.intro .copy p.show::before{opacity:1;-webkit-transition-delay:.8s;-o-transition-delay:.8s;transition-delay:.8s}
.intro .copy p.show::after{-webkit-animation:text-bg 1.5s cubic-bezier(.645,.045,.355,1);animation:text-bg 1.5s cubic-bezier(.645,.045,.355,1)}
.intro .copy p.show span{opacity:1;-webkit-transition-delay:.6s;-o-transition-delay:.6s;transition-delay:.6s}
.intro .copy .img{position:absolute}
.intro .lead{position:relative}
.section_vol .vol_title{text-align:center}
.section_vol .vol_title .no{display:block}
.section_vol .profile_wrap{position:relative}
.section_vol .profile .text-link{color:#005e8c;text-decoration:none}
.section_vol .profile .text-link .blank img{margin-top:3px}
.menu_wrap{background-color:#f4f3ed}
.menu{text-align:center}
.menu .title{font-family:"游明朝体","Yu Mincho",YuMincho,serif;font-weight:700}
.menu .vol{display:block}
.menu .bg{position:relative;background-repeat:no-repeat;background-position:50% 50%;background-size:cover}
.menu .bg::before{content:"";display:block;width:100%;height:0;padding-top:73.33%}
.menu:hover .bg::after{opacity:1}
.menu .title .mdash:before{content: "——";font-family: serif;letter-spacing: -2px;}
#menu_visit .bg{background-image:url(../img/index/img_visit.jpg)}
#menu_interview1 .bg{background-image:url(../img/index/img_interview1.jpg)}
#menu_interview2 .bg{background-image:url(../img/index/img_interview2.jpg)}
.backnumber{padding-right:20px;padding-left:20px}
.backnumber__list{display:block;width:100%;text-align:center}
.backnumber__list .backnumber__item+.backnumber__item{margin-top: 40px}
.backnumber__item{display:block;width:100%;margin:0;padding:0;list-style:none}
.backnumber__link{position:relative;display:block;width:100%;max-width:900px;margin-right:auto;margin-left:auto}
@media print,screen and (min-width:768px){/*!職る人トップ用スタイル*/
.heroimg::after,.heroimg::before{height:70px}
.heroimg::after{-webkit-animation:scroll-anim 2s cubic-bezier(.645,.045,.355,1) infinite;animation:scroll-anim 2s cubic-bezier(.645,.045,.355,1) infinite}
.intro{padding:85px 0 150px}
.intro .container{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-orient:horizontal;-webkit-box-direction:reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse}
.intro .series{top:125%;left:20px;text-align:left}
.intro .copy{font-size:1.13em;line-height:4.09}
.intro .copy .img{right:78px;bottom:-120px;width:158px;height:173px}
.intro .lead{-webkit-column-count:2;column-count:2;-webkit-column-gap:2.5rem;column-gap:2.5rem;height:760px;margin-top:70px;margin-right:60px;line-height:2.5;-webkit-writing-mode:vertical-rl;-ms-writing-mode:tb-rl;writing-mode:vertical-rl;text-orientation:upright}
.intro .lead p+p{margin-right:2em}
.section_vol{padding-top:90px}
.section_vol .vol_title{margin-bottom:90px;font-size:2em}
.section_vol .vol_title .no{font-size:.56em}
.section_vol .profile_wrap{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;padding-bottom:90px}
.section_vol .profile{display:-webkit-box;display:-ms-flexbox;display:flex;width: calc(50% - 42px);-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}
.section_vol .profile .title-name{-ms-flex-negative:0;flex-shrink:0;margin-top:30px}
.section_vol .profile_01{-webkit-box-orient:horizontal;-webkit-box-direction:reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse}
.section_vol .profile_01 .title-name{position:relative;padding-left: 10px;}
.section_vol .profile_02 .title-name{padding-right: 10px;}
.section_vol .profile_01 .title-name::after,.section_vol .profile_01 .title-name::before{content:"";position:absolute;left:100%;top:50%;width:78.05%;height:1px;background-color:#5a5a5a;-webkit-transform-origin:50% 50%;-ms-transform-origin:50% 50%;transform-origin:50% 50%}
.section_vol .profile_01 .title-name::before{-webkit-transform:translateX(16.5%) rotate(-45deg);-ms-transform:translateX(16.5%) rotate(-45deg);transform:translateX(16.5%) rotate(-45deg)}
.section_vol .profile_01 .title-name::after{-webkit-transform:translateX(16.5%) rotate(45deg);-ms-transform:translateX(16.5%) rotate(45deg);transform:translateX(16.5%) rotate(45deg)}
.section_vol .photo_wrap{-ms-flex-preferred-size:78.02%;flex-basis:78.02%}
.section_vol .photo_wrap .photo{width:61.14%;margin:0 auto 40px}
.section_vol .photo_wrap .title{display:none}
.section_vol .photo_wrap .name{display:none}
.section_vol .photo_wrap .caption{font-size:.88em}
.menu{display:-webkit-box;display:-ms-flexbox;display:flex}
.menu_container{-ms-flex-preferred-size:50%;flex-basis:50%;-webkit-box-sizing:border-box !important;box-sizing:border-box !important;padding:4%;-ms-flex-item-align:center;align-self:center}
.menu .title{font-size:1.38em}
.menu .vol{margin-bottom:8px;font-size:.73em}
.menu .desc{margin-top:30px;font-size:.81em;line-height:2.31}
.menu .btn_link{max-width:280px;margin:40px auto 0}
.menu .bg{-ms-flex-preferred-size:50%;flex-basis:50%}
.menu .bg::after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;display:block;opacity:0;background-repeat:no-repeat;background-position:50% 50%;background-size:cover;-webkit-transition:opacity .5s ease-out;-o-transition:opacity .5s ease-out;transition:opacity .5s ease-out}
#menu_visit .bg::after{background-image:url(../img/index/img_visit_ov.jpg)}
#menu_interview1{-webkit-box-orient:horizontal;-webkit-box-direction:reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse}
#menu_interview1 .bg::after{background-image:url(../img/index/img_interview1_ov.jpg)}
#menu_interview2 .bg::after{background-image:url(../img/index/img_interview2_ov.jpg)}
.backnumber__list{margin-top:100px}
.backnumber__link::before{content:"";position:absolute;top:0;left:0;display:block;width:100%;height:100%;background-color:#fff;opacity:0;-webkit-transition:all .4s;-o-transition:all .4s;transition:all .4s}
.backnumber__link:hover::before{opacity:.3}
.heroimg .container {justify-content: flex-start;}
.heroimg .title_wrap {margin-left: auto;}
.heroimg .vol_title{flex-basis: 29.67%;}
}
@media print,screen and (min-width:1174px){.intro .lead{-webkit-column-count:1;column-count:1;height:380px}
}
@media print,screen and (min-width:1200px){.menu_container{-ms-flex-preferred-size:39.13%;flex-basis:39.13%}
}
@media only screen and (max-width:767px){/*!職る人トップ用スタイル*/
.heroimg .vol_title{position:absolute;bottom:45px}
.heroimg::after,.heroimg::before{height:35px}
.heroimg::after{-webkit-animation:scroll-anim-sp 2s cubic-bezier(.645,.045,.355,1) infinite;animation:scroll-anim-sp 2s cubic-bezier(.645,.045,.355,1) infinite}
.heroimg .bg_01{background-image:url(../img/index/heroimg_01_sp.jpg)}
.heroimg .bg_02{background-image:url(../img/index/heroimg_02_sp.jpg)}
.heroimg .bg_03{background-image:url(../img/index/heroimg_03_sp.jpg)}
.intro{padding:65px 0}
.intro .series{opacity:1;left:30px}
.intro .copy{margin-left:auto;padding-right:25px;line-height:3.44}
.intro .copy .img{right:72%;bottom:-15px;width:154px;height:170px;background-size:173px auto}
.intro .lead{margin-top:50px;line-height:1.82}
.intro .lead p+p{margin-top:2em}
.section_vol{padding-top:60px}
.section_vol .vol_title{margin-bottom:40px;font-size:1.71em}
.section_vol .vol_title .no{font-size:.67em}
.section_vol .profile_wrap{padding-bottom:75px}
.section_vol .profile .title-name{display:none}
.section_vol .profile_02{position:relative;padding-top:90px}
.section_vol .profile_02::after,.section_vol .profile_02::before{content:"";position:absolute;left:calc(50% - 27px);top:45px;width:54px;height:1px;background-color:#5a5a5a;-webkit-transform-origin:50% 50%;-ms-transform-origin:50% 50%;transform-origin:50% 50%}
.section_vol .profile_02::before{-webkit-transform:rotate(-45deg);-ms-transform:rotate(-45deg);transform:rotate(-45deg)}
.section_vol .profile_02::after{-webkit-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg)}
.section_vol .photo_wrap .photo{width:168px;margin:0 auto 20px}
.section_vol .photo_wrap .title{font-family:"游明朝体","Yu Mincho",YuMincho,serif;text-align:center}
.section_vol .photo_wrap .name{margin-top:5px;font-size:1.56em;font-family:"游明朝体","Yu Mincho",YuMincho,serif;text-align:center}
.section_vol .photo_wrap .caption{margin-top:20px}
.menu{padding-bottom:60px}
.menu .title{font-size:1.36em}
.menu .vol{font-size:.74em}
.menu .desc{margin-top:20px;font-size:.86em;line-height:2.08}
.menu .btn_link{max-width:220px;margin:30px auto 0}
.menu .bg{margin-bottom:40px}
.backnumber__list{margin-top:40px}
.backnumber__list .backnumber__item+.backnumber__item{margin-top: 20px}
}
@-webkit-keyframes slide-anim{0%{opacity:0;-webkit-transform:scale(1) rotate(0.1deg);transform:scale(1) rotate(0.1deg)}
20.83%{opacity:1}
33.33%{opacity:1}
41.66666%{opacity:0}
100%{opacity:0;-webkit-transform:scale(1.24);transform:scale(1.24)}
}
@keyframes slide-anim{0%{opacity:0;-webkit-transform:scale(1) rotate(0.1deg);transform:scale(1) rotate(0.1deg)}
20.83%{opacity:1}
33.33%{opacity:1}
41.66666%{opacity:0}
100%{opacity:0;-webkit-transform:scale(1.24);transform:scale(1.24)}
}
@-webkit-keyframes scroll-anim{0%{height:0;bottom:70px}
50%{height:70px;bottom:0}
100%{height:0;bottom:0}
}
@keyframes scroll-anim{0%{height:0;bottom:70px}
50%{height:70px;bottom:0}
100%{height:0;bottom:0}
}
@-webkit-keyframes scroll-anim-sp{0%{height:0;bottom:35px}
50%{height:35px;bottom:0}
100%{height:0;bottom:0}
}
@keyframes scroll-anim-sp{0%{height:0;bottom:35px}
50%{height:35px;bottom:0}
100%{height:0;bottom:0}
}
