@charset "UTF-8";
aside.jsOpenMenu.absolute{
  display: none;
}
h1 {
  font-size: 4.25vw;
  line-height: 6.15vw;
  letter-spacing: .2vw;
  font-family: 'Oswald', sans-serif;
  font-weight: 200;
  padding: 7.5vw 0 0 13vw;
}

.hero{
  position: relative;
  z-index: 11;
}
.heroText {
  width: 100%;
  padding-left: 0;
  padding-top: 0;
}

.heroText h2 {
  color: #000;
  font-weight: 400;
  width: 100%;
  height: 64vw;
  font-size: 9.3vw;
  display: flex;
  align-items: center;
  padding: 9vw 0 0 13vw;
  letter-spacing: 1.1vw;
  line-height: 13vw;
  text-shadow: 0.26vw 0.26vw 0.51vw #eee;
  font-family: "Oswald", "Bebas Neue", "Bebas", "Noto Sans JP", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
  font-weight: 300;;
}

.heroTextSlide{
  width: 100%;
  height: 100vh;
  overflow: hidden;
  position: relative;
}
.heroText h3{
  position: absolute;
  z-index: 2;
  left: 0;
  top: 0;
  padding: 13vw 0 0 13vw;
  font-size: 5vw;
  letter-spacing: .1vw;
  color: #fff;
  font-weight: 400;
}
.heroText p {
  position: absolute;
  z-index: 2;
  left: 0;
  top: 25vw;
  padding: 0 0 0 13vw;
  font-size: 4vw;
  line-height: 8.75vw;
  letter-spacing: .1vw;
  color: #fff;
}

.aboutText .text p {
  font-weight: 200;
  font-size: 4.36vw;
  line-height: 6vw;
  font-family: "Oswald", "Bebas Neue", "Bebas", "Noto Sans JP", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
}
.designItem{
  display: flex;
  align-items: center;
  height: 64.36vw;
  letter-spacing: .2vw;
  padding: 0 11.79vw 0 12.82vw;
  background-size: cover;
  background:url(/jp/recruitment/assets/img/top/shimanoDesign.png) no-repeat center center/cover;
}
.designItem b.more{
  font-size: 6.6vw;
  font-weight: 200;
  color: #fff;
  padding: 0;
  margin-top: -2vw;
  letter-spacing: .32vw;
}
.designItem b.more::after{
  margin: 0 0 1vw 26.3vw;
}
.recruitCategory,
.projectStory {
  display: flex;
  width: 100%;
  flex-wrap: wrap;
  height: auto;
  background: #FFF;
  color: #fff;
  position: relative;
  z-index: 9;
  transition: all 1s ease;
}

.recruitCategory .categoryItem,
.vision .visionContent{
  position: relative;
  width: 50%;
  height: auto;
  margin: 0;
  display: flex;
  flex-direction: column;
  text-align: center;
}
.recruitCategory .categoryItem.wide,
.vision .visionContent{
  width: 100%;
}
#jobDescription{
  height: 51.3vw;
}
#aboutUs{
  height: 64.7vw;
}
#newbieRecruit b.more,
#careerRecruit b.more{
  bottom: 7vw;
}
.recruitCategory .categoryItem .categoryText,
.vision .visionContent .txt{
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: auto;
  color: #FFF;
}
.recruitCategory .categoryItem .categoryText,
.vision .visionContent .txt{
  height: 100%;
}
.recruitCategory .categoryItem h2,
.vision .visionContent h3{
  margin-top: 14vw;
  font-size: 6vw;
  font-weight: 400;
  letter-spacing: .2vw;
}
.vision .visionContent h3{
  margin-top: 1.5vw;
  font-size: 6.5vw;
}
.recruitCategory .categoryItem p,
.vision .visionContent p{
  margin-top: 1.5vw;
  font-size: 3.1vw;
  letter-spacing: .7vw;
  font-weight: 200;
  font-family: "Oswald", "Bebas Neue", "Bebas", "Noto Sans JP", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
}
.vision .visionContent p{
  margin-top: 18vw;
  letter-spacing: .15vw;
}
.recruitCategory div .more,
.vision .visionContent .more {
  position: absolute;
  bottom: 0;
  left: 0;
}
.recruitCategory .wide .more ,
.vision .visionContent .more{
  bottom: 7vw;
}
.storyWrap .story .more{
  margin-top: 7vw;
}

.recruitContent {
  display: flex;
  flex-direction: column;
}
.recruitContent.pcOnly{
  display: none;
}

.recruitContent div > img {
  width: 100%;
  height: auto;
}

.recruitContent div .text {
  padding: 10vw 13vw 13vw;
  font-size: 4.26vw;
}
.recruitContent div .text h3{
  margin-top: 3vw;
  font-weight: 400;
  font-size: 6.04vw;
  letter-spacing: -.1vw;
}

.recruitContent div .text a {
  margin-top: 10vw;
}

.designItem h3 {
  margin: 0 0 0 0;
  z-index: 3;
}

.designItem .text {
  margin-top: -30vw;
  margin-bottom: 10vw;
  display: flex;
  justify-content: space-between;
}

.designItem .more {
  display: flex;
  display: block;
}

.designItem .more img {
  border: none;
  height: 2vw;
  width: 4vw;
  margin-left: auto;
}


.eventDesign {
  display: flex;
  flex-direction: column;
}

.eventDesign a {
  margin-top: 0;
  width: 100%;
}

.projectStory {
  margin: 0;
}
.storyWrap{
  height: 129.23vw;
  width: 100%;
  position: relative;
}
.storyWrap ul{
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.storyWrap ul::after{
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 2;
  background-image: linear-gradient(145deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 50%);
}
.storyWrap .autoSliderItem img{
  width: 100%;
  height: 100%;
}
.storyWrap .story{
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
}

.storyBlocks {
  width: 100%;
}

.story.TitleBlock {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  padding: 8.5vw 13vw 10vw;
}

.story.TitleBlock h2 {
  width: 70%;
  font-size: 18vw;
  line-height: 22.23vw;
  font-weight: 300;
  font-family: "Oswald", "Bebas Neue", "Bebas", "Noto Sans JP", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
}
.story.TitleBlock .storyCaption {
  width: 100%;
  margin: 1.4vw 0 0 0;
  font-size: 3.56vw;
  line-height: 6.4vw;
}

.story.TitleBlock h3 {
  font-size: 5vw;
  font-weight: 600;
  margin: 15vw 0 0;
}

.storyBlocks{
  position: relative;
}
.storyBlocks .controllScrollButtonWrap{
  position: absolute;
  top: 0;
  bottom: 0;
  width: 100%;  
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.storyBlocks .controllScrollButtonWrap.pcOnly{
  display: none;
}
.storyBlocks .controllScrollButtonWrap button
{
  display: flex;
  justify-self: center;

}
.storyBlocks .controllScrollButtonWrap b{
  display: flex;
  justify-content: center;
  width: 5vw;
  height: 100%;
  align-items: center;
}
.storyBlocks .controllScrollButtonWrap button {
  width: 10.47vw;
  height: 10.47vw;
}
.storyBlocks .controllScrollButtonWrap button svg{
  width: .75vw;
}
.voiceCards button {
  display: flex;
  justify-content: center;
}

.ourFigure {
  width: 100%;
}

.figureCard {
  display: flex;
  flex-direction: column;
}

.works {
  padding: 0;
}
#worksInner{
  padding:8.74vw 12.82vw 15vw;
}
#worksInner h2{
  font-weight: 400;
  font-size: 6.15vw;
  padding-bottom: 5.18vw;
}
#worksInner p{
  font-size: 4.62vw;
  line-height: 8.15vw;
  padding-bottom: 5.69vw;
}

.mono_design .mono,
.topInterview {
  width: 100%;
  height: auto;
  display: block;
  /* padding-top: 4vw;
    padding-left: 8vw;
    padding-right: 21vw;
    padding-bottom: 5vw; */
}

.mono_design .mono img,
.topInterview img {
  width: 100%;
  height: auto;
  position: relative;
  z-index: 1;
}
.mono_design .mono{
  position: relative;
  height: 117.95vw;
  z-index: 1;
}
.mono .text {
  position: absolute;
  z-index: 2;
  margin: 0;
  padding: 24.41vw 12.18vw 26.41vw;
  top: 0;
  color: #fff;
  height: 100%;
}

.mono_design .mono h2{
  font-size: 6.41vw;
  font-weight: 400;
  padding-bottom: 5.46vw;
  text-align: center;
}
.topInterview h2 {
  font-weight: 300;
  font-size: 6.15vw;
  padding-bottom: 10.18vw;
}
.mono_design .mono p{
  font-size: 4.62vw;
    line-height: 8.41vw;
}

.mono_design .mono .more,
.topInterview .more {
  display: flex;
  justify-content: space-between;
  width: 100%;
  margin-top: auto;
}
.topInterview .more.pcOnly{
  display: none;
}

.mono_design .mono .more{
  display: flex;
  justify-content: space-between;
  margin-top: 13.87vw;
  border: none;
  color: #fff;
  padding-top: 3.68vw;
}
.mono_design .mono  a.more::after{
  margin-left: auto;
}

.topInterview .text {
  padding: 8.74vw 12.82vw 14vw;
}

.storyBlocks .controllScrollWrap .controllScrollItemWrap li.storyBlock {
  width: 82.05vw;
  height: 100vw;
  padding: 16vw 12.82vw 12.82vw;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  color: #fff;
}
.storyCaption {
  display: flex;
  flex-direction: column;
  height: 100%;
}
.storyBlocks .controllScrollWrap .controllScrollItemWrap li.storyBlock .more {
  height: 14.1vw;
  font-size: 3.85vw;
  letter-spacing: .8vw;
  padding: 3vw 3.75vw 4vw 7.18vw;
}
.storyBlocks .controllScrollWrap .controllScrollItemWrap li.storyBlock.q_auto {
  background-image: url(/jp/recruitment/assets/img/top/mobility.png);
}
.storyBlocks .controllScrollWrap .controllScrollItemWrap li.storyBlock.tate h3 {
  writing-mode: vertical-rl;
  font-size: 5.4vw;
  line-height: 9.5vw;
  letter-spacing: 0.85vw;
  font-weight: 400;
  width: 30%;
}
.storyBlocks .controllScrollWrap .controllScrollItemWrap li.storyBlock.icebox {
  background-image: url(/jp/recruitment/assets/img/top/fishing.png);
  padding: 12.92vw 12.82vw 12.82vw;
}
.storyBlocks .controllScrollWrap .controllScrollItemWrap li.storyBlock.stellaSw {
  background-image: url(/jp/recruitment/assets/img/top/stellaSw.png);
  background-size: cover;
}
.storyBlocks .controllScrollWrap .controllScrollItemWrap li.storyBlock.xtr {
  background-image: url(/jp/recruitment/assets/img/features/xtr/01.png);
  background-size: cover;
}
.storyBlocks .controllScrollWrap .controllScrollItem.storyBlock.icebox h3{
  font-weight: 300;
  font-size: 5.64vw;
  line-height: 8.97vw;
}

.ourFigure {
  width: 100%;
  height: 174.87vw;
  margin-left: auto;
  background-image: linear-gradient(140deg, #384c5d, #10161c);
  background-image: linear-gradient(140deg, #384c5d, #182028);
  color: #fff;
  padding: 20vw 12.82vw 22vw;
}

.ourFigure h2 {
  font-size: 6.41vw;
  font-weight: 500;
  text-align: center;
  padding-bottom: 20vw;
}

.ourFigure h3 {
  font-size: 40.51vw;
  font-family: "Oswald", "Bebas Neue", "Bebas", "Noto Sans JP", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
  font-weight: 100;
  margin-left: 3vw;
}

.ourFigure h3 span {
  font-family: "Oswald", "Bebas Neue", "Bebas", "Noto Sans JP", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
  writing-mode: vertical-lr;
  font-size: 9.74vw;
  letter-spacing: 2vw;
  margin-bottom: -2vw;
}
.ourFigure h3 span i {
  font-style: normal;
  font-size: 90%;
  position: relative;
  left: -1vw;
}

.figureCard {
  text-align: center;
  height: auto;
}

.figureCard p {
  text-align: center;
  
}
.figureCard p:first-child {
  font-size: 5.38vw;
  margin-bottom: -11vw;

}
.figureCard p:nth-child(3) {
  font-size: 3.5vw;
  line-height: 5.13vw;
  text-align: left;
  padding: 0 8vw;
  margin: -3vw 0 0 3vw;
}
.figureCard a{
  margin-top: 17.95vw;
  border:2px solid #fff;
  color: #fff;
}

.envItem {
  padding: 25vw 12.82vw;
}
.envItem p{
  font-size: 4.62vw;
    line-height: 8.15vw;
}
.environment {
  margin: 0;
  padding-top: 0;
  width: 100%;
  height: 117.95vw;
  background:url(/jp/recruitment/assets/img/top/environment.png) no-repeat;
  background-size: contain;
  color: #fff;
}
.environment h2{
  font-size: 6.41vw;
  font-weight: 500;
  text-align: center;
  padding-bottom: 5vw;
}
.environment .more{
  display: flex;
    justify-content: space-between;
    margin-top: 5.87vw;
    border: none;
    color: #fff;
}

.lowerLinks {
  display: flex;
  flex-direction: column;
  width: auto;
  height: auto;
}
.lowerLinks .linkItem {
  width: 100%;
  padding: 10.74vw 12.82vw 12vw;
  border-bottom: 1px solid;
  border-image: linear-gradient(to right, transparent 15%, #000 15% 85%, transparent 85%);
  border-image-slice: 2;
}

.lowerLinks .linkItem:last-child {
  border: none;
}

.lowerLinks .linkItem h2 {
  font-size: 6.41vw;
  font-weight: 600;
  margin-bottom: 5vw;
}

.lowerLinks .linkItem p {
  font-size: 4.62vw;
  line-height: 8.15vw;
  padding-bottom: 6vw;
}

.lowerLinks .more {
  display: flex;
  justify-content: space-between;
}