@charset "UTF-8";
/* main
-------------------------------------*/
@media (min-width:768px) {
 .main_bg-auto {
	    /* background-image: radial-gradient(circle, rgb(67, 167, 223), rgba(42, 179, 252, 1) 90%);*/
  background: #ffe9d8 url("/ts/wp-content/themes/base/img/submain/main_pc_bg.webp") no-repeat center center / auto auto;
  height: 650px;
  display: flex;
  justify-content: center;
  align-items: center;
  background-size: cover;
 }
 .main_bg-auto picture {
  max-width: 1030px;
 }
}
.Inner {
 margin: 0 auto;
 max-width: 1000px;
}
.main_img_area {
 min-width: 1016px;
 text-align: center;
 height: auto;
 margin: 0 auto;
 padding: 0;
}
@media (max-width:767px) {
 .main_img_area {
  width: 100%;
  min-width: auto;
  min-height: auto;
 }
}
.main_img_area img {
 display: block;
 margin: 0 auto;
 width: 100%;
}
@media (max-width:767px) {
 .main_img_area img {
  object-fit: cover;
  height: auto;
  width: 100%;
 }
}
/*見出し
------------------------------------------------*/
.n-subtitle_wrap {
 display: flex;
 justify-content: center;
 align-items: center;
 margin-bottom: 5em;
}
@media (max-width:767px) {
 .n-subtitle_wrap {
  margin-bottom: 2em;
 }
}
.n-subtitle_wrap > h2 {
 font-size: clamp(16px, 6.2vw, 38px);
 color: #1e73be;
 position: relative;
 display: block;
 font-weight: bold;
 padding: 0;
 letter-spacing: .05em;
 line-height: 1.1;
 text-align: center;
}
@media (max-width:767px) {
 .n-subtitle_wrap > h2 {
  font-size: clamp(20px, 5.5vw, 24px);
 }
}
.n-subtitle_wrap > h2 span {
 font-size: 24px;
 color: #000;
 display: block;
 margin: 0 0 0.4em;
 padding: 0;
 text-align: center;
 letter-spacing: normal;
}
@media screen and (max-width: 767px) {
 div.n-subtitle_wrap > h2 span {
  font-size: 16px;
 }
}
.n-subtitle_wrap2 {
 display: flex;
 justify-content: flex-start;
 align-items: center;
 margin: 0;
 padding: 0em 0 1em 2em;
}
@media (max-width:767px) {
 .n-subtitle_wrap2 {
  padding: 0 0.5em 1.5em 2em;
 }
}
.n-subtitle_wrap2 > h3 {
 font-size: clamp(16px, 6.2vw, 30px);
 color: #ff6900;
 position: relative;
 display: block;
 font-weight: bold;
 margin: 0 0 0.2em;
 padding: 0;
 letter-spacing: .05em;
 line-height: 1.1;
 text-align: left;
}
@media (max-width:767px) {
 div.n-subtitle_wrap2 > h3 {
  font-size: clamp(16px, 5.9vw, 22px);
 }
}
.n-subtitle_wrap2 > h3 span {
 font-size: 24px;
 color: #000;
 display: block;
 margin: 0 0 0.4em;
 padding: 0;
 letter-spacing: normal;
}
@media (max-width:767px) {
 div.n-subtitle_wrap2 > h3 span {
  font-size: 16px;
 }
}
.bg_blue {
 background-color: #eefaff;
}

/*-----------------------------------
  コンテンツ
-----------------------------------*/
.cb_area{
	background: url(/ts/wp-content/themes/base/img/top/cashback_bg.png) 0 0 no-repeat;
    background-size: cover;
    margin: 0 auto;
    background-position: center;
	text-align: center;
}
@media (max-width:767px) {
  .cb_area {
    background: none;
    background-size: auto;
  }
}
.cb_area.full_width {
  position: relative;
  overflow: visible;
}
/* 横幅いっぱいの五角形（下に表示） */
.cb_area.full_width::after {
  content: "";
  position: absolute;
  left: 0;
  top: 100%;   /* ← ここがポイント：.cb_areaの下端からスタート */
  width: 100%;
  height: 260px;
  background: #fff100;
  clip-path: polygon(
    0%   0%,
    100% 0%,
    100% 70%,
    50%  100%,
    0%   70%
  );
}
@media (max-width:767px) {
.cb_area.full_widthe::after {
	clip-path: polygon(
    0%   0%,   /* 左上 */
    100% 0%,   /* 右上 */
    100% 70%,  /* 右中段 */
    50%  80%, /* 下の頂点（真ん中） */
    0%   70%   /* 左中段 */
  );
}
}
@media (max-width:650px) {
.cb_area.full_width::after {
	height: 210px;
	clip-path: polygon(
    0%   0%,   /* 左上 */
    100% 0%,   /* 右上 */
    100% 70%,  /* 右中段 */
    50%  80%, /* 下の頂点（真ん中） */
    0%   70%   /* 左中段 */
  );
}
}
@media (max-width:430px) {
.cb_area.full_width::after {
  height: 150px;
  clip-path: polygon(
    0%   0%,   /* 左上 */
    100% 0%,   /* 右上 */
    100% 70%,  /* 右中段 */
    50%  85%, /* 下の頂点（真ん中） */
    0%   70%   /* 左中段 */
  );
}
}

.contents_box {
 max-width: 1000px;
 margin: 0 auto;
}
@media (max-width:767px) {
 .contents_box {
  width: 95%;
 }
}
.top_section {
 padding: 0 0 8em;/*8em 0;*/
}
@media (max-width:767px) {
 .top_section {
  padding: 0 0 4em;/*4em 0;*/
 }
}