@charset "utf-8";
/* CSS Document */

img{max-width: 100%;}
#adminBox, 
.acms-admin-box,
header,
footer,
.msr_body>*{position: relative; z-index: 1;}
#adminBox, .acms-admin-box{margin-bottom: 0;}
.msr_body{
  position: relative;
  line-height: 1.5;
  font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
  background-color: #89BCB9;
}
.msr_body::before{
  content: '';
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-image: url(
  ../img/bg_dot.svg);
  background-position: center;
  background-size: contain;
}
.msr_body::after{
  content: '';
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-image: url(
  ../img/bg_circleil.svg);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}
.msr_spbr{display: inline-block;}
.tss_footer{background-color: #89BCB9;}


/* 当選のお知らせ */
.msr_topinfo{
  text-align:center;
  font-size:1.25em; 
  font-weight:bold;
  padding-bottom:1em;
  color:red;
}


.msr_keyvisual{
  padding: 12px 8px clamp(2.5rem, 1.949rem + 2.05vw, 3rem);
}
.msr_pagelogo{
  max-width: 960px;
  margin-inline: auto;
}
.msr_date{
  max-width: clamp(19.375rem, -10.256rem + 110.26vw, 46.25rem);
  margin-inline: auto;
  text-align: center;
  margin-top: 8px;
}
.msr_formBlock{
  margin-top: 18px;
}
.msr_formTtl{
  text-align: center;
}
.msr_formbtn{
  position: relative;
  display: block;
  max-width: clamp(18.125rem, 9.167rem + 33.33vw, 26.25rem);/*290-420 430-820*/
  width: 100%;
  max-height: 80px;
  margin-inline: auto;
  margin-block: 10px 16px;
  padding: 16px 0;
  text-align: center;
  background-color: #F0A21B;
  border: 2px solid #FFFFFF;
  border-radius: 9999px;
  box-shadow: 0px 6px 0px 0px rgba(0, 0, 0, 0.16);
  transition: opacity .2s;
}
.msr_formbtn >img{
  max-width: clamp(10.625rem, 4.837rem + 21.54vw, 15.875rem);/*170-254 430-820*/
}
.msr_formbtn_arrow{
  position: absolute;
  display: inline-block;
  top: 50%;
  transform: translateY(-50%);
  right: clamp(1.5rem, -0.016rem + 5.64vw, 2.875rem);/*24-46 430-820*/
  width: 19px;
  height: 17px;
  background-image: url(
  ../img/arrow_formbtn.svg);
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
  vertical-align: middle;
  transition: transform .2s;
}
.msr_formTxt{
  font-size: clamp(0.75rem, 0.474rem + 1.026vw, 1rem);/*12-16 430-820*/
  color: #FFFFFF;
  font-weight: bold;
  text-align: center;
}
.msr_redobi{
  max-width: 846px;
  width: 90.67%;
  margin-inline: auto;
  margin-top: 24px;
  padding: 22px 16px;
  text-align: center;
  background-color: #E36868;
}
.msr_redobi img{width: 100%;}
 

/* ページ概要説明セクション */
.msr_learnWrap{
  padding: clamp(1.5rem, -1.808rem + 12.31vw, 2.5rem) 0;/*24-72 430-820*/
  background-color: #FFFFFF;
  background-image: url(../img/deco_learn.svg);
  background-position: center;
  background-size: auto;
  background-repeat: no-repeat;
}
.msr_learnTtl{text-align: center;}
.msr_learnTxt{
  width: fit-content;
  margin-inline: auto;
  margin-top: clamp(0.875rem, 0.462rem + 1.538vw, 1.25rem);/*14-20 430-820*/
  padding: 0 16px;
  font-size: clamp(0.875rem, 0.599rem + 1.026vw, 1.125rem);/*14-18 430-820*/
  color: #5B5B5B;
  font-weight: bold;
  line-height: calc(43/18);
  text-align:center;
}
.msr_learnRecommend_block{margin-top: 32px;}
.msr_learnRecommendTtl{
  width: clamp(18.625rem, 0.288rem + 38.462vw, 30rem);
  margin-inline: auto;
  margin-bottom: clamp(  -16px,  calc(-10px + (-6) * ((100vw - 430px) / 390)),  -10px);
  text-align: center;
}
.msr_learnRecommend_list{
  display: grid;
  grid-template-columns: repeat(2, auto);
  gap: clamp(16px,2vw,20px) 16px;
  max-width: 990px;
  margin-inline: auto;
  padding: clamp(1.25rem, -0.679rem + 7.179vw, 3rem) 20px clamp(1.25rem, 0.423rem + 3.077vw, 2rem);
  background-color: #FFF5CE;
  border-radius: 11px;
}
.msr_learnRecommend_list li{
  font-size: clamp(0.875rem, 0.737rem + 0.513vw, 1rem);/*14-16 430-820*/
  color: #205D59;
  font-weight: bold;
}
.msr_spdeco{display: none;}


/* 開催概要 */
.msr_overviewWrap{
  padding: clamp(2rem, -0.205rem + 8.205vw, 4rem) 12px;/*32-64 430-820*/
  background-color: rgb(255, 234, 156, 0.4);
}
.msr_overviewTtl{
  text-align: center;
}
.msr_overview{
  /* position: relative; */
  max-width: 1000px;
  margin-inline: auto;
  margin-top: 12px;
  padding: clamp(2rem, -0.205rem + 8.205vw, 4rem) 16px;/*32-64 430-820*/
  background-color: #FFFFFF;
  border-radius: 20px;
  box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.1);
}
.msr_overviewContents_content{
  max-width: 770px;
  margin-inline: auto;
}
.msr_overviewContents_content:not(:first-child){margin-top: 40px;}
.msr_overviewContents_content:last-child{margin-top: clamp(3.5rem, 2.397rem + 4.1vw, 4.5rem);}
.msr_overviewContents_content h3{
  width: 160px;
  margin-inline: auto;
  margin-bottom: 12px;
  padding: 2px 0;
  font-size: clamp(1rem, 0.724rem + 1.026vw, 1.25rem);/*16-20 430-820*/
  color: #FFFFFF;
  text-align: center;
  font-weight: bold;
  background-color: #62B5A3;
  border-radius: 9999px;
}
/* 日時 */
.msr_overview_date{
  font-size: clamp(1.25rem, -0.128rem + 5.128vw, 2.5rem);/*20-40 430-820*/
  color: #5B5B5B;
  font-weight: bold;
  text-align: center;
  letter-spacing: 0.1em;
}
.msr_overview_dateDetails{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0 8px;
  margin-top: 8px;
}
/* 人数 */
.msr_overview_ninzuTxt{text-align: center;}
/* 講師・司会 */
.msr_overview_personList{
  display: flex;
  flex-direction: column;
  gap: 40px 72px;
  margin-top: clamp(2.5rem, 1.949rem + 2.051vw, 3rem);/*40-48 430-820*/
}
.msr_overview_personList_li figure{
  display: flex;
  flex-wrap: wrap;
  gap: 0 16px;
}
.msr_overview_Img{
  flex: 1 1 auto;
  max-width: 196px;
  margin-inline: auto;
}
.msr_overview_personList_details{flex: 1;}
.msr_overview_personTag{
  font-size: clamp(1rem, 0.724rem + 1.026vw, 1.25rem);/*16-20 430-820*/
  color: #5A928F;
  font-weight: bold;
}
.msr_overview_personNameWrap{
  display: flex;
  align-items: end;
  gap: 6px clamp(8px,1.5vw,24px);
  margin-bottom: 14px;
}
.msr_overview_personName{
  font-size: clamp(1.5rem, 1.087rem + 1.538vw, 1.875rem);/*24-30 430-820*/
  font-weight: bold;
  line-height: 1;
  white-space: nowrap;
}
.msr_overview_personTitle{
  display: flex;
  flex-direction: column;
  gap: 6px 0;
}
.msr_overview_personTitle span{font-size: clamp(0.75rem, 1.7vw, 0.875rem);/*12-14*/}
.msr_overviewTxt{font-size: 0.875rem;line-height: calc(26/14);}
/* 場所 */
.msr_mapTxt{
  font-size: clamp(0.875rem, 0.462rem + 1.538vw, 1.25rem);/*14-20 430-820*/
  font-weight: bold;
  text-align: center;
}
.msr_mapTxt span{
  display: block;
  font-size: clamp(0.875rem, 0.737rem + 0.513vw, 1rem);/*14-16 430-820*/
  font-weight: initial;
}
.msr_map{
  max-width: 770px;
  margin-inline: auto;
  margin-top: 8px;
}
.msr_map iframe{aspect-ratio: 770/330;}


/* プレゼント */
.msr_presentWrap{padding: 40px 16px;overflow: hidden;}
.msr_present{
  width: fit-content;
  margin-inline: auto;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 16px 40px;
  padding: 130px 80px 80px 0;
  background-image: url(../img/deco_present.svg);
  background-position: center right;
  background-size: contain;
  background-repeat: no-repeat;
}
.msr_presentImg{
  flex: 1;
  max-width: 508px;
  min-width: 340px;
  border-radius: 23px;
  overflow: hidden;
}
.msr_presentDetails img{width: 100%;}
.msr_presentDetails_txt{
  display: flex;
  flex-direction: column;
  margin-top: clamp(0.875rem, -0.365rem + 4.62vw, 2rem);
  gap: clamp(0.875rem, -0.365rem + 4.62vw, 2rem);/*14-32 430-820*/
}
.msr_presentTtl{max-width: clamp(16.25rem, 7.981rem + 30.77vw, 23.75rem);}/*260-380 430-820*/
.msr_presentDetails_txt img:nth-child(1){max-width: clamp(15rem, 7.42rem + 28.21vw, 21.875rem);}/*240-350 430-820*/
.msr_presentDetails_txt img:nth-child(3){max-width: clamp(8.125rem, 1.478rem + 30.9vw, 12.875rem);}/*290-430 430-820*/


/* 注意事項 */
.msr_notesWrap{
  margin-bottom: 32px;
  padding: 64px 0px;
  background-color: rgb(255, 234, 156, 0.4);
}
.msr_notes{
  max-width: 1000px;
  margin-inline: auto;
  padding: clamp(1.5rem, 0.397rem + 4.103vi, 2.5rem) clamp(1rem, -0.103rem + 4.103vi, 2rem);/*24-40 430-820*//*16-32 430-820*/
  border-radius: 20px;
  background-color: #FFFFFF;
}
.msr_notes span{
  display: block;
  margin-bottom: 8px;
  font-size: clamp(0.75rem, 0.612rem + 0.513vi, 0.875rem);/*12-14 430-820*/
  color: #5B5B5B;
}
.msr_notes ul li{
  line-height: 1.75;
  padding-left: 1em;
  text-indent: -1em;
  font-size: clamp(0.75rem, 0.612rem + 0.513vi, 0.875rem);/*12-14 430-820*/
  color: #5B5B5B;
}
.msr_notes ul li::before{
  content: "";
  display: inline-block;
  width: 7px;
  height: 7px;
  margin-right: 4px;
  vertical-align: middle;
  background-color: #5B5B5B;
  border-radius: 100%;
}
.msr_notes ul li:nth-last-of-type(n+2){margin-bottom: 10px;}


/* 応募ボタンブロック */
.msr_entry{padding-bottom: 24px;}
.msr_entry a{
  display: flex;
  justify-content: center;
  align-items: center;
  width:80%;
  max-width: 400px;
  height: 60px;
  margin: 0 auto 0.5em;
  text-decoration: none;
  text-align: center;
  font-size:clamp(1rem, 0.773rem + 1.14vw, 1.625rem);
  font-weight: bold;
  color: #FFF;
  border-radius: 40px;
  background-color: #F0A21B;
  border: 2px solid #FFFFFF;
  box-shadow: 0px 3px 0px rgba(0, 0, 0, 0.16);
  transition: color .2s, background-color .2s;
}
.msr_entry a p{line-height: 1;}
.msr_entry>p{
  text-align: center;
  font-weight: bold;
}


/* 主催など */
.msr_sponsor{
  padding: 32px 16px 72px;
  background-color:#FFFFFF;
}
.msr_sponsor dl{
  width: fit-content;
  margin-inline: auto;
}
.msr_sponsor dl >*{
  display: flex;
  gap: 8px 0;
  color: #5B5B5B;
}
.msr_sponsor dl >*:nth-last-of-type(n+2){margin-bottom: 20px;}
.msr_sponsor dl dt{
  flex: 0 0 130px;
  padding-right: 16px;
  font-size: clamp(0.75rem, 0.474rem + 1.026vi, 1rem);/*12-16 430-820*/
  border-right: 3px solid #3E8B7A;
}
.msr_sponsor dl dd{
  flex: 1 1 auto;
  padding-left: 16px;
  font-size: clamp(0.875rem, 0.737rem + 0.513vw, 1rem);/*14-16 430-820*/
  line-height: 1.75;
}
.msr_sponsor dl dd a{
  color: #5B5B5B;
  transition: text-decoration-color .2s;
}
.msr_sponsorLogo{max-width: 296px;}


/* 応募はこちらのfloatボタン */
.msr_entrybtn{
  position:fixed;
  right:0.875em;
  top:50dvh;
  writing-mode: vertical-rl;
  z-index: 1000;
}
.msr_entrybtn a{
  color:#FFF;
  padding:1em 0.5em;
  background-color: #F0A21B;
  font-size:1.125rem;
  font-weight:bold;
  text-decoration: none;
  border: 2px solid #FFFFFF;
  border-radius: 20px 0 0 20px;
  box-shadow: 0px 3px 0px rgba(0, 0, 0, 0.16);
  transition: color .2s, background-color .2s;
}



@media screen and (min-width:801px){
  .msr_formbtn:hover{
    opacity: 0.7;
  }
  .msr_formbtn:hover .msr_formbtn_arrow{
    transform: translate(6px, -50%);
  }

  .msr_learnTxt span{display:block;}

  /* 応募ボタンブロック */
  .msr_entry a:hover{
    color: #F0A21B;
    background-color: #FFF;
    border: 2px solid #F0A21B;
  }

  .msr_sponsor dl dd a:hover{text-decoration-color: transparent;}

  /* 応募はこちらのfloatボタン */
  .msr_entrybtn a:hover{
    color: #F0A21B;
    background-color: #FFF;
    border: 2px solid #F0A21B;
  }
}



@media screen and (max-width:1100px){
  /* 注意事項 */
  .msr_notesWrap{
    padding: 0px;
  }
  .msr_notes{
    border-radius: 0px;
  }
}


@media screen and (max-width:960px){
  /* ページ概要説明セクション */
  .msr_spdeco{display: block;width: 80%;margin-inline: auto;margin-top: 16px;}
}



@media screen and (max-width:820px){
  /* 当選のお知らせ */
  .msr_topinfo{
    font-size:0.875em;
  }

  /* ページ概要説明セクション */
  .msr_learnRecommend_list{
    grid-template-columns: 1fr;
  }

  /* プレゼント */
  .msr_present{
    flex-direction: column;
    padding: 0 0 16px 0;
    background-image: none;
  }
  .msr_present>*{position: relative;z-index: 1;}
  .msr_present::after{
    content: '';
    position: absolute;
    top: -5%;
    left: 50%;
    transform: translateX(-50%);
    width: 640px;
    aspect-ratio: 1/1;
    background-color: #3E8B7A;
    border-radius: 50%;
  }
  .msr_presentTtl{
    margin-inline: auto;
  }

  /* 主催など */
  .msr_sponsor{
    padding-bottom:160px;
  }

  .tss_gotop{width:56px;}
  
  /* 応募はこちらのfloatボタン */
  .msr_entrybtn{left: calc(100vw - 1.25em);}
  .msr_entrybtn a{font-size:0.875rem;}
}



@media screen and (max-width:690px){
  .msr_body::after{
    top: 21%;
  }

  /* ページ概要説明セクション */
  .msr_learnTtl{width: 24.33vw; margin-inline: auto;}
  .msr_learnTtl img{width: 100%;}
  .msr_learnTxt{font-weight: inherit;}

  /* 開催概要 */
  /* 講師・司会 */
  .msr_overview_personList_li figure{flex-direction: column;}
  .msr_overview_personNameWrap{flex-direction: column;align-items: self-start;margin-top: 8px;}
  .msr_overview_personTitle span{font-size: 0.875rem;}
  /* 場所 */
  .msr_map iframe{
    aspect-ratio: 320/330;
    width: 100%;
  }

  /* 主催など */
  .msr_sponsor dl >*{flex-direction: column;}
  .msr_sponsor dl dt{
    position: relative;
    flex: auto;
    border-right: unset;
  }
  .msr_sponsor dl dt::after{
    content: '';
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 20%;
    border-bottom: 1px solid #3E8B7A;
  }
  .msr_sponsor dl dd{padding-left: 0;}
  .msr_learnTxt br{display:none;}
}