#interviewlink{
	position: fixed;
	z-index: 100;
	bottom:15px;right:15px;}

	#interviewlink a{
		display: block;
		height:100%;}

	#interviewlink a .inner-coin{
		transform-style:preserve-3d;
		transition:transform .5s ease;
		position: relative;}

	#interviewlink a.-is-active .inner-coin{
		transform:rotateY(180deg);}

		#interviewlink a .front{
			transform:translate3d(0,0,1px);
			z-index:102;
			position:absolute;
			opacity:1;}
		#interviewlink a .back{
			transform:rotateY(180deg) translate3d(0,0,0);
			z-index:101;
			position:absolute;
			opacity:0;}
		#interviewlink a.-is-active .front{
			opacity:0;}
		#interviewlink a.-is-active .back{
			opacity:1;}


/*mainimg*/
.mainimg{
	padding: 130px 0 60px;
	background:url(../img/common/companydot.png);}
	.mainimg .jobmainimg-inner{
		position: relative;
		text-align: center;}
		.mainimg .jobmainimg-inner img{
			transform:scale(.9);
			transition: .5s all;
			opacity:0}
		.mainimg.-is-active .jobmainimg-inner img{
			transform:scale(1);
			opacity:1;
			margin:0 auto;}
		.mainimg .jobmainimg-inner .jobmainimg-inner-txt{
			position: absolute;
			left:50%;
			transform: translate(-50%,-33%);
			width:100%;}
			.mainimg .jobmainimg-inner .jobmainimg-inner-txt h2{
				font-size: 10rem;
				letter-spacing: 2px;
				position:relative;
				overflow: hidden;}

					.mainimg .jobmainimg-inner .jobmainimg-inner-txt h2 small{
						position: relative;
						font-size: 4.2rem}
					.mainimg .jobmainimg-inner .jobmainimg-inner-txt h2 span{
						color:#4C9CD0;}

						.mainimg .jobmainimg-inner .jobmainimg-inner-txt .jobmainimg-inner-txt-detail{
							transform:translate3d(0, 100.5%, 0);
							transition:transform 1s ease;
							font-size: 8.5rem;
							transition-delay:.3s;}
						.mainimg.-is-active .jobmainimg-inner .jobmainimg-inner-txt .jobmainimg-inner-txt-detail{
							transform:translate3d(0, 0, 0);}

							.mainimg .jobmainimg-inner .jobmainimg-inner-txt .jobmainimg-inner-txt-detail::before{content: "";}

			.mainimg .jobmainimg-inner .jobmainimg-inner-txt p{
				font-size: 1.6rem;
				letter-spacing: 2px;
				margin-top:50px;
				position: relative;
				transition: 1s all ease;
				transition-delay:.7s;
				opacity: 0}

			.mainimg.-is-active .jobmainimg-inner .jobmainimg-inner-txt p{
				opacity: 1;}

			.mainimg .jobmainimg-inner .jobmainimg-inner-txt p::before{
				content: "";
				position:absolute;
				width: 0px; height:2px;
				background:#000;
				top:-30px; left:50%;
				transform: translate(-50%,0);
				transition: 1s all ease;
				transition-delay:.7s;}
			.mainimg.-is-active .jobmainimg-inner .jobmainimg-inner-txt p::before{
				width: 170px;}

		.mainimg .jobmaintxt{
			font-size: 1.5rem;
			line-height: 3.2rem;
			width:900px;
			margin:145px auto 0;}

		.mainimg .jobtag,
		.mainimg .jobrelease{
			margin: 28px 0 30px;
			font-size: 1.5rem;
			line-height: 3.2rem;
			width:900px;
			margin:40px auto 0;
		}

			.mainimg .jobtag .jobtag__ttl,
			.mainimg .jobrelease .jobrelease__ttl{
				font-size: 2rem;
				margin-bottom: 10px;
				font-weight: bold;
			}

			.mainimg .jobtag .jobtag__tag,
			.mainimg .jobrelease .jobrelease__tag{
				display:flex;
				flex-wrap: wrap;
			}
				.mainimg .jobtag .jobtag__tag li{
					border:1px solid black;
					padding:6px 30px;
					border-radius: 4px;
					margin-right:10px;
					background:white;
					display:inline-block;
					color:black;
					position: relative;
					margin-bottom: 14px;
				}
				.mainimg .jobrelease .jobrelease__tag li a{
					border:1px solid black;
					padding:6px 40px 6px 30px;
					border-radius: 4px;
					margin-right:10px;
					background:white;
					display:inline-block;
					color:black;
					position: relative;
					transition:background .2s linear;
					margin-bottom: 14px;
				}

				.mainimg .jobrelease .jobrelease__tag li a::after{
					content: "";
					position: absolute;
					top: 0; bottom: 0;
					margin: auto;
					vertical-align: middle;
					right: 13px;
					width: 4px;
					height: 4px;
					border-top: 2px solid #00a0e9;
					border-right: 2px solid #00a0e9;
					transform: rotate(45deg);
					transition:all .2s linear;
				}

				.mainimg .jobrelease .jobrelease__tag li a:hover{
					background:black;
					color:white;
				}

				.mainimg .jobrelease .jobrelease__tag li a:hover::after{
					right: 8px;
					border-top: 2px solid white;
					border-right: 2px solid white;
				}

				.mainimg .jobrelease .jobrelease__tag li a.nolink{
					cursor:auto;
				}
				.mainimg .jobrelease .jobrelease__tag li a.nolink:hover{
					background:white;
					color:black;
				}
				.mainimg .jobrelease .jobrelease__tag li a.nolink::after{
					content:none;
				}
.contents{background:#EFF0ED;}
	.otherjob-inner ul{
		display: flex;
		justify-content: center;
		padding:30px 0;}
		.otherjob-inner ul li{
			transform: scale(.8);
			opacity: 0;
			transition: .5s all}
		.otherjob-inner ul.-is-active li{
			transform: scale(1);
			opacity: 1;}

			.otherjob-inner ul li:first-of-type{
				margin-right:40px;}
				.otherjob-inner ul li a{
					background:#0071BC;
					width: 340px;
					color: #fff;
					display:inline-block;
					transition: .5s all}
				.otherjob-inner ul.-is-active li:hover a{
					background:#3f9ad6;}
					.otherjob-inner ul li a .otherjob-inner-btn{
						position: relative;
						height:80px;}
						.otherjob-inner ul li a .otherjob-inner-btn-txt{
							position: absolute;
							transform:translate(-50%,-50%);
							letter-spacing: 2px;
							left:50%; top:50%;
							text-align: center;
							width:100%;
							line-height: 24px;}
							.otherjob-inner ul li a .otherjob-inner-btn-txt h3{
								font-size: 2.2rem;
								font-weight: normal;}
							.otherjob-inner ul li a .otherjob-inner-btn-txt p{
								font-size: 1.5rem;}

@media screen and (max-width: 480px){
/*mainimg*/
.mainimg{padding:0 0 20px;}
	.mainimg .jobmainimg-inner img{width: 100%}
		.mainimg .jobmainimg-inner .spbgimg{
			height:50vh;
			background-size:cover!important;}
		/*b to c*/
		#btocjob .mainimg .jobmainimg-inner .spbgimg{
			background:url(../img/joblist/mainimg_btoc.png);
			background-position:80%,center;}
		/*b to b*/
		#btobjob .mainimg .jobmainimg-inner .spbgimg{
			background:url(../img/joblist/mainimg_btob.png);
			background-position:80%,center;}
		/*engineer*/
		#engjob .mainimg .jobmainimg-inner .spbgimg{
			background:url(../img/joblist/mainimg_eng.png);
			background-position:80%,center;}
	.mainimg .jobmainimg-inner .jobmainimg-inner-txt{
		width: 100vw}
		.mainimg .jobmainimg-inner .jobmainimg-inner-txt p{margin-top:34px;}
		.mainimg .jobmainimg-inner .jobmainimg-inner-txt p::before{top:-22px;}
		.mainimg .jobmainimg-inner .jobmainimg-inner-txt h2{
			font-size:7rem;}
	.mainimg .jobmaintxt{
		width: 90vw;
		margin:150px auto 0;
		font-size:3.8vw;
		line-height: 4.5vh}
	.mainimg .jobtag,
	.mainimg .jobrelease{
		width: 90vw;
	}
/*interviewlink*/
#interviewlink{display: none;}
/*otherjpb*/
.otherjob-inner ul{flex-direction: column;}
	.otherjob-inner ul.-is-active li{text-align: center;}
		.otherjob-inner ul li:first-of-type{
			margin-right: 0;
			margin-bottom:10px;}
			.otherjob-inner ul li a{width: 90vw;}

}