@charset "UTF-8";

/* ===セクション1背景=== */
/* 2366pxまでは画像の真ん中を切り抜く*/
body #common_section_wrapper_1 {
  background-image: url('bg_1.png');
  background-repeat: no-repeat;
  background-position: center top;
  background-size: cover; /* 縦方向にフィット、横は画像サイズのまま */
  max-width: 2366px; /* 背景の固定範囲 */
  margin: 0 auto;
}

/* 2366pxを超えたら背景を横100%で拡大する */
@media screen and (min-width: 2367px) {
  body #common_section_wrapper_1 {
    background-size: cover; /* 横いっぱいに拡大、縦比率維持 */
    background-position: bottom;
    max-width: none;
  }
}

/* スマホ（640px以下）のときは背景を非表示にする */
@media screen and (max-width: 640px) {
  body #common_section_wrapper_1 {
    background: none;
    background-color:#9b50d7;
  }
}


/* === セクション2 背景 === */
@media screen and (min-width: 641px) and (max-width: 1366px){
body #common_section_wrapper_3 {
  background-image: url('bg_2.png');
  background-repeat: no-repeat;
  background-position: center top -10px;
  background-size: 100% auto; 
  overflow: hidden;
  margin: 0 auto;
}
}

/* 1367pxから2366pxまでは画像の真ん中を切り抜く*/
@media screen and (min-width: 1367px) and (max-width: 2366px){
  body #common_section_wrapper_3 {
  background-image: url('bg_2_2366.png');
  background-repeat: no-repeat;
  background-position: center top;
  background-size: 2366px 85px;
  max-width: 2366px; /* 背景の固定範囲 */
  margin: 0 auto;
}
}

/* 2366pxを超えたら背景を横方向に伸ばす */
@media screen and (min-width: 2367px) {
  body #common_section_wrapper_3 {
    background-image: url('bg_2_2366.png');
    background-repeat: no-repeat;
    background-position: center top;
    background-size: 100% auto; /* 横いっぱいに拡大、縦比率維持 */
    max-width: none;
  }
}

/* スマホ（640px以下）のときは小さい画像に切り替え */
@media screen and (max-width: 640px) {
  body #common_section_wrapper_3 {
    background-image: url('bg_2_sm.png');
    background-size: 100%; 
    background-position: center top -20px;
  }
}

/* === セクション4 背景 === */

@media screen and (min-width: 641px) and (max-width: 1280px){
body #common_section_wrapper_4 {
  background-image:
    url('bg_4.png');
  background-repeat:no-repeat;
  background-position: top ;
  background-size: cover;
  margin: 0 auto;
}}

@media screen and (min-width: 1281px) and (max-width: 1366px){
body #common_section_wrapper_4 {
  background-image:
    url('bg_4.png');
  background-repeat:no-repeat;
  background-position: top;
  background-size: cover;
  margin: 0 auto;
}}

/* 1367pxから2366pxまでは画像の真ん中を切り抜く*/
@media screen and (min-width: 1367px) and (max-width: 2366px){
body #common_section_wrapper_4 {
  background-image:
    url('bg_4_2366.png');
  background-repeat:no-repeat;
  background-position: top;
  background-size:
    cover;    
  max-width: 2366px;
  margin: 0 auto;
}}

/* 2366pxを超えたら背景を横方向に伸ばす */
@media screen and (min-width: 2367px) {
  body #common_section_wrapper_4 {
    background-image:url('bg_4_2366.png');
    background-repeat:no-repeat;
    background-position: top;
    background-size: 100% auto; 
    max-width: none;
  }
}

/* スマホ（640px以下）のときは小さい画像に切り替え */
@media screen and (max-width: 640px) {
  body #common_section_wrapper_4 {
    background-image: url('bg_4_sm.png');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: top;
  }
}

/* === セクション5 背景 === */

#banner_bg{
  background-image: url('bg_9.png');
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% auto; 
  margin: 0 auto;
}

/* スマホ（640px以下）のときは小さい画像に切り替え */
@media screen and (max-width: 640px) {
#banner_bg{
  background-image: url('bg_9_sm.png');
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% auto; 
  margin: 0 auto;
}
}

/* === セクション6 背景 === */
body #common_section_wrapper_6 {
  background-image: url('bg_6.png');
  background-repeat: no-repeat;
  background-position: center top;
  background-size: 100% auto; 
  margin: 0 auto;
}

/* スマホ（640px以下）のときは小さい画像に切り替え */
@media screen and (max-width: 640px) {
  body #common_section_wrapper_6 {
    background-image: url('bg_6_sm.png');
    background-position: center top;
    background-size: 100% auto; 
  }
}

/* === セクション7 背景 === */
body #common_section_wrapper_7 {
  background-image: url('bg_8.png');
  background-repeat: no-repeat;
  background-position: center top;
  background-size: cover; 
  max-width: 2366px;
  margin: 0 auto;
}

/* 2366pxを超えたら背景を横方向に伸ばす */
@media screen and (min-width: 2367px) {
  body #common_section_wrapper_7 {
    background-size:100% auto;
    max-width: none;
  }
}

/* スマホ（640px以下）のときは小さい画像に切り替え */
@media screen and (max-width: 640px) {
  body #common_section_wrapper_7 {
    background-image: url('bg_8_sm.png');
    background-repeat: no-repeat;
    background-size: cover;
    background-position:center top;
  }
}

/* === 背景以外 === */

/* タイトル装飾（キャンペーン期間） */
.campaign-title {
  display: flex;
  align-items: center;     
  justify-content: center; 
  width: 100%;
  color: #fff;
  gap: 0.5em;             
  margin:0;
}

.g-Text p:empty {
  display: none;
}

.campaign-title::before,
.campaign-title::after {
  content: "";
  flex: 1 1 auto;         
  border-bottom: 1px solid #fff;
  margin: 0;             
  min-width: 0;           
}

.g-Column__cols {
  padding-top: 0 !important;
  padding-bottom: 0 !important;



/* キャンペーン期間　文字サイズ調整 */

#kikan {
  font-size: 1.05em; 
  margin: 0;
  letter-spacing: -0.01em;
}

@media screen and (min-width: 641px) and (max-width: 960px) {
  #kikan {
    font-size: 0.8em; 
  }
}

@media screen and (max-width: 640px) {
  #kikan {
    font-size: 0.8em; 
  }
}

/* ===== kikan2 ===== */
#kikan2 {
  font-size: 1.0em; 
  margin: 0;
  letter-spacing: -0.01em;
}

@media screen and (min-width: 641px) and (max-width: 1000px) {
  #kikan2 {
    font-size: 0.8em; 
  }
}

@media screen and (max-width: 640px) {
  #kikan2 {
    font-size: 0.9em; 
  }
}



/* ===== kikan3 ===== */
#kikan3 {
  font-size: 1.1em; 
  letter-spacing: -0.01em;
  line-height: 1.8em;
  margin: 0;
}

@media screen and (min-width: 641px) and (max-width: 1000px) {
  #kikan3 {
    font-size: 0.84em;
    line-height:1;
  }
  #kikan3 span {
    letter-spacing: -0.02em;
    line-height: 1.4em;
    margin: 0;
  }
}

@media screen and (max-width: 640px) {
  #kikan3 {
    font-size: 0.9em;
    line-height:1;
  }
  #kikan3 span {
    letter-spacing: -0.01em;
    line-height: 1.4em;
    margin: 0;
  }
}

/*step③の紫部分　角R */
#kiyaku {
  border-radius: 40px; 
  overflow: hidden;
}

#kiyaku.js-bg-image {
  background-clip: padding-box;
}

#common_button_unit_20251031112213559_k61M {
  border-radius: 40px; 
  overflow: hidden;
}

#kiyaku {
  background-clip: padding-box;
  -webkit-mask-image: radial-gradient(#fff, #000);
}

@media screen and (max-width: 640px) {
#kiyaku {
  border-radius: 30px; 
  overflow: hidden;
}

#kiyaku.js-bg-image {
  background-clip: padding-box;
}

#common_button_unit_20251031112213559_k61M {
  border-radius: 30px; 
  overflow: hidden;
}
}


/*応募方法body部分 */

@media screen and (max-width: 640px) {
#text{
   line-height:1.4em;
}
}


#campaign-text {
  padding: 0 ;
  margin: 0 ;
  font-size: 1.0em; 
  line-height:2.2em;
  letter-spacing: -0.01em; 
}


@media screen and (max-width: 1000px) {
  #campaign-text {
    font-size: 0.93em;
    line-height: 1.0; 
  }

  #campaign-text span {
    line-height: 1.5em; 
    vertical-align: bottom; 
  }
}

#tousenup {
  line-height:1;
  margin:0;
}

#tousenup span {
  line-height:1.4em;
}

@media screen and (max-width: 640px) {
#tousenup {
  font-size: 0.75em; 
  line-height:1;
}

#tousenup span {
  line-height:1.3em;
}
}

/*step②の注釈部分 */
#lineheight {
  padding: 0 ;
  margin: 0 ;
  line-height: 1.2em; 
}

@media screen and (max-width: 640px) {
#lineheight {
  font-size: 1em; 
  line-height: 1.0em; 
}
}

/*stepの紫部分　角R */
#rounded1 {
  border-radius: 40px; 
  overflow: hidden;
}

#rounded2 {
  border-radius: 40px;
  overflow: hidden;
}

#rounded3 {
  border-radius: 40px; 
  overflow: hidden;
}

#rounded4 {
  border-radius: 40px; 
  overflow: hidden;
}

@media screen and (max-width: 640px) {
#rounded1 {
  border-radius: 30px; 
  overflow: hidden;
}

#rounded2 {
  border-radius: 30px; 
  overflow: hidden;
}

#rounded3 {
  border-radius: 30px; 
  overflow: hidden;
}

#rounded4 {
  border-radius: 30px; 
  ov
}
}
/*事務局　字間 */
#jimukyoku{
  letter-spacing: -0.01em;
}

/*キャンペーン期間　枠線 */
.l-Text.is-borderWidth--m {
    border-width: 2px !important ;
}

#text p {
  margin: 0 !important;
}

#text  {
  margin: 0 !important;
}


