@charset "UTF-8";
@import "base.css";
@import "fonts.css";
/*==========================================================================*/
/*    base.css  --> スタイルの初期設定を行うため、変更しないで下さい。      */
/*    fonts.css --> フォントの初期設定を行うため、変更しないで下さい。      */
/*==========================================================================*/
h1, h2, h3, h4, h5, h6, input, button, textarea, select, p, blockquote, th, td, pre, address, li, dt, dd { font-size: 2.1rem; -webkit-text-size-adjust: none; font-weight: 400;}
*,::before,::after{box-sizing:border-box;outline: none;}
img {vertical-align: middle;max-width: 100%;flex-shrink: 0;height: auto;}
select { visibility: visible !important; }
a{transition:all ease 0.3s;text-decoration:none;color: var(--txt);}
a[href^="tel:"] {word-break: keep-all;}
ol li{list-style: decimal;}

/*==========================================================================*/
/*                             Common-Setting                               */
/*==========================================================================*/
:root {
  --txt: #221815;
  --mcolor: #001e50;
  --scolor: #00b0f0;
  --container: 1130px;

  --gray: #9fa0a0;
  --blue: #001e50;
  --red: red;
  --f-main: "VWTextWeb","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Osaka", "メイリオ", "Meiryo", "MS Pゴシック", "MS PGothic", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
  --f-VWHead: "VWHeadWeb","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Osaka", "メイリオ", "Meiryo", "MS Pゴシック", "MS PGothic", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
}

html{background:#fff;font-size: 62.5%;}
body{-webkit-text-size-adjust:none;min-width:32rem;color:var(--txt);background-color: #efefef;}
body:lang(ja){font-family: var(--f-main);}
table {width: 100%}
h1,h2,h3,h4,h5,h6{line-height: 1.4;}
p,dd,dt,li,th,td,address{line-height: 2em;letter-spacing: 0;}
p{margin: 0 0 0.79em;}
p:last-child{margin-bottom: 0}

.bold{font-weight: bold;}
.left{text-align:left}
.right{text-align: right;}
.auto{margin-left: auto; margin-right: auto;}
.link{text-decoration: underline;color: var(--mcolor);}

.mb10{margin-bottom:1rem}
.mb15{margin-bottom:1.5rem}
.mb20{margin-bottom:2rem}
.mb30{margin-bottom:3rem}
.fit_cnt{width: fit-content;margin-left: auto;margin-right: auto;}

#wrapper{overflow:hidden;margin:0 auto}
.inner{width: var(--container);margin:0 auto;position:relative;max-width: 100%;padding: 0 1.5rem;}

/*==========================================================================*/
/*                                 TOP PAGE                                 */
/*==========================================================================*/
/* HAMBUGER BUTTON */
.hamburger{font:inherit;display:block;overflow:visible;margin:0;padding:1rem 0.8rem 0.5rem;cursor:pointer;transition-timing-function:linear;transition-duration:.15s;transition-property:opacity,filter;text-transform:none;color:inherit;border:0}
.hamburger-box{position:relative;display:inline-block;width:3.5rem;height:2.4rem}
.hamburger-inner{top:50%;display:block;margin-top:-0.2rem}
.hamburger-inner,
.hamburger-inner::after,
.hamburger-inner::before{position:absolute;width:3.5rem;height:0.2rem;transition:all ease 0.15s;background-color:#000}
.hamburger-inner::after,
.hamburger-inner::before{display:block;content:""}
.hamburger-inner::before{top:-1rem}
.hamburger-inner::after{bottom:-1rem}
.hamburger--3dxy .hamburger-box{perspective:8rem}
.hamburger--3dxy .hamburger-inner{transition:transform .15s cubic-bezier(0.645,0.045,0.355,1),background-color 0 cubic-bezier(0.645,0.045,0.355,1) .1s}
.hamburger--3dxy .hamburger-inner::after,
.hamburger--3dxy .hamburger-inner::before{transition:transform cubic-bezier(0.645,0.045,0.355,1) .1s}
.hamburger--3dxy.is_active .hamburger-inner{transform:rotateX(180deg) rotateY(180deg);background-color:transparent!important}
.hamburger--3dxy.is_active .hamburger-inner::before{transform:translate3d(0,1rem,0) rotate(45deg)}
.hamburger--3dxy.is_active .hamburger-inner::after{transform:translate3d(0,-1rem,0) rotate(-45deg)}
.sub ul li a::before{content: '';position: absolute; 50%;background-color: var(--mcolor);top: calc(50% - 0.2rem);left: 3.5rem;}

/*============= HEADER ==============*/
header{position: relative; z-index:9;}
.h_box{width:100%;position: fixed;background-color: #fff;height: 13.6rem;}
.h_inner{display:flex;justify-content:space-between;align-items: center;height: 100%;}
.h_contact a{background-color: var(--mcolor);font-size: 2.1rem;color: #FFF;width: 13rem;height: 3.6rem;display: flex;justify-content: center;align-items: center;font-family: var(--f-VWHead);letter-spacing: 0.25rem;padding-bottom: 0.2rem;}
.h_right{display: flex;align-items: center;gap: 2rem;}

/*============= MAIN ==============*/
main{position: relative;z-index: 2;padding-top: 13.6rem;}
/* Custom */
.heading_box{position: relative;z-index: 2;padding: 8.9rem 0 19.1rem;}
.heading_box::after{content: '';position: absolute;width: 192rem;height: 100%;background-color: var(--mcolor);z-index: -1;top: 0;left: 50%;transform: translateX(-50%);min-width: 100vw;}
.heading_box *{color: #FFF;}
.heading_box .des{letter-spacing: 0.04rem;}
.ttl_h2{text-align: center;position: relative;padding-bottom: 3.5rem;}
.ttl_h2::after{content: '';position: absolute;width: 7rem;height: 0.4rem;background-color: #FFF;bottom: 0;left: calc(50% - 3.5rem);}
.ttl_h2 span{display: block;}
.ttl_h2 .ja{font-size: 4.2rem;margin-bottom: -3rem;font-weight: 400;letter-spacing: 2.4rem;}
.ttl_h2 .en{font-size:6rem;font-weight: 300;color: #ffffff;opacity: 0.1;line-height: 1;letter-spacing: 1.8rem;}
.ttl_h3{font-size: 5.3rem;font-weight: bold;margin-bottom: 2rem;letter-spacing: 0.52rem;}
.ttl_h3 > span{display: block;}
.ttl_h3 .en{font-size: 3.4rem;margin-bottom: 2.5rem;position: relative;z-index: 1;color: var(--mcolor);font-weight: 300;letter-spacing: 0.35rem;}
.ttl_h3 .en span{background-color: #FFF;padding-right: 2rem;display: inline-block;}
.ttl_h3 .en::after{content: '';position: absolute;width: 100%;height: 0.2rem;background-color: var(--mcolor);right: 0;top: calc(50% + 2px);z-index: -1;}
.ttl_h3 .ja{font-size: 5.5rem;font-weight: bold;font-family: var(--f-VWHead);color: var(--mcolor);letter-spacing: 0.2rem;}

.btn a{width: 35.4rem;height: 6.8rem;display: flex;justify-content: center;align-items: center;background: var(--mcolor);font-size: 2.8rem;color: #fff;border: 1px solid #627491;letter-spacing: 0.2rem;}
.btn.center a{margin-left: auto; margin-right: auto;}
.btn_box:not(:last-child){margin-bottom: 3rem;}
.btn_box{display: flex;flex-wrap: wrap;align-items: center;justify-content: center;}
.btn_box .btn{margin: 1rem;}

/* Main Visual */
.mv{position: relative;height: calc(100vh - 13.6rem);position: relative;z-index: 1;}
.mv *{color: #FFF;}
.mv_tt{font-size:4.9rem;font-weight: bold;font-family: var(--f-VWHead);margin-bottom: 2.5rem;}
.mv_des{font-size: 2.8rem;font-weight: bold;line-height: 1.4;letter-spacing: 0.13rem;}

/* SEC01 */
.sec01_frame{background-color: #FFF;}
.sec01_frame_content .des{font-size: 2.9rem;color: #221815;line-height: 1.67;padding-left: 0.4rem;padding-top: 0.4rem;}
.sec01_box2{position: relative;z-index: 2;}


@media screen and (min-width: 751px) {
  .mv_box{padding: 16.3rem 0 0 6.5rem;}
  .heading_box{margin-bottom: -12.2rem;}
  .under .heading_box{padding: 8.1rem 0 15rem;}
  .under .heading_box.mb80{margin-bottom: 8rem;padding-bottom: 8.9rem;}
  .under .heading_box .ttl_h2 .ja{font-size: 5.2rem;margin-bottom: -3.6rem;}
  .ttl_h2:not(:last-child){margin-bottom: 7.6rem;}
  .sec01_frame_content{padding: 5.5rem 8rem;}
  .sec02{padding-bottom: 17rem;}
  .sec02_question:not(:last-child){margin-bottom: 16rem;}
  #recruit-mechanic .usec01 .usec01_list dl dd .tt2,
  #career-sales .usec01 .usec01_list dl dd .tt2{letter-spacing: 0.45rem;}


}
/* SEC02 */
.sec02_list{display: flex;gap: 0.5rem;}
.sec02_list dl dd{display: flex;align-items: center;gap: 1.6rem;color: var(--mcolor);padding: 0.8rem 2rem 0.5rem 2rem;position: relative;}
.sec02_list dl dd::after{content: '';position: absolute;width: 1rem;height: 1.6rem;background: var(--mcolor);top: calc(50% - 0.5rem);right:1.5rem;clip-path: polygon(0 0, 0% 100%, 100% 50%);}
.sec02_list dl dd .num{font-size: 4.8rem;font-weight: 300;margin: 0;line-height: 1;transform: translateY(-0.4rem);}
.sec02_list dl dd .name span{display: block;font-weight: 500;line-height: 1.5;color: var(--mcolor);}
.sec02_list dl dd .name .sm{font-size: 1.3rem;padding-left: 0.2rem;}
.sec02_list dl dd .name .lg{font-size: 1.8rem;letter-spacing: 0.19rem;}

.sec02_list dl.active dd{background-color: var(--mcolor);color: #FFF;}
.sec02_list dl.active dd span{color: #FFF;}
.sec02_list dl.active dd::after{background-color: #FFF;}

.sec02_list{position: relative;z-index: 2;}
.sec02_question_head {position: relative;display: flex;justify-content: flex-end;padding: 4.5rem 0 0 9rem;margin-bottom: 5rem;}
.sec02_question_head .author {width: 26.5rem;height: 26.5rem;padding: 1.3rem 0 2rem 3.4rem;background-color: #FFF;position: absolute;top: 0;left: 0;z-index: 1;}
.sec02_question_head .author .num {font-size: 9rem;color: var(--mcolor);font-weight: 300;font-family: var(--f-VWHead);line-height: 1;margin: 0 0 1.4rem;}
.sec02_question_head .author .name {padding-left: 0.6rem;}
.sec02_question_head .author .name span{display: block;font-weight: 500;color: var(--mcolor);line-height: 1.3;letter-spacing: 0.4rem;}
.sec02_question_head .author .name .sm {font-size: 2.2rem;}
.sec02_question_head .author .name .lg {font-size: 3.3rem;letter-spacing: 0.7rem;}
.sec02_question_head .author .en {font-weight: 300;font-size: 1.5rem;color: var(--mcolor);bottom: 0.5rem;right: 0.8rem;position: absolute;z-index: 1;letter-spacing: 0.47rem;}
.sec02_question_head:not(:first-child){margin-top: 10rem;}

.sec02_question dl{border-bottom: 0.2rem solid #c9caca;padding: 3.9rem 0 4.1rem;}
.sec02_question dl.first{padding-top: 0;}
.sec02_question dl:last-child{padding-bottom: 0;border-bottom: 0;}
.sec02_question dl dt{font-size: 3.3rem;color: var(--mcolor);margin-bottom: 1.9rem;line-height: 1.4;letter-spacing: 0.35rem;}
.sec02_question dl dt span{font-size: 4.4rem;display: inline-block;margin-right: 1rem;}
.sec02_question dl dd{line-height: 1.6;letter-spacing: 0.14rem;}
.sec02_question dl dt.let0{letter-spacing: -.09rem;}
.sec02_interview{margin-bottom: 5rem;}


/*============= FOOTER ==============*/
footer{position: relative;z-index: 3;}
address{font-size: 1.9rem;color: #FFF;text-align: center;font-family: var(--f-VWHead);padding: 1.1rem 1.5rem;background-color: #808080;letter-spacing: 0.05rem;}
.ft_links{display: flex;gap: 1.8rem;flex-wrap: wrap;margin-bottom: 3rem;}
.ft_links li a{font-size: 1.5rem;font-weight: 500;}

.to_top{position:fixed;z-index:9;bottom: 2rem;right:2rem;cursor:pointer;transition:all .2s;opacity:0;visibility:hidden;}
.to_top.show{transform:scale(1);opacity:1;visibility:visible}

/*==========================================================================*/
/*                                UNDER PAGE                                */
/*==========================================================================*/
#content{padding: 0 0 16.5rem;}

table.td_top td{vertical-align:top}
table.tb_fix{table-layout: fixed;}

table{margin-bottom: 3rem;}
table img{display:block;margin:auto;}
table th,table td{padding: 2.5rem 4.5rem;border: 0;line-height: 1.43;color: var(--txt);}
table td p{line-height: 1.43;margin-bottom: 2.7rem;}
table td p:last-child{margin-bottom: 0;}
table td .list01 li{line-height: 1.45;letter-spacing: 0.2rem;}
table th{border-bottom: 0.2rem solid #70809a;color: var(--mcolor);}
table td{border-bottom: 0.2rem solid #8b8a8a;}
table tr:first-child th{border-top: 0.2rem solid #70809a;}
table tr:first-child td{border-top: 0.2rem solid #8b8a8a;}
table .list01 li::before{top: 0.8rem;}

.umv{position: relative;height: calc(100vh - 13.6rem);position: relative;z-index: 1;min-height: 50rem;}
.umv .inner{display: flex;align-items: center;justify-content: center;flex-direction: column;height: 100%;}
.umv_sm{margin-bottom: 2.8rem;font-size: 2.3rem;font-weight: 300;letter-spacing: 0.8rem;}
.umv_tt{font-size: 5.5rem;padding-left: 3.4rem;line-height: 1.54;letter-spacing: 0;position: relative;}
.umv_tt::before{content: '';position: absolute;width: 0.2rem;height: calc(100% - 3.2rem);top: 1.5rem;background-color: #FFF;left: 0.2rem;}
.umv_box{position: relative;}
.umv_box::after{content: '';position: absolute;width: 100%;height: 100%;top: 0;left: 0;background-color: rgba(0, 30, 80, 0.74);z-index: 0;mix-blend-mode: multiply;}
.umv_box_cnt{width: 39.6rem;height: 39.6rem;display: flex;flex-direction: column;justify-content: center;padding-left: 6.2rem;z-index: 3;position: relative;}
.umv_box *{color: #FFF;}

.u_box{position: relative;z-index: 2;}
.unav{padding: 3.4rem 0 2.2rem;background-color: #efefef;border-top: 0.2rem solid #221815;}
.unav_list{display: flex;justify-content: space-between;padding: 0 4% 0 5%;}
.unav_list li a{font-size: 2.5rem;}

.usec01_list dl{background-color: #FFF;}
.usec01_list dl dt{text-align: center;}
.usec01_list dl dd{padding: 3rem 4rem;}
.usec01_list dl dd .tt1{font-size: 2.3rem;margin-bottom: 1px;color: var(--mcolor);letter-spacing: 0.05rem;}
.usec01_list dl dd .tt2{font-size: 3.4rem;margin-bottom: 2.6rem;font-weight: bold;line-height: 1.3;color: var(--mcolor);letter-spacing: 1px;}
.usec01_list dl dd .des{line-height: 1.66;letter-spacing: 0.08rem;}

.usec02_box{background-color: #FFF;padding: 6.7rem 6rem 8.5rem;}
.usec02_tt1{font-size: 3.4rem;font-weight: bold;text-align: center;padding: 2.2rem 0 1.8rem;border-top: 0.2rem solid var(--mcolor);border-bottom: 0.2rem solid var(--mcolor);color: var(--mcolor);margin-bottom: 7.5rem;line-height: 1.5;}
.usec02_list{display: flex;flex-wrap: wrap;justify-content: center;gap: 6.4rem 5rem;max-width: 98rem;margin:0 auto;}
.usec02_list li{position: relative;display: flex;justify-content: center;align-items: center;flex-direction: column;color: var(--mcolor);border-top: 1px solid #9fa0a0;border-bottom: 1px solid #9fa0a0;border-left: 1.5rem solid var(--mcolor);border-right: 1.5rem solid var(--mcolor);text-align: center;padding: 3.2rem 1rem 3.5rem;}
.usec02_list li .tt{font-size: 3rem;margin-bottom: 0;line-height: 1.5;letter-spacing: 1px;}
.usec02_list li .des{line-height: 1.5;font-size: 1.7rem;}
.usec02_list li:not(:first-child)::before{content: '';position: absolute;width: 3rem;height: 1.8rem;left: 50%;transform: translateX(-50%);clip-path: polygon(50% 100%, 0 0, 100% 0);background-color: var(--mcolor);top: -4rem;}

.usec03_img {margin-bottom: 3rem;}
.usec03_tt1 {font-size: 3.5rem;color: var(--mcolor);margin-bottom: 1.6rem;letter-spacing: 0.9rem;}
.usec03_list{padding-left: 3.6rem;position: relative;}
.usec03_list::before{content: '';position: absolute;width: 0.2rem;height: calc(100% - 2rem);top: 1rem;background-color: var(--mcolor);left: 0;}
.usec04 table th{width: 29.6rem;padding: 1rem 1.5rem;letter-spacing: 0.3rem;}


.list01.wrap{display: flex;flex-wrap: wrap;gap: 0 1.6rem;}
.list01 li{position: relative;padding-left: 2.2rem;letter-spacing: 0.35rem;line-height: 1.8;}
.list01 li::before{content: '';position: absolute;width: 1.4rem;height: 1.4rem;background-color: var(--txt);left: 0;top: 1.2rem;}
.list02 li{position: relative;padding-left: 2.4rem;line-height: 1.45;}
.list02 li::before{content: '◎';position: absolute;left: 0;top:0rem}

.max_w600{max-width: 60rem;}

@media screen and (min-width: 751px) {
  .umv{padding-bottom: 10.2rem;padding-right: 4rem;}
  .umv::after{content: '';position: absolute;height: 100%;left: 50%;transform: translateX(-50%);top: 0;z-index: -1;min-width: 100vw;width: 100%;}
  #sales .umv::after{background: url('../images/umv_bg_sale.jpg') no-repeat center /cover;}
  #career-mechanic .umv::after{background: url('../images/umv_bg_career_mechanic.jpg') no-repeat center /cover;}
  #recruit-mechanic .umv::after{background: url('../images/umv_bg_recruit_mechanic.jpg') no-repeat center /cover;}
  #career-sales .umv::after{background: url('../images/umv_bg_career_sales.jpg') no-repeat center /cover;}

  .under .heading_box{padding-bottom: 17.6rem;}
  .unav_list li a:hover{color: var(--scolor);}
  .usec01{padding-bottom: 13.6rem;}
  .usec01_list dl{display: grid;grid-template-columns: repeat(2,1fr);}
  .usec01_list dl:not(:last-child){margin-bottom: 5rem;}
  #sec02_ttl04 .sec02_question_head .author .name .sm{letter-spacing: -.25rem;}
  .usec02{padding-bottom: 13.6rem;}
  .usec02 .ttl_h2 .ja{letter-spacing: 1rem;}
  .usec02 .ttl_h2 .en{letter-spacing: 2rem;}
  .usec02_list li{width: 74.8rem;height: 12rem;}
  .usec02_list li.sm{width: 46.5rem;}
  .usec02_list2 li.sm{width: 46.9rem;}
  .usec02_list li.st3{margin-top: -4.4rem;}
  .usec02_list li.st2{margin-right: -0.8rem;}
  .usec02_list li.st4::before{transform: rotate(90deg);right: -4rem;left: inherit;top: -1.9rem;width: 2.8rem;height: 1.6rem;}
  .usec02_list li.st5::before{transform: rotate(-90deg);left: -3.9rem;top: -1.9rem;width: 2.8rem;height: 1.6rem;}
  .usec02_list li.st6{margin-right: -0.8rem;}
  .usec02_list2 li:nth-of-type(7):before{left: 54%;}
  .usec02_list2 li:nth-of-type(8):before{left: 46%;}


  .usec02_list li .tt.fix{letter-spacing: -.35rem;}
  .usec02_list1 li:nth-of-type(5):before{left: 54%;}
  .usec02_list1 li:nth-of-type(6):before{left: 46%;}
  .usec03 {padding-bottom: 12.9rem;}
  .usec03 .heading_box{padding-bottom: 19.7rem;}
  .usec04_box table th,.usec04_box table td{height: 8.6rem;}
  table.tb_block tr th:not(:last-child),table.tb_block tr td:not(:last-child){border-right: 1.7rem solid #efefef;}
  table:not(:last-child){margin-bottom: 9.6rem;}
  #sales .umv_tt{letter-spacing: 0.9rem;}


}


@media screen and (min-width: 751px) {}

/* FIREFOX ONLY */
@-moz-document url-prefix() {
  .heading_box .des{letter-spacing: 0.04rem;}
  .sec02_question dl dd{letter-spacing: 0.1rem;}

}

/* Safari 10.1+ (which is the latest version of Safari at this time) */
@media not all and (min-resolution: 0.001dpcm) {}