.company-top {
  width: 100%;
  position: relative;
  background-color: #fff;
  overflow: hidden;
  display: flex;
  align-items: center;
  isolation: isolate;
  gap: 10px;
  text-align: left;
  font-size: 8.889vw;
  color: #fff;
  font-family: 'Noto Sans JP';
}

.main {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 5.972vw 0vw 0vw;
  position: relative;
  isolation: isolate;
  z-index: 0;
}

.company-top-frame {
  align-self: stretch;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  z-index: 0;
  font-family: Inter;
}

.company-top-img-parent {
  width: 100vw;
  height: 20.833vw;
  position: relative;
  background-color: #0288d1;
  overflow: hidden;
  flex-shrink: 0;
}

.company-top-img {
  position: absolute;
  top: 0;              
  left: 0;            
  width: 100%;       
  height: 100%;       
  object-fit: cover;   
  object-position: right center; 
  /* top: -10vw;
  left: -11.667vw;
  border-radius: 1.111vw;
  width: 111.667vw;
  height: 52.917vw;
  object-fit: cover;
  flex-shrink: 0; */
}

.top-image-mask {
  position: absolute;
  top: 0vw;
  left: 0vw;
  background-color: #1a1c21;
  width: 100vw;
  height: 20.833vw;
  opacity: 0.2;
  flex-shrink: 0;
}

.about-us {
  position: absolute;
  top: 5vw;
  left: 8.333vw;
  font-weight: 600;
  flex-shrink: 0;
}

.top-message-wrapper {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 0vw 8.333vw;
  margin-top: -3.195vw;
  position: relative;
  font-size: 2.777vw;
  font-family: 'Noto Sans JP';
}

.top-message-parent {
  border-radius: 1.111vw;
  background: linear-gradient(267.36deg, #a0d8ec, #0288d1 28.04%, #004fc5);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.695vw 1.389vw;
}

.top-message {
  position: relative;
  letter-spacing: 0.067vw;
  line-height: 5vw;
  font-weight: 900;
}

.breadcrumbs-parent {
  width: 100vw;
  background-color: #fff;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.667vw 8.333vw;
  box-sizing: border-box;
  z-index: 1;
  font-size: 0.833vw;
  color: #1a1c21;
}

.breadcrumbs-wrapper {
  width: 83.333vw;
  display: flex;
  align-items: center;
  gap: 24px;
}

.breadcrumbs-top {
  height: 0.972vw;
  width: 2.5vw;
  position: relative;
  display: inline-block;
  flex-shrink: 0;
}

.breadcrumbs-top {
  color: inherit;
  text-decoration: none;
  transition: color 0.5s ease;
}
 
.breadcrumbs-top:hover {
  color: #6b7075;
}

.icnext12pxnon-flame {
  height: 0.833vw;
  width: 0.487vw;
  position: relative;
}

.icon {
  position: absolute;
  top: 0vw;
  left: 0vw;
  width: 0.487vw;
  height: 0.833vw;
}

.current-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #6b7075;
}

.main-inner {
  background-color: #fff;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 6.944vw 8.333vw 10.417vw;
  z-index: 2;
  font-size: 1.667vw;
  color: #1a1c21;
}

.frame-group {
  width: 83.333vw;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.group {
  align-self: stretch;
  display: flex;
  align-items: flex-start;
}

.child {
  align-self: stretch;
  height: 15.972vw;
  position: relative;
  border-radius: 1.111vw;
  max-width: 100%;
  overflow: hidden;
  flex-shrink: 0;
  object-fit: cover;
}

.child2 {
  align-self: stretch;
  height: 15.972vw;
  position: relative;
  border-radius: 1.111vw;
  max-width: 100%;
  overflow: hidden;
  flex-shrink: 0;
  object-fit: cover;
  margin-bottom: 2vw;
  top: 2.5vw;
}

.inner {
  align-self: stretch;
  border-radius: 0vw 0vw 1.111vw 1.111vw;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 1.667vw 1.111vw;
}

.inner .frame-container {
  position: relative;
  bottom: 1vw;
}

.inner4 {
  align-self: stretch;
  border-radius: 0vw 0vw 1.111vw 1.111vw;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 1.667vw 1.111vw;
}

.child-parent2 .child2 {
  position: relative;
  top: 3.6vw;
}

.child-parent2 .inner3,
.child-parent2 .inner4 {
  position: relative;
  top: 1vw;
}

.frame-container {
  align-self: stretch;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 16px;
}

.card-container {
  align-self: stretch;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}

.card-title,
.breadcrumbs-current {
  position: relative;
}

.frame-item {
  height: 2.777vw;
  width: 2.777vw;
}

.card-content {
  align-self: stretch;
  position: relative;
  font-size: 0.972vw;
  line-height: 180%;
}

.child-parent {
  flex: 1;
  border-radius: 1.111vw;
  background-color: #fff;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  padding: 1.111vw;
}

.parent4 {
  align-self: stretch;
  display: flex;
  align-items: flex-start;
}

.child-parent2 {
  align-self: stretch;
  flex: 1;
  border-radius: 1.111vw;
  background-color: #fff;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  padding: 0 1.111vw 1.111vw 1.111vw;
}

.inner2 {
  align-self: stretch;
  flex: 1;
  border-radius: 0vw 0vw 1.111vw 1.111vw;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 1.667vw 1.111vw;
}

.frame-container2 {
  align-self: stretch;
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 16px;
}

.card-container2 {
  align-self: stretch;
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}

.div18 {
  font-size: 1.389vw;
}

.span {
  font-size: 1.667vw;
  white-space: nowrap;
}

.card-frames {
  align-self: stretch;
  display: flex;
  align-items: center;
  padding: 3vw 1.111vw;
  gap: 24px;
}

.card-frame {
  flex: 1;
  background-color: #fff;
  border-bottom: 0.069vw solid #e3e3e3;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  padding: 0vw 1.111vw;
  border-radius: 0vw;
}

.card-container-parent {
  align-self: stretch;
  border-radius: 1.111vw;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 2.222vw 0vw;
}

.card-container-wrapper {
  align-self: stretch;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.child-parent2>a,
.child-parent>a,
.div18>a {
  display: block;
}

.child-parent,
.child-parent2 {
  transition: background-color 0.5s ease;
}
 
.child-parent .frame-item,
.child-parent2 .frame-item,
.card-frame .frame-item {
  transition: transform 0.5s ease;
}

.card-frame {
  transition: background-color 0.5s ease,
              border-radius 0.01s ease,
              border-bottom-color 0.01s ease;
}
 
.child-parent:hover,
.child-parent2:hover {
  background-color: #f2f2f2; 
}
 
.child-parent:hover .frame-item,
.child-parent2:hover .frame-item,
.card-frame:hover .frame-item {
  transform: translateX(0.5vw);
}

.card-frame:hover{
  background-color: #f2f2f2; 
  border-radius: 1.111vw;
  border-bottom-color: rgba(0, 0, 0, 0);
}