@charset "utf-8"; /**/

/* BASE */
.mT60 {
  margin-top: 60px;
}
.mT40 {
  margin-top: 40px;
}
.mT20 {
  margin-top: 20px;
}
.pB20 {
  padding-bottom: 20px;
}

/* Top Page */
#qArea {
  padding: 10% 0;
  background: #f3f3f3;
}

.qaBox li {
  margin: 0 10%;
}

.qaBox .flickarrow_q1 ul {
  background-image: url(../image/flick_arrow_bg_q1.png);
  background-repeat: no-repeat;
  background-position: center;
}

.qaBox .flickarrow_q2,
.flickarrow_q3,
.flickarrow_q4 ul {
  background-image: url(../image/flick_arrow_bg_q2_3.png);
  background-repeat: no-repeat;
  background-position: center;
}

.qaBox .flickarrow_q5 ul {
  background-image: url(../image/flick_arrow_bg_q4.png);
  background-repeat: no-repeat;
  background-position: center;
}

#qalert {
  margin: 0 7%;
  color: #ed8c61;
  text-indent: -1em;
  padding-left: 1em;
  text-align: left;
}

.body_sph #qalert {
  font-size: 0.85em;
}

#qContainer li {
  padding: 5% 0;
}

/*    */
.gowa_top {
  position: relative;
}

.gowa_start {
  position: absolute;
  left: 50%;
  top: 86%;
  width: 60%;
  transform: translate(-50%, 0);
}

.body_pc .gowa_start {
  top: 86%;
  width: 50%;
}

/* lip page */

/**    o   **/
.ltop {
  position: relative;
}
.btn_syosai {
  position: absolute;
  bottom: 8%;
  left: 0;
  right: 0;
  padding: 0 20%;
}

.body_pc .btn_syosai {
  position: absolute;
  bottom: 8%;
  left: 0;
  right: 0;
  padding: 0 25%;
}

/**  f f          **/
.gowatsuki_result {
  text-align: center;
}

.gowatsuki_result .condition {
  padding: 8% 0;
  width: 90%;
}
.body_pc .gowatsuki_result .condition {
  width: 75%;
}

.gowatsuki_result .result {
  width: 85%;
}

.gowatsuki_result p {
  color: #4e60a5;
}

.gowatsuki_result .txt1 {
  font-size: 1.25em;
  margin-bottom: 1.3em;
  letter-spacing: 0.05em;
}
.body_pc .gowatsuki_result .txt1 {
  font-size: 1.9em;
  letter-spacing: 0.1em;
}

.gowatsuki_result .txt2 {
  font-size: 1.7em;
  letter-spacing: 0.05em;
  margin: 4% 0 3%;
}
.body_pc .gowatsuki_result .txt2 {
  font-size: 1.9em;
  letter-spacing: 0.05em;
  margin: 4% 0 3%;
}

.cart_btn {
  width: 55%;
  margin-bottom: 3%;
}
.body_pc .cart_btn {
  width: 50%;
  margin-bottom: 3%;
}

.bestchoice_square {
  width: 95%;
  padding-bottom: 3%;
}

.gowa_attention {
  color: #4c5fa4;
  text-align: right;
}
.body_sph .gowa_attention {
  font-size: 0.8em;
}
/**  f f     10% **/
.gowatsuki_10 {
  background-color: #fffcf4;
}

.gowatsuki_10 a:hover {
  opacity: 0.8;
}

.bestchoice_10 {
  width: 95%;
  margin: 0 auto;
  position: relative;
  z-index: 0;
  margin-bottom: 15%;
  padding-top: 8%;
}
.gowatsuki_10 .square {
  background-color: #fdf8e8;
  width: 95%;
  height: 87%;
  position: absolute;
  z-index: -1;
  bottom: -2%;
  left: 6%;
}

.body_pc .gowatsuki_10 .square {
  height: 84.5%;
  bottom: -2%;
  left: 5%;
}

.bestchoice_10 .best_item {
  width: 55%;
}
.body_pc .bestchoice_10 .best_item {
  width: 55%;
}

.otherchoice_10 {
  background-color: #ffedc5;
  position: relative;
  padding-bottom: 7%;
}
.otherchoice_10 .other_item {
  width: 55%;
}

.body_pc .otherchoice_10 .other_item {
  width: 50%;
}

.otherchoice_10 .title {
  width: 50%;
  position: absolute;
  transform: translate(-50%, 0);
  left: 50%;
  top: -1.5%;
}

.otherchoice_10 .choice {
  padding: 7% 0 7%;
  text-align: right !important;
}

/**  f f     30% **/
.gowatsuki_30 {
  background-color: #fff9f5;
}

.gowatsuki_30 a:hover {
  opacity: 0.8;
}

.bestchoice_30 {
  width: 95%;
  margin: 0 auto;
  position: relative;
  z-index: 0;
  margin-bottom: 15%;
  padding-top: 8%;
}
.gowatsuki_30 .square {
  background-color: #fff4eb;
  width: 95%;
  height: 84%;
  position: absolute;
  z-index: -1;
  bottom: 3%;
  left: 6%;
}

.body_pc .gowatsuki_30 .square {
  height: 79.5%;
  bottom: 3%;
  left: 5%;
}

.bestchoice_30 .best_item {
  width: 55%;
}
.body_pc .bestchoice_30 .best_item {
  width: 50%;
}

.otherchoice_30 {
  background-color: #ffddc4;
  position: relative;
  padding-bottom: 7%;
}
.otherchoice_30 .other_item {
  width: 55%;
}

.body_pc .otherchoice_30 .other_item {
  width: 45%;
}

.otherchoice_30 .title {
  width: 50%;
  position: absolute;
  transform: translate(-50%, 0);
  left: 50%;
  top: -1.5%;
}

.otherchoice_30 .choice {
  padding: 7% 0 7%;
  text-align: right !important;
}

/**  f f     70% **/
.gowatsuki_70 {
  background-color: #f5feff;
}

.gowatsuki_70 a:hover {
  opacity: 0.8;
}

.bestchoice_70 {
  width: 95%;
  margin: 0 auto;
  position: relative;
  z-index: 0;
  margin-bottom: 15%;
  padding-top: 8%;
}
.gowatsuki_70 .square {
  background-color: #e8f7f9;
  width: 95%;
  height: 81.5%;
  position: absolute;
  z-index: -1;
  bottom: 4%;
  left: 6%;
}

.body_pc .gowatsuki_70 .square {
  height: 79%;
  bottom: 3%;
  left: 5%;
}

.bestchoice_70 .best_item {
  width: 70%;
}
.body_pc .bestchoice_70 .best_item {
  width: 50%;
}

.otherchoice_70 {
  background-color: #cfeff4;
  position: relative;
  padding-bottom: 7%;
}
.otherchoice_70 .other_item {
  width: 55%;
}

.body_pc .otherchoice_70 .other_item {
  width: 45%;
}

.otherchoice_70 .title {
  width: 50%;
  position: absolute;
  transform: translate(-50%, 0);
  left: 50%;
  top: -1.5%;
}

.otherchoice_70 .choice {
  padding: 7% 0 7%;
  text-align: right !important;
}
.otherchoice_70 .gowatsuki_result .txt1 {
  font-size: 1.25em;
  margin-bottom: 1.3em;
  letter-spacing: 0.05em;
}

/**  f f     95% **/
.gowatsuki_95 {
  background-color: #f5f7fe;
}

.gowatsuki_95 a:hover {
  opacity: 0.8;
}

.bestchoice_95 {
  width: 95%;
  margin: 0 auto;
  position: relative;
  z-index: 0;
  margin-bottom: 15%;
  padding-top: 8%;
}
.gowatsuki_95 .square {
  background-color: #eff2f9;
  width: 95%;
  height: 83%;
  position: absolute;
  z-index: -1;
  bottom: 3%;
  left: 6%;
}

.body_pc .gowatsuki_95 .square {
  height: 79.5%;
  bottom: 3%;
  left: 5%;
}
.bestchoice_95 .best_item {
  width: 70%;
}
.body_pc .bestchoice_95 .best_item {
  width: 50%;
}

.otherchoice_95 {
  background-color: #d4daf0;
  position: relative;
  padding-bottom: 7%;
}
.otherchoice_95 .other_item {
  width: 70%;
}

.body_pc .otherchoice_95 .other_item {
  width: 45%;
}

.otherchoice_95 .title {
  width: 50%;
  position: absolute;
  transform: translate(-50%, 0);
  left: 50%;
  top: -1.5%;
}

.otherchoice_95 .choice {
  padding: 7% 0 7%;
  text-align: right !important;
}

/**      ?{ ^   **/
.rebtn {
  text-align: center;
  margin: 0 auto;
  width: 55%;
  padding: 7% 0 5%;
}
.body_pc .rebtn {
  width: 55%;
  padding: 5% 0 5%;
}

.rebtn img {
  margin-bottom: 5%;
}

.snsarea {
  text-align: center;
  background-color: #fff;
  padding: 5% 0;
}

.snsarea p {
  font-size: 1.1em;
  margin-bottom: 3%;
}

.body_pc .snsarea p {
  font-size: 1.4em;
}
.snsbtn {
  margin: 0 auto;
}

.snsbtn p {
  margin-right: 10%;
  display: inline-block;
}

.body_sph .snsbtn p {
  width: 15%;
}

.snsbtn p:last-child {
  margin-right: 0;
}

/* SPH */

.body_sph .rebtn img {
  width: 80%;
}

#info_contents {
  display: flex;
  justify-content: center;
  align-items: center;
}

.gowatsuki_result {
  max-width: 720px;
}
.l-main {
  padding-bottom: 0px;
}
@media screen and (max-width: 650px) {
  .gowatsuki_result .txt2 {
    font-size: 15px;
    letter-spacing: 0.05em;
    margin: 4% 0 3%;
  }
  .gowa_attention {
    font-size: 0.8em;
  }
  .snsbtn p {
    width: 15%;
  }
}