.uservoice {
  max-width: 93%;
  width: 100%;
  margin: calc(95 / 1800 * 100vw) auto 0;
  border-left: 1px solid #a0a0a0;
  border-right: 1px solid #a0a0a0;
}

.uservoice .mv-ttl {
  width: 100%;
  margin: 0 auto;
  position: relative;
}

.uservoice .mv-ttl-text {
  line-height: 1.6;
  letter-spacing: .2em;
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  transform: translateY(-50%);
  text-align: center;
  font-size: calc(43 / 1800 * 100vw);
  color: #5a322a;
  font-weight: bold;
  margin-top: calc(32 / 1800 * 100vw);
	/*text-shadow: 0 0 1px #5a322a;*/
}

.uservoice .mv-lead {
  margin: calc(118 / 1800 * 100vw) auto 0;
}

.uservoice .mv-lead-title {
  text-align: center;
  font-size: calc(36 / 1800 * 100vw);
  line-height: 1.78;
  color: #5a322a;
  font-weight: bold;
  letter-spacing: .2em;
	/*text-shadow: 0 0 1px #5a322a;*/
}

.uservoice .mv-lead-note {
  color: #c30d23;
  text-align: center;
  font-size: calc(16 / 1800 * 100vw);
	margin-top:calc(10 / 1800 * 100vw);
	line-height: 2;
}

.uservoice .mv-lead picture {
  width: 42.5%;
  margin: 0 auto;
}

.uservoice-content {
  margin:  calc(139.4 / 1800 * 100vw) auto 0;
  width: calc(1400 / 1800 * 100vw);
}

.uservoice-content-section {
  margin-bottom: calc(176 / 1800 * 100vw);
}

.uservoice-content-header {
  position: relative;
  aspect-ratio: 334 / 334;
  width: calc(334 / 1800 * 100vw);
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  z-index: 1;
}

.uservoice-content-header:before,
.uservoice-content-header:after {
  content: "";
  display: block;
  height: calc(100% - 10px);
  position: absolute;
  width: 100%;
}

.uservoice-content-header:before {
  border-left: 2.5px solid #9ac2bd;
  border-top: 2.5px solid #9ac2bd;
  left: 0;
  top: 0;
}

.uservoice-content-header:after {
  border-right: 2.5px solid #9ac2bd;
  border-bottom: 2.5px solid #9ac2bd;
  right: 0;
  bottom: 0;
}

.uservoice-content-label {
  position: absolute;
  top: -.8em;
  left: .5357em;
  font-size: calc(28 / 1800 * 100vw);
  color: #9ac2bd;
  background-color: #fff;
  padding: 0 calc(20 / 1800 * 100vw) 0 calc(9 / 1800 * 100vw);
}

.uservoice-content-name {
  font-size: calc(21 / 1800 * 100vw) ;
	font-weight: bold;
}

.uservoice-content-box {
  margin-bottom: calc(60 / 1800 * 100vw);
  position: relative;
}


.uservoice-interview {
  width: calc(986 / 1800 * 100vw);
  box-sizing: border-box;
}


.uservoice-content-section:nth-child(odd) .uservoice-interview {
  background-color: #f5f9f8;
}

.uservoice-content-section:nth-child(odd) .uservoice-content-box:nth-child(even) .uservoice-interview {
  margin-left: auto;
}


/* �������� */

.uservoice-content-section:nth-child(even) .uservoice-interview {
  background-color: #f5fbfe;
}

.uservoice-content-section:nth-child(even) .uservoice-content-header {
  margin-left: auto;
}

.uservoice-content-section:nth-child(even) .uservoice-content-box:nth-child(odd) .uservoice-interview {
  margin-left: auto;
}

.uservoice-interview {
  padding: calc(80 / 1800 * 100vw) calc(80 / 1800 * 100vw) calc(80 / 1800 * 100vw) calc(90 / 1800 * 100vw);
}

.uservoice-interview * {
}

.uservoice-interview-question,
.uservoice-interview-answer {
  display: flex;
}

.uservoice-content-header + .uservoice-content-box {
  margin-top: calc(-50 / 1800 * 100vw);
}


.uservoice-interview-question {
  margin-bottom: calc(20 / 1800 * 100vw);
  gap: calc(32 / 1800 * 100vw);
  margin-top: calc(70 / 1800 * 100vw);
}

.uservoice-interview-question:first-child {
  margin-top: 0;
}

.uservoice-interview-question * {
  font-size: calc(26 / 1800 * 100vw);
  line-height: 1.6;
  font-weight: bold;
  color: #9ac2bd;
	/*text-shadow: 0 0 1px #9ac2bd;*/
}

.uservoice-interview-question .label,
.uservoice-interview-answer .label {
  letter-spacing: .1em;
}

.uservoice-interview-answer {
  padding-left: calc(56 / 1800 * 100vw);
  gap: calc(20 / 1800 * 100vw);
}

.uservoice-interview-answer * {
  font-size: calc(21 / 1800 * 100vw);
  line-height: 2;
  color: #5a322a;
	/*text-shadow: 0 0 1px #5a322a;*/
}

.uservoice-interview-answer .label {
  font-weight: bold;
}


.uservoice-image {
  position: absolute;
  z-index: 1;
}


.voice1 .uservoice-content-box:nth-child(2) {
  margin-right: calc(110 / 1800 * 100vw);
}

.voice1 .uservoice-content-box:nth-child(2) .uservoice-image {
  width: calc(300 / 1800 * 100vw);
  bottom: calc(-32 / 1800 * 100vw);
  left: calc(32 / 1800 * 100vw);
}

.voice1 .uservoice-content-box:nth-child(3) {
  margin-left: calc(138 / 1800 * 100vw);
}


.voice1 .uservoice-content-box:nth-child(3) .uservoice-image {
  width: calc(300 / 1800 * 100vw);
  bottom: calc(-32 / 1800 * 100vw);
  right: 0;
}

.voice2 .uservoice-content-header {
  margin-right: calc(108 / 1800 * 100vw);
}

.voice2 .uservoice-content-box:nth-child(2) {
}

.voice2 .uservoice-content-box:nth-child(2) .uservoice-image {
  width: calc(401 / 1800 * 100vw);
  bottom: 0;
  right: calc(-18 / 1800 * 100vw);
}

.voice2 .uservoice-content-box:nth-child(3) .uservoice-image {
  width: calc(401 / 1800 * 100vw);
  top: 0;
  left: calc(-18 / 1800 * 100vw);
}

.voice3 .uservoice-content-header {
  margin-left: calc(66 / 1800 * 100vw);
}

.voice3 .uservoice-content-header + .uservoice-content-box {
  margin-top: calc(-100 / 1800 * 100vw);
}

.voice3 .uservoice-content-box:nth-child(2) {
  margin-right: calc(43 / 1800 * 100vw);
}

.voice3 .uservoice-content-box:nth-child(2) .uservoice-image {
  width: calc(401 / 1800 * 100vw);
  bottom: calc(-83 / 1800 * 100vw);
  left: 0;
}

.voice3 .uservoice-content-box:nth-child(3) {
  margin-left: calc(138 / 1800 * 100vw);
}

.voice3 .uservoice-content-box:nth-child(3) .uservoice-image {
  width: calc(401 / 1800 * 100vw);
  bottom: calc(-32 / 1800 * 100vw);
  right: 0;
}

.voice4 .uservoice-content-header + .uservoice-content-box {
  margin-top: calc(-56 / 1800 * 100vw);
}

.voice4 .uservoice-content-box:nth-child(2) {
  margin-left: calc(100 / 1800 * 100vw);
}

.voice4 .uservoice-content-box:nth-child(2) .uservoice-image {
  width: calc(301 / 1800 * 100vw);
  bottom: calc(-31 / 1800 * 100vw);
  right: calc(38 / 1800 * 100vw);
}

.voice4 .uservoice-content-box:nth-child(3) .uservoice-image {
  width: calc(301 / 1800 * 100vw);
  bottom: calc(-28 / 1800 * 100vw);
  left: calc(80 / 1800 * 100vw);
}


@media screen and (max-width: 768px) {
  .uservoice {
    max-width: 100%;
    width: 100%;
  }

  .uservoice-content {
    width: 100%;
    padding: 0 calc(42 / 640 * 100vw);
  }

  .uservoice .mv-ttl {
    width: 100%;
    margin: 0 auto;
  }
  .uservoice .mv-lead {
    width: 88%;
    margin: calc(83 / 640 * 100vw) auto 0;
  }
  .uservoice-content {
    margin: calc(160 / 640 * 100vw) auto 0;
  }

  .uservoice .mv-ttl-text {
    font-size: calc(37 / 640 * 100vw);
    margin-top: calc(-20 / 640 * 100vw);
  }

  .uservoice .mv-lead-title {
    font-size: calc(35 / 640 * 100vw);
    letter-spacing: .15em;
    line-height: 1.7;
  }

  .uservoice .mv-lead-note {
    font-size: calc(17 / 640 * 100vw);
    margin-top: calc(42 / 640 * 100vw);
    letter-spacing: 0;
    margin-left: calc(-5 / 640 * 100vw);
    margin-right: calc(-5 / 640 * 100vw);
  }

  .uservoice-content-section {
    margin-bottom: calc(80 / 640 * 100vw);
  }

  .uservoice-content-header {
    width: calc(553 / 640 * 100vw);
    aspect-ratio: 552 / 178;
    margin: 0 0 0 calc(-17 / 640 * 100vw) !important;
  }

  .uservoice-content-label {
    font-size: calc(28 / 640 * 100vw);
    padding: 0 calc(23 / 640 * 100vw) 0 calc(8 / 640 * 100vw);
  }

  .uservoice-content-name {
    font-size: calc(25 / 640 * 100vw);
  }

  .uservoice-content-header + .uservoice-content-box {
    margin-top: calc(-59 / 640 * 100vw) !important;
  }

  .uservoice-interview {
    width: 100%;
  }

  .uservoice-content-box {
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-bottom: 0;
  }

  .uservoice-content-box + .uservoice-content-box {
    margin-top: calc(-50 / 640 * 100vw);
  }

  .uservoice-interview {
padding: calc(148 / 640 * 100vw) calc(23 / 640 * 100vw) calc(148 / 640 * 100vw) calc(20 / 640 * 100vw);
	}


  .uservoice-interview-question {
    gap: calc(30 / 640 * 100vw);
    margin-top: calc(80 / 640 * 100vw);
    margin-bottom: calc(28 / 640 * 100vw);
  }

  .uservoice-interview-question * {
    font-size: calc(25 / 640 * 100vw);
    line-height: 1.75;
  }

  .uservoice-interview-answer {
    padding-left: calc(16 / 640 * 100vw);
    gap: calc(20 / 640 * 100vw);
  }

  .uservoice-interview-answer * {
    font-size: calc(21 / 640 * 100vw);
    line-height: 2;
    color: #5a322a;
  }

  .uservoice-image {
    position: relative;
    top: 0 !important;
    bottom: 0 !important;
    margin-top: calc(-44 / 640 * 100vw);
  }

  .uservoice-content-box:nth-child(2) .uservoice-image {
    left: calc(-14 / 640 * 100vw) !important;
    right: auto !important;
  }
  .uservoice-content-box:nth-child(3) .uservoice-image {
    right: calc(-14 / 640 * 100vw) !important;
    left: auto !important;
    margin-left: auto;
  }

  .voice1 .uservoice-image,
  .voice4 .uservoice-image {
    width: calc(291 / 640 * 100vw) !important;
  }

  .voice2 .uservoice-image,
  .voice3 .uservoice-image {
    width: calc(401 / 640 * 100vw) !important;
  }

  .uservoice-interview-question .text,
  .uservoice-interview-description {
    letter-spacing: -.02em;
  }
}