@charset "UTF-8";
:root{
  --fontColor:#333;
  --BLU:#2C75D5;
  --PNK:#EF5E70;
  --SPNK:#D24254;
  --LPNK:#FACED4;
  --BG-GRN:#DEFFAC;

  /* --SBLU:#daf0fb;
  --BLU:#007BC3;
  --CRM:#FFE98F; */
  --RED:#DE1313;
  --GRN:#3c8700;
  --GRY:#757575;
	/* --textShadow:0 2px 0 #007BC3, 2px 0 0 #007BC3, 0 -2px 0 #007BC3, -2px 0 0 #007BC3, -2px -2px 0 #007BC3, 2px -2px 0 #007BC3, -2px 2px 0 #007BC3, 2px 2px 0 #007BC3; */
  --shadow:0 0 10px 0 rgba(0, 0, 0, .2);
  --mainAnime:all .3s ease;
}
@font-face{font-family:'icomoon';
  src: url('../fonts/icomoon.eot?ldf6ps');
  src: url('../fonts/icomoon.eot?ldf6ps#iefix') format('embedded-opentype'),url('../fonts/icomoon.ttf?ldf6ps') format('truetype'),url('../fonts/icomoon.woff?ldf6ps') format('woff'),url('../fonts/icomoon.svg?ldf6ps#icomoon') format('svg');
  font-weight:normal;
  font-style:normal;
  font-display:block
}
[class^="icon-"]::after, [class*=" icon-"]::after,
.btn a::after,.gNav a::after,
.wp-block-button a::after,
.slick-prev::before,.slick-next::before,.icon-fb::before{ 
  font-family:'icomoon' !important;
  speak:never;
  font-style:normal;
  font-weight:normal;
  font-variant:normal;
  text-transform:none;
  line-height:1;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale
}
.icon-spNav-open::after{content:"\e905"}
.icon-spNav-close::after{content:"\e906"}
.icon-home::after{content:"\e907"}
.icon-mail::after{content:"\e900"}
.icon-plus::after{content:"\e901"}
.icon-minus::after{content:"\e911"}
.icon-search-l::after{content:"\e902"}
.icon-blank::after{content:"\e903"}
.icon-arrow-t::after{content:"\e908"}
.icon-arrow-b::after,.gNav a::after{content:"\e909"}
.icon-arrow-l::after{content:"\e90a";font-size:.75em;margin-left:.4em;}
.icon-arrow-r::after{content:"\e90b";font-size:.75em;margin-left:.4em;}
.icon-pdf::after{content:"\e90c"}
.icon-img::after{content:"\e90d"}
.icon-text::after{content:"\e90e"}
.icon-excel::after{content:"\e90f"}
.icon-word::after{content:"\e910"}
.icon-x::after{content:"\e912"}
.icon-fb::before{content:"\e904"}
.btn a::after,.wp-block-button__link a::after{content:"\e90b";margin-left:.4em;font-size:.75em;}
.btn.anchor a::after{content:"\e909";margin-left:.4em;font-size:.75em;}

.txtRED{color:var(--RED);}
.btn,.wp-block-button{
  margin-bottom:22px;
  text-align:center;
}
.btn a,.btn > input,.wp-block-button a{
  position:relative;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:center;
  max-width:15em;
  min-height:3.5em;
  padding:.1em 1em;
  margin:0 auto;
  border-radius:3.5em;
  background:var(--BLU);
  box-shadow:0 5px #10588E;
  text-align:center;
  text-decoration:none;
  color:#FFF;
  font-size:112.5%;
  line-height:1.3;
  transition:none;
  font-weight:700;
}
.wp-block-button a{
  max-width:20em;
}
.btn a span{
  display:block;
  text-align:center;
}
.btn a:hover,.wp-block-button a:hover{
  top:5px;
  background:#10588E;
  box-shadow:0 0 #10588E;
}
.btn.btnEnd a{
  background-color:var(--GRY);
  box-shadow: 0 -5px #5F5F5F;
}
.btn.btnEnd a:hover{
  top:0;

}
.gNav a::after{
  margin-left:.5em;
  font-size:.75em;
}
header{
  overflow:hidden;
  position:relative;
  background:url(../img/head_bg.jpg) no-repeat 50% 50%/cover;
}
.subpage header,.wp-theme-hj2025 header{
background-color:rgba(44,117,213,1);
background-blend-mode:soft-light
}
header h1{
  width:90%;
  padding:min(18vw,60px) 0 0;
  margin:0 auto;
  text-align:center;
}
.subpage h1,.wp-theme-hj2025 header h1{
  width:50%;
  max-width:400px;
  padding:min(4vw,16px) 0;
}
.headKenko{
  position:absolute;
  top:min(4vw,32px);left:min(4vw,32px);
  width:min(24vw,140px);
}
.subpage .headKenko,.wp-theme-hj2025 .headKenko{
  top:min(2vw,16px);left:min(2vw,16px);
  width:120px;
}
.headCont{
  position: relative;
  padding-bottom:calc(34vw*245/150);
}
.headCont h2{
  padding:min(4vw,24px) min(5%,24px);
  margin-bottom:0;
}
.headCatch1{
  display:block;
  width:calc(90vw*397/550);
  max-width:397px;
  height:calc(90vw * 56 / 550);
  max-height:56px;
  background-color:#FFF;
  margin:0 auto 1vw;
}
.headCatch2{
  display:block;
  width:90vw;
  max-width:550px;
  height:calc(90vw * 56 / 550);
  max-height:56px;
  background-color:#FFF;
  margin:0 auto
}
.headCont h2 span img{
  max-width:550px;
  width:100%;
}
.headCont dl{
  width:60%;
  max-width:257px;
  margin:0 auto 4vw;
  background-color:var(--BLU);
  color:#FFF;
  text-align:center;
}
.headCont dl dt{
  padding:5px 0;
}
.headCont dl dd{
  padding:0 16px 10px;
}
.headImg1{
  position:absolute;
  bottom:0;left:4vw;
  width:34vw;
  opacity:0;
  transform: translateY(100%);
  animation: bounceInUp 1s ease-out forwards;
  animation-delay:1.3s;
}
.headImg2{
  position:absolute;
  bottom:0;right:12vw;
  width:34vw;
  opacity:0;
  transform: translateY(100%);
  animation: bounceInUp 1s ease-out forwards;
  animation-delay:.5s;
}
@keyframes bounceInUp {
  0% {transform: translateY(100%);}
  60% {transform: translateY(0);opacity:1;}
  70% {transform: translateY(8%);opacity:1;}
  80% {transform: translateY(0);opacity:1;}
  90% {transform: translateY(2%);opacity:1;}
  100% {transform: translateY(0);opacity:1;}
}
#main{
  background-color:var(--BG-GRN);

}
.block{
  padding:32px 4vw 16px/*24px 4vw 16px*/;
}
/* section#no01{
  padding-bottom:0;
} */
.bgGRN{
  padding-bottom:32px;
}
.bgWHT{
  background-color:#FFF;
  padding-bottom:32px;
}
.bgGRY{
  background-color:#F5F5F5
}

/*__________________とは*/
.news{
  max-width:45em;
  padding:1em 1em 1px;
  margin:0 auto 1em;
  border:1px solid #333;
}
.news h3{
  color:var(--RED);
}
.news p{
  text-align:left;
}
.aboutLeadBG{
  background-color:#FFF;
  border-radius:20px;
  padding:10px .5em 14px;
  box-shadow:0 0 10px 0 rgba(0,0,0,.2);
}
.abotLead1{
  padding-bottom:16px;
}
.aboutLead2{
  margin-bottom:16px;
}
.aboutLead2 .aboutLeadBG{
  max-width:23em;
  margin:1em auto 0;
  text-align:center;
  font-weight:bold;
  /* position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  padding-left:min(calc(100% - 14em),140px); */
}
.aboutLead2 .aboutLeadBG p{
  margin-bottom:0;
}
.aboutLeadTtl{
  margin-bottom:.5em;
  color:var(--PNK);
  line-height:1.2;
}
.aboutLeadTtl span{
  display:block;
  font-size:1.5em;
}
.aboutLead2Img{
  position:absolute;
  top:50%;
  transform: translateY(-50%);
  left:-.5em;
  width:min(calc(100% - 14em),140px);
}
.aboutLead2Txt{
  width:14em;
  margin:0 0 0 auto;
  font-weight:700;
  line-height:1.2;
  font-feature-settings: "palt";
  text-align:center;
}
.aboutLead3{
  max-width:23em;
  margin:0 auto 16px;  
}
.aboutLead3Img{
  position:relative;
  max-width:17em;
  margin:0 auto 10px;
  text-align:center;
  font-weight:700;
}
.aboutLead3Img::before,.aboutLead3Img::after{
  position:absolute;
  bottom:0;
  content:"";
  display:block;
  width:2px;
  height:.9em;
  background-color:var(--fontColor);
}
.aboutLead3Img::before{
  left:0;
  transform:rotate(-30deg);
}
.aboutLead3Img::after{
  right:0;
  transform:rotate(30deg);
}
.aboutLead3Txt{
  margin-bottom:0;
  font-weight:700;
  line-height:1.3;
  font-feature-settings: "palt";
  text-align:center;
}
.aboutLead3Txt:first-child{
  line-height:1;
}
.aboutLead2Txt strong,.aboutLead3Txt strong{
  color:var(--SPNK);
}
.aboutLead3{

}
/*__________________プレゼント*/
.giftLead h3{
  text-align:center;
}
.giftImg{
  max-width:640px;
  border-radius:20px;
  overflow:hidden;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, .2);
  margin:0 auto 16px;
}
/*__________________健康横浜*/
.kenkoLead{

}
.kLeadImg{
  padding-bottom:10px;
  text-align:center;
}
.kLeadTxt{
}
.kenkoBase h3{
  border:1px solid var(--BLU);
  color:var(--BLU);
  border-radius:8px;
  overflow:hidden;
  text-align:center;
  padding:0 .3em .3em;
  margin:0 auto 10px;
}
.kenkoBase h3 span{
  display:block;
  padding:.1em .3em;
  margin:0 -.3em .1em;
  background-color:var(--BLU);
  color:#FFF;
}
.kenkoKadai{
  background-color:#E0EAF4;
  border-radius:10px;
  padding:16px 16px 1px;
}
.kenkoKadai h4{
  font-size:112.5%;
  text-align:center;
}
.kenkoKadai ol{
  list-style:none;
  padding:0;
  margin:24px -4px 0;
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
}
.kenkoKadai ol li{
  width:calc(50% - 8px);
  max-width:183px;
  margin:0 4px 16px;
  padding:0 .5em;
  border-radius:8px;
  background-color:#FFF;
  text-align:center;
}
.kenkoKadai ol li:nth-child(1) strong{color:#008A00;}
.kenkoKadai ol li:nth-child(2) strong{color:#AF594A;}
.kenkoKadai ol li:nth-child(3) strong{color:#C54888;}
.kenkoKadai ol li:nth-child(4) strong{color:#157CBE;}
.kenkoKadai ol li:nth-child(5) strong{color:#C75200;}
.kenkoKadai ol li:nth-child(6) strong{color:#937200;}
.kenkoKadai ol li:nth-child(7) strong{color:#8A06F5;}
.kenkoKadai ol li:nth-child(8) strong{color:#004AAD;}
.kenkoKadai ol li:nth-child(9) strong{color:#C22424;}
.kenkoKadai ol li:nth-child(10) strong{color:#00819E;}
.kenkoKadai ol li img{
  margin:-16px 0 10px 0;
}
.kenkoKadai ol li p{
  margin-bottom:10px;
}

/*__________________参加方法*/
.taisho{
  text-align:center;
}
/*__________________参加方法*/
.howDate{
  max-width:440px;
  background-color:var(--PNK);
  border-radius:10px;
  padding:10px .5em;
  margin:0 auto;
  box-shadow: var(--shadow);

}
.howDate dt{
  margin-bottom:.3em;
  font-weight:bold;
  text-align:center;
  color:#FFF;
}
/*__________________流れ*/
.flowStep{
  background-color: #FFF;
  border-radius: 20px;
  padding:0 16px 1px;
  margin-bottom:6vw;
  box-shadow: var(--shadow);
}
.flowStep dt{
  width:min(14vw,80px);
  margin-bottom:8px;
  transform:translateY(-4px);
}
.flowStep h3{
  color:var(--PNK);
}
.flowStep table th{
  background-color:var(--LPNK);
  border-radius:4px;
  padding:.2em .5em;
  text-align:center;
}
.flowStep table td{
  padding:.2em 0;
  font-feature-settings: "palt";
}
.flowStep table td:last-of-type{
  padding-bottom:.5em;
}
/*__________________メニュ－*/
.menuList{
  margin-bottom:32px;
}
.mListHead{
  padding-bottom:16px;
  box-shadow: var(--shadow);
  border-radius:20px;
  overflow:hidden;
  text-align:center
}
.mListHead h3{
  padding:8px;
  color:#FFF;
  text-align:center
}
.mListHead p{
  padding:8px;
  text-align:center
}
.mListHeadImg{
  padding:8px;
}
.mListWrap{
  width:96vw;
  margin-right:-4vw;
  padding-bottom:32px;
}
.mListWrap .slick-track {
  display: flex;
}
.mListWrap .slick-slide {
  height: auto !important;
}
.mListCont{
  position:relative;
  width:min(70vw,240px);
  padding:32px 10px 1px;
  margin:16px 0 0;
  background-color:#FFF;
  border:2px solid;
  border-left:none;
}
.mListCont:first-of-type{
  border-left:2px solid;
}
.mListCont .mListNum{
  position:absolute;
  top:0;left:0;
  width:2em;
  height:2em;
  border-radius:0 0 1em 0;
  color:#FFF;
  text-align:center;
  line-height:2em;
  font-weight:bold
}

.mList1 .mListHead{
background-color:#EAF1FB;
}
.mList1 .mListHead h3,.mList1 .mListCont .mListNum{
  background-color: var(--BLU);
}
.mList1 .mListCont{
  border-color:var(--BLU);
}

.mList2 .mListHead{
  background-color:#FEF8F3;
}
.mList2 .mListHead h3,.mList2 .mListCont .mListNum{
  background-color:#F26C17;
}
.mList2 .mListCont{
  border-color:#F26C17;
}

.mList3 .mListHead{
  background-color:#FEF7F8;
}
.mList3 .mListHead h3,.mList3 .mListCont .mListNum{
  background-color: var(--PNK);
}
.mList3 .mListCont{
  border-color:var(--PNK);
}

.mListCont h4{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:center;
  min-height:4.5em;
  padding:0 1em;
  text-align:center
}
.mListCont .mListImg{
  width:60%;
  margin:0 auto;
  text-align:center;
}
.mListCont .mListImg img{
  display:inline-block;
}
.mListCont p{
  padding:10px;
  margin-bottom:0;
  font-size:.875em
  
}
.menuLead{
  position: relative;
  max-width:20em;
  margin: 0 auto 10px;
  text-align: center;
  font-weight: 800;
}
.menuLead span{
  display:inline-block;
}
.menuLead::before,.menuLead::after{
  position:absolute;
  bottom:0;
  content:"";
  display:block;
  width:2px;
  height:.9em;
  background-color:var(--fontColor);
}
.menuLead::before{
  left:0;
  transform:rotate(-30deg);
}
.menuLead::after{
  right:0;
  transform:rotate(30deg);
}
/*__________________フォームへ*/
.formList{
  margin-top:32px;
}
.formList dl{
  text-align:center;
  font-feature-settings: "palt";
}
.formList dl dt{
  width:6em;
  background-color: var(--LPNK);
  border-radius: 4px;
  padding: .2em .5em;
  margin:0 auto .2em;
  text-align: center;
}
.formList dl dd{
  padding: .2em 0 0;
}
.formList dl dd p{
  margin-bottom:.5em;
}
/*__________________規約*/
.kiyaku h2{
  margin-bottom:10px;
  text-align:left;
}
.subpage h3{
  margin-top:1.5em;
  color:var(--BLU);
}
.endImg{
  text-align:center;
}
.sns{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:center;
  line-height:0;
}
.snsBox{
  margin:0 8px;
}
.snsBox.FB a{
  display:block;
  padding:4px 10px;
  border-radius:4px;
  background-color:#1877F2;
  color:#FFF;
  text-decoration:none;
  font-size:.75em;
}
.snsBox.FB a:hover{
  background-color:#4692F5;
}
footer{
  padding:6vw 4vw 4vw;
  background-color:var(--BLU);
  text-align:center;
  color:#FFF;
}
footer h2{
  max-width:12em;
  margin:0 auto 4vw
}
footer .footLogo ul{
  list-style:none;
  padding-left:0;
}
footer .footLogo a{
  color:#FFF;
}
.footName > p a{
  color:#FFF!important;
}
footer .btn{
  margin-bottom:16px;
}
footer .btn a{
  max-width:18em;
  background:#FFF;
  color:var(--BLU);
  font-size:1em;
}
footer .btn a:hover{
  background:#ccc;
}
#copyright{
  margin:0;
  font-size:87.5%;
}
/*_________________________ SPのみ */
@media screen and (max-width:767px){
}
/*__________________________SP～TB途中*/
@media screen and (min-width:550px) and (max-width:767px){
  .mListHead{
    display:flex;
    align-content:center;
    padding:0;
  }
  .mListHead h3{
    display:flex;
    flex-wrap:wrap;
    align-content:center;
    margin-bottom:0;
  }
  .mListHead p{
    display:flex;
    flex-wrap:wrap;
    width:50%;
    align-content:center;
    margin-bottom:0;
    padding:1em;
  }
  .mListHead .mListHeadImg{
    width:45%;
    padding:16px;
  }
}
/*_________________________ TBのみ */
@media screen and (min-width:768px) and (max-width:1119px){
}
/*_________________________ TB以上 */
@media screen and (min-width:768px) {
  header{
    position: relative;
    padding-bottom:min(calc(20vw * 408 /250),780px);
  }
  .subpage header,.wp-theme-hj2025 header{
    padding:0;
  }
  header h1{
    width:min(60%,700px);
  }

  .headCont{
    position:absolute;
    bottom:0;left:0;right:0;
    width:100%;
    padding-bottom:0;
  }
  .headCont h2{
    width:50%;
  }
  .headCatch1{
    width: calc(50vw * 397 / 550);
    height: calc(50vw * 56 / 550);
  }
  .headCatch2{
    width:50vw;
    height: calc(50vw * 56 / 550);
  }
  .headImg1{
    left:0;
    width:20vw;
    text-align:center;
  }
  .headImg2{
    right:0;
    width:20vw;
    text-align:center;
  }
  .news{
    margin-bottom:4em;
  }
  .about{
    text-align:center;
  }
  .abotLead1{
    padding-bottom:32px;
  }
  .aboutLeadBG{
    padding-right:2em;
    padding-left:2em;
  }
  .aboutLead2 .aboutLeadBG{
    max-width:38em;
  }
  .aboutLead2Img{
    left:2em;
    width:140px;
  }
  .aboutLead2Txt{
    width:17em;
    font-size:1.5em;
  }
  .aboutLead3{
    max-width:25em;
  }
  .aboutLead3Txt{
    font-size:1.3em;
  }
  .giftLead{
    text-align:center;
  }
  .kenkoKadai{
    padding:24px 20px 8px;
    margin-bottom:24px;
  }
  .kenkoKadai ol{
    margin:24px -12px 0;
  }
  .kenkoKadai ol li{
    width:calc(50% - 24px);
    margin:0 12px 24px;
    padding:0 24px;
  }
  .howDate dt{
    font-size:1.2em;
  }
  .flowStep{
    display:flex;
    flex-wrap:wrap;
    justify-content:space-between;
    padding:0 24px 16px;
  }
  .flowStep dd{
    padding-top:24px;
    width:calc(100% - 104px);
  }
  .flowStep table{
    border-collapse: separate;
    border-spacing:10px;
  }
  .flowStep table th{
    white-space:nowrap;
    vertical-align:middle
  }
  .menuListArea{
    display:flex;
    flex-wrap:wrap;
    margin:0 -5px;
  }
  .menuList{
    width:33.333333%;
    padding:0 5px;
  }
  .mListWrap{
    width:100%;
    margin-top:10px;
    margin-right:0;
    padding-bottom:0;
    box-shadow:var(--shadow);
  }
  .mListCont{
    width:100%;
    padding-bottom:1px;
  }
  .mListCont{
    margin-top:0;
    border-right:none;
    border-bottom:none;
  }
  .mListCont:first-of-type{
    border-left:none;
  }
  .formList{
    margin-top:56px;
  }
  .formListArea{
    display:flex;
    flex-wrap:wrap;
    margin:0 -8px;
  }
  .formListArea dl{
    width:50%;
    padding-left:8px;
    padding-right:8px;
  }
  .subpage h3{
    margin-top:2em;
  }
  footer .inner{
    display:flex;
    flex-wrap:wrap;
    justify-content:space-between;
    max-width:1000px;
    margin:0 auto;
  }
  footer h2{
    margin:0 auto 16px;
  }
  .footName{
    text-align:right;
  }
  #copyright{
    width:100%;
    text-align:right;
  }
}

@media screen and (max-width:900px){
  .gNav{
    display:none;
  }
}
@media screen and (min-width:901px){
  .gNav{
    padding:0 .5em;
    background:#FFF;

  }
  .gNav ul{
    display:flex;
    justify-content:center;
  }
  .gNav ul li{
    position:relative;
  }
  .gNav ul li::after{
    content:"";
    position:absolute;
    top:calc(50% - .5em);right:0;
    display:block;
    width:1px;
    height:1em;
    border-right:1px solid #333;
  }.gNav ul li:last-of-type::after{
    display:none;
  }
  .gNav ul li a{
    display:block;
    padding:.5em 1em;
    color:#333;
    text-decoration:none;
    transition:var(--mainAnime);
    text-align:center;
  }
  .gNav ul li a:hover{
    color:var(--BLU);
  }
  .gNav ul li a::after{
    position:relative;
    animation:var(--mainAnime);
  }
  .gNav ul li a:hover::after{
    top:3px
  }

} 
/*_________________________ PC以上 */
@media screen and (min-width:1120px) {
  header{
    aspect-ratio: 16/8;
    max-height:780px;
    width:100%;
  }
  .subpage header,.wp-theme-hj2025 header{
    aspect-ratio:inherit;
  }
  .headCont dl{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    align-content:center;
    width:50%;
    max-width:30em;
  }
  .headCont dl dt{
    padding:16px;
    font-size:1.2em;
  }
  .headCont dl dd{
    padding:16px;
  }
  .headImg1{
    width:calc((100% - 550px)/2);
  }
  .headImg2{
    width:calc((100% - 550px)/2);
  }
  .block{
    max-width:1000px;
    padding:56px 0 32px;
    margin:0 auto;
  }
  .about{
    padding-top:80px;
  }
  .kenkoLead{
    display:flex;
    align-items:center;
    margin-bottom:22px;
  }
  .kLeadTxt{
    width:calc(100% - 110px);
    padding-left:32px;
  }
  .kenkoBase{
    margin-bottom:24px;
  }
  .kenkoBase h3{
    padding:0 .5em 0 0;
    margin:0 auto 16px;
    font-size:137.5%;
    text-align:left;
    border-radius:100px;
  }
  .kenkoBase h3 span{
    display:inline-block;
    width:7em;
    border-radius:100px;
    margin:0 .5em 0 0;
    text-align:center;
  }
  .kenkoKadai{
    margin-top:32px;
    padding:24px 20px 1px;
    border-radius:20px;
  }
  .kenkoKadai h4{
    font-size:137.5%;
  }
  .kenkoKadai ol{
    margin:24px -4px 0;
  }
  .kenkoKadai ol li{
    width:calc(20% - 4px);
    margin:0 2px 20px;
  }
  .how{
    text-align:center;
  }
  .sns{
    padding:0 0 56px;
  }
  footer{
    padding:32px 0 10px;
  }

}
