@charset "utf-8";

/* スタイルシート　始めよう、木造耐震診断！ */


.hl_1 {
  border-right:3px solid #DF0542;
  position:relative;
}
.hl_2 {
  border-right:3px solid #DF0542;
  position:relative;
}

.hl_1 > span {
  position:absolute;
  top:25%;
}
.hl_2 > span {
  position:absolute;
  top:25%;
}


.slash {
  position: relative;
  text-align:center;
  padding: 1rem 2.5rem;
  font-size: 1rem;
  width:max-content;
  margin-right:auto;
  margin-left:auto;
}
.slash > span {
  font-size: 1.5rem;
  font-weight: bold;
  padding:0.2rem 0.5rem;
  background-color: rgb(250 247 206 / 60%);
}

.slash::before,
.slash::after {
  position: absolute;
  top: 2rem;
  height: 2.8rem;
  content: '';
}

.slash::before {
  border-left:2px solid #F6A623;
  left: 0.2rem;
  transform: rotate(-30deg);
}

.slash::after {
  border-right:2px solid #F6A623;
  right: 0.2rem;
  transform: rotate(30deg);
}


.border-attention {
  color:#DF0542;
  border-color:#DF0542!important;
}

.attention-link {
  box-shadow: 4px 3px 5px rgba(0,0,0,0.3);
}
.attention-link:hover {
  box-shadow: none;
}


.youtube-title {
  color:#FFFFFF;
  background-color:#DF0542;
}

.youtube-link > span {
  color:#DF0542;
}

.pg-link {
  border: 1px solid #73b8c7;
  box-shadow: 4px 6px 5px rgba(60,170,222,0.3);
}
.pg-link:hover {
  box-shadow: none;
}


@media print, screen and (max-width: 992px) {


.hl_1 {
 border-right:none;
 border-bottom:3px solid #DF0542;
}
.hl_2 {
 border-right:none;
 border-bottom:3px solid #DF0542;
}

.hl_1 > span {
  position:static;
}
.hl_2 > span {
  position:static;
}



}


@media print, screen and (max-width: 550px) {


.slash {
  padding: 0.5rem 1.5rem;
  font-size: 1rem;
}
.slash > span {
  font-size: 1rem;
}

.slash::before,
.slash::after {
  top: 1rem;
}



}