@import url("keyframes.css");

/* =================================
	Banner
================================= */

@media all and (min-width: 992px) {
div.tbsv9_banner_responsive {
	margin-bottom:40px;
}
div.tbsv9_banner_responsive + div.tbsv9_banner_responsive {
	margin-bottom:60px;
}
}
@media all and (max-width: 991.98px) {
div.tbsv9_banner_responsive {
	margin-bottom:20px;
}
div.tbsv9_banner_responsive + div.tbsv9_banner_responsive {
	margin-bottom:30px;
}
}

/* =================================
	Web Fonts
================================= */

/* =================================
	CSS
================================= */

::-moz-selection {
	color: #fff;
	background-color:#0050ff;
}
::selection {
	color: #fff;
	background-color:#0050ff;
}

/* link */
a:link {
	text-decoration:underline;
	color:#c00;
}
a:visited {
	text-decoration:none;
	color:#c00;
}
a:active {
	text-decoration:none;
	color:#c00;
}
a:hover {
	text-decoration:underline;
	color:#c00;
}

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

/* smp br */
@media all and (min-width: 992px) {
.br-smp {
	display:none;
}
}

.ff {
	font-family:serif;
}
.lazy {
	display:block;
	position:relative;
}
.wbr {
	white-space: nowrap;
	display: inline-block;
}

.sticky {
	opacity: 0;
}
.sticky-done {
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
	-webkit-animation-name: fadeInUp;
	animation-name: fadeInUp;
}


/*	background
============================== */
body {
	color: #3b3f4a;
	background-color:#ecedf1;
	background-repeat:repeat-y;
	background-position:center 6%;
	background-cover:cover;
}
div.cover {
	/**/
	-moz-font-feature-settings: "palt";
	-webkit-font-feature-settings: "palt";
	font-feature-settings: "palt";
	/**/
}
div.cover b {
	font-weight: 700;
}
@media all and (min-width: 992px) {
body {
	background-image:url(../di2_img/bg_pc.png);
}
div.cover {
	padding-top:96px;
}
}
@media all and (max-width: 991.98px) {
body {
	background-image:url(../di2_img/bg_smp.png);
}
div.cover {
	min-width:320px;
	overflow:hidden;
	padding-top:80px;
}
}


/*	YouTube
============================== */
div.mov-inner {
	position:relative;
	height:0;
	padding-top:56.25%;
	background-color:#000;
	background-size:cover;
}
div.mov-inner iframe {
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
}
@media print {
div.mov-inner {
	display:none;
}
}

/*	.header
============================== */
div.header header {
	background-position:center center;
	background-repeat:repeat-x;
}
div.header header h1 {
	background-image:url(../di2_img/logo.svg?0);
	background-position:center center;
	background-repeat:no-repeat;
}
div.header header h1 span {
	display:block;
	text-indent:110%;white-space:nowrap;overflow:hidden;
}
@media all and (min-width: 992px) {
div.header {
}
div.header header {
	background-image:url(../di2_img/logo_bg_pc.jpg);
}
div.header header h1 {
	height:160px;
	background-size:647px 202px;
}
}
@media all and (max-width: 991.98px) {
div.header {
}
div.header header {
	position:relative;
	height:0;
	padding-top: -webkit-calc(117 / 375 * 100%);
	padding-top: calc(117 / 375 * 100%);
	background-image:url(../di2_img/logo_bg_smp.jpg);
	background-size:cover;
}
div.header header h1 {
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background-size:cover;
}
}

/*	.news
============================== */
div.news header h2 {
	background-position:center center;
	background-repeat:no-repeat;
}
div.news header h2 span {
	display:block;
	text-indent:110%;white-space:nowrap;overflow:hidden;
}
@media all and (min-width: 992px) {
div.news {
	max-width:1080px;
	margin:0 auto;
}
div.news header {
	padding:28px 0 24px;
}
div.news header h2 {
	background-image:url(../di2_img/news_h2_pc.png);
	background-size:contain;
	width:230px;
	margin:0 auto;
}
div.news header h2 span {
	height:71px;
}
}
@media all and (max-width: 991.98px) {
div.news header h2 {
	position:relative;
	height:0;
	padding-top: -webkit-calc(106 / 375 * 100%);
	padding-top: calc(106 / 375 * 100%);
	background-image:url(../di2_img/news_h2_smp.png);
	background-position:center center;
	background-size:cover;
}
div.news header h2 span {
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background-size:cover;
}
}

div.news article div.mov-main {
	position:relative;
	height:0;
	padding-top:56.25%;
	background-color:#000;
}
div.news article div.mov-main iframe {
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
}
@media all and (min-width: 992px) {
div.news {
	margin:0 auto 60px;
}
}
@media all and (max-width: 991.98px) {
div.news {
	margin-bottom:36px;
}
}

/*	.programs
============================== */
div.programs article nav ul {
	display:flex;
	justify-content:center;
}
div.programs article nav ul li:first-child {
	margin-right:9px;
}
div.programs article nav ul li a {
	display: inline-block;
	
	font-weight: 700;
	line-height: 1;
	position: relative;

	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;

	text-align: center;
	vertical-align: middle;
	text-decoration: none;
	letter-spacing: 0.1em;

	-webkit-transition: all 0.3s;
	transition: all 0.3s;

}

div.programs article nav li a span {
	position: relative;
	display: block;
	padding: 0.75em 3em;
	color: #0050ff;
	border: 2px solid #0050ff;
	border-radius: 12px;
	background-color: #fff;
}

div.programs article nav li a.tab-on span {
	color: #fff;
	background-color: #0050ff;
}

div.programs article nav li a:not(.tab-on):before {
	content: "";
	display: block;
	background-color:#fff;
	/**/
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	/**/
	position: absolute;
	left: 0;
	width: 100%;
	height: 30px;
	-webkit-transition: all 0.3s;
	transition: all 0.3s;
	border: 2px solid #0050ff;
	border-radius: 0 0 12px 12px;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

div.programs article nav li a:not(.tab-on):hover:before {
	bottom: -2px;
}

@media all and (min-width: 992px) {
div.programs {
	padding-bottom:30px;
}
div.programs article nav {
	margin-bottom:36px;
}
div.programs article nav li a span {
	font-size:20px;
}
div.programs article nav li a:not(.tab-on):before {
	bottom: -7px;
}
div.programs article nav li a.tab-on,
div.programs article nav li a:not(.tab-on):hover {
	-webkit-transform: translate(0, 7px);
	transform: translate(0, 7px);
}
}
@media all and (max-width: 991.98px) {
div.programs {
	padding-bottom:8px;
}
div.programs article nav {
	margin-bottom:28px;
}
div.programs article nav li a span {
	font-size:14px;
}
div.programs article nav li a:not(.tab-on):before {
	bottom: -4px;
}
div.programs article nav li a.tab-on,
div.programs article nav li a:not(.tab-on):hover {
	-webkit-transform: translate(0, 4px);
	transform: translate(0, 4px);
}
}

/*	.other
============================== */
div.other {
	background-color:#f7f7f7;
	position:relative;
	padding-bottom:1px;
}

/*	.other .conr
============================== */
div.other > div.conr {
	position:absolute;
	background-repeat:no-repeat;
	background-size:contain;
	z-index:1;
}
div.other > article {
	position:relative;
	z-index:2;
}
div.other > div.lt {
	left:0;
	top:0;
	background-image:url(../di2_img/archive_bg_lef.png);
	background-position:left top;
}
div.other > div.rb {
	right:0;
	bottom:0;
	background-image:url(../di2_img/archive_bg_rig.png);
	background-position:right bottom;
}
div.other > div.conr span,
div.other > div.conr img {
	display:block;
}
@media all and (min-width: 992px) {
div.other > div.conr {
	width:356px;
	height:200px;
}
}
@media all and (max-width: 991.98px) {
div.other > div.conr {
	width:100%;
}
div.other > div.conr span {
	position:relative;
	height:0;
	padding-top: -webkit-calc(92 / 375 * 100%);
	padding-top: calc(92 / 375 * 100%);
}
div.other > div.conr span img {
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
}
}

/*	.archive
============================== */
div.archive header h2 {
	background-position:center center;
	background-repeat:no-repeat;
}
div.archive header h2 span {
	display:block;
	text-indent:110%;white-space:nowrap;overflow:hidden;
}
@media all and (min-width: 992px) {
div.archive {
	min-width:1080px;
}
div.archive > article {
	padding:59px 0 59px;
}
div.archive header h2 {
	background-image:url(../di2_img/archive_h2_pc.png);
	background-size:contain;
	width:315px;
	margin:0 auto 32px;
}
div.archive header h2 span {
	height:71px;
}
}
@media all and (max-width: 991.98px) {
div.archive {
	margin-bottom:0;
}
div.archive > article {
	padding-bottom:24px;
}
div.archive header h2 {
	position:relative;
	height:0;
	padding-top: -webkit-calc(130 / 375 * 100%);
	padding-top: calc(130 / 375 * 100%);
	background-image:url(../di2_img/archive_h2_smp.png);
	background-position:center center;
	background-size:cover;
}
div.archive header h2 span {
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background-size:cover;
}
}

/*	.archive .btn
============================== */
div.archive article .btn {
	margin:0 auto;
}
div.archive article .btn a,
div.archive article .btn a span,
div.archive article .btn a span:after,
div.archive article .btn a span:before {
	display:block;
}
div.archive article .btn a {
	color:#0050ff;
	letter-spacing:0.25em;
	text-indent:0.25em;
	position: relative;
	padding: 15px;
	font-weight:700;
	font-size: 18px;
	text-align: center;
	line-height: 1;
	text-decoration:none;
	border:2px solid #0050ff;
	background-color:#fff;
	border-radius:60px;
	-webkit-transition: all 0.3s;
	transition: all 0.3s;
}
div.archive article .btn a span {
	position: absolute;
	top: 50%;
	right: 15px;
	transform: translateY(-50%);
	background-color:#0050ff;
	width: 30px;
	height: 30px;
	text-indent:110%;white-space:nowrap;overflow:hidden;
	border-radius: 50%;
}
div.archive article .btn a span:before,
div.archive article .btn a span:after {
	content: '';
	background-color: #fff;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
div.archive article .btn a span:after {
	width: 12px;
	height: 2px;
}
div.archive article .btn a span:before {
	width: 2px;
	height: 12px;
}
div.archive article .btn a:hover {
	color:#fff;
	background-image:url(../di2_img/logo_bg_smp.jpg);
	background-size:cover;
	background-color:#0050ff;
	background-position:center bottom;
}
div.archive article .btn a:hover span {
	background-color:#fff;
}
div.archive article .btn a:hover span:before,
div.archive article .btn a:hover span:after {
	background-color: #0050ff;
}

@media all and (min-width: 992px) {
div.archive article .btn {
	width:356px;
}
}
@media all and (max-width: 991.98px) {
div.archive article .btn {
	width:95%;
	max-width:356px;
}
}

/*	.box
============================== */
div.box ul {
	display:flex;
	flex-wrap:wrap;
	justify-content:left;
}
div.box ul li span,
div.box ul li img,
div.box ul li cite {
	display:block;
}
div.box ul li {
	display: flex;
	flex-direction:column;
	text-align:left;
}
div.box ul li a {
	display: flex;
	flex-direction:column;
	height:100%;
	text-decoration:none;
}
div.programs div.box ul li a,
div.archive div.box ul li a span.img,
div.people div.box ul li a {
	background-color:#fff;
	border-radius:8px;
	overflow:hidden;
	box-shadow:0 0 6px #b8b8b8;
}
div.box ul li a span.img {
	position:relative;
	height:0;
	padding-top: -webkit-calc(281 / 174 * 100%);
	padding-top: calc(281 / 174 * 100%);
	background-size:cover;
	background-position:center top;
}
div.people div.box ul li a span.img {
	padding-top: -webkit-calc(9 / 16 * 100%);
	padding-top: calc(9 / 16 * 100%);
}
div.box ul li a span.img img {
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
}
div.box ul li a span.lazy-done {
	-webkit-animation: fadeIn 800ms;
	animation: fadeIn 800ms;
}
div.box ul li a span.txtarea {
	display: flex;
	flex-direction:column;
	justify-content:space-between;
	height:100%;
}
div.box ul li a span.txtarea cite {
	color:#000;
	line-height:1.25;
	font-style:normal;
}
div.box ul li a span.txtarea .title,
div.box ul li a span.txtarea .text {
	color:#000;
	font-style:normal;
	/* text overflow */
	overflow:hidden;
	display:-webkit-box;
	-webkit-box-orient: vertical;
}
div.box ul li a span.txtarea .title {
	margin-bottom:0.5em;
	font-size:95%;
	line-height:1.35;
	-webkit-line-clamp:2;
}
div.box ul li a span.txtarea .text {
	margin-bottom:0.5em;
	font-size:85%;
	line-height:1.5;
	-webkit-line-clamp:3;
}
div.programs div.box ul li a span.txtarea cite {
	margin-bottom:1em;
}
div.archive div.box ul li a span.txtarea cite {
	margin-bottom:.5em;
}
div.people div.box ul li a span.txtarea::after {
	display:inline-block;
	content:"続きを読む";
	text-align:right;
	padding-right:1.5em;
	background-image:url(../di2_img/arrow.svg);
	background-repeat:no-repeat;
	background-position:center right;
	background-size:auto 1.2em;
	color:#c1c6cf;
	font-style:normal;
	font-size:85%;
	line-height:1.5;
	font-weight:bold;
}
@media all and (min-width: 992px) {
div.box {
	width:940px;
	margin:0 auto;
}
div.box ul {
}
div.box ul li {
	margin-bottom:30px;
}
div.programs div.box ul li {
	width:calc((100% - 20*2px)/3);
}
div.archive div.box ul li {
	width:calc((100% - 15*4px)/5);
}
div.people div.box ul li {
	width:calc((100% - 20*2px)/3);
}
div.programs div.box ul li:nth-child(3n-2), div.programs div.box ul li:nth-child(3n-1),div.people div.box ul li:nth-child(3n-2),div.people div.box ul li:nth-child(3n-1) {
	margin-right:20px;
}
div.archive div.box ul li:not(:nth-child(5n)) {
	margin-right:15px;
}
div.programs div.box ul li a span.txtarea,
div.people div.box ul li a span.txtarea {
	padding:17px;
}
div.archive div.box ul li a span.txtarea {
	padding-top:17px;
}
div.box ul li a span.txtarea cite {
	font-size:100%;
}
}
@media all and (max-width: 991.98px) {
div.box {
	padding:0 2.666666666666667%;;
}
div.box ul {
}
div.box ul li {
	width:calc((100% - 8px)/2);
	margin-bottom:20px;
}
div.box ul li:nth-child(odd) {
	margin-right:8px;
}
div.programs div.box ul li a span.txtarea,
div.people div.box ul li a span.txtarea {
	padding:13px;
}
div.archive div.box ul li a span.txtarea {
	padding-top:13px;
}
div.box ul li a span.txtarea cite {
	font-size:87.5%;
}
}

div.programs div.box ul li a span.txtarea span.oa {
	/**/
	display:flex;
	justify-content:center;
	align-items:center;
	flex-wrap:wrap;
	/**/
	width:100%;
	max-width:120px;
	position:relative;
	background-color:#0050ff;
	padding:0.5em 0;
	font-size:12px;
	font-weight:700;
	color:#fff;
	text-align:center;
	border-radius:24px;
}
div.programs div.box ul li a span.txtarea span.oa:after {
	content:'';
	width:8px;
	height:8px;
	border:0;
	border-top:2px solid #fff;
	border-right:2px solid #fff;
	transform:rotate(45deg);
	margin-left:10px;
}
div.archive div.box ul li a span.txtarea span.oa {
	color:#c0c4ce;
	line-height:1.25;
	font-size:12px;
}

/*	.brandmovie
============================== */
div.brandmovie {
}
div.brandmovie header h2 {
	background-position:center center;
	background-repeat:no-repeat;
}
div.brandmovie header h2 span {
	display:block;
	text-indent:110%;white-space:nowrap;overflow:hidden;
}
@media all and (min-width: 992px) {
div.brandmovie {
	padding-top:60px;
	margin-bottom:96px;
}
div.brandmovie article div.inner {
	background-image:url(../di2_img/brandmovie_bg_pc.png?0);
	background-size:976px 816px;
	background-repeat:no-repeat;
	background-position:center center;
	width:1080px;
	height:816px;
	margin:0 auto;
}
div.brandmovie article div.inner header {
	padding-top:56px;
	margin-bottom:30px;
}
div.brandmovie header h2 {
	background-image:url(../di2_img/brandmovie_h2_pc.png);
	background-size:contain;
	width:433px;
	margin:0 auto;
}
div.brandmovie header h2 span {
	height:71px;
}
div.brandmovie article div.inner div.mov,
div.brandmovie article div.inner div.mov iframe {
	width:700px;
	height:394px;
}
div.brandmovie article div.inner div.mov {
	border-radius:20px;
	box-shadow:0 0 0 5px #fff;
	background-color:#fff;
	overflow:hidden;
	margin:0 auto;
}
}
@media all and (max-width: 991.98px) {
div.brandmovie {
	margin-bottom:48px;
}
div.brandmovie article {
	background-image:url(../di2_img/brandmovie_bg_smp.png?0);
	background-size:cover;
	background-repeat:no-repeat;
	background-position:center center;
	position:relative;
	height:0;
	padding-top: -webkit-calc(552 / 375 * 100%);
	padding-top: calc(552 / 375 * 100%);
}
div.brandmovie article div.inner,
div.brandmovie header h2 span,
div.brandmovie article div.inner div.mov iframe {
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
}
div.brandmovie header h2 {
	position:relative;
	height:0;
	padding-top: -webkit-calc(122 / 375 * 100%);
	padding-top: calc(122 / 375 * 100%);
	background-image:url(../di2_img/brandmovie_h2_smp.png);
	background-position:center center;
	background-size:cover;
}
div.brandmovie header h2 span {
	background-size:cover;
}

div.brandmovie article div.inner div.mov-outer {
	position:absolute;
	left:7.466666666666667%;
	top:22.101449275362319%;
	border-radius:8px;
	box-shadow:0 0 0 5px #fff;
	background-color:#fff;
	overflow:hidden;
	width:85.066666666666667%;
}
div.brandmovie article div.inner div.mov {
	position:relative;
	height:0;
	padding-top: -webkit-calc(9 / 16 * 100%);
	padding-top: calc(9 / 16 * 100%);
}
}

/*	.people
============================== */
div.people header h2 {
	background-position:center center;
	background-repeat:no-repeat;
}
div.people header h2 span {
	display:block;
	text-indent:110%;white-space:nowrap;overflow:hidden;
}
@media all and (min-width: 992px) {
div.people > article {
	padding:59px 0 93px;
}
div.people header h2 {
	background-image:url(../di2_img/people_h2_pc.png);
	background-size:contain;
	width:315px;
	margin:0 auto 32px;
}
div.people header h2 span {
	height:71px;
}
}
@media all and (max-width: 991.98px) {
div.people {
	margin-bottom:40px;
}
div.people > article {
	padding-bottom:24px;
}
div.people header h2 {
	position:relative;
	height:0;
	padding-top: -webkit-calc(130 / 375 * 100%);
	padding-top: calc(130 / 375 * 100%);
	background-image:url(../di2_img/people_h2_smp.png);
	background-position:center center;
	background-size:cover;
}
div.people header h2 span {
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background-size:cover;
}
}

/*	.people .btn
============================== */
div.people article .btn {
	margin:0 auto;
}
div.people article .btn a,
div.people article .btn a span,
div.people article .btn a span:after,
div.people article .btn a span:before {
	display:block;
}
div.people article .btn a {
	color:#0050ff;
	letter-spacing:0.25em;
	text-indent:0.25em;
	position: relative;
	padding: 15px;
	font-weight:700;
	font-size: 18px;
	text-align: center;
	line-height: 1;
	text-decoration:none;
	border:2px solid #0050ff;
	background-color:#fff;
	border-radius:60px;
	-webkit-transition: all 0.3s;
	transition: all 0.3s;
}
div.people article .btn a span {
	position: absolute;
	top: 50%;
	right: 15px;
	transform: translateY(-50%);
	background-color:#0050ff;
	width: 30px;
	height: 30px;
	text-indent:110%;white-space:nowrap;overflow:hidden;
	border-radius: 50%;
}
div.people article .btn a span:before,
div.people article .btn a span:after {
	content: '';
	background-color: #fff;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
div.people article .btn a span:after {
	width: 12px;
	height: 2px;
}
div.people article .btn a span:before {
	width: 2px;
	height: 12px;
}
div.people article .btn a:hover {
	color:#fff;
	background-image:url(../di2_img/logo_bg_smp.jpg);
	background-size:cover;
	background-color:#0050ff;
	background-position:center bottom;
}
div.people article .btn a:hover span {
	background-color:#fff;
}
div.people article .btn a:hover span:before,
div.people article .btn a:hover span:after {
	background-color: #0050ff;
}
.people-box ul li.is-hidden {
	visibility:hidden;
	opacity:0;
	height:0;
	margin:0;
	padding:0;
}
@media all and (min-width: 992px) {
div.people article .btn {
	width:356px;
}
}
@media all and (max-width: 991.98px) {
div.people article .btn {
	width:95%;
	max-width:356px;
}
}


/*	.recruit
============================== */
div.recruit header h2 {
	background-position:center center;
	background-repeat:no-repeat;
}
div.recruit header h2 span {
	display:block;
	text-indent:110%;white-space:nowrap;overflow:hidden;
}
@media all and (min-width: 992px) {
div.recruit > article {
	padding-bottom:93px;
}
div.recruit header h2 {
	background-image:url(../di2_img/recruit_h2_pc.png);
	background-size:contain;
	width:719px;
	margin:0 auto 32px;
}
div.recruit header h2 span {
	height:83px;
}
}
@media all and (max-width: 991.98px) {
div.recruit {
	margin-bottom:40px;
}
div.recruit > article {
	padding-bottom:24px;
}
div.recruit header h2 {
	position:relative;
	margin-bottom:0;
	height:0;
	padding-top: -webkit-calc(326 / 1514 * 100%);
	padding-top: calc(326 / 1514 * 100%);
	background-image:url(../di2_img/recruit_h2_smp.png);
	background-position:center center;
	background-size:cover;
}
div.recruit header h2 span {
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background-size:cover;
}
}
.recruit-box {
	width:980px;
	margin:auto;
}
.recruit-item {
	display:flex;
	justify-content:center;
	align-items:stretch;
}
.recruit-item > li {
	padding:0 22px;
	border-right:#b9c4d6 1px solid;
}
.recruit-item > li:last-child {
	border-right:none;
}
.recruit-item li .logo {
	margin:auto;
	height:35px;
	background-position:center center;
	background-repeat:no-repeat;
	background-size:100% auto;
}
.recruit-item li .logo span {
	display:none;
}
.recruit-item li:nth-child(1) .logo {
	width:208px;
	background-image:url(../di2_img/recruit_logo_television.png);
}
.recruit-item li:nth-child(2) .logo {
	width:171px;
	background-image:url(../di2_img/recruit_logo_sparkle.png);
}
.recruit-item li:nth-child(3) .logo {
	width:181px;
	background-image:url(../di2_img/recruit_logo_glowdia.png);
}
.recruit-item li:nth-child(4) .logo {
	width:206px;
	background-image:url(../di2_img/recruit_logo_7arcs.png);
}
.recruit-btn {
	margin-top:15px;
	display:flex;
	justify-content:center;
	align-items:center;
}
.recruit-btn > li {
	margin:0 2px;
}
.recruit-btn > li a {
	display:inline-block;
	background-color:#0050ff;
	padding:0.8em 1.0em;
	border-radius:1.0em;
	font-size:90%;
	color:#fff;
	text-decoration:none;
	font-weight:bold;
	/* hover fade */
	transition: opacity 0.2s ease-out;
}
@media (hover: hover) {
	.recruit-btn > li a:hover { opacity:0.7; }
}

@media all and (max-width: 991.98px) {
.recruit-box {
	width:auto;
}
.recruit-item {
	flex-direction:column;

}
.recruit-item > li {
	width:208px;
	margin:auto;
	padding:22px 0;
	border-right:none;
	border-bottom:#b9c4d6 1px solid;
}
}
@media all and (max-width: 991.98px) and (min-width: 501px) {
.recruit-item > li {
	width:328px;
	padding:30px 0;
}
.recruit-item li .logo {
	height:55px;
}
.recruit-item li:nth-child(1) .logo {
	width:328px;
}
.recruit-item li:nth-child(2) .logo {
	width:271px;
}
.recruit-item li:nth-child(3) .logo {
	width:288px;
}
.recruit-item li:nth-child(4) .logo {
	width:327px;
}
.recruit-btn > li {
	font-size:130%;
}
}


/*	div.bnr
============================== */
.bnr a, .bnr span {
	display:block;
}
.bnr a {
	text-decoration:none;
	background-size:cover;
	position:relative;
	height:0;
	padding-top: -webkit-calc(282 / 1000 * 100%);
	padding-top: calc(282 / 1000 * 100%);
}
.bnr a span {
	text-indent:110%;white-space:nowrap;overflow:hidden;
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
}
@media all and (min-width: 992px) {
div.bnr {
	width:800px;
	margin:96px auto;
}
ul.bnr {
	max-width:1200px;
	margin:0 auto 96px;
	display:flex;
	flex-wrap:wrap;
	gap:30px;
}
ul.bnr li {
	width:calc((100% - 30px)/2);
}
}
@media all and (max-width: 991.98px) {
.bnr {
	margin:48px 5.3333333333vw;
}
ul.bnr li:not(:last-child) {
	margin-bottom:20px;
}
}