:root {
  --width-content: 86%;
  --width-content2: 76%;
  --width-content-left: 7%;
  --width-content-left2: 12%;
}
video {
  vertical-align: middle;
}
.title {
  font-size: 2.34375vw;
  font-family: "MyriadPro-Regular", Arial;
  color: #000000;
  padding-bottom: 0.3em;
  font-weight: bold;
}
.text {
  font-size: 1.171875vw;
  font-family: "MyriadPro-Regular", Arial;
  color: #000;
}
.text-xs {
  font-size: 0.9375vw;
  font-family: "MyriadPro-Regular", Arial;
  color: #bac0ca;
}
ul,
li {
  list-style: none;
}
.ego-nano-content {
  margin: 0 auto;
}
.JOYEcontent {
  background-color: #fff;
}
.ego-nano-01 {
  position: relative;
  width: 100%;
}
.ego-nano-01 .ego-nano-01-1 {
  position: absolute;
  left: 64.765625vw;
  top: 7.2265625vw;
  width: 26.484375vw;
}
.ego-nano-01 .ego-nano-01-1 img {
  width: 100%;
}
.ego-nano-02 {
  background: #f8f9f9;
  padding: 6.171875vw 0 5.46875vw;
  text-align: center;
}
.ego-nano-02 img {
  width: 100%;
}
.ego-nano-02 .ego-nano-content {
  width: var(--width-content2);
}
.ego-nano-02 .ego-nano-content .ego-nano-02-1 {
  padding: 0 7.421875vw;
  display: flex;
  padding-bottom: 2em;
  justify-content: space-between;
}
.ego-nano-02 .ego-nano-content .ego-nano-02-1 img {
  width: 19%;
}
.ego-nano-02 .ego-nano-content p {
  color: #4f4f4f;
  text-align: left;
}
.ego-nano-03 {
  width: 100%;
  padding: 3.6328125vw 0 4.296875vw;
  background-color: #fff;
}
.ego-nano-03 .ego-nano-content {
  width: var(--width-content2);
  text-align: center;
}
.ego-nano-03 p {
  padding-bottom: 2em;
}
.ego-nano-04 {
  position: relative;
  width: 100%;
}
.ego-nano-04 img {
  width: 100%;
}
.ego-nano-04 .ego-nano-04-1 {
  position: absolute;
  left: var(--width-content-left2);
  top: 10.546875vw;
}
.ego-nano-05 {
  position: relative;
  width: 100%;
}
.ego-nano-05 .ego-nano-05-1 {
  position: absolute;
  left: 63.9453125vw;
  top: 5.6640625vw;
}
.ego-nano-06 {
  background: #fff;
  position: relative;
  width: 100%;
  padding: 5.078125vw 0 5.46875vw;
}
.ego-nano-06 .ego-nano-content {
  width: var(--width-content2);
  text-align: center;
}
.ego-nano-06 .ego-nano-content > p {
  padding-bottom: 2em;
}
.ego-nano-06 .ego-nano-content .ego-nano-06-1 {
  background: url("ego-nano-06.jpg") center;
  background-size: cover;
  border-radius: 2em;
  display: flex;
  padding-top: 2em;
  padding-left: 8.203125vw;
  padding-right: 8.203125vw;
  align-items: center;
}
.ego-nano-06 .ego-nano-content .ego-nano-06-1 p.text-xs {
  color: #4f4f4f;
}
.ego-nano-06 .ego-nano-content .ego-nano-06-1 .ego-nano-06-2 {
  width: 24.375vw;
  text-align: center;
}
.ego-nano-06 .ego-nano-content .ego-nano-06-1 .ego-nano-06-2 img {
  width: 9.375vw;
  margin: 0 auto;
}
.ego-nano-06 .ego-nano-content .ego-nano-06-1 .ego-nano-06-3 > p {
  color: #bac0ca;
}
.ego-nano-06 .ego-nano-content .ego-nano-06-4 {
  display: flex;
  justify-content: space-between;
  padding-bottom: 2em;
}
.ego-nano-06 .ego-nano-content .ego-nano-06-4 p {
  padding-top: 0.5em;
}
.ego-nano-06 .ego-nano-content .ego-nano-06-4 .ego-nano-06-4-1 {
  padding: 3%;
  background-color: #fff;
  width: 48%;
  border-radius: 1rem;
}
.ego-nano-06 .ego-nano-content .ego-nano-06-4 .ego-nano-06-4-1 .text {
  font-weight: bold;
  color: #fe4e00;
  padding-bottom: 0.5em;
}
.ego-nano-06 .ego-nano-content .ego-nano-06-4 .ego-nano-06-4-1 .flex {
  display: flex;
  justify-content: space-around;
}
.ego-nano-06 .ego-nano-content .ego-nano-06-4 .ego-nano-06-4-2 {
  padding: 3%;
  background-color: #fff;
  width: 48%;
  border-radius: 1rem;
}
.ego-nano-06 .ego-nano-content .ego-nano-06-4 .ego-nano-06-4-2 .text {
  font-weight: bold;
  color: #b924ff;
  padding-bottom: 0.5em;
}
.ego-nano-06 .ego-nano-content .ego-nano-06-4 .ego-nano-06-4-2 .flex {
  display: flex;
  justify-content: space-around;
}
.ego-nano-06 .ego-nano-content .ego-nano-06-4 img {
  width: 3.90625vw;
}
.ego-nano-07 {
  position: relative;
  width: 100%;
}
.ego-nano-07 .ego-nano-07-img {
  width: 100%;
}
.ego-nano-07 .ego-nano-07-txt {
  position: absolute;
  left: var(--width-content-left2);
  width: var(--width-content2);
  top: 10.546875vw;
}
.ego-nano-08 {
  position: relative;
  width: 100%;
}
.ego-nano-08 .ego-nano-08-1 {
  position: absolute;
  left: 58.7890625vw;
  top: 13.0859375vw;
}
.ego-nano-08 .ego-nano-08-1 p {
  padding-bottom: 2em;
}
.ego-nano-08 .ego-nano-08-2 img {
  width: 3.9453125vw;
  margin-right: 1.5em;
}
.ego-nano-08 .ego-nano-08-2 ul {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 10em;
}
.ego-nano-08 .ego-nano-08-2 ul li {
  line-height: 2em;
}
.ego-nano-09 {
  background: #fff;
  padding: 6.171875vw 0 7.03125vw;
}
.ego-nano-09 .ego-nano-content {
  width: var(--width-content2);
  text-align: center;
}
.ego-nano-09 .ego-nano-content h2 {
  padding-bottom: 1em;
}
.ego-nano-09 .ego-nano-content .ego-nano-09-1 {
  width: 100%;
  background-color: #eeeeee;
  border-radius: 2em;
  padding: 3% 9%;
}
.ego-nano-09 .ego-nano-content .ego-nano-09-1 .ego-nano-09-1-pic {
  position: relative;
  width: 100%;
}
.ego-nano-09 .ego-nano-content .ego-nano-09-1 .ego-nano-09-1-pic .ego-nano-09-1-pic-txt {
  position: absolute;
  width: 100%;
  left: 0;
  top: 0;
}
.ego-nano-10 {
  position: relative;
  width: 100%;
}
.ego-nano-10 img {
  width: 100%;
}
.ego-nano-10 .ego-nano-10-1 {
  position: absolute;
  left: var(--width-content-left2);
  top: 10vw;
}
.ego-nano-10 .ego-nano-10-1 h2 {
  padding-bottom: 0.5em;
}
.ego-nano-10 .ego-nano-10-1 p {
  line-height: 2;
}
.ego-nano-11 {
  position: relative;
  background-color: #dddddd;
  text-align: center;
  padding-top: 3.7109375vw;
  padding-bottom: 5.46875vw;
}
.ego-nano-11 h2 {
  padding-bottom: 0.5em;
}
.ego-nano-11 .pro-inbox-context {
  width: var(--width-content2);
  max-width: var(--width-content2);
  margin: 0 auto;
  display: flex;
}
.ego-nano-11 .pro-inbox-context .inbox-img {
  width: 70%;
  background: #fff;
  border-radius: 20px 0 0 20px;
  text-align: center;
}
.ego-nano-11 .pro-inbox-context .inbox-img img {
  width: 100%;
  margin: 0 auto;
  border-radius: 20px 0 0 20px;
}
.ego-nano-11 .pro-inbox-context .inbox-text {
  width: 30%;
  background-color: #eeeeee;
  padding-left: 3%;
  border-radius: 0 20px 20px 0;
  display: flex;
  align-items: center;
  text-align: left;
}
.ego-nano-11 .pro-inbox-context .inbox-text h3 {
  font-size: 1.2rem;
  color: #000000;
  font-weight: 600;
}
.ego-nano-11 .pro-inbox-context .inbox-text .text {
  line-height: 1.5;
  text-align: left;
}
.ego-nano-11 .pro-inbox-context .inbox-text .red {
  color: #e04500;
  font-size: 1.2rem;
}
.ego-nano-11 .pro-inbox-context .inbox-text ul {
  padding-top: 0.2em;
}
.ego-nano-11 .pro-inbox-context .inbox-text li {
  font-size: 0.8em;
  color: #333333;
  line-height: 1.8;
}
.ego-nano-11 .swiper-button-next {
  right: calc(var(--width-content-left2)*0.7);
}
.ego-nano-11 .swiper-button-prev {
  left: calc(var(--width-content-left2)*0.7);
}
.ego-nano-11 .swiper-button-next,
.ego-nano-11 .swiper-button-prev {
  color: #000;
}
@media (max-width: 1920px) {
  .text {
    font-size: 1.09375vw;
  }
  .text-xs {
    font-size: 0.859375vw;
  }
}
@media (max-width: 1399px) {
  :root {
    --width-content: 82%;
    --width-content2: 80%;
    --width-content-left: 9%;
    --width-content-left2: 10%;
  }
  .text {
    font-size: 1.25vw;
  }
  .text-xs {
    font-size: 1.09375vw;
  }
  .ego-nano-08 .ego-nano-08-1 {
    top: 8vw;
    left: 50%;
  }
  .ego-nano-11 .swiper-button-prev {
    left: 5%;
  }
  .ego-nano-11 .swiper-button-next {
    right: 5%;
  }
}
@media (max-width: 991px) {
  :root {
    --width-content: 86%;
    --width-content-left: 7%;
    --width-content2: 84%;
    --width-content-left2: 8%;
  }
  .title {
    font-size: 3vw;
  }
  .title-80 {
    font-size: 4vw;
  }
  .title-50 {
    font-size: 2.8vw;
  }
  .text {
    font-size: 1.54545455vw;
  }
  .text-xs {
    font-size: 1.36363636vw;
  }
  .ego-nano-11 .swiper-button-prev {
    left: 2%;
  }
  .ego-nano-11 .swiper-button-next {
    right: 2%;
  }
}
@media (max-width: 767px) {
  :root {
    --width-content: 92%;
    --width-content-left: 4%;
    --width-content2: 88%;
    --width-content-left2: 6%;
    --swiper-navigation-size: 30px;
  }
  .title {
    font-size: 7.16145833vw;
    line-height: 1.2;
    text-transform: none;
    font-weight: 400;
  }
  .text {
    font-size: 3.64583333vw;
    padding-top: 0;
  }
  .text-xs {
    font-size: 2.34375vw;
  }
  .ego-nano-01 .ego-nano-01-1 {
    width: 41.66666667vw;
    left: 53.38541667vw;
    top: 19.53125vw;
  }
  .ego-nano-02 {
    padding: 0;
    background-color: #f1f1f1;
    padding-bottom: 2%;
  }
  .ego-nano-02 .ego-nano-content {
    background-color: #fff;
    width: 100%;
    padding: 9% var(--width-content-left2) 7%;
  }
  .ego-nano-02 .ego-nano-content .ego-nano-02-1 {
    padding-bottom: 0;
    flex-wrap: wrap;
  }
  .ego-nano-02 .ego-nano-content .ego-nano-02-1 img {
    width: 45%;
    margin-bottom: 1em;
  }
  .ego-nano-02 p.ego-nano-content {
    background-color: #f1f1f1;
  }
  .ego-nano-03 {
    padding: 0;
  }
  .ego-nano-03 .ego-nano-content {
    width: 100%;
    position: relative;
  }
  .ego-nano-03 .ego-nano-content .ego-nano-03-text {
    position: absolute;
    top: 4%;
    left: var(--width-content-left2);
    width: var(--width-content2);
    text-align: left;
  }
  .ego-nano-05 .ego-nano-05-1 {
    top: 7%;
    left: var(--width-content-left2);
  }
  .ego-nano-06 {
    padding-top: 8%;
  }
  .ego-nano-06 .ego-nano-content > h2 {
    text-align: left;
  }
  .ego-nano-06 .ego-nano-content > p {
    text-align: left;
  }
  .ego-nano-06 .ego-nano-content .ego-nano-06-1 {
    background: #fff;
    padding: 0;
    display: block;
  }
  .ego-nano-06 .ego-nano-content .ego-nano-06-1 .ego-nano-06-2 {
    display: none;
  }
  .ego-nano-06 .ego-nano-content .ego-nano-06-1 .ego-nano-06-3 > p {
    text-align: left;
  }
  .ego-nano-06 .ego-nano-content .ego-nano-06-4 {
    flex-direction: column;
    padding-bottom: 0.5em;
  }
  .ego-nano-06 .ego-nano-content .ego-nano-06-4 .ego-nano-06-4-1 {
    width: 100%;
    background: url(ego-nano-06-1-m.jpg) no-repeat;
    background-size: cover;
    margin-bottom: 2rem;
    padding: 8% 26%;
  }
  .ego-nano-06 .ego-nano-content .ego-nano-06-4 .ego-nano-06-4-1 .text {
    padding-bottom: 0.8em;
    font-size: 1.5em;
  }
  .ego-nano-06 .ego-nano-content .ego-nano-06-4 .ego-nano-06-4-2 {
    width: 100%;
    background: url(ego-nano-06-2-m.jpg) no-repeat;
    background-size: cover;
    padding: 8% 26%;
  }
  .ego-nano-06 .ego-nano-content .ego-nano-06-4 img {
    width: 14vw;
  }
  .ego-nano-08 .ego-nano-08-1 {
    left: var(--width-content-left2);
    width: var(--width-content2);
  }
  .ego-nano-08 .ego-nano-08-2 ul {
    flex-direction: row;
    height: auto;
    vertical-align: middle;
    align-items: center;
  }
  .ego-nano-08 .ego-nano-08-2 ul img {
    width: 2.5em;
    margin-right: 0.5em;
  }
  .ego-nano-08 .ego-nano-08-2 ul li {
    width: 30%;
    font-size: 3.125vw;
  }
  .ego-nano-09 {
    background: #eee;
  }
  .ego-nano-09 .ego-nano-content h2 {
    text-align: left;
    padding: 0.5em 0 0.5em;
  }
  .ego-nano-09 .ego-nano-content .ego-nano-09-1 {
    padding-left: 0;
    padding-right: 0;
  }
  .ego-nano-10 .ego-nano-10-1 h2 {
    padding-bottom: 0.4em;
  }
  .ego-nano-10 .ego-nano-10-1 p {
    line-height: 1.5;
  }
  .ego-nano-11 {
    padding: 10% 0 13%;
  }
  .ego-nano-11 .pro-inbox-context {
    flex-direction: column;
  }
  .ego-nano-11 .pro-inbox-context .inbox-img {
    width: 100%;
    border-radius: 20px 20px 0 0;
    padding-top: 2rem;
    padding-bottom: 0;
  }
  .ego-nano-11 .pro-inbox-context .inbox-text {
    width: 100%;
    border-radius: 0 0 20px 20px;
    padding-top: 2rem;
    padding-bottom: 2rem;
    padding-left: 8%;
  }
  .ego-nano-11 .pro-inbox-context .inbox-text .text {
    width: 100%;
  }
  .ego-nano-11 .pro-inbox-context .inbox-text .text ul {
    display: flex;
    flex-wrap: wrap;
  }
  .ego-nano-11 .pro-inbox-context .inbox-text .text ul LI {
    min-width: 50%;
  }
  .swiper-button-next,
  .swiper-button-prev {
    -webkit-background-size: 15px 30px;
    background-size: 15px 30px;
  }
  .swiper-button-next,
  .swiper-button-prev {
    top: 50%;
    width: 15px;
    height: 30px;
    margin-top: 0;
    -webkit-background-size: 15px 30px;
    background-size: 15px 30px;
  }
  .ego-nano-11 .swiper-button-prev {
    left: 2%;
  }
  .ego-nano-11 .swiper-button-next {
    right: 2%;
  }
}