@charset "utf-8";



/*------------------------------------------------------------
	index
------------------------------------------------------------*/
/*----FV サイドバナー----*/
.new_info{
position: absolute;
top: 500px;
left: auto;
right: 0;
z-index: 999;
background: #fff;
padding: 15px;
}
.new_info a{
font-size: 14px;
line-height: 160%;
}
.new_info a p:after{
content: "≫";
color: #FF886C;
font-weight: bold;
margin-left: 3px;
}
.new_info a p span{
color: #FF886C;
font-weight: bold;
}

/*----FV サイドバナーオレンジ----*/
.new_info_orange{
position: fixed;
bottom: 28%;
left: auto;
right: 0;
z-index: 999;
background: #EF8201;
padding:5px 10px;
text-align: center;
}
.new_info_orange h3{
text-align: center;
font-size: 20px;
margin: 0px auto;
}
.new_info_orange p{
text-align: center;
font-size: 13px;
margin: 0px auto;
}
.new_info_orange a{
width: 100%;
text-align: center;
font-size: 14px;
color: #FFF198;
font-weight: bold;
line-height: 160%;
}
.new_info_orange a:hover{
color: #FFFFFF;
}

/*----FV サイドバナーホワイト----*/
.new_info_white{
position: fixed;
bottom: 15%;
left: auto;
right: 0;
z-index: 999;
background: #fff;
text-align: center;
width: 190px;
}
.new_info_white h3{
text-align: center;
font-size: 1rem;
margin: 0px auto;
}
.new_info_white p{
text-align: center;
font-size: 14px;
margin: 0px auto;
}
.new_info_white a{
display: block;
padding: 15px 23px;
text-align: center;
font-size: 16px;
color: #EF8201;
font-weight: bold;
line-height: 160%;
}
.new_info_white a:hover{
color: #FCDC7C;
}


.mainVisual {
margin-top: -10px;
	margin-bottom: 44px;
	position: relative;
	color: #fff;
	height: 662px;
}
.mainVisual .imgList {
	position: absolute;
	left: 0;
	top: 0;
	height: 662px;
	width: 100%;
}

.mainVisual_sp {
display: none;
}


.backstretch img {
	-webkit-transition: -webkit-transform 7s linear;
	transition: transform 7s linear;
	-webkit-transform: scale(1.1);
	transform: scale(1.1);
}
.backstretch .active {
	-webkit-transform: scale(1);
	transform: scale(1);
}
.mainFoo {
	position: absolute;
	bottom: 20px;
	left: 0;
	width: 100%;
	text-align: right;
}
.mainFoo .dots {
	padding-right: 40px;
}
.mainFoo .dots li {
	margin: 0 10px;
	display: inline-block;
	width: 12px;
	height: 12px;
	border-radius: 50%;
	background-color: #000;
	opacity: 0.5;
	cursor: pointer;
}
.mainFoo .dots li.active {
	background-color: #FF8C6C;
	opacity: 1;
}
.mainVisual .content {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 662px;
}
.mainVisual .content .infoBox {
	width: 1086px;
	margin: 0 auto;
	height: 662px;
	position: relative;
}
.mainVisual .content h2 {
	position: absolute;
	left: 0;
	bottom: 79px;
	font-size: 5.7rem;
	font-weight: 400;
	letter-spacing: 0.3em;
	line-height: 1.4;
    font-family: 'Roboto Condensed', sans-serif;
}
.mainVisual .content .scroll {
	position: absolute;
	right: -2px;
	bottom: 24px;
	height: 136px;
	-webkit-writing-mode : tb-rl;
	-webkit-writing-mode: vertical-rl;
	writing-mode: tb-rl;
	writing-mode: vertical-rl;
	direction: ltr; 
}
.mainVisual .content .scroll a {
	position: relative;
	color: #fff;
	font-size: 1.1rem;
	display: block;
	letter-spacing: 0.15em;
}
.mainVisual .content .scroll a:before {
	position: absolute;
	right: -5px;
	top: 0;
	bottom: 0;
	width: 1px;
	background: #fff;
	content: "";
}
.mainVisual .content .scroll a:hover {
    opacity: 0.7;
}
.mainVisual .content .txt {
	position: absolute;
	right: 93px;
	bottom: 89px;
	height: 430px;
	font-size: 2.5rem;
	font-weight: 700;
	-webkit-writing-mode : tb-rl;
	-webkit-writing-mode: vertical-rl;
	writing-mode: tb-rl;
	writing-mode: vertical-rl;
	direction: ltr;
	letter-spacing: 0.3em;
}


/*------------------------------------------------------------
	recruit
------------------------------------------------------------*/
#container {
	background: #F8F6E9;
    overflow: hidden;
}
.pageTitle { 
	margin-bottom: 57px;
	background: #F8F6E9;
	position: relative;
}
.pageTitle .about_list{
position: absolute;
right: 0;
top: 100px;
}
.pageTitle .about_list li{
margin: 0px 0px 10px 0px;
padding: 0;
width: 160px;
}
.pageTitle .about_list li a{
background: #fff;
font-size: 14px;
color: #E69D65;
background: #fff;
padding: 5px 10px;
border-radius: 20px;
display: block;
text-align: left;
}
.pageTitle .about_list li a::after{
content: "∨";
color: #E69D65;
position:absolute;
right: 5%;
}

#main .content01 {
	margin: 0 auto;
	padding: 0;
	width: 1134px;
	color: #4D5057;
	letter-spacing: 0.05em;
}

#main .content {
	width: 1134px;
}
#main .comNavi li {
	margin: 15px 29px 0;
}
#main .application {
	margin-bottom: 110px;
}
#main .headLine02 {
    margin: 80px auto 20px auto;
    color: #222;
	font-weight: bold;
}
#main .headLine02 .en {
    color: #E79C66;
}
#main .topText {
	margin-bottom: 97px;
	line-height: 2.2;
	text-align: center;
}
#main .tit {
	padding-bottom: 6px;
	font-size: 2.4rem;
	text-align: center;
	letter-spacing: 0.05em;
}
#main .tit01,
#main .tit01_2 {
	color: #E69D65;
}
#main .tit02 {
	padding-top: 81px;
}
#main .title {
	margin-top: 15px;
	font-size: 2rem;
	text-align: left;
	background-color: #ededed;
	border-radius: 5px;
}
#main .title:first-child {
	margin-top: 0;
}
#main .title p {
	cursor: pointer;
	padding: 26px 50px 26px;
	position: relative;
}
#main .title p::before {
	margin-top: -11px;
	width: 24px;
	height: 24px;
	display: block;
	position: absolute;
	top: 49%;
	right: 35px;
	background: url("../img/recruit/icon03.png") no-repeat left top;
	background-size: 24px 24px; 
	content: "";
}
#main .title p.on::before {
	background: url("../img/recruit/icon04.png");
	background-size: 24px 24px;
}
#main .color01 {
background: #fff;
border: 0px solid #FF8A6E;
color: #FF8A6E;
}
#main .detailBox {
	display: none;
	padding-top: 38px;
	margin-bottom: 30px;
	background: #fff;
	padding: 30px;
	border-radius: 0px 0px 5px 5px;
}
#main .detailBox p{

}

#main .detailBox01 {
	margin-bottom: 110px;
}
#main .detailBox table {
	margin: 0 auto;
	width: 740px;
	border-collapse: collapse;
}
#main .detailBox .tableA {
	margin-bottom: 65px;
}
#main .detailBox th,
#main .detailBox td {
	padding-bottom: 30px;
	line-height: 2;
	text-align: left;
	vertical-align: top;
}
#main .detailBox table tr:last-of-type th,
#main .detailBox table tr:last-of-type td {
	padding-bottom: 0;
}
#main .detailBox th {
	width: 24.3%;
}
#main .detailBox .note {
	padding-left: 1em;
	text-indent: -1em;
}
#main .detailBox .txtList dt {
	float: left;
}
#main .detailBox .txtList dd {
	padding-left: 3.1em;
}
#main .textList li {
	padding-left: 1em;
	text-indent: -1em;
}
#main .textList a {
	color: #4D5057;
}
#main .textList a:hover {
	text-decoration: underline;
}
#main .detailBox .txtDl {
	margin: 0 auto;
	padding-left: 16px;
	width: 612px;
	border-left: 2px solid #CFCFD1;
	box-sizing: border-box;
}
#main .detailBox .txtDl dt {
	margin-bottom: 9px;
	font-weight: 700;
	line-height: 1;
}
#main .detailBox .txtDl dt:first-of-type {
	margin-bottom: 38px;
}
#main .detailBox .txtDl dd {
	margin-bottom: 36px;
	line-height: 2;
}
#main .detailBox .txtDl dd:last-of-type {
	margin-bottom: 0;
}
#main .detailBox .txtList .txtUl {
	margin-left: 46px;
}
#main .detailBox .TxtUl li {
	padding-left: 1.1em;
	text-indent: -1.1em;
}
#main .detailBox .txtList01 dd {
	padding-left: 4.5em;
}
#main .detailBox .text {
	margin: 0 auto 66px;
	width: 820px;
	line-height: 2.17;
}
#main .traning {
	margin-bottom: 105px;
}
#main .traning table {
	margin-bottom: 20px;
	width: 910px;
	border-collapse: collapse;
	background: #fff;
	border: 1px solid #E69D65;
}
#main .traning table span{
	font-size: 12px;
    display: inline-block;
    padding: 4% 0 0 4%;
    text-indent: -4%;
    text-align: left;
}
#main .traning .table_memo{
	margin-bottom: 60px;
}
#main .traning th,
#main .traning td {
	padding: 23px 20px 27px;
	font-weight: 400;
	text-align: center;
	vertical-align: top;
	box-sizing: border-box;
}
#main .traning td.text_left{
	text-align:left!important;
}
#main .traning th {
	width: 12.5%;
	border-bottom: 1px solid #E69D65;
	border-left: 1px solid #E69D65;
}
#main .traning th:first-of-type {
	border-left: none;
}
#main .traning table tr:last-of-type th {
	border-bottom: none;
}
#main .traning table tr:first-of-type th {
	padding-top: 5px;
}
#main .traning td {
	width: 46%;
	border-top: 1px solid #E69D65;
	border-left: 1px solid #E69D65;
}
#main .traning .timeBox {
	margin: 0 auto 115px;
	width: 802px;
	padding-right: 32px;
}
#main .traning .rightTxt {
	margin-bottom: 10px;
	text-align: right;
}
#main .traning .timeBox li {
	margin-bottom: 13px;
	height: 125px;
	display: flex;
	position: relative;
	align-items: center;
	line-height: 1.7;
	border: 1px solid #E69D66;
}
#main .traning .timeBox li::after {
	width: 3px;
	height: 13px;
	position: absolute;
	bottom: -14px;
	left: 50px;
	background-color: #F7CDAB;
	content: "";
}
#main .traning .timeBox li:last-of-type {
	margin-bottom: 0;
}
#main .traning .timeBox li:last-of-type::after {
	width: 0;
	content: "";
}
#main .traning .timeBox li .txtBox {
	padding-right: 22px;
	width: 280px;
	height: 125px;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	color: #FFF;
	background: url("../img/recruit/icon02.png") no-repeat;
	background-size: 100% 100%;
	box-sizing: border-box;
}
#main .traning .timeBox li .time {
	width: 145px;
	height: 125px;
	display: flex;
	justify-content: center;
	align-items: center;
	background: url("../img/recruit/icon01.png") no-repeat center right;
	background-size: 22px 100%;
}
#main .traning .timeBox li .name {
	width: 160px;
}
#main .traning .timeBox .txt {
	padding: 0 0 0 22px;
	box-sizing: border-box;
	width: calc(100% - 305px);
}
#main .traning .comBtn a {
	width: 450px;
	color: #FFF;
	font-size: 1.7rem;
	font-weight: 400;
	letter-spacing: 0.15em;
	background-color: #E69D65;
	background-position: right 25px center;
    background-size: 14px 22px;
}
#main .traning .comBtn a:hover {
	background-image: url("../img/common/icon05.png");
	opacity: 0.6;
}

#main .content01 h2{
font-size: 30px;
color: #333;
text-align: center;
margin: 50px auto 50px auto;
}
#main .content01 h2 span{
font-size: 15px;
color: #FF8A6E;
}

#main .top_text{
text-align: center;
line-height: 200%;
font-size: 15px;
}
#main .qol_img01{
width: 500px;
margin: 20px auto 30px auto;
}

#main .content01 h3.top_catche{
font-size: 24px;
color: #333;
text-align: center;
margin: 50px auto 0px auto;
position: relative;
  display: inline-block;
  padding: 0 30%;
}
#main .content01 h3.top_catche:before, #main .content01 h3.top_catche:after {
  content: '';
  position: absolute;
  top: 50%;
  display: inline-block;
  width: 26%;
  height: 1px;
  background-color: #FF8A6E;
}
#main .content01 h3.top_catche:before {
  left:0;
}
#main .content01 h3.top_catche:after {
  right: 0;
}
#main .content01 .plus_list{
margin: 30px auto 50px auto;
display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
 flex-wrap: wrap;
 border-bottom: 1px solid #FF8A6E;
 padding: 0px 0px 10px 0px;
 }
#main .content01 .plus_list li{
width: 48%;
font-size: 14px;
display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin: 0px 0px 10px 0px;
}
#main .content01 .plus_list li .img{
width: 40%;
margin: 0px 20px 0px 0px;
}
#main .content01 h4{
font-size: 20px;
text-align: center;
margin: 10px auto 20px auto;
line-height: 200%;
}

#main .content02{
margin: 120px auto 80px auto;
	width:100%;
	color: #4D5057;
	letter-spacing: 0.05em;
	position: relative;
    overflow: hidden;
}
#main .content02 .about_cap{
width: 45%;
overflow: hidden;
}
#main .content02 h2{
font-size: 30px;
color: #333;
text-align: left;
margin: 50px auto 50px auto;
}
#main .content02 h2 span{
font-size: 15px;
color: #FF8A6E;
}
#main .content02 .about_cap h3{
margin: 0px 0px 20px 0px;
font-size: 20px;
text-align: left;
}
#main .content02 .about_cap p{
font-size: 14px;
text-align: left;
line-height: 200%;
}
#main .content02 .about_list{
width: 48%;
position: absolute;
right: 0;
top: 0;
margin-bottom:0px;
}
#main .content02 .about_list li{
width: 100%;
height: auto;
aspect-ratio: 3 / 1;
margin: 0px 0px 1px 0px;
}
#main .content02 .more_btn{
margin: 50px auto;
}
#main .content02 .more_btn a{
border-radius: 10px;
background: #FF8A6E url("/recruit_demo/img/common/arrow04.png") 94% center no-repeat;
background-size: 20px;
margin: 0px;
padding: 20px;
color: #fff;
text-align: center;
display: block;
}
#main .content02 .more_btn a:hover{
background: #484848 url("/recruit_demo/img/common/arrow04.png") 94% center no-repeat;
background-size: 20px;
}

#main .content02_02{
margin: 0px auto 120px auto;
	width:100%;
	color: #4D5057;
	letter-spacing: 0.05em;
	position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: row-reverse;
}
#main .content02_02 .content{
position: relative;
min-height: 500px;
}
#main .content02_02 .content .about_cap{
width: 45%;
right: 0;
top: 0;
float: right;
position: relative;
}
#main .content02_02 h2{
font-size: 30px;
color: #333;
text-align: left;
margin: 0px auto 50px auto;
}
#main .content02_02 h2 span{
font-size: 15px;
color: #FF8A6E;
}
#main .content02_02 .about_cap h3{
margin: 0px 0px 20px 0px;
font-size: 20px;
text-align: left;
}
#main .content02_02 .about_cap p{
font-size: 14px;
text-align: left;
line-height: 200%;
}

#main .content02_02 .about_list{
width: 48%;
margin: 0px 0px;
position: absolute;
left: 0;
top: 0;
margin-bottom:0px;
}
#main .content02_02 .about_list li{
width: 100%;
height: auto;
/*aspect-ratio: 3 / 1;*/
margin: 0px 0px 1px 0px;
}
#main .content02_02 .more_btn{
margin: 50px auto;
}
#main .content02_02 .more_btn a{
border-radius: 10px;
background: #FF8A6E url("/recruit_demo/img/common/arrow04.png") 94% center no-repeat;
background-size: 20px;
margin: 0px;
padding: 20px;
color: #fff;
text-align: center;
display: block;
}
#main .content02_02 .more_btn a:hover{
background: #484848 url("/recruit_demo/img/common/arrow04.png") 94% center no-repeat;
background-size: 20px;
}


#main .content03{
margin: 0px auto 50px auto;
padding: 0;
	width:1134px;
	color: #4D5057;
	letter-spacing: 0.05em;
	position: relative;
}
#main .content03 h2{
font-size: 30px;
color: #333;
text-align: left;
margin: 0px 50px 50px 0px;
float: left;
}
#main .content03 h2 span{
font-size: 15px;
color: #FF8A6E;
}
#main .content03 .interview_text{
font-size: 15px;
line-height: 200%;
margin: 50px 0px 0px 0px;
padding: 0;
position: relative;
}
#main .interview_list {
display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
 flex-wrap: wrap;
 margin-bottom: 30px;
 width: 100%;
}
#main .interviewInfo {
margin: 0px auto 50px auto;
}
#main .interviewInfo a {
    position: relative;
    display: block;
    height: 500px;
}
#main .interviewInfo a:hover {
    opacity: 0.7;
}
#main .interviewInfo:last-child {
    margin-bottom: 0;
}
#main .interviewInfo .ttl {
    position: absolute;
    left: 0;
    top: 92px;
    letter-spacing: 0.05em;
}
#main .interviewInfo .ttl01 {
    top: 115px; 
}
#main .interviewInfo .ttl02 {
    top: 130px; 
}
#main .interviewInfo .ttl span {
    margin-bottom: 4px;
    padding: 4px 8px;
	color: #4d5057;
    display: inline-block;
    font-size: 2.43rem;
    font-weight: 700;
    background: rgba(255,255,255,0.9);
}
#main .interviewInfo .detSpan {
    padding: 12px 25px 12px 23px;
    position: absolute;
    left: 0;
	color: #333;
    bottom: 0;
    font-size: 1.5rem;
    background: rgba(255,255,255,0.9);
	letter-spacing: 0.05em;
	text-align: left;
}
#main .interviewInfo .detSpan .name {
    font-size: 1.8rem;
	color:#FF7857;
}
#main .interviewInfo .detSpan .name .info {
    font-size: 1.38rem;
    display: inline-block;
    margin-left: 6px;
}
#main .interviewInfo01 {
    margin-bottom: 190px;
}

#main .interviewInfo01 .ttl {
    top: 220px;
    left: 0;
}

#main .interview_more_btn{
margin: 50px auto 80px auto;
width: 40%;
}
#main .interview_more_btn a{
border-radius: 10px;
background: #FF8A6E url("/recruit_demo/img/common/arrow04.png") 94% center no-repeat;
background-size: 20px;
margin: 0px;
padding: 20px;
color: #fff;
text-align: center;
display: block;
}
#main .interview_more_btn a:hover{
background: #484848 url("/recruit_demo/img/common/arrow04.png") 94% center no-repeat;
background-size: 20px;
}

/*------------カルーセル-------------*/
.swiper{
   margin: 0px auto;
   padding: 0;
   width: 100%;
   height: 500px;
}
 .swiper-slide {
width: 100%;
   height: 500px;
   overflow: hidden;
   padding: 0em;
 }
 
 .swiper-slide img {
   position: absolute;
   left: 0;
   top: 0;
   width: 100%;
   height: 100%;
   object-fit: cover;
 }
 
 .swiper-slide .texts {
   min-width: 40%;
   max-width: 600px;
   padding: 1.5em 3em;
   background-color: rgba(0, 0, 0, 0.3);
   backdrop-filter: blur(3px);
   color: #fff;
   overflow: hidden;
 }
 
 .swiper-slide .title {
   font-size: 2.5rem;
   margin: 0;
 }


#main .content04{
margin: 0px auto;
width:100%;
background: rgba(60,54,49,0.1);
	letter-spacing: 0.05em;
	position: relative;
	overflow: hidden;
}
#main .content04 h2{
font-size: 30px;
color: #333;
text-align: center;
margin: 50px auto 50px auto;
}
#main .content04 h2 span{
font-size: 15px;
color: #FF8A6E;
}

@keyframes tabAnim{
  0%{opacity:0;}
  100%{opacity:1;}
}
#main .content04 .tab_wrap{
width:100%;
margin:50px auto 100px auto;
}
#main .content04 input[type="radio"]{display:none;}
#main .content04 .tab_area{font-size:0; margin:0 10px;}
#main .content04 .tab_area label{
width:30%;
margin:0 1.5% 10px 1.5%;
display:inline-block;
padding:15px 0;
border-radius: 30px;
color:#FF8A6E;
background:#fff;
text-align:center;
font-size:16px;
cursor:pointer;
transition:ease 0.2s opacity;
}
#main .content04 .tab_area label:hover{
}
#main .content04 .tab_panel{width:100%; opacity:0; padding:20px 0; display:none;}
#main .content04 .tab_panel p{}
#main .content04 .panel_area{ margin: 0px auto 100px auto;
}
#tab1:checked ~ .tab_area .tab1_label{background:#3C3631; color:#fff;}
#tab1:checked ~ .panel_area #panel1{display:block; animation:tabAnim ease 0.6s forwards; -ms-animation:tabAnim ease 0.6s forwards;}
#tab2:checked ~ .tab_area .tab2_label{background:#3C3631; color:#fff;}
#tab2:checked ~ .panel_area #panel2{display:block; animation:tabAnim ease 0.6s forwards; -ms-animation:tabAnim ease 0.6s forwards;}
#tab3:checked ~ .tab_area .tab3_label{background:#3C3631; color:#fff;}
#tab3:checked ~ .panel_area #panel3{display:block; animation:tabAnim ease 0.6s forwards; -ms-animation:tabAnim ease 0.6s forwards;}


#main .content05{
margin: 0px auto;
width:100%;
background: url("/recruit_demo/img/index/main_img01_bg.jpg");
background-size: cover;
	letter-spacing: 0.05em;
	position: relative;
}
#main .content05 .filter{
height: 100%;
width: 100%;
margin: 0 auto;
padding: 50px 0;
background: rgba(105,79,73,0.9);
}
#main .content05 h2{
font-size: 30px;
color: #fff;
text-align: left;
margin: 0px 50px 50px 0px;
float: left;
}
#main .content05 h2 span{
font-size: 15px;
color: #FF8A6E;
}
#main .content05 p{
font-size: 15px;
line-height: 200%;
margin: 0px 0px 0px 0px;
padding: 0;
color: #fff;
position: relative;
top: 50px;
}
#main .content05 .recruit_list{
width: 100%;
margin: 30px auto 100px auto;
padding: 0;
display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  position: relative;
}
#main .content05 .recruit_list li{
width: 49%;
margin: 0px 0px 20px 0px;
}
#main .content05 .recruit_list li.full{
width: 100%;
margin: 0px 0px 20px 0px;
text-align: center;
}
#main .content05 .recruit_list li a{
display: block;
background: #fff url("/recruit_demo/img/common/arrow.png") 94% center no-repeat;
background-size: 25px;
border-radius: 10px;
padding: 25px;
font-size: 24px;
font-weight: bold;
line-height: 100%;
color: #FF8A6E;
}
#main .content05 .recruit_list li a span{
font-size: 16px;
color: #ccc;
}
#main .content05 .recruit_list li a:hover{
opacity: 0.5;
}

.foot_sns{
width: 140px;
margin: 10px 0px 10px auto;
display: flex;
padding: 0;
}
.foot_sns li{
width: 30px;
margin: 0px 5px;
padding: 0;
}
.foot_sns li img{
width: 100%;
}





@media all and (max-width: 896px) {

/*------------------------------------------------------------
	index
------------------------------------------------------------*/
.new_info{
position: absolute;
top: auto;
left: auto;
right: 0;
bottom: 0;
z-index: 999;
background: #fff;
padding: 5px;
}
.new_info a{
font-size: 12px;
line-height: 160%;
}
.new_info a p:after{
content: "≫";
color: #FF886C;
font-weight: bold;
margin-left: 3px;
}
.new_info a p span{
color: #FF886C;
font-weight: bold;
}

/*----FV サイドバナーオレンジ----*/
.new_info_orange{
position: fixed;
bottom: 0%;
left: auto;
right: 0;
width: 50%;
z-index: 999;
background: #EF8201;
padding:0px 0px 9px 0px;
text-align: center;
}
.new_info_orange h3{
text-align: center;
font-size: 14px;
margin: 3px auto 0 auto;
}
.new_info_orange p{
text-align: center;
font-size: 11px;
line-height: 120%;
margin: 0px auto 0px auto;
}
.new_info_orange a{
width: 100%;
text-align: center;
font-size: 12px;
color: #FFF198;
font-weight: bold;
line-height: 160%;
}
.new_info_orange a:hover{
color: #FFFFFF;
}

/*----FV サイドバナーホワイト----*/
.new_info_white{
position: fixed;
bottom: 0%;
left: 0;
z-index: 999;
background: #fff;
text-align: center;
width: 50%;
}
.new_info_white a{
display: block;
padding: 16px 0;
text-align: center;
font-size: 17px;
color: #EF8201;
font-weight: bold;
line-height: 140%;
}
.new_info_white a:hover{
color: #FCDC7C;
}


.mainVisual {
margin-top: 35px;
	margin-bottom: 44px;
	position: relative;
	color: #fff;
	height: 60vh;
	overflow: hidden;
}
.mainVisual .imgList {
	position: absolute;
	left: 0;
	top: 0;
	height: 30vh;
	width: 100%;
display: none;
}
.mainVisual .dots{
display: none;
}

.mainVisual_sp {
display: block;
background: url("/recruit/img/recruit/slide01_sp.jpg") center no-repeat;
background-size: cover;
height: 60vh;
width: 100%;
overflow: hidden;
position: relative;
}

.backstretch img {
width: 100%;
	-webkit-transition: -webkit-transform 7s linear;
	transition: transform 7s linear;
	-webkit-transform: scale(1.0);
	transform: scale(1.0);
}
.backstretch .active {
	-webkit-transform: scale(0.9);
	transform: scale(0.9);
}
.mainFoo {
	position: absolute;
	bottom: 20px;
	left: 0;
	width: 100%;
	text-align: right;
}
.mainFoo .dots {
width: 100%;
margin: 0px auto;
	padding-right: 50px;
}
.mainFoo .dots li {
	margin: 0 10px;
	display: inline-block;
	width: 12px;
	height: 12px;
	border-radius: 50%;
	background-color: #000;
	opacity: 0.5;
	cursor: pointer;
}
.mainFoo .dots li.active {
	background-color: #FF8C6C;
	opacity: 1;
}
.mainVisual .content {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 30vh;
	overflow: hidden;
}
.mainVisual .content .infoBox {
	width: 1086px;
	margin: 0 auto;
	height: 30vh;
	position: relative;
}
.mainVisual .content h2 {
	position: absolute;
	left: 0;
	bottom: 79px;
	font-size: 5.7rem;
	font-weight: 400;
	letter-spacing: 0.3em;
	line-height: 1.4;
    font-family: 'Roboto Condensed', sans-serif;
}

#container {
	background: #F8F6E9;
    overflow: hidden;
}
.pageTitle { 
	margin-bottom: 57px;
	background: #F8F6E9;
	position: relative;
	width: 90%;
	height: auto;
	margin: 0px auto;
}
.pageTitle h2 {
        font-size: 1.5rem;
		margin: 0px;
}
.pageTitle .about_list{
width: 90%;
margin: 20px auto;
padding: 0;
position: relative;
top: 30px;
overflow: hidden;
}
.pageTitle .about_list li{
margin: 0px 0px 10px 0px;
padding: 0;
width: auto;
}
.pageTitle .about_list li a{
background: #fff;
font-size: 16px;
color: #E69D65;
background: #fff;
padding: 5px 10px;
border-radius: 20px;
display: block;
text-align: left;
width: 92%;
}
.pageTitle .about_list li a::after{
content: "∨";
color: #E69D65;
position:absolute;
right: 5%;
}
#main .content01 {
	margin: 0 auto;
	padding: 0;
	width:100%;
	color: #4D5057;
	letter-spacing: 0.05em;
}

#main .content {
width:90%;
margin: 0 auto;
}
#main .content01 h2{
font-size: 20px;
color: #333;
text-align: center;
margin: 50px auto 50px auto;
width: 90%;
}
#main .content01 h2 span{
font-size: 15px;
color: #FF8A6E;
}

#main .top_text{
text-align: center;
line-height: 160%;
font-size: 14px;
}
#main .qol_img01{
width: 90%;
margin: 20px auto 30px auto;
}

#main .content01 h3.top_catche{
font-size: 20px;
color: #333;
text-align: center;
margin: 50px auto 0px auto;
position: relative;
  display: inline-block;
  padding: 0 24%;
}
#main .content01 h3.top_catche:before, #main .content01 h3.top_catche:after {
  content: '';
  position: absolute;
  top: 50%;
  display: inline-block;
  width: 16%;
  height: 1px;
  background-color: #FF8A6E;
}
#main .content01 h3.top_catche:before {
  left:0;
}
#main .content01 h3.top_catche:after {
  right: 0;
}
#main .content01 .plus_list{
margin: 30px auto 50px auto;
display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
 flex-wrap: wrap;
 border-bottom: 1px solid #FF8A6E;
 padding: 0px 0px 10px 0px;
 width: 90%;
 }
#main .content01 .plus_list li{
width: 90%;
font-size: 16px;
  margin: 0px auto 20px auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
 flex-wrap: wrap;
 justify-content: center;
  text-align: center;
}
#main .content01 .plus_list li .img{
width: 100%;
margin: 0px auto 0px auto;
}
#main .content01 h4{
font-size: 16px;
text-align: center;
margin: 10px auto 20px auto;
line-height: 160%;
}

#main .content02{
margin: 50px auto;
	width:100%;
	min-height: 660px;
	color: #4D5057;
	letter-spacing: 0.05em;
	position: relative;
	overflow: hidden;
}
#main .content02_02{
margin: 50px auto;
	width:100%;
    min-height: 660px;
	min-height: auto;
	color: #4D5057;
	letter-spacing: 0.05em;
	position: relative;
	overflow: hidden;
    flex-wrap: wrap;
    flex-direction: row;
}
#main .content02_02 .content{
min-height: auto;
}
#main .content02 .about_cap,
#main .content02_02 .about_cap,
#main .content02_02 .content .about_cap{
width: 100%;
position: relative;
overflow: hidden;
margin: 0px auto;
padding: 0;
}
#main .content02 h2,
#main .content02_02 h2{
font-size: 20px;
color: #333;
text-align: center;
margin: 0px auto 20px auto;
}
#main .content02 h2 span,
#main .content02_02 h2 span{
font-size: 15px;
color: #FF8A6E;
}
#main .content02 .about_cap h3,
#main .content02_02 .about_cap h3{
margin: 0px 0px 20px 0px;
font-size: 16px;
text-align: left;
}
#main .content02 .about_cap p,
#main .content02_02 .about_cap p{
font-size: 14px;
text-align: center;
line-height: 200%;
}
#main .content02 .more_btn,
#main .content02_02 .more_btn{
margin: 20px auto;
width: 90%;
}
#main .content02 .more_btn a,
#main .content02_02 .more_btn a{
border-radius: 10px;
background: #FF8A6E url("/recruit_demo/img/common/arrow04.png") 94% center no-repeat;
background-size: 20px;
margin: 0px;
padding: 20px;
color: #fff;
text-align: center;
display: block;
}
#main .content02 .more_btn a:hover{
background: #484848 url("/recruit_demo/img/common/arrow04.png") 94% center no-repeat;
background-size: 20px;
}
#main .content02 .about_list,
#main .content02_02 .about_list{
width: 100%;
position: relative;
right: 0;
top: 0;
margin-bottom:0px;
}
#main .content02 .about_list li,
#main .content02_02 .about_list li{
width: 100%;
height: 50%;
margin: 0px 0px 1px 0px;
padding: 0;
overflow: hidden;
}
#main .content02 .about_list li img,
#main .content02_02 .about_list li img{
width: 100%;
}


#main .content03{
margin: 0px auto 50px auto;
padding: 0;
	width: 90%;
	color: #4D5057;
	letter-spacing: 0.05em;
	position: relative;
	overflow: hidden;
}
#main .content03 h2{
font-size: 20px;
color: #333;
text-align: center;
margin: 0px auto 20px auto;
width: 100%;
}
#main .content03 h2 span{
font-size: 15px;
color: #FF8A6E;
}
#main .content03 .interview_text{
font-size: 14px;
line-height: 160%;
margin: 20px 0px 0px 0px;
padding: 0;
position: relative;
text-align: center;
}
#main .scroll {
 margin: 0px auto 50px auto;
 width: 100%;
/*overflow-x: scroll;*/
}
#main .scroll .interview_list {
 margin: 0px 0px 0px 0px;
 width: 1000px;
 display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
#main .interviewInfo {
width: 100%;
height: auto;
margin: 0px 0px 0px 0px;
}
#main .interviewInfo a {
    position: relative;
    display: block;
    height: 420px;
}
#main .interviewInfo a:hover {
    opacity: 0.7;
}
#main .interviewInfo:last-child {
    margin-bottom: 0;
}
#main .interviewInfo .ttl {
    position: absolute;
    left: 0;
    top: 92px;
    letter-spacing: 0.05em;
}
#main .interviewInfo .ttl01 {
    top: 115px; 
}
#main .interviewInfo .ttl02 {
    top: 130px; 
}
#main .interviewInfo .ttl span {
    margin-bottom: 4px;
    padding: 4px 8px;
	color: #4d5057;
    display: inline-block;
    font-size: 2.43rem;
    font-weight: 700;
    background: rgba(255,255,255,0.9);
}
#main .interviewInfo .detSpan {
    padding: 12px 25px 12px 23px;
    position: absolute;
    left: 0;
	color: #333;
    bottom: 0;
    font-size: 1.5rem;
    background: rgba(255,255,255,0.9);
	letter-spacing: 0.05em;
	text-align: left;
}
#main .interviewInfo .detSpan .name {
    font-size: 1.8rem;
	color:#FF7857;
}
#main .interviewInfo .detSpan .name .info {
    font-size: 1.38rem;
    display: inline-block;
    margin-left: 6px;
}
#main .interviewInfo01 {
    margin-bottom: 190px;
}

#main .interviewInfo01 .ttl {
    top: 220px;
    left: 0;
}

.swiper{
   margin: 0px auto;
   padding: 0;
   width: 100%;
   height: 420px;
}

#main .interview_more_btn{
margin: 50px auto 80px auto;
width: 80%;
}

#main .content04{
margin: 0px auto;
width:100%;
background: rgba(60,54,49,0.1);
	letter-spacing: 0.05em;
	position: relative;
	overflow: hidden;
}
#main .content04 h2{
font-size: 20px;
color: #333;
text-align: center;
margin: 50px auto 50px auto;
width: 90%;
}
#main .content04 h2 span{
font-size: 15px;
color: #FF8A6E;
}
#main .title {
	margin-top: 15px;
	font-size: 1.5rem;
	text-align: left;
	background-color: #ededed;
	border-radius: 5px;
}
#main .title:first-child {
	margin-top: 0;
}
#main .title p {
	cursor: pointer;
	padding: 16px 15px 50px 15px;
	position: relative;
}
#main .title p::before {
	width: 14px;
	height: 14px;
	display: block;
	position: absolute;
	top: 80%;
	right: 50%;
	background: url("../img/recruit/icon03.png") no-repeat center bottom;
	background-size: 14px 14px; 
	content: "";
}
#main .title p.on::before {
	background: url("../img/recruit/icon04.png");
	background-size: 14px 14px;
}
@keyframes tabAnim{
  0%{opacity:0;}
  100%{opacity:1;}
}
#main .content04 .tab_wrap{
width:100%;
margin:50px auto 100px auto;
}
#main .content04 input[type="radio"]{display:none;}
#main .content04 .tab_area{font-size:0; margin:0 10px;}
#main .content04 .tab_area label{
width:100%;
margin:0 auto 10px auto;
display:inline-block;
padding:10px 0;
border-radius: 30px;
color:#FF8A6E;
background:#fff;
text-align:center;
font-size:16px;
cursor:pointer;
transition:ease 0.2s opacity;
}
#main .content04 .tab_area label:hover{
}
#main .content04 .tab_panel{width:100%; opacity:0; padding:20px 0; display:none;}
#main .content04 .tab_panel p{}
#main .content04 .panel_area{ margin: 0px auto 50px auto;
}
#tab1:checked ~ .tab_area .tab1_label{background:#3C3631; color:#fff;}
#tab1:checked ~ .panel_area #panel1{display:block; animation:tabAnim ease 0.6s forwards; -ms-animation:tabAnim ease 0.6s forwards;}
#tab2:checked ~ .tab_area .tab2_label{background:#3C3631; color:#fff;}
#tab2:checked ~ .panel_area #panel2{display:block; animation:tabAnim ease 0.6s forwards; -ms-animation:tabAnim ease 0.6s forwards;}
#tab3:checked ~ .tab_area .tab3_label{background:#3C3631; color:#fff;}
#tab3:checked ~ .panel_area #panel3{display:block; animation:tabAnim ease 0.6s forwards; -ms-animation:tabAnim ease 0.6s forwards;}


#main .content05{
margin: 0px auto;
width:100%;
background: url("/recruit_demo/img/index/main_img01_bg.jpg") center;
background-size: cover;
	letter-spacing: 0.05em;
	position: relative;
}
#main .content05 .filter{
height: 100%;
width: 100%;
margin: 0 auto;
padding: 20px 0;
background: rgba(105,79,73,0.9);
overflow: hidden;
position: relative;
}
#main .content05 h2{
font-size: 20px;
color: #fff;
text-align: left;
margin: 0px auto 0px auto;
padding: 0;
width: 100%;
}
#main .content05 h2 span{
font-size: 15px;
color: #FF8A6E;
}
#main .content05 p{
font-size: 14px;
line-height: 160%;
margin: 0px auto 70px auto;
padding: 0;
color: #fff;
width: 100%;
}
#main .content05 .recruit_list{
width:100%;
margin: 50px auto 50px auto;
padding: 0;
display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  position: relative;
}
#main .content05 .recruit_list li{
width: 100%;
margin: 0px 0px 20px 0px;
padding: 0;
}
#main .content05 .recruit_list li.full{
width: 100%;
margin: 0px 0px 20px 0px;
text-align: left;
}
#main .content05 .recruit_list li a{
display: block;
background: #fff url("/recruit_demo/img/common/arrow.png") 96% center no-repeat;
background-size: 15px;
border-radius: 10px;
padding: 15px;
font-size: 15px;
font-weight: bold;
line-height: 100%;
color: #FF8A6E;
}
#main .content05 .recruit_list li a span{
font-size: 12px;
color: #ccc;
}
#main .content05 .recruit_list li a:hover{
opacity: 0.5;
}

}


/*------------------------------------------------------------
	新卒フッター
------------------------------------------------------------*/
.foot_link_box{
width: 100%;
margin: 0px auto;
position: relative;
}
.foot_link_box .white_ft{
text-align: center;
   color: hsla(0,0%,100%,0.10);
   font-size: 107px;
   font-family: 'Roboto Condensed', sans-serif;
   line-height: 160%;
   position: absolute;
   top: 70px;
   left: 15%;
   z-index: 1;
}
.foot_link_box .box04 a{
display: block;
width: 100%;
height: 100%;
z-index: 10;
position: relative;
display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
   text-align: center;
}
.foot_link_box a{
cursor: pointer;
display: block;
color: #fff;
}
.foot_link_box a:hover{
opacity: 0.8;
}
.foot_link_box .box04{
width: 100%;
height: auto;
background: #F4F5F0;
display: block;
clear: both;
display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  align-items: center;
  justify-content: center;
}
.foot_link_box .box04 dl{
margin: 60px 0px 60px 0px;
}
.foot_link_box .box04 dl dt{
margin: 0px auto;
padding: 0px;
   text-align: center;
   color: #FF8A6E;
   font-size: 7rem;
   font-family: 'Roboto Condensed', sans-serif;
   line-height: 120%;
}
.foot_link_box .box04 dl dd{
margin: 0px auto;
padding: 0;
   text-align: center;
   color: #000;
   font-size:2rem;
}
.foot_link_box .box04 .contact_arrow{
width: 80px;
}
.foot_link_box .box04 .contact_arrow a{
cursor: pointer;
display: block;
}
.foot_link_box .box04 .contact_arrow a:hover{
opacity: 0.8;
cursor: pointer;
}


@media all and (max-width: 896px) {
.foot_link_box .white_ft{
display: none;
}
.foot_link_box .box04 .contact_arrow{
position: absolute;
z-index: 10;
right: 5%;
top: 30px;
width: 40px;
height: 40px;
}
.foot_link_box .box04{
width: 100%;
height:100px;
 position: relative;
}
.foot_link_box .box04 dl{
margin: 0px auto 0px 10px;
}
.foot_link_box .box04 dl dt{
margin: 0px auto;
padding: 0px;
   text-align: left;
   color: #FF8A6E;
   font-size: 24px;
   font-family: 'Roboto Condensed', sans-serif;
   line-height: 160%;
}
.foot_link_box .box04 dl dd{
margin: 0px auto;
padding: 0;
   text-align: left;
   color: #000;
   font-size:15px;
}
.foot_link_box .box04 .contact_arrow a{
cursor: pointer;
display: block;
}
.foot_link_box .box04 .contact_arrow a:hover{
opacity: 0.8;
cursor: pointer;
}

.foot_sns{
width: 140px;
margin: 10px auto 20px auto;
display: flex;
padding: 0;
}


}