:root {
  --labolatory: #00A6B7;
  --project: #00B86E;
  --conference: #5135b4;
  --manufacturing: #B86E00;
  --construction: #A5B800;
  --hospital: #0049B8;
}


/* color */
.text-lab {
	color: var(--labolatory) !important;
}
.bg-lab {
	background-color: var(--labolatory) !important;
}
.text-proj {
	color: var(--project) !important;
}
.bg-proj {
	background-color: var(--project) !important;
}
.text-conf {
	color: var(--conference) !important;
}
.bg-conf {
	background-color: var(--conference) !important;
}
.text-const {
	color: var(--construction) !important;
}
.bg-const {
	background-color: var(--construction) !important;
}
.text-hosp {
	color: var(--hospital) !important;
}
.bg-hosp {
	background-color: var(--hospital) !important;
}
.text-mfg {
	color: var(--manufacturing) !important;
}
.bg-mfg {
	background-color: var(--manufacturing) !important;
}
.text-disabled {
	color: #BBB !important;
}


/* list-style */
ul.styled {
  list-style-type: none;
  margin: 0 0 30px 0;
  padding: 0;
}
ul.styled li {
  text-indent: -1em;
  padding-left: 1em;
  margin-bottom: 5px;
}
ul.styled li:before {
   content:  "";
   width:  10px;
   height:  10px;
   display:  inline-block;
   background-color: #0b2a59;
   border-radius:  50%;
   position:  relative;
   top: -1px;
   margin-right: 0.5em;
}
ol.styled {
  counter-reset: number;
  list-style-type: none;
  margin: 0;
  padding: 0;
}
ol.styled li {
  text-indent: -1.5em;
  padding-left: 1.5em;
  margin-bottom: 5px;
}
ol.styled li:before {
  counter-increment: number;
  content: counter(number)".";
  font-weight: 500;
  color: #0b2a59;
  margin-right: 0.5em;
}

dl.styled dt {
  color: #0b2a59;
  font-weight: 700;
  padding-bottom: 0.5em;
}
dl.styled dd {
  margin-bottom: 0.75em;
  padding-bottom: 0.75em;
  border-bottom: dotted 1px #999;
}

/* media-links */
.vertical-item .item-media + .item-content {
  padding-top: 20px
}
.item-media {
  overflow: hidden;
  position: relative
}
.item-media img {
  width: 100%
}
.media-links {
  bottom: 0;
  left: 0;
  position: absolute;
  right: 0;
  text-align: center;
  top: 0
}
.media-links div {
  margin-top: -30px;
  position: absolute;
  top: 50%;
  width: 100%;
  z-index: 4
}
.media-links:before {
  background-color: rgba(91, 131, 205, .3);
  border-radius: 5px 5px 0 0;
  bottom: 0;
  content: "";
  left: 0;
  opacity: 0;
  position: absolute;
  right: 0;
  top: 0;
  -webkit-transition: all .2s linear;
  transition: all .2s linear
}
[class*=-item]:hover .media-links:before {
  opacity: .6
}
.media-links a.abs-link {
  bottom: 0;
  left: 0;
  opacity: 0;
  position: absolute;
  right: 0;
  top: 0
}
[class*=-item]:hover .media-links a.abs-link {
  opacity: 1
}
[class*=-item]:hover .media-links div {
  filter: alpha(opacity=100);
  opacity: 1
}
.media > img {
  display: block
}
.media-body h3, .media-body h4 {
  line-height: 1;
  margin-bottom: .2em;
  margin-top: .3em
}
* + .media-body, .media-body + * {
  margin-left: 20px
}
.media .media-body > p:first-child {
  margin-top: -.2em
}

/* NEWS */
.topics dl {
  margin-top: 15px;
  padding: 0 0 5px 0;
  border-bottom: 1px solid #ccc;
}
.topics dt, .topics dd {
  font-size: 1rem;
}
.topics dd {
  margin: 1.25em 0;
  line-height: 1.6em;
  color: #000;
  font-weight: 500;
}
.topics dd a {
  color: #000;
}
.topics dd a:hover {
  color: #666!important;
}
.badge-topics {
  color: #111;
  font-size: 0.75rem;
  width: 8em;
  margin-left: 3em;
  padding: 0.75em;
  background-color: #e3e300;
  border-radius: 0;
}
@media screen and (min-width: 768px) {
  .topics dt {
    clear: left;
    float: left;
    width: 16em;
  }
  .topics dd {
    margin-left: 18em;
  }
}

.topics .accordion-button {
	padding: 0;
	border: 0;
}
.topics .accordion-button:not(.collapsed) {
	color: #222;
	background-color: #fff;
	box-shadow: inset 0 rgba(0, 0, 0, 0);
}
.topics .accordion-button:not(.collapsed)::after {
	background-image: url(/../images/topics-accordion-button.png);
	transform: rotate(-180deg);
}
.topics .accordion-button::after {
	background-image: url(/../images/topics-accordion-button.png);
}
.topics .accordion-button:focus {
	border-color: rgba(0, 0, 0, 0);
	box-shadow: 0 0 0 0.25rem rgba(0, 0, 0, 0);
}
.topics .accordion-body {
	padding: 1rem 0;
}

/* OUTLINE */
.outline dl {
  border-bottom: 1px solid #ccc;
  margin: 0;
}
.outline dt, .outline dd {
  font-size: 1rem;
}
.outline dt {
  color: #00a6b7;
}
.outline dd {
  margin: 1em 0;
  line-height: 1.6em;
}
.outline dd a {
  color: #000;
}
.outline dd a:hover {
  color: #666;
}
@media screen and (min-width: 768px) {
  .outline dt {
    clear: left;
    float: left;
    width: 10em;
  }
  .outline dd {
    margin-left: 12em;
  }
}

/* SERVICE */
.service-part {
  z-index: 0
}
.service-part .service-image img {
  border: 10px solid #fff;
  border-radius: 50%;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, .1);
  max-width: 270px
}
.service-part .service-title {
  margin-right: -13px
}
@media(max-width:991px) {
  .service-part .service-title {
    -webkit-align-items: center;
    align-items: center;
    -webkit-box-align: center;
    -webkit-box-pack: end;
    -webkit-justify-content: end;
    justify-content: end;
    margin-bottom: -25px;
    margin-right: 0
  }
}
@media(max-width:991px) {
  .service-part .service-title {
    -webkit-box-pack: center !important;
    -webkit-justify-content: center !important;
    justify-content: center !important
  }
}
.service-part .service-title h1 {
  font-size: 40px;
  margin-bottom: 0;
  margin-top: -13px;
}
@media(max-width:991px) {
  .service-part .service-title h1 {
    font-size: 21px
  }
}
@media(min-width:991px) and (max-width:1300px) {
  .service-part .service-title h1 {
    font-size: 32px
  }
}
.service-part .service-title h6 {
  margin: 0 6px 0 0
}
.service-part .service-title span {
  -webkit-background-clip: text;
  font-family: "Urbanist", sans-serif;
  font-size: 180px;
  font-weight: 700;
  left: -30%;
  line-height: initial;
  position: absolute;
  -webkit-text-fill-color: transparent;
  top: -100%;
  width: 100%;
  z-index: -1
}
@media(max-width:991px) {
  .service-part .service-title span {
    font-size: 100px;
    line-height: 1;
    margin-right: 10px;
    position: static !important;
    -webkit-transform: none !important;
    -ms-transform: none !important;
    transform: none !important
  }
}
@media(min-width:991px) and (max-width:1300px) {
  .service-part .service-title span {
    font-size: 150px
  }
}
.service-part .service03 .service-title span {
  letter-spacing: -5px;
}
.service-part .service05 .service-title span {
  letter-spacing: -10px;
}
.service-part .service02 .service-title span {
  left: 50%;
  letter-spacing: -10px;
  -webkit-transform: translateY(3%);
  -ms-transform: translateY(3%);
  transform: translateY(3%)
}
.service-part .service04 .service-title span {
  left: 45%;
  letter-spacing: -10px;
  -webkit-transform: translateY(2%);
  -ms-transform: translateY(2%);
  transform: translateY(2%)
}
.service-part .service06 .service-title span {
  left: 45%;
  letter-spacing: -10px;
  -webkit-transform: translateY(2%);
  -ms-transform: translateY(2%);
  transform: translateY(2%)
}
.service-part .color1 {
  background-image: -webkit-linear-gradient(left, #bdc6d3 0%, #d5d7da 100%);
  background-image: linear-gradient(to right, #bdc6d3 0%, #d5d7da 100%)
}
@media(max-width:767px) {
  .service-part .service-text {
    font-size: 16px
  }
}
@media(max-width:767px) {
  .service-part .service-title span.small-width {
    width: 35% !important
  }
}
@media(max-width:991px) {
  .service-part .service-title span.small-width {
    letter-spacing: -8px !important;
    width: 20%
  }
}
.nav-link {
  color: #555;
}
.mega-menu-style-2 .mega-menu-title > div.menu-link {
  color: #00a6b7 !important;
}
.product-system a:hover {
  opacity: 0.7;
  filter: drop-shadow(5px 5px 5px rgba(255, 255, 255, 0.6));
}
.product.memamore .product-title h3,
.product.memamore .product-title h4,
.product.memamore .product-title h5 {
  color: #407c37;
}
.product.memamore .product-title h5 a:hover,
.product.memamore .product-title h5 a:hover small,
.single-product .memamore .product-title h2 a:hover  {
  color: #407c37 !important;
}
.memamore.brdr .container {
  border: 10px solid rgba(64, 124, 55, 0.75);
  padding: 30px;
}



.button-memamore-wrap {
  /* justify-content: space-around; */
  justify-content: center;
}

.button-memamore-menu {
  background-color: transparent;
  background-color: #407c37;
  padding: 6px 20px;
  color: #0b2a59;
  color: #fff;
  transition: all .2s ease-in-out!important;
  text-shadow: none;
  width: 190px;
  display: block;
  box-shadow: 0px 2px 5px 0px rgba(4, 57, 118, 0.5);
  margin: 10px;
}
.button-memamore-menu span {
  font-weight: bold!important;
  font-size: 14px!important;
}

.button-memamore-menu:hover {
  background-color: #407c37c3;
  color: #ffffff;
}

.button-memamore-menu:nth-child(6) {
  display: none;
}

@media screen and (max-width:767px) {
  .button-memamore-menu {
    width: 140px;
  }
  .button-memamore-menu {
    margin: 5px;
  }
  .button-memamore-menu:nth-child(6) {
    display: block;
    visibility: hidden;
  }
}
.button-webdesign-menu {
  background-color: transparent;
  background-color: #00A6B7;
  padding: 6px 10px;
  color: #0b2a59;
  color: #fff;
  transition: all .2s ease-in-out!important;
  text-shadow: none;
  width: 190px;
  display: block;
  box-shadow: 0px 2px 5px 0px rgba(4, 57, 118, 0.5);
  margin: 10px;
}
.button-webdesign-menu span {
  font-weight: bold!important;
  font-size: 14px!important;
}

.button-webdesign-menu:hover {
  background-color: #00707c;
  color: #ffffff;
}

.button-webdesign-menu:nth-child(6) {
  display: none;
}

@media screen and (max-width:767px) {
  .button-webdesign-menu {
    width: 140px;
  }
  .button-webdesign-menu {
    margin: 5px;
  }
  .button-webdesign-menu:nth-child(6) {
    display: block;
    visibility: hidden;
  }
}


span.fee{
    color: #407c37;
}
ol.ol-green {
  counter-reset: ol_li;
}
ol.ol-green li:before {
  margin-right: .25em;
  counter-increment: ol_li;
  content: counter(ol_li);
  color: #407c37;
}
.fc-green {
  color: #407c37;
}
.material-symbols-outlined {
	color: #333333!important;
	font-size: 48px;
	vertical-align: middle;
}
@media screen and (max-width:  767.98px) {
	.material-symbols-outlined {
	font-size: 30px;
}
}
.number-title {
  position: relative;
}
.number-title::before {
  content: attr(data-number);
  position: absolute;
  left: 0;
  transform: translateY(-50%);
  color: rgba(0, 0, 0, 0.1);
  font-size: 180px;
}
.number-title-right {
  position: relative;
}
.number-title-right::before {
  content: attr(data-number);
  position: absolute;
  right: 0;
  transform: translateY(-50%);
  color: rgba(0, 0, 0, 0.1);
  font-size: 180px;
}

/* Floating Banner */
.floating-banner,
.floating-banner-catalog {
  position: fixed;
  z-index: 900;
}
.banner {
  color: #fff !important;
  font-weight: bold;
  text-align: center;
}
.floating-banner .banner {
  background: rgba(0, 191, 210, 0);
}
.floating-banner:hover .banner {
  background: rgba(0, 191, 210, 0);
}
.floating-banner-catalog .banner {
  background: rgba(18, 64, 133, .75);
}
.floating-banner-catalog:hover .banner {
  background: rgba(18, 64, 133, 1);
}
.floating-banner a,
.floating-banner-catalog a {
  text-decoration: none;
}
.banner p.close {
  position: absolute;
  top: -18px;
  right: 0;
}
.floating-banner p.close a,
.floating-banner-catalog p.close a {
  color: rgba(204, 204, 204, .85);
  padding: 0;
}
.copy {
  color: #fff;
  font-size: 14px;
  margin: 0 auto;
  line-height: 1.6;
}
.floating-banner .button {
  width: 76px;
  height: 76px;
  opacity: 1;
  text-align: center;
}
.floating-banner .button.button-contact {
  background-color: #00a6b7;
}
.floating-banner .button.button-contact:hover {
  background: #008493;
}
.floating-banner .button.button-download {
  background: #0d3167;
}
.floating-banner .button.button-download:hover {
  background: #061834;
}
.floating-banner .button i {
  padding-top: 12px;
  line-height: 1;
}


@media screen and (min-width: 576px) {
  .floating-banner {
    top: 75%;
    right: 0;
  }
  .floating-banner .banner>div>div {
    height: 76px;
  }
  .floating-banner-catalog {
    bottom: 185px;
    right: 10px;
  }
}

@media screen and (max-width: 575px) {
  .floating-banner {
    display: inline-block;
    bottom: 0px;
    right: 0;
  }
  .floating-banner a,
  .floating-banner-catalog a {
    padding: 10px;
  }
  .floating-banner .button {
    width: calc(100vw / 2)!important;
    height: 40px!important;
    opacity: 1!important;
    text-align: center;
  }
  .banner {
    width: 100%;
    padding: 0;
  }
  .banner p.close {
    top: -18px;
    right: 0;
  }
  .floating-banner p.close a,
  .floating-banner-catalog p.close a {
    color: #CCC;
  }
  .copy {
    font-size: 14px;
    margin: 0 auto 6px;
  }
}

/* campaign */

.border-campaign {
  border: 5px solid #00a6b7;
  width: 35%;
  padding: 35px 40px 35px 40px;
}

@media screen and (min-width: 576px) {
  .border-campaign h3{
    font-size: 30px;
    line-height: 1;
  }
}
@media screen and (max-width: 575px) {
  .border-campaign {
    width: 90%;
    padding: 15px 10px 15px 10px;
  }
  .border-campaign h3{
    margin-bottom: 5px;
  }
}

/* button */
.button.button-contact {
  background: #00a6b7;
  box-shadow: 0px 3px 14px 0px rgba(4, 57, 118, 0.3);
}
.button.button-contact:hover {
  background: #008493;
}
.button.button-download {
  background: #0d3167;
  box-shadow: 0px 3px 14px 0px rgba(4, 57, 118, 0.3);
}
.button.button-download:hover {
  background: #666;
}
.button.button-faq {
  background: rgba(108, 117, 125, .9);
}
.button.button-faq:hover {
  background: rgba(108, 117, 125, 1);
}
.button.button-desc span {
  font-style: normal;
}
.button.button-border.button-light:hover {
  background-color: rgba(255, 255, 255, .9);
  color: #666
}
#contact-section .button.button-border.button-light:hover {
  color: #00a6b7
}

/* accordion, toggle */
.accordion-border,
.toggle-border {
  border: 2px solid #ccc;
  border-radius: 0;
  background-color: #fff
}
.accordion-border .accordion-header,
.toggle-border .toggle-header {
  border-top: 2px solid #eee;
  padding: 1rem 0.75rem;
  margin: 0
}
.accordion-border .accordion-header:first-child,
.toggle-border .toggle-header:first-child {
  border-top: none
}
.accordion-border .accordion-content,
.toggle-border .toggle-content {
  padding-top: 1.5rem
}
.accordion-border .accordion-open,
.accordion-border .accordion-closed,
.toggle-border .toggle-open,
.toggle-border .toggle-closed {
  color: #00a6b7
}
.accordion-bg .accordion-header,
.toggle-bg .toggle-header {
  color: #fff;
  background-color: #0b2a59;
  position: relative;
  z-index: 1;
  transition: .4s;
}
.accordion-bg .accordion-header::before,
.toggle-bg .toggle-header::before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  background: #486083;
  transform-origin: 100% 50%;
  transform: scaleX(0);
  transition: transform ease .4s;
}
.accordion-bg .accordion-header:hover,
.toggle-bg .toggle-header:hover {
  color: #fff;
}
.accordion-bg .accordion-header:hover::before,
.toggle-bg .toggle-header:hover::before {
  transform-origin: 0% 50%;
  transform: scaleX(1);
}
.accordion-bg .accordion-open,
.accordion-bg .accordion-closed,
.toggle-bg .toggle-open,
.toggle-bg .toggle-closed {
  color: #ccc
}

/* etc */
.divider {
  color: #ccc
}
.divider::after,
.divider::before {
  background-color: #ccc
}

.tagcloud a.no-link {
  cursor: text;
}
.tagcloud a.no-link:hover {
  background-color: #00a6b7 !important;
  color: #fff !important;
}
.tagcloud a.no-link.tag-border {
  color: #00a6b7 !important;
  background-color: rgba(255, 255, 255, 0) !important;
  border: 1px solid #00a6b7;
}
.table th {
  font-weight: normal;
  color: #fff;
  background-color: rgba(107, 105, 102, 0.75)
}

.flowing {
  width: 0;
  margin: 0;
  white-space: nowrap;
  overflow: hidden;
  animation: flowing-anim 1s forwards linear;
  animation-delay: 0.5s;
}
.flowing:nth-child(2) {
  animation-delay: 1s;
}
.flowing:nth-child(3) {
  animation-delay: 1.5s;
}
@keyframes flowing-anim {
  0% {
    width: 0%;
  }
  100% {
    width: 100%;
  }
}

/* block-card-9 */
.block-card-9 .grid-content {
  align-content: flex-end;
}

a.icon-stacked.rounded-circle.bg-white {
  display: none;
  /* display: block; */
}


.block-card-9 .grid-inner .btn-hover {
    opacity: 0;
    transition: opacity .3s ease, transform .3s .1s ease;
    margin-bottom: 0;
    padding-bottom: 0;
}

.block-card-9 .grid-inner:hover .btn-hover {
    opacity: 1;
    transform: translateY(-5px);
    display: block;
}
/* .block-card-9 .kenburns-road .btn-hover {
    opacity: 1;
    transform: translateY(-5px);
    display: block;
} */
.block-card-9 .grid-inner .grid-image {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center center;
}


.block-card-9 .grid-inner:hover .grid-image {
    -webkit-animation: kenburns 3s ease-out both;
    animation: kenburns 3s ease-out both;
}
/* .block-card-9 .kenburns-road .grid-image {
    -webkit-animation: kenburns 3s ease-out both;
    animation: kenburns 3s ease-out both;
} */
.block-card-9 .grid-inner .grid-icon, .block-card-9 .grid-inner .grid-content {
    transition: transform .3s ease;
}
.block-card-9 .grid-inner:hover .grid-content {
    transform: translateY(-5px);
}
.block-card-9 .grid-inner:hover .grid-icon {
    transform: translateY(-5px);
}

@-webkit-keyframes kenburns {
0% {
-webkit-transform: scale(1) translate(0, 0);
transform: scale(1) translate(0, 0);
-webkit-transform-origin: 84% 84%;
transform-origin: 84% 84%;
}
100% {
-webkit-transform: scale(1.25) translate(20px, 15px);
transform: scale(1.25) translate(20px, 15px);
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
}
}
@keyframes kenburns {
0% {
-webkit-transform: scale(1) translate(0, 0);
transform: scale(1) translate(0, 0);
-webkit-transform-origin: 84% 84%;
transform-origin: 84% 84%;
}
100% {
-webkit-transform: scale(1.25) translate(20px, 15px);
transform: scale(1.25) translate(20px, 15px);
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
}
}

/* service-feature (design package) */
.service-feature .grid-inner .more-link {
	margin-top: 10px;
}
@media (min-width: 992px) {
	.service-feature {
		position: relative;
		z-index: 4;
	}

	.service-feature  .grid-inner .more-link {
		opacity: 0;
		visibility: hidden;
		transition: all .3s ease;
		margin-top: 0;
	}

	.service-feature .grid-inner:hover .more-link {
		opacity: 1;
		visibility: visible;
		transform: translateY(4px);
		will-change: transform;
	}

	.service-feature .grid-inner .f-b-desc {
		transform: translateY(10px);
		transition: transform .3s ease;
		will-change: transform;
	}

	.service-feature .grid-inner:hover .f-b-desc {
		transform: translateY(-4px);
	}
}


.column {
  display: flex;
  justify-content: space-around;
}

.column-btn {
  justify-content: flex-start!important;
  background-color: #00a6b7;
  color: #fff!important;
  display: block;
  width: calc((100% - 50px) / 2);
}
.column-btn-phone {
  justify-content: flex-start!important;
  background-color: #0b2a59;
  color: #fff!important;
  display: block;
  width: calc((100% - 50px) / 2);
}
.column-btn:hover {
  background-color: #00707c;
}
.column-btn a:hover {
  color: #fff;
}
.column-btn-phone a:hover {
  color: #fff;
}

.column-btn_text {
  color: #fff;
}
.product-rental {
  margin: 5px;
}
.product-rental a:hover {
 background-color: #00707c;
}

.product-rental a{
  display: block;
  text-align: center;
  align-items: center;
  padding: 1em 1.5em;
  width: 211px;
  color: #333;
  font-size: 18px;
  font-weight: 700;
  background-color: #00a6b7;
  transition: 0.3s;
  margin: 5px;
}

.product-rental a:hover {
  text-decoration: none;
  background-color: #00707c;
}
@media screen and (max-width:992px) {
  .column {
    flex-direction: column!important;
  }
  .column-btn {
    width: 80%;
  }
  .column-btn_icon {
    font-size: 32px!important;
    width: 32px!important;
  }
  .button.button-desc {
    padding: 18px 22px;
    font-size: 18px;
  }
  .column-btn_small {
    font-size: 14px;
  }
  .product-rental a {
    text-align: center;
    margin: 0 auto;
  }
  div#product-promo {
    text-align: center;
  }
  div.promo {
    text-align: center;
  }

  .column-btn {
    margin: 0  auto 1.2rem;
    text-align: center;
   }
  .product-price {
    margin-top: 1em;
  }
  .column-btn.d-flex {
  font-size: 0.5rem!important;
  display: block;
  }
}

@media screen and (max-width:767px) {
 .column-btn {
  margin: 0  auto 1.2rem;
  text-align: center;
 }
.product-price {
  margin-top: 1em;
}
.column-btn.d-flex {
font-size: 0.5rem!important;
display: block;
}
}


.fall-point {
  align-items: center;
  max-width: 768px;
  margin: 0 auto;
}
.fall-point .box {
  width: 180px;
  padding: auto 0;
}
.fall-point .box p {
  font-size: 24px;
  align-items: center;
  margin: auto;
  display: flex;
  justify-content: center;
  font-weight: bold;
}


#introduction ol {
  list-style: none;
}

.function .box {
  background-color: #f0f0f0;
  background-color: #fff;
}

.row-eq-height {
  display: flex;
  flex-wrap: wrap;
}
@media screen and (max-width:767px) {
  .row-eq-height {
    display: block;
    flex-wrap: wrap;
  }
}

#fall-detection #introduction.section {
  padding: 40px 0;
}
.introduction-exp {
  font-size: 18px;
  margin-bottom: 1em;
}

.btn-white {
  background-color: #fff!important;
  color: #00a6b7!important;
  border: #00a6b7 2px solid!important;
}
.btn-white:hover {
  background-color: #00a6b7!important;
  color: #fff!important;
  border: #fff 2px solid!important;
}

.bluehr {
  color: #00a6b7;
  border: 1px solid;
}

.btn-blue {
  background-color: #00a6b7!important;
  color: #fff!important;
  border: #fff 2px solid!important;
}

.btn-blue:hover {
  background-color: #fff!important;
  color: #00a6b7!important;
  border: #00a6b7 2px solid!important;
}

.falldetection_img {
  width: 150px;
  height: auto;
}

.arrow {
  position: relative;
  display: inline-block;
  padding: 10px;
}
.arrow::before {
  content: '';
  width: 10px;
  height: 10px;
  border-top: solid 2px #00a6b7;
  border-right: solid 2px #00a6b7;
  position: absolute;
  left: 10px;
  top: 8px;
}

.arrow.arrow-top::before {
  transform: rotate(-45deg);
  top: 10px;
}

.arrow.arrow-bottom::before {
  transform: rotate(135deg);
}

.arrow.arrow-left::before {
  transform: rotate(-135deg);
}

.arrow.arrow-right::before {
  transform: rotate(45deg);
}


.tab-memu {
  display: flex;
  justify-content: center;
  padding-top: 3rem;
  z-index: 5;
}

.tab-memu .tab-btn {
  padding: 1rem 2rem;
  margin: 0 1rem;
  border-radius: 0;
  background-color: #09bfd3!important;
  color: #fff!important;
}
.tab-memu .tab-btn:hover {
  background-color: #fff!important;
}
.tab-memu .tab-btn {
  color: #fff!important;
  font-size: 18px;
}
.tab-memu .arrow.arrow-bottom::before {
  border-top: solid 2px #fff;
  border-right: solid 2px #fff;
}
.tab-memu .tab-btn:hover {
  display: block;
  padding: 1rem 2rem;
  margin: 0 1rem;
  border-radius: 0;
  background-color: #ffffff!important;
  color: #00a6b7!important;
}

.tab-btn:hover .arrow.arrow-bottom::before {
  border-top: solid 2px #00a6b7;
  border-right: solid 2px #00a6b7;
}

.marker {
  text-decoration: underline;
  text-decoration-thickness: 0.5em;
  text-decoration-color: #a2f6ff;
  text-underline-offset: -0.2em;
  text-decoration-skip-ink: none;
}

.mv-pic {
  width: 250px;
  height: 100%;
  z-index: 1;
  filter: drop-shadow(2px 2px 2px rgba(0, 0, 0, 0.5));
}

.lineup_container {
  padding: 0 2rem 2rem 2rem;
}
.lineup_container .product-image img:hover {
  background-color: rgb(0, 165, 183);
}

.h1_copy {
  font-size: 24px!important;
  line-height: 1.5!important;
}
.h1_title {
  font-size: 30px!important;
}

.h1-wrap {
  display: flex;
}
.h1-copy {
  font-size: 22px!important;
  padding: 3rem !important;
}
.h1-title {
  font-size: 32px!important;
}

.introduction-text {
  font-size: 22px;
}
.introduction-point {
  font-size: 28px!important;
}
.introduction-exp {
  line-height: 1.4!important;
  margin-bottom: 10px!important;
}
.introduction-exa {
  margin-bottom: 10px!important;
}

.btpt2-border {
  padding: 10px 5px;
  margin: 3px 8px;
  border: 1px solid #28b9c9;
}
@media screen and (max-width:1400px) {
  .lineup-title {
    font-size: 22px!important;
    margin-left: 1rem;
  }
}
@media screen and (max-width:992px) {
  .mv-pic {
    width: 200px;
    height: 100%;
    z-index: 1;
  }
  .h1-copy {
    font-size: 20px!important;
    padding: 2rem !important;
  }
  .h1-title {
    font-size: 24px!important;
  }
  .falldetection_img {
    width: 100px;
    height: auto;
  }
  .lineup-title {
    font-size: 20px!important;
    margin-left: 1rem;
  }
  .lineup-block {
    margin-bottom: 3rem;
  }

  .introduction-text {
    font-size: 16px;
  }
  .introduction-point {
    font-size: 20px!important;
  }
  #fall-detection #page-title {
    padding: 4rem 0;
  }

}
@media screen and (max-width:576px) {
  .mv-pic {
    width: 150px;
    height: 100%;
    z-index: 1;
  }

  .h1-copy {
    font-size: 16px!important;
    padding: 0 1rem 1rem 1rem !important;
  }
  .h1-wrap {
    display: block;
  }
  #fall-detection #page-title {
    padding: 2rem 0;
  }
}

.contact_tel_mail {
  border: 2px solid #09bfd3;
  margin: 0 auto 2rem;
  padding: 1.5em;
  text-align: center;
  max-width: 620px;
}
.contact_mail {
  color: #421f1f;
}

.contact_tel_mail p {
  line-height: 1.2!important;
}

.contact_tel {
  margin-bottom: 5px;
}

.contact_tel a {
  font-size: 28px;
  font-weight: bold;
}

.contact_tel a:hover {
  color: #8adcff!important;
}

.contact_tel_time {
  color: #00a6b7;
}

.contact_mail {
  font-size: 24px;
  font-weight: bold;
  margin-bottom: 20px;
  margin-top: 12px;
  margin-bottom: 0;
}

.contact_mail a:hover {
  color: #8adcff!important;
}

.contact_tel_mail .icon-line-mail {
  font-weight: 100;
  margin-right: .5rem;
}

.contact_tel_mail .icon-line-phone-call {
  margin-right: .5rem;
}

/* website creation */

.service-list {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
}

.service-list-item {
  padding: .5rem 1rem;
  border: 1px solid #00a6b7;
  margin: 0 10px 10px 0 ;
  font-weight: bold;
}

.service-list-item a {
  color: rgb(85, 85, 85);
}

.service-list-item a:hover {
  color: #00a6b7;
}


#page-title {
  background: inherit;
  z-index: 100;
  width: 100%;
}

.service-heading-block {
  z-index: 200;
  position: absolute;

}

.service-h1 {
  line-height: 1!important;
  background-color: #ffffffe4;
  margin-bottom: 10px!important;
  position: relative;
  z-index: 100
}

.service-p {
  background-color: #ffffffe4;
  line-height: 1.2;
  position: relative;
  z-index: 100;
  font-size: 18px!important;
}

.opacity {
  opacity: .3;
}

.section.bluebrdr .container {
  border: 30px solid  #dbffff;
  padding: 30px;
}

.slick-prev {
  left: 30px !important;
}

.slick-next {
  right: 30px !important;
}

.slick-prev:before,
.slick-next:before {
  color: #333 !important;
}

.slick-prev,
.slick-next {
  z-index: 100;
}

.img-hover:hover {
  opacity: .8;
  transition: .3s;
}

.underline {
  text-decoration: underline solid #00a6b7!important;
  -webkit-text-decoration: underline solid #00a6b7!important;
}
.underline:hover {
  text-decoration: underline solid #333!important;
  -webkit-text-decoration: underline solid #333!important;
}

.service-list-item a {
  text-decoration: underline solid #333!important;
  -webkit-text-decoration: underline solid #333!important;
}
.service-list-item a:hover {
  text-decoration: underline solid #00a6b7!important;
  -webkit-text-decoration: underline solid #00a6b7!important;
}

@media screen and (max-width:768px) {
  .service-p {
    line-height: 1.2;
    font-size: 16px!important;
  }
}

/* comparative-chart */

.comparative-chart {
  border-collapse: separate;
  border-spacing: 4px 4px;
  text-align: center;
  margin: 0 auto;
  font-size: 15px;
  line-height: 1.3;
}

.comparative-chart th {
  padding: 10px;
}
.comparative-chart thead th {
  padding: 20px;
}
.comparative-chart thead th:first-child {
  background-color: #efefef;
}
.comparative-chart-pc td {
  padding: 8px;
  width: calc(100% / 7);
}

.bg-gry  {
  background-color: #efefef;
}

.bg-green-dark {
  background-color: #407c37;
}

.bg-green {
  background-color: #e7f0e5;
}

.bg-blue {
  background-color: #dee3ea;
}

.green {
  color: #407c37!important;
}

.bg-light-blue {
  background-color: #deecf2;
}

.bg-color-dark {
  background-color: #018593;
}

.table-circle-green {
  font-weight: bold;
  font-size: 20px;
  color: #407c37;
}
.table-circle-blue {
  font-weight: bold;
  font-size: 20px;
  color: #0b2a59;
}

.comparative-chart .bi-geo-alt-fill {
  color: #407c37;
}
.comparative-chart .bi-telephone-fill {
  color: #407c37;
}
.comparative-chart .bi-envelope-fill {
  color: #407c37;
}
.comparative-chart .bi-chat-dots-fill {
  color: #407c37;
}

.table-icon {
  margin: 5px 5px 5px 10px;
  height: 16px;
}

.stationary_icon {
  height: 35px;
  width: auto;
}

.fall_icon {
  width: 60px;
}

.table-image-btpt2 {
  height: 100px;
  width: auto;
  padding-bottom: .5rem;
}
.table-image {
  width: 100px;
  height: auto;
  padding-bottom: .5rem;
}

.table-image-tk12 {
  height: 100px;
  width: auto;
  padding-bottom: .5rem;
}

.table-image-btpt2:hover {
  opacity: .7;
  transition: all .3s;
}
.table-image:hover {
  opacity: .7;
  transition: all .3s;
}
.table-image-tk12:hover {
  opacity: .7;
  transition: all .3s;
}
.table-modelnumber {
  font-weight: bold;
  display: block;
  color: #222;
}

.table-productname {
  font-size: 14px;
  display: block;
  color: #222;
}

.table-desc {
  line-height: 1.2!important;
  margin-bottom: 0;
}

.td-product {
  vertical-align: bottom;
}

.comparative-chart_container {
  padding: 0 2rem 2rem 2rem;
}

.table-button {
  border : none;
  color : #fff;
  margin: .2rem 0;
  padding: 4px 10px;
}

.table-button:hover {
  opacity: .6;
}

@media screen and (max-width:1320px) {
  .table-scroll {
    overflow-x: scroll;
  }
  .comparative-chart {
    width: 1000px;
  }
  .comparative-chart td {
    padding: 16px 10px;
  }
  .td-product {
    vertical-align: middle;
  }
}
@media screen and (max-width:576px) {
  .table-scroll {
    overflow-x: scroll;
  }
  .comparative-chart td {
    padding: 5px;
  }
  .comparative-chart {
    border-spacing: 2px 2px;
    font-size: 13px;
    width: 110%;
  }
  .comparative-chart th {
    padding: 5px 12px;
  }
  .comparative-chart td {
    padding: 8px;
  }  
  .table-image-btpt2 {
    height: 50px;
  }
  .table-image-tk12 {
    height: 50px;
  }
  .table-image {
    width: 50px;
  }
  .comparative-chart thead th {
    padding: 5px;
  }
  .stationary_icon {
    height: 30px;
  }
  .fall_icon {
    width: 40px;
  }
  .table-icon {
    margin: 5px 5px 5px 10px ;
    height: 16px;
    max-width: none;
  }
  .table-productname {
    font-size: 11px;
  }
  .table-circle-blue {
    font-size: 16px;
  }
  .table-circle-green {
    font-size: 16px;
  }
}

.memamore-comparative-chart {
  width: 100%;
}

.memamore-comparative-chart td {
  padding: 16px 8px;
  width: calc((100% / 3) - 8%);
}

.memamore-comparative-chart-sp {
  width: 100%;
}

@media screen and (max-width:576px) {
  .liquidleak-notification-text {
    line-height: 1.2!important;
    font-size: 13px!important;
  }
  .liquidleak-notification_img {
    max-width: 60%!important;
  }
  .comparative-chart-sp {
    width: 100%;
  }
}

.hero-wrapper {
	position: relative;
	max-width: 900px;
	margin: 0 auto;
  display: flex;
  align-items: center;
}

.hero-txt {
	color: #ffffff;
  width: 65%;
}

.hero-title {
	font-size: 270%;
	line-height: 1.3;
  color: #ffffff;
}

.hero-img {
  width: 35%;
}

.hero-productname {
	font-size: 180%;
	line-height: 1.2;
	font-weight: bold;
}

.top-bg {
	position: relative;
	text-align: left;
	display: table;
	width: 100%;
	height: 600px;
	color: #717171;
	overflow: hidden;
	background: #f7f7f7 url(/../service/images/wdp-bg_laboratory.jpg) top/cover no-repeat;
	background-size: cover;
	background-position: center;
}

.top-text {
	position: relative;
	padding: 8px;
	z-index: 3;
	display: table-cell;
	vertical-align: middle;
	width: 100%;
}

.top {
	overflow: hidden;
	position: relative;
}


/* design package for lab-------------- */

.works-slider {
  background-color: #f6f6f6;
  padding: 2rem 0;
  margin-bottom: 0;
}
.works-slider .slick-slide {
  width: 250px;
  height: 187px;
  position: relative;
  overflow: hidden;
  margin: 0 10px;
}

.works-slider .slick-slide img {
  display: block;
  width: 100%!important;
  /* height: 100%; */
  object-fit: contain;
  border: 1px solid #ccc;
}

#design-package-laboratory {
  background-image: url(/../service/images/wdp-bg_laboratory.jpg);
  background-size: cover;
  background-position:bottom;
  width: 100%;
  height: 500px;
}
#design-package-laboratory {
  background-image: url(/../service/images/wdp-bg_laboratory.jpg);
  background-size: cover;
  background-position:bottom;
  width: 100%;
  height: 500px;
}

.works-slider-li {
	width: 280px;
	height: 188px;
	overflow:	hidden;
	margin: 10px 8px 10px 16px;
	position:		relative;
  /* border: 1px #e2e2e2 solid; */
}
.works-slider-li .slider-caption {
	font-size: 130%;
	text-align: center;
	color: #fff;
}
.works-slider-li a {
	width: 100%;
	height:	100%;
}
.works-slider-li .slider-mask {
	width: 100%;
	height:	100%;
	position:	absolute;
	top: 0;
	left: 0;
	opacity: 0;
	background-color:	rgba(0,0,0,0.4);
	-webkit-transition:	all 0.2s ease;
	transition:	all 0.5s ease;
}
.works-slider-li:hover .slider-mask {
	opacity: 1;
}

.packagelab-list {
  border: 2px #fff solid;
  border-radius: 5px;
  padding: 10px 0;
}

.packagelab-list-text {
  margin-bottom: 0;
}

.packagelab-list-img {
  width: 100px;
}

.wdp-lab-circle {
  background-color: #00a6b7;
  padding: 30px;
  border-radius: 50%;
  margin: 0 auto;
  width: 150px;
  height: 150px;
  text-align: center;
}

.packagelab-list-img {
  margin: 0 auto;
}

.wdp-lab-advantage-text {
  text-align: center;
  font-weight: bold;
  font-size: 20px;
  margin: 15px 0 5px 0;
}

.wdp-lab-circle-small {
  background-color: #00a6b7;
  padding: 20px;
  border-radius: 50%;
  margin: 0 auto;
  width: 100px;
  height: 100px;
  text-align: center;
}

.page-title-en {
  letter-spacing: 0.12rem!important;
}

.page-title-copy {
  letter-spacing: 0.2rem!important; 
}


@media screen and (max-width: 992px) {
  .works-slider .slick-slide {
    width: 150px!important;
    height: 112px;
  }
  .works-slider img {
    width: 150px;
    height: 112px;
  }
  .grid-filter2.style-2 li a {
    font-size: 14px;
    padding: 5px 10px;
  }
  .slider-mask {
    height: 112px;
  }
}

.wdp-lab_mv-pic {
  width: 250px;
  height: 100%;
  z-index: 1;
  filter: drop-shadow(0px 0px 0px rgba(0, 0, 0, 0));
}

.bttk2-banner {
  border: 1px solid #c4c4c4;
}

.bttk2-banner:hover {
  opacity: .8;
  transition: all .5s;
}

.btpt2-banner:hover {
  opacity: .8;
  transition: all .5s;
}

.bttk2-banner::before {
  background: rgba(141, 141, 141, 0.6);
  width: 100%;
  height: 100%;
  opacity: 0;
}
.bttk2-banner:hover::before {
  opacity: 1;
}

/* mainvisual --------------------------- */

.mv-wrap {
  position: relative;
  height: 230px;
  width: 100%;
  background-color: #0b2a59;
  z-index:0;
  padding: 1.2rem;
  display: flex;
  align-items:flex-end;
}

#particles-js {
  width: 100%;
  margin: 10px;
}
.particles-js-canvas-el {
  position:absolute;
	top:0;
	right:0;
	z-index:1;
}

.mv-container {
  z-index: -2;
  display: block;
  user-select: none;
} 

.mv-copy {
  color: #ffffff;
  font-weight: 700;
  font-size: 40px;
  line-height: 1.4!important;
  text-shadow: 0px 3px 14px 0px rgba(0, 0, 0, 0.28);
  font-family: "Urbanist", "Noto Sans JP", sans-serif;
  margin-bottom: 0;
  white-space: nowrap; 
  user-select: none;
}

.mv-subcopy {
  color: #fff;
  font-weight: 500;
  font-size: 16px;
  line-height: 1.4!important;
  text-shadow: 0px 3px 14px 0px rgba(0, 0, 0, 0.28);
  margin-bottom: 0;
  opacity: 1;
  padding-top: 16px;
  white-space: nowrap; 
  user-select: none;
}

.br-sp {
  display: none;
}

@media screen and (max-width:1200px) {
  .mv-wrap {
    height: 120px;
    padding: 10px;
  }
  
 .mv-copy {
  font-size: 24px;
 }
 .mv-subcopy {
  font-size: 14px;
  padding-top: 5px;
 }
}
@media screen and (max-width:660px) {
  .mv-copy {
    font-size: 17px;
  }
  .mv-subcopy {
    font-size: 10px;
  }
  .br-sp {
    display: block;
  }
}

.d-flex.justify-content-sm-around.flex-md-column > div:nth-child(1) {
  margin-bottom: 15px;
  box-shadow: 0px 3px 14px 0px rgba(4, 57, 118, 0.24);
}
.d-flex.justify-content-sm-around.flex-md-column > div:nth-child(2) {
  box-shadow: 0px 3px 14px 0px rgba(4, 57, 118, 0.24);
}


/* contact-section */

#contact-section.bg-color {
  background-color: #fff!important;
}
#contact-section .button {
  border: none;
  box-shadow: 0px 3px 10px 0px rgba(4, 57, 118, 0.5);
}
#contact-section .form-btn {
  background-color: #00a6b7!important;
}
#contact-section a.form-btn:hover {
  background-color: #018593!important;
}

@media screen and (max-width: 992px){
  .button.button-desc {
      padding: 18px 16px;
      width: 75%;
      margin: 0 auto;
  }
}
@media screen and (max-width: 300px){
  .button.button-desc {
      padding: 18px 22px;
      font-size: 16px;
      width: 95%;
  }
}
.top-contents .grid-content {
  display: flex;
  align-items: flex-start!important;
  flex-direction: column;
  align-content: start!important;
  align-items: center;

}

/* top page mv */

.bg-overlay-content.flex-column.justify-content-between.dark.top-contents {
  align-items: normal;
}

.popout {
  overflow: hidden;             
}

.popout span {
  position: relative;
  animation: popanime 1s ease-out forwards;
  color: #fff!important;
}
.popout:nth-child(2) span {
  animation-delay: .3s;
}

@keyframes popanime {
  from {
    bottom: -80px;
  }
  to {
    bottom: 0px;
  }
}

.fs-sm {
  font-size: 16px;
}

@media screen and (max-width:576px) {
  .fs-sm {
    font-size: 13px;
  }
}

.text-vertical {
	writing-mode: vertical-rl;
  min-height: 15em;
  min-width: 1em;
  line-height: 1;
  margin: 0;
  padding: 0;
}

.main-box {
  height: 260px;
}
@media (min-width: 700px) and (max-width: 992px) {
  .main-box {
    height: 350px;
  }
}
@media screen and (max-width:550px) {
  .main-box {
    height: 240px;
  }
}
@media screen and (max-width:440px) {
  .main-box {
    height: 230px;
  }
}

@media screen and (min-width:1400px) {
  .main-box {
    min-height: 35vh;
  }
}


/*=========
del
=========*/

.del_h1 {
  background-image: linear-gradient(#0b2a59, #0b2a59);
  background-position: 0 50%;
  background-size: 100% 1px;
  background-repeat: repeat-x;
  text-decoration: none!important;
  padding: 0 2px;
}
.del {
  background-image: linear-gradient(#0b2a59, #0b2a59);
  background-position: 0 50%;
  background-size: 100% 1px;
  background-repeat: repeat-x;
  text-decoration: none!important;
  padding: 0 2px;
}

/*=========
switch_image
=========*/
.switch_image {
    position: relative;
}

.switch_image img {
    transition: opacity 0.5s;
}
.switch_image:hover img:first-of-type {
    opacity: 0;
}
.switch_image img:last-of-type {
    position: absolute;
    top: 0px;
    left: 0px;
    opacity: 0;
}
.switch_image:hover img:last-of-type {
    opacity: 1;
}
