/* CSS Document */

main.con .page_title{
	position: relative; overflow: hidden; width: 100%; min-height: 200px;
	background-color: var(--color-B-L1);
}
main.con .page_title::before{
	content: ''; display: block;
	position: absolute; width: min(900px,100%); height: 100%;
	top: 0; left: 0; right: 0; margin: 0 auto; z-index: 1;
	background-color: var(--color-B-L2); transform: skewX(-45deg);
}
main.con .page_title.R{background-color: var(--color-R-L1);}
main.con .page_title.R::before{background-color: var(--color-R-L2);}
main.con .page_title.Y{background-color: var(--color-Y-L1);}
main.con .page_title.Y::before{background-color: var(--color-Y-L2);}
main.con .page_title.YY{background-color: var(--color-YY-L1b);}
main.con .page_title.YY::before{background-color: var(--color-YY-L2c);}
main.con .page_title.G{background-color: var(--color-G-L1);}
main.con .page_title.G::before{background-color: var(--color-G-L2);}
main.con .page_title,
main.con .page_title > *{display: flex; justify-content: center; align-items: center;}
main.con .page_title > *{position: relative; z-index: 2; flex-direction: column;}
main.con .page_title .en{font-size: min(20px, calc(14 * var(--responsive-max))); font-weight: 700; font-family: var(--font-outfit);
text-align: center; word-break: break-word;}
main.con .page_title h2{font-size: min(50px, calc(32 * var(--responsive-max)));
text-align: center;
gap: 0 0.5em; display: flex; flex-wrap: wrap; justify-content: center;}
@media screen and (max-width: 999px) {
	main.con .page_title h2{flex-direction: column;}
	main.con .page_title h2 span{line-height: 1.25em; height:1.25em;}
}

main.con .pan{width:var(--size-inner-960); margin: 0 auto; font-size: 14px; padding-top: 1em;
gap: 0.5em; display: flex; flex-wrap: wrap; align-items: center;}

main.con .w960{width:var(--size-inner-960); margin: 0 auto;}

:root{
--page-frame-corner-W:140px;
--page-frame-full-corner-W:200px;
}
main.con .frame1100,
main.con .frameMAX{position: relative; display: flex; flex-direction: column;}
main.con .frame1100{width:var(--size-inner-1100); margin: 0 auto; padding: calc(90 * var(--responsive-80per)) 0;}
main.con .frameMAX{width:100%; padding: calc(100 * var(--responsive-80per)) 0;}
main.con .frame1100 > *,
main.con .frameMAX > *{position: relative; z-index: 2;}
main.con section[class*="frame"] .bg{position: absolute; inset:0; z-index: 1;	background-color: var(--color-B-L2);}
main.con .frame1100 .bg{border-radius: var(--size-radius); overflow: hidden;}
main.con section[class*="frame"] .bg::before,
main.con section[class*="frame"] .bg::after{content: ''; display: block; position: absolute;
	border-style: solid;
	border-color: var(--color-B-L1) transparent;
}
main.con section[class*="frame"] .bg::before{top:0; left:0;}
main.con .frame1100 .bg::before{
	border-width: calc(var(--page-frame-corner-W) * 2) calc(var(--page-frame-corner-W) * 2) 0 0;
}
main.con .frameMAX .bg::before{
	border-width: var(--page-frame-full-corner-W) var(--page-frame-full-corner-W) 0 0;
}
main.con section[class*="frame"] .bg::after{bottom:0; right:0;}
main.con .frame1100 .bg::after{
	border-width: 0 0 var(--page-frame-corner-W) var(--page-frame-corner-W);
}
main.con .frameMAX .bg::after{
	border-width: 0 0 var(--page-frame-full-corner-W) var(--page-frame-full-corner-W);
}
main.con section[class*="frame"].R .bg{background-color: var(--color-R-L2);}
main.con section[class*="frame"].R .bg::before,
main.con section[class*="frame"].R .bg::after{border-color: var(--color-R-L1) transparent;}
main.con section[class*="frame"].O .bg{background-color: var(--color-O-L2);}
main.con section[class*="frame"].O .bg::before,
main.con section[class*="frame"].O .bg::after{border-color: var(--color-O-L1) transparent;}
main.con section[class*="frame"].Y .bg{background-color: var(--color-Y-L2);}
main.con section[class*="frame"].Y .bg::before,
main.con section[class*="frame"].Y .bg::after{border-color: var(--color-Y-L1) transparent;}
main.con section[class*="frame"].Yb .bg{background-color: var(--color-Y-L2b);}
main.con section[class*="frame"].Yb .bg::before,
main.con section[class*="frame"].Yb .bg::after{border-color: var(--color-Y-L1b) transparent;}
main.con .frame1100.YY .bg{background-color: var(--color-YY-L2);}
main.con .frame1100.YY .bg::before,
main.con .frame1100.YY .bg::after{border-color: var(--color-YY-L1) transparent;}
main.con .frameMAX.YY .bg{background-color: var(--color-YY-L2b);}
main.con .frameMAX.YY .bg::before,
main.con .frameMAX.YY .bg::after{border-color: var(--color-YY-L1b) transparent;}
main.con section[class*="frame"].G .bg{background-color: var(--color-G-L2);}
main.con section[class*="frame"].G .bg::before,
main.con section[class*="frame"].G .bg::after{border-color: var(--color-G-L1) transparent;}
main.con section[class*="frame"].C .bg{background-color: var(--color-C-L2);}
main.con section[class*="frame"].C .bg::before,
main.con section[class*="frame"].C .bg::after{border-color: var(--color-C-L1) transparent;}
main.con section[class*="frame"] .w960 > hr{margin: calc(60 * var(--responsive-80per)) 0;}
main.con section[class*="frame"] .w960 > .cmn_icon_list{margin-top: calc(45 * var(--responsive-80per));}

:root{
--page-frame-LR-H:300px;
--page-frame-LR-mgn:30px;
--page-frame-LR-skew-slide:calc((var(--page-frame-LR-H) + var(--page-frame-LR-mgn)) * -1);
}
main.con .frameLR{
	width:100%; min-height:300px; margin-top:30px;
	position: relative; border-radius: var(--size-radius); overflow: hidden;
	background-color: var(--color-B-L1);
	padding: var(--page-frame-LR-mgn);
	gap:var(--page-frame-LR-mgn); display: flex; justify-content: space-between;
}
main.con .frameLR::before{
	content: '';display: block;
	position: absolute; width:660px; height:100%;
	top:0; left:0; right:0; margin: 0 auto; z-index: 1;
	background-color: var(--color-B-L2);
	transform: skewX(-45deg);
}
main.con .frameLR.R{background-color: var(--color-R-L1);}
main.con .frameLR.R::before{background-color: var(--color-R-L2);}
main.con .frameLR.O{background-color: var(--color-O-L1);}
main.con .frameLR.O::before{background-color: var(--color-O-L2);}
main.con .frameLR.Y{background-color: var(--color-Y-L1);}
main.con .frameLR.Y::before{background-color: var(--color-Y-L2);}
main.con .frameLR.YY{background-color: var(--color-YY-L1);}
main.con .frameLR.YY::before{background-color: var(--color-YY-L2);}
main.con .frameLR.G{background-color: var(--color-G-L1);}
main.con .frameLR.G::before{background-color: var(--color-G-L2);}
main.con .frameLR.C{background-color: var(--color-C-L1);}
main.con .frameLR.C::before{background-color: var(--color-C-L2);}
main.con .frameLR dd{position: relative; z-index: 2;}
main.con .frameLR dd[p]{width:min(400px,100%); min-width:400px;}
main.con .frameLR dd[p] img{width:100%; aspect-ratio: 400 / 240; border-radius: var(--size-radius);}
main.con .frameLR dd[t]{flex-grow: 1; text-align: justify;}
main.con .frameLR dd[t] h4{font-size: 30px;}
@media screen and (min-width: 1000px) {
	main.con .frameLR:nth-of-type(2n){flex-direction: row-reverse;}
	main.con .frameLR:nth-of-type(2n+1)::before{right:var(--page-frame-LR-skew-slide);}
	main.con .frameLR:nth-of-type(2n+2)::before{left:var(--page-frame-LR-skew-slide);}
}
@media screen and (max-width: 999px) {
	main.con .frameLR{align-items: center; border-radius: 30px; gap:25px; flex-direction: column;}
	main.con .frameLR::before{width: calc(100% + 180px); left: -100%; right: -100%;}
	main.con .frameLR dd[p]{min-width: 0;}
	main.con .frameLR dd[p] img{aspect-ratio: 275 / 194;}
	main.con .frameLR dd[t] h4{font-size: 24px;}
}

main.con .interview{width:100%; display: block; margin-top: 30px;
	position: relative; border-radius: var(--size-radius); overflow: hidden;
	background-color: var(--color-B-L2);
}
main.con .interview.R{background-color: var(--color-R-L2);}
main.con .interview.Y{background-color: var(--color-Y-L2);}
main.con .interview.G{background-color: var(--color-G-L2);}
main.con .interview dl{min-height:300px; display:flex;}
main.con .interview dd{flex-grow: 1; display: flex; flex-direction: column; justify-content: center; align-items: flex-start;}
main.con .interview dd[p]{width:450px; max-width:100%; position: relative;}
main.con .interview dd[p] img{position: absolute; inset:0; width:100%; height:100%; background-size: cover;}
main.con .interview dd[t]{width:410px; max-width:100%; padding: 0 30px;}
main.con .interview dd[t] *{font-weight: 700; white-space: pre-wrap;}
main.con .interview dd[t] b{font-size: 20px; line-height: calc(1em * 36 / 20);}
main.con .interview dd[t] b + div{line-height: calc(1em * 26 / 16); margin-top: 1em;}
main.con .interview dd[t] .name{font-size: 30px; line-height: calc(1em * 32 / 30);}
main.con .interview dd[t] .name font[size="-1"]{font-size: 20px; line-height: inherit;}
main.con .interview dd[a] svg{height:50px;}
main.con .interview.R svg[fn="arrow-interview"] circle,
main.con .R *[class*="positions_"] svg[fn="arrow-interview"] circle{fill:var(--color-R);}
main.con .interview.Y svg[fn="arrow-interview"] circle,
main.con .Y *[class*="positions_"] svg[fn="arrow-interview"] circle{fill:var(--color-Y);}
main.con .interview.G svg[fn="arrow-interview"] circle,
main.con .G *[class*="positions_"] svg[fn="arrow-interview"] circle{fill:var(--color-G);}
@media screen and (min-width: 1000px) {
	main.con .interview dd[a]{width:100px;}
}
@media screen and (max-width: 999px) {
	main.con .interview dl{padding-bottom: 30px; flex-direction: column; align-items: center;}
	main.con .interview dd[p] img{position: relative; height: auto; aspect-ratio: 450 / 300;}
	main.con .interview dd[t]{padding: 20px 30px;}
}

main.con .benefits{}
main.con .benefits img[src*="deco/1-2."]{position: absolute;
top: max(-150px,calc(-75 * var(--responsive-max))); right: 0;
width: min(300px,calc(150 * var(--responsive-max))); z-index: -1;}
@media screen and (max-width: 999px) {
	main.con .benefits .cmn_icon_list{width:calc(var(--icon-list-maxW) * 2px);}
}

:root{
--positions-tab-bottom:2px;
}
main.con img[src*="recruit/deco-positions."]{position: absolute;
top: max(-140px,calc(-70 * var(--responsive-max))); right: 0;
width: min(310px,calc(155 * var(--responsive-max))); z-index: -1;}
main.con .positions_tab{display: flex; flex-direction: column;}
main.con .positions_tab > *{position: relative;}
main.con .positions_tab .tab{gap:2px; display: flex;}
main.con .positions_tab .tab > *{
	flex-grow:1; width:24%;
	font-size: min(22px, calc(13 * var(--responsive-max))); font-weight: 700; 
	line-height: 1em; text-align: center;
	flex-grow: 1; border-radius: var(--size-radius-res) var(--size-radius-res) 0 0; cursor: pointer;
	background-color: var(--color-gray-B); color:#FFF;
	min-height: min( calc(70px + var(--positions-tab-bottom)) , calc(45 * var(--responsive-max)) );
	padding-bottom: var(--positions-tab-bottom); margin-bottom: calc(var(--positions-tab-bottom) * -1);
	display: flex; flex-wrap: wrap; align-content: center; justify-content: center; align-items: center;
}
main.con .positions_tab .tab > *.active{background-color:var(--color-B);}
main.con .R .positions_tab .tab > *.active{background-color:var(--color-R);}
main.con .Y .positions_tab .tab > *.active{background-color:var(--color-Y);}
main.con .G .positions_tab .tab > *.active{background-color:var(--color-G);}
main.con .positions_tab .frame{z-index: 2;
	border-radius: 0 0 var(--size-radius-res) var(--size-radius-res);
	padding: 40px 0 50px;
	background-color:#FFF;
}
main.con .positions_tab .frame:not([n="1"]){display: none;}
main.con .positions_tab .frame dl{display: flex; justify-content: space-evenly;}
main.con .positions_tab .frame dd{max-width: 100%;}
main.con .positions_tab .frame dd[t]{width:440px;}
main.con .positions_tab .frame dd[t] h4{font-size: 20px; line-height: 2.5em;}
main.con .positions_tab .frame dd[t] h4 + *{font-size: 14px; margin-top: 1em;}
main.con .positions_tab .frame dd[s]{font-size: 20px; width:13em; display: flex; flex-direction: column; align-items: center;}
main.con .positions_tab .frame dd[s] h4{gap: 0.75em; display: flex; align-items: center;}
main.con .positions_tab .frame dd[s] h4 svg:last-of-type{transform: scaleX(-1);}
main.con .R .positions_tab .frame dd[s] h4 svg *{stroke:var(--color-R);}
main.con .Y .positions_tab .frame dd[s] h4 svg *{stroke:var(--color-Y);}
main.con .G .positions_tab .frame dd[s] h4 svg *{stroke:var(--color-G);}
main.con .positions_tab .frame dd[s] > div{margin-top: 1em; gap: 1em; display: flex; flex-wrap: wrap; justify-content: center;}
main.con .positions_tab .frame dd[s] > div > *{width:6em;}
main.con .positions_tab .frame dd[s] > div img{width:100%; aspect-ratio: 120 / 100; margin-bottom: 0.25em; border-radius: 0.5em;}
main.con .positions_tab .frame dd[s] > div h5{font-size: 1em; gap:0.25em; display: flex; justify-content: center; align-items: center;}
main.con .positions_tab .frame dd[s] > div h5 > div{display: flex; align-items: baseline;}
@media screen and (min-width: 1000px) {
	/* main.con .positions_tab .tab > *:first-of-type:last-of-type{max-width: 50%;} */
	main.con .positions_tab .tab > *.active{cursor: auto;}
}
@media screen and (max-width: 999px) {
	main.con .positions_tab .tab{gap:1px;}
	main.con .positions_tab .frame{padding: 30px calc(15 * var(--responsive-max)); 35px;}
	main.con .positions_tab .frame dl{gap:30px; flex-direction: column; align-items: center;}
	main.con .positions_tab .frame dd[t]{width:100%;}
	main.con .positions_tab .frame dd[s]{width:auto;}
}

/*
「engraph」「main.con .enefle_data」は「graph.css」に隔離
*/

:root{
--career-onoff-W:50px;
--career-graph-H:320px;
--career-graph-H-lower:420px;
--career-graph-fuki-arrow:115px;
}
main.con .career_step{margin-top: 30px; gap:50px; display: flex; flex-direction: column;}
main.con .career_step dl{background-color: #FFF; border-radius: var(--size-radius); padding: 40px;}
main.con .career_step dd:nth-of-type(1){gap:0 40px; display: flex;}
main.con .career_step dd:nth-of-type(1) > *[p]{width:255px; min-width:255px;}
main.con .career_step dd:nth-of-type(1) > *[p] img{width:100%; aspect-ratio: 255 / 180; border-radius: 7.5px;}
main.con .career_step dd:nth-of-type(1) > *[t]{font-weight: 700;
display: flex; flex-direction: column; justify-content: center;}
main.con .career_step dd:nth-of-type(1) > *[t] > *[c]{font-size: 20px; line-height: 1.5em; white-space: pre-wrap;}
main.con .career_step dd:nth-of-type(1) > *[t] > *[yn]{font-size: 20px; line-height: calc(1em * 32 / 20);
gap:1em; display: flex;}
main.con .career_step dd:nth-of-type(1) > *[t] > *[yn]:nth-of-type(n+2){margin-top: 1em;}
main.con .career_step dd:nth-of-type(1) > *[t] > *[yn] font{font-size: 1.5em; line-height: inherit; margin-right:0.125em;}
main.con .career_step dd:nth-of-type(1) > *[t] > *[yn] font[c]{color:var(--color-B); margin-left: 0.5em;}
main.con .career_step dd:nth-of-type(1) > *[t] > *[sk]{line-height: 1.75em; margin-top: 0.5em;}
main.con .career_step dd:nth-of-type(1) > *[a]{margin-left: auto; cursor: pointer;
display: flex; flex-direction: column; justify-content: center;}
main.con .career_step dd:nth-of-type(1) > *[a]::before{content: ''; display: block;
	min-width: var(--career-onoff-W); min-height: var(--career-onoff-W); border-radius: 100%;
	background-color: var(--color-K);
	background-image: url("../img/common/arrow-off.svg");
	background-position: center center;
	background-repeat: no-repeat;
	background-size: contain;
}
main.con .career_step dl:not(.active) dd:nth-of-type(1) > *[a]::before{background-color: var(--color-B); background-image: url("../img/common/arrow-on.svg");}
main.con .career_step dd:nth-of-type(2){display: none;}
main.con .career_step dd:nth-of-type(2) > .cmn_text,
main.con .career_step dd:nth-of-type(2) > .wrap > .cmn_text{padding-top: min(30px,calc(15 * var(--responsive-max)));}
main.con .career_step .mochi_title{padding-top: min(40px,calc(20 * var(--responsive-max)));
gap:0 1em; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline;}
main.con .career_step .mochi_title h4{font-size: 20px; color:var(--color-B);}
main.con .career_step .mochi_title h4 + div{font-weight: 500; margin-left: auto; gap:calc(1em - 2px); display: flex; align-items: baseline;}
main.con .career_step .mochi_title div[a]{position: relative;}
main.con .career_step .mochi_title div[a]::before,
main.con .career_step .mochi_title div[a]::after{content:''; display: block; border-bottom: solid 1px var(--color-B);}
main.con .career_step .mochi_title div[a]::before{width:calc(4em - 2px);}
main.con .career_step .mochi_title div[a]::after{width:calc(1em - 2px); position: absolute; right:0; bottom:0;
transform: rotate(45deg); transform-origin: right bottom;}
main.con .career_step .mochi_graph{margin-top:20px; gap:10px; display:flex; align-items: flex-start;}
main.con .career_step .mochi_graph img,
main.con .career_step .mochi_graph .graph_make{height:var(--career-graph-H);}
main.con .career_step .mochi_graph.lower img,
main.con .career_step .mochi_graph.lower .graph_make{height:var(--career-graph-H-lower);}
main.con .career_step .mochi_graph > img[src*="per"]{width:35px; min-width:35px; background-size: 100% 100%;}
main.con .career_step .mochi_graph > img[src*="per-M"]{width:40px; min-width:40px; margin-left: -5px;}
main.con .career_step .mochi_graph > div{flex-grow: 1; overflow: auto hidden; cursor:move; scrollbar-color: var(--color-B) rgba(0,120,190,0.05);}
main.con .career_step.R .mochi_graph > div{scrollbar-color: var(--color-R) rgba(220,60,80,0.05);}
main.con .career_step.Y .mochi_graph > div{scrollbar-color: var(--color-Y) rgba(255,140,70,0.05);}
main.con .career_step.G .mochi_graph > div{scrollbar-color: var(--color-G) rgba(0,140,140,0.05);}
/*
main.con .career_step .mochi_graph > div::-webkit-scrollbar{}
main.con .career_step .mochi_graph > div::-webkit-scrollbar-track{}
main.con .career_step .mochi_graph > div::-webkit-scrollbar-thumb{}
main.con .career_step .mochi_graph > div::-webkit-scrollbar-button{}
*/
main.con .career_step .mochi_graph > div > *{width: auto; max-width: none;}
main.con .career_step .fuki{text-align: justify; font-weight: 500; position: relative; margin-top: 1.5em; padding: 1em 1.25em; border-radius: 1.25em; background-color: var(--color-B-L2);}
main.con .career_step .fuki[now]::before{content:attr(now); font-weight: 700; color:var(--color-B);
display: inline-block; margin-right: 0.5em;}
/*
main.con .career_step .fuki::after{content:'';position: absolute;
	bottom:calc(100% - 1px); left:var(--career-graph-fuki-arrow);
	border-style: solid;
	border-width: 0 0.75em 1.5em;
	border-color: transparent transparent var(--color-B-L2);
}
main.con .career_step .fuki[x]::after{left: max(35px,min(calc(var(--career-graph-fuki-arrow) + attr(x px)),calc(100% - 44px)));}
*/
main.con .career_step .fuki .arrow{
	position: absolute;
	bottom:calc(100% - 1px); left:var(--career-graph-fuki-arrow);
	border-style: solid;
	border-width: 0 0.75em 1.5em;
	border-color: transparent transparent var(--color-B-L2);
}
main.con .career_step .fuki .arrow[x]{left: max(35px,min(calc(var(--career-graph-fuki-arrow) + attr(x px)),calc(100% - 44px)));}

/* main.con .career_step .fuki[h]{min-height: attr(h px);} */
main.con .career_step.R dd:nth-of-type(1) > *[t] > *[yn] font[c],
main.con .career_step.R .mochi_title h4{color:var(--color-R);}
main.con .career_step.Y dd:nth-of-type(1) > *[t] > *[yn] font[c],
main.con .career_step.Y .mochi_title h4{color:var(--color-Y);}
main.con .career_step.G dd:nth-of-type(1) > *[t] > *[yn] font[c],
main.con .career_step.G .mochi_title h4{color:var(--color-G);}
main.con .career_step.R dl:not(.active) dd:nth-of-type(1) > *[a]::before{background-color:var(--color-R);}
main.con .career_step.Y dl:not(.active) dd:nth-of-type(1) > *[a]::before{background-color:var(--color-Y);}
main.con .career_step.G dl:not(.active) dd:nth-of-type(1) > *[a]::before{background-color:var(--color-G);}
main.con .career_step.R .mochi_title div[a]::before,
main.con .career_step.R .mochi_title div[a]::after{border-color:var(--color-R);}
main.con .career_step.Y .mochi_title div[a]::before,
main.con .career_step.Y .mochi_title div[a]::after{border-color:var(--color-Y);}
main.con .career_step.G .mochi_title div[a]::before,
main.con .career_step.G .mochi_title div[a]::after{border-color:var(--color-G);}
main.con .career_step.R .fuki{background-color:var(--color-R-L2);}
main.con .career_step.R .fuki[now]::before{color:var(--color-R);}
main.con .career_step.R .fuki .arrow{border-bottom-color:var(--color-R-L2);}
main.con .career_step.Y .fuki{background-color:var(--color-Y-L2);}
main.con .career_step.Y .fuki[now]::before{color:var(--color-Y);}
main.con .career_step.Y .fuki .arrow{border-bottom-color:var(--color-Y-L2);}
main.con .career_step.G .fuki{background-color:var(--color-G-L2);}
main.con .career_step.G .fuki[now]::before{color:var(--color-G);}
main.con .career_step.G .fuki .arrow{border-bottom-color:var(--color-G-L2);}
@media screen and (max-width: 999px) {
	:root{
		--career-onoff-W:30px;
	}
	main.con .career_step dl{padding: 30px 0;}
	main.con .career_step dd:nth-of-type(1){flex-direction: column; align-items: center;}
	main.con .career_step dd:nth-of-type(1) > *[t]{margin-top: 30px;}
	main.con .career_step dd:nth-of-type(1) > *[a]{margin-top: 20px; margin-left: 0;}
	main.con .career_step dd:nth-of-type(2){padding: 0 10px;}
}
/*
「main.con .career_step .mochi_graph .graph_make」は「graph.css」に隔離
*/

main.con .recruit_bottom_btn{margin-top: calc(100 * var(--responsive-80per));}
main.con .recruit_bottom_btn[mgn]{margin-top: calc(attr(mgn number) * var(--responsive-80per));}
main.con .recruit_bottom_btn[mgn="70"]{margin-top: calc(70 * var(--responsive-80per));}
main.con .recruit_bottom_btn h3{font-size: 30px; line-height: calc(1em * 40 / 30); text-align: center;}
main.con .recruit_bottom_btn h3 + *{margin-top: 1em; text-align: center;}
main.con .recruit_bottom_btn .btn{gap:50px; display: flex; flex-wrap: wrap; justify-content: center;}
main.con .recruit_bottom_btn .btn:nth-child(n+2){margin-top: 50px;}
main.con .recruit_bottom_btn .btn a{
	width:400px; height:128px;
	border: solid 2px var(--color-K); border-radius: var(--size-radius);
	font-size: 30px; font-weight: 700; line-height: 1.2em;
	display: flex; flex-direction: column; justify-content: center; align-items: center;
}
main.con .recruit_bottom_btn .btn a[href*="mynavi"]{border-color:var(--color-B);}
main.con .recruit_bottom_btn .btn a[href*="mynavi"] img{width:min(300px,76%);}
main.con .recruit_bottom_btn .btn a.colW{color:#FFF;}
main.con .recruit_bottom_btn .btn a.line{border-color:#5ba89f; background-color:#5ba89f;}
main.con .recruit_bottom_btn .btn a.R{border-color:var(--color-R); background-color:var(--color-R);}
main.con .recruit_bottom_btn .btn a.Y{border-color:var(--color-Y); background-color:var(--color-Y);}
main.con .recruit_bottom_btn .btn a.G{border-color:var(--color-G); background-color:var(--color-G);}
main.con .recruit_bottom_btn .btn a div[fs]{font-size: attr(fs px);}
main.con .recruit_bottom_btn .btn a div[fs="24"]{font-size: 24px;}
main.con .recruit_bottom_btn .btn a div[fs="40"]{font-size: 40px;}

/* 固有クラス */
.about-msg{gap:50px; display:flex; justify-content:space-between;}
.about-msg dd[t] h4 ~ h4{margin-top: 1em;}
.about-msg dd[p] img{width:100%; border-radius: var(--size-radius);}
.about-msg .cmn_text{margin-top: 2em;}
.about-msg .cmn_text .B{color:var(--color-B);}
.about-msg .cmn_text font{font-weight: 700;}
.about-msg .cmn_text b,
.about-msg .cmn_text h5{font-size:1.25em; line-height: inherit; display: inline-block;}
.about-msg .name{gap: 1em; display: flex; align-items: baseline;}
@media screen and (min-width: 1000px) {
	.about-msg dd[t]{flex-grow:1; max-width:60%;}
	.about-msg dd[p]{width:360px; min-width:360px;}
}
@media screen and (max-width: 999px) {
	.about-msg{flex-direction: column;}
}
.about-people{display:flex; justify-content:space-between;}
.about-people dd[t]{display: flex; flex-direction: column; justify-content: center; align-items: flex-start;}
.about-people dd[p]{position: relative;}
.about-people dd[p] img{width: 450px;}
.about-people.step{margin-top: 110px; gap:130px 30px; align-items: flex-start;}
.about-people.step dd{
	position: relative;
	background-color: #FFF;
	border-radius: var(--size-radius);
	padding: 50px 2em 40px;
}
.about-people.step dd img{position: absolute; bottom:calc(100% - 35px); left:0; right:0; margin: auto; max-width: none;}
.about-people.step dd img[src*="-1."]{width:119px;}
.about-people.step dd img[src*="-2."]{width:87px;}
.about-people.step dd img[src*="-3."]{width:83px;}
.about-people.step h5{text-align: center;}
@media screen and (min-width: 1000px) {
	:root{
	--about-people-step-mgn:50px;
	}
	.about-people dd[p] img{position: absolute; top: -170px; right: 0; max-width: none; z-index: -1;}
	.about-people.step dd{flex-grow: 1; width:30%;}
	.about-people.step dd:nth-last-of-type(3){margin-top: calc(var(--about-people-step-mgn) * 2);}
	.about-people.step dd:nth-last-of-type(2){margin-top: var(--about-people-step-mgn);}
}
@media screen and (max-width: 999px) {
	.about-people{flex-direction: column;}
}
.about-service{position: relative; z-index: 2;}
.about-service img[src*="deco/2-2."]{position: absolute; top: -1em; right: 0;
width: min(240px,calc(120 * var(--responsive-max))); z-index: -1;}

.interview-prof{width:var(--size-inner-1100); margin: 75px auto 0; position: relative;
	border-radius: var(--size-radius); overflow: hidden;
	background-color: var(--color-B-L1);
}
.interview-prof::before{
	content: ''; display: block;
	position: absolute; width:740px; height:100%;
	top:0; left:0; right:0; margin: 0 auto; margin-left: 380px; z-index: 1;
	background-color: var(--color-B-L2);
	transform: skewX(-45deg);
}
.interview-prof.R{background-color: var(--color-R-L1);}
.interview-prof.R::before{background-color: var(--color-R-L2);}
.interview-prof.Y{background-color: var(--color-Y-L1);}
.interview-prof.Y::before{background-color: var(--color-Y-L2);}
.interview-prof.G{background-color: var(--color-G-L1);}
.interview-prof.G::before{background-color: var(--color-G-L2);}
.interview-prof dl{
	min-height: 400px; padding:50px 0; position: relative; z-index: 2;
	gap:40px; display: flex; justify-content: space-between;
}
.interview-prof dd[p]{width:450px; max-width: 100%;}
.interview-prof dd[p] img{width:100%; aspect-ratio: 450 / 300; border-radius: var(--size-radius);}
.interview-prof dd[t]{flex-grow:1;}
.interview-prof dd[t] > b{font-size:30px; line-height:calc(1em * 5 / 3); margin-bottom: 1em; display: block; white-space:pre-wrap;}
.interview-prof dd[t] > div{font-weight:700; line-height:1.75em; white-space:pre-wrap;}
.interview-prof dd[t] .name{font-size:30px; line-height:calc(1em * 32 / 30); margin-top: 0.2em;}
.interview-prof dd[t] .name font[size="-1"]{font-size:20px; line-height:inherit;}
@media screen and (max-width: 999px) {
	.interview-prof dl{flex-direction: column; align-items: center;}
}

main.con .interview-text{margin:80px auto 0;
gap:40px; display: flex; flex-direction: column;}
.interview-text dl{gap:40px; display: flex; flex-direction: column;}
.interview-text dl dd[p]{display: flex; justify-content: center;}
.interview-text dl dd[p] img{width:100%; max-width:800px; border-radius: var(--size-radius);}
.interview-text dl dd[p] img[src*="noimg."]{aspect-ratio: 800 / 300;}
.interview-text dl.col2 dd[p] img[src*="noimg."]{aspect-ratio: 420 / 300;}
.interview-text dl dd[t]{flex-grow: 1;}
.interview-text dl dd[t] h3{text-align: justify;}
.interview-text dl dd[t] h3 ~ h3{margin-top: 40px;}
@media screen and (min-width: 1000px) {
	.interview-text dl.col2{flex-direction: row; justify-content: space-between;}
	.interview-text dl.col2 dd[p]{width:420px; min-width:420px;}
	.interview-text dl.col2 dd[p="H"]{width:300px; min-width:300px;}
}

:root{
--color-interview-ca-R:#e26b73;
--color-interview-ca-Y:#ff9758;
--color-interview-ca-G:#5ba89f;
--color-interview-ca-B:#65bcd5;
}
main.con .interview-chat-ask,
main.con .interview-schedule,
main.con .interview-other{margin-top: 100px;}
.interview-chat-ask img[src*="-0"]{width: 188px; position: absolute; top: -130px; right: 0; z-index: -1;}
.interview-chat-ask img[src*="-0-GC"]{width: 188px; top: -134px;}
.interview-chat-ask img[src*="-0-CS"]{width: 226px; top: -114px;}
.interview-chat-ask ul{margin-top:calc(70 * var(--responsive-50per)); gap:30px; display: flex; flex-direction: column;}
.interview-chat-ask li{position: relative; gap:1em; display: flex; align-items: center;}
.interview-chat-ask li:nth-of-type(2n){justify-content: flex-end;}
.interview-chat-ask li img{width:91px; min-width:91px;}
.interview-chat-ask li > div{flex-grow:1; font-weight:700; max-width: 500px; min-height: 8em;
	padding: 1em min(40px,calc(24 * var(--responsive-max)));
	position: relative; border-radius: var(--size-radius);
	background-color: var(--color-interview-ca-Y); color:#FFF;
	display: flex; align-items: center;
}
.interview-chat-ask li:nth-of-type(2n) > div{background-color: var(--color-interview-ca-B);}
.interview-chat-ask .R li:nth-of-type(2n) > div{background-color: var(--color-interview-ca-R);}
.interview-chat-ask .G li:nth-of-type(2n) > div{background-color: var(--color-interview-ca-G);}
.interview-chat-ask li > div::before{
	content: ''; display: block; position: absolute; margin: auto;
	border-style:solid;
	border-width:1em;
}
.interview-chat-ask li:nth-of-type(2n+1) > div::before{
	left:calc(-1em + 1px); border-left-width: 0; border-color: transparent var(--color-interview-ca-Y);
}
.interview-chat-ask li:nth-of-type(2n+2) > div::before{
	right:calc(-1em + 1px); border-right-width: 0; border-color: transparent var(--color-interview-ca-B);
}
.interview-chat-ask .R li:nth-of-type(2n+2) > div::before{border-color: transparent var(--color-interview-ca-R);}
.interview-chat-ask .G li:nth-of-type(2n+2) > div::before{border-color: transparent var(--color-interview-ca-G);}
@media screen and (max-width: 999px) {
	.interview-chat-ask img[src*="-0"]{width: 132px; top: -150px;}
	.interview-chat-ask img[src*="-0-GC"]{width: 124px; top: -160px;}
	.interview-chat-ask img[src*="-0-CS"]{width: 157px; top: -125px;}
}

.interview-schedule .flex{margin-top:70px; display: flex; justify-content: space-evenly;}
.interview-schedule .flex dl{font-size:20px; gap:1em; display: flex;}
.interview-schedule .flex dd:nth-of-type(1){display: flex; flex-direction: column; align-items: center;}
.interview-schedule .flex dd:nth-of-type(1)::before{content:''; display: block; width:1em; height:1em; border-radius: 100%;}
.interview-schedule .flex dl:not(:last-of-type) dd:nth-of-type(1)::after{content:''; display: block;
flex-grow: 1; width: 2px; margin: -2px auto;}
.interview-schedule .flex dd:nth-of-type(1)::before,
.interview-schedule .flex dl:not(:last-of-type) dd:nth-of-type(1)::after{background-color: var(--color-B);}
.interview-schedule.R .flex dd:nth-of-type(1)::before,
.interview-schedule.R .flex dl:not(:last-of-type) dd:nth-of-type(1)::after{background-color:var(--color-R);}
.interview-schedule.Y .flex dd:nth-of-type(1)::before,
.interview-schedule.Y .flex dl:not(:last-of-type) dd:nth-of-type(1)::after{background-color:var(--color-Y);}
.interview-schedule.G .flex dd:nth-of-type(1)::before,
.interview-schedule.G .flex dl:not(:last-of-type) dd:nth-of-type(1)::after{background-color:var(--color-G);}
.interview-schedule .flex dd:nth-of-type(2){font-weight:700;}
.interview-schedule .flex dl:not(:last-of-type) dd:nth-of-type(2){padding-bottom: 1em;}
.interview-schedule .flex time{display:block; margin-top: -0.15em; text-indent:0; font-size:inherit; font-weight:inherit; line-height:inherit;}
@media screen and (max-width: 999px) {
	.interview-schedule .flex{flex-direction: column; align-items: center;}
	.interview-schedule .flex .am dl:last-of-type dd:nth-of-type(2){padding-bottom: 1em;}
}

:root{
--interview-slide-W:300px;
--interview-slide-H:360px;
--interview-slide-rmenu-mgn:calc(var(--rmenu-W) * 2);
}
.interview-other .slide{margin-top: 50px;}
.interview-other .slide .slick-list{min-width:var(--interview-slide-W);}
.interview-other .slide.S2:not(.slick-dotted) .slick-list{width: min(630px, var(--slide-list-maxW));}
.interview-other .slide.L.slick-dotted .slick-list{width: min(990px, calc(var(--slide-list-maxW) - var(--interview-slide-rmenu-mgn)));}
.interview-other .slide:not(.slick-dotted) .slick-track{gap:0 30px; display: flex; justify-content: center;}
.interview-other .slide:not(.slick-dotted) .slick-track::before,
.interview-other .slide:not(.slick-dotted) .slick-track::after{display: none;}
.interview-other .slide:not(.slick-dotted) .slick-slide,
.interview-other .slide .set,
.interview-other .slide dl{
width:100%; min-height:min(var(--interview-slide-H),calc(150 * var(--responsive-max)));
display:flex!important; flex-direction: column;}
.interview-other .slide .set{width:min(var(--interview-slide-W),100%)!important; margin: 0 auto;}
.interview-other .slide dl{border-radius: 1em; overflow: hidden; background-color: #FFF;}
.interview-other .slide dd[p]{}
.interview-other .slide dd[p] img{width:100%; aspect-ratio: 300 / 200;}
.interview-other .slide dd[t]{padding: 14px 20px; flex-grow: 1;}
.interview-other .slide dd[t] > *{text-align: justify; display: block; font-weight:700;}
.interview-other .slide dd[t] b{line-height: calc(1em * 26 / 16);}
.interview-other .slide dd[t] .prof{white-space: pre-wrap; font-size: 14px; margin-top: 0.5em;}
.interview-other .slide dd[t] .name{font-size: 24px; line-height: calc(1em * 32 / 24); }
.interview-other .slide dd[t] .name font[size="-1"]{font-size: 16px; line-height: inherit;}
.interview-other .slide dd[t] .arrow{
	position: absolute;
	right:1em;
	bottom:1em;
	width:25px;
	height:25px;
	border-radius: 100%;
	overflow: hidden;
	background-color: var(--color-B);
	display: flex;
}
.interview-other .slide dd[t] .arrow::before{
	content: '';
	display: block;
	width: 100%;
	height: 100%;
	background-image: url(../img/common/arrow-slide.svg);
	transform: scaleX(-1);
}
.interview-other.R .slide .slick-arrow,
.interview-other.R .slide .slick-dots li.slick-active,
.interview-other.R .slide dd[t] .arrow{background-color:var(--color-R);}
.interview-other.Y .slide .slick-arrow,
.interview-other.Y .slide .slick-dots li.slick-active,
.interview-other.Y .slide dd[t] .arrow{background-color:var(--color-Y);}
.interview-other.G .slide .slick-arrow,
.interview-other.G .slide .slick-dots li.slick-active,
.interview-other.G .slide dd[t] .arrow{background-color:var(--color-G);}
.interview-other .slide .slick-dots li:not(.slick-active){background-color: rgba(255,255,255,0.9);}

@media screen and (max-width: 1249px) {
	.interview-other .slide.slick-dotted .slick-list{width: min(660px, var(--slide-list-maxW))!important;}
}
@media screen and (max-width: 999px) {
	:root{
		--interview-slide-rmenu-mgn:0;
	}	
}
@media screen and (max-width: 809px) {
	.interview-other .slide .slick-list{min-width:0;}
}