
.header_all, #navArea, #footer_contact, #footer{
  display: none;
}

html {
	scroll-behavior: smooth;
}

body{
  background-color: #eeeee9;
}

.contents-wrapper{
  background-color: #eeeee9;
}

.section-inner {
  width: 100%;
  max-width: 1000px;
  margin: 0px auto;
  background-color: #ffffff;
  box-shadow: 0 0 18px #d9d9d9;
}

.copyright{
  text-align: center;
  font-size: 12px;
  color: #909090;
}

.copyright a{
  text-align: center;
  font-size: 12px;
  color: #909090;
}


p{
  margin: initial;
}


/** -----------------------------------
    共通
-------------------------------------**/
span.marker_yellow {
    background: linear-gradient(transparent 50%, #f5feae 50%);
}


.marker_blue {
    background: linear-gradient(transparent 50%, #B8DDE3 50%);
}


.pen_red {
  color: #D96464;
}

.__center{
  text-align: center;
}

.smpmedium{
  font-size: 18px;
  text-align: center;
  margin: 0 auto;
}


/** -----------------------------------
    kv
-------------------------------------**/
.sp-on {
  display:none;
}


@media screen and (max-width: 700px){
.sp-on {
    display: block;
}

.pc-on {
  display: none;
}
}
/** -----------------------------------
    プレゼント＆CTA
-------------------------------------**/
.line_cta1st{
  margin: 40px auto;
}

.line_cta1st p{
  font-size: 13.5px;
  text-align: center;
  letter-spacing: 1.5px;
}

/*  ボタン共通 */

.seminar-button {
  margin: 16px auto 0;
  padding: 1em;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  text-decoration: none;
  color: #fff;
  font-size: 18px;
  letter-spacing: 1px;
  border-radius: 50px;
  width: 70%;
  height: 40px;
  background-color:#5D91A5 ;
  background-size: 200% auto;
  transition: all 0.3s ease-out;
}

.seminar-button:hover {
  background-position: 99% 50%;
    background-color:#A65D71 ;
  transform: scale(1.02,1.02);
}


#s_cta{
  background-image: url("../images/hk/ctabg.webp");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  margin: 0px auto;
  position: relative;
  padding: 50px 0;
}

.itsok img{
  position: absolute;
  width: 45%;
    top: -5%;
    left: 40px;
}

.section-message{
    padding: 72px 0 0;
    text-align: center;
}

.section-message p {
  font-size: 16px;
  line-height: 1.8;
  margin-bottom: 20px;
  text-align: center;
  letter-spacing: 0.5px;
    font-weight: bold;
}

.cta-box {
    border: 1px solid #484848;
    padding: 10px 30px;
    font-weight: bold;
    font-size: 26px;
    letter-spacing: 2px;
    text-align: center;
    margin: 0 auto 10px;
    display: inline-block;
    background: #fff;
}

.arrowd {
  text-align: center;
  font-size: 20px;
  margin-top: 0px;
}

.line_cta{
  margin: 10px auto;
}

.line_cta p{
  font-size: 13.5px;
  text-align: center;
  letter-spacing: 1.5px;

}
.detailinfo{
  text-align: center;
}

.detailinfo a {
  text-decoration: underline;
  color: #333;
  font-size: 14px;
    transition: all 0.3s ease-out;
}

.detailinfo a:hover {
  font-weight: bold;
  font-size: 14px;
  
    transform: scale(1.01,1.01);
}

@media screen and (max-width: 600px){
  .itsok img {
    width: 90%;
    left: 5px;
}
.cta-box {
    padding: 10px 10px;
    font-size: 18px;
    margin: 0 auto 10px;
    width: 72%;
}
}

/** -----------------------------------
    こんなお悩みありませんか
-------------------------------------**/

#s_problem {
      width: 85%;
  margin: 120px auto;
}

.sforyou{
  font-size: 14px;
  text-align: center;
font-weight: bold;
    margin-bottom: 12px;
        letter-spacing: 1px;
}

.mforyou{
  font-size: 27px;
  text-align: center;
font-weight: bold;
    margin: 10px auto;
        letter-spacing: 1.2px;
}


.block { margin-bottom: 72px; }

.block-inner {
  display: flex;
  gap: 24px;
  align-items: flex-end;
  margin: 30px auto;
}

.block-left { flex: 1 1 0; min-width: 0; }  /* 文章側を可変に */
.block-right { flex: 0 0 320px; }           /* 右画像の幅を固定（好みで） */

.block-title img {
  width: auto !important;   /* ← これで100%を打ち消す */
  max-width: 100%;          /* はみ出すときだけ縮む */
  height: 48px;
  display: inline-block;    /* 横幅の差がそのまま出る */
  vertical-align: top;
  align-self: flex-start; 
  margin-top: 42px;
  margin-bottom: 16px;
}

.block-right img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
}

/* 箇条書きの四角いチェック */
.block-list { list-style: none; padding: 0; margin: 0; }
.block-list li {
  position: relative;
  padding-left: 1.6em;
  margin: 0 0 10px;
}
.block-list li::before {
    content: "◼︎";
    position: absolute;
    left: 0px;
    top: -3px;
    transform: translateY(2px);
    color: #c87878;
}

/* レスポンシブ：横幅が狭いときは縦積み */
@media (max-width: 768px) {
  .block-inner { flex-direction: column; }
  .block-right { flex-basis: auto; }
}




.arrowbottom{
  font-size: 24px;
  letter-spacing: 1px;
  text-align: center;
  margin: 40px auto 0;
}

.arrow-center {
  text-align: center;
  margin: 0 auto;
}

.arrow-center img{
  width: 20px!important;
}

.reason_flex{
  display: flex;
  width: 90%;
  margin: 50px auto;
  align-items: center;

}

.sm_left{
  flex: 3;
}

.sm_right{
  flex: 2;
}



@media screen and (max-width: 600px){
  .mforyou {
    font-size: 21px;
}

.block-title img {
    height: 36px;

}
.block-list li {
    margin: 0 0 20px;
}

.arrowbottom {
    font-size: 18px;
}
.reason_flex {
    width: 100%;

}
}

/** -----------------------------------
    こんなお悩みありませんか
-------------------------------------**/


#questions {
    background-image: linear-gradient(rgba(210, 210, 210, 0.2) 1px, transparent 1px), linear-gradient(to right, rgba(210, 210, 210, 0.2) 1px, transparent 1px);
    background-size: 20px 20px;
    background-color: #fff;
    background-position: -14px 14px;
}

.quesitionbox{
    width: 80%;
    margin: 0px auto;
    padding: 72px 0;
}

.quesitionbox_img{
      width: 72%;
    margin-left: auto;
}
.quesitionbox_flex{
  display: flex;
  width: 95%;
  margin: 50px auto;
  align-items: center;

}



.quesitionbox_text{
  flex: 1;
}

.quesitionbox_girl{
  flex: 1;
      margin-top: 30px;
}


#wissb{
  margin: 120px auto;
}

.smplarge{
  font-size: 27px!important;
  text-align: center;
    margin: 10px auto 40px;
}

.wissb_ex p{
  text-align: center;
  margin:60px auto;
}

.wissb_ex img{
  width: 60%;
}




  .t__center{
    text-align: center;
    font-size: 20px;
    color: #6f8fa2;
    font-weight: bold;
  }



@media screen and (max-width: 600px){
  .quesitionbox_img{
      width:95%;
}
}





/** -----------------------------------
    そもそも習慣化？ #premises
-------------------------------------**/


#premises{
background-color: #FBFAF5;
    padding: 80px 0;
}


.pre_title{
  text-align: center;
  margin: 0 auto;
  padding: 50px 0;
}

.pre_main{
  font-size: 20px;
      font-weight: 600;
        text-align: center;
}


.pre_small{
    font-size: 14px;
      text-align: center;

}


.pre_flex {
    display: flex;
    width: 70%;
    margin: 10px auto;
    align-items: center;
}

.p_left{
  flex: 1.2;
}

.p_right{
  flex: 1;
}

.p_points {
  width: 64%;
  margin: 0 auto;
}

.p_sentence p{
        text-align: center;
        
}


#mof{
      width: 80%;
    margin: 50px auto;
}

.moftext{
  text-align: center;
      margin-bottom: 50px;
}



@media screen and (max-width: 600px){
.p_points {
    width: 95%;
}
#mof{
      width: 92%;
}}
/** -----------------------------------
    動画の中身
-------------------------------------**/

#program{

    margin: 0px auto;
      padding: 100px 0;
      background-color: #F5FAFB;
}
.program_title h3{
  font-size: 24px;
  text-align: center;
      letter-spacing: 3px;
}

.program_img{
  width: 50%;
  margin: 0 auto;
}

.chira{
  text-align: center;
}

.chira img{
  width: 30%;
  margin: 72px auto 0;
}

.curriculum {
  width: 80%;
  margin: 0 auto;
}

.curriculum h4 {
  padding: 24px 0 30px;
      margin-bottom: 0;
}

.curriculum span {
  font-size: 18px;
  padding: 1em;
  border: 1px solid #666666;
  background-color: #fff;
      letter-spacing: 1px;

}

.curriculum ul {
  padding-left: 24px;
}

.curriculum li {
  list-style: circle;
  line-height: 2em;
  background-repeat: no-repeat;
  padding-left: 10px;
  margin-bottom: 10px;
  letter-spacing: 1.5px;
  font-size: 14.5px;
}


@media screen and (max-width: 600px){
  .program_img {
    width: 80%;
    margin: 50px auto 0;
}
  .chira img {
    width: 60%;
}
  .curriculum {
    width: 90%;
}
  .curriculum span {
  font-size: 10.5px;

}
.curriculum h4 {
    padding: 24px 0 10px;
}
}


/** -----------------------------------
    講師プロフィール
-------------------------------------**/

#s_profile{
  background-color: #e2ecef;
  margin: 0px auto;
  padding-top: 120px;
  padding-bottom: 100px;
}

.mdsp_h3{
  font-size: 26px;
  text-align: center;
  margin: 0 auto;
}

.mdsp_c{
  font-family: 'Century Gothic', Futura, sans-serif;
  font-size: 18px;
  letter-spacing: 1.3px;
  color: #b5d5e4;
  text-align: center;
}

.profiles_flex, .profiles_flex2{
  display: flex;
  width: 90%;
  margin: 60px auto 10px;
  justify-content: center;
  align-items: flex-start;
}

.profiles_flex2{
  flex-direction: row-reverse;
}

.profiles_flex img{
  width: 85%;
  padding-top: 3em;
}

.profiles_flex2 img{
  width: 85%;
  padding-top: 3em;

}


.profiles_tx p{
  font-size: 14px;
  padding: 15px;
}

.profiles_img{
  flex: 2;
  text-align: center;
}

.profiles_tx{
  flex: 3;
}

.t_name{
  font-size: 17px;
  font-weight: bold;
  color: #5f90ab;
}

/* 最後 */


#message_s{
  margin: 100px auto 40px;
  padding-bottom: 50px;
}

.last{
  width: 60%;
    margin: 0 auto;
}

.last_msg{
  width: 62%;
  margin: 70px auto;
}

.last_msg p{
  font-size: 15px;
  letter-spacing: 1.8px;
}

.last_msg img{
  width: 45%;
  padding-top: 20px;
  display: block;
  margin-left: auto;
}

@media screen and (max-width: 700px){

  .last {
    width: 88%;
}
}

/** -----------------------------------
    responsive
-------------------------------------**/
@media screen and (max-width: 890px){

p {
  font-size: 15px;
}

.ctatitle {
  width: 95%;
}
.ctatitle h3 {
  font-size: 4vw;
}

.p_limited p {
  width: 80%;
}

.smp_flex {
  width: 80%;
}

.smp_flex{
  width: 85%;
}

.smp_left p {
  font-size: 16px;
}

.cv_sb_box {
  width: 50%;
}


.onayami img {
  right: 5px;
  width: 100px;
}
}

@media screen and (max-width: 600px){

  .daysem_m img {
    width: 70%;
}

.present03 h2 {
  font-size: 27px;
}

.line_cta img {
  width: 90%;
}

.ctatitle {
  width: 100%;
}

.ctatitle h3 {
  font-size: 5.2vw;
}

.ctatitle img {
  width: 30%;
  bottom: -25px;
  right: 10px;
}

.img06x {
  width: 80%!important;
}

.seminar-button {
  line-height: 1.4;
  font-size: 14px;
  width: 80%;
  height: 28px;
          margin-top: 5px;
}
  .present_flex, .reason_flex, .quesitionbox_flex, .pre_flex, .ma_flex, .profiles_flex, .profiles_flex2{
    display:block;
  }

  #s_problem img {
    text-align: center;
    width: 100%;
}

.mdsp_c img {
  width: 65%;
}
.sm_left {
  text-align: center;
}

.reason_flex img{
  width: 50%;
          margin-top: 40px;
}


.mdsp_h3 {
  font-size: 18px;
}
.smplarge {
  font-size: 18px!important;
}

.smpmedium {
  font-size: 15px;
}

#s_problem3 img {
  width: 95%;
  padding: 36px 0;
}


.wissb_ex img {
  width: 85%;
}

.cv_sb img {
  width: 85%;
}

#sb3point img{
  width:85%;
}

.smp_left p {
  text-align: center;
  font-size: 16px;
}

sb3point img {
  width: 90%;
}

.onayami img {
  display: none;
}

.onayami li {
  background-size: 20px;
  padding-left: 35px;
  margin-bottom: 20px;
  font-size: 15px;
}

.m_after img {
  width: 96%;
}

.ma_left p {
  font-size: 10px;
}

.ma_right img {
  width: 45%;
  padding-top: 30px;
}

.nthanx {
  width: 80%;
  padding: 35px 20px;
}

.nthanx h4 {
  font-size: 17px;
}


.smn_flow_z {
  width: 95%;
}

.smn_flow {
  padding-left: 70px;
}

.smn_flow::before {
  width: 12px;
  margin-left: -7px;
  left: 70px;}

  .smn_flow > li .icon {
    font-size: 12px;
    padding: 8px 15px;
    left: -80px;}

    .smn_flow > li dl::after {
      width: 20px;
  }

.smn_flow > li dl {
    padding-left: 36px;
}

.smn_flow > li dl dt {
  font-size: 15px;
  margin-bottom: 0.8vh;
}

dd {
  font-size: 13px;
}

.smp_right img {
  width: 50%;
  padding-top: 30px;
  /* text-align: right; */
}

  .cv_sb_box {
    width: 92%;
    margin: 15px auto;
}

.smp_flex{
  display:block;
  width: 90%;
}

.sb3_box {
  width: 92%;
  margin: 15px auto;
}

.last_msg {
  width: 86%;
}

.last_msg img {
  width: 75%;
}
  }


