#features {
  overflow: hidden;
  position: relative;
  z-index: 0;
  padding-bottom: 20px;
}

#features:before {
  content: '';
  background: #eae5de;
  position: absolute;
  left: 0;
  right: 0;
  top: 116px;
  bottom: 0;
  z-index: -4;
}

#features:after {
  content: '';
  width: 640px;
  border-left: 20px solid #71a0c9;
  border-right: 20px solid #eea07a;
  opacity: 0.2;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: 116px;
  bottom: 0;
  z-index: -3;
}

#features .container:after {
  content: '';
  width: 50px;
  height: 25px;
  background-image: url('../img/top/deco3.png');
  background-repeat: no-repeat;
  background-size: 100%;
  position: absolute;
  right: calc(50% - 600px);
  top: 91px;
}

#features .top-ttl {
  margin-bottom: 82px;
}

#features .blk {
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
  z-index: 0;
  padding: 50px 0 40px;
  margin-bottom: 80px;
}

#features .blk:before {
  content: '';
  background: #f2ede9;
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.04);
  position: absolute;
  top: 40px;
  right: calc(50% + 50px);
  left: -50vw;
  bottom: 0;
  z-index: -2;
}

#features .blk:after {
  content: '';
  background: url('../img/top/deco1.png') no-repeat left top/80px, #71a0c9;
  height: 309px;
  position: absolute;
  right: -33px;
  left: calc(50% - 50px);
  top: 0;
  z-index: -1;
}

#features .blk .img-group {
  max-width: 700px;
  width: 60%;
  position: relative;
}

#features .blk .img-group:before {
  content: '';
  width: 50px;
  height: 50px;
  border-top: 2px solid #71a0c9;
  border-left: 2px solid #71a0c9;
  position: absolute;
  left: -16px;
  top: 44px;
  z-index: 1;
}

#features .blk .img-group:after {
  content: '';
  width: 50px;
  height: 50px;
  border-bottom: 2px solid #71a0c9;
  border-right: 2px solid #71a0c9;
  position: absolute;
  right: -33px;
  bottom: -12px;
  z-index: 1;
}

#features .blk .img-group .ttl {
  background: #71a0c9;
  color: #fff;
  padding: 0 16px;
  font-size: 40px;
  font-weight: 500;
  line-height: 58px;
  position: absolute;
  top: -29px;
  right: 0;
  z-index: 1;
}

#features .blk .img-group ul {
  display: flex;
  justify-content: space-between;
  position: relative;
}

#features .blk .img-group ul:before {
  content: '';
  width: 50px;
  height: 10px;
  background: #71a0c9;
  position: absolute;
  left: 0;
  bottom: -10px;
}

#features .blk .img-group ul .img1 {
  margin: 30px 20px 0 0;
}

#features .blk .img-group ul li {
  width: 50%;
}

#features .blk .img-group ul li img {
  width: 100% !important;
  height: 100%;
  object-fit: cover;
}

#features .blk .text-group {
  max-width: 500px;
  width: 40%;
  padding-left: 40px;
  padding-right: 60px;
  position: relative;
}

#features .blk .text-group:before {
  content: '';
  width: 10px;
  height: 80px;
  background-image: url('../img/top/deco4.png');
  background-repeat: no-repeat;
  background-size: 100%;
  position: absolute;
  left: -10px;
  top: 0;
}

#features .blk .text-group h3 {
  display: flex;
  align-items: center;
}

#features .blk .text-group h3 .num {
  display: block;
  width: 80px;
  height: 80px;
  text-align: center;
  border: 1px solid;
  font-size: 48px;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 78px;
}

#features .blk .text-group h3 .db {
  display: block;
  padding-left: 30px;
  font-size: 25px;
  line-height: 40px;
  font-weight: 600;
}

#features .blk .text-group .txt {
  margin: 40px 0 25px;
}

#features .img-right .img-group {
  order: 2;
}

#features .img-right .text-group {
  order: 1;
}

#features .img-left:before {
  right: -50vw;
  left: calc(50% + 50px);
}

#features .img-left:after {
  background: url('../img/top/deco2.png') no-repeat right top/80px, #eea07a;
  left: -33px;
  right: calc(50% - 50px);
}

#features .img-left .img-group:before {
  border-right: 2px solid #eea07a;
  border-color: #eea07a;
  border-left: none;
  right: -16px;
  left: auto;
}

#features .img-left .img-group:after {
  border-right: none;
  border-left: 2px solid #eea07a;
  border-color: #eea07a;
  left: -33px;
  right: auto;
}

#features .img-left .img-group .ttl {
  right: auto;
  left: 0;
  background: #eea07a;
}

#features .img-left .img-group ul:before {
  background: #eea07a;
  left: auto;
  right: 0;
}

#features .img-left .img-group ul .img1 {
  margin: 0;
}

#features .img-left .img-group ul .img2 {
  margin: 20px 0 0 20px;
}

#features .img-left .text-group {
  padding-left: 60px;
  padding-right: 40px;
}

#features .img-left .text-group:before {
  background-image: url('../img/top/deco5.png');
  left: auto;
  right: -10px;
}

@media screen and (max-width: 1240px) {
  #features .container:after {
    right: 20px;
  }
}

@media screen and (max-width: 1080px) {
  #features .blk .text-group {
    padding-left: 20px;
    padding-right: 40px;
  }
  #features .blk .text-group h3 .db {
    padding-left: 11px;
  }
  #features .img-left .text-group {
    padding-left: 40px;
    padding-right: 20px;
  }
}

@media screen and (max-width: 980px) {
  #features .blk {
    display: block;
  }
  #features .blk:before {
    right: -20px;
  }
  #features .blk:after {
    left: 40px;
  }
  #features .blk .img-group {
    width: 100%;
    margin: 0 auto;
  }
  #features .blk .text-group {
    max-width: 700px;
    width: 100%;
    margin: 50px auto 0;
    padding-right: 0;
  }
  #features .blk .text-group h3 .db {
    padding-left: 30px;
  }
  #features .img-left:before {
    left: -20px;
  }
  #features .img-left:after {
    right: 40px;
    left: -20px;
  }
  #features .img-left .text-group {
    padding-left: 20px;
  }
  #features .img-left .text-group:before {
    right: auto;
    left: -10px;
  }
}

@media screen and (max-width: 767px) {
  #features {
    padding-bottom: 1px;
  }
  #features:before {
    top: 88px;
  }
  #features:after {
    width: calc(100% - 40px);
    top: 88px;
  }
  #features .container:after {
    width: 20px;
    height: 10px;
    top: 78px;
  }
  #features .top-ttl {
    margin-bottom: 46px;
  }
  #features .blk {
    margin-bottom: 50px;
  }
  #features .blk:after {
    height: 240px;
  }
  #features .blk .img-group:before {
    left: -10px;
    top: 17px;
    z-index: 1;
  }
  #features .blk .img-group:after {
    display: none;
  }
  #features .blk .img-group .ttl {
    font-size: 24px;
    line-height: 35px;
    padding: 0 10px;
    top: -17px;
  }
  #features .blk .img-group ul:before {
    display: none;
  }
  #features .blk .img-group ul .img1 {
    margin: 30px 0 0;
  }
  #features .blk .text-group {
    margin-top: 40px;
    padding-left: 5.1282vw;
  }
  #features .blk .text-group:before {
    height: 20.513vw;
  }
  #features .blk .text-group:after {
    content: '';
    width: 50px;
    height: 50px;
    border-right: 2px solid #71a0c9;
    border-bottom: 2px solid #71a0c9;
    position: absolute;
    bottom: 0;
    right: -10px;
  }
  #features .blk .text-group h3 {
    margin-right: -10px;
  }
  #features .blk .text-group h3 .num {
    width: 20.513vw;
    height: 20.513vw;
    font-size: 12.3077vw;
    line-height: 20.513vw;
  }
  #features .blk .text-group h3 .db {
    font-size: 6.15384vw;
    line-height: 10.2564vw;
    padding-left: 7.6923vw;
  }
  #features .blk .text-group .btn-more:before {
    content: '';
    width: 50px;
    height: 10px;
    background: #71a0c9;
    position: absolute;
    bottom: 0px;
    right: 90px;
  }
  #features .img-left .img-group:before {
    left: auto;
    right: -10px;
  }
  #features .img-left .img-group ul .img1 {
    margin: 0;
  }
  #features .img-left .img-group ul .img2 {
    margin: 30px 0 0;
  }
  #features .img-left .text-group:after {
    border-left: 2px solid #eea07a;
    border-color: #eea07a;
    border-right: none;
    right: auto;
    left: -10px;
  }
  #features .img-left .text-group .btn-more {
    margin: 0 0 0 auto;
  }
  #features .img-left .text-group .btn-more:before {
    right: auto;
    left: 90px;
    background: #eea07a;
  }
}

#medical {
  padding: 128px 0 100px;
  position: relative;
  z-index: 0;
  overflow: hidden;
}

#medical:before {
  content: '';
  width: 640px;
  border-left: 20px solid #71a0c9;
  border-right: 20px solid #eea07a;
  opacity: 0.2;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: 0px;
  bottom: 0;
  z-index: -3;
}

#medical:after {
  content: '';
  height: 330px;
  background: #eae5de;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: -2;
}

#medical .container:before {
  content: '';
  height: 40px;
  border-top: 20px solid #71a0c9;
  border-bottom: 20px solid #eea07a;
  opacity: 0.2;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 330px;
  z-index: -2;
}

#medical .container:after {
  content: '';
  width: 50px;
  height: 25px;
  background-image: url('../img/top/deco3.png');
  background-repeat: no-repeat;
  background-size: 100%;
  position: absolute;
  right: calc(50% - 600px);
  top: 0px;
}

#medical .top-ttl {
  margin-bottom: 68px;
}

#medical .blk {
  display: flex;
  justify-content: space-between;
}

#medical .blk .item {
  max-width: 228px;
  width: 19.5%;
}

#medical .blk .item a {
  display: block;
  padding-top: 10px;
  position: relative;
  transition: 0.3s all ease-in-out;
}

#medical .blk .item a:after {
  content: '';
  width: 40px;
  height: 10px;
  background-image: url('../img/top/deco6.png');
  background-repeat: no-repeat;
  background-size: 100%;
  position: absolute;
  right: 0;
  top: 0;
}

#medical .blk .item a span {
  display: block;
}

#medical .blk .item a .img {
  position: relative;
}

#medical .blk .item a .img:before {
  content: '';
  width: 20px;
  height: 20px;
  background-image: url('../img/top/icon_arrow2.png');
  background-repeat: no-repeat;
  background-size: 100%;
  position: absolute;
  right: 8px;
  bottom: 5px;
}

#medical .blk .item a .eng-ttl {
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 23px;
  text-transform: uppercase;
  color: #fff;
  position: absolute;
  right: 8px;
  top: 26px;
  z-index: 1;
}

#medical .blk .item a .eng-ttl .txt-latin {
  letter-spacing: 0;
}

#medical .blk .item a .jp-ttl {
  display: table;
  background: #487faf;
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  line-height: 31px;
  padding: 0 10px;
  position: relative;
  z-index: 1;
  margin-top: -31px;
}

#medical .blk .item a .txt {
  padding: 20px 15px 0;
  font-size: 14px;
  line-height: 25px;
}

#medical .blk .item a:hover {
  opacity: 0.8;
}

#medical .blk .item a:hover img {
  opacity: 1;
}

@media screen and (max-width: 1240px) {
  #medical .container:after {
    right: 20px;
  }
}

@media screen and (max-width: 1080px) {
  #medical .blk .item a .jp-ttl {
    font-size: 15px;
    padding: 0 6px;
  }
  #medical .blk .item a .txt {
    padding: 20px 5px 0;
  }
}

@media screen and (max-width: 980px) {
  #medical {
    padding-bottom: 60px;
  }
  #medical .blk {
    flex-wrap: wrap;
    justify-content: center;
  }
  #medical .blk .item {
    width: 32%;
    margin: 0 1% 40px;
  }
  #medical .blk .item a .jp-ttl {
    padding: 0 10px;
  }
  #medical .blk .item a .txt {
    padding: 20px 15px 0;
  }
  #medical .blk .item a:hover {
    opacity: 1;
  }
}

@media screen and (max-width: 767px) {
  #medical {
    padding: 50px 0 10px;
  }
  #medical:before {
    width: calc(100% - 40px);
  }
  #medical:after {
    height: auto;
    top: 338px;
  }
  #medical .container:before {
    bottom: auto;
    top: 298px;
  }
  #medical .container:after {
    width: 20px;
    height: 10px;
  }
  #medical .top-ttl {
    margin-bottom: 40px;
  }
  #medical .blk {
    display: block;
  }
  #medical .blk .item {
    max-width: none;
    width: 100%;
    margin: 0 0 40px;
  }
  #medical .blk .item a .txt {
    padding: 20px 10px 0;
  }
}

@media screen and (max-width: 380px) {
  #medical .blk .item a .img img {
    width: 100%;
    height: 216px;
    object-fit: cover;
    object-position: 50%;
  }
}

#greeting {
  position: relative;
  z-index: 0;
  padding: 150px 0 0;
}

#greeting:before {
  content: '';
  width: 50px;
  height: 25px;
  background-image: url('../img/top/deco3.png');
  background-repeat: no-repeat;
  background-size: 100%;
  position: absolute;
  right: calc(50% - 600px);
  top: 240px;
}

#greeting:after {
  content: '';
  background-image: url('../img/top/greeting_bg.jpg');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: 50%;
  position: absolute;
  right: 0;
  bottom: 0;
  top: 265px;
  left: calc(50% - 633px);
  z-index: -1;
}

#greeting .top-ttl {
  margin-bottom: 32px;
}

#greeting .blk {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}

#greeting .blk .coll {
  width: 50%;
  padding-bottom: 60px;
}

#greeting .blk .coll .box {
  background: #fff;
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.04);
  position: relative;
  padding: 50px 40px 45px;
  margin-bottom: 40px;
}

#greeting .blk .coll .box:before {
  content: '';
  width: 50px;
  height: 20px;
  background-image: url('../img/top/deco7.png');
  background-repeat: no-repeat;
  background-size: 100%;
  position: absolute;
  left: 0;
  top: -10px;
}

#greeting .blk .coll .box h3 {
  display: table;
  font-size: 25px;
  font-weight: 500;
  line-height: 37px;
  padding-bottom: 16px;
  margin-bottom: 30px;
  background: url('../img/top/dashed.png') repeat-x left bottom/auto;
}

#greeting .blk .coll .btn-link {
  margin: 0 auto;
}

#greeting .blk .colr {
  max-width: 500px;
  width: calc(50% - 50px);
  margin-right: 50px;
  position: relative;
}

#greeting .blk .colr .name {
  position: absolute;
  right: 0;
  top: 17px;
  z-index: 1;
  display: flex;
  align-items: flex-start;
  font-size: 14px;
  font-weight: 500;
  line-height: 14px;
  color: #fff;
}

#greeting .blk .colr .name p {
  letter-spacing: 0;
  padding: 20px 10px;
  position: relative;
}

#greeting .blk .colr .name p:before {
  content: '';
  height: 17px;
  background-image: url('../img/top/deco8.png');
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: center top;
  position: absolute;
  left: 0;
  right: 0;
  top: -17px;
}

#greeting .blk .colr .name .ttl1 {
  margin-top: 133px;
}

#greeting .blk .colr .name .ttl2:before {
  background-image: url('../img/top/deco9.png');
}

@media screen and (max-width: 1240px) {
  #greeting:before {
    right: 20px;
  }
}

@media screen and (max-width: 1180px) {
  #greeting .blk .coll .box {
    padding: 50px 30px 45px;
  }
}

@media screen and (max-width: 1080px) {
  #greeting .blk .colr {
    width: 50%;
    margin: 0 0 0 -10%;
  }
  #greeting .blk .coll {
    width: 57%;
  }
  #greeting .blk .coll .box {
    padding: 50px 30px 45px;
  }
}

@media screen and (max-width: 980px) {
  #greeting .top-ttl {
    margin-bottom: 50px;
  }
  #greeting .blk {
    display: block;
  }
  #greeting .blk .colr {
    width: 500px;
    margin: 0 auto;
  }
  #greeting .blk .coll {
    width: 600px;
    margin: 0 auto 50px;
    padding-bottom: 0;
  }
  #greeting .blk .coll .box {
    padding: 50px 40px 45px;
  }
}

@media screen and (max-width: 767px) {
  #greeting {
    padding: 60px 0 0;
  }
  #greeting:before {
    width: 20px;
    height: 10px;
    top: 137px;
  }
  #greeting:after {
    background-image: url('../img/top/greeting_bg_sp.jpg');
    top: 147px;
    left: 0;
  }
  #greeting .top-ttl {
    margin-bottom: 74px;
  }
  #greeting .blk .coll {
    max-width: 600px;
    width: 100%;
  }
  #greeting .blk .coll .box {
    padding: 20px 20px 16px;
    margin-bottom: 31px;
  }
  #greeting .blk .coll .box:before {
    width: 20px;
    height: 10px;
    top: -5px;
  }
  #greeting .blk .coll .box h3 {
    line-height: 40px;
    padding-bottom: 14px;
    margin-bottom: 16px;
  }
  #greeting .blk .colr {
    width: 100%;
  }
  #greeting .blk .colr .name {
    font-size: 12px;
    line-height: 12px;
    top: 16px;
  }
  #greeting .blk .colr .name p {
    padding: 10px 10px 9px;
  }
  #greeting .blk .colr .name p:before {
    top: -16px;
  }
  #greeting .blk .colr .name .ttl1 {
    margin-top: 16px;
  }
}

#clinic {
  padding: 150px 0 100px;
  position: relative;
  z-index: 0;
}

#clinic:before {
  content: '';
  width: 50px;
  height: 25px;
  background-image: url('../img/top/deco3.png');
  background-repeat: no-repeat;
  background-size: 100%;
  position: absolute;
  right: calc(50% - 600px);
  top: 240px;
}

#clinic:after {
  content: '';
  height: 197px;
  background: #eae5de;
  position: absolute;
  left: 0;
  right: 0;
  top: 265px;
  z-index: -1;
}

#clinic .top-ttl {
  margin-bottom: 68px;
}

#clinic .blk1 {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 66px;
}

#clinic .blk1 .coll {
  width: 50%;
}

#clinic .blk1 .coll table {
  background: #fff;
  border: 1px solid #e3e0d6;
  font-size: 18px;
  line-height: 26px;
  letter-spacing: 0;
  text-align: center;
}

#clinic .blk1 .coll table th {
  width: 135px;
  border-right: 1px solid #e3e0d6;
  text-align: center;
  font-weight: 700;
}

#clinic .blk1 .coll table td {
  text-align: center;
  font-weight: 700;
}

#clinic .blk1 .coll table thead th,
#clinic .blk1 .coll table thead td {
  padding: 18px 0;
}

#clinic .blk1 .coll table thead th {
  letter-spacing: 0.04em;
}

#clinic .blk1 .coll table thead td {
  font-weight: 500;
}

#clinic .blk1 .coll table tbody tr {
  border-top: 1px solid #e3e0d6;
}

#clinic .blk1 .coll table tbody th,
#clinic .blk1 .coll table tbody td {
  padding: 26px 0;
}

#clinic .blk1 .coll .txt {
  font-size: 15px;
  line-height: 24px;
  letter-spacing: 0.04em;
  margin: 12px 0 0 11px;
}

#clinic .blk1 .coll .txt p + p {
  margin-top: 13px;
}

#clinic .blk1 .colr {
  width: 50%;
  padding-left: 50px;
}

#clinic .blk1 .colr .gmap {
  height: 359px;
  position: relative;
  margin-bottom: 15px;
}

#clinic .blk1 .colr .gmap iframe {
  width: 100%;
  height: 100%;
  border: none;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
}

#clinic .blk1 .colr .link {
  text-align: right;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.04em;
  line-height: 22px;
}

#clinic .blk1 .colr .link .icon-map {
  width: 16px;
  margin-right: 8px;
}

#clinic .blk1 .colr .link .icon-link {
  vertical-align: middle;
  width: 10px;
  margin-left: 16px;
  position: relative;
  top: -1px;
}

#clinic .blk1 .colr .link a:hover {
  opacity: 0.8;
}

#clinic .blk1 .colr .link a:hover img {
  opacity: 1 !important;
}

#clinic .blk2 {
  background: #fff;
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.04);
  border-top: 5px solid #71a0c9;
  display: flex;
  padding: 40px 0 20px;
  position: relative;
}

#clinic .blk2:after {
  content: '';
  width: 20px;
  height: 5px;
  background: #eea07a;
  position: absolute;
  right: 0;
  top: -5px;
}

#clinic .blk2 .col {
  width: 50%;
  padding: 0 17px;
}

#clinic .blk2 .col dl {
  width: 100%;
  display: table;
  line-height: 30px;
  margin-bottom: 20px;
}

#clinic .blk2 .col dl dt {
  display: table-cell;
  width: 130px;
  text-align: center;
  font-size: 16px;
  font-weight: 500;
  letter-spacing: 0.04em;
  color: #71a0c9;
}

#clinic .blk2 .col dl dd {
  display: table-cell;
  letter-spacing: 0;
}

#clinic .blk2 .col dl dd h1 {
  font-weight: 500;
}

@media screen and (max-width: 1240px) {
  #clinic:before {
    right: 20px;
  }
}

@media screen and (max-width: 980px) {
  #clinic .blk1 .coll {
    width: 55%;
  }
  #clinic .blk1 .colr {
    width: 45%;
    padding-left: 20px;
  }
  #clinic .blk2 {
    display: block;
  }
  #clinic .blk2 .col {
    width: 100%;
  }
}

@media screen and (max-width: 767px) {
  #clinic {
    padding: 60px 0;
  }
  #clinic:before {
    width: 20px;
    height: 10px;
    right: 32px;
    top: 141px;
  }
  #clinic:after {
    height: 126px;
    top: 151px;
  }
  #clinic .top-ttl {
    margin-bottom: 40px;
  }
  #clinic .blk1 {
    display: block;
  }
  #clinic .blk1 .coll {
    width: 100%;
    margin-bottom: 40px;
  }
  #clinic .blk1 .coll table {
    font-size: 14px;
    line-height: 20px;
  }
  #clinic .blk1 .coll table th {
    width: 112px;
  }
  #clinic .blk1 .coll table thead th,
  #clinic .blk1 .coll table thead td {
    padding: 10px 0;
  }
  #clinic .blk1 .coll table tbody th,
  #clinic .blk1 .coll table tbody td {
    padding: 18px 0;
  }
  #clinic .blk1 .coll .txt {
    font-size: 13px;
    line-height: 20px;
    margin: 10px 0 0 10px;
  }
  #clinic .blk1 .coll .txt p + p {
    margin-top: 10px;
  }
  #clinic .blk1 .colr {
    width: 100%;
    padding: 0;
  }
  #clinic .blk1 .colr .gmap {
    height: 228px;
    margin-bottom: 10px;
  }
  #clinic .blk1 .colr .link {
    line-height: 20px;
  }
  #clinic .blk1 .colr .link .icon-link {
    top: -2px;
  }
  #clinic .blk2 {
    margin: 0 -20px;
    padding: 37px 20px;
  }
  #clinic .blk2 .col {
    padding: 0;
  }
  #clinic .blk2 .col dl {
    width: 100%;
    display: block;
    margin-bottom: 14px;
  }
  #clinic .blk2 .col dl dt {
    display: block;
    width: 100%;
    text-align: left;
    margin-bottom: 4px;
  }
  #clinic .blk2 .col dl dd {
    display: block;
  }
}

#recruit {
  padding: 50px 20px;
  background: #ece6de;
}

#recruit .recruit-btn {
  max-width: 900px;
  width: 100%;
  margin: 0 auto;
  position: relative;
  z-index: 0;
}

#recruit .recruit-btn:before {
  content: '';
  width: 25px;
  height: 30px;
  background-image: url('../img/top/deco10.png');
  background-repeat: no-repeat;
  background-size: 100%;
  position: absolute;
  left: -10px;
  bottom: -10px;
  z-index: -1;
}

#recruit .recruit-btn:after {
  content: '';
  width: 30px;
  height: 25px;
  background-image: url('../img/top/deco11.png');
  background-repeat: no-repeat;
  background-size: 100%;
  position: absolute;
  right: -10px;
  top: -10px;
  z-index: -1;
}

#recruit .recruit-btn .recruit-a {
  display: block;
  background-image: url('../img/top/recruit_bg.jpg');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: 50%;
  padding: 30px 0 33px;
  text-align: center;
  color: #fff;
  position: relative;
}

#recruit .recruit-btn .recruit-a:hover {
  opacity: 0.8;
}

#recruit .recruit-btn .recruit-a:before {
  content: '';
  border: 1px solid #fff;
  position: absolute;
  left: 10px;
  top: 10px;
  right: 10px;
  bottom: 10px;
}

#recruit .recruit-btn .recruit-a .top-ttl {
  font-size: 40px;
  line-height: 58px;
}

#recruit .recruit-btn .recruit-a .top-ttl:before {
  background-image: url('../img/top/ttl_icon1_white.png');
  top: 14px;
  left: -44px;
}

#recruit .recruit-btn .recruit-a .top-ttl:after {
  background-image: url('../img/top/ttl_icon2_white.png');
  top: 14px;
  right: -44px;
}

#recruit .recruit-btn .recruit-a .txt {
  display: block;
  font-size: 20px;
  line-height: 29px;
}

#recruit .recruit-btn .recruit-a .btn-more {
  display: block;
  width: 110px;
  background: #fff;
  color: #71a0c9;
  border-radius: 25px;
  position: absolute;
  bottom: 20px;
  right: 20px;
  z-index: 1;
  font-size: 16px;
  line-height: 22px;
  padding: 4px 15px;
  text-align: left;
}

#recruit .recruit-btn .recruit-a .btn-more:after {
  content: '';
  width: 13px;
  background-image: url('../img/top/icon_arrow3.png');
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: 50%;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 15px;
}

@media screen and (max-width: 767px) {
  #recruit {
    padding: 45px 20px;
  }
  #recruit .recruit-btn:before {
    width: 20px;
    height: 20px;
    left: -5px;
    bottom: -4px;
  }
  #recruit .recruit-btn:after {
    width: 20px;
    height: 20px;
    right: -5px;
    top: -5px;
  }
  #recruit .recruit-btn .recruit-a {
    background-image: url('../img/top/recruit_bg_sp.jpg');
    padding: 40px 0;
  }
  #recruit .recruit-btn .recruit-a:hover {
    opacity: 1;
  }
  #recruit .recruit-btn .recruit-a .top-ttl {
    font-size: 32px;
    line-height: 46px;
  }
  #recruit .recruit-btn .recruit-a .top-ttl:before {
    top: 6px;
  }
  #recruit .recruit-btn .recruit-a .top-ttl:after {
    top: 6px;
  }
  #recruit .recruit-btn .recruit-a .txt {
    font-size: 15px;
    line-height: 22px;
    margin: 12px 15px 30px;
  }
  #recruit .recruit-btn .recruit-a .btn-more {
    position: relative;
    bottom: auto;
    right: auto;
    margin: 0 auto;
  }
}
