@charset "utf-8";
/* CSS Document Page Registration */
/*floor($int/$layoutSizeSP-int(770px)*10000*10)/( 100*10 ) ) * 1vw;*/
.page--registration .mainContents .keyVisual::before {
    background-image: url(../assets/img/registration/main-l.png);
}
.page--registration .mainContents .keyVisual::after {
    background-image: url(../assets/img/registration/main-r.png);
}
.page--registration .mainContents .keyVisual .h2title {
    margin: 0 auto 80px;
}
@media screen and (max-width: 599px){
.page--registration .mainContents .keyVisual::before {
    background-image: url(../assets/img/registration/main-l-sp.png);
}
.page--registration .mainContents .keyVisual::after {
    background-image: url(../assets/img/registration/main-r-sp.png);
}
.page--registration .mainContents .keyVisual .h2title {
    margin: 0 auto 7.792vw;
}
.page--registration .mainContents .keyVisual .kvBox {
    height: 44.701vw;
}
}





.page--registration .aboutsection01 .bgImgbox01 {
    position: absolute;
    width: 1920px;
    height: 885px;
    background: url("../assets/img/registration/bg_career-registration.png") top center no-repeat;
    left: 50%;
    top: 350px;
    margin-left: -960px;
    z-index: 3;
}

/* ----- ----- ----- ----- ----- 20240111 - pc ----- ----- ----- ----- ----- */
.page--registration .aboutsection .contentsWrap.catchText_catchText {
	width: 1000px;
	padding-left: 50px;
	padding-right: 50px;
	margin-bottom: 120px;
	z-index: 2;
}
.page--registration .catchText {
	font-family: "Noto Serif JP", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;
    font-weight: 500;
	text-align: center;
	line-height: 2;
    font-size: 32px;
    font-size: 32rem;
}
.page--registration .contentsWrap .contentsBox {
	padding-top: 60px;
}
.page--registration .contentsWrap .contentsBox h2 {
	position: relative;
	font-family: "Noto Serif JP", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;
    font-weight: 500;
	text-align: center;
	line-height: 2;
    font-size: 30px;
    font-size: 30rem;
	margin-bottom: 80px;
}
.page--registration .contentsWrap .contentsBox h2:after {
	content: "";
    width: 70px;
    height: 9px;
    position: absolute;
    left: 50%;
    bottom: -30px;
    -webkit-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    background: url(../assets/img/about/dotmark.png) center center no-repeat;
}
/* ----- ----- ----- ----- ----- キャリア登録の方 ----- ----- ----- ----- ----- */
.page--registration .careerRegistrationWrap {
	text-align: center;
}
.page--registration .careerRegistrationWrap a {
	margin: 0 auto 45px;
	padding: 2em 0;
	display: block;
	width: 360px;
	background: #0a2986;
	color: #fff;
	transition: 0.3s;
}
.page--registration .careerRegistrationWrap a:hover {
	opacity: 0.65;
}
.page--registration .careerRegistrationWrap .txt_btnLinkcation{
    font-size: 18px;
    font-size: 18rem;
	margin-bottom: 40px;
}
/* ----- ----- ----- ----- ----- 連絡先 ----- ----- ----- ----- ----- */
.page--registration .contactAddressWrap {
	text-align: center;	
}
.page--registration .contactAddressWrap p {
	line-height: 1.8;
}
.page--registration .contactAddressWrap .title {
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: "Noto Serif JP", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;
    font-weight: 500;
    font-size: 24px;
    font-size: 24rem;
	margin-bottom: 0.5em;
}
.page--registration .contactAddressWrap .title:before,
.page--registration .contactAddressWrap .title:after {
	content: "";
	height: 1px;
	width: 60px;
	background: #3c63ad;
	margin:0 0.5em;
}
/* ----- ----- ----- ----- ----- BUBBLE ----- ----- ----- ----- ----- */
:root {
--color_bubbleLine: #3c63ad;
--color_bubble: white;
--width_bubbleLine: 2px;
--size_triangle: 18px;
}
.page--registration .bubleBoxWrap {
	width: 620px;
	margin: 0 auto;
}
.page--registration .bubleBoxWrap .bubleBox {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
	gap: 0 40px;
	margin-bottom: 60px;
}
.page--registration .bubleBox.bubble-left {
    flex-direction: row-reverse;
	margin-bottom: 80px;
}
.page--registration .bubleBox .bubble {
	width: calc(100% - (120px + 0.5em));
}
.page--registration .bubleBox .bubble > span {
    font-size: 20px;
    font-size: 20rem;
	line-height: 1.8;
	
	position: relative;
    display: block;
    padding: 0.5em;
    border: var(--width_bubbleLine) solid var(--color_bubbleLine);
	padding: 1em 0 1em 1.5em;
}
.page--registration .bubleBox.bubble-left .bubble > span:before,
.page--registration .bubleBox.bubble-left .bubble > span:after
{
	position: absolute;
    top: 50%;
    right: 100%;
    transform: translateY(-50%);
    content: '';
    border: var(--size_triangle) solid transparent;
}
.page--registration .bubleBox.bubble-left .bubble > span:before {
    border-right: var(--size_triangle) solid var(--color_bubbleLine);	
}
.page--registration .bubleBox.bubble-left .bubble > span:after {
    margin-right: -3px;
    /* -2でもいいが太く見えない */
    border-right: var(--size_triangle) solid var(--color_bubble);	
}
.page--registration .bubleBox.bubble-right .bubble > span:before,
.page--registration .bubleBox.bubble-right .bubble > span:after
{
	position: absolute;
    top: 50%;
    left: 100%;
    transform: translateY(-50%);
    content: '';
    border: var(--size_triangle) solid transparent;
}
.page--registration .bubleBox.bubble-right .bubble > span:before {
    border-left: var(--size_triangle) solid var(--color_bubbleLine);	
}
.page--registration .bubleBox.bubble-right .bubble > span:after {
    margin-left: -3px;
    /* -2でもいいが太く見えない */
    border-left: var(--size_triangle) solid var(--color_bubble);	
}
/* ----- ----- ----- ----- ----- キャリア登録利用イメージのご紹介 ----- ----- ----- ----- ----- */
:root {
--color_step: #3c63ad;
}
.page--registration .careerRegistration-image-Wrap {
	margin-right: -150px;
	margin-left: -150px;
}
.page--registration .careerRegistration-image-Wrap .row__step {
    display: flex;
    justify-content: space-between;
	margin-bottom: 60px;
}
.page--registration .careerRegistration-image-Wrap .row__stepItem {
    width: 32%;
    margin-top: 50px;
    border: var(--color_step) solid 2px;
    border-top-right-radius: 50px;
}
.page--registration .careerRegistration-image-Wrap .row__step img {
    max-width: 100%;
}
.page--registration .careerRegistration-image-Wrap .row__step .imageBox, .row__stepHead {
    text-align: center;
}
/* --- circle --- */
.page--registration .careerRegistration-image-Wrap .row__stepItem .circle {
    width: 100px;
    height: 100px;
    margin: -50px auto 2em;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background-color: var(--color_step);
    border-radius: 50%;
    color: #fff;
    text-align: center;
    font-family: "Noto Serif JP", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;
}
.page--registration .careerRegistration-image-Wrap .row__stepItem .circle__name {
    font-size: 20px;
    font-size: 20rem;
    text-transform: uppercase;
    line-height: 1.2;
}
.page--registration .careerRegistration-image-Wrap .row__stepItem .circle__number {
    font-size: 34px;
    font-size: 34rem;
    line-height: 1;
}
/**/
.page--registration .careerRegistration-image-Wrap .row__stepHead {
    margin: 0.75em 0;
    color: var(--color_step);
    font-size: 32px;
    font-size: 32rem;
    font-weight: normal;
    line-height: 1;
    letter-spacing: 1em;
    padding-left: 0.8em;
}
.page--registration .careerRegistration-image-Wrap .row__stepBody {
    margin: 0 1.5em 1em;
    line-height: 1.7;
}
.page--registration .careerRegistration-image-Wrap .cation{
	line-height: 1.8;
	margin-bottom: 80px;
}
/* ----- ----- ----- ----- ----- 20240111 - sp ----- ----- ----- ----- ----- */
@media screen and (max-width: 599px){
	.page--registration .aboutsection01 .bgImgbox01 {
		top: 280px;
	}
	.page--registration .aboutsection .contentsWrap.catchText_catchText {
		margin-bottom: 60px;
		width: auto;
	}
	.page--registration .aboutsection .contentsWrap {
		box-shadow: none;
	}
	.page--registration .catchText {
		text-align: left;
		font-size: 4.675vw;
	}
	.page--registration .contentsWrap .contentsBox {
		padding-top: 30px;
}
	.page--registration .contentsWrap .contentsBox h2 {
		font-size: 4.675vw;
		margin-bottom: 40px;
	}
	.page--registration .contentsWrap .contentsBox h2:after {
		width: 9.09vw;
		height: 1.298vw;
		bottom: -4.546vw;
		background-size: contain;
	}
	/* ----- ----- キャリア登録の方 ----- ----- */
	.page--registration .careerRegistrationWrap a {
		margin: 0 auto 20px;
		padding: 1.5em 0;
		width: 100%;
	}
	.page--registration .careerRegistrationWrap .txt_btnLinkcation {
		font-size: 3.376vw;/* 3.896vw*/
		line-height: 1.8;
		margin-bottom: 20px;
	}
	/* ----- ----- 連絡先 ----- ----- */
	.page--registration .contactAddressWrap .title {
		font-size: 4.155vw;
	}
	.page--registration .contactAddressWrap .title:before,
	.page--registration .contactAddressWrap .title:after {
		width: 10.389vw;
	}
	.page--registration .contactAddressWrap p {
		font-size: 3.376vw;
	}
	/* ----- ----- BUBBLE ----- ----- */
	.page--registration .bubleBoxWrap {
		width: 100%;
	}
	.page--registration .bubleBoxWrap .bubleBox,.page--registration .bubleBox.bubble-left {
		flex-direction: column;
		flex-wrap: wrap;
		justify-content: center;
		gap: 40px 0;
		margin-bottom: 40px;
	}
	.page--registration .bubleBox .bubble{		
		width: 100%;
	}
	.page--registration .bubleBox .bubble > span {
		text-align: center;
		font-size: 3.896vw;
		padding: 1em;
	}
	/* 吹き出し口を下に位置。 */
	.page--registration .bubleBox.bubble-right .bubble > span:before,
	.page--registration .bubleBox.bubble-right .bubble > span:after,
	.page--registration .bubleBox.bubble-left .bubble > span:before,
	.page--registration .bubleBox.bubble-left .bubble > span:after {
		position: absolute;
		top: 100%;
		left: 50%;
		transform: translateX(-50%);
		content: '';
		border: var(--size_triangle) solid transparent;
	}
	.page--registration .bubleBox.bubble-left .bubble > span:before,
	.page--registration .bubleBox.bubble-right .bubble > span:before {
    	border-top: var(--size_triangle) solid var(--color_bubbleLine);
	}
	.page--registration .bubleBox.bubble-left .bubble > span:after,
	.page--registration .bubleBox.bubble-right .bubble > span:after {
		margin-top: -3px;
		margin-left: 0;
		margin-right: 0;
		border-top: var(--size_triangle) solid var(--color_bubble);
	}
	.page--registration .bubleBox .bubble_img {
		width: 35%;
	}
	/* ----- ----- キャリア登録利用イメージのご紹介 ----- ----- */
	.page--registration .careerRegistration-image-Wrap {
		margin-right: 0;
		margin-left: 0;
	}
	.page--registration .careerRegistration-image-Wrap .row__step {
		flex-direction: column;
		margin-bottom: 2em;
	}
	.page--registration .careerRegistration-image-Wrap .row__stepItem {
		width: 100%;
		border-top-right-radius: 6.493vw;
	}
	.page--registration .careerRegistration-image-Wrap .row__stepItem:not(:last-child) {
		margin-bottom: 2em;
	}
	.page--registration .careerRegistration-image-Wrap .row__stepItem .circle {
		width: 19.48vw; /*sv(150)*/
		height: 19.48vw;
		margin-top: -8.831vw; /*sv(68)*/
	}
	.page--registration .careerRegistration-image-Wrap .row__stepItem .circle__name {
		font-size: 3.896vw;
		margin-bottom: 0.25em;
	}
	.page--registration .careerRegistration-image-Wrap .row__stepItem .circle__number {
    	font-size: 6.753vw; /*sv(52)*/
	}
	.page--registration .careerRegistration-image-Wrap .row__stepHead {		
    	font-size: 4.675vw;
	}
	.page--registration .careerRegistration-image-Wrap .row__stepItem .imageBox{
		width: 49.35vw; /*sv(380)*/
		margin: 0 auto;
	}
	.page--registration .careerRegistration-image-Wrap .cation{
		margin-bottom: 2em;
	}
}