@charset "utf-8";

/* ---------------------------------------- 
 - #maintitle
---------------------------------------- */
#maintitle {
    width: 100%;
    height: 80vw;
    max-height: 800px;
    overflow: hidden;
    box-sizing: border-box;
	position: relative;
}
#maintitle .visual {
    width: 100%;
    height: 100%;
}
#maintitle .visual picture,
#maintitle .visual img{
    width: 100%;
    height: 100%;
    vertical-align: top;
    object-fit: cover;
    font-family: 'object-fit: cover';
}
#maintitle .ttl {
	display: inline-block;
	font-size: clamp(2.4rem, 5vw, 7.2rem);
    line-height: 1.0;
	letter-spacing: 0.2em;
	position:absolute;
	bottom:75px;
	z-index:10;
	background-color: rgba(45, 86, 160, 1);
	color:#fff;
	padding: 0.1em 0.1em 0.2em 3%;
}
#maintitle .catch {
    writing-mode: vertical-rl;
    font-size: clamp(2rem, 3.5vw, 3.8rem);
    line-height: 2.2;
	color:#fff;
	letter-spacing: 0.25em;
	white-space: nowrap;
    position: absolute;
    top: 50%;
    right: 5%;
    transform: translate(0, -50%);
	z-index:3;
	margin-top: 0.4em;
	animation:fadeIn 1.7s 0.5s; 
	animation-fill-mode: both;
}
#maintitle .catch span {
    background-color: rgba(0, 0, 0, 0.55);
	padding: 0.3em 0.2em 0;
}
#maintitle .catch span:nth-child(3) {
	margin-top: 1.0em;
}
#maintitle .catch span:nth-child(5) {
	margin-top: 2.0em;
}
@media screen and (max-width: 768px) {
	#maintitle {
		height: 150vw;
	}
	#maintitle .ttl {
		line-height: 1.4;
		bottom:7vw;
	}
	#maintitle .catch {
		margin-top: 0;
	}
}

/* ---------------------------------------- 
 - .labo
---------------------------------------- */
.labo {
	margin: 200px auto 250px;
}
.labo.end {
	margin-bottom: 150px;
}
.labo .ttl {
	font-size: clamp(2rem, 3.0vw, 3.0rem);
	line-height: 3.0;
	color:#103474;	
	letter-spacing: 0.2em;
}
.anime-text {
  opacity: 0;
}
.anime-text.animated {
  opacity: 1;
}
.labo .anime-text i {
  opacity: 0;
  display: inline-block;
  animation: fadeIn-text 0.5s ease forwards;
}
@keyframes fadeIn-text {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.labo .lead {
	font-size:2.0rem;
	line-height: 2.4;
}
/* labo_lead */
.labo_lead {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	width: 90%;
	max-width: 1200px;
}
.labo_lead .ttl {
	writing-mode: vertical-rl;
    text-orientation: mixed;
    white-space: pre-wrap;
	width: 25.5%;
	letter-spacing: 0.25em;
}
.labo_lead .lead {
	width: 60.5%;
	margin-top: 140px;
}
.labo_lead .visual {
    margin: 120px -5% 0 auto;
    width: 90%;
    max-width: 880px;
}
/* labo_block_center */
.labo_block_center {
	text-align: center;
}
.labo_block_center .ttl {
	text-align: left;
	margin: 0 auto;
	display: inline-block;
}
.labo_block_center .ttl span {
	display: block;
}
#labo_chikaku .labo_block_center .ttl span:nth-child(2) { /* labo_chikaku */
	margin-left: 2.5em;
}
#labo_chikaku .labo_block_center .ttl span:nth-child(3) { /* labo_chikaku */
	margin-left: 16em;
}
#labo_shindo .labo_block_center .ttl span:nth-child(2) { /* labo_shindo */
	margin-left: 3.5em;
}
#labo_shindo .labo_block_center .ttl span:nth-child(3) { /* labo_shindo */
	margin-left: 7.5em;
}
.labo_block_center .visual_box {
	width: 90%;
	margin: 90px auto;
}
#labo_chikaku .labo_block_center .visual_box { /* labo_chikaku */
	width: 90%;
	max-width: 1140px;
}
.labo_block_center .lead {
	text-align: left;
	margin: 90px auto;
	width: 90%;
	max-width: 800px;
}
.labo_block_center .visual_flex {
	display: flex;
	justify-content: space-between;
	max-width: 1400px;
	margin: 90px auto;
}
.labo_block_center .visual_flex .visual:nth-child(1) {
	width: 54%;
	max-width: 740px;
}
.labo_block_center .visual_flex .visual:nth-child(2) {
	width: 38%;
	max-width: 515px;
	margin-top: 18%;
}
/* labo_block_center.end */
#labo_chikaku .labo_block_center.end { /* labo_chikaku */
	width: 90%;
	max-width: 850px;
}
#labo_shindo .labo_block_center.end { /* labo_shindo */
	max-width: 1400px;
}
#labo_shindo .labo_block_center.end .visual_box { /* labo_shindo */
	width: 90%;
	max-width: 1080px;
}
#labo_shindo .labo_block_center.end .visual_box .caption { /* labo_shindo */
	margin-top: 1.0em;
}
#labo_shindo .labo_block_center.end .lead { /* labo_shindo */
	width: 90%;
	max-width: 900px;
}
#labo_shindo .labo_block_center.end .visual.left { /* labo_shindo */
	width: 90%;
	max-width: 940px;
	margin-bottom: 90px;
}
#labo_shindo .labo_block_center.end .lead.right { /* labo_shindo */
	padding-left: 15%;
}
#labo_shindo .labo_block_center.end .visual.end { /* labo_shindo */
	width: 90%;
	max-width: 850px;
	margin: 0 auto;
}
/* labo_flex_left */
.labo_flex_left {
	display: flex;
	justify-content: space-between;	
	max-width: 1280px;
	width: 90%;
	margin-left: 10%;
}
.labo_flex_left .lead_box {
	width: 55%;
}
.labo_flex_left .ttl {
	margin-bottom: 2.5em;
}
.labo_flex_left .visual {
	width: 40%;
	max-width: 540px;
}
/* labo_flex_right */
.labo_flex_right {
	display: flex;
	justify-content: space-between;
	flex-direction:row-reverse;
	max-width: 1300px;
	/*width: 90%;
	text-align: center;*/
	width: 90%;
	margin-right: 10%;
}
.labo_flex_right .ttl {
	writing-mode: vertical-rl;
    text-orientation: mixed;
    white-space: pre-wrap;
	width: 20%;
	letter-spacing: 0.25em;
}
.labo_flex_right .lead_box {
	width: 74%;
	max-width: 945px;
}
.labo_flex_right .lead_box .visual {
	margin: 90px 0;
}
.labo_flex_right .lead_box .visual:nth-child(1) {
	max-width: 910px;
}
.labo_flex_right .lead_box .lead {
	width: 75%;
	max-width: 945px;
	margin: 0 auto;
}
@media screen and (max-width: 768px) {
	.labo {
		margin: 100px auto 150px;
	}
	.labo.end {
		margin-bottom: 70px;
	}
	.labo .ttl {
		letter-spacing: 0;
		line-height: 2.6;
	}
	.labo .lead {
		font-size:1.4rem;
		line-height: 2.0;
	}
	/* labo_lead */
	.labo_lead {
		display: block;
	}
	.labo_lead .ttl {
		width: auto;
        letter-spacing: 0.2em;
        margin: auto;
	}
	.labo_lead .lead {
		width: 100%;
		margin: 45px auto 0;
	}
	.labo_lead .visual {
		margin-top: 50px;
	}
	/* labo_block_center */
	.labo_block_center .ttl {
		width: 90%;
		text-align: center;
	}
	#labo_chikaku .labo_block_center .ttl span:nth-child(2) { /* labo_chikaku */
		margin-left: 0;
	}
	#labo_chikaku .labo_block_center .ttl span:nth-child(3) { /* labo_chikaku */
		margin-left: 0;
	}
	#labo_shindo .labo_block_center .ttl span:nth-child(2) { /* labo_shindo */
		margin-left: 0;
	}
	#labo_shindo .labo_block_center .ttl span:nth-child(3) { /* labo_shindo */
		margin-left: 0;
	}
	.labo_block_center .visual_box {
		margin: 45px auto;
	}
	.labo_block_center .lead {
		margin: 45px auto;
	}
	.labo_block_center.end .lead {
		width: 100%;
	}
	.labo_block_center .visual_flex {
		margin: 45px auto;
		display: block;
	}
	.labo_block_center .visual_flex .visual:nth-child(1) {
		width: 70%;
	}
	.labo_block_center .visual_flex .visual:nth-child(2) {
		width: 65%;
		margin-top: 8%;
		margin-left: auto;
	}
	/* labo_block_center.end */	
	#labo_shindo .labo_block_center.end .visual_box .caption { /* labo_shindo */
		font-size: 1.2rem;
	}
	#labo_shindo .labo_block_center.end .visual.left { /* labo_shindo */
		margin-bottom: 45px;
	}	
	#labo_shindo .labo_block_center.end .lead.right { /* labo_shindo */
		padding-left: 0;
	}	
	/* labo_flex_left */
	.labo_flex_left {
		display: block;
		margin-left: auto;
	}
	.labo_flex_left .lead_box {
		width: 100%;
	}
	.labo_flex_left .ttl {
		margin-bottom: 1.5em;
	}
	.labo_flex_left .visual {
		width: 70%;
		margin-left: auto;
		margin-top: 45px;
	}
	/* labo_flex_right */
	.labo_flex_right {
		display: block;
		margin-right: auto;
	}
	.labo_flex_right .ttl {
		width: auto;
        letter-spacing: 0.2em;
        margin: auto;
	}
	.labo_flex_right .lead_box {
		width: 100%;
	}
	.labo_flex_right .lead_box .visual {
		margin: 45px 0;
	}
	.labo_flex_right .lead_box .lead {
		width: 100%;
	}
}

/* ---------------------------------------- 
 - .profile
---------------------------------------- */
.profile {
	width: 90%;
	max-width: 1200px;
	margin: 0 auto 385px;
	border:solid 1px #103474;
	position: relative;
}
.profile::after {
	content: "";
	position: absolute;
	bottom: -295px;
	left: 0;
	right: 0;
	margin: auto;
	width: 1px;
	height: 215px;
	background-color: #103474;
}
.profile_box .box_ttl {
	text-align: right;
	padding: 30px 30px 0 0;
	font-size: 3.0rem;
	color:#103474;
}
.profile_box .ttl {
	padding: 0.05em 30px;
	font-size: 3.0rem;
	line-height: 1.6;
	letter-spacing: 0.2em;
	color:#fff;
	background-color:#103474;
	display: inline-block;
}
.profile_box .inner {
	width: 83%;
	max-width: 995px;
	margin: 0 auto 80px;
	position: relative;
}
.profile_box dl.career {
	margin: 60px auto;
	display: flex;
}
.profile_box dl.career dt {
	color:#103474;
	padding-right: 50px;
}
.profile_box dl.career dt .neme {
	font-size: 3.0rem;
}
.profile_box dl.career dt .neme span {
	font-size: 2.4rem;
}
.profile_box dl.career dt .department {
	font-size: 2.0rem;
}
.profile_box dl.career dd {
	flex:1;
	border-left:solid 1px #b8b8b8;	
	padding-left: 50px;
	font-size: 1.8rem;
}
.profile_box .catch {
	font-size:3.0rem;
	color:#103474;
	text-align: center;
	margin: 50px auto 40px;
}
.profile_box .lead {
	font-size:1.8rem;
	line-height: 2.4;
}
/* corporate_box */
.profile .corporate_box {
	border-top:solid 1px #103474;
	position: relative;
}
.profile .corporate_box .box_ttl {
	text-align: right;
	padding: 30px 30px 0 0;
	font-size: 2.4rem;
	color:#103474;
}
.profile .corporate_box .inner {
	width: 90%;
	max-width: 995px;
	margin: 0 auto 60px;
	position: relative;
}
.profile .corporate_box .ttl {
	display: flex;
	align-items: center;
	font-size: 2.8rem;
	color:#103474;
}
.profile .corporate_box .ttl img {
	width:122px;
	margin-left: 25px;
}
.profile .corporate_box .txt {
	font-size:1.8rem;
	line-height: 2.4;
	margin: 30px auto 0;
}
.profile .corporate_box ul.visual_list {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-top: 30px;
}
.profile .corporate_box ul.visual_list li {
	margin-right: 10px;
}
.profile .corporate_box ul.visual_list li:last-child {
	margin-right: 0;
}
.profile .corporate_box .caption{
	font-size:1.8rem;
	line-height: 2.4;
	margin-top: 20px;
	text-align: center;
}
@media screen and (max-width: 768px) {
	.profile {
		margin-bottom: 160px;
	}
	.profile::after {
		bottom: -130px;
		height: 100px;
	}
	.profile_box .box_ttl {
		padding: 10px 3%;
		font-size: 1.8rem;
	}
	.profile_box .ttl {
		padding: 0.05em 3%;
		font-size: 2.0rem;
		letter-spacing: 0.1em;
	}
	.profile_box .inner {
		width: 90%;
		margin-bottom: 40px;
	}
	.profile_box dl.career {
		margin: 15px auto 30px;
		display: block;
	}
	.profile_box dl.career dt {
		padding-right: 0;
	}
	.profile_box dl.career dt .neme {
		font-size: 2.2rem;
	}
	.profile_box dl.career dt .neme span {
		font-size: 1.4rem;
	}
	.profile_box dl.career dt .department {
		font-size: 1.6rem;
	}
	.profile_box dl.career dd {
		border-left:0;		
		border-top:solid 1px #b8b8b8;	
		padding-left: 0;
		padding-top: 1.0em;
		margin-top: 1.0em;
		font-size: 1.4rem;
		letter-spacing: 0.05em;
	}
	.profile_box .catch {
		font-size:1.8rem;
		margin: 30px auto;
		letter-spacing: 0;
	}
	.profile_box .lead {
		font-size:1.4rem;
		line-height: 2.0;
	}
	/* corporate_box */
	.profile .corporate_box .box_ttl {
		padding: 10px 3%;
		font-size: 1.6rem;
	}
	.profile .corporate_box .inner {
		margin-bottom: 30px;
	}
	.profile .corporate_box .ttl {
		font-size: 1.8rem;
	}
	.profile .corporate_box .ttl img {
		width:70px;
		margin-left: 10px;
	}
	.profile .corporate_box .txt {
		font-size:1.4rem;
		line-height: 2.0;
		margin-top: 15px;
	}
	.profile .corporate_box ul.visual_list {
		flex-wrap: wrap;
		align-items: stretch;
		margin-top: 20px;
	}
	.profile .corporate_box ul.visual_list li {
		width: 48%;
		margin-right: 0;
		margin-bottom: 4%;
	}
	.profile .corporate_box ul.visual_list li img {
		display: block;
		width: 100%;
		height: 100%;
		vertical-align: top;
		object-fit: cover;
		font-family: 'object-fit: cover';
	}
	.profile .corporate_box .caption{
		font-size:1.4rem;
		line-height: 2.0;
		margin-top: 10px;
	}
}

/* ---------------------------------------- 
 - .department_box
---------------------------------------- */
.department_box .ttl {
	padding: 0.3em 5% 0.4em;
	font-size: 3.6rem;
	line-height: 1.2;
	color:#fff;
	background-color:#103474;
	text-align: center;
	margin-bottom: 45px;
}
.department_box .ttl_sub {
	font-size: 7.2rem;
	font-weight: bold;
	line-height: 1.2;
	color:#103474;
	position: relative;
	text-align: center;
	margin-bottom: 100px;
}
.department_box .ttl_sub span {
	border-bottom: solid 1px #103474;
}
.department_box .inner {
	width: 86%;
	max-width: 750px;
	margin: 0 auto;
}
.department_box .inner .catch {
	font-size: 3.2rem;
	line-height: 1.6;
	color:#103474;
	margin-bottom: 40px;
	text-align: center;
}
.department_box .inner .visual {
	margin-bottom: 60px;
}
.department_box .inner .lead {
	font-size: 1.8rem;
}
.department_box .inner .visual_sub {
	margin-top: 60px;
	width: 60%;
	max-width: 480px;
	margin-left: auto;
}
.department_box .about_box {
	width: 90%;
	max-width: 1000px;
	margin: 80px auto;
	text-align: center;
	border-top: solid 1px #103474;
	border-bottom: solid 1px #103474;
	padding: 40px 5%;
}
.department_box .about_box .about_ttl {
	font-size: 2.8rem;
	line-height: 1.6;
	color:#103474;
	font-weight: bold;
	margin-bottom: 0.5em;
}
.department_box .about_box .about_name {
	font-size: 2.0rem;
	line-height: 1.6;
	margin-bottom: 0.8em;
}
.department_box .about_box .about_lead {
	text-align: left;
}
@media screen and (max-width: 768px) {
	.department_box .ttl {
		font-size: 2.2rem;
		line-height: 1.6;
		margin-bottom: 30px;
	}
	.department_box .ttl_sub {
		font-size: 2.6rem;
		line-height: 1.6;
		margin-bottom: 30px;
	}
	.department_box .inner {
		width: 86%;
	}
	.department_box .inner .catch {
		font-size: 1.8rem;
		margin-bottom: 30px;
	}
	.department_box .inner .visual {
		margin-bottom: 30px;
	}
	.department_box .inner .lead {
		font-size: 1.4rem;
	}
	.department_box .inner .visual_sub {
		margin-top: 30px;
	}
	.department_box .about_box {
		margin: 40px auto;
		padding: 20px 0;
	}
	.department_box .about_box .about_ttl {
		font-size: 1.8rem;
	}
	.department_box .about_box .about_name {
		font-size: 1.6rem;
	}
}

/* ---------------------------------------- 
 - .department_profile
---------------------------------------- */
.department_profile {
	background-color: #f4f4f4;
	padding: 60px 0;
}
.department_profile .inner {
	width: 90%;
	max-width: 1024px;
	margin: auto;
	display: flex;
	justify-content: space-between;
}
.department_profile .profile_box {
	width: 49%;
}
.department_profile .profile_box .profile_ttl {
	font-size: 1.8rem;
	line-height: 2.2;
	margin-bottom: 1.0em;
}
.department_profile .profile_box .profile_ttl > span {
	display: block;
}
.department_profile .profile_box .profile_ttl > .ttl_name {
	font-size: 2.8rem;
	font-weight: bold;
}
.department_profile .profile_box .profile_ttl > .ttl_name > span {
	font-size: 2.0rem;
}
.department_profile .profile_box dl.profile_about dt {
	border-top:solid 1px #5e5e5e;
	border-bottom:dashed 1px #929292;
	padding: 0.2em 0;
	display: flex;
	align-items: center;
	font-size: 2.0rem;
	margin-bottom: 0.8em;
}
.department_profile .profile_box dl.profile_about dt img {
	width: 43px;
	padding: 0 0.3em;
}
.department_profile .profile_box dl.profile_about dt span {
	font-size: 1.4rem;
	position: relative;
	padding-left: 1.5em;
	margin-left: 1.5em;
}
.department_profile .profile_box dl.profile_about dt span::after {
	content: "";
	position: absolute;
	top: 0;
	bottom:0;
	left: 0;
	margin: auto;
	width: 1px;
	height: 28px;
	background-color: #5e5e5e;
}
.department_profile .profile_box dl.profile_about dd .about_catch {
	font-size: 2.0rem;
	font-weight: bold;
	line-height: 1.6;
	margin-bottom: 0.5em;
}
.department_profile .profile_box dl.profile_about dd .about_lead {
	line-height: 1.6;
}
.department_profile .visual {
	width: 45%;
	max-width: 460px;
}
.department_profile .visual img,
.department_profile .visual picture{
	display: block;
	width: 100%;
    height: 100%;
    vertical-align: top;
    object-fit: cover;
    font-family: 'object-fit: cover';
}
@media screen and (max-width: 768px) {
	.department_profile {
		padding: 30px 0;
	}
	.department_profile .inner {
		display: block;
	}
	.department_profile .profile_box {
		width: 100%;
	}
	.department_profile .profile_box .profile_ttl {
		font-size: 1.6rem;
		line-height: 1.8;
	}
	.department_profile .profile_box .profile_ttl > .ttl_name {
		font-size: 2.4rem;
	}
	.department_profile .profile_box .profile_ttl > .ttl_name > span {
		font-size: 1.6rem;
	}	
	.department_profile .profile_box dl.profile_about dt {
		font-size: 1.5rem;
		letter-spacing: 0;
	}
	.department_profile .profile_box dl.profile_about dt img {
		width: 36px;
	}
	.department_profile .profile_box dl.profile_about dt span {
		font-size: 1.2rem;
		padding-left: 1.0em;
    	margin-left: 1.0em;
	}
	.department_profile .profile_box dl.profile_about dt span::after {		
		height: 20px;
	}
	.department_profile .profile_box dl.profile_about dd .about_catch {
		font-size: 1.8rem;
	}
	.department_profile .visual {
		width: 100%;
		max-width: 100%;
		height: 65vw;
		margin: 20px auto 0;
	}
}

/* ---------------------------------------- 
 - .next_btn
---------------------------------------- */
.next_btn {
	margin: 80px auto 65px;
}
.next_btn a {
	display: block;
	width: 90%;
	max-width: 800px;
	display: flex;
	flex-direction: row-reverse;
	justify-content: flex-end;
	align-items: center;
	font-size: 2.8rem;
	line-height: 1.6;
	color:#103474;
	text-decoration: none;
	transition: opacity 0.3s ease;
	border: solid 1px #103474;
	margin: auto;
	padding: 20px;
	position: relative;
}
.next_btn a:hover {
	opacity: 0.7;
}
.next_btn a .btn_ttl {
	position: absolute;
	top:20px;
	right:20px;
	line-height: 1.0;
}
.next_btn a .btn_catch {
	margin-left: 5%;
}
.next_btn a .btn_visual {
	width: 44%;
	max-width: 335px;
	margin-left: 0;
}
@media screen and (max-width: 768px) {
	.next_btn {
		margin: 60px auto 40px;
	}
	.next_btn a {
		font-size: 1.4em;
        padding: 5px;
        letter-spacing: 0;
        align-items: stretch;
	}
	.next_btn a .btn_ttl {
		top: 5px;
        right: 5px;
        font-size: 1.4rem;
	}
	.next_btn a .btn_catch {
		padding: 1.0em 0;
	}
	.next_btn a .btn_visual {
		width: 35%;
		max-width: 335px;
		margin-left: 0;
	}
	.next_btn a .btn_visual img{
		display: block;
		width: 100%;
		height: 100%;
		vertical-align: top;
		object-fit: cover;
		font-family: 'object-fit: cover';
	}
}

/* ---------------------------------------- 
 - .btn_wrap（faq_btn / back_btn）
---------------------------------------- */
.btn_wrap {
	width: 90%;
	max-width: 800px;
	display: flex;
	justify-content: space-between;
	margin: 65px auto 115px;
}
.btn_wrap a:hover {
	opacity: 0.7;
}
/* faq_btn */
.btn_wrap .faq_btn {
	width: 48%;
	max-width: 365px;
	height: 65px;
}
.btn_wrap .faq_btn a {
	border: solid 1px #333;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: opacity 0.3s ease;
}
.btn_wrap .faq_btn a img {
	width: 65%;
	max-width: 235px;
}
/* back_btn */
.back_btn {
	width: 48%;
	max-width: 365px;
}
.back_btn a {
	display: block;
	background-color: #2d56a0;
	font-size: 2.8rem;
	color:#fff;
	text-decoration: none;
	width: 100%;
	line-height: 65px;
	transition: opacity 0.3s ease;
	text-align: center;
}
@media screen and (max-width: 768px) {
	.btn_wrap {
		display: block;
		margin: 40px auto 60px;
	}
	/* faq_btn */
	.btn_wrap .faq_btn {
		width: 70%;
		height: 50px;
		margin: 30px auto;
	}
	/* back_btn */
	.back_btn {
		width: 70%;
		max-width: 365px;
		margin: auto;
	}
	.back_btn a {
		font-size: 2.0rem;
		line-height: 50px;
	}
}