@charset "utf-8";
/* スタイルシート
作成者：Hatomi Inc.
作成日：R8.05.29
------------------------------------------------------------------------------------*/

.p-sectionHeading{
  position: relative;
  padding-left: 1.5rem;
}

.p-sectionHeading::before{
  content: "";
  position: absolute;
  top: 0.35em;
  left: 0;
  width: 1rem;
  height: 1rem;
  background: #004A8F;
}

.p-guidelines__block{
  margin-bottom: 2rem;
}

.p-sectionHeading__title{
  color: #004A8F;
  font-weight: 700;
  line-height: 1.4;
}

@media screen and (min-width: 701px){
  .p-sectionHeading__title{
    font-size: 1.2rem;
  }
}

@media screen and (min-width: 481px) and (max-width: 700px){
  .p-sectionHeading__title{
    font-size: 1.15rem;
  }
}

@media screen and (max-width: 480px){
  .p-sectionHeading__title{
    font-size: 1.1rem;
  }
}


/*****************************

relatedSupport

*****************************/
.relatedSupport{
  padding: 3rem 0;
}

@media screen and (min-width: 701px){
  .relatedSupport{
  }
}

@media screen and (min-width: 481px) and (max-width: 700px){
  .relatedSupport{
    padding: 3rem 0;
  }
}

@media screen and (max-width: 480px){
  .relatedSupport{
    padding: 3rem 0;
  }
}


/*****************************

relatedDx

*****************************/
.relatedDx{
  padding: 0 0 3rem;
}

@media screen and (min-width: 701px){
  .relatedDx{
  }
}

@media screen and (min-width: 481px) and (max-width: 700px){
  .relatedDx{
    padding: 0 0 3rem;
  }
}

@media screen and (max-width: 480px){
  .relatedDx{
    padding: 0 0 3rem;
  }
}


/*****************************

relatedLinkList

*****************************/
.relatedLinkList{
  margin-top: 2rem;
}

@media screen and (min-width: 701px){
  .relatedLinkList{
  }
}

@media screen and (min-width: 481px) and (max-width: 700px){
  .relatedLinkList{
    margin-top: 1.5rem;
  }
}

@media screen and (max-width: 480px){
  .relatedLinkList{
    margin-top: 1rem;
  }
}


/*****************************

relatedLinkCard

*****************************/
.relatedLinkCard{
  display: flex;
  align-items: center;
  gap: 4rem;
  margin-top: 4rem;
}

@media screen and (min-width: 701px){
  .relatedLinkCard:first-child{
    margin-top: 0;
  }
}

@media screen and (min-width: 601px) and (max-width: 700px){
  .relatedLinkCard{
    gap: 2rem;
    margin-top: 3rem;
  }

  .relatedLinkCard:first-child{
    margin-top: 0;
  }
}

@media screen and (max-width: 600px){
  .relatedLinkCard{
    display: block;
    margin-top: 2rem;
  }

  .relatedLinkCard:first-child{
    margin-top: 0;
  }
}


.relatedLinkCard__image{
  width: 40%;
  flex-shrink: 0;
}

@media screen and (min-width: 701px){
  .relatedLinkCard__image{
  }
}

@media screen and (min-width: 601px) and (max-width: 700px){
  .relatedLinkCard__image{
    width: 40%;
  }
}

@media screen and (max-width: 600px){
  .relatedLinkCard__image{
    width: 100%;
  }
}


.relatedLinkCard__image img{
  display: block;
  width: 100%;
  height: auto;
}


.relatedLinkCard__body{
  flex: 1;
}

@media screen and (min-width: 701px){
  .relatedLinkCard__body{
  }
}

@media screen and (min-width: 601px) and (max-width: 700px){
  .relatedLinkCard__body{
  }
}

@media screen and (max-width: 600px){
  .relatedLinkCard__body{
    margin-top: 1.5rem;
  }
}


.relatedLinkCard__text{
  line-height: 2;
}


/*****************************

projectMap

*****************************/
.projectMap{
  padding: 3rem 0;
}

@media screen and (min-width: 701px){
  .projectMap{
			 padding: 1rem 0 3rem;
  }
}

@media screen and (min-width: 481px) and (max-width: 700px){
  .projectMap{
    padding: 1rem 0 3rem;
  }
}

@media screen and (max-width: 480px){
  .projectMap{
    padding: 1rem 0 3rem;
  }
}


/*****************************

projectMap__image

*****************************/
.projectMap__image{
  margin-top: 2rem;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

@media screen and (min-width: 481px) and (max-width: 700px){
  .projectMap__image{
    margin-top: 1.5rem;
  }
}

@media screen and (max-width: 480px){
  .projectMap__image{
    margin-top: 1rem;
  }
}

.projectMap__image picture{
  display: block;
}

.projectMap__image img{
  display: block;
  width: 100%;
  height: auto;
}

@media screen and (max-width: 700px) {
  .projectMap__image img{
    width: 700px;
    max-width: none;
  }
}

.projectMap__image svg{
  display: block;
  width: 100%;
  height: auto;
}

@media screen and (max-width: 700px) {
  .projectMap__image svg{
    width: 700px;
    max-width: none;
  }
}

.projectMap__image object{
  display: block;
  width: 100%;
  height: auto;
}

@media screen and (max-width: 700px) {
  .projectMap__image object{
    width: 700px;
    max-width: none;
  }
}



.p-businessIotPic svg {
  max-width: 100%;
  height: auto;
}

.p-businessIotPicLink rect.hover {
  transition: all cubic-bezier(.165, .84, .44, 1) .3s;
  stroke: transparent;
  stroke-width: 7px;
  stroke-linejoin: round;
}

.p-businessIotPicLink:hover rect.hover {
  stroke: #ffc107;
  cursor: pointer;
}


