@charset "utf-8";

/*RECRUITスタイル*/
body#recruit { background-size:auto auto; background-repeat:repeat; background-position:top left; background-blend-mode:multiply;
	background-image: url(../img/common/bg_noise.png), -webkit-linear-gradient(bottom, #00a5b9, #00a5b9); background-image: url(../img/common/bg_noise.png),  -moz-linear-gradient(bottom, #00a5b9, #00a5b9);
	background-image: url(../img/common/bg_noise.png), -o-linear-gradient(bottom, #00a5b9, #00a5b9);
	background-image: url(../img/common/bg_noise.png), linear-gradient(to bottom, #00a5b9, #00a5b9); }
	
	body#recruit #header.nav-down { background-size:auto auto; background-repeat:repeat; background-position:top left; background-blend-mode:multiply;
	background-image: url(../img/common/bg_noise.png), -webkit-linear-gradient(bottom, #00a5b9, #00a5b9); background-image: url(../img/common/bg_noise.png),  -moz-linear-gradient(bottom, #00a5b9, #00a5b9);
	background-image: url(../img/common/bg_noise.png), -o-linear-gradient(bottom, #00a5b9, #00a5b9);
	background-image: url(../img/common/bg_noise.png), linear-gradient(to bottom, #00a5b9, #00a5b9); }
	
	@supports (-ms-ime-align: auto) { /* Edge */
		body#recruit { background-image:url(../img/common/bg_noise_ie.png),linear-gradient(to bottom, #00a5b9, #00a5b9); background-blend-mode:normal; }
		body#recruit #header.nav-down { background-image:none; background:url(../img/common/bg_header2.png) repeat top left; background-blend-mode: normal!important; }
	}
	@media all and (-ms-high-contrast: none){ /* IE */
		body#recruit { background-image:url(../img/common/bg_noise_ie.png),linear-gradient(to bottom, #00a5b9, #00a5b9); background-blend-mode:normal; }
		body#recruit #header.nav-down { background-image:none; background:url(../img/common/bg_header2.png) repeat top left; background-blend-mode: normal!important; }
	}


.btn_yellow { min-width:290px; background:#d2c91f; color:#fff; border-radius:30px; border:3px solid #d2c91f; display:inline-block; text-align:center; padding:10px 50px; position:relative; font-size:18px; line-height:1.5; transition:0.3s; }
.btn_yellow:hover { color:#d2c91f; background:#fff; }

.btn_orange { min-width:290px; background:#e9af00; color:#fff; border-radius:30px; border:3px solid #e9af00; display:inline-block; text-align:center; padding:10px 60px; position:relative; font-size:18px; line-height:1.5; transition 0.3s; }
.btn_orange:hover { color:#e9af00; background:#fff; }

.btn_yellow span, .btn_orange span { font-size:12px; position:relative; top:-2px; left:3px; }
.bg_lightblue { background:#eaf2f5; }



.recruit_menu_box { margin-top:8%;  position:relative; }
	.recruit_menu_box:after { content:""; position:absolute; bottom:0; left:0; width:100%; height:auto; padding-top:15%; background:url(../img/recruit/bg_recruit_menu_box.png) no-repeat bottom center / 100% auto; }
	
	/*.recruit_menu_box:before { content:""; position:absolute; z-index:1; top:70px; right:10%; width:40px; height:42px; background:url(../img/recruit/ico_airplane.png) no-repeat left center / contain; opacity:0; transform:rotate(185deg) translateY(-15px) translateX(15px); transition:0.3s ease-out 1.5s; }
	.recruit_menu_box.isActive:before { opacity:1; transform:rotate(185deg) translateY(0px) translateX(0px); right:0; }*/
	
.recruit_menu_box_left { width:100%; position:relative; z-index:1; margin:0 auto; text-align:center; }
.recruit_menu_box_right { width:40%; }
.recruit_menu_box_left img { margin-left:-10px; }
.recruit_menu_box_right img { position:relative; right:-10px; }


	@media print, screen and (min-width:768px) {
		.recruit_menu { width:490px; margin:30px auto 0px; overflow:hidden; display:flex; justify-content:space-between; font-size:16px; }
		.recruit_menu li a { position:relative; padding-top:43px; display:block; color:#009bb4; line-height:1.5; }
		.recruit_menu li a:hover { color:#b8ab01; }
		.recruit_menu li a:after { content:""; position:absolute; top:0; left:-5px; width:75px; height:2px; background:#009bb4; transform:rotate(-60deg); }
		.recruit_menu li a:before { display: block; content: ""; width:50px; height:3px; position:absolute; z-index:10; top:17px; left:2px; background: #b8ab01; transform: rotate(-63deg) rotatey(90deg); transform-origin:20px 0px; transition: 0.4s; }
		.recruit_menu li:hover a:before { transform:rotate(-60deg) rotatey(0deg); }
		.recruit_menu li:hover a { color:#b8ab01; }
		.recruit_menu li br { display:none; }
		
		.recruit_menu .recruit_menu_on a { color:#b8ab01; }
		.recruit_menu .recruit_menu_on a:after { background:#b8ab01; }
	}


#subNav { position:relative; overflow:hidden; }
#subNav:after { content:""; position:absolute; bottom:0; right:calc(50% - 47%); z-index:-1; width:100%; min-height:214px; background:url(../img/recruit/bg_subNav.png) no-repeat right 100% / auto 100%; }
.subNav_inner_box { max-width:1200px; margin:0 auto; }

#subNav .recruit_menu { width:auto; max-width:600px; margin:30px 0 0; display:flex; justify-content:space-between; font-size:16px; }
#subNav .recruit_menu li a { color:#fff; padding:0 0 43px 50px; /**/ position:relative; display:block; line-height:1.5; }
#subNav .recruit_menu li a:hover { color:#d9d021; }
#subNav .recruit_menu li a:after { background:#fff; top:35px; left:-10px; /**/ content:""; position:absolute; width:75px; height:2px; transform:rotate(-60deg); }
#subNav .recruit_menu li a:before { background: #d9d021; top:50px; left:-2px; width:75px; /**/ display: block; content: ""; height:3px; position:absolute; z-index:10; transform: rotate(-63deg) rotatey(90deg); transform-origin:20px 0px; transition: 0.4s; }
#subNav .recruit_menu li:hover a:before { transform:rotate(-60deg) rotatey(0deg); }
#subNav .recruit_menu li:hover a { color:#d9d021; }

#subNav .recruit_menu .recruit_menu_on a { color:#d9d021; }
#subNav .recruit_menu .recruit_menu_on a:after { background:#d9d021; }

.recruit_page_title { font-size:35px; padding:30px; line-height:1.5; }


/* INDEX
--------------------------------------------------*/
.main_wrapper {  position:relative; margin-top:-100px; }
.main_wrapper:after { content:""; position:absolute; z-index:2; /*bottom:-400px;*/ left:0; width:100%; height:400px; background:url(../img/recruit/bg_footer_btm.png) no-repeat bottom center; background-size:auto auto; }
#main { padding-bottom:10%; position:relative; bottom:-50px; z-index:5; }
.main_box { max-width:1200px; margin:0 auto; position:relative; }
.main_box_inner { width:41.6%; /*position:absolute;*/ position:relative; z-index:3; left:6%; top:150px; }
	.main_box_inner.isActive .recruit_box_title:after { opacity:1; transform: translateY(0px); }
.main_box_inner p { padding-left:10px; }
.main_title_box { /*max-width:1200px;*/ max-width:1040px; margin:0 auto; position:relative; top:140px; /*padding-left:5.5%;*/ }

.recruit_index .content_inner_box { margin-top:400px; }

.recruit_index_title { font-size:22px; }
.recruit_index_title span { line-height:1.0; margin-bottom:10px; }
.recruit_box_title { margin-bottom:20px; }

/*.photo_box { position:relative; left:calc(50% - 33%); top:-70px; padding-bottom:67%; max-width:1280px; z-index:-1; margin: 0 auto; }
.photo_box_bg { position:absolute; top:0; left:0; z-index:0; }
.photo_box_pic { position:absolute; z-index:1; top:0; left:28.4%; margin-top:5.8%; width:50.93%; }
.photo_box_pic img { position:absolute; z-index:1; }
.photo_box_pic img.active { z-index:3; }*/

.page_top { padding-top:0px; }

.message_top { text-align:center; }
.message_top h4 { font-size:22px; margin:40px 0; }
.message_top p { line-height:2; }

.interview_top { padding-bottom:150px; }
.interview_top_inner{ text-align:center; background:url(../img/recruit/bg_interview_top.png) no-repeat top left / 100% auto; position:relative; padding:50px 0 0; }
.interview_top_inner:after{ content:""; position:absolute; bottom:-70px; left:0; width:100%; height:70px; background:url(../img/recruit/bg_interview_btm.png) no-repeat bottom left / 100% auto; }

.interview_top_inner:before { content:""; position:absolute; z-index:1; top:73px; left:77.5%; width:40px; height:42px; background:url(../img/recruit/ico_airplane.png) no-repeat left center / contain; opacity:0; transform:rotate(-45deg) translateY(-15px) translateX(15px); transition:0.3s ease-out 1s; }
	.interview_top.isActive .interview_top_inner:before { opacity:1; transform:rotate(-45deg) translateY(0px) translateX(0px); top:78px; left:76.0%; }

.interview_top_panel img { display:block; }

.asd_people_top { text-align:center; }
.widget_wrap { margin:40px 0 8%; }

.asd_occupation_top { text-align:center; }
.subTitle_occupation { text-align:center; position:relative; margin:5% 0 6%; }
.subTitle_occupation:after { content:""; position:absolute; bottom:0; left:calc(50% - 270px); width:539px; height:60px; background-repeat:no-repeat; background-position:bottom left; }
.type01 { color:#d9d021; }
.type02 { color:#e9af00; }
.subTitle_occupation.type01:after { background-image:url(../img/recruit/bg_title_yellow.png?ver_20191203); }
.subTitle_occupation.type02:after { background-image:url(../img/recruit/bg_title_orange.png?ver_20191203); }
.subTitle_occupation h4 { font-size:33px; line-height:1.5; position:relative; top:20px; z-index:2; margin-bottom:50px; }
.subTitle_occupation h4:after { content:""; display:inline-block; position:absolute; z-index:-1; bottom:0; left:calc(50% - 2.5em); background:#fff; width:5em; height:1em; }

.subTitle_occupation:before { content:""; display:inline-block; position:absolute; z-index:-1; bottom:25px; right:calc(50% - 272px); background:#fff; width:46px; height:28px; opacity:0; transform:translateY(20px) translateX(-30px); transition:0.3s ease-out 1s; }
.subTitle_occupation.type01:before { background:url(../img/recruit/ico_title_yellow.png) no-repeat top center / contain; }
.subTitle_occupation.type02:before { background:url(../img/recruit/ico_title_orange.png) no-repeat top center / contain; bottom:35px; right:calc(50% - 270px); }
	.asd_occupation_top.isActive .subTitle_occupation.type01:before,
	.asd_occupation_top.isActive .subTitle_occupation.type02:before { opacity:1; transform:translateY(0px) translateX(0px); }
	.asd_occupation_top.isActive .subTitle_occupation.type02:before { transition-delay:1.5s; }

.occupation_box01 { position:relative; background:url(../img/recruit/occupation_box01_top.png) no-repeat top left / 100% auto; padding:20px 30px 20px; text-align:center; }
.occupation_box01:after { content:""; position:absolute; bottom:0; left:0; width:100%; height:10px; background:url(../img/recruit/occupation_box01_btm.png) no-repeat bottom left / 100% auto; }

.recruit_index .occupation_list_new { margin-bottom:8%; }
.recruit_index .occupation_list_new li { width:31%; position:relative; background-image:url(../img/recruit/occupation_box_top.png); background-repeat:no-repeat; background-position:top left; background-size:100% auto; text-align:left; }
.recruit_index .occupation_list_new li:after { content:""; position:absolute; width:100%; bottom:0; left:0; height:60%; z-index:0; background-image:url(../img/recruit/occupation_box_btm.png); background-repeat:no-repeat; background-position:bottom left; background-size:100% auto; }
.recruit_index .occupation_list_new a { color:#454545; position:relative; z-index:10; display:block; padding:45px 30px 20px; text-align:center; }
.recruit_index .oc_row { text-align:left; font-size:15px; border-bottom:1px dotted #9d9606; padding:0 0 10px 40px; margin-bottom:10px; }
.recruit_index .oc_row .label { font-size:12px; margin-bottom:; display:block; color:#9d9606; }
.recruit_index .occupation_list_place { background:url(../img/recruit/ico_place.png) no-repeat 0 5px; }
.recruit_index .occupation_list_status { background:url(../img/recruit/ico_man.png) no-repeat 10px 5px; }

.occupation_list { margin-bottom:8%; flex-wrap:wrap; }
.occupation_list li { width:31%; position:relative; background-image:url(../img/recruit/occupation_box02_top.png), url(../img/recruit/occupation_box02_mid.png); background-repeat:no-repeat, repeat-y; background-position:top left, bottom left; background-size:100% 48px, 100% auto; text-align:left; }
.occupation_list li:after { content:""; position:absolute; width:100%; bottom:-28px; left:0; height:30px; z-index:0; background-image:url(../img/recruit/occupation_box02_btm.png); background-repeat:no-repeat; background-position:bottom left; background-size:100% auto; }
.occupation_list::after{ content:""; display:block; width:31%; }

.occupation_list a { color:#cfa01f; position:relative; z-index:10; display:block; padding:5px 30px 20px; text-align:center; }
.occupation_list a:after { content:""; right:15px; bottom:25px; border: solid transparent; height:0; width:0; position:absolute; pointer-events:none; border-top:7px solid transparent; border-bottom:7px solid transparent; border-left:7px solid #e9af00; }

.occupation_list_title { font-size:20px; color:#454545; margin-bottom:20px; }
.occupation_list_type { font-size:20px; line-height:1.25; word-wrap:break-word; }
.occupation_list_new .occupation_list_type { font-size:24px; color:#454545; background:url(../img/recruit/bg_barcode.png) repeat-x bottom center / auto; padding-bottom:20px; position:relative; margin-bottom:20px;  }
.occupation_list_new .occupation_list_type span { color:#9d9606; }
.occupation_list_new .occupation_list_type:after { content:""; right:-15px; bottom:25px; border: solid transparent; height:0; width:0; position:absolute; pointer-events:none; border-top:7px solid transparent; border-bottom:7px solid transparent; border-left:7px solid #454545; }


	/* slideIn */
	.main_box_inner .recruit_box_title { opacity:0.25; transform:translate(0, 50px); transition:0.5s ease-out; }
	.main_box_inner p { opacity:0.15; transform:translate(0, 50px); transition:0.5s ease-out; transition-delay:0.25s; }
	.main_box_btn { opacity:0; transform:translate(0, 50px); transition:0.5s ease-out; transition-delay:0.5s; }
	.main_box_inner.isActive .recruit_box_title,
	.main_box_inner.isActive p,
	.main_box_inner.isActive .main_box_btn { opacity:1; transform:translate(0, 0); }
	
	#container .content { opacity: 0.25; transform: translate(0, 100px); }
	#container .content.isActive { opacity:1; transform: translate(0, 0); }
	


	@media print, screen and (min-width:1367px) {
		#main { padding-bottom:0; }
		/*.photo_box { padding-bottom:900px; }*/
	}
	
	@media print, screen and (max-width:1366px) {
		#main {  padding-bottom:0%; }
	}
	
	@media print, screen and (max-width:1200px) {
		.main_title_box { margin-left:5.5%; }
	}

	@media print, screen and (max-width:1240px) {
		#subNav:after { width:50%; background-size:85% auto; opacity:0.8; }
		.recruit_menu_box { padding-top:6%; }
		.recruit_menu_box:after { bottom:auto; top:0; }
		/*.recruit_menu_box:before { top:11.5%; }*/
	}


	@media print, screen and (max-width:1024px) {
		/*.main_box_inner { width:100%; }
		.photo_box { max-width: 80%; position: relative; left: calc(50% - 28%); top: -70px; padding-bottom: 67%; z-index: -1; margin: 0 auto; }*/
		
		.main_wrapper { padding-top:0%; /*padding-bottom:45%;*/ }
		.main_box_inner { margin-top:90%; width:90%; left:5%; top:auto; }
		/*.photo_box { max-width:100%; left:5%; top:-20px; }*/
		.main_box_btn { text-align:center; }
		.main_box_inner br.onlyPc { display:none!important; }
		
		.interview_top_inner:before { top:10%; left:76.5%; }
		.interview_top.isActive .interview_top_inner:before { top:10%; left:74.5%; }
		
		.occupation_list a { padding:5px 30px 20px; }
		
		.recruit_menu_box { margin-top:100px; }
		.recruit_menu_box:after { bottom:5px; top:auto; background-position:right bottom; background-size:130% auto; padding-top:20%; }
		.recruit_menu_box_left { width:70%; margin:0; }
		.recruit_menu_box_right img { right: -20px; top:-80px; }
		.recruit_menu { width:430px; }
		/*.recruit_menu_box:before { top:100px; }*/
		
		
	}
	
	@media print, screen and (max-width:850px) {
		.occupation_list_new,
		.occupation_list { flex-wrap:wrap; width:100%; margin:0px auto 30px; }
		.occupation_list_new li,
		.occupation_list li { width:100%; }
		.recruit_index .occupation_list_new li { width:100%; }
		.recruit_index .occupation_list_new a { padding: 10% 20px 20px; }
		.occupation_list_new li { margin-bottom:20px; }
		.occupation_list_new .occupation_list_type:after { right:0; }
		.occupation_list li { margin-bottom:50px; }
	}
	
	
	@media print, screen and (max-width:767px) {
		.bgWh_inner_box { padding: 5% 0; }
	
		.main_wrapper { padding-top:20%; }
		.recruit_box_title { width:calc(100% + 35px); }
		
		.message_top .recruit_index_title img { padding:0 0px; }
		.message_top h4, .message_top p { text-align:left; }
		.message_top h4 { margin:20px 0; line-height:1.5; }
		.message_top p { font-size:16px; line-height:1.8; }
		.interview_top { margin-right:-20px; padding-bottom:40%; }
		.interview_top .recruit_index_title img { padding:0 50px 0 30px; }
		.interview_top .btn_blue_back { padding-right:30px; padding-left:30px; }
		.interview_top_inner:before { left:75.0%; }
		.interview_top.isActive .interview_top_inner:before { left:74%; }
		
		.widget_wrap { margin:20px 0 10%; }
		.media-list-item { width:50%!important; }

		.recruit_index_title img { padding:0 20px; }
		
		.occupation_list a { padding:10px 30px 20px; }
		.occupation_list_new .occupation_list_type { font-size:22px; }
		.occupation_list_new .occupation_list_type:after { right:0px; }
		.subTitle_occupation:after { left:0; width:100%; background-position:bottom center; background-size:100% auto; }
		.subTitle_occupation h4 { font-size:28px; top:15px; }
		.subTitle_occupation:before { right:0; bottom:70%; }
		.subTitle_occupation.type02:before { right:5px; bottom:95%; }
		
		
		.occupation_box01 { margin-top:0px; margin-bottom:30px; padding:20px; }
		.recruit_menu_box { flex-wrap:wrap;  }
		.recruit_menu_box:after { background:none; padding-top:0; }
		.recruit_menu_box_left { width:100%; order:2; text-align:center; }
		.recruit_menu_box_right { text-align:center; width:100%; }
		.recruit_menu_box_right img { top:0px; right:auto; left:-5px; width:60%; }
		.recruit_menu { width:100%; }
		
		#container .recruit_menu { display:flex; justify-content:center; flex-wrap:wrap; }
		#container .recruit_menu li { width:auto; padding:8px 20px; text-align:left; }
		#container .recruit_menu a { position:relative; padding-left:15px; color:#0090bf; margin-left:-1em; text-indent:1em; }
		#container .recruit_menu a:before { content:""; left:2px; top:3px; border:solid transparent; height:0; width:0; position:absolute; pointer-events:none; width:0; height:0; border-top:5px solid transparent; border-bottom:5px solid transparent; border-left:5px solid #0090bf; }
		
		
		/*.recruit_menu li { margin:0 10px 0 0;  font-size:2.2vw; }*/
		.recruit_menu_box_left:after { display:none; }
		
		#container.recruit_page { margin-top:0; }
		
		
		#subNav { padding-top:18%; }
		#subNav:after { /*display:none;*/ width:100%; background-size:60% auto; opacity:0.25; right:6%; }
		.subNav_inner_box img { margin-left:-10px; }
		#subNav .recruit_menu { display:none; }
		/*#subNav .recruit_menu { position:relative; top:24px; margin:0 10px 0 0; font-size:14px; }*/
	}
	
	
	@media print, screen and (max-width:600px) {
		.subTitle_occupation:before { bottom:45%; width:9%; height:auto; padding-top:5%; }
		.subTitle_occupation.type02:before { right:0; bottom:55%; }
		
		/*#subNav .recruit_menu { font-size:2.7vw; }*/
    }
    
	
	@media print, screen and (max-width:450px) {
		.interview_top .recruit_index_title span { font-size:14px;  margin-bottom:0px; }
		.interview_top_inner:before { top:7%; left:74.0%; width:30px; height:32px; }
		.interview_top.isActive .interview_top_inner:before {  top:7%; left:72.0%; }
		
		.subTitle_occupation h4 { font-size:24px; }
		#subNav { padding-top:100px; }
		.recruit_menu li br { display:block; }
		
		/*#subNav .recruit_menu { left:-10px; }
		#subNav .recruit_menu li a { margin-right:-10px; }*/
		
	}
	
	
/* OCCUPATION
--------------------------------------------------*/

.occupation_list_new_col { width:100%; background-image:url(../img/recruit/img_box_new_top.png), url(../img/recruit/img_box_new_mid.png); background-repeat:no-repeat, repeat-y; background-position:top left; background-size:100% auto; margin:20px 0px 50px; position:relative; }
	.mid_career .occupation_list_new_col { background-image:url(../img/recruit/img_box_career_top.png), url(../img/recruit/img_box_career_mid.png); }

.occupation_list_new_col:after { content:""; position:absolute; bottom:0; width:100%; height:22px; background:url(../img/recruit/img_box_new_btm.png?ver_20191206) no-repeat bottom left / 100% auto;}

/*.occupation_list_new_col:after { content:"新卒"; position:absolute; top:15px; right:30px; width:50px; height:50px; z-index:1; background:#dad023; color:#fff; border-radius:50%; line-height:50px; text-align:center; }
	.mid_career .occupation_list_new_col:after { content:"中途"; background:#e9af00; }*/

.occupation_list_new_excerpt { color:#454545; position:relative; z-index:10; /*display:block;*/ padding:45px 50px 25px; text-align:left; /*display:flex; justify-content:space-between;     align-items:center;*/ }
.occupation_list_new_col .oc_row { text-align:left; font-size:15px; border-bottom:1px dotted #c4bb10; padding:0 0 10px 40px; margin-bottom:10px; }
.occupation_list_new_col .label { font-size:12px; display:block; color:#9d9606; }
	.mid_career .occupation_list_new_col .label { color:#e9af00; }
	.mid_career .occupation_list_new_col .oc_row { border-bottom:1px dotted #e9af00; }
	
.occupation_list_new_col .occupation_list_type { display:flex; justify-content:flex-start; align-items:baseline; padding:20px 0; /*padding:20px 0%; width:45%; margin-bottom:0px; font-size:30px;*/ }
.occupation_list_new_col .occupation_list_type:after { display:none; }
.occupation_list_new_col .occupation_list_type span { padding-left:2px; position:absolute; top:0px; }


.occupation_list_new_col .occupation_list_place { background:url(../img/recruit/ico_place.png) no-repeat 0 5px; }
.occupation_list_new_col .occupation_list_status { background:url(../img/recruit/ico_man.png) no-repeat 10px 5px; }
	.mid_career .occupation_list_new_col .occupation_list_place { background:url(../img/recruit/ico_place2.png) no-repeat 0 5px; }
	.mid_career .occupation_list_new_col .occupation_list_status { background:url(../img/recruit/ico_man2.png) no-repeat 10px 5px; }


	.occupation_list_new.mid_career .occupation_list_type span { color:#e9af00; }

.click_more { /*position:relative; left:0; width:100%; height:54px;  background:url(../img/recruit/img_box_new_btm.png) no-repeat top left / 100% 100%; color:#454545;*/ text-align:center; font-size:15px; cursor:pointer; width:150px; height:40px; line-height:40px; background:#d9d021; color:#fff; border-radius:30px; position:absolute; top:15px; right:50px; z-index:10; }
.click_more:after { content:""; right:calc(50% - 60px); bottom:15px; border:solid transparent; height:0; width:0; position:absolute; pointer-events:none; border-width:8px 8px 0 8px;
border-color:#fff transparent transparent transparent; }
	.mid_career .click_more:after { border-color:#fff transparent transparent transparent; }
	.mid_career .click_more { /*background-image:url(../img/recruit/img_box_career_btm.png);*/ background:#e9af00; }
	
	.click_more:before { content:"詳しく見る"; position:absolute; top:0; left:-7px; color:#fff; text-align:center; width:100%; }
	.open.click_more:before { content:"閉じる"; }
	.open.click_more { position:absolute; bottom:0px; }
	.open.click_more:after { border-width:0 10px 10px 10px; border-color:transparent transparent #fff transparent; }
		.mid_career .open.click_more:after { border-color:transparent transparent #fff transparent; }
	
.occupation_list_new_inner { display:none; padding-bottom:50px; /*background-image:url(../img/recruit/img_box_new_btm.png); background-repeat:no-repeat; background-position:bottom left; background-size:100% auto;*/ }

.oc_detail { padding:0px 50px 0; }
.oc_detail_list { border-bottom:1px dotted #c4bb10; padding:10px 0; }
	.mid_career .oc_detail_list { border-bottom:1px dotted #e9af00; }
.oc_detail_list span { display:block; }


.entryBtn { text-align:center; width:100%; }


	@media print, screen and (min-width:1025px) {
		.occupation_list_new_excerpt { display:flex; justify-content:space-between; align-items:center;  padding:55px 50px 25px; }
		.occupation_list_new_col .occupation_list_type { width:45%; margin-bottom:0px; font-size:26px; }
		
		.occupation_list_new_col .occupation_list_summary { display:flex; justify-content:space-between; width:48%; padding-top:20px; }
		.occupation_list_new_col .occupation_list_summary > div { }

		.occupation_list_new_col .occupation_list_place { width:60%; }
		.occupation_list_new_col .occupation_list_status { width:38%; }
		
		.mid_career .occupation_list_new_col .occupation_list_place { width:38%; }
		.mid_career .occupation_list_new_col .occupation_list_status { width:60%; }

		.oc_detail { display:flex; justify-content:space-between; flex-wrap:wrap; }
		.oc_detail_list { width:48%; word-wrap:break-word; }
	}
	
	
	@media print, screen and (max-width:1024px) {
		.click_more { /*top:5%;*/ }
	}
	
	
	@media print, screen and (max-width:767px) {
		.recruit_page_title { font-size:28px; }
		.recruit_page .occupation_list_new { margin:0px auto 30px;  width:100%; }
		.occupation_list_new_col { margin:0 0 50px; }
		.occupation_list_new_excerpt { padding:7% 20px 10px; }
		.oc_detail { padding: 0px 20px 0; }
		.occupation_list_new_col .btn_yellow,
		.occupation_list_new_col .btn_orange { min-width:auto; padding:7px 30px; font-size:16px; }
		.occupation_list_new_col .occupation_list_type span { font-size:12px; }
		.shopIndexTitle { padding:10px 0 5px; }
		.click_more { top:35px; right:20px;/* position:relative; top:0;*/ }
		
	}
	
	
	@media print, screen and (max-width:500px) {
		.click_more { top:20px; left:calc(50% - 75px); position:relative; }
		.open.click_more { position:relative; }
		.oc_detail { margin-top:30px; }
		.occupation_list_new_col { margin:0 0 75px; }
	}
	
	
	
	
/* INTERVIEW
--------------------------------------------------*/

.interviewBox { display:flex; justify-content:space-between; align-items:center; border-bottom:1px dotted #00a5b9; }
.w_100 { margin-left:calc((100% - 1200px) / 2); margin-right:calc((100% - 1200px) / 2); }
.bg_staff { background-repeat:no-repeat; background-position:bottom right; min-height:415px; margin-bottom:50px; }
	.bg_staff01 { background-image:url(../img/recruit/staffstory/img_interview01_top.png); }
	.bg_staff02 { background-image:url(../img/recruit/staffstory/img_interview02_top.png);  }
	.bg_staff03 { background-image:url(../img/recruit/staffstory/img_interview03_top.png); }
	.bg_staff04 { background-image:url(../img/recruit/staffstory/img_interview04_top.png); min-height:454px; }

.interviewBox_text { width:50%; position:relative; left:calc(50% - 40%); }
.interviewBox_lead { font-size:25px; line-height:1.5; }
.interviewBox_excerpt { max-width:290px; }
.interviewBox_pic { display:none; width:53.58%; }
.initial { font-size:20px; border-bottom:1px dotted #00a5b9; padding-bottom:10px; margin:15px 0 20px; }

.jobType { display:flex; justify-content:space-between; font-size:15px; color:#00a5b9; margin:10px 0 30px; }
.jobType li { width:50%; position:relative; padding-left:55px; line-height:43px; }
.jobType li:before { content:""; position:absolute; top:0; left:0; width:43px; height:43px; background-repeat:no-repeat; background-position:top center; }
	.jobType li.shop_staff:before { background-image:url(../img/recruit/staffstory/ico_type01.png); }
	.jobType li.serving_customers:before { background-image:url(../img/recruit/staffstory/ico_type02.png); }

.interview_btn { font-size:15px; display:block; color:#fff; border:2px solid #00a5b9; background:#00a5b9; border-radius:30px; text-align:center; margin-bottom:10px; padding:5px 30px; }
.interview_btn:hover { background:#fff; color:#00a5b9; }

.interviewBox_btm .interview_btn { display:none; }

.interviewBox:nth-of-type(even).bg_staff { min-height:454px; background-position:50px bottom; }
.interviewBox:nth-of-type(even) .interviewBox_text { left:calc(50% - 8%); text-align:right; }
.interviewBox:nth-of-type(even) .interviewBox_excerpt { margin-left:auto; } 
.interviewBox:nth-of-type(even) .jobType li { padding-left:55px; text-align:left; }


/* page */
.interview_mainBox { background-repeat:no-repeat; background-position:top center; background-size:cover; min-height:645px; margin-left:calc((100% - 100vw) / 2); margin-right:calc((100% - 100vw) / 2); display:flex; align-items:center; }
		.bg_staff01_main { background-image:url(../img/recruit/staffstory/img_interview01_main.jpg); }
		.bg_staff02_main { background-image:url(../img/recruit/staffstory/img_interview02_main.jpg); }
		.bg_staff03_main { background-image:url(../img/recruit/staffstory/img_interview03_main.jpg); }
		.bg_staff04_main { background-image:url(../img/recruit/staffstory/img_interview04_main.jpg); }


.interview_mainBox .interviewBox_text .medel { font-size:22px; font-weight:600; }
.interview_mainBox .interviewBox_lead { font-size:30px; }
.interview_mainBox .interviewBox_excerpt { margin-bottom:0; }
.interview_mainBox .jobType { color:#454545; font-weight:600; margin-bottom:0; }
.initial { border:none; color:#454545; }

.interviewBox_story { display:flex; justify-content:space-between; font-size:18px; margin:30px 0 80px; }
.interviewBox_story_pic { width:41.7%; }
.interviewBox_story_text { width:50%; }
.wide .interviewBox_story_text { width:100%; }
.reverse .interviewBox_story_pic { order:1; }
.reverse .interviewBox_story_text { order:2; }
.story_headline { font-size:24px; line-height:1.5; border-bottom:1px dotted #66c5d6; padding-bottom:10px; margin-bottom:25px; position:relative; }
.story_headline:after { content:""; position:absolute; bottom:-13px; right:200px; width:12px; height:37px; background:url(../img/common/ico_back.png) no-repeat bottom left / contain; transform:rotate(90deg) scaleX(-1); opacity:0; transition:right 1s; }
.interviewBox_story_w100 { margin-bottom:80px; }
	.isActive .story_headline:after { opacity:1; right:10px; }



	@media print, screen and (max-width:1200px) {
		.interviewBox_text { left:calc(50% - 45%); }
		.interview_mainBox { min-height:auto; padding:15% 5%; }
		.interview_mainBox .interviewBox_lead br { display:none; }
	}
	
	@media print, screen and (max-width:1100px) {
		.bg_staff { padding-bottom:100px; background-size:550px auto; }
		.interviewBox:nth-of-type(even).bg_staff { background-position:left bottom; }
		.bg_staff02,
		.bg_staff04 { background-size:400px auto; }
		.interviewBox_lead br { display:none; }
		.interviewBox_text { width:60%; }
		.interviewBox:nth-of-type(even) .interviewBox_text { left:calc(50% - 15%); }
		
	}
	
	@media print, screen and (max-width:10240px) {
		.interviewBox_story { font-size:16px; }
	}

	@media print, screen and (max-width:850px) {
		.bg_staff { background-size:65% auto; }
		.interviewBox:nth-of-type(even).bg_staff { padding-bottom:20%; }
		.bg_staff02,
		.bg_staff04 { background-size:50% auto; }
		.interviewBox_text { width:90%; margin-bottom:20px; }
		.interviewBox:nth-of-type(even) .interviewBox_text { left:calc(50% - 45%); }
		
		.interview_mainBox .interviewBox_text { width:60%; }
		.interview_mainBox .interviewBox_text .medel { font-size:18px; }
		.interview_mainBox .interviewBox_lead { font-size:24px; }
		
	}
	
	
	@media print, screen and (max-width:767px) {
		.interviewBox_story { flex-wrap:wrap; margin:10px 0 30px; }
		.interviewBox_story_text, .interviewBox_story_pic { width:100%; }
		.interviewBox_story_pic img { width:100%; margin:20px 0; }
		.story_headline { font-size:20px; }
		.interview_mainBox { background-color:#fff; padding: 5% 0% 50%; background-size:contain; background-repeat:no-repeat; background-position:bottom left; }
		.interviewBox_story_w100 { margin-bottom:40px; }
		.reverse .interviewBox_story_pic { order:2; }
		.reverse .interviewBox_story_text { order:1; }
		.interview_mainBox .interviewBox_text { width:90%; }
		/*.bg_staff01_main { background-image:url(../img/recruit/staffstory/img_interview01_main.jpg); }*/
	}
	
	
	@media print, screen and (max-width:600px) {
		.interviewBox { display:block; }
		.bg_staff { background:none; padding-bottom:0px; margin-bottom:30px; }
		.interviewBox:nth-of-type(even).bg_staff { padding-bottom:0; }
		.interviewBox_lead { font-size:22px; }
		.interviewBox_text { left:auto; margin:0 auto; }
		.interviewBox:nth-of-type(even) .interviewBox_text { text-align:left; left:auto; margin:0 auto; }
		
		.interviewBox_pic { display:block; width:100%; }
		.interviewBox:nth-of-type(even) .interviewBox_pic { /*width:75%; margin:0 auto;*/ }
		.interviewBox_excerpt { max-width:100%; margin-bottom:50px; margin-left:5px; }
		.interviewBox_excerpt .interview_btn { display:none; }
		.interviewBox_btm .interview_btn { display:block; width:80%; margin:50px auto; }
		
		/*.interview_mainBox { background-position:60% 0; padding: 10% 5%; }
		.interview_mainBox .interviewBox_text { left:calc(50% - 48%); margin:0; width:65%; }*/
		.interview_mainBox .interviewBox_text { margin:0 auto 20px; }
		.interview_mainBox .interviewBox_text .medel { font-size:16px; }
		.interview_mainBox .interviewBox_lead { font-size:22px; }
		.interview_mainBox .jobType { font-size:12px; margin-top:0; justify-content:flex-start; }
		.interview_mainBox .jobType li { padding-left:35px; line-height:30px; margin-right:20px; width:auto; }
		.interview_mainBox .jobType li:before { width:30px; height:30px; background-size:contain; }
		.interview_mainBox .initial { margin:10px 0 0; }
		
		
		}
	}