@charset "UTF-8";


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

/*
.spc_comment { }
.spc_comment_txt { }
*/

.spc_comment_tit {
  width: 55.98%;
  margin: 0 auto 40px;
}


/* base
------------------------------------------------------------------------------------*/
.spc57_wrap {
  z-index: 0;
  position: relative;
  background-image: linear-gradient(#c5cdea 1px, transparent 0), linear-gradient(90deg, #c5cdea 1px, transparent 0);
  background-size: 40px 40px;
  background-position: center;
}

.spc57_wrap img {
  width: 100%;
  display: block;
}


/* hero - リード
------------------------------------------------------------------------------------*/
.spc57_title {
  font-size: 1.6rem;
  line-height: 20px;
  font-weight: bold;
  text-align: center;
  padding: 0 0 8px;
  background: #fff;
}

.img_hero {
  width: 100%;
  display: block;
  margin: 0 auto;
}

.spc57_txt_wrap {
  background: #fce3ea;
  padding-bottom: 60px;
}

.spc57_read {
  color: #474287;
  width: 90%;
  --fs: 1.8rem;
  --fh: 3.2rem;
  font-size: var(--fs);
  line-height: var(--fh);
  margin: calc(0px + ((var(--fs) - var(--fh)) / 2)) auto;
  padding-top: 44px;
}

.spc57_read span.spc57_highLight1 {
  background: linear-gradient(transparent 60%, #fff5cf 60%);
}

.spc57_read strong.spc57_highLight2 {
  font-weight: bold;
}

/* ページ内リンク */
.spc57_categorySelect_back {
  margin-top: -20px;
}

.spc57_categorySelect_back:before {
  content: "";
  display: block;
  background: url(/images/pc/content/free/spc57/img_back1_pc.webp) top center repeat-x;
  background-size: contain;
  height: 16px;
}

.spc57_categorySelect_back:after {
  content: "";
  display: block;
  background: url(/images/pc/content/free/spc57/img_back2_pc.webp) bottom center repeat-x;
  background-size: contain;
  height: 16px;
}

.spc57_categorySelect_wrap {
  width: 100%;
  display: flex;
  justify-content: center;
  padding: 16px 0;
  background: #e4e7f7;
}

.spc57_categorySelect {
  width: 27%;
  max-width: 190px;
  margin: 0 8px;
}

/* レンズ紹介
------------------------------------------------------------------------------------*/
.spc57_lineUp_tit_wrap {
  width: 65%;
  max-width: 460px;
  margin: 80px auto 24px;
}

.spc57_lineUp_tit_wrap { scroll-margin-top: 120px; }

img.spc57_lineUp_tit1_sub {
  width: 61.33%;
  margin: 0 auto;
}

img.spc57_lineUp_tit1 {
  width: 80.26%;
  margin: 12px auto 0;
}

img.spc57_lineUp_tit2_sub {
  width: 60%;
  margin: 0 auto;
}

img.spc57_lineUp_tit2 {
  width: 85.6%;
  margin: 12px auto 0;
}

.spc57_lineUp_wrap {
  width: 86%;
  background: #e4e7f7;
  border: #474287 solid 3px;
  position: relative;
  margin: 12px calc(7% + 20px) 12px calc(7% - 8px);
}

.spc57_lineUp_wrap::before {
  content: "";
  width: 100%;
  height: 100%;
  background: #7d89e2;
  border: #474287 solid 3px;
  display: block;
  position: absolute;
  top: 14px;
  left: 14px;
  z-index: -1;
  margin: 0 auto;
}

.spc57_lineUp_wrap::after {
  content: "";
  width: 100%;
  height: 100%;
  background: #d0d2fe;
  border: #474287 solid 3px;
  display: block;
  position: absolute;
  top: 28px;
  left: 28px;
  z-index: -2;
  margin: 0 auto;
}

.spc57_lineUp_1day {
  background: #fce3ea;
  border: #d9777d solid 3px;
}

.spc57_lineUp_1day::before {
  background: #f9c3c4;
  border: #d9777d solid 3px;
}

.spc57_lineUp_1day::after {
  background: #fcdde8;
  border: #d9777d solid 3px;
}

.spc57_lineUp_clear {
  background: #e5f5f9;
  border: #69a7cc solid 3px;
}

.spc57_lineUp_clear::before {
  background: #9edaff;
  border: #69a7cc solid 3px;
}

.spc57_lineUp_clear::after {
  background: #d7f1fb;
  border: #69a7cc solid 3px;
}

.spc57_lineUp_img_wrap {
  display: flex;
  justify-content: space-between;
  width: 94%;
  margin: 40px auto 0;
}

.spc57_lineUp_img_wrap2 {
  display: flex;
  justify-content: space-between;
  width: 88%;
  margin: 40px auto;
  filter: drop-shadow(5px 5px 5px rgb(0 0 0 / 50%));
}

.spc57_lineUp_img {
  width: 48% !important;
}

.spc57_lineUp_blbBnr_click {
  border-radius: 20px;
  border: solid #3941ae 6px;
}

.spc57_lineUp_headLine_wrap {
  text-align: center;
  padding: 16px 0;
  color: #474287;
  background: #ccd9ed;
}

.spc57_lineUp_1day .spc57_lineUp_headLine_wrap {
  background: #fecad3;
}

.spc57_lineUp_clear .spc57_lineUp_headLine_wrap {
  background: #c7e7ef;
}

.spc57_lineUp_headLine_tit_wrap {
  text-align: center;
}

.spc57_lineUp_headLine_tit {
  font-size: 5.4rem;
  font-weight: bold;
  line-height: 8rem;
}

.spc57_lineUp_clear .spc57_lineUp_headLine_tit {
  font-size: 4.4rem;
}

@media screen and (max-width: 349px) {
  .spc57_lineUp_headLine_tit_wrap { margin-top: 6px; }
  .spc57_lineUp_headLine_tit { font-size: 2.6rem; }
}

.spc57_lineUp_headLine_subTit {
  font-size: 2.2rem;
  line-height: 3.2rem;
}

.spc57_lineUp_spec_wrap {
  width: 93%;
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  gap: 0 4px;
  margin: 20px auto 0;
}

.spc57_lineUp_spec1,
.spc57_lineUp_spec2,
.spc57_lineUp_spec3 {
  height: 36px;
  color: #474287;
  border: #474287 solid 1px;
  font-size: 1.8rem;
  text-align: center;
  display: flex;
  align-items: center;
}
.spc57_lineUp_spec1 span:first-of-type,
.spc57_lineUp_spec2 span:first-of-type,
.spc57_lineUp_spec3 span:first-of-type {
  height: 36px;
  background: #474287;
  color: #fff;
  display: inline-block;
  padding: 8px 20px;
}
.spc57_lineUp_spec1 span:last-of-type,
.spc57_lineUp_spec2 span:last-of-type,
.spc57_lineUp_spec3 span:last-of-type {
  flex: 1;
}

.spc57_lineUp_spec1 { width: 29%; }
.spc57_lineUp_spec2 { width: 25%; }
.spc57_lineUp_spec3 { width: 42%; }

.spc57_lineUp_spec4 {
  width: 42%;
  height: 36px;
  color: #474287;
  border: #474287 solid 1px;
  font-size: 1.8rem;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
}

.spc57_lineUp_txt {
  color: #474287;
  --fs: 1.8rem;
  --fh: 3.2rem;
  font-size: var(--fs);
  line-height: var(--fh);
  margin: 30px 3%;
}

.spc57_lineUp_buy_wrap {
  width: 75%;
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  margin: 0 auto 80px;
  padding-top: 32px;
}

a.spc57_lineUp_buy_one,
a.spc57_lineUp_buy_set {
  height: 60px;
  border-radius: 8px;
  background: #474287;
  color: #fff;
  font-size: 2.6rem;
  font-weight: bold;
  display: grid;
  place-items: center;
  filter: drop-shadow(3px 3px 3px rgb(0 0 0 / 50%));
}

a.spc57_lineUp_buy_one {
  width: 39%;
}
a.spc57_lineUp_buy_set {
  width: 57%;
  color: #ffffb9;
}

a.spc57_lineUp_buy_one:hover,
a.spc57_lineUp_buy_set:hover {
  text-decoration: none;
}

@media screen and (max-width: 374px) {
  a.spc57_lineUp_buy_one,
  a.spc57_lineUp_buy_set {
    font-size: 1.5rem;
  }
}

.spc57_pwr:before {
  content: "";
  display: block;
  background: url(/images/pc/content/free/spc57/img_back4_pc.webp) top center repeat-x;
  background-size: contain;
  height: 16px;
}

.spc57_pwr {
  text-align: center;
}

.spc57_pwr_back {
  background: #f7f8fd;
  padding: 24px 0 48px;
}

.spc57_pwr_tit {
  color: #474287;
  font-size: 2.2rem;
  font-weight: bold;
  line-height: 3.2rem;
}

.spc57_pwr_chart {
  width: 91%;
  border-collapse: separate;
  border-spacing: 6px;
  margin: 6px 4.5%;
}

.spc57_pwr_chart tbody tr td {
  color: #474287;
  border: solid 1px #474287;
  border-radius: 6px;
  font-size: 1.8rem;
  line-height: 3.4rem;
}

.spc57_pwr_txt {
  color: #474287;
  --fs: 1.6rem;
  --fh: 3rem;
  font-size: var(--fs);
  line-height: var(--fh);
}

/* メッセージ
------------------------------------------------------------------------------------*/
.spc57_comment {
  font-size: 1.4rem;
  margin: -16px 0 10px;
  padding-bottom: 20px;
}

.spc57_comment:before {
  content: "";
  display: block;
  background: url(/images/pc/content/free/spc57/img_back1_pc.webp) top center repeat-x;
  background-size: contain;
  height: 16px;
}

.spc57_comment:after {
  content: "";
  display: block;
  background: url(/images/pc/content/free/spc57/img_back2_pc.webp) bottom center repeat-x;
  background-size: contain;
  height: 16px;
}

.spc57_comment_back {
  background: #e4e7f7;
}

.spc57_comment_title {
  width: 65%;
  max-width: 460px;
  margin: 0 auto;
}

.spc57_comment_txt {
  width: 90%;
  color: #474287;
  --fs: 1.8rem;
  --fh: 3.2rem;
  font-size: var(--fs);
  line-height: var(--fh);
  margin: 8px auto 0;
  padding-bottom: 20px;
}