@media screen and (min-width: 769px), print {
  .welfare {
    padding: 0 0;
    font-size: 1.6rem;
  }
  .welfare_ttl h2 {
    text-align: center;
    font-size: 3.6rem;
    line-height: 1;
    color: #fff;
    font-weight: bold;
    padding: 82px 0 83px;
    background: #d70c19;
  }
  .welfare_row {
    padding: 90px 50px 70px;
  }
  .welfare .lead {
    background-color: #f6f6f6;
    font-size: 1.6rem;
    padding: 30px 48px;
  }
  .welfare .lead_ttl {
    font-size: 2rem;
    font-weight: bold;
    margin-bottom: 1em;
  }
  .welfare_group {
    margin-top: 85px;
    position: relative;
  }
  .welfare_group:before {
    content: "";
    display: block;
    position: absolute;
    right: 0;
    top: 0;
    background-position: right top;
    background-repeat: no-repeat;
    -moz-background-size: contain;
         background-size: contain;
  }
  .welfare_group.skillup:before {
    background-image: url(../images/icon_skillup.png);
    width: 146px;
    height: 153px;
    top: -40px;
  }
  .welfare_group.asset:before {
    background-image: url(../images/icon_asset.png);
    width: 177px;
    height: 172px;
    top: -50px;
  }
  .welfare_group.life:before {
    background-image: url(../images/icon_life.png);
    width: 159px;
    height: 159px;
    top: -42px;
  }
  .welfare_group.event:before {
    background-image: url(../images/icon_event.png);
    width: 179px;
    height: 159px;
    top: -40px;
  }
  .welfare_group h3 {
    margin-bottom: 30px;
  }
  .welfare_group h3 span {
    background-color: #d70c19;
    color: #fff;
    padding: 25px;
    font-size: 2.4rem;
    width: 400px;
    display: inline-block;
    text-align: center;
  }
  .welfare_group dl {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
       -moz-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    gap: 0 65px;
    padding: 20px 0;
    border-top: 1px solid #868686;
  }
  .welfare_group dl:last-of-type {
    border-bottom: 1px solid #868686;
  }
  .welfare_group dl dt {
    color: #d70c19;
    font-size: 2.2rem;
    font-weight: bold;
    text-align: center;
    width: 400px;
    height: 100px;
    -ms-flex-negative: 0;
        flex-shrink: 0;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
       -moz-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    padding: 0 30px;
  }
  .welfare_group dl dd a {
    color: #d70c19;
    border-bottom: 1px solid #d70c19;
    position: relative;
  }
  .welfare_group dl dd a:after {
    content: "";
    display: block;
    width: 8px;
    height: 8px;
    border-top: 2px solid #d70c19;
    border-right: 2px solid #d70c19;
    -webkit-transform: rotate(45deg);
       -moz-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
            transform: rotate(45deg);
    position: absolute;
    right: -14px;
    top: 5px;
    -webkit-transition: right 0.3s ease;
    -moz-transition: right 0.3s ease;
    transition: right 0.3s ease;
  }
  .welfare_group dl dd a:hover {
    border-color: transparent;
  }
  .welfare_group dl dd a:hover:after {
    right: -17px;
  }
}

@media screen and (max-width: 768px) {
  .welfare {
    padding: 0 0;
    font-size: 3.64583vw;
  }
  .welfare_ttl {
    height: 32.55208vw;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
       -moz-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
       -moz-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    background: #d70c19;
  }
  .welfare_ttl h2 {
    font-size: 7.8125vw;
    line-height: 1;
    color: #fff;
    font-weight: bold;
  }
  .welfare_row {
    padding: 11.71875vw 3.90625vw;
  }
  .welfare .lead {
    background-color: #f6f6f6;
    font-size: 3.64583vw;
    padding: 6.25vw;
  }
  .welfare .lead_ttl {
    font-size: 3.90625vw;
    font-weight: bold;
    margin-bottom: 1em;
  }
  .welfare_group {
    margin-top: 20.83333vw;
    position: relative;
  }
  .welfare_group:before {
    content: "";
    display: block;
    position: absolute;
    right: 0;
    top: -24.73958vw;
    background-position: right top;
    background-repeat: no-repeat;
    -moz-background-size: contain;
         background-size: contain;
  }
  .welfare_group.skillup:before {
    background-image: url(../images/icon_skillup.png);
    width: 20.70313vw;
    height: 21.74479vw;
  }
  .welfare_group.asset:before {
    background-image: url(../images/icon_asset.png);
    width: 23.04688vw;
    height: 22.39583vw;
  }
  .welfare_group.life:before {
    background-image: url(../images/icon_life.png);
    width: 20.70313vw;
    height: 20.70313vw;
  }
  .welfare_group.event:before {
    background-image: url(../images/icon_event.png);
    width: 23.30729vw;
    height: 20.70313vw;
  }
  .welfare_group h3 {
    background-color: #d70c19;
    color: #fff;
    padding: 3.25521vw 0;
    font-size: 4.6875vw;
    text-align: center;
  }
  .welfare_group dl {
    margin-top: 3.90625vw;
  }
  .welfare_group dl dt {
    color: #d70c19;
    font-size: 4.16667vw;
    font-weight: bold;
  }
  .welfare_group dl dd {
    padding: 2.60417vw 0 3.90625vw;
  }
  .welfare_group dl dd a {
    color: #d70c19;
    border-bottom: 1px solid #d70c19;
    position: relative;
  }
  .welfare_group dl dd a:after {
    content: "";
    display: block;
    width: 1.82292vw;
    height: 1.82292vw;
    border-top: 0.52083vw solid #d70c19;
    border-right: 0.52083vw solid #d70c19;
    -webkit-transform: rotate(45deg);
       -moz-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
            transform: rotate(45deg);
    position: absolute;
    right: -2.86458vw;
    top: 0.65104vw;
  }
}
