@charset "UTF-8";
/* ==================================================
[Style]
	 1. Reset
	 2. Animation
	 3. General
================================================== */
/* --------------------------------------------------
	 1. Reset
-------------------------------------------------- */

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  vertical-align: baseline;
  background: transparent;
}

article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section {
    display: block;
}

nav ul {
  list-style: none;
}

a {
  margin: 0;
  padding: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}


/* --------------------------------------------------
	 2. Animation
-------------------------------------------------- */
@keyframes fade-in3 {
	0% {
	  opacity: 0;
	  transform: translate3d(0, 20px, 0);
	}
	100% {
	  opacity: 1;
	  transform: translate3d(0, 0, 0);
	}
}

@keyframes fade-in4 {
	0% {
	  opacity: 1;
	  transform: translate3d(0, 20px, 0);
	}
	100% {
	  opacity: 1;
	  transform: translate3d(0, 0, 0);
	}
}

/* --------------------------------------------------
	 3. General
-------------------------------------------------- */
*,
*::before,
*::after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

body {
	word-break: normal;
	overflow-wrap: normal;
	word-wrap: normal;
	background-color: #fff;
	-webkit-font-smoothing: antialiased;
	-webkit-text-size-adjust: 100%;
	letter-spacing: 0;
	line-height: 1.8;
	color: #394862;
	font-family: 'Hiragino Kaku Gothic ProN', sans-serif;
    font-size: 10px;
}

em {
    font-family: 'Roboto Condensed', sans-serif;
    letter-spacing: -0.02em;
    font-size: 1.1em;
}

a {
  outline: none;
  word-break: break-all;
  overflow-wrap: break-word;
  word-wrap: break-word;
}

a:link, a:visited {
  color: #394862;
  text-decoration: none;
}

a:hover, a:active {
  text-decoration: underline;
}

ul, ol {
  list-style: none;
}

em, dl, i, address {
  font-style: normal;
}

sup, sub {
  font-size: 0.5em;
}

sup {
  vertical-align: text-top;
}

sub {
  vertical-align: text-bottom;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
  font-size: 1rem;
  font-family: inherit;
}

table th, table td {
  text-align: left;
  vertical-align: middle;
  padding: 1em;
}

table th {
  font-weight: normal;
}

table td {
  word-break: break-all;
  overflow-wrap: break-word;
  word-wrap: break-word;
}

img {
	width: 100%;
  max-width: 100%;
  height: auto;
}

/* fadeInAnime
------------------------------------------ */
.fadeIn {
    transition-property: opacity, transform;
    transition-duration: 1s;
    transition-timing-function: cubic-bezier(0.000, 0.295, 0.500, 1.000);
    opacity: 0;
    -webkit-transform: translate(0, 60px);
    transform: translate(0, 60px);
}
.fadeIn[data-delay="1"]{ transition-delay: 0.2s;}
.fadeIn[data-delay="2"]{ transition-delay: 0.4s;}
.fadeIn[data-delay="3"]{ transition-delay: 0.6s;}
.fadeIn[data-delay="4"]{ transition-delay: 0.8s;}
.fadeIn[data-delay="5"]{ transition-delay: 1s;}
.fadeIn[data-delay="6"]{ transition-delay: 1.2s;}
.fadeIn[data-delay="7"]{ transition-delay: 1.4s;}
.fadeIn[data-delay="8"]{ transition-delay: 1.6s;}
.fadeIn[data-delay="9"]{ transition-delay: 1.8s;}
.fadeIn[data-delay="10"]{ transition-delay: 2s;}
.fadeIn[data-delay="11"]{ transition-delay: 2.2s;}
.fadeIn[data-delay="12"]{ transition-delay: 2.4s;}

.fadeIn.is_done{
    opacity: 1;
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
}

.pc {	display: block!important;}
.sp {	display: none!important;}
@media screen and (max-width:764px) {
  .pc { display: none!important;}
  .sp { display: block!important;}
}

/* deco
------------------------------------------ */
:root {
  --primary-color: #3f48e4;
  --secondary-color: #394862;
  --en: 'Fira Sans', sans-serif;
}
.large110 { font-size: 110%;}
.large120 { font-size: 120%;}
.large130 { font-size: 130%;}
.large160 { font-size: 160%;}
.large170 { font-size: 170%;}
.large180 { font-size: 180%;}
.large200 { font-size: 200%;}
.small90 { font-size: 90%;}
.small80 { font-size: 80%;}
.bold { font-weight: bold;}
.blue { color: var(--primary-color);}
.en { font-family: var(--en); font-weight: 500;}

/* --------------------------------------------------
	 header
-------------------------------------------------- */
header {
	background-color: #fff;
  max-width: 1160px;
  padding: 0 20px;
  margin: 0 auto;
  height: 85px;
  display: flex;
  align-items: center;
}
header h1,
header h1 a {
  line-height: 0;
}
header h1 .headerLogo {
  width: 256px;
}
@media screen and (max-width:764px) {
  header {
    height: 52px;
  }
  header h1 .headerLogo {
      width: 167px;
  }
}


/* --------------------------------------------------
	 a
-------------------------------------------------- */
main a {
    -webkit-transition: 0.7s;
    -moz-transition: 0.7s;
    -o-transition: 0.7s;
    -ms-transition: 0.7s;
    transition: 0.7s;
}
main a:hover {
	opacity: .7;
    -webkit-transition: 0.2s;
    -moz-transition: 0.2s;
    -o-transition: 0.2s;
    -ms-transition: 0.2s;
    transition: 0.2s;
}

/* --------------------------------------------------
	 kv
-------------------------------------------------- */
.kv {
  width: 100%;
  height: 520px;
  background: url("../img/bg01.jpg");
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
  overflow: hidden;
  padding: 0;
}
.kv div {
  width: 100%;
  max-width: 1000px;
  margin: 0 auto;
}
@media screen and (max-width:750px) {
  .kv {
    height: auto;
    background: none;
  }
}

/* --------------------------------------------------
	 slide
-------------------------------------------------- */

.slide > img{
    max-width: 832px;
    margin: 0 auto;
}

.slide p{
    font-size: 14px;
    line-height: 1.5;
    color: #7b798b;
    width: 100%;
    max-width: 536px;
    margin: 0 auto;
}

@media screen and (max-width:750px) {
.slide img{
    width: 138.4vw;
}

.slide .slick-track{
    width: 986.67vw !important;
}

.slide .slick-slide{
    width: 138.4vw !important;
}

.slide p{
    font-size: 2.67vw;
    max-width: 89.33vw;
}
}

/* --------------------------------------------------
	 btnArea
-------------------------------------------------- */
.btnArea{
  padding: 47px 0 58px;
}
.btnArea ul{
	width: 320px;
	margin: 0 auto;
}

.btnArea ul li + li{
	margin-top: 20px;
}

.btnArea ul li a{
	width: 100%;
    height: 44px;
    background: #3f48e4;
	border-radius: 22px;
    text-align: center;
    font-size: 16px;
    font-weight: bold;
    line-height: 1;
    color: #fff;
    padding-top: 14px;
    display: block;
}

.btnArea ul li a.recruitId{
    background: #fff;
    color: #3f48e4;
    box-shadow: 0px 0px 3px 0px #8887db;
}

.btnArea ul li a.recruitId span{
    padding-left: 30px;
    position: relative;
}

.btnArea ul li a.recruitId span::before{
    content: "";
    background: url("../img/cv_area_logo.png") no-repeat center;
    background-size: contain;
    width: 20px;
    height: 20px;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
}

.btnArea ul li a:hover{
	text-decoration: none;
}

@media screen and (max-width:750px) {
.btnArea{
  padding: 5.467vw 0 10.67vw;
}
.btnArea ul{
	width: 85.33vw;
}

.btnArea ul li + li{
	margin-top: 5.33vw;
}

.btnArea ul li a{
    height: 11.733vw;
	border-radius: 5.867vw;
    font-size: 4.8vw;
    padding-top: 3.467vw;
}

.btnArea ul li a.recruitId{
    box-shadow: 0px 0px 1.6vw 0px #8887db;
}

.btnArea ul li a.recruitId span{
    padding-left: 11.733vw;
}

.btnArea ul li a.recruitId span::before{
    width: 5.2vw;
    height: 5.2vw;
}
}


/* --------------------------------------------------
	 offers
-------------------------------------------------- */
.offers h2{
    width: 100%;
    height: 12.15278vw;
    min-height: 175px;
    background: url("../img/bg02.png") no-repeat center;
    background-size: cover;
    font-size: 24px;
    font-weight: bold;
    line-height: 1;
    color: #394862;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 31px;
}
.offers h2 strong{
    color: #3f48e4;
}
.offers .example{
    width: 100%;
    background: #f4f5ff;
    padding: 105px 0 73px;
    position: relative;
}

.offers .example::before{
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-right: 270px solid transparent;
    border-left: 270px solid transparent;
    border-top: 56px solid #ffffff;
    border-bottom: 0;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
}

.offers .example h3{
    width: 100%;
    max-width: 540px;
    margin: 0 auto;
    font-size: 28px;
    line-height: 1;
    font-weight: bold;
    color: #3f48e4;
    text-align: center;
    position: relative;
}

.offers .example h3::before{
    content: "";
    width: calc((100% - 206px) / 2);
    height: 1px;
    background: #3f48e4;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
}

.offers .example h3::after{
    content: "";
    width: calc((100% - 206px) / 2);
    height: 1px;
    background: #3f48e4;
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
}

.offers .example ul{
    width: 100%;
    max-width: 540px;
    margin: 30px auto 0;
    display: flex;
    justify-content: space-between;
}

.offers .example ul li{
    width: 260px;
    background: #fff;
    border-radius: 10px;
    padding-bottom: 24px;
}

.offers .example ul li h4{
    width: 100%;
    background: #7c84ff;
    padding: 12px 0 10px;
    font-size: 17px;
    color: #fff;
    line-height: 1.33;
    text-align: center;
    border-radius: 10px 10px 0 0;
}

.offers .example ul li h4 strong{
    font-size: 120%;
    color: #efdd24;
    font-weight: bold;
}

.offers .example ul li .salary{
    font-size: 17px;
    font-weight: bold;
    color: #394862;
    line-height: 1;
    text-align: center;
    margin-top: 6px;
    display: block;
}

.offers .example ul li .salary strong{
    font-size: 38px;
    color: #3f48e4;
    bottom: -2px;
    position: relative;
    padding: 0 0.05em;
}

.offers .example ul li .tag{
    font-size: 18px;
    font-weight: bold;
    color: #394862;
    line-height: 1;
    text-align: center;
    margin-top: 9px;
    display: block;
}

.offers .example ul li a{
	width: 226px;
    height: 29px;
	border-radius: calc(29px / 2);
    text-align: center;
    font-size: 14px;
    font-weight: bold;
    line-height: 1;
    color: #3f48e4;
    padding-top: 7px;
    display: block;
    box-shadow: 0px 0px 3px 0px #8887db;
    margin: 15px auto 0;
}

.offers .example ul li a:hover{
	text-decoration: none;
}

.offers .example p{
	width: 540px;
    font-size: 14px;
    line-height: 1;
    color: #7b798b;
    margin: 15px auto 0;
}

@media screen and (max-width:750px) {
.offers h2{
    height: 27.867vw;
    min-height: inherit;
    background: url("../img/bg02_sp.png") no-repeat center;
    background-size: 100% auto;
    font-size: 4.8vw;
    margin-bottom: 0;
}
.offers .example{
    padding: 20vw 0 9.33vw;
}

.offers .example::before{
    border-right: 50vw solid transparent;
    border-left: 50vw solid transparent;
    border-top: 10.67vw solid #ffffff;
}

.offers .example h3{
    max-width: 90.67vw;
    font-size: 5.33vw;
}

.offers .example h3::before{
    width: calc((100% - 34.67vw) / 2);
}

.offers .example h3::after{
    width: calc((100% - 34.67vw) / 2);
}

.offers .example ul{
    max-width: 90.67vw;
    margin: 6.267vw auto 0;
}

.offers .example ul li{
    width: 44vw;
    border-radius: 1.33vw;
    padding-bottom: 4.4vw;
}

.offers .example ul li h4{
    padding: 2.267vw 0 2vw;
    font-size: 3.2vw;
    border-radius: 1.33 1.33 0 0;
}

.offers .example ul li .salary{
    font-size: 3.6vw;
    margin-top: 2.67vw;
}

.offers .example ul li .salary strong{
    font-size: 8vw;
    bottom: -0.267vw;
}

.offers .example ul li .tag{
    font-size: 3.733vw;
    margin-top: 2.267vw;
}

.offers .example ul li a{
	width: 36.912vw;
    height: 6.30933vw;
	border-radius: calc(6.30933vw / 2);
    font-size: 2.912vw;
    padding-top: 1.867vw;
    box-shadow: 0px 0px 1.6vw 0px #8887db;
    margin: 3.733vw auto 0;
}

.offers .example p{
	width: 90.67vw;
    font-size: 2.67vw;
    margin: 2.67vw auto 0;
}
}



/* --------------------------------------------------
	 cv
-------------------------------------------------- */
.cv {
    background: #f4f5ff;
}

.cv .inner {
	width: 100%;
    border-radius: 0 160px 0 0;
    background: url("../img/bg03.jpg") no-repeat center;
    background-size: cover;
    padding: 36px 0;
}

.cv .inner h2 {
	font-size: 32px;
    font-weight: bold;
    line-height: 1.5;
    text-align: center;
    color: #fff;
    margin-bottom: 35px;
}

@media screen and (max-width:750px) {
.cv .inner {
    border-radius: 0 21.33vw 0 0;
    background: url("../img/bg03_sp.jpg") no-repeat center;
    background-size: cover;
    padding: 9.733vw 0 9.6vw;
}

.cv .inner h2 {
	font-size: 6.4vw;
    margin-bottom: 6.4vw;
}
}

/*
cv 中身
------------------------------ */

.cv dl {
	margin: 0 auto;
	max-width: 580px;
    padding: 0 16px;
    border-radius: 24px;
    background: #fff;
}
.cv dl dt{
	padding: 24px 0;
	text-align: center;
    border-bottom: 1px solid #eeeeee;
}

.cv dl dt a{
	width: 320px;
    height: 44px;
    background: #3f48e4;
	border-radius: 22px;
    text-align: center;
    font-size: 16px;
    font-weight: bold;
    line-height: 1;
    color: #fff;
    padding-top: 14px;
    display: block;
    margin: 0 auto;
}

.cv dl dt a:hover{
	text-decoration: none;
}

.cv dl dd {
	padding: 25px 0 24px;
	text-align: center;
}

.cv dl dd p {
	font-size: 12px;
    line-height: 1.5;
    font-weight: bold;
    color: #7b798b;
}
.cv dl dd ul {
  display: flex;
  justify-content: space-between;
  width: 256px;
  margin: 20px auto 23px;
}
.cv dl dd ul li:nth-child(1){
	width: 65px;
}
.cv dl dd ul li:nth-child(2){
	width: 43px;
}
.cv dl dd ul li:nth-child(3){
	width: 41px;
}
.cv dl dd ul li:nth-child(4){
	width: 43px;
}
.cv dl dd ul li img {
	display: block;
	width: 100%;
}

.cv dl dd a{
	width: 320px;
    height: 44px;
	border-radius: 22px;
    text-align: center;
    font-size: 16px;
    font-weight: bold;
    line-height: 1;
    color: #3f48e4;
    padding-top: 14px;
    display: block;
    box-shadow: 0px 0px 3px 0px #8887db;
    margin: 0 auto;
}

.cv dl dd a span{
    padding-left: 30px;
    position: relative;
}

.cv dl dd a span::before{
    content: "";
    background: url("../img/cv_area_logo.png") no-repeat center;
    background-size: contain;
    width: 20px;
    height: 20px;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
}

.cv dl dd a:hover{
	text-decoration: none;
}

@media screen and (max-width:750px) {
.cv dl {
	max-width: 89.33vw;
    padding: 0 4.267vw;
    border-radius: 6.67vw;
}
.cv dl dt{
	padding: 4.4vw 0 6.4vw;
}

.cv dl dt a{
	width: 80.8vw;
    height: 11.733vw;
	border-radius: 5.867vw;
    font-size: 4.8vw;
    padding-top: 3.467vw;
}

.cv dl dd {
	padding: 6.4vw 0 4.267vw;
}

.cv dl dd p {
	font-size: 3.2vw;
}
.cv dl dd ul {
  width: 67.867vw;
  margin: 5.33vw auto 6.267vw;
}
.cv dl dd ul li:nth-child(1){
	width: 16.267vw;
}
.cv dl dd ul li:nth-child(2){
	width: 11.33vw;
}
.cv dl dd ul li:nth-child(3){
	width: 10.8vw;
}
.cv dl dd ul li:nth-child(4){
	width: 11.467vw;
}

.cv dl dd a{
	width: 80.8vw;
    height: 11.733vw;
	border-radius: 5.867vw;
    font-size: 4.8vw;
    padding-top: 3.467vw;
    box-shadow: 0px 0px 1.6vw 0px #8887db;
}

.cv dl dd a span{
    padding-left: 11.733vw;
}

.cv dl dd a span::before{
    width: 5.2vw;
    height: 5.2vw;
}
}



/* --------------------------------------------------
	 footer
-------------------------------------------------- */
footer {
	border-top: solid 1px #E8E6EB;
	background-color: #FFFFFF;
	padding-top: 12px;
	padding-bottom: 12px;
}
footer .inner {
	padding: 20px;
    max-width: 1120px;
    margin: 0 auto;
}
footer .inner dl {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: space-between;
    -ms-flex-pack: space-between;
    justify-content: space-between;
}
footer .inner dl dt img {
	width: 250px;
}
footer .inner dl dd ul li {
	display: inline-block;
    margin-right: 12px;
    padding-right: 12px;
	line-height: 1;
    font-size: 11px;
	border-right: solid 1px #394862;
}
footer .inner dl dd ul li:last-child {
    margin-right: 0px;
    padding-right: 0px;
	border-right: none;
}
footer .inner dl dd ul li a {
	color: #394862;
}
@media screen and (max-width:764px) {
  footer .inner {
     padding: 10px 5.6vw;
  }
  footer .inner dl {
    display: block;
    position: relative;
    padding-bottom: 15%;
  }
  footer .inner dl dt {
    position: absolute;
    bottom: 0;
    left: 0;
  }
  footer .inner dl dd ul {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
  }
  footer .inner dl dd ul li {
    margin-right: 0px;
      padding-right: 0px;
      width: 50%;
      border-right: none;
    padding: 7px;
  }
}
