@charset "UTF-8";
/* CSS Document */
/* CSS Document */


main .video-wrapper {
  position: relative;
  height: 65vh;
  width: 100%;
}
main .video-wrapper video {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}

main .video-wrapper .catch-copy {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: -webkit-max-content;
  height: -moz-max-content;
  height: max-content;
  text-align: center;
  color: #fff;
  margin: auto;
	letter-spacing: 0;
	text-align: center;
	text-transform: uppercase;
}


main .video-wrapper .catch-copy h2 {
 font-family: "Poppins", sans-serif;
	text-align: center;
	 font-size: calc(22px + 5.5vw);
	font-weight: 600;
	color:#00b6c9;
	margin-bottom: 50px;
	
}
main .video-wrapper .catch-copy h3 {
 font-family: "Poppins", sans-serif;
	text-align: center;
	 font-size: calc(16px + 0.3vw);
	font-weight: 600;
	line-height: 1.8;
}



.catch-copy figure {
	max-width: 30vw;
	position: absolute;
	text-align: center;
	top:40%;
	right: 0;
  left: 0;
  margin: 0 auto;
}


main .contentWrap {
	max-width: 1120px;
	margin: auto;
}



/*------------------------------------

topContent01 

------------------------------------*/

.topContent01 {
	/*--background: #14add0;--*/
background-image: linear-gradient(146deg, #00bcd4, #000264);
	padding: 50px 5% 60px 5%;
	box-sizing: border-box;
}
.topContent01 .wrap {
	max-width: 1600px;
	margin: auto;
}

.topicsHEAD {
	max-width: 1120px;
	margin: auto;
}

.topContent01 h2 {
	text-align: center;
	font-family: "Poppins", sans-serif;
	font-size: clamp(2.2rem, 4.9vw, 5.5rem);
	font-weight: 600;
	color:#fff;
	margin-bottom: 40px;
	line-height: 1.4;
}
.topContent01 h2::first-letter {
  color:#00b6c9;
}
.topContent01 h2 span {
	display: block;
	font-size: clamp(1.4rem, 1.6vw, 1.8rem);
	color:#fff;
	line-height: 1.4;
}

.topicsNAV {
	display: flex;
	justify-content: space-between;
	margin-bottom: 50px;
}
.topicsNAV li {
	width: 19.8%;
	box-sizing: border-box;
	background: #fff;
	
}
.topicsNAV li a {
	display: block;
	padding: 7px 10px;
	box-sizing: border-box;
	text-align: center;
	font-size: clamp(1.4rem, 1.6vw, 1.8rem) ;
	background: #00b6c9;
	color:#fff;
}
.topicsNAV li a:hover {
	background: #f5eb4a;
}
.topicsNAV li a.active {
	background: #f5eb4a;
	color:#222;
}


.topTOPICSLIST {
	display: flex;
	flex-wrap: wrap;
}
.topTOPICSLIST li {
	width: 24%;
	margin: 0 0.5%;
	position: relative;
	margin-bottom: 30px;
}
.topTOPICSLIST li a {
	color:#fff;
}
.topTOPICSLIST li figure {
	margin-bottom: 5px;
}
.topTOPICSLIST li figure img {
	border-radius: 10px;
	height: 210px;
	object-fit: cover;
}

.topTOPICSLIST .cate {
	position: absolute;
	font-size: clamp(1.2rem, 1.3vw, 1.4rem) ;
	text-align: center;
	color:#fff;
	 z-index: 1;
	line-height: 1;
	padding: 6px 0;
	width: 90px;
	box-sizing: border-box;
	border-bottom-right-radius: 20px;
	top:0px;
	left: 0px;
}
.topTOPICSLIST .cate.information,
.postHEAD .categoy.information 	{
	background: #104aef;
}
.topTOPICSLIST .cate.service-news,
.postHEAD .categoy.service-news	{
	background: #efa810;
}
.topTOPICSLIST .cate.other-news,
.postHEAD .categoy.other-news 	{
	background: #707070;
}
.topTOPICSLIST .cate.corporate-news,
.postHEAD .categoy.corporate-news 	{
	background: #0da36c;
}
.topTOPICSLIST .cate.recruit-news,
.postHEAD .categoy.recruit-news	{
	background: #f07677;
}
.topTOPICSLIST .date {
	font-size: clamp(1.2rem, 1.2vw, 1.3rem) ;
	
}
.topTOPICSLIST h3 {
	font-size: clamp(1.3rem, 1.5vw, 1.5rem) ;
	
}

/* 019 */
.button019 a {
	font-size: clamp(1.5rem, 1.6vw, 1.8rem) ;
    background: #f5eb4a;
    border-radius: 5px;
    position: relative;
    display: flex;
    justify-content: space-around;
    align-items: center;
    margin: 20px auto 0;
    max-width: 300px;
    padding: 10px 25px;
    color: #313131;
    transition: 0.3s ease-in-out;
    font-weight: 500;
}
.button019 a:after {
  content: "";
  position: absolute;
  top: 50%;
  bottom: 0;
  right: 2rem;
  font-size: 90%;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: right 0.3s;
  width: 6px;
  height: 6px;
  border-top: solid 2px #00b6c9;
  border-right: solid 2px #00b6c9;
  transform: translateY(-50%) rotate(45deg);
}

.button019 a:hover:after {
  right: 1.4rem;
}




/*------------------------------------

topContent02 

------------------------------------*/

.topContent02 {
	background: #fff;
	padding: 60px 0 20px 0;
	box-sizing: border-box;
	position: relative;
}

.topABOUTBOX {
	position: relative;
}

.bg-clip {
  position: absolute;
	width: 100%;
	background: #f5eb4a;
	 min-height: 550px;
	padding-bottom: 40px;
	clip-path: polygon(0 0, 100% 0, 95% 100%, 0% 100%);
}


.topABOUT {
	display: flex;
	padding: 60px 5%;
	box-sizing: border-box;
	justify-content: space-between;
	position: relative;
	z-index: 1;
}
.topABOUT .left {
	width: 35%;
}
.topABOUT .right {
	width: 60%;
}
.topABOUT .right .phbox {
	display: flex;
	width: 100%;
	justify-content: space-between;
}
.topABOUT .right .phbox figure {
	width: 32.5%;
}
.topABOUT .right .phbox figure img {
	width: 100%;
	height: 55vh;
	object-fit: cover;
}

.topContent02 h2 {
	text-align: center;
	font-family: "Poppins", sans-serif;
	font-size: clamp(2.2rem, 4.9vw, 5.5rem);
	font-weight: 600;
	margin-bottom: 20px;
	line-height: 1.4;
}
.topContent02 h2::first-letter {
  color:#00b6c9;
}

.topContent02 h2 span {
	display: block;
	font-size: clamp(1.4rem, 1.6vw, 1.8rem);
	color:#002f5d;
	line-height: 1.4;
}


.topContent02 h3 {
	text-align: center;
	font-size: clamp(2.2rem, 3.5vw, 5.5rem);
	font-weight: bold;
	line-height: 1.4;
	font-family: "Noto Serif JP", serif;
	margin-bottom: 20px;
}

.topContent02 p {
	display: block;
	font-size: clamp(1.4rem, 1.4vw, 1.6rem) !important;
	color:#002f5d;
	line-height: 1.6;
}



/* 019 */
.button020 a {
	font-size: clamp(1.5rem, 1.6vw, 1.8rem) ;
    background: #00b6c9;
    border-radius: 5px;
    position: relative;
    display: flex;
    justify-content: space-around;
    align-items: center;
    margin: 10px auto 0;
    max-width: 300px;
    padding: 10px 25px;
    color: #fff;
    transition: 0.3s ease-in-out;
    font-weight: 500;
}
.button020 a:after {
  content: "";
  position: absolute;
  top: 50%;
  bottom: 0;
  right: 2rem;
  font-size: 90%;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: right 0.3s;
  width: 6px;
  height: 6px;
  border-top: solid 2px #fff;
  border-right: solid 2px #fff;
  transform: translateY(-50%) rotate(45deg);
}

.button020 a:hover:after {
  right: 1.4rem;
}





/*------------------------------------

topContent03 

------------------------------------*/

.topContent03 {
	background: #f4f4f4;
	padding: 60px 0;
	box-sizing: border-box;
	position: relative;
}
.topContent03 h2 {
	text-align: center;
	font-family: "Poppins", sans-serif;
	font-size: clamp(2.2rem, 4.9vw, 5.5rem);
	font-weight: 600;
	color:#002f5d;
	margin-bottom: 40px;
	line-height: 1.4;
}
.topContent03 h2::first-letter {
  color:#00b6c9;
}
.topContent03 h2 span {
	display: block;
	font-size: clamp(1.4rem, 1.6vw, 1.8rem);
	color:#002f5d;
	line-height: 1.4;
}


.strengtheLIST {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin-top: 100px;
}
.strengtheLIST li {
	width: 49%;
	background: #fff;
	border-radius: 20px;
	margin-bottom: 60px;
}
.strengtheLIST li .mark {
	width: 80px;
	margin: auto;
	margin-bottom: 10px;
	margin-top: -40px;
}
.strengtheLIST li .stimg {
	width: 95%;
	margin-bottom: 10px;
}
.strengtheLIST li h3 {
	font-size: clamp(1.5rem, 2vw, 2.4rem);
	color:#002f5d;
	padding: 0 5%;
	box-sizing: border-box;
	margin-bottom: 10px;
}
.strengtheLIST li p {
	font-size: clamp(1.4rem, 1.4vw, 1.6rem);
	color:#002f5d;
	padding: 0 5%;
	box-sizing: border-box;
	margin-bottom: 20px;
	line-height: 1.5;
}

.topContent03 .button020 a {
	margin-top: -10px;
}







/*------------------------------------

topContent04

------------------------------------*/
.topContent04 {
	background: #fff;
	padding: 80px 0 120px;
	box-sizing: border-box;
	position: relative;
}

.topContent04 .head {
	
	padding: 20px 40px;
	box-sizing: border-box;
}

.topContent04 h2 {
	font-family: "Poppins", sans-serif;
	font-size: clamp(2.2rem, 4.9vw, 5.5rem);
	font-weight: 600;
	color:#002f5d;
	margin-bottom:0px;
	line-height: 1.4;
}
.topContent04 h2::first-letter {
  color:#00b6c9;
}
.topContent04 h2 span {
	font-size: clamp(1.4rem, 1.6vw, 1.8rem);
	color:#002f5d;
	line-height: 1.4;
}


.topContent04 .head h3 {
width: 50%;
	font-size: clamp(2.2rem, 3vw, 4rem);
	font-weight: bold;
	line-height: 1.4;
	font-family: "Noto Serif JP", serif;
	margin-bottom: 0px;

}

.serviceBLOCK {
	position: relative;
}
.serviceBLOCK .left {
	width: 50%;
	background: url("../../images/top/sv01.jpg") no-repeat;
	background-size: cover;
	padding: 5% 100px 5%  50px;
	box-sizing: border-box;
	float: left;
	clip-path: polygon(0 0, 100% 0, 95% 100%, 0% 100%);
}
.serviceBLOCK .right {
	width: 50%;
	background: url("../../images/top/sv02.jpg") no-repeat;
	background-size: cover;
	padding: 5% 50px 5% 100px;
	box-sizing: border-box;
	float: right;
	clip-path: polygon(5% 0, 100% 0, 100% 99%, 0% 100%);
	margin-top: -180px;
}
.serviceBLOCK h3 {
	font-size: clamp(2rem, 3vw, 3.6rem);
	margin-bottom: 20px;
	color:#fff;
	text-align: center;
}
.serviceBLOCK .left p,
.serviceBLOCK .right p {
	font-size: clamp(1.4rem, 1.4vw, 1.6rem);
	color:#fff;
	text-align: center;
}

.serviceBLOCK .bottomtxt {
	width: 50%;
	margin: 0 2% 0 auto;
	margin-top: -120px;
}

.topContent04 .button020 {
	margin-top: 20px;
}




/*------------------------------------

topContent05 

------------------------------------*/

.topContent05 {
	background: #f6f6f6;
	padding: 30px 5% 0;
	box-sizing: border-box;
	position: relative;
}
.topContent05 .Wrap {
	max-width: 1400px;
	margin: auto;
}

.topMessage {
	display: flex;
	justify-content: space-between;
}
.topMessage .left {
	width: 30%;
}
.topMessage figure {
	margin-top: -0;
	z-index: 1;
	bottom: 0;
}
.topMessage figure img {
	width: 100%;
	
}
.topMessage .right {
	width: 68%;
	display: flex;
	flex-direction: column;
  justify-content: center;

}
.topMessage .right h2 {
	font-size: clamp(2.2rem, 3vw, 4rem);
	font-weight: 600;
	line-height: 1.4;
	font-family: "Noto Serif JP", serif;
	margin-bottom: 20px;
}
.topMessage .right p {
	margin-bottom: 20px;
}

.topMessage .right .name {
	display: flex;
	justify-content: flex-end;
	margin: 0 0 0 auto;
	margin-bottom: 60px;
}
.topMessage .right .name .logo {
	width: 100px;
	margin-right: 10px;
}
.topMessage .right .name .sub {
	font-size: clamp(1.4rem, 1.4vw, 1.6rem);
	margin-right: 10px;
	position: relative;
	top:10px;
}

.topContent05 .button020 {
	margin-bottom: 40px;
}


/*------------------------------------

topContent06 

------------------------------------*/

.topContent06 {
	background: #f5eb4a;
	padding: 50px 0 50px;
	box-sizing: border-box;
}
.topContent06 .topRECRUIT {
	display: flex;
	justify-content:space-between;
}

.topContent06 .topRECRUIT .left {
	width: 60%;
	position: relative;
	
}
.topContent06 .topRECRUIT .right {
	width: 40%;
}
.topContent06 .topRECRUIT .right figure {
	width: 60%;
	margin: auto;
	margin-bottom: 30px;
}


.recmov {
  width: 100%;
  aspect-ratio: 16 / 9;
	padding: 0;
	margin: 0;
}
.recmov video {
  width: 100%;
  height: 100%;
	padding: 0;
	margin: 0;
}
.topContent06 .topRECRUIT .left .recCOPY {
	position: absolute;
	width: 80%;
	right: 0;
  left: 0;
  margin: 0 auto;
	bottom:-20px;
}

	.spdaihyo {
		display: none;
	}

/*------------------------------------

topContent07 

------------------------------------*/

.topContent07 {
	background: #f6f6f6;
	padding: 50px 5% 70px;
	box-sizing: border-box;
}
.topContent07 .wrap {
	max-width: 1400px;
	margin: auto;
}
.topGROUP  {
	position: relative;
	
	
}
.topContent07 .topGROUP .left {
	width: 70%;
	position: relative;
	float: left;
	
}
.topContent07 .topGROUP .right {
	width:40%;
	float: right;
	right:0;
	position: absolute;
	margin-top: -90px;
}
.topContent07 .topGROUP .left h2 {
font-size: clamp(2.2rem, 3vw, 4.5rem);
}
.topContent07 .topGROUP .left h2 span {
font-size: clamp(3rem, 4vw, 7rem);
	 font-family: "Bebas Neue", sans-serif;
	margin: 0 5px;
	color:#00b6c9;
}
.topContent07 .topGROUP .left h3 {
font-size: clamp(1.8rem, 2.5vw, 3.5rem);
	margin-bottom: 15px;
}

.topContent07 .button020 {
	margin-top: 30px;
}

/*------------------------------------

topContent08 

------------------------------------*/

.topContent08 {
	background: #fff;
	padding: 20px 5%;
	box-sizing: border-box;
}
.logoBOX {
	display: flex;
	justify-content:space-between;
}
.logoBOX li {
	width: 12.2%;
}






@media screen and (max-width: 834px){

main .video-wrapper {
  position: relative;
  height: 55vh;
  width: 100%;
}
main .video-wrapper video {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}

main .video-wrapper .catch-copy {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: -webkit-max-content;
  height: -moz-max-content;
  height: max-content;
  text-align: center;
  color: #fff;
  margin: auto;
	letter-spacing: 0;
	text-align: center;
	text-transform: uppercase;
}


main .video-wrapper .catch-copy h2 {
 font-family: "Poppins", sans-serif;
	text-align: center;
	 font-size: calc(22px + 5.5vw);
	font-weight: 600;
	color:#00b6c9;
	margin-bottom: 20px;
	
}
main .video-wrapper .catch-copy h3 {
 font-family: "Poppins", sans-serif;
	text-align: center;
	 font-size: calc(16px + 0.3vw);
	font-weight: 600;
	line-height: 1.8;
}



.catch-copy figure {
	max-width: 55vw;
	position: absolute;
	text-align: center;
	top:20%;
	right: 0;
  left: 0;
  margin: 0 auto;
}

	
/*------------------------------------

topContent01 SP

------------------------------------*/

.topContent01 {
	padding: 30px 5% 30px 5%;
	box-sizing: border-box;
}
.topContent01 .wrap {
	max-width: 1600px;
	margin: auto;
}

.topicsHEAD {
	max-width: 1120px;
	margin: auto;
}

.topContent01 h2 {
	text-align: center;
	font-family: "Poppins", sans-serif;
	font-size: clamp(2.8rem, 4.9vw, 5.5rem);
	font-weight: 600;

	margin-bottom: 20px;
	line-height: 1.4;
}
.topContent01 h2::first-letter {

}
.topContent01 h2 span {
	display: block;
	font-size: clamp(1.4rem, 1.6vw, 1.8rem);

	line-height: 1.4;
}

.topicsNAV {
    display: flex;
    gap: 3px; /* 各メニューの間隔 */
    overflow-x: auto;
    white-space: nowrap;
    padding-bottom: 15px;
    -webkit-overflow-scrolling: touch; /* スムーズスクロール */
	margin-bottom: 20px;
  }

  .topicsNAV li {
    width: auto; /* 均等幅を解除 */
    flex: 0 0 auto; /* 横スクロールに必要 */
  }

  .topicsNAV li a {
    padding: 5px 16px;
    display: block;
    white-space: nowrap; /* 折り返し防止 */
	  font-size: clamp(1.3rem, 1.6vw, 1.8rem) ;
  }
	
	
.topicsNAV li a:hover {
	background: #f5eb4a;
}
.topicsNAV li a.active {
	background: #f5eb4a;
}
	
/* スクロールバー全体 */
.topicsNAV::-webkit-scrollbar {
  height: 6px;   /* 横スクロールなので高さを指定 */
}

/* スクロールバーの背景部分 */
.topicsNAV::-webkit-scrollbar-track {
  background: #ffffff; /* 白 */
}

/* スクロールバーのつまみ部分 */
.topicsNAV::-webkit-scrollbar-thumb {
  background: #cccccc; /* うっすらグレー（白すぎると見えないため） */
  border-radius: 3px;
}

/* つまみにホバーした時 */
.topicsNAV::-webkit-scrollbar-thumb:hover {
  background: #bbbbbb;
}


.topTOPICSLIST {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.topTOPICSLIST li {
	width: 49%;
	margin: 0 0;
	position: relative;
	margin-bottom: 20px;
}
.topTOPICSLIST li a {
	color:#fff;
}
.topTOPICSLIST li figure {
	margin-bottom: 5px;
}
.topTOPICSLIST li figure img {
	border-radius: 6px;
	height: 110px;
	object-fit: cover;
}

.topTOPICSLIST .cate {
	position: absolute;
	font-size: clamp(1rem, 1.5vw, 1.5rem) ;
	text-align: center;
	color:#fff;
	 z-index: 1;
	line-height: 1;
	padding: 5px 5px;
	width: 70px;
	box-sizing: border-box;

}
.topTOPICSLIST .cate.cate01 {
	background: #024c92;
}
.topTOPICSLIST .cate.cate02 {
	background: #f0a727;
}
.topTOPICSLIST .cate.cate03 {
	background: #019787;
}
.topTOPICSLIST .cate.cate04 {
	background: #e77576;
}
.topTOPICSLIST .date {
	font-size: clamp(1rem, 1.3vw, 1.4rem) ;
	
}
.topTOPICSLIST h3 {
	font-size: clamp(1.3rem, 1.5vw, 1.6rem) ;
	display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
	
}

/* 019 */
.button019 a {
	font-size: clamp(1.5rem, 1.6vw, 1.8rem) ;
    background: #f5eb4a;
    position: relative;
    display: flex;
    justify-content: space-around;
    align-items: center;
    margin: 20px auto 0;
    max-width: 300px;
    padding: 10px 25px;
    color: #313131;
    transition: 0.3s ease-in-out;
    font-weight: 500;
}
.button019 a:after {
  content: "";
  position: absolute;
  top: 50%;
  bottom: 0;
  right: 2rem;
  font-size: 90%;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: right 0.3s;
  width: 6px;
  height: 6px;
  border-top: solid 2px #00b6c9;
  border-right: solid 2px #00b6c9;
  transform: translateY(-50%) rotate(45deg);
}

.button019 a:hover:after {
  right: 1.4rem;
}




/*------------------------------------

topContent02 

------------------------------------*/

.topContent02 {
	background: #fff;
	padding: 30px 0 20px 0;
	box-sizing: border-box;
	position: relative;
}

.topABOUTBOX {
	position: relative;
	background: #f5eb4a;
}

.bg-clip {
  position: absolute;
	width: 100%;
	background: #f5eb4a;
	 min-height: auto;
	padding-bottom: 20px;
	clip-path: polygon(0 0, 100% 0, 95% 100%, 0% 100%);
}


.topABOUT {
	display: flex;
	flex-direction: column-reverse;
	padding: 30px 5%;
	box-sizing: border-box;
	justify-content: space-between;
	position: relative;
	z-index: 1;
}
.topABOUT .left {
	width: auto;
}
.topABOUT .right {
	width: auto;
	margin-bottom: 15px;
	margin-top: -40px;
}
.topABOUT .right .phbox {
	display: flex;
	width: 100%;
	justify-content: space-between;
}
.topABOUT .right .phbox figure {
	width: 32.5%;
}
.topABOUT .right .phbox figure img {
	width: 100%;
	height: 20vh;
	object-fit: cover;
}

.topContent02 h2 {
	text-align: center;
	font-family: "Poppins", sans-serif;
	font-size: clamp(2.8rem, 4.9vw, 5.5rem);
	font-weight: 600;
	margin-bottom: 10px;
	line-height: 1.4;
}
.topContent02 h2::first-letter {
  color:#00b6c9;
}

.topContent02 h2 span {
	display: block;
	font-size: clamp(1.4rem, 1.6vw, 1.8rem);
	color:#002f5d;
	line-height: 1.4;
}


.topContent02 h3 {
	text-align: center;
	font-size: clamp(2.4rem, 3.5vw, 5.5rem);
	font-weight: bold;
	line-height: 1.4;
	font-family: "Noto Serif JP", serif;
	margin-bottom: 10px;
}

.topContent02 p {
	display: block;
	font-size: clamp(1.4rem, 1.4vw, 1.6rem) !important;
	color:#002f5d;
	line-height: 1.6;
}



/* 019 */
.button020 a {
	font-size: clamp(1.5rem, 1.6vw, 1.8rem) ;
    background: #00b6c9;
    position: relative;
    display: flex;
    justify-content: space-around;
    align-items: center;
    margin: 10px auto 0;
    max-width: 300px;
    padding: 10px 25px;
    color: #fff;
    transition: 0.3s ease-in-out;
    font-weight: 500;
}
.button020 a:after {
  content: "";
  position: absolute;
  top: 50%;
  bottom: 0;
  right: 2rem;
  font-size: 90%;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: right 0.3s;
  width: 6px;
  height: 6px;
  border-top: solid 2px #fff;
  border-right: solid 2px #fff;
  transform: translateY(-50%) rotate(45deg);
}

.button020 a:hover:after {
  right: 1.4rem;
}





/*------------------------------------

topContent03 

------------------------------------*/

.topContent03 {
	background: #f4f4f4;
	padding: 30px 5%;
	box-sizing: border-box;
	position: relative;
}
.topContent03 h2 {
	text-align: center;
	font-family: "Poppins", sans-serif;
	font-size: clamp(2.8rem, 4.9vw, 5.5rem);
	font-weight: 600;
	color:#002f5d;
	margin-bottom: 20px;
	line-height: 1.4;
}
.topContent03 h2::first-letter {
  color:#00b6c9;
}
.topContent03 h2 span {
	display: block;
	font-size: clamp(1.4rem, 1.6vw, 1.8rem);
	color:#002f5d;
	line-height: 1.4;
}


.strengtheLIST {
	display: flex;
	flex-direction: column;
	flex-wrap: wrap;
	justify-content: space-between;
	margin-top: 50px;
}
.strengtheLIST li {
	width: 100%;
	background: #fff;
	border-radius: 10px;
	margin-bottom: 20px;
}
.strengtheLIST li .mark {
	width: 70px;
	margin: auto;
	margin-bottom: 10px;
	margin-top: -30px;
}
.strengtheLIST li .stimg {
	width: 95%;
	margin-bottom: 10px;
}
.strengtheLIST li h3 {
	font-size: clamp(1.8rem, 2vw, 2.4rem);
	color:#002f5d;
	padding: 0 5%;
	box-sizing: border-box;
	margin-bottom: 10px;
}
.strengtheLIST li p {
	font-size: clamp(1.4rem, 1.4vw, 1.6rem);
	color:#002f5d;
	padding: 0 5%;
	box-sizing: border-box;
	margin-bottom: 20px;
	line-height: 1.5;
}

.topContent03 .button020 a {
	margin-top: -10px;
}



/*------------------------------------

topContent04

------------------------------------*/
.topContent04 {
	background: #fff;
	padding: 30px 0 30px;
	box-sizing: border-box;
	position: relative;
}

.topContent04 .head {
	padding: 0px 5%;
	box-sizing: border-box;
}

.topContent04 h2 {
	font-family: "Poppins", sans-serif;
	font-size: clamp(2.8rem, 4.9vw, 5.5rem);
	font-weight: 600;
	color:#002f5d;
	margin-bottom:10px;
	line-height: 1.4;
}
.topContent04 h2::first-letter {
  color:#00b6c9;
}
.topContent04 h2 span {
	font-size: clamp(1.4rem, 1.6vw, 1.8rem);
	color:#002f5d;
	line-height: 1.4;
}


.topContent04 .head h3 {
width: 100%;
	font-size: clamp(2rem, 3vw, 4rem);
	font-weight: bold;
	line-height: 1.4;
	font-family: "Noto Serif JP", serif;
	margin-bottom: 20px;

}

.serviceBLOCK {
	position: relative;
	
}
.serviceBLOCK .left {
	width: 100%;
	background: url("../../images/top/sv01.jpg") no-repeat;
	background-size: cover;
	padding: 5% 10%;
	box-sizing: border-box;
	float: none;
	clip-path: polygon(0 0, 100% 0, 95% 100%, 0% 100%);
	margin-bottom: 10px;
}
.serviceBLOCK .right {
	width: 100%;
	background: url("../../images/top/sv02.jpg") no-repeat;
	background-size: cover;
	padding: 5% 10%;
	box-sizing: border-box;
	float: none;
	clip-path: polygon(5% 0, 100% 0, 100% 99%, 0% 100%);
	margin-top: 0px;
}
.serviceBLOCK h3 {
	font-size: clamp(2rem, 3vw, 3.6rem);
	margin-bottom: 10px;
	color:#fff;

}
.serviceBLOCK .left p,
.serviceBLOCK .right p {
	font-size: clamp(1.4rem, 1.4vw, 1.6rem);
	color:#fff;
}

.serviceBLOCK .bottomtxt {
	width: 100%;
	margin: 0 0 0 0;
	padding: 0 5%;
	box-sizing: border-box;
	font-size: clamp(1.4rem, 1.4vw, 1.6rem);
	line-height: 1.5;
	margin-top: 10px;
}

.topContent04 .button020 {
	margin-top: 10px;
	margin-bottom: 5px;
}




/*------------------------------------

topContent05 

------------------------------------*/

.topContent05 {
	background: #f6f6f6;
	padding: 30px 5% 30px;
	box-sizing: border-box;
}
.topContent05 .Wrap {
	max-width: 1400px;
	margin: auto;
}

.topMessage {
	display: flex;
	justify-content: space-between;
}
.topMessage .left {
	width: auto;
	display: none;
}
.topMessage figure {
	margin-top: 0px;
	position: relative;
	z-index: 1;
}
.topMessage .right {
	width: auto;
	display: block;
	flex-direction: column;
  justify-content: center;
}
.topMessage .right h2 {
	font-size: clamp(1.8rem, 3vw, 4rem);
	font-weight: 600;
	line-height: 1.4;
	font-family: "Noto Serif JP", serif;
	margin-bottom: 10px;
}
.topMessage .right p {
	margin-bottom: 20px;
}

.topMessage .right .name {
	display: flex;
	justify-content: flex-end;
	margin: 0 0 0 auto;
	margin-bottom: 30px;
	margin-top: -20px;
}
.topMessage .right .name .logo {
	width: 40px;
	margin-right: 10px;
}
.topMessage .right .name .sub {
	font-size: clamp(1.2rem, 1.4vw, 1.6rem);
	margin-right: 5px;
	position: relative;
	top:10px;
}
	
.topMessage .right .name .sign {
		display: block;
	width: 30%;
	}
	
	.spdaihyo {
		display: block;
		float: left;
		width: 40%;
		margin-right: 10px;
	}


/*------------------------------------

topContent06 

------------------------------------*/

.topContent06 {
	background: #f5eb4a;
	padding: 30px 0 30px;
	box-sizing: border-box;
}
.topContent06 .topRECRUIT {
	display: flex;
	flex-direction: column;
	justify-content:space-between;
}

.topContent06 .topRECRUIT .left {
	width: auto;
	position: relative;
	
}
.topContent06 .topRECRUIT .right {
	width: 100%;
}
.topContent06 .topRECRUIT .right figure {
	width: 90%;
	margin: auto;
	margin-bottom: 10px;
	margin-top: 20px;
}


.recmov {
  width: 100%;
  aspect-ratio: 16 / 9;
	padding: 0;
	margin: 0;
}
.recmov video {
  width: 100%;
  height: 100%;
	padding: 0;
	margin: 0;
}
.topContent06 .topRECRUIT .left .recCOPY {
	position: absolute;
	width: 90%;
	right: 0;
  left: 0;
  margin: 0 auto;
	bottom:0px;
}

/*------------------------------------

topContent07 

------------------------------------*/

.topContent07 {
	background: #f6f6f6;
	padding: 30px 5% 30px;
	box-sizing: border-box;
}
.topContent07 .wrap {
	max-width: 1400px;
	margin: auto;
}
.topGROUP  {
	position: relative;
	
	
}
.topContent07 .topGROUP .left {
	width: auto;
	position: relative;
	float: left;
	
}
.topContent07 .topGROUP .right {
	width:55%;
	float: right;
	right:0;
	position: absolute;
	margin-top: -50px;
	right:-60px;
}
.topContent07 .topGROUP .left h2 {
font-size: clamp(2.6rem, 3vw, 4.5rem);
	line-height: 1.2;
	margin-bottom: 15px;
}
.topContent07 .topGROUP .left h2 span {
font-size: clamp(4rem, 4vw, 7rem);
	 font-family: "Bebas Neue", sans-serif;
	margin: 0 5px;
	color:#00b6c9;
}
.topContent07 .topGROUP .left h3 {
font-size: clamp(1.7rem, 2.5vw, 3.5rem);
	margin-bottom: 15px;
}

.topContent07 .button020 {
	margin-top: 15px;
}

/*------------------------------------

topContent08 

------------------------------------*/

.topContent08 {
	background: #fff;
	padding: 15px 5% 0px 5%;
	box-sizing: border-box;
}
.logoBOX {
	display: flex;
	flex-wrap: wrap;
	justify-content:center;
}
.logoBOX li {
	width: 32%;
	margin-bottom: 10px;
}

	
}


/* 初期状態（透明＋上に少しずらす） */
.scroll-fade {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.5s ease-out, transform 0.5s ease-out;
}

/* フェードイン後 */
.scroll-fade.show {
  opacity: 1;
  transform: translateY(0);
}

/* 初期状態（透明 & 下に少しずらす） */
.fadein {
  opacity: 0;
  transform: translateY(20px); /* 浮き上がり感を強くする */
  transition: opacity 1s ease-out, transform 1s ease-out;
}
/* フェードイン状態 */
.fadein.in-view {
  opacity: 1;
  transform: translateY(0);
}


/* 初期状態：透明＋右にズレている */
.slide-right {
  opacity: 0;
  transform: translateX(40px);
  transition: opacity 0.5s ease-out, transform 0.5s ease-out;
}

/* スライドイン後 */
.slide-right.show {
  opacity: 1;
  transform: translateX(0);
}

/* 初期状態：透明＋左にズレている */
.slide-left {
  opacity: 0;
  transform: translateX(-40px);
  transition: opacity 0.5s ease-out, transform 0.5s ease-out;
}

/* スライドイン後（表示状態） */
.slide-left.show {
  opacity: 1;
  transform: translateX(0);
}












