@charset "UTF-8";


.spc_tit {
  background: linear-gradient(0deg, #3693d0 0px, #3693d0 2px, transparent 2px, transparent 5px,#3693d0 5px, #3693d0 7px) left bottom / 100% 7px no-repeat;
  color: #3693d0;
}

/*
------------------------------------------------------------------------------------*/
.spc10_wrap {
  color: #2c9abf;
  text-align: center;
}

.spc10_wrap h2 {
  font-size: 2.6rem;
  margin: 38px 0 20px;
}
.spc10_wrap p {
  font-size: 1.8rem;
  line-height: 3.2rem;
}
.spc10_wrap span {
  font-weight: bold;
}

/* -------------------------------- 
content1
-------------------------------- */
.spc10_content1_text_area, .spc10_content2_text_area, .spc10_content3_text_area {
  overflow: hidden;
  padding: 26px;
}
.spc10_content1 {
  background:linear-gradient(to bottom, #C3E6F7, white);
}
.spc10_content1_1 img {
  width: 100%;
}
.spc10_content1_1 hr {
  display: inline-block;
  width: 100%;
  height: 2px;
  background-color: white;
  border: 0;
  margin-top: 12px;
  margin-bottom: 20px;
}
.spc10_content1_2 {
  display: inline-block;
  border: solid 2px #2c9abf;
  padding: 0 20px 20px 20px;
  margin: 20px 0 0;
}
.spc10_content1_2 h2 {
  margin-top: 24px;
}
.spc10_circle {
  display: inline-block;
  margin: 0 14px;
}
.spc10_outBox {
  display: table-cell;
  vertical-align: middle;
  width: 230px;
  height: 230px;
  background:linear-gradient(to bottom, #d0f2f3, #d3edfa);
  border-radius: 50%;
}
.spc10_box {
  font-size: 1.8rem;
  line-height: 3.6rem;
}
.spc10_box p {
  font-size: 2.6rem;
  font-weight: bold;
  text-decoration-line: underline;
}

/* -------------------------------- 
content2
-------------------------------- */
.spc10_content2 {
  background-color: #e9f9f9;
}

.spc10_content2_wrap {
  margin-left: 20px;
}

.spc10_content2 table {
  font-size: 1.8rem;
  line-height: 3.2rem;
  color: #2c9abf;
  text-align: center;
}
.spc10_content2_1 {
  vertical-align: middle;
  width: 40%;
}
.spc10_content2_1 a {
  color: white;
}
.spc10_content2_2 {
  vertical-align: middle;
  width: 60%;
}
.spc10_content2_2 p {
  font-size: 1.8rem;
  line-height: 3.2rem;
}
/* 購入ボタン */
div.spc10_bt {
  display: inline-block;
  position: relative;
  width: 100%;
  background: #2c9abf; /* ボタンの色 */
  text-align: center;
  margin-top: 14px;
  padding: 2px 7px 9px 7px;
  font-size: 2rem;
  font-weight: bold;
  line-height: 2.6rem;
  border-radius: 12px;
  box-shadow: 0 0 0 0 rgb(44 154 191 / 70%); /* ボタンの色をRGB化 */
  -webkit-animation: spc10_pulse 1.25s cubic-bezier(.66,0,0,1) infinite;
  animation: spc10_pulse 1.25s cubic-bezier(.66,0,0,1) infinite;
}
@keyframes spc10_pulse {
  to {
    box-shadow: 0 0 0 6px rgba(44, 154, 191, 0); /* ボタンの色をRGB化 */
  }
}
div.spc10_bt span {
  font-size: 1.4rem;  font-weight: normal;
}
div.spc10_click {
  position: absolute;
  top: -6px;
  right: -14px;
  transform: rotate(15deg);
  color: #fff100; /* CLICK!の文字色 */
  text-shadow: 
    2px 0 0 #2c9abf,
    0 2px 0 #2c9abf,
    -2px 0 0 #2c9abf,
    0 -2px 0 #2c9abf; /* CLICK!の文字の影色 */
}
/* 商購入ボタンEND */
.spc10_lens_spec {
  border-spacing: 6px;
  margin: 0 auto 20px;
}
.spc10_lens_spec td {
  width: 160px;
  font-size: 1.8rem;
  line-height: 2.6rem;
  font-weight: bold;
  border: 2px solid #2c9abf;
  text-align: center;
  padding: 12px;
  color: #2c9abf;
}

/* -------------------------------- 
content3
-------------------------------- */
.spc10_content3 {
  margin-top: -24px;
}