@charset "UTF-8";

/* ---------------------------------------------------------------------------
  ★共通
--------------------------------------------------------------------------- */
:root{
  scroll-padding-top: 126px;
}
html {font-size: 62.5%;scroll-behavior: smooth;}
body{  
  font-size: 1.6rem;
}
object {pointer-events: none;}
.sp {display: none !important;}
a[href^="tel:"] {pointer-events: none;}
a {
    text-decoration: none;
    -webkit-transition: 0.3s;
    transition: 0.3s;
}
.pcFlex{display: flex;}
.pcFlex.half{
 justify-content: space-between;
}
.pcFlex.half >*{
 width: 48%;
}
.img_r {overflow: hidden;}
.img_r>img {float: right;
    width: 33%;
    margin-left: 15px;
    margin-bottom: 15px;
}
p,li,dt,dd,th,td,input{
  font-size: 1.6rem;
}
h1,h2,h3,h4,h5,h6 {
  font-size: 1.6rem;
}

section{
}


/*装飾
========================================== */
.marker{
  background: linear-gradient(transparent 0 70%, var(--yellow) 70% 100%)
}


/*タイトル
========================================== */
.h2Tit{
 font-size: 3.2rem;
}
.h3Tit{
 font-size: 2.4rem;
}

/*
　テキスト
========================================== */
.leadTxt{
  font-size: min(1.85vw,2rem);
}
.note{
  font-size: 1.2rem;
}

/*
　ボタン,リンク
========================================== */
.btn{
}


#pageTop a:hover{
  opacity: 0.8
}


/* =======================================
	header
========================================== */

.menu:hover{
 opacity: .7;
}
/* =======================================
	gnavi
========================================== */
.gnavi{
 width: 40vw;
}
#gnaviList{
 width: 100%;
}
.gnavi a:hover{
 opacity: .6;
}
/* =======================================
	footer
========================================== */
.btn.official{
	width: 500px;
	height: 105px;
	padding: 20px;
}
	
.footer p{
	font-size: 1.8rem;
	margin: 10px auto 30px;
}
.copy{
	font-size: 1.6rem;
}

/* =======================================
				LP
========================================== */

/*-----------------------------
	#mv
-----------------------------*/


/*-----------------------------
	#lead
-----------------------------*/
#lead::after{
 content: "";
 display: block;
 background: url("../images/lead_bg02.png") no-repeat right top/auto 100%;
 width: 1000%;
 height: 373px;
 position: absolute;
 right: -628px;
 bottom: -100px;
 z-index: 2;
}
#lead .inner1200{
 padding-left: 60px;
}
#lead h2{
 margin-left: -60px;
}
#lead .txt01{
 max-width:820px; 
}
/*-----------------------------
	#type
-----------------------------*/
#type ul{
 justify-content: center;
}
#type ul li{
 width: 30.375%;
 max-width: 365px;
}
#type ul li:nth-of-type(2){
 width: 30.45%;
 max-width: 366px;
 margin-left: 12px;
}
#type ul li:nth-of-type(3){
 width: 30.375%;
 max-width: 365px;
 margin-left: 10px;
}
/*-----------------------------
	#work
-----------------------------*/
#work ul{
 flex-flow:row wrap;
 justify-content: space-between;
}
#work ul li{
 width:46.5%;
}
#work ul li:nth-of-type(2){
 margin-top: 130px
}
#work ul li:nth-of-type(4){
 margin-top: 80px
}
#work li p{
 padding: 0 0 0 12%;
}
#work ul li:nth-of-type(even) p{
 padding: 0 8% 0 5%;
}
/*-----------------------------
	#interview
-----------------------------*/
#interview ul{
 justify-content: space-between;
}
#interview ul li{
 width: 30.64%;
}
#interview ul li a:hover{
 opacity: .9;
}
/*-----------------------------
	#roadmap
-----------------------------*/
#roadmap .road{
 margin-top: -465px;
 background: url("../images/roadmap_bg02.png") no-repeat right bottom/100% auto;
 flex-flow: row-reverse;
 padding: 0 0 150px;
}
#roadmap .road li:nth-of-type(1){
 width:25.5%;
 max-width: 306px;
}
#roadmap .road li:nth-of-type(2){
 width:41%;
 max-width:492px;
 margin: 370px -0% 0 -12%;
}
#roadmap .road li:nth-of-type(2) p{
 max-width: 300px;
 margin: -40px 50px 0 auto;
}
@media screen and (max-width: 1200px) {
#roadmap .road li:nth-of-type(2) p{
 margin: -20px 50px 0 auto;
}
}/*-SP only-*/
#roadmap .road li:nth-of-type(3){
 width:55.5%;
 max-width:665px;
 margin: 590px -3% 0 -20%;
}
#roadmap .road li:nth-of-type(3) p{
 max-width: 256px;
 left: -60px;
 position: relative;
 margin: -80px auto 0;
}
#roadmap .points{
 margin: -550px 0 0 auto;
}
#roadmap .license{
 width: 70vw;
 margin: -45px -30px 0 auto;
}
#roadmap .benefits{
 justify-content: center;
 gap:0 34px;
}
#roadmap .benefits li{
 width: 27%;
 max-width: 322px;
}

#roadmap .other dt{
 width: 145px;
}
#roadmap .other dd{
 width: calc(100% - 145px);
}

/*-----------------------------
	#numbers
-----------------------------*/
#numbers .bgW.pcFlex{
 flex-flow: row wrap;
 justify-content: space-between;
 gap:52px 0;
}
#numbers .bgW [class^="ranking"]{
 width: 39.5%;
 max-width: 417px;
}
#numbers .bgW .graph{
 width: 50%;
 max-width: 526px;
}
@media screen and (max-width: 1100px) {
#numbers dt.graph02 {
  margin: -50px 0 -30px 0;
}
}/*-SP only-*/

#numbers .bgW .bubble{
 width:59% ;
 max-width: 623px;
}
@media screen and (max-width: 1000px) {

#numbers .f28{
 margin-left: -4px;
 font-size: 1.7vw !important;
 }
}/*-SP only-*/

/*-----------------------------
 update PC
-----------------------------*/


/*-----------------------------
  faq PC
-----------------------------*/
.faqList dt:hover{
 opacity: .7;
}

/*-----------------------------
	#jobinfo
-----------------------------*/
.basicTable dt{
 width: 137px;
}
.basicTable dd{
 width: calc(100% - 137px);
}
/*-----------------------------
	#flow
-----------------------------*/
.flowList li{
 position: relative;
 width: 26.8%;
 max-width: 309px;
}
.flowList li:nth-of-type(even){
 margin: 350px -9% 0 -7%;
}
.flowList li:nth-of-type(even)::before,
.flowList li:nth-of-type(even)::after{
 content: "";
 display: block;
 position: absolute;
 bottom: calc(100% - 30px);
 z-index: 1;
}
.flowList li:nth-of-type(even)::before{
 background: url("../images/flow_arrow01.png") no-repeat left top/100% auto;
 width: 48px;
 height: 70px;
 left: 10px;
}
.flowList li:nth-of-type(even)::after{
 background: url("../images/flow_arrow02.png") no-repeat left top/100% auto;
 width: 43px;
 height: 73px;
 right: 15px;
}




/*-----------------------------
	#contact
-----------------------------*/
#contact .basicTable{
 flex-flow: row wrap;
 justify-content: space-between;
}
#contact .basicTable dt:not(.wide){
 width: 90px;
}
#contact .basicTable dd:not(.wide){
 width: 80.5%;
 max-width: 510px;
}
/*		form
-----------------------------
.tb_cont{
}
.tb_cont th{
	padding: 36px 0 27px;
	width: 25.57%;
	font-size: 1.8rem;
}
.tb_cont th span{
	top: 36px;
}
.tb_cont td{
	padding: 21px 2.5% 22px;
	width: 71.4%;
}
.tb_cont td input[type=file]::file-selector-button{
	font-size: 1.8rem;
}
.tb_cont td input.radiobtn{
    width: auto;
}*/



/* =======================================
	modal interview
========================================== */
.interviewConts .pcFlex{
 justify-content: space-between;
}
.interviewConts .pcFlex .txts{
 width: 62.5%;
}

.interviewConts .pcFlex .license_work{
 width: 34%;
}