@charset "UTF-8";

/* ---------------------------------------------------------------------------
  ★共通
--------------------------------------------------------------------------- */
:root{
  scroll-padding-top: 95px;
}
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{
  padding: 100px 0;
}
section p:not(:last-child){
  margin-bottom: 1.5em;
}


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

.h3Tit {
 font-size: 3.2rem;
	margin-bottom: 40px;
}
.h4Tit {
	font-size: 2.4rem;
	margin-bottom: 20px;
}
.h5Tit {  
	font-size: 2rem;
	margin-bottom: 10px;
}
.h6Tit{
	font-size: 1.8em;
	margin-bottom: 10px;
}

/*
　テキスト
========================================== */

.note{
  font-size: 1.2rem;
}
.pcCenter{
	text-align: center;
}

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

/*装飾
========================================== */
/*-- .pgs 緑帯見出し --*/
.bandTxt > span{
	font-size: 3.6rem;
	padding:  10px min(1.5%,15px) 13px;
}

/*-- .pgs 緑罫線BOX --*/
.bdrGrBox{
	background: var(--wh);
	border: 3px solid var(--green);
	border-radius: 40px;
	padding: 65px 5%;
}

/*背景
========================================== */
/*-- .pgs 吹き出し --*/
.balloonTxt{
	margin-bottom: 4rem !important;
}

/* 装飾有り背景 */
.bgGrdY::before{
 width: 130px;
 height: 164px;
 top: -72px;
 left: 7.42vw;
}
.bgGrdY::after{
 width: 90px;
 height: 113px;
 bottom: 20px;
}
.bgGrdY.grd02::before{
	width: 120px;
	height: 155px;
 }
 .bgGrdY.grd02::after{
	width: 85px;
	height: 83px;
 }
 
/* =======================================
  ページャー
========================================== */
/*-- pageNavi --*/
.pageNavi{
	gap:0 1.5%;
 margin-top: 80px;
}
.pageNavi .current,
.pageNavi .inactive,
.pageNavi a{
	font-size: 1.8rem;
	width: 40px;
	height: 40px;
}
/*-- pager --*/
.pager{
	margin-top: 50px;
}
.pager a{
font-size: 1.6rem;
  width: 200px;
}


/* =======================================
	header
========================================== */
header > div{
 position: relative;
 height: 90px;
 padding: 0;
	align-items:center;
}

header #logo{
 margin-left:max(2vw, calc((100% - 1300px)/2));
}

/* =======================================
	gnavi
========================================== */
.gnavi{
}
#gnaviList{
 flex: 1;
 justify-content: flex-end;
 align-items: center;
 gap: 0 min(1.4vw,20px);
 position: relative;
}
#gnaviList > li > a{
 display:flex;
 justify-content: center;
 align-items: center;
 height: 90px;
 color: var(--base);
 font-size: min(1.3vw,1.6rem);
 white-space: nowrap;
 letter-spacing: 0.04em;
}
#gnaviList li.current a,
#gnaviList li a:hover{
 opacity: .7;
}
#gnaviList .recruit{
 width: min(7.2vw,101px);
}
#gnaviList .entry{
 width: min(9.2vw,130px);
 margin-left:  max(-1.4vw,-20px);
 font-size: 18px;
}

/* =======================================
	main
========================================== */
body:not(#top) main{
 margin-top: 90px;
}


/* =======================================
	footContact
========================================== */
#footContact{
}
#footContact div.pcFlex{
	justify-content: space-between;
}
#footContact .txts{
 width:54%;
 max-width: 511px;
}
#footContact .btnsWrap{
 width: 40%;
 max-width:483px ;
 padding-top: 50px;
}
#footContact .btnsWrap .btn{
 margin:30px 0 0;
 width:min(100%, 383px) ;
}
#pageTop a:hover{
  opacity: .7
}
/* =======================================
	footer
========================================== */
footer a:hover{
	opacity: .7;
}
#footBottom > .inner1200{
 flex-flow: row wrap;
 align-items: flex-end;
}
.footerLeft{
	width: min(36%,400px);
}
#footerLogo{
}
#footBottom .tel >span{
 margin-left: 1em;
}


#footerRight{
 justify-content: flex-end;
 align-items:flex-start;
 flex-grow: 1;
 gap: 0 min(6.4vw,90px);
 padding-bottom: 52px;
}
.footerNavi > li{
	font-size: 1.6rem;
}
.footerNavi > li + li{
	margin-top: 30px;
}
.footerNavi li a{
	display: block;
 line-height: 1.4;
}

footer .copy{
 width: 100%;
	font-size: 1.2rem;
	line-height: 1;
	margin: -1em 2em 0 auto;
	text-align: right;
}


#pageTop{
	right: 4vw;
	bottom: 30px;
}

/* =======================================
	pgs common
========================================== */
.pgs main .pcFlex.half p{
	line-height: 2;
}

/*-- mainTitle --*/
  .mainTitle{
    height: 220px;
    padding-bottom: 40px;
  }

/*-- leadTxt --*/
.leadTxt{
  font-size: 2.4rem;
}
.leadArea{
  padding-block: 50px;
}
.leadArea .leadTxt{
  font-size: 3.2rem;
	text-align: center;
}
.leadArea p:not(.leadTxt){
	font-size: 1.8rem;
  line-height: 2.4em;
}

/*-- table --*/
.basicTable >dt{
	border-right: 1px dotted var(--blue);
	padding: 15px 2.5%;
	width: 23%;
}
.basicTable >dd{
	padding: 15px 2.5%;
	width: 77%;
}
.basicTable >dt:last-of-type{
	border-bottom: none;
}
 .basicTable >dd:last-of-type{
	border-bottom: none;
}

table.basicTable thead th{
	font-size: 1.8rem;
}

/*		anchorLink
-----------------------------*/
.anchorLink,
.anchorLink ul{
	padding: 35px 0;
	gap:15px 20px;
  z-index: 100
}
.pageLinks{
	padding: 35px 0 ;
	gap:15px 20px;
}
.anchorLink li,
.pageLinks li{
	width: calc((100% - 20px * 3) / 4);
	height: 56px;
}
.anchorLink a,
.pageLinks li a{
	padding: 8px 10px;
}

/**/
.mainBottomMenu{
  margin-bottom: 60px;
  padding-block: 100px 60px;
}
.mainBottomMenu ul{
  justify-content: center;
  gap: 20px 2%;
}
.mainBottomMenu ul li{
	width: calc((100% - 6%) / 4);
}

/* hCatch */
.hCatch{
  font-size: 0.5em;
	padding: 20px;
	top: -4em;
	left: -5.5em;
}


/* =======================================
	top
========================================== */

/*		#mv PC
-----------------------------*/
#mvSlider figure.fb{
  padding-top: 120px;
}
#mvSlider figure.ft{
  padding-bottom: 120px;
}

/*		#topValue PC
-----------------------------*/
#topValue ul.pcFlex{
 justify-content: space-between;
}
#topValue ul.pcFlex li{
 width: 32%;
 max-width: 382px;
}
#topValue ul.pcFlex li:not(:nth-of-type(2)){
 margin-top: 65px;
}
#topValue .person{
 text-align: center;
}
#topValue .person ul{
 text-align: left;
 display: inline-grid;
 grid-auto-flow: column;
 grid-template-rows: repeat(3, auto);
 gap: 10px 65px;
  margin-left: 3em;
}
#topValue .person ul li{
 font-size: 24px;
}

/*		#topMessage PC
-----------------------------*/
#topMessage .pcFlex{
 justify-content: space-between;
}
#topMessage .txts{
 width: 51%;
 max-width: 618px;
 margin-top: -194px;
}
#topMessage .img{
 display: flex;
 flex-flow: column;
 width: 42.5%;
 margin-top: -80px;
}
#topMessage .img .btnWrap{
 margin-top: auto;
 margin-bottom: 18px;
}
#topMessage .img .btnWrap .btn{
 margin-right: 0;
}

#topVision .pcFlex{
 justify-content: space-between;
 
}
#topVision > .pcFlex{
 align-items: flex-end;
}
#topVision .topWorks .pcFlex{
   align-items: flex-start
}
#topVision > .pcFlex .txts{
 width: 66.6%;
 max-width: calc(min(96%,1200px) - 314px);
}

#topVision > .pcFlex .btnWrap{
 width: 314px;
 margin-top: 0;
 margin-bottom: 12px;
}

.topWorks .pcFlex .txts{
 width: 50%;
}
.topWorks .pcFlex .txts h4{
  margin-top: 38px;
}
.topWorks .pcFlex:not(.flexRowReverse) .txts{
 padding-left: 5.33%;
}
.topWorks .pcFlex .txts .btnWrap{
 margin-top: 30px;
}
.topWorks .pcFlex figure{
 width: 44.25%;
}

/*		#topVision PC
-----------------------------*/
#topInterview {
 padding-bottom: 80px;
}
#topInterview .pcFlex{
 align-items: flex-end;
 gap:0 30px;
}
#topInterview .pcFlex h2{
 flex-grow: 1;
}
#topInterview .slick-slide a:hover{
 opacity: .7;
}


/* =======================================
	vision
========================================== */
.stepList > li:not(:last-child)::before{
  height: calc(100px + 100%);
	left: min(8.25%,75px);
}
.stepList > li:has(+ li){
  margin-bottom: 50px;
}
.stepList > li h4{
	gap: 1em;
	margin-bottom: 20px;
}
.stepList > li h4 > span{
	padding: 15px;
}
.stepList > li h4 .num{
  font-size: 2.4rem;
	width: min(16.5%, 150px);
}
.stepList > li h4 .subTit{
  font-size: 2.4rem;
}
.stepList > li > div{
  gap: 3.4%;
	margin-left: calc(min(16.5%, 150px) + 3px);
}
.stepList > li > div figure{
  width: min(16.5%, 150px);
}
.stepList > li > div .txts .orange{
  margin-bottom: 1em;
  font-size: 2.4rem;
}

#vision .bandTxt + .bdrGrBox{
	font-size: 2rem;
  line-height: 2;
	margin-top: -80px;
	padding-top: 85px;
}
#visionInitiatives{
	margin-bottom: 100px;
}
#visionInitiatives .pcFlex.half{
	margin-block: 90px;
}

/* =======================================
	works
========================================== */
.borderRoundBox{
	gap: 0 5%;
	padding: 50px 4.2%;
}
.borderRoundBox p{
  width: 90%;
}
#worksInfo .borderRoundBox h3{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	font-size: 2.4rem;
	padding: 10px;
	width: min(35%,350px);
}
#worksInfo .borderRoundBox .txts p{
	margin-left: 0;
	margin-right: 0;
	width: 100%;
}
#works .bandTxt + .bdrGrBox{
	font-size: 2rem;
  line-height: 2;
	margin-top: -80px;
	padding-top: 85px;
}
#worksInfo .pcFlex.half:not(:first-of-type){
	margin-top: 100px;
}
#worksInfo .borderRoundBox,
#worksInfo .basicTable{
	margin-top: 30px;
}
.borderRoundBox .slashTit{
  font-size: 2.5rem;
  width: 90%;
}
#worksInfo table.basicTable tbody th{
 width: 8em;
}
#worksInfo table.basicTable tbody td{
  text-align: center;
}

.worksTeamList{
  gap: 30px 3.5%;
}
.worksTeamList li{
	padding: 30px min(2.35%,30px);
	width: calc((100% - 3.5% * 3) / 4);
}
.worksTeamList li img{
  width: 100px;
  margin: 0 auto 10px;  
}
.worksTeamList li h4{
  margin-bottom: 1em;
  font-size: 2rem;
}

/* =======================================
	investigation PC
========================================== */
#investigation .anchorLink li {
  width: calc((100% - 20px * 2) / 3);
  height: 56px;
}
.investigationContent{
    gap:0 min(4%,50px);
		padding: 30px;
  }
.investigationContent figure{
    width: 33%;
  }
.investigationContent div{
    flex: 1;
 }
 .investigationComment dd{
  padding: 30px 5.3%;
}
#investigation .pcFlex.half{
	margin-block: 40px;
}
#investigation main section:not(:last-of-type){
	padding-bottom: 50px;
}

#investigation .borderRoundBox{
	padding: 40px 4.2% 50px;
}
.investigationComment dt{
	font-size: 1.8rem;
}
.investigationComment dd,
#investigation .borderRoundBox p{
	line-height: 1.8;
}
#investigation .borderRoundBox ul{
	flex-wrap: wrap;
	gap: 1em 50px;
}
#investigation .borderRoundBox ul li{
	width: calc((100% - 100px) / 2);
	line-height: 1.8;
}

/* =======================================
	education PC
========================================== */
#educationEducate div.flexWrap{
	gap: 70px 5%;
	margin-top: 60px;
	margin-bottom: 60px;
}
#educationEducate dl{
	padding: 50px min(2.4%,30px);
  width: calc((100% - 5% * 2) / 3);
}
#educationEducate dl dt{
	font-size: 2rem;
	margin-top: -70px;
	margin-bottom: 1em !important;
	padding: 10px 20px !important;
}

#educationStep .pcFlex.half{
	align-items: center;
	margin-block: 100px;
}
#educationStep .txts{
	margin-bottom: -20px;
	padding: 50px min(3.5%,50px);
}
#educationStep .pcFlex.half:nth-of-type(2) .txts{
	margin-bottom: 0;
}
#educationStep .pcFlex.half:nth-of-type(2) h4{
	margin-right: -70px;
	margin-left: auto;
	text-align: right;
}
#educationStep h4{
	margin: -70px auto 20px -70px;
}

#educationBenefitList{
  gap: 30px 3%;
}
#educationBenefitList > li{
  width: calc((100% - 3% * 2) / 3);
}
#educationBenefitList > li h4{
	padding: 10px 20px;
  font-size: 2rem;
}

.educationInfoBox{
	justify-content: center;
	align-items: center;
	gap: 0 40px;
	padding: 50px;
}
.educationInfoBox p{
	margin-top: 0 !important;
	margin-bottom: 0 !important;
}
.educationInfoBox p:not(.btnWrap){
	font-size: 1.8rem;
	line-height: 2;
}

/* =======================================
	interview PC
========================================== */
#interviewList ul li{
  width: calc((100% - 3% * 2) / 3);
} 
#interviewList ul li h3{
	font-size: 2rem;
}
/**single**/
#interviewMain .profile{
	align-items: center;
 justify-content: space-between;
 margin-bottom: 30px;
}
#interviewMain .profile figure{
 width: 50%;
 margin: 0 ;
}
#interviewMain .profile .txts{
 width: 40%;
}
#interviewMain .profile .h4Tit{
	font-size: 1.8rem;
	margin-bottom: 10px;
}
#interviewMain h4 + p{
	margin: -40px 0 0 20px;
	padding: 50px 30px 30px;
}
#interviewMain .inner1000 > figure{
 margin: 60px auto 0;
}


/* =======================================
	recruit
========================================== */
.requirements .basicTable th{
  width: 200px;
}



/* =======================================
	news PC
========================================== */
/*		一覧
-----------------------------
.newsBox .pcFlex{
 justify-content: space-between;
 align-items: flex-start;
}
.newsBox .imgs{
 width: 30%;
}
.newsBox .txts{
 width: 66%;
}
*/
/*		single
----------------------------
article{
 padding: 100px 0;
}-*/



/* =======================================
	entry PC
========================================== */
.entryFlow{
 justify-content: center;
 gap:0 70px;
}
.entryFlow li{
 min-height: 220px;
 -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
 letter-spacing: 0.3em;
}
.entryFlow li + li::before{
 content: "";
	display: block;
 background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 30 30" fill="none"><path d="M16.25 7.5L23.75 15L16.25 22.5M23.75 15L6.25 15" stroke="%2343C44C" stroke-width="4" stroke-linecap="round" stroke-linejoin="round"/></svg>') no-repeat left top/100% auto;
 width: 50px;
 height:50px;
 position: absolute;
 right: calc(100% + 14px);
 top: 50%;transform: translate(0, -50%);
}
/* =======================================
	form PC
========================================== */
.formArea .basicTable input[type=text],
.formArea .basicTable input[type=email],
.formArea .basicTable input[type=tel],
.formArea .basicTable select{
	padding: 8px;
	width:100%;
}
.formArea .basicTable textarea{
	padding: 8px;
	width: 100% !important;
}
.formArea .basicTable dt{
	width: 25%;
}
.formArea .basicTable dd{
	width: 75%;
}
/*.formArea #fRecruit[style^="display: block;"]{
 display: flex !important;
}
.formArea #fRecruit dt{
 flex-flow: column;
 align-items: flex-start;
}*/
.confirm {
		margin-top: 40px;
}
.formFoot{
 margin:40px 0 0;
}



/* =======================================
	privacypolicy PC
========================================== */


