@charset "UTF-8";
@import url("https://fonts.googleapis.com/css?family=Oswald:400,500&display=swap");
@import url("https://fonts.googleapis.com/css?family=Noto+Serif+JP&display=swap");
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&display=swap');

/* Common Stylesheet
  ========================================================================== */
.spOnly {
  display: block;
}

.pcOnly,
.more.pcOnly {
  display: none;
}

body {
  position: relative;
  font-family: "Noto Sans JP", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
  font-size: 4.1vw;
}

ul {
  list-style: none;
}

a {
  text-decoration: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

img {
  max-width: 100%;
}

body #menu {
  position: fixed;
  top: 0;
  left: 0;
  transform: translateX(100vw);
  z-index: 13;
  height: 100vh;
  width: 100%;
  background-image: linear-gradient(179deg, rgba(74, 89, 112, 1) 0%, rgba(23, 31, 39, 1) 100%);
  color: #fff;
  flex-wrap: wrap;
  font-size: 1.35vw;
  overflow-y: auto;
  transition: transform .3s ease-in-out;
}
body #menu,
#menu .footer-links,
#menu .bottomLinksWrap{
  /* background: #f3f3f3; */
  background: #FFF;
  
}

body.openMenu #menu {
  transform: translateX(0);
}

#menu h2{
  font-family: "Oswald", "Bebas Neue", "Bebas", "Noto Sans JP", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
  font-size: 4.1vw;
  color: #000;
  font-weight: 300;
  padding: 8vw 13vw 0;
  letter-spacing: .2vw;
}

#menu .footer-links{
  padding-top: 13vw;
  padding-bottom: 1vw;
}
#menu .footer-links ul li {
  padding-bottom: 9.5vw;
}
#menuTopLink{
  display: none;
}
#menu #menuTopLink{
  display: block;
  padding-bottom: 6.4vw;
  font-size: 4.1vw;
  font-weight: 400;
}
#menu #menuTopLink{
  padding-bottom: 9.5vw;
}
#menuTopLink a{
  color: #000;
}

nav {
  position: relative;
}

aside.jsOpenMenu.absolute,
.jsCloseMenu aside {
  position: absolute;
  z-index: 14;
}
.jsActive{
  cursor: pointer;
}

aside.jsOpenMenu.fixed {
  position: fixed;
}
.openMenu aside.jsOpenMenu {
  display: none;
}
aside {
  display: block;
  position: absolute;
  width: 6.5vw;
  z-index: 12;
  top: 7.2vw;
  right: 6.2vw;
  height: 5vw;
}

aside i,
aside b,
.menuBtnBlackWhite aside i,
.menuBtnBlackWhite aside b{
  position: absolute;
  display: inline-block;
  height: 1px;
  border-bottom: 2px solid;
  border-bottom-color: #3B4043;
  top: 0;
  left: 0;
  transform: rotate(0);
  transition: transform .2s, width .2s, top .2s, boder-bottom-color .6s;
  display: block;
  width: 100%;
  border-bottom-color: #3B4043;
  z-index: 2;
}
aside.jsOpenMenu.absolute i,
aside.jsOpenMenu.absolute b,
.menuBtnBlackWhite aside.jsOpenMenu.absolute i,
.menuBtnBlackWhite aside.jsOpenMenu.absolute b {
  border-bottom-color: #FFF;
  z-index: 3;
}


aside i,
.menuBtnBlackWhite aside i {
  top: 1.2vw;
}

aside b,
.menuBtnBlackWhite aside b {
  top: calc(2.9vw + -.5px);
}

/* aside.jsCloseMenu b,
aside.jsCloseMenu i {
  border-bottom-color: #FFF;
  top: 2.2vw;
} */

aside.jsCloseMenu i {
  transform: rotate(-45deg);
  top: 2.5vw;
}
aside.jsCloseMenu b {
  transform: rotate(45deg);
  top: calc(2.65vw + -.5px);
}

.videoWrap{
  position: relative;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
}
.videoWrap .thumbnail,
.videoWrap video{
  position: absolute;
  left: 0;
  z-index: 1;
}
.videoWrap::after{
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 2;
  background: url(/jp/recruitment/assets/img/common/playButton.svg) no-repeat center;
  background-size: 20%;
}
.videoWrap video{
  max-width: 100%;
  z-index: 0;
}
.videoWrap.played .thumbnail,
.videoWrap.played::after{
  display: none;
}

.jsOpenMenu,
.jsCloseMenu {
  cursor: pointer;
}

button:active{
  opacity: .6;
}

/* スライド */
.autoSlider {
  position: relative;
  z-index: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: #000;
}

.autoSlider .autoSliderItem {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-position: center;
  background-size: cover;
  opacity: 0;
  z-index: 1;
  transition: opacity 1s;
}

.autoSlider .autoSliderItem.active {
  opacity: 1;
}

.autoSlider .autoSliderItem.done {
  opacity: 0;
}

/* 横スライド効果 */
.autoSlider.slide .autoSliderItem {
  left: 100vw;
  transition: left .6s;
}

.autoSlider.slide .autoSliderItem.active {
  left: 0;
  opacity: 1;
}

.autoSlider.slide .autoSliderItem.done {
  left: 0;
  opacity: 1;
}

.controllScrollOver {
  position: relative;
  width: 100%;
  margin: auto;
  z-index: 1;
}

.controllScrollOver .controllScrollOver {
  z-index: 2;
}

.controllScrollOver.spOnlyScroll .controllScrollItemWrap {
  min-width: initial;
}

.controllScrollOver.spOnlyScroll::before,
.controllScrollOver.spOnlyScroll::after {
  background-image: none;
}

.controllScrollWrap {
  width: 100%;
  height: 100%;
  overflow-x: scroll;
  overflow-y: hidden;
  -ms-overflow-style: none;
  scrollbar-width: none;
}

.controllScrollWrap::-webkit-scrollbar {
  display: none;
}

.controllScrollWrap .controllScrollItemWrap {
  display: flex;
  height: 100%;
  position: initial;
  width: fit-content;
}
.controllScrollWrap.scroll .controllScrollItemWrap{
  cursor: grab;
}
.controllScrollWrap.scroll .controllScrollItemWrap:active{
  cursor: grabbing;
}

.controllScrollOver.spOnlyScroll .controllScrollWrap {
  overflow-x: initial;
}

.controllScrollOver.spOnlyScroll .controllScrollWrap .controllScrollItemWrap {
  cursor: initial;
  /* pointer-events: none; */
}

.controllScrollWrap .controllScrollItemWrap li {
  height: 100%;
  padding: 0;
  position: relative;
}

.controllScrollButtonWrap {
  display: flex;
  justify-content: space-between;
}
.controllScrollButtonWrap b{
  display: flex;
  justify-content: center;
  align-items: center;
}
.controllScrollBarWrap{
  height: 3.62vw;
  display: flex;
  justify-content: center;
  margin-top: 8.5vw;
}
.controllScrollBar{
  width: 73vw;
  height:1px;
  background: #000;
  border-radius: 3vw;
  position: relative;
  margin: 0 auto;
}
.controllScrollBarActive{
  position: absolute;
  width: 39.84%;
  height: 3px;
  margin-top: -1px;
  background: #000;
  /* border-radius: 3vw; */
  cursor: grab;
}
.controllScrollBarActive:active{
  cursor: grabbing;
}
.scrollWrap {
  width: 100%;
  margin: 0;
}



.tab>li {
  cursor: pointer;
}
ul.tab li.active .activedShow,
ul.tab li .activedNoShow{
  display: block;
}
ul.tab li .activedShow,
ul.tab li.active .activedNoShow{
  display: none;
}

.more {
  padding: 2.25vw;
  margin-top: auto;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  font-family: "Oswald", "Bebas Neue", "Bebas", "Noto Sans JP", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
  font-weight: 200;
  font-size: 3.85vw;
  letter-spacing: .9vw;
}

.more::after {
  content: "";
  display: inline-block;
  background: url("/jp/recruitment/assets/img/common/moreWhite.svg") no-repeat center;
  background-size: contain;
  width: 4vw;
  height: 1.8vw;
  margin: 0 0 0 3vw;
}

a.more {
  display: flex;
  justify-content: space-between;
  border: 2px solid #000;
  color: #000;
  justify-content: space-between;
  padding: 3vw 3.75vw 4vw 6.5vw;
  font-size: 4.2vw;
  letter-spacing: .5vw;
  transition: all .3s;
  font-weight: 400;
}

a.more::after {
  background: url("/jp/recruitment/assets/img/common/moreArrow.svg") no-repeat center;
  background-size: contain;
  transition: all .3s;
}

a.more.blur,
a.more.blurWhite {
  backdrop-filter: brightness(100%) blur(1px);
  background: rgba(255, 255, 255, .3);
  color: #fff;
  border: 2px solid transparent;
}

a.more.blur::after,
a.more.blurWhite::after {
  background-image: url("/jp/recruitment/assets/img/common/moreWhite.svg");
}

.more.white {
  border: 2px solid #fff;
  color: #fff;
}

.more.white::after {
  background-image: url("/jp/recruitment/assets/img/common/moreWhite.svg");
}

.more.pcOnly {
  display: none;
}

.Followfooter {
  position: fixed;
  text-align: center;
  width: 100vw;
  height: 28.21vw;
  background-color: #000;
  color: #fff;
  padding: 0;
  bottom: 0;
  right: 0;
  left: 0;
  z-index: 10;
}
.Followfooter td {
  width: auto;
  font-size: 2.82vw;
  line-height: 3.33vw;
  padding: 0;
  vertical-align: top;
  min-width: 8vw;
  max-width: 13vw;
}
footer.commonFooter .Followfooter td{
  display: none;
}
footer.commonFooter.f_top .Followfooter td.f_top{ display: table-cell }
footer.commonFooter.f_fg .Followfooter td.f_fg{ display: table-cell }
footer.commonFooter.f_career .Followfooter td.f_career{ display: table-cell }
footer.commonFooter.f_staff .Followfooter td.f_staff{ display: table-cell }
footer.commonFooter.f_work .Followfooter td.f_work{ display: table-cell }
footer.commonFooter.f_about .Followfooter td.f_about{ display: table-cell }
footer.commonFooter.f_env .Followfooter td.f_env{ display: table-cell }

.Followfooter td:last-child {
  /* padding-right: 0; */
  border: none;
}

.Followfooter td a {
  width: 100%;
  height: 100%;
  color: #fff;
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: start;
  align-items: center;
  padding: 1vw 0;
  font-size: 2.82vw;
  line-height: 3.33vw;
  border-right: 1px solid;
  border-image: linear-gradient(to bottom, transparent 30%, #99A5B6 30% 54%, transparent 54%);
  border-image-slice: 2;
}

.Followfooter td:last-child a {
  border-right: none;
}

.Followfooter td img {
  width: auto;
  height: 3.72vw;
  display: block;
  margin: 2vw auto 2vw;
}

footer {
  position: relative;
  /* height:calc( 312.82vw + 28.21vw); */
  width: 100%;
  background: #FFF;
  /* padding-bottom: 28vw; */
  height: 327vw;
}


.footer-links {
  background: #f3f3f3;
  display: flex;
  padding: 20.26vw 12.18vw 9vw;
  border-bottom: 1px solid;
  border-image: linear-gradient(to right, transparent 12%, #000 12% 88%, transparent 88%);
  border-image-slice: 2;
}

.footer-links ul {
  order: 2;
  font-size: 4.1vw;
}

.footer-links ul li {
  padding-bottom: 5.9vw;
  padding-bottom: 6.4vw;
}

.footer-links li a,
.bottomLinks li a {
  color: #000;
}

.footerlogo {
  width: 52.89vw;
  order: 1;
  margin: 21.64vw 0 10.82vw 12.18vw;
}

header .Followfooter,
header .forScrollWrap,
.forScrollWrap{
  display: none;
}

.bottomLinksWrap {
  position: relative;
  display: flex;
  justify-content: space-between;
  z-index: 5;
  background: #f3f3f3;
  padding-bottom: 20vw;
}

.bottomLinks {
  display: flex;
  align-items: start;
  margin-left: 12.18vw;
  margin-top: 10vw;
}

.bottomLinks li {
  font-size: 3.33vw;
  margin-bottom: 4.5vw;
}

.bottomLinks li:not(:last-child) {
  margin-right: 5vw;
  padding: 0 0 0;
}


.footer-links,
.bottomLinks,
.bottomLinksWrap {
  display: flex;
  flex-direction: column;
  width: auto;
  height: auto;
}

.bottomLinksWrap small {
  order: 3;
  font-size: 3.1vw;
  padding: 0 0 0 12.18vw;
  color: #000;
}
header .bottomLinksWrap small{
  color: #000;
}

.commonFootContent {
  padding-top: 30vw;

}

.commonFootContent .text {
  padding: 8.94vw 12.08vw;
}

/* 共通パーツ */

/* シマノで働く人（トップページ込） */
.commonPeopleShimano{
  height: 207.9vw;
  margin-top: -1px;
}
.voices {
  color: #000;
}
.voices {
  background: #fff;
  padding-bottom: 14.49vw;
}

.voices .TitleBlock {
  padding: 12.62vw 0 14vw 12.82vw;
}
.voices .TitleBlock h2 {
  font-size: 6.2vw;
  font-weight: 600;
}
.voices .TitleBlock h2 span {
  font-size: 13.73vw;
  letter-spacing: 1.6vw;
  font-weight: 300;
  font-family: "Oswald", "Bebas Neue", "Bebas", "Noto Sans JP", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
  line-height: 25vw;
}

.voices .more {
  padding: 4vw 6.5vw;
  font-weight: 400;
  width: 74.36vw;
  font-size: 3.85vw;
}

.voices .more.spOnly {
  display: flex;
  margin: 7vw 0 0;
}

.voiceCards .controllScrollOver {
  width: 100%;
}

.voiceCards .itemList {
  margin: 0 12.82vw;
}

.voiceCards .controllScrollButtonWrap {
  position: absolute;
  top: -52vw;
  right: 13vw;
  width: 24.37vw;
  /* margin: -134.5vw 0 125vw 63vw; */
}

.voiceCards .itemList li {
  width: 64.1vw;
  margin-right: 12.82vw;
  border-radius: 10px;
  font-size: 3.85vw;
  line-height: 6.41vw;
  height: 111.11vw;
  position: relative;
  background-size: 100%;
  background-repeat: no-repeat;
  background-position: center;
}
.voiceCards .itemList li::after{
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url(/jp/recruitment/assets/img/common/voiceCardArrow.svg) no-repeat center bottom;
  background-size: contain;
  z-index: 2;
}

.controllScrollWrap .controllScrollItemWrap li.voiceCard.staffRA {
  background-image: url(/jp/recruitment/assets/img/common/staff/voiceCardsRA.png);
}

.controllScrollWrap .controllScrollItemWrap li.voiceCard.staffAS {
  background-image: url(/jp/recruitment/assets/img/common/staff/voiceCardsAS.png);
}

.controllScrollWrap .controllScrollItemWrap li.voiceCard.staffHS {
  background-image: url(/jp/recruitment/assets/img/common/staff/voiceCardsHS.png);
}

.controllScrollWrap .controllScrollItemWrap li.voiceCard.staffTE {
  background-image: url(/jp/recruitment/assets/img/common/staff/voiceCardsTE.png);
}

.controllScrollWrap .controllScrollItemWrap li.voiceCard.staffMT {
  background-image: url(/jp/recruitment/assets/img/common/staff/voiceCardsMT.png);
}

.controllScrollWrap .controllScrollItemWrap li.voiceCard.staffTT {
  background-image: url(/jp/recruitment/assets/img/common/staff/voiceCardsTT.png);
}

.controllScrollWrap .controllScrollItemWrap li.voiceCard.staffNM {
  background-image: url(/jp/recruitment/assets/img/common/staff/voiceCardsNM.png);
}

.controllScrollWrap .controllScrollItemWrap li.voiceCard.staffMA {
  background-image: url(/jp/recruitment/assets/img/common/staff/voiceCardsMA.png);
}

.controllScrollWrap .controllScrollItemWrap li.voiceCard.staffYH {
  background-image: url(/jp/recruitment/assets/img/common/staff/voiceCardsYH.png);
}

.controllScrollWrap .controllScrollItemWrap li.voiceCard.staffKM {
  background-image: url(/jp/recruitment/assets/img/common/staff/voiceCardsKM.png);
}

.controllScrollWrap .controllScrollItemWrap li.voiceCard.staffHN {
  background-image: url(/jp/recruitment/assets/img/common/staff/voiceCardsHN.png);
}

.controllScrollWrap .controllScrollItemWrap li.voiceCard.staffHH {
  background-image: url(/jp/recruitment/assets/img/common/staff/voiceCardsHH.png);
}

.controllScrollWrap .controllScrollItemWrap li.voiceCard.staffTY {
  background-image: url(/jp/recruitment/assets/img/common/staff/voiceCardsTY.png);
}

.controllScrollWrap .controllScrollItemWrap li.voiceCard.staffNH {
  background-image: url(/jp/recruitment/assets/img/common/staff/voiceCardsNH.png);
}

.controllScrollWrap .controllScrollItemWrap li.voiceCard.staffHT {
  background-image: url(/jp/recruitment/assets/img/common/staff/voiceCardsHT.png);
}

.controllScrollWrap .controllScrollItemWrap li.voiceCard.staffAN {
  background-image: url(/jp/recruitment/assets/img/common/staff/voiceCardsAN.png);
}

.controllScrollWrap .controllScrollItemWrap li.voiceCard.staffMK {
  background-image: url(/jp/recruitment/assets/img/common/staff/voiceCardsMK.png);
}

.controllScrollWrap .controllScrollItemWrap li.voiceCard.staffME {
  background-image: url(/jp/recruitment/assets/img/common/staff/voiceCardsME.png);
}

.voiceCards .itemList li .name {
  font-size: 3.59vw;
  margin: 3.13vw 0 0;

}

.voiceCards .itemList li a {
  display: block;
  width: 100%;
  height: 100%;
  padding: 0 5.75vw 5.75vw;
  display: flex;
  flex-direction: column;
  color: #fff;
  position: absolute;
  z-index: 3;
  left: 0;
  top: 0;
}

.voiceCards .itemList li p {
  margin-top: auto;
}


.voiceCards button {
  background: #fff;
  border: 1px solid #000;
  width: 10.47vw;
  height: 10.47vw;
  border-radius: 50%;
}
.voiceCards button img{
  width: 1.67vw;
}

/* シマノで働く人 */
.subpage .controllScrollWrap .controllScrollItemWrap li.voiceCard.staffRA {
  background: url(/jp/recruitment/assets/img/common/voiceCardArrow.svg) no-repeat center bottom, url(/jp/recruitment/assets/img/common/staff/voiceCardsRA.png) no-repeat center;
  background-size: contain, contain;
}

.subpage .controllScrollWrap .controllScrollItemWrap li.voiceCard.staffAS {
  background: url(/jp/recruitment/assets/img/common/voiceCardArrow.svg) no-repeat center bottom, url(/jp/recruitment/assets/img/common/staff/voiceCardsAS.png) no-repeat center;
  background-size: contain, contain;
}

.subpage .controllScrollWrap .controllScrollItemWrap li.voiceCard.staffHS {
  background: url(/jp/recruitment/assets/img/common/voiceCardArrow.svg) no-repeat center bottom, url(/jp/recruitment/assets/img/common/staff/voiceCardsHS.png) no-repeat center;
  background-size: contain, contain;
}

.subpage .controllScrollWrap .controllScrollItemWrap li.voiceCard.staffTE {
  background: url(/jp/recruitment/assets/img/common/voiceCardArrow.svg) no-repeat center bottom, url(/jp/recruitment/assets/img/common/staff/voiceCardsTE.png) no-repeat center;
  background-size: contain, contain;
}

.subpage .controllScrollWrap .controllScrollItemWrap li.voiceCard.staffMT {
  background: url(/jp/recruitment/assets/img/common/voiceCardArrow.svg) no-repeat center bottom, url(/jp/recruitment/assets/img/common/staff/voiceCardsMT.png) no-repeat center;
  background-size: contain, contain;
}

.subpage .controllScrollWrap .controllScrollItemWrap li.voiceCard.staffTT {
  background: url(/jp/recruitment/assets/img/common/voiceCardArrow.svg) no-repeat center bottom, url(/jp/recruitment/assets/img/common/staff/voiceCardsTT.png) no-repeat center;
  background-size: contain, contain;
}

.subpage .controllScrollWrap .controllScrollItemWrap li.voiceCard.staffNM {
  background: url(/jp/recruitment/assets/img/common/voiceCardArrow.svg) no-repeat center bottom, url(/jp/recruitment/assets/img/common/staff/voiceCardsNM.png) no-repeat center;
  background-size: contain, contain;
}

.subpage .controllScrollWrap .controllScrollItemWrap li.voiceCard.staffMA {
  background: url(/jp/recruitment/assets/img/common/voiceCardArrow.svg) no-repeat center bottom, url(/jp/recruitment/assets/img/common/staff/voiceCardsMA.png) no-repeat center;
  background-size: contain, contain;
}

.subpage .controllScrollWrap .controllScrollItemWrap li.voiceCard.staffYH {
  background: url(/jp/recruitment/assets/img/common/voiceCardArrow.svg) no-repeat center bottom, url(/jp/recruitment/assets/img/common/staff/voiceCardsYH.png) no-repeat center;
  background-size: contain, contain;
}

.subpage .controllScrollWrap .controllScrollItemWrap li.voiceCard.staffKM {
  background: url(/jp/recruitment/assets/img/common/voiceCardArrow.svg) no-repeat center bottom, url(/jp/recruitment/assets/img/common/staff/voiceCardsKM.png) no-repeat center;
  background-size: contain, contain;
}

.subpage .controllScrollWrap .controllScrollItemWrap li.voiceCard.staffHN {
  background: url(/jp/recruitment/assets/img/common/voiceCardArrow.svg) no-repeat center bottom, url(/jp/recruitment/assets/img/common/staff/voiceCardsHN.png) no-repeat center;
  background-size: contain, contain;
}

.subpage .controllScrollWrap .controllScrollItemWrap li.voiceCard.staffHH {
  background: url(/jp/recruitment/assets/img/common/voiceCardArrow.svg) no-repeat center bottom, url(/jp/recruitment/assets/img/common/staff/voiceCardsHH.png) no-repeat center;
  background-size: contain, contain;
}

.subpage .controllScrollWrap .controllScrollItemWrap li.voiceCard.staffTY {
  background: url(/jp/recruitment/assets/img/common/voiceCardArrow.svg) no-repeat center bottom, url(/jp/recruitment/assets/img/common/staff/voiceCardsTY.png) no-repeat center;
  background-size: contain, contain;
}

.subpage .controllScrollWrap .controllScrollItemWrap li.voiceCard.staffNH {
  background: url(/jp/recruitment/assets/img/common/voiceCardArrow.svg) no-repeat center bottom, url(/jp/recruitment/assets/img/common/staff/voiceCardsNH.png) no-repeat center;
  background-size: contain, contain;
}

.subpage .controllScrollWrap .controllScrollItemWrap li.voiceCard.staffHT {
  background: url(/jp/recruitment/assets/img/common/voiceCardArrow.svg) no-repeat center bottom, url(/jp/recruitment/assets/img/common/staff/voiceCardsHT.png) no-repeat center;
  background-size: contain, contain;
}

.subpage .controllScrollWrap .controllScrollItemWrap li.voiceCard.staffAN {
  background: url(/jp/recruitment/assets/img/common/voiceCardArrow.svg) no-repeat center bottom, url(/jp/recruitment/assets/img/common/staff/voiceCardsAN.png) no-repeat center;
  background-size: contain, contain;
}

.subpage .controllScrollWrap .controllScrollItemWrap li.voiceCard.staffMK {
  background: url(/jp/recruitment/assets/img/common/voiceCardArrow.svg) no-repeat center bottom, url(/jp/recruitment/assets/img/common/staff/voiceCardsMK.png) no-repeat center;
  background-size: contain, contain;
}

.subpage .controllScrollWrap .controllScrollItemWrap li.voiceCard.staffME {
  background: url(/jp/recruitment/assets/img/common/voiceCardArrow.svg) no-repeat center bottom, url(/jp/recruitment/assets/img/common/staff/voiceCardsME.png) no-repeat center;
  background-size: contain, contain;
}




/* シマノを知る・インターンシップ （トップページ以外）*/
.subpage .aboutText{
  margin-bottom: 14vw;
}
.subpage .aboutText img {
  width: 100%;
  display: block;
}

/* シマノを知る・インターンシップ */

/* 仕事を知る・働く環境（トップページ以外） */
.commonFootContentWork{
  min-height: 270vw;
}
.subpage .works {
  background: #fff;
}

.subpage .works.TitleBlock,
.subpage .works .envItem {
  padding: 10vw 0;
}
.subpage .works .envItem{
  position: relative;
}

.subpage .works .TitleBlock img,
.subpage .works .envItem img {
  width: 100%;
  height: auto;
}

.subpage .works .txt {
  padding: 8.94vw 12.08vw 16vw;
}

.subpage .works h2 {
  font-weight: 400;
  margin-bottom: 4vw;
  color: #000;
}

.subpage .works .knowTheJob img,
.subpage .works .envItem img {
  width: 100%;

}

.subpage .works p {
  font-size: 4.62vw;
  line-height: 8.15vw;
  padding-bottom: 6vw;
  color: #000;
}
.subpage .works .aboutText p{
  padding-bottom: 2vw;
}
.subpage .commonFootContent .aboutText h3{
  padding-bottom: 10vw;
  font-size: 6.15vw;
  font-weight: 400;
  letter-spacing: -.02vw;
}
.subpage .works .envItem .txt{
  position: absolute;
  top: 27vw;
  left: 0;
}
.subpage .works .envItem .txt h2{
  text-align: center;
}
.subpage .works .envItem .txt h2,
.subpage .works .envItem .txt p{
  color: #FFF;
}

/* 仕事を知る・働く環境バナー（トップページ以外） */

.subpage .commonFootContent {
  background: #fff;
  position: relative;
  z-index: 5;

}

/* シマノを知る・トップインタビュー​　バナー （トップページ以外）*/
.subpage #bannerWrap>div {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 5vw 13vw;
  width: 100%;
  height: 64.36vw;
  color: #fff;
  font-family: "Oswald", "Bebas Neue", "Bebas", "Noto Sans JP", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
  font-weight: 200;
}
.subpage #bannerWrap>div#topMsg a.spOnly,
.subpage #bannerWrap>div#getToKnowShimano a.spOnly{
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: right;
  width: 113%;
  height: 100%;
  left: -13%;
  padding-right: 13vw;
  z-index: 2;
}

.subpage #bannerWrap p {
  font-size: 5.13vw;
  text-align: justify;
  text-align-last: justify;
}

.subpage #bannerWrap span {
  font-size: 3.33vw;
  display: block;
  text-align: left;
  text-align-last: left;
  width: 100%;
  font-family: "Oswald", "Bebas Neue", "Bebas", "Noto Sans JP", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;

}

.subpage #bannerWrap a img {
  display: block;
  height: 7vw;
  width: 7vw;
}

.subpage #bannerWrap a svg * {
  fill: #fff;
}
.subpage #getToKnowShimano {
  background: url(/jp/recruitment/assets/img/real_figures/bannerGetToKnowShimano.png) no-repeat;
  background-size: contain;
}
#getToKnowShimano a svg{
  width: 3.95vw;
}
.subpage #topMsg {
  background: url(/jp/recruitment/assets/img/real_figures/bannerTopMessage.png) no-repeat;
  background-size: cover;
  background-position: center;
}