@charset "utf-8";
/*=============================================================
recruit top
=============================================================*/
#recruit.door #topicPathArea li,
#recruit.door #topicPathArea a{color: #000;opacity: 1;}
#recruit.door #topicPathArea #topicPath li a::before{
	background: url("../../../shared/img/arw-topicPath.svg") no-repeat!important;
	background-size: cover;
}
#recruit.door #pageMain #pageTtlMain .ttlBox h1,
#recruit.door #pageMain #pageTtlMain .ttlBox #categoryTtl{color: #000;}
#recruit.door #pageMain #pageTtlMain .ttlBox #categoryTtl::after{background-color: #000;}


/*=============================================================
 pageMov
=============================================================*/
#pageMov{position: relative;}
#pageMov video{
	aspect-ratio: 16 / 7.5;
	width: 100%;
	height: auto;
	object-fit: cover;
}
#pageMov #control-btn{
	position: absolute;
	top: 30px;
	right: 30px;
	width: 34px;
	height: 34px;
	z-index: 2;
	cursor: pointer;
	transition: all .3s;
}
#pageMov #control-btn.play{background-image: url('../../img/mov-play.svg');}
#pageMov #control-btn.play:hover{background-image: url('../../img/mov-play-o.svg');}
#pageMov #control-btn.pause{background-image: url('../../img/mov-pause.svg');}
#pageMov #control-btn.pause:hover{background-image: url('../../img/mov-pause-o.svg');}

/* ttl-h2 */
#recruit.door .ttl-h2{
	text-align: center;
	margin-top: clamp(80px, calc(80px + 0.15625 * (100vw - 768px)), 120px);
	margin-bottom: clamp(32px, calc(32px + 0.0390625 * (100vw - 768px)), 42px);
	position: relative;
	
}
#recruit.door #ac10 .ttl-h2{padding-top: 60px;}
#recruit.door #ac10 .ttl-h2::before{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 1px;
	background: #D0D0D0;
}
#recruit.door .ttl-h2.h2-white{color: #fff;}

/* what-cct */
#recruit.door .what-cct{
	background: url("../img/recruit-bg01.jpg") no-repeat;
	background-size: cover;
	background-position: center center;
	color: #fff;
	text-align: center;
	margin-top: 0!important;
}
#recruit.door .what-cct .what-cct-box{padding: clamp(0px, calc(0px + 0.390625 * (100vw - 768px)), 100px) 0 clamp(0px, calc(0px + 0.390625 * (100vw - 768px)), 100px) 0;}
#recruit.door .what-cct .what-cct-box .col-2>*{
	padding: 0 clamp(0px, calc(0px + 0.390625 * (100vw - 768px)), 100px) clamp(0px, calc(0px + 0.390625 * (100vw - 768px)), 100px);
	box-sizing: border-box;
}
#recruit.door .what-cct .what-cct-box h2{
	font-family: "Noto Serif JP";
	font-size: 36px;
	font-style: normal;
	font-weight: 400;
	line-height: 150%;
	margin-bottom: clamp(40px, calc(40px + 0.15625 * (100vw - 768px)), 80px);;
}
#recruit.door .what-cct .what-cct-box h3{
	font-size: 16px;
	font-style: normal;
	font-weight: 500;
	line-height: 150%;
	margin-bottom: 16px;
}
#recruit.door .what-cct .what-cct-box figure{
	margin-bottom: 14px;
}
#recruit.door .what-cct .what-cct-box p{text-align: left;}

/* charm-of-working */
#recruit.door .charm-of-working{
	background: var(--primaryColor);
	padding: 70px 0;
	box-sizing: border-box;
	margin-top: 0!important;
}

/* charm-of-working-col */
#recruit.door .charm-of-working .charm-of-working-col{color: #fff;}
#recruit.door .charm-of-working .charm-of-working-col .item .img .num{
	position: relative;
	color: var(--primaryColor);
	text-align: center;
	font-family: Roboto;
	font-size: clamp(28px, calc(28px + 0.015625 * (100vw - 768px)), 32px);
	font-style: normal;
	font-weight: 200;
	line-height: normal;
}
#recruit.door .charm-of-working .charm-of-working-col .item .img .num>span{
	position: relative;
	z-index: 2;
}
#recruit.door .charm-of-working .charm-of-working-col .item .img .num::after{
	content: '';
	background: #fff;
	width: clamp(72px, calc(72px + 0.03125 * (100vw - 768px)), 80px);;
	height: clamp(72px, calc(72px + 0.03125 * (100vw - 768px)), 80px);;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translateX(-50%) translateY(-50%);
	border-radius: 50%;
	border: 1px solid var(--primaryColor);
	z-index: 1;
}
#recruit.door .charm-of-working .charm-of-working-col .item .img figure{
	position: relative;
	margin-top: -20px;
	margin-bottom: clamp(14px, calc(14px + 0.0546875 * (100vw - 768px)), 28px);;
}
#recruit.door .charm-of-working .charm-of-working-col .item .ttl{
	font-family: "Noto Sans JP";
	font-size: 20px;
	font-style: normal;
	font-weight: 400;
	line-height: 150%;
	margin-bottom: 6px;
	color: #fff;
}
#recruit.door .charm-of-working .charm-of-working-col .item p,
#recruit.door .charm-of-working .charm-of-working-col .item .list-circle>li{color: #D0D0D0;}
#recruit.door .charm-of-working .charm-of-working-col .item .list-circle>li::before{background: #D0D0D0;}

/* senior-employee */
#recruit.door .senior-employee .text-box{
	background: #F1F1F1;
	padding: 38px;
	box-sizing: border-box;
	border-radius: 4px;
	margin-top: 24px;
	margin-bottom: clamp(64px, calc(64px + 0.0625 * (100vw - 768px)), 80px);;
}
#recruit.door .senior-employee .text-box .ttl{
	display: flex;
	column-gap: 20px;
	align-items: center;
	margin-bottom: 12px;
}
#recruit.door .senior-employee .text-box p{
	color: #646464;
}
#recruit.door .senior-employee .text-box .ttl>div{width: 85px;}
#recruit.door .senior-employee .text-box .ttl>p{
	width: calc((100% - 105px));
	font-size: 16px;
	font-style: normal;
	font-weight: 500;
	line-height: 150%;
	color: #000;
}
#recruit.door .senior-employee h3,
#recruit.door .process h3{
	font-family: "Noto Sans JP";
	font-size: 16px;
	font-style: normal;
	font-weight: 500;
	line-height: 150%;
	color: var(--textColorBlack);
	margin-bottom: clamp(8px, calc(8px + 0.09375 * (100vw - 768px)), 32px);;
}
#recruit.door .senior-employee h3 + figure{margin-bottom: clamp(60px, calc(60px + 0.234375 * (100vw - 768px)), 120px);}

/* two-forces */
#recruit.door .two-forces{
	background: url("../img/recruit-bg02.jpg") no-repeat;
	background-size: cover;
	background-position: center center;
	color: #fff;
	text-align: center;
	margin-top: 0!important;	
}
#recruit.door .two-forces .two-forces-box{padding: 120px 0 100px;}
#recruit.door .two-forces .two-forces-box .two-forces-inner{
	max-width: 780px;
	margin: 0 auto clamp(30px, calc(30px + 0.0234375 * (100vw - 768px)), 36px);;
}
#recruit.door .two-forces .two-forces-box .two-forces-inner p{
	text-align: left;
	color: #F1F1F1;
	font-weight: 400;
	line-height: 200%;
}
#recruit.door .two-forces .two-forces-box .two-forces-inner figure + p{margin-top: clamp(30px, calc(30px + 0.0390625 * (100vw - 768px)), 40px);}
#recruit.door .two-forces .two-forces-box .two-forces-inner + figure{
	max-width: 990px;
	margin: 0 auto;
}

/* process */
#recruit.door .process .table-default{
	margin-bottom: clamp(64px, calc(64px + 0.0625 * (100vw - 768px)), 80px);
}
#recruit.door .process .message{
	font-family: "Noto Sans JP";
	font-size: 24px;
	font-style: normal;
	font-weight: 400;
	line-height: 150%;
	text-align: center;
	position: relative;
	padding-top: clamp(64px, calc(64px + 0.0625 * (100vw - 768px)), 80px);
	margin-top: clamp(64px, calc(64px + 0.0625 * (100vw - 768px)), 80px);
}
#recruit.door .process .message::before{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 1px;
	background: #D0D0D0;
}

/* message */
#recruit.door .message{
	color: #000;
	font-size: 24px;
	font-style: normal;
	font-weight: 400;
	line-height: 150%;
	margin-bottom: clamp(14px, calc(14px + 0.0234375 * (100vw - 768px)), 20px);;
}
#recruit.door .message-box{
	display: flex;
	gap: 14px 32px;       
	flex-wrap: wrap;
}
#recruit.door .message-box + .message-box{margin-top: clamp(63px, calc(63px + 0.0390625 * (100vw - 768px)), 73px);}
#recruit.door .message-box .img{
	width: 174px;
}
#recruit.door .message-box .text{width: calc((100% - 206px));}
#recruit.door .message-box .text .ttl{
	color: #000;
	font-size: 16px;
	font-style: normal;
	font-weight: 500;
	line-height: 150%;
	margin-bottom: 8px;
}
#recruit.door .message-box .text .ttl + P{
	margin: 0!important;
}
/*=============================================================
    recruit thanks
=============================================================*/
.recruitThanks .section + .section{
	padding: 128px 0 0;
	box-sizing: border-box;
	margin: 0;
	position: relative;
}
.recruitThanks .section + .section::after{
	content: '';
	position: absolute;
	left: 0;
	right: 0;
	top: 64px;
	background: #D0D0D0;
	height: 1px;
}
.recruitThanks .btn-area{
	max-width: 380px;
	margin: 0 auto;
}

/* floating-anchor */
.floating-anchor {
  position: fixed;
  right: 20px;
  bottom: 80px;
  z-index: 1000;
  opacity: 0;
  visibility: hidden;
  transition: all 0.4s ease;
}

.floating-anchor.show {
  opacity: 1;
  visibility: visible;
}

.floating-inner a{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 135px;
	height: 135px;
	background: #0099DC;
  border: 1px solid #0099DC;
  border-radius: 100px;
	padding: 10px 10px;
	box-sizing: border-box;
  position: relative;
	font-size: 18px;
	font-style: normal;
	font-weight: 500;
	line-height: 160%;
	color: #fff;
	transition: all .3s;
}
.floating-inner a>span{
	display: inline-block;
	margin-bottom: 10px;
}
.floating-inner a::after{
	content: '';
	width: 30px;
	height: 30px;
	background: url("../img/recruit-arw.png") no-repeat;
	background-size: cover;
	position: absolute;
	bottom: 20px;
	left: 50%;
	transform: translateX(-50%);
	z-index: 1;
}
.floating-inner a:hover{
	text-decoration: none;
	background:#fff;
	color: #0099DC;
}
.floating-inner a:hover::after{
	background: url("../img/recruit-arw-o.png") no-repeat;
	background-size: cover;
}
/*.floating-anchor .close-btn {
	width: 20px;
	height: 20px;
  position: absolute;
  top: 0;
  right: 0;
  border: none;
  background: none;
  font-size: 12px;
  cursor: pointer;
  color: var(--primaryColor);
}
.floating-anchor .close-btn::before,
.floating-anchor .close-btn::after{content: none;}*/
.floating-anchor .close-btn:hover {
  color: var(--secondaryColor);
}

/*+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 PC-large
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
@media (min-width:1920px){
	
}

/*+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 Smartphones
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
@media only screen and (max-width:767px){
    .recruitThanks .btn-area{max-width: inherit;}
	
/*=============================================================
recruit top
=============================================================*/
#recruit.door #pageTtlMain{margin-bottom: 0;}
#recruit.door  #pageMain #pageTtlMain{height: 310px;}
#recruit.door  #pageMov video {
	height: 310px;
	width: auto;
	pointer-events: none; 
}	
/* what-cct */
#recruit.door .what-cct{
	background: none;
}	
#recruit.door .what-cct .what-cct-box .col-2>div + div{margin-top: 0!important;}	
#recruit.door .what-cct .what-cct-box .col-2>div{
	position: relative;
	z-index: 1;
	padding: 80px 0 40px;
}
#recruit.door .what-cct .what-cct-box .col-2>div:last-child{padding: 40px 0;}
#recruit.door .what-cct .what-cct-box .col-2>div:first-child::after{
	content: '';
	background: url("../img/recruit-bg01-sp01.jpg") no-repeat;
	background-size: cover;
	position: absolute;
	top: 0;
	left: -20px;
	right: -20px;
	bottom: 0;
	z-index: -1;
}
#recruit.door .what-cct .what-cct-box .col-2>div:last-child::after{
	content: '';
	background: url("../img/recruit-bg01-sp02.png") no-repeat;
	background-size: cover;
	position: absolute;
	top: 0;
	left: -20px;
	right: -20px;
	bottom: 0;
	z-index: -1;
}
	
	
#recruit.door .what-cct .what-cct-box h3{
	font-size: 16px;
	font-style: normal;
	font-weight: 500;
	line-height: 150%;
	margin-bottom: 16px;
}
#recruit.door .what-cct .what-cct-box figure{
	margin-bottom: 14px;
}
#recruit.door .what-cct .what-cct-box p{text-align: left;}

/* charm-of-working */
	
/* charm-of-working-col */
#recruit.door .charm-of-working .charm-of-working-col{margin-top: 52px;}	
#recruit.door .charm-of-working .charm-of-working-col .item + .item{margin-top: 50px;}
	
/* senior-employee */
#recruit.door .senior-employee .text-box{
	padding: 20px;
	margin-top: 8px;
	margin-bottom: 40px
}
#recruit.door .senior-employee .text-box .ttl{
	display: flex;
	column-gap: 20px;
	align-items: center;
	margin-bottom: 12px;
}
/* two-forces */
#recruit.door .two-forces{
	background: url("../img/recruit-bg02.jpg") no-repeat;
	background-size: cover;
	background-position: center center;
	color: #fff;
	text-align: center;
	margin-top: 0!important;	
}
#recruit.door .two-forces	.ttl-h2.h2-white{margin-top: 0;}
#recruit.door .two-forces .two-forces-box{padding: 80px 0 60px;}

/* process */
#recruit.door .process .message{font-size: 22px;}


/* message */
#recruit.door .message-box{    
	flex-wrap: wrap;
}
#recruit.door .message-box .img{width: 100%;text-align: center;}
#recruit.door .message-box .img img{width: 174px;}
#recruit.door .message-box .text{width: 100%;}

/* floating-anchor */
.floating-anchor {right: 10px;}
.floating-inner {padding: 0;}	
.floating-inner a{
	width: 100px;
	height: 100px;
	font-size: 14px;
	}
.floating-inner a::after{
	width: 22px;
	height: 22px;	
	bottom: 16px;
	}
}