/* ------------------------------------------------------------------------
	RECRUIT 4
------------------------------------------------------------------------ */

/* デフォルトナビカラー
---------------------
color:#5472D2	blue 
color:#00C1CF	turquoise 
color:#FE6C61	pink 
color:#8D6DC4	violet 
color:#4CADC9	peacoc 
color:#CEC2AB	chino 
color:#50485B	mulled_wine 
color:#75D69C	vista_blue 
color:#F7BE68	orange 
color:#5AA1E3	sky 
color:#6DAB3C	green 
color:#F4524D	juicy_pink 
color:#F79468	sandy_brown 
color:#B97EBB	purple 
color:#2A2A2A	black 
color:#EBEBEB	grey 
color:#FFFFFF	white 
---------------------*/

/* 追加ナビカラー
---------------------
.sakura	{ color:#515151; }
.sakura h2 { background-color:#FEF4F4; } 
.geppaku 	{ color:#515151; } 
.geppaku h2 { background-color:#EAF4FC; } 
.honeydew	{ color:#515151; } 
.honeydew h2 { background-color:#F0FFF0; }
.zouge 	{ color:#515151; } 
.zouge h2 { background-color:#F8F4E6; }
---------------------*/

/*
faq-job
faq-registration
faq-period
faq-salary
faq-employment
*/


/* ------------------------------------------------------------------------
	RECRUIT 4
------------------------------------------------------------------------ */

/* ------------------------------------
	RECRUIT 4 Typography Color　看護中途 ピンク系
------------------------------------ */

/* 看護中途 ピンク系 */
.kanMid .colorPrimary { color:#FE6C61; } /* pink メインカラー*/
.kanMid .colorSecondary { color:#AD7D4C; } /* kouzome 第二のカラー*/
.kanMid .colorPale { color:#F4524D; } /* juicy_pink 鮮やかなカラー*/
.kanMid .colorLight { color:#F79468; } /* sandy_brown 薄めのカラー*/
.kanMid .colorPale { color:#FEF4F4; } /* sakura 淡いカラー*/

.page-id-5579 .site_container {
    background-color: #FEF4F4; /* 背景カラー個別ページ指定 */
}
.kanMid .tagline .colorPrimary {
	border-top: solid 1px #F79468;
	border-bottom: solid 1px #F79468;
}
.kanMid .tagline .colorPrimary::before,
.kanMid .tagline .colorPrimary::after{
	background-color: #F79468;
}
.kanMid .colorSecondary i {
    color: #AD7D4C;
}
.kanMid .cd-spk {
	background: #F79468;
}
.kanMid .cd-date {
	color:#F4524D;
}
.kanMid .flow-icon {
	color:#FFF;
}
.kanMid #cd-timeline::before {
	background: #d7e4ed;
}
.kanMid #guidance nav a::before {
	color:#F79468;
}
.kanMid .pnavi svg {
	fill: #F4524D;
	opacity: 0.6;
}
.kanMid .btnMailform {
	background-color: #FE6C61;
}
.kanMid .btnMailform:hover {
	background-color: #F79468;
}
.kanMid .btnPhone {
	background-color: #FE6C61;
}
.kanMid .btnPhone:hover {
	background-color: #F79468;
}
.btnEntry { background-color: #0087E6; } /* 共通 */
.btnEntry:hover { background-color: #1894F5; } /* 共通 */


/* ------------------------------------
	RECRUIT 4 Typography Color　介護中途 ブルー系
------------------------------------ */

/* 介護中途 ブルー系 */
.kaiMid .colorPrimary { color:#5AA1E3; } /* sky メインカラー*/
.kaiMid .colorSecondary { color:#8D6DC4; } /* usuhanada 第二のカラー*/
.kaiMid .colorPale { color:#5472D2; } /* blue 鮮やかなカラー*/
.kaiMid .colorLight { color:#B97EBB; } /* purple 薄めのカラー*/
.kaiMid .colorPale { color:#EAF4FC; } /* geppaku 淡いカラー*/


.page-id-13816 .site_container,
.page-id-16210 .site_container,
.page-id-19683 .site_container {
    background-color: #EAF4FC; /* 背景カラー個別ページ指定 */
}


.kaiMid .tagline .colorPrimary {
	border-top: solid 1px #B97EBB;
	border-bottom: solid 1px #B97EBB;
}
.kaiMid .tagline .colorPrimary::before,
.kaiMid .tagline .colorPrimary::after{
	background-color: #B97EBB;
}
.kaiMid .colorSecondary i {
    color: #8D6DC4;
}
.kaiMid .cd-spk {
	background: #B97EBB;
}
.kaiMid .cd-date {
	color:#5472D2;
}
.kaiMid .flow-icon {
	color:#FFF;
}
.kaiMid #cd-timeline::before {
	background: #d7e4ed;
}
.kaiMid #guidance nav a::before {
	color:#B97EBB;
}
.kaiMid .pnavi svg {
	fill: #5472D2;
	opacity: 0.6;
}
.kaiMid .btnMailform {
	background-color: #5AA1E3;
}
.kaiMid .btnMailform:hover {
	background-color: #B97EBB;
}
.kaiMid .btnPhone {
	background-color: #5AA1E3;
}
.kaiMid .btnPhone:hover {
	background-color: #B97EBB;
}


/* ------------------------------------
	RECRUIT 4 Typography Color　介護新卒 ＋ インターンシップ グリーン系 ＋ 会社説明会 グリーン系
------------------------------------ */

/* 介護新卒 グリーン系 */
.kaiNew .colorPrimary { color:#75D69C; } /* vista_blue メインカラー*/
.kaiNew .colorSecondary { color:#5C9291; } /* sabiasagi 第二のカラー*/
.kaiNew .colorPale { color:#6DAB3C; } /* green 鮮やかなカラー*/
.kaiNew .colorLight { color:#00C1CF; } /* turquoise 薄めのカラー*/
.kaiNew .colorPale { color:#F5FFFA; } /* mintcream 淡いカラー*/
.page-id-5898 .site_container,
.page-id-6160 .site_container,
.page-id-6713 .site_container,
.page-id-9556 .site_container,
.page-id-9621 .site_container,
.page-id-14662 .site_container,
.page-id-17973 .site_container,
.page-id-18799 .site_container,
.page-id-20310 .site_container,
.page-id-21141 .site_container,
.page-id-22427 .site_container,
.page-id-22643 .site_container {
	background-color: #F5FFFA; /* 背景カラー個別ページ指定 */
}
.kaiNew .tagline .colorPrimary {
	border-top: solid 1px #00C1CF;
	border-bottom: solid 1px #00C1CF;
}
.kaiNew .tagline .colorPrimary::before,
.kaiNew .tagline .colorPrimary::after{
	background-color: #00C1CF;
}
.kaiNew .colorSecondary i {
    color: #5C9291;
}
.kaiNew .cd-spk {
	background: #00C1CF;
}
.kaiNew .cd-date {
	color:#6DAB3C;
}
.kaiNew .flow-icon {
	color:#FFF;
}
.kaiNew #cd-timeline::before {
	background: #d7e4ed;
}
.kaiNew #guidance nav a::before {
	color:#00C1CF;
}
.kaiNew .pnavi svg {
	fill: #6DAB3C;
	opacity: 0.6;
}
.kaiNew .btnMailform {
	background-color: #75D69C;
}
.kaiNew .btnMailform:hover {
	background-color: #00C1CF;
}
.kaiNew .btnPhone {
	background-color: #75D69C;
}
.kaiNew .btnPhone:hover {
	background-color: #00C1CF;
}

/* ------------------------------------
	RECRUIT 4 Typography Color　求人サブ ブラウン系
------------------------------------ */

/* 求人サブ ブラウン系 */
.recSub .colorPrimary { color:#F7BE68; } /* orange メインカラー*/
.recSub .colorSecondary { color:#DAA520; } /* mulled_wine 第二のカラー*/
.recSub .colorPale { color:#BF783E; } /* ※tan 鮮やかなカラー*/
.recSub .colorLight { color:#CEC2AB; } /* chino grey 薄めのカラー*/
.recSub .colorPale { color:#F8F4E6; } /* zouge 淡いカラー*/
.page-id-6246 .site_container {
    background-color: #F8F4E6; /* 背景カラー個別ページ指定 */
}
.recSub .tagline .colorPrimary {
	border-top: solid 1px #CEC2AB;
	border-bottom: solid 1px #CEC2AB;
}
.recSub .tagline .colorPrimary::before,
.recSub .tagline .colorPrimary::after{
	background-color: #CEC2AB;
}
.recSub .colorSecondary i {
    color: #DAA520;
}
.recSub #guidance nav a::before {
	color:#CEC2AB;
}
.recSub .pnavi svg {
	fill: #BF783E;
	opacity: 0.6;
}
.recSub .btnMailform {
	background-color: #F7BE68;
}
.recSub .btnMailform:hover {
	background-color: #CEC2AB;
}
.recSub .btnPhone {
	background-color: #F7BE68;
}
.recSub .btnPhone:hover {
	background-color: #CEC2AB;
}

/* ------------------------------------
	RECRUIT 4 Typography Color　共通
------------------------------------ */

.mainContents h2,.mainContents h3,.mainContents h4,.mainContents h5,.mainContents p {
	font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
	color:#5F5F5F;
}

/* ------------------------------------
	RECRUIT 4 Hone Style
------------------------------------ */

body.page-id-4702 .site_container {
	/*background-color: #FFF;*/
}

#recruitHome h2 {
	font-size: 2.5rem;
/*	font-weight: bolder;
	color: #FFF;
	letter-spacing: 0.2rem;
	padding: 0.7rem 2rem;
	margin: 10px;
	background: -moz-linear-gradient(left, rgba(241,121,0,1) 0%, rgba(241,121,0,0) 80%);
	background: -webkit-linear-gradient(left, rgba(241,121,0,1) 0%,rgba(241,121,0,0) 80%);
	background: linear-gradient(to right, rgba(241,121,0,1) 0%,rgba(241,121,0,0) 80%);
	-webkit-transform: skewx(-20deg);
	transform: skewx(-20deg);
	-moz-text-shadow: 1px 1px 1px #000;
	-webkit-text-shadow: 1px 1px 1px #000;
	text-shadow: 1px 1px 1px #000;
	*/
}
#recruitHome .recruitInfo h3 {font-size:2.8rem; line-height:2; text-align:center; }
#recruitHome .recruitInfo h4 {font-size:1.8rem; line-height:1.6; text-align:center; }

#recruitHome .kaiNew,
#recruitHome .kaiMid,
#recruitHome .kanMid,
#recruitHome .recSub {
    background-color: #FFF; /* 新卒介護背景カラー個別ページ指定F5FFFA */
	padding:1.5rem;
}
#recruitHome .kaiNew {
    background-color: #FFF; /* 新卒介護背景カラー個別ページ指定F5FFFA */
}
#recruitHome .kaiMid {
    background-color: #FFF; /* 中途介護背景カラー個別ページ指定EAF4FC */
}
#recruitHome .kanMid {
    background-color: #FFF; /* 中途看護背景カラー個別ページ指定FEF4F4 */
}
#recruitHome .recSub {
    background-color: #FFF; /* 理事長カラー個別ページ指定F8F4E6 */
}

#ourCompany .message {
	background: #fff;
	padding:2.5rem 50px;
	margin:0 auto;
}
#ourCompany .message > div {
	background: white;
	box-shadow: 0 3px 5px rgba(0, 0, 0, 0.22);
}
#ourCompany .message > div p {
	margin:20px auto;
	padding:2rem;
	color: #5f5f5f;
	font-size: 1.8rem;
	line-height: 2;
	border-top:#cb451b 3px solid;
	font-family: "Sawarabi Mincho", serif;
	letter-spacing:0.1rem;
	text-align:justify;
}

.recruitStep {
	margin-top:30px;
}
.recruitStep p {
	padding:0.5em 0;
}
/*
.recruitStep div.vc_col-sm-4,
.recruitStep div.vc_col-sm-6 {
	margin-top:0 !important;
}
.recruitStep div.vc_col-sm-2 {
	margin-top:20px !important;
}
*/
.recruitStep div.dropcap .dropcap_label {
	margin-right:10px;
	padding: inherit;
}
.recruitStep > div {
	position:relative;
}
.recruitStep > .direction .dropcap::after {
	position:absolute;
	font-family: FontAwesome;
	content : "\f054";
	margin-right :30px;
	color:#f17800;
	top: 50%;
	right: 30px;
	margin-top:0.8rem;
	font-size:2rem;
}
.recruitStep div.dropcap h3 {
	font-size: 1.8rem;
	padding:7px 10px;
	line-height:1;
}
.recruitStep div.dropcap strong {
	font-size: 1.8rem;
	padding:7px 0 0 15px;
	font-weight:normal;
	display:inline-block;
}
.recruitStep .pagelink a.mc_button {
	border-radius: 10px;
	float:right;
}
.recruitStep .pagelink a.mc_button::before {
	font-family: FontAwesome;
	content : "\f08e";
	margin-right :0.5rem;
}
.recruitStep .announcement {
	background: rgba(248, 244, 230, 0.66);
	/*box-shadow: 0 3px 20px rgba(0, 0, 0, 0.22);*/
	border: 1px solid #00b6cc;
}
.recruitStep .announcement h1 {
	color:#5C9291;
	font-size: 2.7rem;
	line-height: 2;
}
.recruitStep .announcement p {
	text-align:justify;
}

#inquiryform .contactDiv {
	line-height: 1.8;
	font-size: 2.2rem;
	text-align:center;
	margin:0 auto;
	color:#5f5f5f;
}
#inquiryform .contactDiv h3 {
	font-size: 3rem;
	text-align:left;
}
#inquiryform .contactDiv p {
	font-size: 2.6rem;
	padding-top:0;
	margin-right:2rem;
	text-align:right;
}
#inquiryform .contactDiv strong {
	font-size: 3.2rem;
	letter-spacing:0.3rem;
	color:#313131;
	text-align:center;
	display:block;
}



/* ------------------------------------
	RECRUIT 4 Common Style
------------------------------------ */

/* ------- Main menu style ------- */
.parent-pageid-4702 .header_container.sticky {
	z-index:10000;
}
.parent-pageid-4702 .header_container.sticky.move {
	position: static;
}
/* ------- Cube Button style ------- */

.buttonCube * {
	box-sizing: border-box;
}
.buttonCube {
    margin: 0;
    border: 0;
    font-size: 18px;
    position: relative;
    /* top: 50%; */
    left: 50%;
    margin-top: 25px;
    margin-left: -100px;
    width: 200px;
    height: 50px;
    text-align: center;
	/*
	-webkit-perspective : 500px;
	perspective: 500px;
	*/
	display:inline-block;
}
 
.buttonCube p {
	position: absolute;
	text-align: center;
	width: 100%;
	height: 50px;
	padding: 10px;
	border: #cb451b solid 1px;
	/*pointer-events: none;*/
	box-sizing: border-box;
}
.buttonCube p:nth-child(1) {
	color: #cb451b;
	background-color: #FFF;
	transform: rotateX(90deg);
	transition: all 0.2s ease;
	transform-origin: 50% 50% -25px;
}
 
.buttonCube p:nth-child(2) {
	color: #FFF;
	background-color: #cb451b;
	transform: rotateX(0deg);
	transition: all 0.2s ease;
	transform-origin: 50% 50% -25px;
}
 
.buttonCube:hover p:nth-child(1) {
	color: #cb451b;
	transition: all 0.2s ease;
	transform: rotateX(0deg);
}
 
.buttonCube:hover p:nth-child(2) {
	background-color: #cb451b;
	transition: all 0.2s ease;
	transform: rotateX(-90deg);
}
/* もと
.buttonCube p:nth-child(1) {
	color: #000000;
	background-color: #000000;
	transform: rotateX(90deg);
	transition: all 0.2s ease;
	transform-origin: 50% 50% -25px;
}
 
.buttonCube p:nth-child(2) {
	color: #000000;
	background-color: #ffffff;
	transform: rotateX(0deg);
	transition: all 0.2s ease;
	transform-origin: 50% 50% -25px;
}
 
.buttonCube:hover p:nth-child(1) {
	color: #ffffff;
	transition: all 0.2s ease;
	transform: rotateX(0deg);
}
 
.buttonCube:hover p:nth-child(2) {
	background-color: #000000;
	transition: all 0.2s ease;
	transform: rotateX(-90deg);
}
*/


/* ------- Typography base style ------- */
.mainContents h2 {font-size:3rem; line-height:2; text-align:center; }
.mainContents h3 {font-size:2.5rem; line-height:1.8;}
.mainContents h4 {font-size:1.8rem; line-height:1.6;}
.mainContents h5 {font-size:1.6rem; line-height:1.6;}

.mainContents p {
	font-size:1.6rem;
	line-height:1.8;
	text-align:justify;
}
.mainContents p + p {
	padding-top:0;
}


/* ------- Tagline Style ------- */
.mainContents .tagline {
	min-width: 90%;
	margin:40px auto 60px;
}
.mainContents .tagline h2{
	color:#5F5F5F;
	position: relative;
	padding: 2rem 6rem;
	line-height: 2.2;
	font-size: 3rem;
	width:90%;
	margin:0 auto;
}
.mainContents .tagline .colorPrimary::before,
.mainContents .tagline .colorPrimary::after{
	content: '';
	position: absolute;
	top: -30px;
	width: 1px;
	height: calc(100% + 60px);
}
.mainContents .tagline .colorPrimary::before{left: 30px;}
.mainContents .tagline .colorPrimary::after{right: 30px;}

.mainContents .tagline .colorPrimary span {
	display:inline-block;
}
/* ------- Block style ------- */
.mainContents .outline {
	margin:60px auto;
}
.mainContents .innerWrap {
	border-radius: 30px;
	background: #fff;
	padding:50px;
}
.mainContents .innerWrap.two {
	padding:0;
}
.mainContents .innerWrap.two .leftbox {
	padding:3rem 0 3rem 3rem;
}
.mainContents .innerWrap.two .rightbox {
	padding:3rem 3rem 3rem 0;
}
.mainContents .innerWrap.two .centerbox {
	padding:3rem 1.5rem;
}
.mainContents .innerWrap.two.nobottom .leftbox,
.mainContents .innerWrap.two.nobottom .rightbox,
.mainContents .innerWrap.two.nobottom .centerbox {
	padding-bottom:0;
}
.mainContents .innerWrap.top {
	border-radius: 30px 30px 0 0;
	margin-bottom:0;
}
.mainContents .innerWrap.bottom {
	border-radius: 0 0 30px 30px;
	margin-top:0;
	/*padding-bottom: 3rem;*/
}
.mainContents .innerWrap.middle {
	border-radius:0;
	margin-bottom:0;
	margin-top:0;
}

/* ------- Float style ------- */
.flt {
		width:45%;
}
.flt.lf {
	float:left;
	margin: 1em 20px 20px 0;
}
.flt.rf {
	float:right;
	margin: 1em 0 20px 20px;
}

/* ------- Caption style ------- */
#recruitOpening .wpb_single_image .vc_figure-caption {
    margin-top: 1.2em;
    font-size: 1em;
    line-height: 1.6;
}

/* ------- Nav Part Style ------- */
#guidance nav {
	display:-webkit-box;
	display:-moz-box;
	display:-ms-flexbox;
	display:-webkit-flex;
	display:-moz-flex;
	display:flex;
	-webkit-flex-pack:distribute;
	-moz-flex-pack:distribute;
	-ms-flex-pack:distribute;
	-webkit-justify-content:space-around;
	-moz-justify-content:space-around;
	justify-content:space-around;  
	
	margin:0px auto 20px;
	width:90%;
}
#guidance nav p {
	flex:0 1 100%;
	margin:20px 20px 0;
	padding-top:0;
}
#guidance nav a {
	border:1px solid #a9a9a9;
	border-radius:60px;
	padding:1.6rem;
	text-align:center;
	display:block;
	font-size:2.7rem;
	color:#5f5f5f;
	text-decoration:none;
	background:#FFF;
}
#guidance nav a::before {
	font-family: FontAwesome;
	content : "\f107";
	margin-right:0.5rem;
}

/* ------------------------------------
	RECRUIT 4 Introduction Part Style
------------------------------------ */
#introduction h2 {
	text-align:left;
	margin-top:30px;
}


/* ------------------------------------
	RECRUIT 3 Workflow Part Style
------------------------------------ */

#workflow h3 {
	font-size:2rem;
}

/* ------------------------------------
	RECRUIT 3 Questions Part Style
------------------------------------ */

#questions.simple-list .vc_toggle:last-of-type {
	margin-bottom: 0;
}

/* ------------------------------------
	RECRUIT 4 Guidance Part Style
------------------------------------ */

#guidance {
	margin-top:10px;
}
#guidance h2 {
	margin-bottom:30px;
}
#guidance h3 {
	text-align:center;
}
#guidance h4 {
	font-size:2.5rem;
}

#guidance .base-table {
    border: none;
    margin: 10px auto 30px;
    line-height: 1.6;
    width: 100%;
    font-size: 1.5rem;
    text-align: left;
    border-collapse: collapse;
    table-layout: fixed;
}

#guidance .base-table {
	border: none;
	margin: 10px auto 30px;
	line-height: 1.6;
	width: 100%;
	font-size: 1.5rem;
	text-align: left;
	border-collapse: collapse;
	table-layout: fixed;
}
#guidance .base-table:last-child {
	margin-bottom:0;
}
#guidance .base-table th {
	border-left:none;
	border-right:none;
	font-size:1.6rem;
	padding:1.2rem 0;
	background-color: #F6F6F6;
	color: #5f5f5f;
}
#guidance .base-table td {
	border-left:none;
	border-right:none;
	font-size:1.6rem;
	color: #5f5f5f;
	padding:0.5rem 1em;
}
#guidance .base-table ul,
#guidance .base-table ol {
	margin:0.5rem 0;
}
#guidance .base-table ol li {
	line-height:1;
	margin:1rem 0;
}
#guidance .base-table ul li {
	line-height:1.6;
	margin-left:-2rem;
}
#guidance .base-table ol {
	counter-reset: li;
	margin:0;
	padding:0;
}
#guidance .base-table ol > li {
	list-style: none;
	position: relative;
	padding-left: 2em;
	margin-bottom: 0.8em;
}
#guidance .base-table ol > li::before {
	counter-increment: li;
	content: counter(li);
	margin-right: 1em;
	background: #fff;
	color: #5f5f5f;
	border:1px solid #5f5f5f;
	border-radius: 50%;
	text-align: center;
	width: 1.3em;
	height: 1.3em;
	position: absolute;
	left: 0;
	top: -2px;
	line-height: 1.3;
	font-size:0.9em;
}

/* ------------------------------------
	RECRUIT 4 Inquiryform Part Style
------------------------------------ */

#inquiryform .announce {
	line-height: 1.8;
	font-size: 2.2rem;
	text-align:center;
	margin:0 auto;
	color:#5f5f5f;
}
#inquiryform .announce h3 {
	font-size: 3rem;
	text-align:center;
}
#inquiryform .announce p {
	font-size: 2.6rem;
	padding-top:0;
	text-align:center;
}
#inquiryform .announce strong {
	font-size: 3.2rem;
	letter-spacing:0.3rem;
	color:#313131;
}


/* ------- Contact Form ------- */
#inquiryform #mailform {
	margin-bottom:0;
	margin-top:0;
}

#inquiryform #mailform label {
	color: #5f5f5f;
	font-size: 1.6rem;
}
#inquiryform #mailform input {
	font-size: 1.6rem;
}
#inquiryform #mailform textarea {
	font-size: 1.6rem;
	min-height:8rem;
}
#inquiryform #mailform .caption + .caption {
	padding-left:30px;
}
#inquiryform #mailform .inside[class*="vc_col-sm"]:first-child {
	margin-left:auto;
	margin-right:auto;
}
#inquiryform #mailform input[type='submit'] {
	float: none;
	width: 150px;
	height: 40px;
	border-radius:10px;
}
#inquiryform #mailform input.text_input {
	width: 390px;
}
#inquiryform #mailform textarea {
	width: 848px;
}

/* ------------------------------------
	RECRUIT 4 Watchmore Part Style
------------------------------------ */

#watchmore h3,
#watchmoreSub h3 {
	font-size:2rem;
}





/* -------------------------------- 
	Vertical Timeline Modules
	idea2
-------------------------------- */

#workflow .cd-container {
	/* this class is used to give a max-width to the element it is applied to, and center it horizontally when it reaches that max-width */
	width: 100%;
	max-width: 990px;
	margin: 0 auto;
}
#workflow .cd-container::after {
	/* clearfix */
	content: '';
	display: table;
	clear: both;
}


/* -------------------------------- 
	Vertical Timeline
	Main components idea2
-------------------------------- */
#workflow header {
	height: 200px;
	line-height: 200px;
	text-align: center;
	background: #303e49;
}
#workflow header h1 {
	color: white;
	font-size: 18px;
	font-size: 1.125rem;
}
@media only screen and (min-width: 1009px) {
	#workflow header {
		height: 300px;
		line-height: 300px;
	}
	#workflow header h1 {
		font-size: 24px;
		font-size: 1.5rem;
	}
}

#cd-timeline {
	position: relative;
	padding: 2em 0;
	margin-top: 0;
	margin-bottom: 0;
	/*
	margin-top: 2em;
	margin-bottom: 2em;
	*/
}
#cd-timeline::before {
	/* this is the vertical line */
	content: '';
	position: absolute;
	top: 0;
	left: 18px;
	height: 100%;
	width: 4px;
	/*background: #d7e4ed;*/
}
@media only screen and (min-width: 1009px) {
	#cd-timeline {
		margin-top: 0;
		margin-bottom: 0;
		/*
		margin-top: 3em;
		margin-bottom: 3em;
		*/
	}
	#cd-timeline::before {
		left: 50%;
		margin-left: -2px;
	}
}

.cd-timeline-block {
	position: relative;
	margin: 2em 0;
}
.cd-timeline-block::after {
	content: "";
	display: table;
	clear: both;
}
.cd-timeline-block:first-child {
	margin-top: 0;
}
.cd-timeline-block:last-child {
	margin-bottom: 0;
}
@media only screen and (min-width: 1009px) {
	.cd-timeline-block {
		margin: 1em 0;
	}
	.cd-timeline-block:first-child {
		margin-top: 0;
	}
	.cd-timeline-block:last-child {
		margin-bottom: 0;
	}
}

.cd-timeline-img {
	position: absolute;
	top: 0;
	left: 0;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	box-shadow: 0 0 0 4px white, inset 0 2px 0 rgba(0, 0, 0, 0.08), 0 3px 0 4px rgba(0, 0, 0, 0.05);
	
	display: flex;
	align-items: center;
	justify-content: center;

}
.cd-timeline-img img {
	display: block;
	width: 24px;
	height: 24px;
	position: relative;
	left: 50%;
	top: 50%;
	margin-left: -12px;
	margin-top: -12px;
}
/*
.cd-timeline-img.cd-picture {
	background: #75ce66;
}
.cd-timeline-img.cd-movie {
	background: #c03b44;
}
.cd-timeline-img.cd-location {
	background: #f0ca45;
}
*/

@media only screen and (min-width: 1009px) {
	.cd-timeline-img {
		width: 60px;
		height: 60px;
		left: 50%;
		margin-left: -30px;
		/* Force Hardware Acceleration in WebKit */
		-webkit-transform: translateZ(0);
		-webkit-backface-visibility: hidden;
	}
	.cssanimations .cd-timeline-img.is-hidden {
		visibility: hidden;
	}
	.cssanimations .cd-timeline-img.bounce-in {
		visibility: visible;
		-webkit-animation: cd-bounce-1 0.6s;
		-moz-animation: cd-bounce-1 0.6s;
		animation: cd-bounce-1 0.6s;
	}
}

@-webkit-keyframes cd-bounce-1 {
	0% {
		opacity: 0;
		-webkit-transform: scale(0.5);
	}

	60% {
		opacity: 1;
		-webkit-transform: scale(1.2);
	}

	100% {
		-webkit-transform: scale(1);
	}
}
@-moz-keyframes cd-bounce-1 {
	0% {
		opacity: 0;
		-moz-transform: scale(0.5);
	}

	60% {
		opacity: 1;
		-moz-transform: scale(1.2);
	}

	100% {
		-moz-transform: scale(1);
	}
}
@keyframes cd-bounce-1 {
	0% {
		opacity: 0;
		-webkit-transform: scale(0.5);
		-moz-transform: scale(0.5);
		-ms-transform: scale(0.5);
		-o-transform: scale(0.5);
		transform: scale(0.5);
	}

	60% {
		opacity: 1;
		-webkit-transform: scale(1.2);
		-moz-transform: scale(1.2);
		-ms-transform: scale(1.2);
		-o-transform: scale(1.2);
		transform: scale(1.2);
	}

	100% {
		-webkit-transform: scale(1);
		-moz-transform: scale(1);
		-ms-transform: scale(1);
		-o-transform: scale(1);
		transform: scale(1);
	}
}
.cd-timeline-content {
	position: relative;
	margin-left: 60px;
	background: white;
	border-radius: 0.25em;
	padding: 1em;
	/*box-shadow: 0 3px 0 #d7e4ed;*/
	background:#F6F6F6;
	border-radius: 10px;
}
.cd-timeline-content::after {
	content: "";
	display: table;
	clear: both;
}
#cd-timeline .cd-timeline-content h2 {
	color: #5f5f5f;
	font-size:2rem;
}
.cd-timeline-content p, .cd-timeline-content .cd-read-more, .cd-timeline-content .cd-date {
	font-size: 1.6rem;
	/*
	font-size: 13px;
	font-size: 0.8125rem;
	*/
}
.cd-timeline-content .cd-read-more, .cd-timeline-content .cd-date {
	display: inline-block;
}
.cd-timeline-content p {
	margin: 0.5em 0;
	line-height: 1.6;
}
.cd-timeline-content .cd-read-more {
	float: right;
	padding: .8em 1em;
	background: #acb7c0;
	color: white;
	border-radius: 0.25em;
}
.no-touch .cd-timeline-content .cd-read-more:hover {
	background-color: #bac4cb;
}
.cd-timeline-content .cd-date {
	float: left;
	padding: .8em 0;
	opacity: .7;
}
.cd-timeline-content::before {
	content: '';
	position: absolute;
	top: 16px;
	right: 100%;
	height: 0;
	width: 0;
	border: 7px solid transparent;
	border-right: 7px solid white;
}
@media only screen and (min-width: 768px) {
	.cd-timeline-content h2 {
		font-size: 20px;
		font-size: 1.25rem;
	}
	.cd-timeline-content p {
		font-size: 16px;
		font-size: 1.6rem;
	}
	.cd-timeline-content .cd-read-more, .cd-timeline-content .cd-date {
		font-size: 14px;
		font-size: 1.4rem;
	}
}
@media only screen and (min-width: 1009px) {
	.cd-timeline-content {
		margin-left: 0;
		padding: 1.6em;
		width: 45%;
	}
	.cd-timeline-content::before {
		top: 24px;
		left: 100%;
		border-color: transparent;
		border-left-color: #F6F6F6;
	}
	.cd-timeline-content .cd-read-more {
		float: left;
	}
	.cd-timeline-content .cd-date {
		position: absolute;
		width: 100%;
		left: 120%;
		top: -12px;
		font-size: 1.6rem;
	}
	.cd-timeline-block:nth-child(even) .cd-timeline-content {
		float: right;
	}
	.cd-timeline-block:nth-child(even) .cd-timeline-content::before {
		top: 24px;
		left: auto;
		right: 100%;
		border-color: transparent;
		border-right-color: #F6F6F6;
	}
	.cd-timeline-block:nth-child(even) .cd-timeline-content .cd-read-more {
		float: right;
	}
	.cd-timeline-block:nth-child(even) .cd-timeline-content .cd-date {
		left: auto;
		right: 120%;
		text-align: right;
	}
	.cssanimations .cd-timeline-content.is-hidden {
		visibility: hidden;
	}
	.cssanimations .cd-timeline-content.bounce-in {
		visibility: visible;
		-webkit-animation: cd-bounce-2 0.6s;
		-moz-animation: cd-bounce-2 0.6s;
		animation: cd-bounce-2 0.6s;
	}
}

@media only screen and (min-width: 1009px) {
	/* inverse bounce effect on even content blocks */
	.cssanimations .cd-timeline-block:nth-child(even) .cd-timeline-content.bounce-in {
		-webkit-animation: cd-bounce-2-inverse 0.6s;
		-moz-animation: cd-bounce-2-inverse 0.6s;
		animation: cd-bounce-2-inverse 0.6s;
	}
}
@-webkit-keyframes cd-bounce-2 {
	0% {
		opacity: 0;
		-webkit-transform: translateX(-100px);
	}

	60% {
		opacity: 1;
		-webkit-transform: translateX(20px);
	}

	100% {
		-webkit-transform: translateX(0);
	}
}
@-moz-keyframes cd-bounce-2 {
	0% {
		opacity: 0;
		-moz-transform: translateX(-100px);
	}

	60% {
		opacity: 1;
		-moz-transform: translateX(20px);
	}

	100% {
		-moz-transform: translateX(0);
	}
}
@keyframes cd-bounce-2 {
	0% {
		opacity: 0;
		-webkit-transform: translateX(-100px);
		-moz-transform: translateX(-100px);
		-ms-transform: translateX(-100px);
		-o-transform: translateX(-100px);
		transform: translateX(-100px);
	}

	60% {
		opacity: 1;
		-webkit-transform: translateX(20px);
		-moz-transform: translateX(20px);
		-ms-transform: translateX(20px);
		-o-transform: translateX(20px);
		transform: translateX(20px);
	}

	100% {
		-webkit-transform: translateX(0);
		-moz-transform: translateX(0);
		-ms-transform: translateX(0);
		-o-transform: translateX(0);
		transform: translateX(0);
	}
}
@-webkit-keyframes cd-bounce-2-inverse {
	0% {
		opacity: 0;
		-webkit-transform: translateX(100px);
	}

	60% {
		opacity: 1;
		-webkit-transform: translateX(-20px);
	}

	100% {
		-webkit-transform: translateX(0);
	}
}
@-moz-keyframes cd-bounce-2-inverse {
	0% {
		opacity: 0;
		-moz-transform: translateX(100px);
	}

	60% {
		opacity: 1;
		-moz-transform: translateX(-20px);
	}

	100% {
		-moz-transform: translateX(0);
	}
}
@keyframes cd-bounce-2-inverse {
	0% {
		opacity: 0;
		-webkit-transform: translateX(100px);
		-moz-transform: translateX(100px);
		-ms-transform: translateX(100px);
		-o-transform: translateX(100px);
		transform: translateX(100px);
	}

	60% {
		opacity: 1;
		-webkit-transform: translateX(-20px);
		-moz-transform: translateX(-20px);
		-ms-transform: translateX(-20px);
		-o-transform: translateX(-20px);
		transform: translateX(-20px);
	}

	100% {
		-webkit-transform: translateX(0);
		-moz-transform: translateX(0);
		-ms-transform: translateX(0);
		-o-transform: translateX(0);
		transform: translateX(0);
	}
}






/* ------------------------------------
	RECRUIT 4 Responsive Style
------------------------------------ */

@media screen and (min-width: 768px) and ( max-width: 1009px) {
	
	
	/* ------------------------------------
		RECRUIT 4 Common Style
	------------------------------------ */
	/* ------- Typography base style ------- */
	.mainContents h2 {
		text-align: center;
		margin-bottom: 40px;
	}
	/* ------- Block style ------- */
	.mainContents .outline {
		margin:30px auto;
	}
	.mainContents .innerWrap {
		padding:30px;
		border-radius: 20px;
	}
	/* ------- Tagline Style ------- */
	.mainContents .tagline {
		min-width: 100%;
		margin: 30px auto 250px;
	}
	.mainContents .tagline h2{
		padding: 1rem 4rem;
		line-height: 1.7;
		font-size: 2.6rem;
		text-align:center;
		width:100%;
	}
	/* ------- Float style ------- */
	.flt {
			width:50%;
	}
	/* ------------------------------------
		RECRUIT 4 Introduction Part Style
	------------------------------------ */
	#introduction h2 {
		margin-bottom:0;
		margin-top: 10px;
	}
	/* ------------------------------------
		RECRUIT 4 Questions Part Style
	------------------------------------ */
	#questions article {
		margin:1rem 0;
	}
	/* ------------------------------------
		RECRUIT 4 Guidance Part Style
	------------------------------------ */
	/* ------- Nav Part Style ------- */
	#guidance nav a {
		border-radius:40px;
		padding:1.4rem;
		font-size:2.2rem;
	}
	/* ------------------------------------
		RECRUIT 4 Inquiryform Part Style
	------------------------------------ */
	#inquiryform #mailform input.text_input {
		width: 279px;
	}
	#inquiryform #mailform textarea {
		width: 614px;
	}

}

@media screen and (max-width: 767px) {

	/* ------- Typography base style ------- */
	.mainContents h2 {font-size:2.4rem; line-height:2;}
	.mainContents h3 {font-size:2rem; line-height:1.8;}
	.mainContents h4 {font-size:1.6rem; line-height:1.6;}
	.mainContents h5 {font-size:1.4rem; line-height:1.6;}
	.mainContents h2 {
		text-align: center;
		margin-bottom: 2rem;
	}
	/*
	#recruitHome .flex .caption h3,
	#recruitHome .flex .caption h4 {
		padding-top:1rem;
	}
	#recruitHome .flex .subtitle h3 {
		padding-top:0;
	}
	*/


	/* ------------------------------------
		RECRUIT 4 Common Style
	------------------------------------ */
	/* ------- Block style ------- */
	.theme_page {
		width: 80% !important;
	}
	/* ------- Block style ------- */
	.mainContents .outline {
		margin:2rem auto;
	}
	.mainContents .innerWrap {
		padding:1.5rem;
		border-radius: 20px;
	}
	/* ------- Tagline Style ------- */
	.mainContents .tagline {
		min-width: 100%;
		margin: 30px auto 100px;
	}
	.mainContents .tagline h2{
		padding: 1rem 4rem;
		line-height: 1.7;
		font-size: 2rem;
		width:100%;
	}
	.mainContents .tagline .colorPrimary::before,
	.mainContents .tagline .colorPrimary::after{
		content: '';
		position: absolute;
		top: -15px;
		width: 1px;
		height: calc(100% + 30px);
	}
	.mainContents .tagline .colorPrimary::before{left: 15px;}
	.mainContents .tagline .colorPrimary::after{right: 15px;}

	/* ------- Float style ------- */
	.flt {
			width:60%;
	}
	/* ------- Flex Two Culumn Style ------- */
	.mainContents .innerWrap.two .leftbox > div {
		margin-top:1.5rem;
	}
	.mainContents .recruitStep.innerWrap.two .leftbox > div {
		margin-top:0;
	}
	.mainContents .innerWrap.two .leftbox,
	.mainContents .innerWrap.two .centerbox,
	.mainContents .innerWrap.two .rightbox {
		padding:1.5rem;
		margin-top:0;
	}
	.mainContents .innerWrap.two .rightbox.topmargin {
		margin-top:0;
	}
	.mainContents .innerWrap.two.nobottom .leftbox,
	.mainContents .innerWrap.two.nobottom .centerbox,
	.mainContents .innerWrap.two.nobottom .rightbox {
		padding:0 1.5rem;
	}
	.mainContents .innerWrap.top {
		padding-top:1.5rem;
		border-radius: 20px 20px 0 0;
	}
	.mainContents .innerWrap.bottom {
		border-radius: 0 0 20px 20px;
		padding-bottom: 1.5rem;
	}
	/* ------------------------------------
		RECRUIT 4 Introduction Part Style
	------------------------------------ */
	#introduction .wpb_column.vc_column_container.vc_col-sm-4 {
		margin-top:0;
	}
	#introduction h2 {
		margin-bottom:0;
		margin-top: 10px;
	}
	#introduction .movie h2.wpb_video_heading {
		top: 75%;
		font-size: 5rem;
	}
	/* ------------------------------------
		RECRUIT 4 Questions Part Style
	------------------------------------ */
	#questions article {
		margin:1rem 0;
	}
	#questions p {
		padding: 0.5rem 0;
	}
	/* ------------------------------------
		RECRUIT 4 Guidance Part Style
	------------------------------------ */
	/* ------- Nav Part Style ------- */
	#guidance nav {
		flex-direction: column;
		width:100%;
		margin-top:20px;
	}
	#guidance nav p {
		flex:0 1 100%;
		margin:5px 5px 10px;
		padding:0;
	}
	#guidance nav a {
		border-radius:30px;
		padding:1rem;
		font-size:2rem;
	}
	/* ------- Table Part Style ------- */
	#guidance .base-table th {
		padding:0.5rem;
		width:6.2em;
	}
	#guidance .base-table td {
		padding:0.5rem 1rem;
	}
	
	/* ------------------------------------
		RECRUIT 4 Inquiryform Part Style
	------------------------------------ */
	#inquiryform #mailform .left, #inquiryform #mailform .right {
		float:none;
	}
	#inquiryform #mailform input.text_input {
		width: calc(100% - 36px);
	}
	#inquiryform #mailform textarea {
		width: calc(100% - 36px);
	}
	#inquiryform #mailform .right {
		margin-left: 0;
	}

	/* ------------------------------------
		RECRUIT 4 JS Style
	------------------------------------ */
	
	/* ------- Button Style ------- */
	
	#appointment {
		width:50px;
		bottom:100px;
	}
	#appointment a img {
		width:20px;
		height:auto;
		bottom:100px;
	}

}

@media screen and (max-width: 479px) {

	/* ------- Block style ------- */
	.theme_page {
		width: 90% !important;
	}
	/* ------- Float style ------- */
	.flt {
			width:100%;
	}
	.flt.lf, .flt.rf {
		float:none;
		margin: 20px auto;
	}
	#introduction .movie h2.wpb_video_heading {
		top: 70%;
		font-size: 3rem;
	}
}



/* ------------------------------------
	RECRUIT 4 Navi Style
------------------------------------ */
.navi-icon {
	display:none;
}
ul.svgnavi{
	width:100%;
	margin:0 auto;
	display:table;
	table-layout:fixed;
	border-collapse:separate;
	font-size:0;
	padding:0 20px;
}
.svgnavi li {
	text-align:center;
	display:table-cell;
	padding:10px 0;
}
.svgnavi li span { 
	display:inline-block;
	margin-left: 0.5rem;
}
.svgnavi a { 
	line-height:1.2;
	text-decoration:none;
	font-size:1.2rem;
	margin:0;
	display:block;
	border: none;
}
.svgnavi li:first-child a {
	margin-left:0;
}
.svgnavi li:last-child a {
	margin-right:0;
}
.pnavi li {
	vertical-align: top;
}
.pnavi li + li {
	border-left:1px #a9a9a9 solid;
}
.pnavi li a {
	color:#5F5F5F;
}
.pnavi svg {
	padding:0;
	margin:0;
	width:40px;
	height:40px;
	vertical-align:middle;	
}
.cnavi li {
	padding:6px 0;
	/*width:33.3%;*/
}
.cnavi li a {
	border-radius:10px;
	color:#FFF;
	margin:6px;
	padding:1.5rem;
	text-align: center;
	display: block;
}
.cnavi svg {
	padding:0;
	margin:0;
	width:50px;
	height:50px;
	vertical-align:middle;
	fill:#FFF;
}
.cnavi li span {
	font-size:1.8rem;
	padding-left:0.4rem;
}
.cnavi li span b {
	font-weight:normal;
}

.arrowup {
	background-color: #999;
	padding:10px;
}

@media screen and (min-width: 1009px) {
	ul.svgnavi{
		width:1000px;
	}
}
@media screen and (max-width: 990px) {
	/*
	.pnavi li span {
		display:block;
		margin-left:0;
	}
	*/
}
@media screen and (max-width: 767px) {
	ul.svgnavi{
		padding:0 5px;
	}
	.pnavi li {
		margin:0;
	}
	.svgnavi li span {
		display:block;
		margin-left: 0;
	}
	.svgnavi svg {
		padding:0;
		margin:0;
		width:30px;
		height:30px;
	}
	.cnavi li a {
		padding:1rem;
	}
	.cnavi li span {
		display:inline-block;
		margin-right:0.5rem;
		font-size:1.4rem;
	}
}
@media screen and (max-width: 479px) {
	.svgnavi li {
		padding: 5px 0 2px;
	}
	.pnavi li a {
			margin:0;
	}
	.pnavi li span {
		font-size:1rem;
		margin:4px auto 0;
		line-height:1.2;
		/*
		width:2.8rem;
		min-height:2.4rem;
		padding-left:0;
		*/
	}
	.pnavi li span + span {
		margin-top:0;
	}
	.cnavi li a {
		padding:0.7rem;
	}
	.cnavi li span {
		display: block;
		margin-top: 0.5rem;
	}
	.cnavi li span b {
		display: none;
	}
}


#pagenavi {
	opacity:0;
}
.navinone {
	display:none;
}
.navifixed {
	width: 100%;
	position:fixed;
	top:0;
	left: 0;
	z-index:400;
	opacity:1;
	border-bottom:1px #a9a9a9 solid;
	margin: 0;
	display:block;
	background-color: rgba(255,255,255,0.9);
}
#contactbtn {
	position:fixed;
	bottom:0;
	left: 0;
	z-index:300;
	width: 100%;
	opacity:0;
}
.contactbtnfixed {
	opacity:1;
}




/* ------------------------------------
	RECRUIT HOME Style
------------------------------------ */

#recruitHome .flex > .vc_column-inner  > .wpb_wrapper {
	display: flex;
	justify-content: space-between;
	align-items: stretch;
}
#recruitHome .flex .pic {
	flex:0 0 25%;
}
#recruitHome .flex .subtitle {
	flex:0 3 auto;
}
#recruitHome .flex .caption {
	flex:0 1 300px;
}
	#recruitHome .flex .caption > .wpb_wrapper {
		display: flex;
		flex-wrap:wrap;
		justify-content:center;
	}
	#recruitHome .flex .caption .prof,
	#recruitHome .flex .caption .buttonWrap {
		flex:0 1 100%;
	}
	#recruitHome .flex .caption h3,
	#recruitHome .flex .caption h4 {
		display:inline-block;
		text-align:center;
		width:100%;
	}
#recruitHome .flex .subtitle h3 {
	padding:30px 2rem 0;
	color:#5F5F5F;
	text-align:justify;
}
#recruitHome .flex .subtitle p {
	padding:1rem 2rem 0;
	color:#5F5F5F;
	text-align:justify;
	font-size:1.6rem;
}
#recruitHome .flex .caption h3 {
	padding:30px 0 0;
	font-size:2.5rem;
	vertical-align: top;
}
.pic,
.equally {
	position: relative;
}
#recruitHome .flex .equally {
	flex:0 0 50%;
}
	#recruitHome .flex .equally .buttonWrap {
		flex:0 1 100%;
	}
	#recruitHome .flex .equally h3 {
	padding:30px 2rem 0;
	font-size:2.5rem;
	vertical-align: top;
	}
	#recruitHome .flex .equally p.detail {
	padding:1rem 2rem 0;
	color:#5F5F5F;
	text-align:justify;
	font-size:1.6rem;
	line-height:1.7;
	}



@media screen and (min-width: 768px) and ( max-width: 1009px) {
	#recruitHome .flex .pic {
		flex:0 0 30%;
	}
	#recruitHome .flex .subtitle {
		flex: 0 2 auto;
	}
	#recruitHome .flex .subtitle h3, 
	#recruitHome .flex .caption h3 {
		padding-top:10px;
	}
	.recruitStep > .direction .dropcap::after {
		margin-right: 0;
		right: 15px;
	}
	#recruitHome .flex .subtitle h3 {
		font-size:2.4rem;
		line-height:1.6;
	}

}

@media screen and (max-width: 767px) {
	
	/* ------------------------------------
		RECRUIT 4 Home Style
	------------------------------------ */
	#recruitHome h2 {
		font-size: 2.5rem;
	}
	
	#recruitHome .flex > .vc_column-inner  > .wpb_wrapper {
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
		align-items: stretch;
	}
	#recruitHome .flex .pic {
		flex:0 1 40%;
	}
	#recruitHome .flex .equally {
		flex:0 1 100%;
	}
	#recruitHome .flex .subtitle {
		flex:0 1 60%;
	}
	#recruitHome .flex .caption {
		flex:0 1 100%;
	}
		#recruitHome .flex .caption > .wpb_wrapper {
			display: flex;
			flex-wrap:wrap;
			justify-content:center;
		}
		#recruitHome .flex .caption .prof {
			flex:0 1 40%;
		}
		#recruitHome .flex .caption .buttonWrap {
			flex:0 1 60%;
		}
		#recruitHome .flex .caption h3,
		#recruitHome .flex .caption h4 {
			width:100%;
			padding-top:1rem;
		}
		#recruitHome .flex .caption h4 {
			font-size: 1.6rem;
			line-height: 1.6;
		}
	#recruitHome .flex .subtitle h3 {
		font-size:2.4rem;
		line-height:1.6;
	}
	#recruitHome .flex .equally .buttonWrap {
		flex:0 1 100%;
	}
	#recruitHome .flex .equally .buttonCube {
		margin-top:20px;
	}
  /*
	.buttonCube {
		margin-top:-25px;
	}
  */
	.recruitStep + .recruitStep {
		margin-top:0;
	}
	.recruitStep > div {
		margin:0 0 10px 0 !important;
	}
	.recruitStep > .direction .dropcap::after {
		position:absolute;
		font-family: FontAwesome;
		content : "\f078";
		margin-top: 0.5rem;
	}
	.recruitStep .pagelink a.mc_button {
		float: none;
		display: block;
		margin: 10px auto 20px;
		padding:1.2rem 0.5rem;
		text-align: center;
		width: 85%;
		font-size: 1.8rem;
	}
	#ourCompany .message {
		padding:2rem;
	}
	#ourCompany .message > div p {
		padding:2rem;
		color: #5f5f5f;
		font-size: 1.6rem;
	}
	#inquiryform .contactDiv h3 {
	text-align:center;
	}


}

@media screen and (max-width: 479px) {
	
	#recruitHome .flex > .vc_column-inner  > .wpb_wrapper {
		align-items: center;
	}
	#recruitHome .flex .subtitle h3 {
		font-size:1.8rem;
		padding-top:0;
	}
		#recruitHome .flex .caption > .wpb_wrapper {
			align-items:flex-start;
		}
		#recruitHome .flex .caption .prof {
			flex:0 1 100%;
			font-size:0;
		}
		#recruitHome .flex .caption .buttonWrap {
			flex:0 1 100%;
		}
		#recruitHome .flex .caption h3 {
			width:40%;
		}
		#recruitHome .flex .caption h4 {
			width:60%;
		}
		#recruitHome .flex .caption h3,
		#recruitHome .flex .caption h4 {
			display:inline-block;
			text-align:center;
			padding-top:1rem;
		}
		#recruitHome .flex .caption h3 {
			font-size:2.5rem;
		}
	.buttonCube {
		margin-top: 25px;
	}
}




/* ------------------------------------
	RECRUIT Recruitment Style
------------------------------------ */

.recruitment h3,
.recruitment h4 {
	line-height:1.6;
}
#accordion-staffinterview h3 {
	color:#cb451b;
	font-size:2.2rem;
}
@media screen and (max-width: 1009px) {
	.ui-tabs-panel .buttonCube p {
	padding:10px 0;
	}
}
@media screen and (max-width: 767px) {
	.ui-tabs-panel .buttonCube {
		margin-top: 10px;
	}
}
@media screen and (max-width: 479px) {
	.recruitment .caption h4 {
		display:inline-block;
	}
	.ui-tabs-panel .buttonCube {
		margin: -25px 0 0 -25px;
	}
}





/* ------------------------------------
	RECRUIT Orientation Style
------------------------------------ */
.orientation *,
.orientation *::before,
.orientation *::after 
{
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

/* ------- Orientation Flex Style  ------- */
.orientation {
	margin-right:auto;
	margin-left:auto;
	margin-bottom: 30px;
}
.orientation dl {
	display:-webkit-box;
	display:-moz-box;
	display:-webkit-flexbox;
	display:-moz-flexbox;
	display:-ms-flexbox;
	display:-webkit-flex;
	display:-moz-flex;
	display:flex;
	-webkit-box-align:stretch;
	-moz-box-align:stretch;
	-ms-flex-align:stretch;
	-webkit-align-items:stretch;
	-moz-align-items:stretch;
	align-items:stretch;
	width: 100%;
	font-size: 1.4rem;
	line-height:1.61;
	margin:0 auto;
	border-right: none;
	border-top: 1px solid #a9a9a9;
	border-left: none;
}
.orientation dl:last-of-type { border-bottom: 1px solid #a9a9a9; }
.orientation dl dt {
	width: 35%;
	background-color: #F6F6F6;;
	margin:0 auto;
	text-align:center;
}
.orientation dl dt h3 {
	color:#555;
	font-size:2rem ;
	padding: 2rem 2rem 0.5rem;
	line-height:1.6;
}
.orientation dl dt p {
	color:#555;
	text-align:center;
	padding-top:0;
	margin:0 20px;
	font-size:1.4rem;
}
.orientation dl dt p span {
	display:inline-block;
	color:#555;
	padding:2px 1rem;
	margin-right:1em;
	background-color:#FEFEFE;
	border: #CCC 1px solid;
	font-size:75%;
}
.orientation dl dd {
	padding: 3rem 1.5rem;
	width: 65%;
	background-color: #FFF;
	margin:0 auto;
	position: relative;
}
.orientation dl dd p {
	text-align:right;
	padding:1rem 20px 1rem 0;
}

.orientation dl dd ul {
	display:table;
	width:100%;
	margin:0;
	padding:0;
}
.orientation dl dd li {
	display:table-cell;
	padding:0;
	vertical-align:middle;
	width:50%;
}
.orientation dl dd.is-disabled::before{
	content: '受付終了しました';
	background: rgba(0,0,0,0.2);
	position: absolute;
	text-align: center;
	font-size:2.5rem;
	color:#FFF;
	text-shadow: 2px 2px 4px #333;
	width:100%;
	height:100%;
	top: 50%;
	left: 50%;
	-ms-transform: translate(-50%,-50%);
	-webkit-transform: translate(-50%,-50%);
	transform: translate(-50%,-50%);
	margin:0;
	padding:3rem 0 0;
}
.orientation dl span {
	display:inline-block;

}
.orientation a {
	font-size:1.6rem;
	display:block;
	border:none;
	color: #FFF;
	text-align:center;
    padding: 1.4rem 0.5rem;
	border-radius:10px;
	margin:0 10px;
}
.orientation a:hover {
	color: #FFF;
}
.orientation svg {
    padding: 0;
    margin: 0 5px 0 0 ;
    width: 30px;
    height: 30px;
    vertical-align: middle;
    fill: #FFF;
}

#inquiryform.orientation #mailform fieldset:last-of-type label,
#inquiryform.business-internship #mailform fieldset:last-of-type label,
#inquiryform.study-internship #mailform fieldset:last-of-type label {
	color:#cb451b;
}

/*.orientation form fieldset:last-of-type label::after {
	content: '※説明会にエントリーの際は、上記日程の中から希望日をご記入ください';
	margin-left:2rem;
	color:#cb451b;
	display:inline-block;
	line-height:1.4;
}*/

/* ------- Flex Div Style add  ------- */
.flbx {
	display:-webkit-box;
	display:-moz-box;
	display:-webkit-flexbox;
	display:-moz-flexbox;
	display:-ms-flexbox;
	display:-webkit-flex;
	display:-moz-flex;
	display:flex;
	-webkit-box-align:stretch;
	-moz-box-align:stretch;
	-ms-flex-align:stretch;
	-webkit-align-items:stretch;
	-moz-align-items:stretch;
	align-items:stretch;
}
.flbx.line-2 {
	flex-wrap: wrap;
	flex-direction: row;

	text-align:center;
	line-height:1.6;
	margin:0 auto;
	/*width:80%;*/
}
.flbx.line-2 > div {
	width:50%;
	border-top: 1px solid #a9a9a9;
	border-bottom: 1px solid #a9a9a9;
	border-right: none;
}
.flbx.line-2 div + div {
	border-left: 1px solid #a9a9a9;
}
.flbx.line-2 div h5 {
	padding:1rem 0;
	font-size: 1.7rem;
	color:#555;
	background-color:#F6F6F6;
	border-bottom: 1px solid #a9a9a9;
}
.flbx.line-2 div p {
	margin:0.5rem 0;
	line-height:1.4;
	text-align:center;
}

.infolist {
	background-color:#FFF;
	padding:0 30px;
	border-radius:20px;
 }
.infolist a {
	border: none;
	color: #3156A3;
	text-decoration: none;
}
.infolist a:hover {
	color: #3156A3;
	border-bottom: 1px solid #3156A3;
}
.infolist .right-wider {
	height: 20em;
	overflow-x: hidden;
	overflow-y: auto;
}

.infolist .right-wider dl {
	margin:0 auto;
	border:none;
	width:100%;
}
.infolist .right-wider dl + dl  {
	border-top: 1px dotted #a9a9a9;
}
.infolist .right-wider .dl-flex dt { background:none;}
	

@media screen and (max-width: 767px) {
	.orientation dl {
		flex-direction: column;
		margin-bottom:10px;
	}
	.orientation dl dt h3 {
		padding: 1rem 0;
		line-height:2;
	}
	.orientation dl dt, .orientation dl dd { width: 100%;}
	.orientation svg {
		width: 20px;
		height: 20px;
	}
	.orientation a {
		margin:10px;
	}
	.orientation dl dd {
		padding-top:1rem;
	}
	.orientation dl dd p {
		text-align:right;
		padding:0.5rem 10px 1rem 0;
	}
	.infolist {
		padding:10px;
		border-radius:5px;
	}
	.infolist .right-wider .dl-flex dt {
		padding: 0.5rem 0 0 1rem;
	}
	.infolist .right-wider .dl-flex dd {
		padding: 0 0 0.5rem 2rem;
	}
}

@media screen and (max-width: 479px) {
	.orientation dl dd ul {
		display:block;
	}
	.orientation dl dd li {
		display:block;
		width:100%;
		margin:20px auto 0;
	}
	.orientation dl dd.is-disabled::before{
		padding:6rem 0 0;
	}
	.orientation form fieldset:last-of-type label::after {
		margin-left:0;
		margin-top:10px;
	}
	.flbx.line-2 {
		width:100%;
		flex-direction: column;
	}
	.flbx.line-2 > div {
		width:100%;
	}
	.flbx.line-2 div + div {
		border-top: none;
		border-left: none;
	}
	.flbx.line-2 div p {
		margin:0.2rem 0;
	}
}



/************************************
  Flex DL Style（元サイト準拠・安全スコープ版）20251025
************************************/

/* 親セクションの基本 */
.dl-wrap section{
  margin: 2rem auto 0;
  width: 100%;
  border-top: 1px dotted #a9a9a9;
  border-bottom: 1px dotted #a9a9a9;
}

/* ===== 安定版：Gridで左右比率を固定（推奨） ===== */
.dl-wrap section .dl-flex{
  display: grid;                 /* ← 安定・簡潔 */
  align-items: stretch;
  width: 100%;
  line-height: 1.6;
  margin: 0 auto;
  border: 1px dotted #a9a9a9;
  border-top: none;
}
.dl-wrap section .dl-flex:first-of-type{ border-top: 1px dotted #a9a9a9; }

/* 左右比率（旧 .right-wider と同義） */
.dl-wrap.flex20 section .dl-flex{ grid-template-columns: 20% 1fr; }
.dl-wrap.flex25 section .dl-flex{ grid-template-columns: 25% 1fr; } /* 旧 right-wider 相当 */
.dl-wrap.flex33 section .dl-flex{ grid-template-columns: 33% 1fr; }
.dl-wrap.flex40 section .dl-flex{ grid-template-columns: 40% 1fr; }
.dl-wrap.flex50 section .dl-flex{ grid-template-columns: 50% 1fr; }

/* セル */
.dl-wrap section .dl-flex > dt,
.dl-wrap section .dl-flex > dd{
  margin: 0;
  padding: 1rem 1.8rem;
  min-height: 100%;
  font-size: inherit;
}
.dl-wrap section .dl-flex > dt{ background:#e3e3e3; color:#333; }
.dl-wrap section .dl-flex > dd{ background:#fff; }

/* リンク体裁とホバー */
.infolist a,
.dl-wrap .dl-flex dd a{
  color: var(--company-link-color, #284a9b);
  text-decoration: none;
  border-bottom: none;
  line-height: 1.5;
  transition: color .2s ease;
}
.infolist a:hover,
.infolist a:focus,
.dl-wrap .dl-flex dd a:hover,
.dl-wrap .dl-flex dd a:focus{
  color: var(--company-link-hover, #f28b00);
  text-decoration: none;
}

/* アイコンを文頭に固定して複数行でも頭を揃える（使用時のみ） */
.dl-wrap .dl-flex dd a{
  position: relative;
  display: inline-block;
  padding-left: 1.8em;   /* ← アイコン幅に合わせて */
}
.dl-wrap .dl-flex dd a .material-symbols-rounded{
  position: absolute;
  left: 0; top: .05em;
  width: 1.4em; text-align: center;
  font-size: 1.2em;
  line-height: 1;
  color: currentColor;
  font-variation-settings: 'FILL' 1,'wght' 400,'GRAD' 0,'opsz' 24;
}

/* スマホは縦積み */
@media (max-width: 767px){
  .dl-wrap section .dl-flex{ grid-template-columns: 1fr; }
}

/* ===== 互換：旧 flex 実装へのフォールバック（Grid非対応ブラウザ想定） ===== */
/*（影響を避けるため .dl-wrap スコープの中だけ）*/
.dl-wrap section .dl-flex{
  display: grid;
}
@supports not (display: grid){
  .dl-wrap section .dl-flex{
    display:flex;
    align-items: stretch;
    border-right: 1px dotted #a9a9a9; /* 旧仕様に寄せる */
    border-left:  1px dotted #a9a9a9;
  }
  .dl-wrap.flex25 section .dl-flex dt{ width:25%; }
  .dl-wrap.flex25 section .dl-flex dd{ width:75%; }
  .dl-wrap.flex33 section .dl-flex dt{ width:33%; }
  .dl-wrap.flex33 section .dl-flex dd{ width:67%; }
  .dl-wrap.flex40 section .dl-flex dt{ width:40%; }
  .dl-wrap.flex40 section .dl-flex dd{ width:60%; }
  .dl-wrap.flex50 section .dl-flex dt,
  .dl-wrap.flex50 section .dl-flex dd{ width:50%; }

  @media (max-width: 767px){
    .dl-wrap section .dl-flex{ flex-direction: column; }
    .dl-wrap section .dl-flex dt,
    .dl-wrap section .dl-flex dd{ width:100%; }
  }
}

/* =====（任意）内側をスクロールボックス化したい場合 ===== */
/* .infolist でボックス化しているなら不要。必要なら親に .scroll-box を付与 */
.dl-wrap.scroll-box section{
  max-height: 320px; overflow-y: auto;
  background:#fff; border-radius:16px; padding:12px 16px;
}
.dl-wrap.scroll-box section::-webkit-scrollbar{ width:6px; }
.dl-wrap.scroll-box section::-webkit-scrollbar-thumb{ background:#ccc; border-radius:3px; }



