/*
Theme Name: CALYX
*/

@import url('https://fonts.googleapis.com/css2?family=Barlow+Semi+Condensed:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Noto+Sans+JP:wght@100..900&display=swap');

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
img {
  max-width: 100%;
  vertical-align: bottom;
}

body {
  color: #333;
  font-family: "Noto Sans JP", sans-serif;
  line-height: 1.8;
}
.font-en {
  font-family: "Barlow Semi Condensed", sans-serif;
  font-weight: 700;
  font-style: normal;
}
header {
  padding: 20px 50px;
  background: rgba(255,255,255,.5);
  position: fixed;
  width: calc(100% - 100px);
  left: 0;
  top: 0;
  z-index: 99;
}
header .headerInner {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
header .headerInner .logo {
  width: 356px;
  transition: .5s;
}
header .headerInner .logo .wh {
  display: none;
}
header .headerInner .headerNav ul {
  display: flex;
  justify-content: flex-end;
}
header .headerInner .headerNav ul li a {
  color: #333;
  margin-left: 30px;
  text-align: center;
  font-size: 12px;
  text-decoration: none;
  display: block;
  transition: .5s;
}
header .headerInner .headerNav ul li a .font-en {
  font-size: 22px;
  position: relative;
}
header .headerInner .headerNav ul li a .font-en:after {
  background-color: #FFF900;
  bottom: 0;
  content: "";
  height: 1px;
  left: 0;
  position: absolute;
  transform: scale(0, 1);
  transform-origin: left top;
  transition: transform .3s;
  width: 100%;
}
header .headerInner .headerNav ul li a:hover .font-en:after {
  transform: scale(1, 1);
}
.fvSliderContainer {
  position: relative;
}
.fvSliderContainer .copy{
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  align-items: center;
  color: #fff;
  z-index: 5;
  width: calc(100% - 20vw);
  padding: 0 10vw;
  height: 100%;
}
.fvSliderContainer .copy>div {
	margin-top: 10%;
}
.fvSliderContainer .copy .font-en {
  font-size: 128px;
  line-height: 1;
}
.fvSliderContainer .copy .jp {
  font-size: 34px;
  font-weight: bold;
  letter-spacing: 1px;
}
.fvSlider img {
  height: 100vh;
  width: 100%;
  object-fit: cover;
}
.pagetop {
  height: 50px;
  width: 50px;
  position: fixed;
  right: 80px;
  bottom: 30px;
  display: none;
  justify-content: center;
  align-items: center;
  z-index: 2;
  cursor: pointer;
  background: none;
  border: none;
  padding: 0;
}
.sectionMission {
  padding: 240px 0 100px;
  background: url(img/bg2.png) no-repeat;
  background-position: left bottom;
  background-size: 90vw 600px;
  position: relative;
}
.sectionMission .container {
  position: relative;
}
.sectionMission .imgTrack {
  position: absolute;
  right: 0;
  top: 80px;
}
.sectionMission .imgTrack .img2 {
  width: 50vw;
  height: 340px;
  object-fit: cover;
}
.sectionMission .imgTrack .img3 {
  width: 35vw;
  margin-top: -80px;
  margin-left: -80px;
}
.sectionMission .container .img1 {
  position: absolute;
  width: 500px;
  max-width: 100%;
  top: -220px;
  left: -100px;
}
.sectionMission .text {
  width: 40%;
}
.sectionMission .text h2 {
  font-size: 30px;
  font-weight: bold;
  margin-bottom: 40px;
}
.sectionMission .text p {
  margin-bottom: 40px;
}
.container {
  width: 1180px;
  max-width: calc(100% - 30px);
  margin: 0 auto;
}
.btnPtn1 {
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
.btnPtn1 a {
  padding: .5rem 1rem;
  cursor: pointer;
  position: relative;
  overflow: hidden;
  background: #16224F;
  border: solid 1px #16224F;
  border-radius: 99px;
  color: #fff;
  text-decoration: none;
  min-width: 300px;
  text-align: center;
  height: 60px;
  line-height: 58px;
}
.btnPtn1 a span {
  width: 100%;
  height: 100%;
  display: inline-block;
  position: relative;
  z-index: 3;
  background: url(img/arrow1.svg) no-repeat;
  background-position: right 20px center;
}
.btnPtn1 a:before {
  display: block;
  content: '';
  position: absolute;
  inset: 0;
  transition: transform 0.6s ease;
  transform: scaleX(0);
  transform-origin: right;
  background: #fff;
}
.btnPtn1 a:hover {
  color: #16224F;
}
.btnPtn1 a:hover span {
  background: url(img/arrow4.svg) no-repeat;
  background-position: right 20px center;
}
.btnPtn1 a:hover::before {
  transform: scaleX(1);
  transform-origin: left;
}
.submitContainer {
  text-align: center;
}
input[type="submit"] {
  padding: 0;
  cursor: pointer;
  position: relative;
  overflow: hidden;
  background: #16224F url(img/arrow1.svg) no-repeat;
  background-position: right 20px center;
  border: solid 1px #16224F;
  border-radius: 99px;
  color: #fff;
  text-decoration: none;
  min-width: 300px;
  text-align: center;
  height: 60px;
  line-height: 58px;
  transition: .5s;
}
input[type="submit"]:hover {
  opacity: .5;
}
.wpcf7-spinner {
  display: block;
  margin: 0 auto;
}
.sectionService {
  padding: 100px 0;
}
.sectionTitle {
  margin-bottom: 40px;
}
.sectionTitle .main {
  display: flex;
	margin-bottom: 10px;
}
.sectionTitle .main .font-en {
  border: solid 8px;
  font-size: 60px;
  margin-right: 10px;
  line-height: 1;
  padding: 15px 20px;
  letter-spacing: 1px;
}
.sectionTitle .main .img-star {
  position: relative;
  top: -15px;
}
.serviceListContainer {
  margin: 60px 0 0;
  position: relative;
}
.serviceListContainer .imgTrack {
  position: absolute;
  right: 0;
  top: 0;
}
.serviceListContainer .imgTrack img {
  width: 48vw;
  height: 560px;
  object-fit: cover;
}
.serviceListContainer .serviceList {
  width: 48%;
  margin-bottom: 40px;
}
.serviceListContainer .serviceList li a {
  display: block;
  background: url(img/arrow2.svg) no-repeat;
  background-position: right center;
  position: relative;
  color: #000;
  text-decoration: none;
  line-height: 1;
  padding: 0 0 30px;
  margin: 0 0 20px;
}
.serviceListContainer .serviceList li a:before {
  position: absolute;
  bottom: 0px;
  left: 0px;
  width: 100%;
  height: 1px;
  background-color: #16224F;
  content: "";
}
.serviceListContainer .serviceList li a:after {
  bottom: 0px;
  left: 0px;
  width: 120px;
  height: 6px;
  background-color: #16224F;
  content: "";
  transition: 0.4s cubic-bezier(0.19, 1, 0.22, 1);
  display: block;
  position: absolute;
}
.serviceListContainer .serviceList li a:hover:after {
  width: 100%;
}
.serviceListContainer .serviceList li a .font-en {
  font-size: 44px;
  letter-spacing: 1px;
  margin-bottom: 5px;
}
.serviceListContainer .serviceList li a p {
  font-weight: bold;
}
.sectionCarLineUp {
  padding: 100px 0;
  position: relative;
  border-bottom: solid 100px #FFF900;
}
.sectionCarLineUp .bg {
  display: flex;
  position: absolute;
  left: 0;
  top: 0;
  z-index: -1;
}
.sectionCarLineUp .bg>div {
  width: 50%;
}
.sectionCarLineUp .bg .img2 img {
  width: 100%;
  height: 236px;
  object-fit: cover;
}
.sectionCarLineUp .sectionTitle {
  color: #fff;
  margin: 0;
}
.sectionCarLineUp .textContainer {
  display: flex;
  justify-content: flex-end;
}
.sectionCarLineUp .text {
  width: 50%;
  padding: 80px;
  margin: 0;
  position: relative;
  z-index: 5;
	margin-top: -9px;
}
.sectionCarLineUp .text:after {
  content: '';
  display: block;
  background: #fff;
  width: 100%;
  height: 60%;
  position: absolute;
  left: 0;
  top: 0;
  z-index: -1;
}
.sectionCarLineUp .text h3 {
  font-weight: bold;
  font-size: 30px;
  margin-bottom: 20px;
}
.sectionCarLineUp .text p {
  margin-bottom: 40px;
}
.sectionCarLineUp .sectionSubTitle {
  position: absolute;
  bottom: 0;
  left: 0;
  width: calc(100% - 10vw);
  padding: 0 5vw;
}
.sectionCarLineUp .sectionSubTitle .font-en {
  color: #FFF900;
  font-size: 140px;
  line-height: .8;
  letter-spacing: 1px;
}
.sectionRecruit {
  padding: 100px 0 240px;
  position: relative;
  background: url(img/bg4.png) no-repeat;
  background-size: 50vw;
  background-position: bottom right;
}
.sectionRecruit .bg1 {
  position: absolute;
  left: 0;
  top: 0;
  width: 280px;
}
.sectionRecruit .text {
  width: 40%;
}
.sectionRecruit .container {
  position: relative;
}
.sectionRecruit .container .img1 {
  position: absolute;
  top: 0;
  right: 20%;
  width: 240px;
}
.sectionRecruit .img2 {
  position: absolute;
  right: 0;
  bottom: 80px;
}
.sectionRecruit .img2 img {
  width: 55vw;
  height: 300px;
  object-fit: cover;
}
.sectionRecruit .text h3 {
  font-weight: bold;
  font-size: 30px;
  margin-bottom: 20px;
}
.sectionRecruit .text p {
  margin-bottom: 40px;
}
.footerBeforeCta {
  background: url(img/bg1.jpg) no-repeat;
  background-size: cover;
  background-position: center;
  padding: 80px 0;
}
.footerBeforeCta .container {
  border: solid 6px #fff;
  padding: 40px;
  max-width: calc(100% - 80px);
}
.footerBeforeCta .container>div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: #fff;
}
.footerBeforeCta .container>div .ctaLeft .head {
  display: flex;
  align-items: center;
  color: #fff;
  margin-bottom: 20px;
}
.footerBeforeCta .container>div .ctaLeft .head h2 {
  font-weight: bold;
  font-size: 48px;
  margin-right: 10px;
  line-height: 1;
}
.footerBeforeCta .container>div .ctaLeft .head p {
  font-weight: bold;
  font-size: 22px;
}
.footerBeforeCta .container>div .ctaRight .ctaList {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
.footerBeforeCta .container>div .ctaRight .ctaList .tel {
  margin-right: 20px;
}
.footerBeforeCta .container>div .ctaRight .ctaList .tel .font-en {
  font-size: 25px;
  line-height: 1.2;
  letter-spacing: 1px;
}
.footerBeforeCta .container>div .ctaRight .ctaList .tel .font-en a {
  color: #fff;
  text-decoration: none;
  font-size: 40px;
}
.footerBeforeCta .container>div .ctaRight .ctaList .btnContact {
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
.footerBeforeCta .container>div .ctaRight .ctaList .btnContact a {
  padding: .5rem 0;
  cursor: pointer;
  position: relative;
  overflow: hidden;
  background: #FFF900;
  border: none;
  border-radius: 99px;
  color: #233064;
  text-decoration: none;
  min-width: 300px;
  text-align: center;
  height: 60px;
  line-height: 58px;
}
.footerBeforeCta .container>div .ctaRight .ctaList .btnContact a span {
  background: url(img/ico-mail.svg) no-repeat;
  background-position: left center;
  padding-left: 30px;
  position: relative;
  z-index: 5;
}
.footerBeforeCta .container>div .ctaRight .ctaList .btnContact a:before {
  display: block;
  content: '';
  position: absolute;
  inset: 0;
  transition: transform 0.6s ease;
  transform: scaleX(0);
  transform-origin: right;
  background: #fff;
}
.footerBeforeCta .container>div .ctaRight .ctaList .btnContact a:hover:before {
  transform: scaleX(1);
  transform-origin: left;
}
footer {
  background: #000;
  color: #fff;
  padding: 80px 0 20px;
}
footer .footerLogo {
  width: 340px;
  margin: 0 auto 80px;
}
footer .footerNav {
  display: flex;
  margin-bottom: 60px;
}
footer .footerNav>div {
  width: 20%;
}
footer .footerNav>div .font-en a {
  display: inline-block;
  position: relative;
  color: #fff;
  text-decoration: none;
  font-size: 36px;
  line-height: 1.2;
  margin-bottom: 10px;
  letter-spacing: 1px;
}
footer .footerNav>div .font-en a:after {
  background-color: #fff;
  bottom: 0;
  content: "";
  height: 1px;
  left: 0;
  position: absolute;
  transform: scale(0, 1);
  transform-origin: left top;
  transition: transform .3s;
  width: 100%;
}
footer .footerNav>div .font-en a:hover:after {
  transform: scale(1, 1);
}
footer .footerNav>div ul li a,
footer .footerNav>div .footerBnr a {
  color: #fff;
  text-decoration: none;
  font-size: 14px;
  transition: .3s;
}
footer .footerNav>div ul li a:hover,
footer .footerNav>div .footerBnr a:hover {
  opacity: .5;
}
footer .footerInfo {
  display: flex;
  font-size: 14px;
  margin-bottom: 40px;
  flex-wrap: wrap;
  align-items: center;
}
footer .footerInfo p {
  margin-right: 40px;
}
footer .footerInfo a {
  color: #fff;
  text-decoration: none;
}
footer .copyright {
  text-align: right;
  font-size: 14px;
}
.drawer-hamburger {
  background: #16224F;
  width: 30px;
  padding: 18px 15px 30px;
}
.drawer-hamburger:hover {
  background-color: #16224F;
}
.drawer-hamburger-icon,
.drawer-hamburger-icon:after,
.drawer-hamburger-icon:before {
  background-color: #fff;
}
.drawer-nav {
  width: 100%;
  background: #16224F;
}
.drawer-nav .btnList,
.drawer-nav .drawer-menu {
  width: 600px;
  max-width: 90%;
  margin: 0 auto 20px;
}
.drawer-nav .btnList {
  margin-top: 80px;
}
.drawer-nav .btnList .tel a {
  background: #fff;
  text-align: center;
  display: block;
  color: #16224F;
  border-radius: 99px;
  padding: 15px;
  text-decoration: none;
  margin-bottom: 10px;
}
.drawer-nav .btnList .tel a .font-en {
  font-size: 30px;
  line-height: 1.2;
  letter-spacing: 1px;
}
.drawer-nav .btnList .tel a .font-en small {
  font-size: 18px;
}
.drawer-nav .btnList .tel a .time {
  font-size: 12px;
}
.drawer-nav .btnList .contact a {
  background: #FFF900;
  color: #16224F;
  border-radius: 99px;
  padding: 25px 15px;
  text-align: center;
  display: block;
  text-decoration: none;
}
.drawer-nav .btnList .contact a span {
  background: url(img/ico-mail.svg) no-repeat;
  background-position: left center;
  padding-left: 30px;
}
.drawer-nav .drawer-menu li a {
  color: #fff;
  display: flex;
  align-items: center;
  font-size: 12px;
  margin-bottom: 15px;
  padding: 0;
}
.drawer-nav .drawer-menu li a .font-en {
  font-size: 28px;
  margin-right: 10px;
  line-height: 1.4;
}
.drawer--right.drawer-open .drawer-hamburger {
  right: 0;
}
.drawer--right .drawer-nav {
  right: -100%;
}
.subpageHeader {
  padding: 200px 7.5vw 80px;
  background: url(img/service/subpage_header.jpg) no-repeat;
  background-size: cover;
  background-position: center;
  color: #fff;
}
.subpageHeader.page-car {
  background: url(img/car/subpage_header.jpg) no-repeat;
  background-size: cover;
  background-position: center;
}
.subpageHeader.page-recruit {
  background: url(img/recruit/subpage_header.jpg) no-repeat;
  background-size: cover;
  background-position: center;
}
.subpageHeader.page-company {
  background: url(img/company/subpage_header.jpg) no-repeat;
  background-size: cover;
  background-position: center;
}
.subpageHeader.page-contact {
  background: url(img/contact/subpage_header.jpg) no-repeat;
  background-size: cover;
  background-position: center;
}
.subpageHeader.page-recruit {
  background: url(img/recruit/subpage_header.jpg) no-repeat;
  background-size: cover;
  background-position: center;
}
.subpageHeader .sectionTitle {
  margin-bottom: 0;
}
.breadthumb {
  padding: 20px 7.5vw;
}
.breadthumb ul {
  display: flex;
  color: #A6A6A6;
}
.breadthumb ul li {
  display: flex;
}
.breadthumb ul li:after {
  content: '／';
  margin: 0 5px;
  display: inline-block;
}
.breadthumb ul li:last-child:after {
  content: none;
}
.breadthumb ul li a {
  color: #A6A6A6;
}
.subpageSection {
  padding: 80px 0;
  text-align: center;
  color: #000;
}
.subpageSection .title {
  font-size: 28px;
  margin-bottom: 20px;
  font-weight: bold;
}
.serviceItems {
  background: url(img/service/bg1.png) no-repeat;
  background-size: 100% 100%;
  padding: 180px 0 80px;
  position: relative;
}
.serviceItems .bgTitle {
  color: #fff;
  font-size: 146px;
  line-height: .6;
  position: absolute;
  right: 0;
  top: 0;
}
.serviceItems h2 {
  text-align: center;
  font-size: 34px;
  margin-bottom: 40px;
  color: #000;
  font-weight: bold;
}
.serviceItems table {
  width: 100%;
  color: #000;
  border: solid 2px #000;
}
.serviceItems table th,
.serviceItems table td {
  border: solid 1px #000;
  padding: 15px 20px;
  text-align: left;
  align-items: center;
}
.serviceItems table th {
  width: 25%;
}
.serviceSection {
  padding: 100px 0 0;
}
#service5,
#car3 {
  margin-bottom: 80px;
}
.serviceSection .sectionTitle {
  text-align: center;
}
.serviceSection .sectionTitle .font-en {
  font-size: 90px;
  line-height: 1.1;
  color: #16224F;
}
.serviceSection .sectionTitle p {
  color: #333;
  font-size: 34px;
  font-weight: bold;
}
.serviceSection .sectionImg {
  margin: 40px 0;
  display: flex;
  justify-content: flex-end;
}
.serviceSection .sectionImg.fadeInLeft {
  justify-content: flex-start;
}
.serviceSection .sectionImg img {
  width: 95vw;
  height: 480px;
  object-fit: cover;
}
.serviceSection .sectionContents {
  position: relative;
  position: relative;
  padding: 160px 0 80px;
  margin-top: -160px;
}
.serviceSection .sectionContents .bg {
  background: #FFF900;
  width: 95vw;
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  height: 100%;
}
.serviceSection .sectionContents .bg.bgRigt {
  left: unset;
  right: 0;
}
.serviceSection .sectionContents .flex {
  display: flex;
  justify-content: space-between;
}
.serviceSection .sectionContents .flex>div {
  width: calc(50% - 20px);
  color: #000;
}
.serviceSection .sectionContents .flex>div table {
  border: solid 2px #000;
  width: 100%;
  margin-top: 40px;
}
.serviceSection .sectionContents .flex>div table th {
  background: #000;
  border: solid 1px #FFF900;
  color: #fff;
  text-align: center;
  padding: 15px;
	vertical-align: middle;
}
.serviceSection .sectionContents .flex>div table td {
  border: solid 1px #000;
  text-align: center;
  padding: 15px;
	vertical-align: middle;
}
.serviceSection .sectionContents .flex>div h3 {
  font-size: 28px;
  font-weight: bold;
  color: #000;
  border-bottom: solid 1px #16224F;
  position: relative;
  padding: 0 0 15px;
  margin: 0 0 15px;
}
.serviceSection .sectionContents .flex>div h3:after {
  content: '';
  display: block;
  background: #16224F;
  width: 120px;
  height: 6px;
  position: absolute;
  left: 0;
  bottom: 0;
}
.serviceSection .sectionContents .bnrText {
  margin-top: 60px;
  text-align: center;
}
.serviceSection .sectionContents .bnrText img {
  width: 270px;
  display: inline-block;
  margin-bottom: 20px;
}
.serviceSection .carList {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 60px 50px;
  color: #000;
}
.serviceSection .carList h3 {
  font-weight: bold;
  font-size: 28px;
  margin: 10px 0 5px;
  line-height: 1.6;
}
.sectionAppeal {
  background: url(img/recruit/bg1.png) no-repeat;
  background-size: 100% 100%;
  padding: 100px 0;
  overflow: hidden;
}
.sectionAppeal h2 {
  color: #16224F;
  font-size: 140px;
  margin-bottom: 80px;
  line-height: 1;
}
.sectionAppeal .appealFlex {
  display: flex;
  justify-content: space-between;
  margin-bottom: 60px;
}
.sectionAppeal .appealFlex.imgLeft {
  margin-bottom: 0;
}
.sectionAppeal .starImg {
  text-align: right;
}
.sectionAppeal .appealFlex.imgLeft .img {
  order: 1;
  margin-left: -25vw;
  margin-right: 0;
}
.sectionAppeal .appealFlex.imgLeft .text {
  order: 2;
}
.sectionAppeal .appealFlex .img {
  width: 50%;
  order: 2;
  margin-right: -5vw;
}
.sectionAppeal .appealFlex .img img {
  max-width: 850px;
  width: 850px;
}
.sectionAppeal .appealFlex .text {
  width: 50%;
  order: 1;
}
.sectionAppeal .appealFlex .text h3 {
  font-size: 28px;
  font-weight: bold;
  border-bottom: solid 1px #16224F;
  position: relative;
  padding: 0 0 15px;
  margin: 0 0 15px;
}
.sectionAppeal .appealFlex .text h3:after {
  content: '';
  display: block;
  background: #16224F;
  width: 120px;
  height: 6px;
  position: absolute;
  left: 0;
  bottom: 0;
}
table.recruit {
  width: 1000px;
  max-width: 100%;
  margin: 0 auto;
}
table.recruit th {
  color: #000;
  border-bottom: solid 1px #000;
  position: relative;
  text-align: left;
  padding: 15px 20px;
  align-items: center;
}
table.recruit th:after {
  content: '';
  display: block;
  width: 100%;
  height: 4px;
  background: #000;
  position: absolute;
  left: 0;
  bottom: 0;
}
table.recruit td {
  color: #000;
  border-bottom: solid 1px #000;
  text-align: left;
  padding: 15px 20px;
  align-items: center;
}
table.recruit td a {
  color: #000;
  text-decoration: none;
}
.sectionJoin {
  margin: 100px 0 80px;
  padding: 80px 0;
  background: url(img/recruit/bg2.jpg) no-repeat;
  background-size: cover;
  background-position: center;
  color: #FFF900;
  text-align: center;
}
.sectionJoin .title1 {
  width: 530px;
  margin: 0 auto -60px;
}
.sectionJoin h2 {
  font-size: 130px;
  line-height: 1.2;
}
.sectionJoin p {
  font-weight: bold;
  font-size: 30px;
  margin-bottom: 30px;
}
.sectionJoin .btnPtn1 a {
  margin: 0 auto;
  background: #fff;
  color: #16224F;
  border: solid 1px #fff;
}
.sectionJoin .btnPtn1 a  span {
  background: url(img/arrow4.svg) no-repeat;
  background-position: right 20px center;
}
.sectionJoin .btnPtn1 a:before {
  background: #16224F;
}
.sectionJoin .btnPtn1 a:hover {
  color: #fff;
}
.sectionJoin .btnPtn1 a:hover span {
  background: url(img/arrow1.svg) no-repeat;
  background-position: right 20px center;
}
#company1 {
  background: url(img/recruit/bg1.png) no-repeat;
  background-size: 30vw;
  background-position: bottom right;
  padding-bottom: 100px;
}
#company1 .message {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
#company1 .message .text {
  width: 50%;
  order: 1;
}
#company1 .message .text .name {
  text-align: right;
  font-size: 20px;
  margin-top: 20px;
}
#company1 .message .img {
  width: 50%;
  text-align: center;
  order: 2;
}
#company1 .message .img img {
  width: 70%;
}
#company2 {
  background: #F6F6F6;
  padding: 100px 0;
}
#company2 .philosophy-title {
  text-align: center;
  font-size: 24px;
}
#company2 .philosophy-title h3 {
  font-size: 60px;
}
#company3 .img2 {
	margin-bottom: 40px;
}
#company4 {
  padding-bottom: 100px;
}
#company4 .googlemap {
  width: 1000px;
  max-width: 100%;
  margin: 0 auto;
  height: 500px;
}
.privacySection {
  padding: 100px 0;
  width: 1000px;
  max-width: 100%;
  margin: 0 auto;
}
.privacySection h2 {
  font-size: 30px;
  margin-bottom: 20px;
  font-weight: bold;
}
.privacySection hr {
  border: none;
  border-top: solid 1px #C9C9C9;
  margin: 30px 0;
}
.contactSection {
  background: #F6F6F6;
  padding: 100px 0;
  margin-bottom: 80px;
}
.contactSection .container {
  width: 1000px;
}
.contactSection .telFlex {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.contactSection .telFlex .text {
  width: 60%;
}
.contactSection .telFlex .tel {
  width: 40%;
}
.contactSection .telFlex .tel a {
  font-size: 48px;
  background: url(img/contact/ico-phone.svg) no-repeat;
  background-position: left center;
  padding-left: 40px;
  text-decoration: none;
  color: #000;
  letter-spacing: 1px;
}
.contactSection .contactForm {
  background: #fff;
  padding: 40px 80px;
  margin: 60px 0 0;
}
.contactSection .contactForm table {
  width: 100%;
}
.contactSection .contactForm table th,
.contactSection .contactForm table td {
  display: block;
  text-align: left;
  width: 100%;
}
.contactSection .contactForm table td {
  margin-bottom: 20px;
  margin-top: 5px;
}
.contactSection .contactForm table th .normal,
.contactSection .contactForm table th .required {
  background: #DBDAD9;
  font-size: 12px;
  padding: 5px 10px;
  display: inline-block;
  margin-right: 10px;
  line-height: 1;
}
.contactSection .contactForm table th .required {
  background: #FFF900;
}
.contactSection .contactForm input[type="text"],
.contactSection .contactForm input[type="tel"],
.contactSection .contactForm input[type="email"],
.contactSection .contactForm textarea {
  border: solid 1px #C9C9C9;
  padding: 10px 15px;
  width: 100%;
  outline: none;
  max-width: calc(100% - 30px);
}
.contactSection .contactForm .wpcf7-list-item {
  margin: 0;
  display: block;
}
.contactSection .contactForm .privacy {
  font-size: 14px;
  margin: 0 0 40px;
}
.contactSection .contactForm .privacy a {
  color: #000;
}
.thanksSection {
  padding: 100px 0;
}
.thanksSection .container {
  width: 1000px;
}
.thanksSection .container h2 {
  font-size: 40px;
  font-weight: bold;
  margin-bottom: 40px;
  text-align: center;
}
.thanksSection .container p {
  margin-bottom: 24px;
}
.thanksSection .container .btnPtn1 a {
  margin: 40px auto 0;
}
.scrolled header {
  background: #16224F;
}
.scrolled header .headerInner .logo .nom {
  display: none;
}
.scrolled header .headerInner .logo .wh {
  display: block;
}
.scrolled header .headerInner .headerNav ul li a {
  color: #fff;
}


@media (min-width: 768px) {
  .pcnon {
    display: none!important;
  }
}

@media (min-width: 1200px) {
  .drawer-hamburger {
    display: none;
  }
}

@media (max-width: 1199px) {
  .footerBeforeCta {
    padding-left: 30px;
    padding-right: 30px;
  }
  .headerNav {
    display: none;
  }
  header {
    padding: 0 15px;
    width: calc(100% - 30px);
    height: 60px;
    display: flex;
    align-items: center;
  }
  header .headerInner .logo img {
    height: 50px;
    width: auto;
  }
  footer .footerNav {
    flex-wrap: wrap;
  }
  footer .footerNav>div {
    width: 50%;
    margin-bottom: 40px;
  }
  footer .footerNav>div:last-child {
    width: 100%;
  }
  footer .footerNav>div .footerBnr a {
    max-width: 300px;
    display: block;
    margin: 40px auto 0;
  }
  footer .footerNav {
    margin-bottom: 0;
  }
  footer .footerInfo p {
    width: 100%;
    margin-bottom: 10px;
    margin-right: 0;
  }
  footer .footerInfo p.fb {
    text-align: center;
    margin-top: 20px;
  }
  footer .copyright {
    text-align: center;
  }
  .footerBeforeCta .container>div {
    display: block;
  }
  .footerBeforeCta .container>div .ctaLeft {
    text-align: center;
    margin-bottom: 40px;
  }
  .footerBeforeCta .container>div .ctaLeft .head {
    justify-content: center;
  }
  .footerBeforeCta .container>div .ctaRight .ctaList {
    justify-content: center;
  }
}

@media (max-width: 767px) {
  .spnon {
    display: none!important;
  }
  .fvSliderContainer .copy .font-en {
    font-size: 48px;
    margin-bottom: 10px;
  }
  .fvSliderContainer .copy .jp {
    font-size: 18px;
  }
  .fvSliderContainer .copy {
    width: calc(100% - 30px);
    padding: 0 15px;
  }
  .sectionMission {
    padding: 100px 0;
    background: url(img/sp_bg1.png) no-repeat;
    background-position: left bottom;
    background-size: 100% calc(100% - 80px);
    display: flex;
    flex-wrap: wrap;
  }
  .sectionMission .imgTrack {
    position: relative;
    order: 1;
    width: 100%;
    top: 0;
    margin-top: 50px;
    margin-bottom: 20px;
  }
  .sectionMission .container {
    order: 2;
    width: 100%;
  }
  .sectionMission .img1 {
    position: absolute;
    width: 70%;
    top: 20px;
    left: 0;
  }
  .sectionMission .imgTrack .img2 {
    width: 100%;
    height: auto;
  }
  .sectionMission .imgTrack .img3 {
    width: 70%;
    margin-top: -40px;
    margin-left: auto;
    margin-right: auto;
  }
  .sectionMission .text {
    width: 100%;
  }
  .sectionMission .text h2 {
    font-size: 20px;
    margin-bottom: 20px;
  }
  .sectionMission .text p {
    margin-bottom: 20px;
  }
  .btnPtn1 a {
    min-width: 80%;
    margin: 0 auto;
  }
  .sectionTitle .main .font-en {
    font-size: 44px;
  }
  .sectionTitle .main .img-star {
    top: -10px;
    width: 60px;
  }
  .serviceListContainer .imgTrack {
    position: relative;
    margin-bottom: 20px;
  }
  .serviceListContainer .imgTrack img {
    width: 100%;
    height: auto;
  }
  .serviceListContainer .serviceList li a .font-en {
    font-size: 32px;
  }
  .serviceListContainer .serviceList li a p {
    font-size: 12px;
  }
  .serviceListContainer .serviceList {
    width: 100%;
  }
  .sectionCarLineUp {
    padding: 180px 0 150px;
    border-bottom: solid 50px #FFF900;
  }
  .sectionCarLineUp .textContainer {
    margin-top: 80px;
  }
  .sectionCarLineUp .bg {
    display: block;
  }
	.sectionCarLineUp .bg .img1 {
		margin-bottom: -1px;
	}
  .sectionCarLineUp .bg>div {
    width: 100%;
  }
  .sectionCarLineUp .sectionSubTitle .font-en {
    font-size: 64px;
  }
  .sectionCarLineUp .text {
    width: 100%;
    padding: 0;
  }
  .sectionCarLineUp .text h3 {
    font-size: 20px;
  }
  .sectionCarLineUp .sectionSubTitle {
    width: calc(100% - 30px);
    padding: 0 15px;
  }
  .sectionRecruit .bg1 {
    width: 25%;
  }
  .sectionRecruit .text {
    width: 100%;
  }
  .sectionRecruit .text h3 {
    font-size: 20px;
  }
  .sectionRecruit .container .img1 {
    position: relative;
    top: 0;
    right: 0;
    width: 168px;
    margin: 0 auto 30px;
  }
  .sectionRecruit .img2 {
    position: relative;
    right: 0;
    bottom: 0;
    margin-left: -15px;
    margin-right: -15px;
    margin-bottom: 40px;
  }
  .sectionRecruit .img2 img {
    width: 100%;
    height: auto;
  }
  .sectionRecruit {
    padding: 100px 0;
    position: relative;
    background: url(img/sp_bg3.png) no-repeat;
    background-size: 80vw;
    background-position: bottom right;
  }
  .footerBeforeCta {
    background: url(img/sp_img4.jpg) no-repeat;
    background-size: cover;
    background-position: center;
    padding: 40px 15px;
  }
  .footerBeforeCta .container {
    padding: 20px;
  }
  .footerBeforeCta .container>div .ctaLeft .head {
    display: block;
  }
  .footerBeforeCta .container>div .ctaLeft .head h2 {
    font-size: 36px;
    margin-right: 0;
  }
  .footerBeforeCta .container>div .ctaLeft .head p {
    font-size: 14px;
  }
  .footerBeforeCta .container>div .ctaRight .ctaList {
    display: block;
  }
  .footerBeforeCta .container>div .ctaRight .ctaList .tel {
    margin-right: 0;
    margin-bottom: 10px;
    background: #fff;
    border-radius: 99px;
    color: #16224F;
    text-align: center;
    padding: 1rem 0;
  }
  .footerBeforeCta .container>div .ctaRight .ctaList .tel p {
    font-size: 12px;
  }
  .footerBeforeCta .container>div .ctaRight .ctaList .tel .font-en {
    font-size: 18px;
  }
  .footerBeforeCta .container>div .ctaRight .ctaList .tel .font-en a {
    font-size: 30px;
    color: #16224F;
  }
  .footerBeforeCta .container>div .ctaRight .ctaList .btnContact a {
    min-width: 100%;
  }
  footer .footerLogo {
    width: 200px;
    margin: 0 auto 40px;
  }
  footer .footerNav>div .font-en a {
    font-size: 28px;
  }
  header .headerInner .logo img {
    height: 40px;
  }
  .subpageHeader {
    padding: 100px 15px 40px;
    background: url(img/service/sp_subpage_header.jpg) no-repeat;
    background-size: cover;
    background-position: center;
  }
  .subpageHeader.page-car {
    background: url(img/car/sp_subpage_header.jpg) no-repeat;
    background-size: cover;
    background-position: center;
  }
  .subpageHeader.page-recruit {
    background: url(img/recruit/sp_subpage_header.jpg) no-repeat;
    background-size: cover;
    background-position: center;
  }
  .subpageHeader.page-company {
    background: url(img/company/sp_subpage_header.jpg) no-repeat;
    background-size: cover;
    background-position: center;
  }
  .subpageHeader.page-contact {
    background: url(img/contact/sp_subpage_header.jpg) no-repeat;
    background-size: cover;
    background-position: center;
  }
  .subpageHeader.page-privacy {
    background: url(img/privacy/sp_subpage_header.jpg) no-repeat;
    background-size: cover;
    background-position: center;
  }
  .breadthumb {
    padding: 20px 15px;
  }
  .subpageSection .title {
    font-size: 20px;
  }
  .serviceItems .bgTitle {
    font-size: 60px;
    line-height: .9;
    text-align: right;
    top: -8px;
  }
  .serviceItems {
    background: url(img/service/sp_bg1.png) no-repeat;
    background-size: 100% 100%;
    padding: 180px 0 80px;
    position: relative;
  }
  .serviceItems h2 {
    font-size: 22px;
  }
  .serviceSection .sectionTitle .font-en {
    font-size: 54px;
  }
  .serviceSection .sectionTitle p {
    font-size: 20px;
  }
  .serviceSection .sectionImg img {
    height: auto;
  }
  .serviceSection .sectionContents .flex {
    display: block;
  }
  .serviceSection .sectionContents .flex>div {
    width: 100%;
  }
  .serviceSection .sectionContents .flex>div:first-child {
    margin-bottom: 40px;
  }
  .serviceSection .sectionContents {
    padding: 160px 40px 80px;
  }
  .serviceSection .sectionContents .flex>div h3 {
    font-size: 20px;
  }
  .serviceSection .sectionContents .flex>div h3:after {
    width: 60px;
    height: 4px;
  }
  .serviceSection .sectionContents .flex>div table th,
  .serviceSection .sectionContents .flex>div table td {
    font-size: 12px;
    padding: 10px;
  }
  .serviceSection .sectionContents .bnrText img {
    width: 170px;
  }
  .serviceSection .carList {
    grid-template-columns: 1fr;
    gap: 40px;
  }
  .serviceSection .carList h3 {
    font-size: 20px;
  }
  .sectionAppeal {
    background: url(img/recruit/sp_bg1.png) no-repeat;
    background-size: 100% 100%;
    padding: 100px 0 40px;
  }
  .sectionAppeal h2 {
    font-size: 60px;
    margin-bottom: 40px;
  }
  .sectionAppeal .appealFlex {
    display: block;
  }
  .sectionAppeal .appealFlex .img {
    width: 100%;
    margin-right: -15px;
  }
  .sectionAppeal .appealFlex .text {
    width: 100%;
  }
  .sectionAppeal .appealFlex .text h3 {
    font-size: 20px;
  }
  .sectionAppeal .appealFlex .img {
    margin-right: -15px;
    margin-bottom: 20px;
  }
  .sectionAppeal .appealFlex .img img {
    max-width: calc(100% + 15px);
    width: calc(100% + 15px);
  }
  .sectionAppeal .appealFlex .text h3:after {
    width: 60px;
    height: 4px;
  }
  .sectionAppeal .appealFlex.imgLeft .img {
    margin-left: -15px;
  }
  .sectionAppeal .starImg {
    margin-top: 20px;
  }
  .sectionAppeal .starImg img {
    width: 100px;
  }
  .sectionJoin h2 {
    font-size: 64px;
  }
  .sectionJoin p {
    font-size: 16px;
  }
  .sectionJoin .title1 {
    width: 80%;
    margin: 0 auto -20px;
  }
  #company1 {
    background: none;
  }
  #company1 .message {
    display: block;
  }
  #company1 .message .img {
    width: 100%;
    background: url(img/company/sp_bg1.png) no-repeat;
    background-size: 60% 100%;
    background-position: right bottom;
    margin-left: -15px;
    margin-right: -15px;
    width: calc(100% + 30px);
    padding: 40px 0;
    margin-bottom: 20px;
  }
  #company1 .message .text {
    width: 100%;
  }
  #company2 .philosophy-title h3 {
    font-size: 34px;
  }
  #company2 .philosophy-title {
    font-size: 16px;
  }
  #company4 .googlemap {
    height: 340px;
  }
  .privacySection h2 {
    font-size: 18px;
  }
  .contactSection .telFlex {
    display: block;
  }
  .contactSection .telFlex .text {
    width: 100%;
  }
  .contactSection .telFlex .tel {
    text-align: center;
  }
  .contactSection .telFlex .tel a {
    font-size: 34px;
		white-space: pre;
  }
  .contactSection .contactForm {
    padding: 20px;
    margin: 30px 0 0;
  }
  .thanksSection .container h2 {
    font-size: 20px;
  }
	table.recruit {
		width: 100%;
	}
	.contactSection {
		padding: 50px 0;
	}
	table.recruit th,
	table.recruit td {
		font-size: 14px;
		padding: 1em 1.5em;
		line-height: 1.5;
	}

}