@charset "UTF-8";
/* ------------デバイス別style使いまわし用-----------*/
/* ------------style使いまわし用-----------*/
body {
  background: #d0ebff;
}

a {
  color: var(--bs-orange);
}

.Box_border {
  padding: 30px;
  border: #eee thin solid;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.5);
  text-align: center;
}

.section {
  padding: 70px 0;
}

h2 {
  display: inline-block;
}

/* navbar style */
.font_orange {
  color: #fa7a50;
}

.font_orange_shadow {
  text-shadow: rgba(255, 87, 34, 0.7) 2px 0px 2px, rgba(255, 87, 34, 0.7) -2px 0px 2px, rgba(255, 87, 34, 0.7) 0px -2px 2px, rgba(255, 87, 34, 0.7) -2px 0px 2px, rgba(255, 87, 34, 0.7) 2px 2px 2px, rgba(255, 87, 34, 0.7) -2px 2px 2px, rgba(255, 87, 34, 0.7) 2px -2px 2px, rgba(255, 87, 34, 0.7) -2px -2px 2px, rgba(255, 87, 34, 0.7) 1px 2px 2px;
}

.btn-primary {
  --bs-btn-bg: rgba(255, 106, 0, 0.85) ;
  --bs-btn-border-color: #fa7a50;
  --bs-btn-hover-bg: #f9b107;
  --bs-btn-hover-border-color: #f9b107;
}

.btn-outline-primary {
  --bs-btn-color: #fa7a50;
  --bs-btn-border-color: #fa7a50;
  --bs-btn-hover-color:#fff;
  --bs-btn-hover-bg: #fa7a50;
  --bs-btn-hover-border-color: #fa7a50;
}

/* estaService */
.estaService {
  background-image: url("../img/bg_001.png");
  background-repeat: no-repeat;
  background-position: 0 15rem;
}

.tentativeImage {
  /* 背景画像の上にrgbaを置いて背景画像のみを透過させる */
  padding-top: 3rem;
  background: rgba(255, 255, 255, 0.65);
}

/*-----------------  Content style of Overview ---------------------------------------*/
.Overview {
  position: relative;
  overflow: visible;
  background: url(../img/bg_001.png) 0 -10% no-repeat;
  background-size: 70%;
}

.Overview h2 {
  background: rgba(255, 255, 255, 0.86);
  border-radius: 10px;
  padding: 10px;
  position: relative;
  z-index: 1;
}
@media (max-width: 320px) {
  .Overview h2 {
    font-size: 1.8rem;
    padding-top: 20px;
    padding-bottom: 0;
    margin-bottom: 0;
  }
}

.Site_image {
  position: absolute;
  z-index: 0;
  top: -120px;
  right: 3%;
}
@media (min-width: 768px) and (max-width: 1024px) {
  .Site_image {
    /*  margin-top:50px; */
  }
}

.Our_Strengths {
  position: relative;
  padding-left: 10px;
  border: #f6e7c9 thin solid;
  border-radius: 10px;
  background: rgba(254, 250, 235, 0.81);
}

ul.Number {
  padding-top: 60px;
  padding-left: 20px;
}

.Our_Strengths .Number li {
  padding-left: 40px;
  padding-bottom: 10px;
  /* height: 45px; */
  line-height: 1.2;
  list-style: none;
  font-size: 1.3rem;
  text-align: left;
}

.Our_Strengths .Number_01 {
  background: url(../img/icon_01.png) 0 0% no-repeat;
  background-size: 30px;
}

.Our_Strengths .Number_02 {
  background: url(../img/icon_02.png) 0 0% no-repeat;
  background-size: 30px;
}

.Our_Strengths .Number_03 {
  background: url(../img/icon_03.png) 0 0% no-repeat;
  background-size: 30px;
}

.Our_Strengths__image {
  position: absolute;
  top: 8px;
  left: -15px;
  z-index: 5;
}

h3.Our_Strengths__catch {
  margin-bottom: 0;
}

.Our_Strengths__catch {
  position: relative;
  width: 280px;
  height: 280px;
  background: rgba(255, 69, 0, 0.44);
  border-radius: 50% 50%;
  padding: 30px 25px 0px 25px;
}
@media (max-width: 374px) {
  .Our_Strengths__catch {
    width: 260px;
  }
}
@media (max-width: 1024px) {
  .Our_Strengths__catch {
    margin: 0 auto;
  }
}

.Our_Strengths__catch i.now-ui-icons.sport_user-run {
  font-size: 2rem;
}

.Our_Strengths__catch_cover {
  position: relative;
}

span.-triangle {
  position: absolute;
  bottom: 50%;
  left: -15px;
  height: 0;
  border-style: solid;
  border-width: 10px 16px 10px 0;
  border-color: transparent rgba(255, 69, 0, 0.44) transparent transparent;
  z-index: 10;
}
@media (max-width: 1024px) {
  span.-triangle {
    left: -15px;
  }
}

.Our_Strengths__goto {
  position: absolute;
  width: 100px;
  height: 100px;
  background: rgba(247, 245, 242, 0.7);
  border-radius: 50% 50%;
  padding: 25px 10px 0px 10px;
  z-index: 10;
  right: 25%;
  bottom: -30px;
  border: #fc6c04 3px solid;
  line-height: 1.2;
  text-align: center;
}
@media (max-width: 576px) {
  .Our_Strengths__goto {
    bottom: -40px;
  }
}
@media (min-width: 577px) and (max-width: 1023px) {
  .Our_Strengths__goto {
    right: 15%;
  }
}
@media (min-width: 1400px) {
  .Our_Strengths__goto {
    right: 25%;
    bottom: -50px;
  }
}

.Our_Strengths__system {
  width: 100%;
}
@media (min-width: 992px) {
  .Our_Strengths__system {
    width: 75%;
  }
}
@media (min-width: 1366px) {
  .Our_Strengths__system {
    width: 70%;
  }
}
