@charset "UTF-8";
/* ==========================================================================
   top
   ========================================================================== */
.top_mv{
    position: relative;
    width: 100%;
    height: 800px;
}

#topMvArea {
  margin: 0; /*height: 800px;*/
}

@media only screen and (max-width:1200px) {
	#topMvArea {
	  margin: 0; height: 500px;
	}
}

@media only screen and (max-width:820px) {
	#topMvArea {
	  margin: 0; height: 575px;
	}
}
#topMvArea #topMv {
  /* opacity: 0; */
  display: block;
  width: 100%;
  height: auto;
}

@media only screen and (max-width:820px) {
	#topMvArea #topMv {
	  height: 575px;
	}
}

#topMvArea #topMvSp {
  display: none;
}

#topMvArea #topMv .items{
  width: 100%;
  height: auto;
  position: relative;
}

@media only screen and (max-width:1200px) {
	#topMvArea #topMv .items{
		  height: 500px;
	}
}

@media only screen and (max-width:820px) {
	#topMvArea #topMv .items{
	  height: 450px;
	}
}

@media only screen and (max-width:480px) {
	#topMvArea #topMv .items{
	  height: 575px;
	}
}

/*#topMvArea #topMv .items img {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
height: 100vh;
  width: 100%;
  object-fit: cover;    
}*/
#topMvArea #topMv .items img {
	height: auto;
  width: 100%;   
}

/*@media only screen and (max-width:1200px) {
	#topMvArea #topMv .items img {
		height: auto;
		object-fit: contain;    
		top: 0;
	  right: auto;
	  bottom: auto;
	  left: 0;
	}
}*/

#topMvArea #topMv .items img.is_pc{ display: block;}
#topMvArea #topMv .items img.is_sp{display: none;}
 @media (max-width: 767px) {
	 #topMvArea #topMv .items img.is_pc{ display: none;}
	#topMvArea #topMv .items img.is_sp{display: block;}
}

#topMvArea .bx-wrapper {
  max-width: 100% !important;
  margin: 0 !important;
  -moz-box-shadow: none !important;
  -webkit-box-shadow: none !important;
  box-shadow: none !important;
  border: none !important;
  background: none !important;
}
#topMvArea .bx-wrapper .bx-pager {
  position: absolute !important;
  left: 50% !important;
  bottom: 25px !important;
  width: 1200px !important;
  margin: 0 0 0 -600px !important;
  text-align: right !important;
}

@media only screen and (max-width: 1200px) {
	#topMvArea .bx-wrapper .bx-pager {
	  width: 100% !important;
	}
}

#topMvArea .bx-wrapper .bx-pager.bx-default-pager a {
  background: #FFF !important;
  border: 1px solid #666666 !important;
  width: 16px !important;
  height: 16px !important;
  margin: 0 10px !important;
  -moz-border-radius: 8px !important;
  -webkit-border-radius: 8px !important;
  border-radius: 8px !important;
  box-sizing: border-box !important;
}
#topMvArea .bx-wrapper .bx-pager.bx-default-pager a:hover,
#topMvArea .bx-wrapper .bx-pager.bx-default-pager a.active,
#topMvArea .bx-wrapper .bx-pager.bx-default-pager a:focus {
  background: #666 !important;
}


@media only screen and (max-width: 767px) {
   #topMvArea #topMvSp img {
    width: 100%;
    height: auto;
  }
   #topMvArea .bx-wrapper .bx-pager {
    width: 100% !important;
    margin: 0 0 0 -50% !important;
    text-align: center !important;
  }
}


/*-----------------------
top_news
--------------------------*/
.top_news{ width: 100%; background: #fff; padding: 140px 0 ;}
@media only screen and (max-width:820px) {
	.top_news{ padding: 70px 0 ;}
}

@media only screen and (max-width:768px) {
	.top_news{ padding: 30px 0 ;}
}

.top_news .wrap{width: 1000px; margin: 0 auto;}
	@media only screen and (max-width: 999px) {
		.top_news .wrap{width: 95%; }
	}
.top_news h2{ text-align: center; font-size: 30px; font-weight: bold; line-height: 1.8; color: #0065b3; margin-bottom: 40px;}
@media only screen and (max-width:768px) {
	.top_news h2{ font-size: 22px;margin-bottom: 20px;}
}
.news_list{ width: 100%; display: flex; justify-content: space-between; flex-wrap: wrap;}
.news_list dt{ width: 28%; color: #0065b3; font-size: 16px; line-height: 2; margin-bottom: 35px;}
@media only screen and (max-width:1200px) {
	.news_list dt{ width: 35%; }
}
@media only screen and (max-width:768px) {
	.news_list dt{ width: 100%; font-size: 12px; margin-bottom: 10px;}
}

.news_list dt span{ width: 140px; border: 1px solid #0065b3; font-size: 14px; text-align: center; padding: 3px 0; margin-left: 40px; display: inline-block; line-height: 1.1;}
@media only screen and (max-width:768px) {
	.news_list dt span{ width: 100px; font-size: 11px; margin-left: 20px; }
}
.news_list dd{ width: 68%; color: #000; font-size: 16px; line-height: 2; margin-bottom: 35px;}
@media only screen and (max-width:1200px) {
	.news_list dd{ width: 62%; }
}
@media only screen and (max-width:768px) {
	.news_list dd{ width: 100%; font-size: 14px; margin-bottom: 10px;}
}
.news_list dd a:hover{ color: #575757; opacity: 1;}
.top_news .news_link_txt{text-align: right; margin: 20px 0 0;}
.top_news .news_link_txt a{color: #0065b3; font-size: 16px; line-height: 1.8; position: relative;}
.top_news .news_link_txt a:before{ content: ""; width: 25px; height: 25px; background: url("../images/link_icon02.svg") no-repeat center center/cover; position: absolute; top: 0; bottom: 0; margin: auto; left: -30px;}

@media only screen and (max-width:768px) {
	.top_news .news_link_txt{margin: 20px 0 40px;}
.top_news .news_link_txt a{font-size: 14px; }
}
/*-----------------------
application
--------------------------*/
.top_application{
	width: 100%; position: relative; background: rgb(255,255,255);
    background: linear-gradient(90deg, rgba(255,255,255,1) 10%, rgba(118,159,200,1) 60%);
	padding: 100px 0 80px;
	margin-bottom: 200px;
}
@media only screen and (max-width:820px) {
	.top_application{
		margin-bottom: 70px;
	}
}

@media only screen and (max-width:480px) {
		.top_application{
		margin: 170px 0 70px;
    background: linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(118,159,200,1) 20%);	
			padding: 100px 0 40px;
	}
}

.top_application .img{ position: absolute; width: 45%; left: 0; top: 100px;}
.top_application .img img{ width: 100%; height: auto; max-height: 532px;  object-fit: cover; border-radius: 0 20px 20px 0;}
@media only screen and (max-width:480px) {
	.top_application .img{ width: 80%; left: 0; top: -170px;}
}

.top_application .wrap{ width: 1200px; margin: 0 auto;}
@media only screen and (max-width: 1200px) {
	.top_application .wrap{ width: 95%; }
}
.top_application .wrap .txt{ margin-left: 53%;}

@media only screen and (max-width:480px) {
	.top_application .wrap .txt{ margin-left: 15%;}
}

.top_application .wrap .txt p{color: #fff; font-size: 18px; font-weight: bold; line-height: 1.2; margin-bottom: 20px;}
@media only screen and (max-width:768px) {
	.top_application .wrap .txt p{font-size: 12px; margin-bottom: 10px;}
}

.top_application .wrap .txt h2{color: #fff; font-weight: bold; font-size: 32px; line-height: 1.8; margin-bottom: 40px;}
@media only screen and (max-width:820px) {
	.top_application .wrap .txt h2{font-size: 28px; }
}
@media only screen and (max-width:768px) {
	.top_application .wrap .txt h2{font-size: 22px; margin-bottom: 20px; }
	.top_application .wrap .txt h2 br{ display: none;}
}
.top_application .wrap .txt ul.list01{ margin-bottom: 40px;}
.top_application .wrap .txt ul.list01 li{ font-size: 20px; color: #fff; line-height: 1.8; list-style-type: disc; list-style-position: inside;}
@media only screen and (max-width:768px) {
	.top_application .wrap .txt ul.list01{ margin-bottom: 20px;}
.top_application .wrap .txt ul.list01 li{ font-size: 14px; }
}
.top_application .wrap .txt .linkbtn{width: 250px;}
.top_application .wrap .txt .linkbtn a{display: block; width: 100%; background: #fff; color: #0065b3; font-size: 18px; text-align: center; padding: 20px 0; position: relative; font-weight: bold;}
.top_application .wrap .txt .linkbtn a::before{
	 top: 0;
    bottom: 0;
    margin: auto;
    content: "";
    vertical-align: middle;
    left: 10px;
    width: 10px;
    height: 10px;
    border-top: 1px solid #0065b3;
    border-right: 1px solid #0065b3;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
	position: absolute;
}
@media only screen and (max-width:768px) {
	.top_application .wrap .txt .linkbtn{width: 60%;}
.top_application .wrap .txt .linkbtn a{font-size: 16px; padding: 10px 0; }
}

/*-----------------------
service
--------------------------*/
.top_service{
	width: 100%; position: relative; background: rgb(255,255,255);
background: linear-gradient(-90deg, rgba(255,255,255,1) 10%, rgba(240,145,177,1) 60%);
	padding: 100px 0 80px;
	margin-bottom: 200px;
}
@media only screen and (max-width:820px) {
	.top_service{
		margin-bottom: 70px;
	}
}

@media only screen and (max-width:480px) {
	.top_service{
	    background: linear-gradient(-90deg, rgba(255,255,255,1) 0%, rgba(240,145,177,1) 20%);
		padding: 100px 0 40px;
		margin: 200px 0 0;
	}
}
.top_service .img{ position: absolute; width: 45%; right: 0; top: 100px;}
@media only screen and (max-width:480px) {
	.top_service .img{ width: 80%; right: 0; top: -170px;}
}

.top_service .img img{ width: 100%; height: auto; max-height: 532px;
    object-fit: cover;
    object-position: bottom; }
.top_service .wrap{ width: 1200px; margin: 0 auto;}
@media only screen and (max-width: 1200px) {
	.top_service .wrap{ width: 95%; }
}
.top_service .wrap .txt{ margin-right: 50%;}
@media only screen and (max-width:480px) {
	.top_service .wrap .txt{ margin:0 5% 0 15%;}
}
.top_service .wrap .txt p{color: #fff; font-size: 18px; font-weight: bold; line-height: 1.2; margin-bottom: 20px;}
@media only screen and (max-width:768px) {
	.top_service .wrap .txt p{font-size: 12px; margin-bottom: 10px;}
}

.top_service .wrap .txt h2{color: #fff; font-weight: bold; font-size: 32px; line-height: 1.8; margin-bottom: 40px;}
@media only screen and (max-width:820px) {
	.top_service .wrap .txt h2{font-size: 28px; }
}
@media only screen and (max-width:768px) {
	.top_service .wrap .txt h2{font-size: 22px; margin-bottom: 20px; }
	.top_service .wrap .txt h2 br{display: none;}
}
.top_service .wrap .txt ul.list01{ margin-bottom: 40px;}
.top_service .wrap .txt ul.list01 li{ font-size: 20px; color: #fff; line-height: 1.8; list-style-type: disc; list-style-position: inside;}
@media only screen and (max-width:768px) {
	.top_service .wrap .txt ul.list01{ margin-bottom: 20px;}
	.top_service .wrap .txt ul.list01 li{ font-size: 14px; }
}

.top_service .wrap .txt .linkbtn{width: 250px;}
.top_service .wrap .txt .linkbtn a{display: block; width: 100%; background: #fff; color: #0065b3; font-size: 18px; text-align: center; padding: 20px 0; position: relative; font-weight: bold;}
.top_service .wrap .txt .linkbtn a::before{
	 top: 0;
    bottom: 0;
    margin: auto;
    content: "";
    vertical-align: middle;
    left: 10px;
    width: 10px;
    height: 10px;
    border-top: 1px solid #0065b3;
    border-right: 1px solid #0065b3;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
	position: absolute;
}

@media only screen and (max-width:768px) {
	.top_service .wrap .txt .linkbtn{width: 60%;}
.top_service .wrap .txt .linkbtn a{ font-size: 16px; padding: 10px 0; }
}

/*--------------------------
case
--------------------------*/

.top_case{
	width: 100%; background: #fff; padding: 0 0 80px;
}

@media only screen and (max-width:768px) {
	.top_case{padding: 40px 0;}
}

@media only screen and (max-width:820px) {
	.top_case .wrap{ width: 90%;}
}

.top_case h2{ text-align: center; font-size: 30px; font-weight: bold; line-height: 1.8; color: #0065b3; margin-bottom: 40px;}
@media only screen and (max-width:768px) {
	.top_case h2{  font-size: 22px; margin-bottom: 20px;}
}
.top_case .linkbtn{ width: 260px; margin: 40px auto;}
.top_case .linkbtn a{ display: block; width: 100%; background: #0065b3; text-align: center; color: #fff; font-size: 18px; padding: 20px 0; position: relative;}
.top_case .linkbtn a::before{
	 top: 0;
    bottom: 0;
    margin: auto;
    content: "";
    vertical-align: middle;
    left: 10px;
    width: 10px;
    height: 10px;
    border-top: 1px solid #fff;
    border-right: 1px solid #fff;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
	position: absolute;
}

@media only screen and (max-width:768px) {
	.top_case .linkbtn{ width: 70%; margin: 20px auto;}
	.top_case .linkbtn a{ font-size: 16px; padding: 15px 0; }
}

/* slide */
.slide-items{ padding-inline-start: 0px;}

.slide-items .slick-slide {
  margin: 20px;
  position: relative;
  overflow: hidden;
/*box-shadow: 0px 0px 3px 4px #e9e7e7;*/
	box-shadow: 0px 0px 6px 3px rgb(0 0 0 / 8%);
	height: auto !important;
}
@media only screen and (max-width:820px) {
	.slide-items .slick-slide {
	  margin: 0 20px;
	}
}

@media only screen and (max-width:768px) {
	.slide-items .slick-slide {
	  margin: 0 30px;
	}
}

.slide-items .slick-slide img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.slide-items .slick-arrow {
  width: 50px;
  height: 50px;
  border-radius: 10px;
  background-color: #9d9d9d;
  cursor: pointer;
  border: none;
  outline: none;
  font-size: 0;
  position: absolute;
  top: 0;
	bottom: 0; margin: auto;
  z-index: 1;
}
.slide-items .slick-arrow::before {
  content: '';
  display: block;
  width: 12px;
  height: 12px;
  border: 1px solid #fff;
  border-width: 3px 3px 0 0;
  position: absolute;
  top: 0;
	bottom: 0; margin: auto;
  transform: rotate(45deg);
}
.slide-items .slick-next {
  right: -40px;
}
.slide-items .slick-prev {
  left: -40px;
}
.slide-items .slick-next::before {
  left: 15px;
}
.slide-items .slick-prev::before {
  border-width: 0 0 3px 3px;
  right: 15px;
}

.slide-items .slick-arrow:hover{ background: #777777;}

@media only screen and (max-width:768px) {
	.slide-items .slick-arrow {
	  width: 30px;
	  height: 30px;
	  border-radius: 5px;
	}
	.slide-items .slick-arrow::before {
	  width: 5px;
	  height: 5px;
	}
	.slide-items .slick-next {
	  right: -10px;
	}
	.slide-items .slick-prev {
	  left: -10px;
	}
	.slide-items .slick-next::before {
	  left: 10px;
	}
	.slide-items .slick-prev::before {
	  border-width: 0 0 3px 3px;
	  right: 10px;
	}
}

.slide-items  li .img{ position: relative;}
.slide-items  li .img span{ width: 70px;  background: #fff; color: #0065b3; font-size: 14px; font-weight: bold; text-align: center; padding: 10px 0; position: absolute; top: 0; left: 0;}
.slide-items  li .txt{ padding: 20px; box-sizing: border-box;}
.slide-items  li .txt h3{ font-size: 18px; font-weight: bold; line-height: 1.6; color: #000; margin-bottom: 15px;}
.slide-items  li .txt p{ font-size: 18px; line-height: 1.4; color: #000; min-height: 48px;}
.slide-items  li .txt p.dr{font-size: 14px; margin-bottom: 15px; min-height: auto;}
.slide-items  li .txt hr{ border: none; border-bottom: 1px solid #0065b3; margin-bottom: 15px;}
.slide-items  li .txt ul.tag{ display: flex; flex-wrap: wrap; gap: 10px; margin: 15px 0; }
.slide-items  li .txt ul.tag li{ padding: 3px 10px; background: #9d9d9d; color: #fff; text-align: center; font-size: 12px;}

@media only screen and (max-width:768px) {
	.slide-items  li .img span{ width: 60px;  font-size: 12px; padding: 7px 0; }
	.slide-items  li .txt{ padding: 10px; }
	.slide-items  li .txt h3{ font-size: 16px; margin-bottom: 10px;}
	.slide-items  li .txt p{ font-size: 14px; min-height: 48px;}
	.slide-items  li .txt p.dr{font-size: 12px; margin-bottom: 10px; }
	.slide-items  li .txt hr{ margin-bottom: 10px;}
	.slide-items  li .txt ul.tag{ gap: 5px; margin: 10px 0; }
	.slide-items  li .txt ul.tag li{ padding: 3px 7px; font-size: 11px;}
}