@charset "UTF-8";

/* web font */
@font-face {
	font-family: "Noto Sans JP";
	font-weight: 400;
	src: url("/-/media/tb/recruit/careers/css/font/notosansjp/NotoSansJP-Regular.otf") format("opentype");
}
@font-face {
	font-family: "Noto Sans JP";
	font-weight: 500;
	src: url("/-/media/tb/recruit/careers/css/font/notosansjp/NotoSansJP-Medium.otf") format("opentype");
}
@font-face {
	font-family: "Noto Sans JP";
	font-weight: 700;
	src: url("/-/media/tb/recruit/careers/css/font/notosansjp/NotoSansJP-Bold.otf") format("opentype");
}
@font-face {
	font-family: "Noto Serif JP";
	font-weight: 400;
	src: url("/-/media/tb/recruit/careers/css/font/notoserifjp/NotoSerifJP-Regular.otf") format("opentype");
}
@font-face {
	font-family: "Noto Serif JP";
	font-weight: 500;
	src: url("/-/media/tb/recruit/careers/css/font/notoserifjp/NotoSerifJP-Medium.otf") format("opentype");
}
@font-face {
	font-family: "Noto Serif JP";
	font-weight: 700;
	src: url("/-/media/tb/recruit/careers/css/font/notoserifjp/NotoSerifJP-Bold.otf") format("opentype");
}

html {
	margin: 0;
	padding: 0;
	font-size: 62.5%;
}
body {
	margin: 0 auto;
	padding: 0;
	font-size: 1.5rem;
	font-family: 'Noto Sans JP', 'Hiragino Gothic Pro', 'メイリオ', Meiryo, 'Yu Gothic', '游ゴシック', YuGothic, '游ゴシック体', 'ＭＳ Ｐゴシック', sans-serif;
	font-weight: 400;
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
}
/* iPad背景切れ対策 */
@media screen and (min-width:668px){
	body {
		min-width: 1200px;
		font-size: 1.5rem;
	}
}
*,*::before,*::after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}
header, footer, section, aside, nav, article, main {
	display: block;
}
h1, h2, h3, h4, h5, h6,
figure, ul, ol, li, dl, dt, dd, p, img {
	margin: 0;
	padding: 0;
}
h1, h2, h3, h4, h5, h6,a {
	line-height: 1.3;
}
p {
	font-size: 100%;
	line-height: 1.6;
}
li {
	line-height: 1.5;
}
img {
	width: 100%;
	border: none;
	vertical-align: top;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}
@media screen and (max-width:668px){
	img{
		width: 100%;
	}
}
ul li, ol li {
	list-style: none;
}
a {
	color: #000;
	text-decoration: none;
	transition: color 0.2s, opacity 0.2s;
}
a:link {
	color: #000;
}
a:visited {
	color: #000;
}
a:hover {
	color: #000;
	opacity: 0.7;
	text-decoration: none;
}

/* 表示切替 */
.switch {
	visibility: hidden;
}
.sp{
	display:none;
}
@media screen and (max-width:668px){
	.pc{
		display:none;
	}
	.sp{
		display:block;
	}
	br.sp{
		display:inline-block;
	}
}


/*
	header
-----------------------------------------------------------------------------------------------*/
/* logo */
#header{
	-ms-justify-content: space-between;
	justify-content: space-between;
	width: 100%;
	background-color: rgba(255,255,255,0.95);
	position: fixed;
	top: 0;
	z-index: 9999;
}
#headLogo{
	width: calc(100% - 80px);
	-ms-align-items: center;
	align-items: center;
}
.headLogo__logo{
	width: 200px;
	height: 30px;
	margin: 0 0 0 30px;
	z-index: 9999;
}
.headLogo__txt{
	margin: 0 0 0 20px;
	font-size: 1.5rem;
	font-weight: bold;
	color: #222222;
}
@media screen and (max-width:668px){
	#headLogo{
		width: calc(100% - 60px);
	}
	.headLogo__logo{
		width: 120px;
		height: 18px;
		margin: 0 0 0 15px;
	}
	.headLogo__txt{
		margin: 0 0 0 10px;
		font-size: 1.1rem;
	}
}

a.header__link{
	margin: 0 30px 0 0;
	padding: 8px 12px;
	font-size: 1.2rem;
	color: #fff;
	background-color: #ff5a19;
	transition: background-color 0.2s;
}
a.header__link:hover{
	background-color: #e65015;
	opacity: 1.0;
}
a.header__link::after{
	content: "";
	display: inline-block;
	width: 14px;
	height: 12px;
	margin: 0 0 0 5px;
	background: url("/-/media/tb/recruit/careers/img/ico_window_wh.svg") center center no-repeat;
	background-size: cover;
}
a.header__link_menu{
	display: none;
}
@media screen and (max-width:668px){
	a.header__link_top{
		display: none;
	}
	a.header__link_menu{
		display: inline-block;
		margin: 10px 0 0;
	}
}


/* menu */
#gNavMenu{
	width: 80px;
	height: 80px;
	padding: 50px 0 0;
	font-size: 1.2rem;
	font-weight: bold;
	color: #fff;
	text-align:center;
	background-color: #00a0b8;
	position: relative;
	transition: background-color 0.2s;
	z-index: 9999;
}
#gNavMenu:hover{
	background-color: #0490a5;
	cursor: pointer;
}
#gNavMenu span[class^="gNavMenu__line"]{
	display:block;
	width:36px;
	height:2px;
	background-color:#fff;
	position:absolute;
	left:22px;
}
.gNavMenu__line01{
	top:20px;
	transition:transform 0.3s;
}
.gNavMenu__line02{
	top:30px;
	transition:transform 0.3s;
}
.gNavMenu__line03{
	top:40px;
	transition:transform 0.3s;
}
/* キーclose */
#gNavMenu.active .gNavMenu__line01{
	top:28px;
	transform:rotate(45deg);
}
#gNavMenu.active .gNavMenu__line02{
	top:28px;
	opacity:0;
}
#gNavMenu.active .gNavMenu__line03{
	top:28px;
	transform:rotate(135deg);
}
@media screen and (max-width:668px){
	#gNavMenu{
		width: 60px;
		height: 60px;
		padding: 40px 0 0;
		font-size: 1.0rem;
	}
	#gNavMenu span[class^="gNavMenu__line"]{
		width:24px;
		left:18px;
	}
	.gNavMenu__line01{
		top:15px;
	}
	.gNavMenu__line02{
		top:23px;
	}
	.gNavMenu__line03{
		top:31px;
	}
	/* キーclose */
	#gNavMenu.active .gNavMenu__line01{
		top:23px;
	}
	#gNavMenu.active .gNavMenu__line02{
		top:23px;
	}
	#gNavMenu.active .gNavMenu__line03{
		top:23px;
	}
}

/* gNav */
#gNavWrapper{
	display:none;
	width:1150px;
	margin:75px 0 0 0;
	padding:50px 0 0 0;
	position:fixed;
	top:0;
	left:50%;
	transform: translateX(-50%);
	z-index:1000;
}
#gNavOverlay{
	display:none;
	width:100%;
	height:100vh;
	background-color:rgba(0,0,0,0.93);
	position:absolute;
	top:0;
	left:0;
	z-index: 999;
}
#gNav{
	-ms-justify-content: space-between;
	justify-content: space-between;
}
.gNav__tit{
	padding:0 0 15px 0;
	font-size: 1.5rem;
	font-weight:700;
	font-style: italic;
	letter-spacing:0.1em;
	color:#fff;
}
.gNav__list{
	padding:0 0 30px 0;
}
.gNav__list li{
	padding:0 0 15px 0;
}
.gNav__list li a{
	display:inline-block;
	font-size:1.3rem;
	color:rgba(255,255,255,0.65);
	position:relative;
	transition:color 0.2s;
}
.gNav__list li a:hover{
	color:rgba(255,255,255,1);
	opacity: 1.0;
}
.gNav__list li a::after{
	content:' ';
	display:block;
	width:100%;
	height:1px;
	background-color:#FFFFFF;
	position:absolute;
	bottom:-2px;
	left:0;
	opacity:0;
	transition:opacity 0.2s;
}
.gNav__list li a:hover::after{
	opacity:1;
}
@media screen and (max-width:668px){
	#gNavWrapper{
		width:100%;
		height: 100%;
		margin:0 0 0 0;
		padding:0 0 0 0;
		overflow: scroll;
	}
	#gNav{
		display: block;
		width: 100%;
		margin: 100px auto 0;
		padding: 0 30px 30px;
	}
	.gNav__tit{
		margin: 0 0 15px;
		padding:0 0 5px 3px;
		border-bottom: 1px solid rgba(255,255,255,0.65);
	}
	.gNav__list{
		padding:0 0 5px 0;
	}
}


/* animation */
#gNav > div{
	position:relative;
}
#gNavWrapper.active #gNav > div:nth-of-type(1){
	/* name:アニメーション名,duration:一回分の時間の長さ,iteration-count:繰り返し回数,direction:反転再生,delay:開始時間,timing-function:タイミング・進行割合,animation-fill-mode:実行前後のスタイル */
	animation:slideTtoB 0.8s 1 normal 0s cubic-bezier(0.22, 0.61, 0.36, 1) forwards;
}
#gNavWrapper.active #gNav > div:nth-of-type(2){
	animation:slideTtoB 0.8s 1 normal 0.05s cubic-bezier(0.22, 0.61, 0.36, 1) forwards;
}
#gNavWrapper.active #gNav > div:nth-of-type(3){
	animation:slideTtoB 0.8s 1 normal 0.1s cubic-bezier(0.22, 0.61, 0.36, 1) forwards;
}
#gNavWrapper.active #gNav > div:nth-of-type(4){
	animation:slideTtoB 0.8s 1 normal 0.15s cubic-bezier(0.22, 0.61, 0.36, 1) forwards;
}
#gNavWrapper.active #gNav > div:nth-of-type(5){
	animation:slideTtoB 0.8s 1 normal 0.2s cubic-bezier(0.22, 0.61, 0.36, 1) forwards;
}
#gNavWrapper.active #gNav > div:nth-of-type(6){
	animation:slideTtoB 0.8s 1 normal 0.25s cubic-bezier(0.22, 0.61, 0.36, 1) forwards;
}
#gNavWrapper.active #gNav > div:nth-of-type(7){
	animation:slideTtoB 0.8s 1 normal 0.3s cubic-bezier(0.22, 0.61, 0.36, 1) forwards;
}
#gNavWrapper.active #gNav > div:nth-of-type(8){
	animation:slideTtoB 0.8s 1 normal 0.35s cubic-bezier(0.22, 0.61, 0.36, 1) forwards;
}
@keyframes slideTtoB{
	0%{
		opacity:0;
		top:-50px;
	}
	100%{
		opacity:1;
		top:0;
	}
}


/*
	パンくず
-----------------------------------------------------------------------------------------------*/
#olistPan{
	padding: 10px 30px;
}
.olistPan__item{
	padding:0 14px 0 0;
	margin:0 14px 0 0;
	font-size:1.2rem;
	color:#AAAAAA;
	position:relative;
}
.olistPan__item::after{
	content:' ';
	display:block;
	width:5px;
	height:5px;
	border-top:1px solid #AAAAAA;
	border-right:1px solid #AAAAAA;
	position:absolute;
	top:50%;
	right:0;
	transform: rotate(45deg)translateY(-50%);
}
.olistPan__item:last-of-type{
	padding:0;
	margin:0;
}
.olistPan__item:last-of-type::after{
	display:none;
}
.olistPan__item a:hover{
	text-decoration:underline;
	opacity: 1.0;
}
@media screen and (max-width:668px){
	#olistPan{
		padding: 6px 10px;
	}
}


/*
	コンテンツエリア
-----------------------------------------------------------------------------------------------*/
#wrapper{
	padding: 80px 0 0;
	min-width: 1200px;
	position: relative;
	overflow: hidden;
}
@media screen and (max-width:668px){
	#wrapper{
		padding: 60px 0 0;
		min-width: 100%;
	}
}

.ctsArea{
	width: 1200px;
	margin: 0 auto;
	padding: 80px 30px;
}
.ctsArea--900{
	width: 960px;
}
.ctsArea--800{
	width: 860px;
}
@media screen and (max-width:668px){
	.ctsArea,
	.ctsArea--900,
	.ctsArea--800{
		width: 100%;
		padding: 30px 20px;
	}
}

.flexBox{
	display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
.flexBox__jstCtt_cntr{
	-ms-justify-content: center;
	justify-content: center;
}
.flexBox__jstCtt_btwn{
	-ms-justify-content: space-between;
	justify-content: space-between;
}
.flexBox__alinItm_cntr{
	-ms-align-items: center;
	align-items: center;
}

.pageCtsArea{
	margin: 0 0 80px;
}
.pageCtsArea:last-of-type{
	margin: 0 0 0;
}
@media screen and (max-width:668px){
	.pageCtsArea{
		margin: 0 0 50px;
	}
}


/*
	フェードイン
-----------------------------------------------------------------------------------------------*/
.fadeIn {
  opacity : 0;
  transform: translateY(60px);
  transition: transform 1.0s;
}
@media screen and (max-width:668px){
	.fadeIn {
	  transform: translateY(40px);
	}
}


/*
	table
-----------------------------------------------------------------------------------------------*/
.tblBase{
	width:100%;
	border-collapse:collapse;
	border-top:1px solid #bec6c6;
	border-bottom:1px solid #bec6c6;
}
.tblBase th,.tblBase td{
	padding:15px;
	line-height:160%;
	border-bottom:1px dotted #bec6c6;
}
.tblBase th{
	min-width:180px;
	font-weight:bold;
	text-align: center;
	background-color:#F5F5F5;
}
@media screen and (max-width:668px){
	.tblBase{
		width:100%;
		border-top:none;
	}
	.tblBase tr,.tblBase th,.tblBase td{
		display:block;
	}
	.tblBase th,.tblBase td{
		width:100%;
	}
	.tblBase th{
		min-width:auto;
		padding:10px;
		border-top:1px solid #bec6c6;
		border-bottom:none;
	}
	.tblBase td{
		padding:10px 0 25px 0;
		border-bottom:none;
	}
}


/*
	リスト
-----------------------------------------------------------------------------------------------*/
.listBase{
	position:relative;
}
.listBase--center{
	text-align: center;
}
.listBase--center .listBase__item{
	display: inline-block;
}
.listBase__item{
	/*display: inline-block;*/
	padding:5px 0 0 15px;
	position: relative;
}
.listBase__item::before {
	content:'●';
	font-size:1.0rem;
	color:#2b435c;
	position:absolute;
	top: 8px;
	left:0;
}
.listBase__item--or::before{
	color:#ff9f20;
}
@media screen and (max-width:668px){
	.listBase--center{
		text-align: left;
	}
}

/* 数字リスト */
.olistNum{
	display: flex;
	flex-wrap: wrap;
	flex-direction: column;
	gap: 5px;
	margin-top: 5px;
	counter-reset: number 0;
}
.olistNum li{
	padding-left: 22px;
	position: relative;
}
.olistNum li::before{
	content: counter(number) " ";
	counter-increment: number 1;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	width: 18px;
	height: 18px;
	padding-bottom: 1px;
	font-size: 1.0rem;
	border: 1px solid #000;
	border-radius: 50%;
	position: absolute;
	top: 2px;
	left: 0;
}

/* 注釈 */
.listBase__item--notes::before {
	content:'※';
	font-size:100%;
	color:#000;
	top: 5px;
}


/*
	タイトル
-----------------------------------------------------------------------------------------------*/
/* アンダーバー */
.titBtmBar{
	text-align: center;
}
.titBtmBar__tit{
	margin: 0 0 40px;
	font-size: 2.8rem;
	position: relative;
}
.titBtmBar__tit--small{
	font-size: 2.2rem;
}
.titBtmBar__tit::after{
	content:' ';
	display:block;
	width:60px;
	height:4px;
	margin: 15px auto 0;
	background:linear-gradient(to right, #80c101 25%,#009899 25%,#009899 50%,#0099c9 50%,#0099c9 75%,#ff9f20 75%,#ff9f20 100%);
}
@media screen and (max-width:668px){
	.titBtmBar__tit{
		margin: 0 0 20px;
		font-size: 2.2rem;
	}
	.titBtmBar__tit--small{
		font-size: 2.0rem;
	}
	.titBtmBar__txt{
		text-align: left;
	}
}

/* レフトバー */
.titLBar{
	margin: 0 0 12px;
	padding: 0 0 0 10px;
	font-size: 1.8rem;
	line-height: 1.2;
	border-left: 5px solid #2b435c;
}


/*
	テキスト
-----------------------------------------------------------------------------------------------*/
.titBtmBar__txt{
	margin-bottom: 30px;
}
.txt_rigft{
	text-align: right;
}
.txt_center{
	text-align: center;
}

.txt_btmLine{
	text-decoration: underline;
}
@media screen and (max-width:668px){
	.titBtmBar__txt{
		margin-bottom: 20px;
	}
}


/*
	カテゴリーページ
-----------------------------------------------------------------------------------------------*/
.pageCateCmn{
	padding: 6% 30px;
	color: #fff;
	text-align: center;
	position: relative;
}
.pageCateCmn::before{
	content: "";
	width: 100%;
	height: 100%;
	background-color: #2b435c;
	position: absolute;
	top: 0;
	left: 0;
}
.pageCateCmn__tit{
	font-size: 4.0rem;
	letter-spacing: 0.3rem;
	line-height: 1.2;
	position: relative;
	z-index: 10;
}
.pageCateCmn__titSub{
	display: block;
	margin: 10px 0 0;
	font-size: 2.2rem;
	letter-spacing: 0.2rem;
}
.pageCateCmn__titEn{
	display: block;
	margin: 18px 0 0;
	font-size: 1.8rem;
	font-style: italic;
}
@media screen and (max-width:668px){
	.pageCateCmn{
		padding: 7% 20px;
	}
	.pageCateCmn__tit{
		font-size: 2.5rem;
	}
	.pageCateCmn__titSub{
		margin: 5px 0 0;
		font-size: 1.8rem;
	}
	.pageCateCmn__titEn{
		margin: 12px 0 0;
		font-size: 1.5rem;
	}
}


/*
	背景
-----------------------------------------------------------------------------------------------*/
.bgOr{
	background-color: #ff9f20;
}
.bgGry{
	background-color: #ececec;
}


/*
	ボタン
-----------------------------------------------------------------------------------------------*/
.btnBase{
	-ms-justify-content: center;
	justify-content: center;
	-ms-flex-direction: row-reverse;
	flex-direction: row-reverse;
	padding: 30px 0 0;
}
a.btnBase__item{
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-ms-justify-content: center;
	justify-content: center;
	-ms-flex-direction: column;
	flex-direction: column;
	width: 300px;
	margin: 0 0 0 15px;
	padding: 20px 15px;
	font-size: 1.7rem;
	font-weight: bold;
	color: #fff;
	text-align: center;
	background-color: #2b435c;
	transition: background-color 0.2s;
}
a.btnBase__item:hover{
	background-color: #213448;
	opacity: 1.0;
}
a.btnBase__item:last-of-type{
	margin: 0 0 0 0;
}
.btnBase__notes{
	display: block;
	width: 100%;
	padding-top: 5px;
	font-size: 1.2rem;
	text-align: center;
}
@media screen and (max-width:668px){
	.btnBase{
		display: block;
		padding: 20px 0 0;
	}
	a.btnBase__item{
		width: 100%;
		margin: 0 0 10px 0;
		font-size: 1.6rem;
	}
}

/* 戻る */
a.btnBase__item--back{
	background-color: #777;
}
a.btnBase__item--back:hover{
	background-color: #666;
}

/* 別窓リンク */
a.btnBase__item .window::after{
	content: " ";
	display: inline-block;
	width: 16px;
	height: 14px;
	margin: 0 0 0 7px;
	background:url(/-/media/tb/recruit/careers/img/ico_window_wh.svg) center center no-repeat;
	background-size: contain;
}
@media screen and (max-width:668px){
	a.btnBase__item .window::after{
		width: 15px;
		height: 13px;
	}
}



/*
	お問い合わせ
-----------------------------------------------------------------------------------------------*/
.contact{
	margin: 40px 0 0;
	font-size: 1.5rem;
	font-weight: bold;
	text-align: center;
	border: 1px solid #2b435c;
}
.contact__tit{
	padding: 10px;
	color: #fff;
	background-color: #2b435c;
}
.contact__txt{
	padding: 30px;
	background-color: #fff;
}
.contact__list{
	-ms-justify-content: space-between;
	justify-content: space-between;
	padding: 0 20px;
	text-align: left;
}
.contact__listItem{
	width: calc((100% - 30px)/2);
}
.contact__listTit{
	margin: 0 0 10px;
	padding: 0 0 0 10px;
	border-left: 5px solid #2b435c;
	line-height: 1.2;
}
@media screen and (max-width:668px){
	.contact{
		margin: 20px 0 0;
	}
	.contact__txt{
		padding: 15px;
		text-align: left;
	}
	.contact__list{
		display: block;
		padding: 0 0;
		margin: 0 0 -20px;
	}
	.contact__listItem{
		width: 100%;
		margin: 0 0 20px;
	}
}


/*
	page top
-----------------------------------------------------------------------------------------------*/
a#pageTop{
	-ms-justify-content: center;
	justify-content: center;
	-ms-align-items: center;
	align-items: center;
	width:60px;
	height:60px;
	background-color: #2d2d2d;
	position: absolute;
	right: 0;
	z-index: 999;
}
a#pageTop::after{
	content:' ';
	display:block;
	width:12px;
	height:12px;
	margin: 4px 0 0;
	border-top: 2px solid #fff;
	border-left: 2px solid #fff;
	transform:rotate(45deg);
}
@media screen and (max-width:668px){
	a#pageTop{
		width:50px;
		height:50px;
	}
	a#pageTop::after{
		width:10px;
		height:10px;
	}
}


/*
	footer
-----------------------------------------------------------------------------------------------*/
#footer{
	-ms-justify-content: space-between;
	justify-content: space-between;
	-ms-flex-direction: row-reverse;
	flex-direction: row-reverse;
	padding: 30px 40px 70px;
	color: #8a8a8b;
	background-color: #2d2d2d;
}
a.fotter__link{
	font-size: 1.2rem;
	color: #8a8a8b;
	text-decoration: underline;
}
a.fotter__link:hover{
	text-decoration: none;
	opacity: 1.0;
}
.fotter__copy{
	font-size: 1.2rem;
}
@media screen and (max-width:668px){
	#footer{
		display: block;
		padding: 20px 15px 30px;
		text-align: center;
	}
	a.fotter__link{
		display: block;
		margin: 0 0 15px;
	}
	.fotter__copy{
		font-size: 1.0rem;
	}
}