/*
Theme Name: GeneratePress Child
Theme URI: https://generatepress.com
Template: generatepress
Author: Tom Usborne
Author URI: https://generatepress.com/about
Description: GeneratePress is a lightweight WordPress theme built with a focus on speed and usability. Performance is important to us, which is why a fresh GeneratePress install adds less than 10kb (gzipped) to your page size. We take full advantage of the block editor (Gutenberg), which gives you more control over creating your content. If you use page builders, GeneratePress is the right theme for you. It is completely compatible with all major page builders, including Beaver Builder and Elementor. Thanks to our emphasis on WordPress coding standards, we can boast full compatibility with all well-coded plugins, including WooCommerce. GeneratePress is fully responsive, uses valid HTML/CSS, and is translated into over 25 languages by our amazing community of users. A few of our many features include 60+ color controls, powerful dynamic typography, 5 navigation locations, 5 sidebar layouts, dropdown menus (click or hover), and 9 widget areas. Learn more and check out our powerful premium version at https://generatepress.com
Tags: two-columns,three-columns,one-column,right-sidebar,left-sidebar,footer-widgets,blog,e-commerce,flexible-header,full-width-template,buddypress,custom-header,custom-background,custom-menu,custom-colors,sticky-post,threaded-comments,translation-ready,rtl-language-support,featured-images,theme-options
Version: 3.6.0.1757490426
Updated: 2025-09-10 16:47:06

*/



body, html {
  max-width: 100%;
  overflow-x: hidden;
}


body.lp01 {
	background:#000000;
	color:#ffffff;
	font-size: 16px;
    font-family: 'book antiqua', palatino, serif, '游明朝', YuMincho, 'Hiragino Mincho ProN', 'Noto Serif JP', 'Noto Serif', serif;
}

main.lp01 {
	background:#000000;
	color:#ffffff;
	font-size: 16px;
    font-family: 'book antiqua', palatino, serif, '游明朝', YuMincho, 'Hiragino Mincho ProN', 'Noto Serif JP', 'Noto Serif', serif;
}

.inside-site-info {
	color:#ffffff;
	font-size: 16px;
    font-family: 'book antiqua', palatino, serif, '游明朝', YuMincho, 'Hiragino Mincho ProN', 'Noto Serif JP', 'Noto Serif', serif;
}

@media (max-width: 768px) {
body.lp01 {
	background:#000000;
	color:#ffffff;
	font-size: 16px;
	font-family: 'Noto Serif JP', serif !important;
}
main.lp01 {
	background:#000000;
	color:#ffffff;
	font-size: 16px;
	font-family: 'Noto Serif JP', serif !important;
}
.inside-site-info {
	font-family: 'Noto Serif JP', serif !important;
}
}


.site-header {
   background-color:initial;
}




.brsp {
    display: none;
}

@media (max-width: 979px) {
	.brsp {
		display: inline;
    }
}



/* 見出し */
h2.hero {
  text-align: center;
  margin: 0 0 42px;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: .16em;
  font-size: clamp(22px, 3.8vw, 40px);
}
	

h2.hero_left {
    margin: 0 0 42px;
    font-weight: 600;
    line-height: 1.5;
    letter-spacing: .16em;
    font-size: clamp(22px, 3.8vw, 40px);
}





/* ===== ヘッダー ===== */
.header-logolp {
    padding-left: 0;
}

@media (max-width:860px){
    .header-logolp {
        max-width: 60%;
        text-align: left;
        margin-left: 0;
        padding-left: 2%;
}
	
}



/* ===== フッター ===== */

footer {	
    margin-left: auto;
    margin-right: auto;
    max-width: 1200px;
}

.lp01 .copyright {	
	font-size: 12px;
}
.footerlogo {
}


@media (max-width: 1200px) {
	footer {	
    margin-left: 20px;
    margin-right: 20px;
}
}



    #footer-menu {
        width: 100%;
        max-width: 1200px;
        text-align: left;
        letter-spacing: 1px;
        margin: 20px auto;
    padding-bottom: 1rem;
    }

    #footer-menu ul {
        margin: 0;
        padding: 0;
    }

    #footer-menu ul li {
        margin: 0;
        padding: 0;
        display: inline;
    }

    #footer-menu ul li a:link,
    #footer-menu ul li a:visited {
        text-align: left;
        padding: 0;
        display: inline;
        height: 24px;
        margin: 0;
        font-size: 12px;
        color: #ccc;
        float: left;
    text-decoration: none;
    }

    .bar {
        width: 1px;
        height: 10px;
        margin-left: 12px;
        margin-top: -4px;
        float: left;
        margin-right: 12px;
    }





@media (max-width:459px){
  #footer-menu ul {
    display:block;
    text-align:center; /* 親で中央寄せ */
  }

  #footer-menu ul li {
    display:block !important;
    float:none !important;
    margin:8px 0;
	  clear:both;
  }

  #footer-menu ul li a:link,
  #footer-menu ul li a:visited {
    float:none !important;       /* 左寄せを解除 */
    display:inline-block !important; /* インラインブロックにして中央寄せ可能に */
	padding:4px 0;
  }

  .bar {
    display:none !important; /* 区切りは消す */
	  float:none !important;
  }
.main-title {
    text-align: center;
    margin: 0 auto;
}
}









.inside-site-info {
    align-items: center;
    padding: 20px 40px;
    margin-top: 3rem;
    text-align: center;
    color: #ffffff;
    font-size: 0.6rem;
    padding: 0 0 1rem 0;
}
	

@media (max-width:399px){
.inside-site-info {
    padding: 10px 0 3px;
}
}







/* ===== KV ===== */
.kv{
	--overlap:9%;        /* B/C を左に食い込ませる量 */
	--gap:0px; /* 要素間の溝 */
  max-width:1200px;
	margin:0 auto 40px;
  display:grid;
  grid-template-columns: 58% 42%;
  grid-auto-rows:minmax(120px,auto);
  gap:var(--gap);
  position:relative;
}

/* A：左を上下に貫通 */
.kv__imgA{ grid-area: 1 / 1 / 4 / 2; margin:0; }
.kv__imgA img{
  width:100%; height:100%;
  aspect-ratio:3/4; object-fit:cover; display:block;
}
.kv__imgA figcaption{ display:none; }

/* B：右上。左に食い込み重ねる */
.kv__imgB{ grid-area: 1 / 2 / 2 / 3; margin:0; z-index:2; }
.kv__imgB img{
    width: calc(100% - var(--overlap));
    transform: translateX(calc(var(--overlap) * -3));
    display: block;
	filter: drop-shadow(2px 2px 3px rgba(0, 0, 0, 1)) drop-shadow(2px 2px 10px rgba(0, 0, 0, 1));
}




/* C：Bの直下。Bと同じ食い込み量で揃える */
.kv__blockC{
  grid-area: 2 / 2 / 3 / 3;
    width: calc(160% - var(--overlap));
    transform: translateX(calc(var(--overlap) * -3));
  display:grid; gap:.6rem;
  text-align: center;
}

.kv .catch{
  margin:16px 0 12px;
  font-weight:700;
  line-height:1.8;
  font-size:clamp(22px, 4vw, 54px);
    letter-spacing: 0.2em;
}

.kv .catch .catch_s{
  display:block;
  font-weight:600;
  opacity:.9;
  font-size:clamp(16px, 2.6vw, 22px);
}

.kv .kv_lead {	
  text-align: center;
}

.kv .kv_lead2 {
    text-align: center;	
    margin-top: 2rem;
	
}



/* CTA */
.kv__cta{
  text-align: center;
  margin-top: 3rem;
}
.kv__btn{
  display:inline-block;
  padding:14px 60px;
  background:#eaa5b8;        /* 画像のボタン色に近いピンク */
  color: #ffffff;
  border-radius:999px;
  text-decoration:none;
  font-weight:700;
  letter-spacing:.05em;
  box-shadow:0 3px 0 rgba(0,0,0,.25);
	transition:transform .8s ease, filter .15s ease;
}
.kv__btn:hover{
	transform:translateY(-3px);
	filter:brightness(1.2);
}




/* D：右下。縦長の本文領域 */
.kv__blockD{
  padding:24px;
  align-content:start;
  min-height:520px;
}


/* 装飾（任意。枠の雰囲気） */
.kv__imgA img,.kv__imgB img,.kv__blockC,.kv__blockD{
	
}

/* ===== SP：縦積み ===== */
@media (max-width:860px){
	.kv__imgA {
		grid-column: 1 / -1;
        padding-right: 16%;		
	}
.kv__imgB {
    grid-area: 1 / 1 / 1 / 3;
    margin: 0 0 auto auto;
    z-index: 2;
    right: -80px;
    position: relative;
        padding: 0px 12px 12px 12px;
}
.kv__imgB img {
        max-width: 100%;
        transform: initial;
        margin-right: 10px;
	filter: drop-shadow(2px 2px 3px rgba(0, 0, 0, 1)) drop-shadow(2px 2px 10px rgba(0, 0, 0, 1));
    }

	
.kv__blockC {
    grid-area: 3 / 1 / 4 / 3;
    width: initial;
    transform: initial;
    display: initial;
    gap: .6rem;
    text-align: center;
    position: relative;
    top: 120px;
}	
	
.kv__blockD{
        grid-area: 4 / 1 / 4 / 3;
        position: relative;
        top: 100px;
}
}


/* ===== KV end ===== */


















/* ===== problem ===== */


.problem {
  max-width: 1100px;
  margin: auto;
  padding: 56px 24px 80px;
  margin-top: 230px;
}

/* チェックリスト */
.problem .checks {
  list-style: none;
  padding: 0;
  margin: 0 auto;
  max-width: 920px;
}

.problem .checks li {
  position: relative;
  padding-left: 42px;
  margin: 18px 0;
  font-size: clamp(16px, 1.7vw, 19px);
  color: #cfcfcf; /* やや淡い本文色 */
}

/* チェックボックス */
.problem .checks li::before {
  content: "";
  position: absolute;
  left: 0; 
    top: 0.3em;
    width: 18px;
    height: 18px;
  border: 2px solid #ffffff;
  border-radius: 3px;
  box-sizing: border-box;
}

.problem .checks li::after {
    content: "";
    position: absolute;
    left: 1px;
    top: 0.2em;
    width: 22px;
	height: 9px;
	    border-left: 4px solid #ffffff;
    border-bottom: 3px solid #ffffff;
    transform: rotate(-40deg);
}

/* 強調下線 */
.problem .hl {
	background: linear-gradient(to bottom, transparent 75%, #ff6ea0 0);
    background-repeat: no-repeat;
    background-size: 100% 0.3em;
    background-position: 0 1.1em;
    text-decoration: underline;
    text-decoration-color: #ff6ea0;
    text-decoration-thickness: 2px;
    text-decoration-style: double;
    text-underline-offset: 4px;
}

/* 右端を少し長くする下線 */
.problem .hl--long {
  box-shadow: inset -8px -2px 0 0 #ff6ea0;
}






/* ===== SP ===== */
@media (max-width:999px){
.problem .checks li {
    line-height: 1.8rem;
    margin-top: 40px;
}
.problem .checks {
    max-width: 380px;
        margin: 0 auto;
}	
	
	
}





/* ===== problem end ===== */





/* ===== senseofbeauty ===== */

.senseofbeauty {
  max-width: 1280px;
  margin: 0 auto;
  padding: 56px 24px 230px;
	margin-top:230px;
}



/* grid for staggered layout */
.senseofbeauty .tiles {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: clamp(16px, 4vw, 64px);
  row-gap: clamp(28px, 2vh, 140px);
  margin-top: 84px;
}

/* card */
.senseofbeauty .tile {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}

.senseofbeauty .ph {
    flex: 0 0 auto;
    width: min(28vw, 160px);
    height: min(18vw, 160px);
    margin: 0;
}

.senseofbeauty .ph img {
  width: 100%;
  object-fit: cover;
  display: block;
}

.senseofbeauty .copy {
  max-width: 32ch;
}

.senseofbeauty .copy .copy_bg {
  margin: 0 0 6px;
  font-size: clamp(20px, 1.67vw, 24px);
  opacity: .9;
	display: block;
}


.senseofbeauty p.copy {
  margin: 0;
  font-weight: 600;
  font-size: clamp(18px, 2.2vw, 28px);
  line-height: 1.6;
}

/* layout positions */
.senseofbeauty .t1 { grid-column: 2 / span 6; grid-row: 1;}
.senseofbeauty .t2 { grid-column: 5 / span 6; grid-row: 2; }
.senseofbeauty .t2 .copy { margin-left: 6px; }
.senseofbeauty .t3 { grid-column: 8 / span 5; grid-row: 3;}

/* responsive */
@media (max-width: 860px) {
  .senseofbeauty .tiles {
    grid-template-columns: 1fr;
    row-gap: 56px;
  }
  .senseofbeauty .tile {
    grid-column: auto;
    grid-row: auto;
    justify-content: flex-start;
  }
  .senseofbeauty .ph {
    width: min(88vw, 50%);
    height: auto;
  }
	
.senseofbeauty .copy {
        position: relative;
	right: 0%;
}
.senseofbeauty .copy p {
white-space:nowrap;
}
	
}

@media (max-width: 440px) {
	.senseofbeauty .ph {
        width:40%;
    }
	.senseofbeauty .copy {
	right: 6%;
}
}




/* ===== senseofbeauty end ===== */









/* ===== tenyexp ===== */

/* セクション全体 */
.tenyexp {
  position: relative;
  min-height: 50svh;
  display: grid;
  place-items: center;
  overflow: hidden;
  color: #fff;
	width: 100vw;
left: 50%;
right: 50%;
margin-left: -50vw;
margin-right: -50vw;

  /* 背景画像 */
  background: url("http://illony.togarizm.com/wp-content/uploads/2025/09/img_68c164dca1ee8.jpeg")
              center / cover no-repeat fixed;
}





/* コンテンツラッパー */
.tenyexp__inner {
  max-width: 1100px;
  padding: 56px 24px 72px;

  /* 文字は中央寄せ */
  text-align: center;

  /* ブロック自体を左にずらす */
  position: relative;
  left: -20%; /* ←ずらす量。pxやvwでも調整可 */
}


/* リード文 */
.tenyexp__lead {
  margin: 0;
  font-weight: 600;
  line-height: 2.2;
  letter-spacing: .15em;
  font-size: clamp(16px, 1.25vw, 18px);
  text-shadow: 0 1px 0 rgba(0,0,0,.3); /* 背景上でも可読性UP */
}

/* スマホ用調整 */
@media (max-width: 768px) {
  .tenyexp__lead {
    line-height: 2.0;
    letter-spacing: .08em;
  }
	
.tenyexp__inner {
    left: 0%;
}

}


/* ===== tenyexp end ===== */









/* ===== lecturer ===== */
.lecturer{
    background: #2b2b2b;
    color: #e9e9e9;
    margin-left: calc(-50vw + 50%);
    width: 100vw;
}

.lecturer__inner{
  max-width:1100px;
  margin:0 auto;
  padding:56px 24px 64px;
}


/* 2カラム */
.lecturer__grid{
  display:grid;
	grid-template-columns: 240px 1fr;
  gap:32px 40px;
  align-items:start;
}

/* 画像＋キャプション */
.lecturer__photo{ margin:0; }
.lecturer__photo img{
  width:100%;
  height:auto;
  display:block;
  object-fit:cover;
}

.lecturer__cap{
  text-align:center;
  margin-top:10px;
  line-height:1.6;
}
.lecturer__cap-sub{
  display:block;
  font-size:clamp(12px,1.5vw,14px);
  opacity:.9;
}
.lecturer__cap-name{
  display:block;
  font-size:clamp(16px,2vw,20px);
  letter-spacing:.12em;
}

/* 本文 */
.lecturer__text p{
  margin:0 0 16px;
  font-size:clamp(14px,1.6vw,16px);
  line-height:2.0;
  color:#d7d7d7;
}

/* 区切り線 */
.lecturer__divider{
  margin:28px 0 24px;
  border:0;
  height:1px;
  background:linear-gradient(to right, transparent, rgba(255,255,255,.25), transparent);
}

/* Profile */
.lecturer__profile-title{
  margin:0 0 10px;
  font-weight:600;
  letter-spacing:.24em;
  font-size:clamp(18px,2.4vw,24px);
}

.lecturer__list{
  list-style:none;
  margin:0;
  padding:0 0 0 1.2em;
    position: relative;
    right: -40%;
}
.lecturer__list li {
  position: relative;
  margin: 6px 0;
  padding-left: 1.2em;   /* インデントを確保 */
  font-size: clamp(14px, 1.6vw, 16px);
  color: #e3e3e3;
}
.lecturer__list li::before {
  content: "・";
  position: absolute;
  left: 0;
  top: 0;
  color: #e3e3e3;
}

/* レスポンシブ */
@media (max-width: 900px){
  .lecturer__grid{
    grid-template-columns: 1fr;
  }
  .lecturer__photo{ max-width:340px; }
}


/* スマホ用調整 */
@media (max-width: 768px) {
.lecturer__list {
    right: -12%;
}
}

@media (max-width: 470px) {
	.lecturer__list {
		right: 0%;
}
}



/* ===== lecturer end ===== */






/* ===== lessonprogram ===== */

/* Lesson Program */
.lessonprogram {
	margin-top:230px;
}

.lp__inner {
  max-width: 1100px;
  margin: 0 auto;
  padding: 80px 24px 100px;
}

.lp__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 120px;
}

/* アイテム：左右交互配置 */
.lp__item {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  align-items: start;
}
.lp__item.alt .lp__ph { order: 2; }
.lp__item.alt .lp__copy { order: 1; }

/* 画像 */
.lp__ph {
  margin: 0;
  position: relative;
}
.lp__ph img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
}

/* MOVIE番号（画像の角に重ねる） */
.lp__num {
  position: absolute;
    top: -3.2em;
    left: -40px;
  color: #e7c55a;
}
.lp__item.alt .lp__num {
  left: auto;
  right: 0;
  text-align: right;
}
.lp__num-label {
  font-size: clamp(12px, 1.4vw, 18px);
  font-style: italic;
  margin-right: 0.4em;
  display:block
}
.lp__num-digit {
  font-size: clamp(32px, 5vw, 74px);
  font-weight: bold;
  font-style: italic;
  line-height: 0.8;
}

/* テキスト */
.lp__copy {
}
.lp__title {
  margin: 0 0 8px;
  font-size: clamp(18px, 2.4vw, 26px);
  line-height: 1.6;
    text-align: right;
}

.alt .lp__title {
    text-align: left;
}






.alt .lp__desc {
    text-align: left;
}



/* LESSONブロック */
.lp__lesson {
  margin-top: 16px;
    color: #262626;;
}
.lp__lesson-label {
	font-size: clamp(30px, 2.6vw, 42px);
  font-style: italic;
  opacity: 0.8;
  margin-bottom: 6px;
  border-bottom: 1px solid #3B3B3B;;
}
.lp__lesson-name {
  font-size: clamp(20px, 2.6vw, 35px);
  margin-bottom: 4px;	
    color: #aaa;
    font-weight: initial;
}

.lp__lesson-sub {
  font-size: clamp(16px, 1.4vw, 18px);
  color: #aaa;
  padding-top: 6px;
  text-align: right;
    font-weight: initial;
}





/* alt の場合は画像に重なるように右方向にシフト */

/* タイトルだけ画像に重ね、本文はフローのまま */
.lp__item.alt .lp__copy { position: relative; }

.lp__item.alt .lp__title{
  white-space: nowrap;           /* 折り返さない */
  display: inline-block;         /* transform 用 */
  position: relative;            /* 層を上げるだけでフローは維持 */
  z-index: 2;
  margin: 0 0 12px;
  transform: translate(
    clamp(60px, 10vw, 220px),    /* 右へスライドして画像に重ねる */
    -10%                         /* 少し上げる（縦方向も重なるがフローは保持） */
  );
}

/* 説明文は通常フローのまま（重なり防止に十分な余白を確保） */
.lp__item.alt .lp__desc{
  position: relative;
  z-index: 1;
  margin-top: 8px;               /* 必要なら調整 */
}


.lp__item.alt .lp__desc2{
  position: relative;
  z-index: 1;
  margin-top: 8px;               /* 必要なら調整 */
}

/* スマホでは重ねず通常表示 */
@media (max-width: 900px){
  .lp__item.alt .lp__title{
    transform: none;
    white-space: normal;
  }
}


/* レスポンシブ */
@media (max-width: 920px) {
  .lp__item,
  .lp__item.alt {
    grid-template-columns: 1fr;
  }
  .lp__ph,
  .lp__copy {
    order: unset;
  }
  .lp__num {
    top: -1em;
  }
}


/* ===== lessonprogram end ===== */











/* ===== lessonprogram2 ===== */

/* ===== lessonprogram2内だけに適用 ===== */
.lessonprogram2{
 margin-top:230px;
}

.lp__wrap01 {
	text-align:center;
    max-width: 1200px;
    margin: 0 auto;
}

.lessonprogram2 .lp__badge {
  display: inline-block;
  padding: 12px 40px;
  background: #d4b25d;          /* ゴールド */
  color: #000;
  font-size: 14px;
  border-radius: 30px;          /* 丸み */
    margin-bottom: 4rem;
    width: 300px;
    font-weight: 700;
}

.lessonprogram2 .lp__lead {
    text-align: left;
    font-size: clamp(16px, 1.67vw, 22px);
    padding-left: 1rem;
}



.lessonprogram2 .lesson__item {
  --overlap: 1200px;            /* 画像Bへ食い込ませる量 */
  --blockA-offset: 40px;      /* ブロックAのせり出し量 */
  position:relative;
  max-width:1200px;
  margin:130px auto;
  display:grid;
  grid-template-columns: 1.2fr 1fr;
  grid-template-rows: auto auto;
  gap:24px;
  /* はみ出し分を内部で吸収して1200pxに収める */
  padding-left:var(--blockA-offset);
  box-sizing:border-box;
  overflow:hidden;
	
}




/* 画像B（左列ぶち抜き） */
.lessonprogram2 .imgB{
  grid-column:1/2;
  grid-row:1/3;
  margin:0;
  position:relative;
  aspect-ratio:16/9;
  display:flex; 
  align-items:center;
  justify-content:center;
  color:#fff; font-size:40px;
  letter-spacing:.05em;
    margin-top: 80px;
  width:680px;
}
.lessonprogram2 .imgB img{
	width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.lessonprogram2 .imgB figcaption{
  position:absolute; inset:0;
  display:flex; align-items:center; justify-content:center;
  pointer-events:none; color:#fff;
}

/* 共通（右列ブロックの体裁） */
.lessonprogram2 .blockC {
  color:#fff;
  font-weight:700;
}



/* ブロックC：右端そろえ＋画像Bへ重ねる */
.lessonprogram2 .blockC{
  grid-column:2/3; grid-row:1/2; height:140px;

  /* 右端は絶対にそろえる */
  justify-self:end;

  /* 右端を動かさず、左へだけ伸ばして重ねる */
  width:calc(100% + var(--overlap));
  margin-left:calc(-1 * var(--overlap));

  z-index:2;   /* 画像Bより前面 */
    margin-top: 80px;
}

.lessonprogram2 .lp__title {
    margin: 0 0 8px;
	font-size: clamp(20px, 2.4vw, 36px);
    line-height: 1.6;
    text-align: right;
    white-space: nowrap;
}



/* ブロックD：右下 */
.lessonprogram2 .blockD{
  font-weight:700;
  grid-column:2/3; grid-row:2/3; height:220px;
    color: #3B3B3B;
    margin-top: 30px;
}




/* ブロックA：左上せり出し（見かけ上だけ外へ出す） */
.lessonprogram2 .blockA{
    position: absolute;
    left: 28px;
    top: 20px;
    width: 120px;
    height: 120px;
    color: #fff;
    align-items: center;
    justify-content: center;
    text-align: center;
    line-height: 1.2;
    z-index: 3;
    transform: translateX(calc(-1 * var(--blockA-offset)));
    color: #e7c55a;
    font-family: Georgia;
}

.lessonprogram2 .lp__num-label {
  font-size: clamp(12px, 1.4vw, 18px);
  font-style: italic;
  margin-right: 0.4em;
  display:block
}

.lessonprogram2 .lp__num-digit {
  font-size: clamp(32px, 5vw, 74px);
  font-weight: bold;
  font-style: italic;
  line-height: 0.8;
}




/* レスポンシブ */
@media (max-width:1300px) {
.lessonprogram2 .blockC {
    position: relative;
    right: 10px;
}
.lessonprogram2 .blockC2 {
	position: relative;
	left: 10px;
}
	
.lessonprogram2 .blockD {
    position: relative;
    right: 10px;
}
.lessonprogram2 .blockD2 {
	position: relative;
        margin-top: 30px;
        /* right: 10px; */
        padding-left: 10px;
}
}

@media (max-width:1200px) {
.lessonprogram2 .blockD {

}

}





/* SP簡易調整 */



@media (max-width:900px){
  .lessonprogram2{
    grid-template-columns:1fr;
    padding-left:0; /* モバイルでは余白を解除 */
  }
  .lessonprogram2 .imgB{
  }
  .lessonprogram2 .blockC{
    justify-self:stretch;
    width:100%; margin-left:0;
  }
	
.lessonprogram2 .blockC2 {
        justify-self: stretch;
        width: 100%;
        margin-left: 0;
}
	
  .lessonprogram2 .blockA{
    transform:none;
        left: -20px;
        top: 30px;
  }

}


/* 偶数item */

.lessonprogram2 .lesson__item2 {
  --overlap: 1200px;            /* 画像Bへ食い込ませる量 */
  --blockA-offset: 40px;        /* ブロックAのせり出し量 */
  position: relative;
  max-width: 1200px;
  margin: 40px auto;
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  grid-template-rows: auto auto;
  gap: 24px;
  /* はみ出し分を内部で吸収して1200pxに収める */
  padding-right: var(--blockA-offset);
  box-sizing: border-box;
  overflow: hidden;
}

/* 画像B（右列ぶち抜き） */
.lessonprogram2 .imgB2 {
  grid-column: 2 / 3;
  grid-row: 1 / 3;
  margin: 0;
  position: relative;
  aspect-ratio: 16/9;
  display: flex; 
  align-items: center;
  justify-content: center;
  color: #fff; 
  font-size: 40px;
  letter-spacing: .05em;
  margin-top: 80px;
    width: 680px;
}
.lessonprogram2 .imgB2 img {
	width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.lessonprogram2 .imgB2 figcaption {
  position: absolute; inset: 0;
  display: flex; 
  align-items: center; 
  justify-content: center;
  pointer-events: none; 
  color: #fff;
}

/* 共通（右列ブロックの体裁） */
.lessonprogram2 .blockC2,
.lessonprogram2 .bockD2 {
  color: #fff;
  font-weight: 700;
}

/* ブロックC：左揃え＋タイトルだけ右へはみ出して画像に重ねる */
.lessonprogram2 .blockC2 {  
  grid-column: 1 / 2;
  grid-row: 1 / 2;
  position: relative;  /* 子要素の絶対配置の基準 */
  margin-top: 80px;
  z-index: 2;
        text-shadow: 2px 2px 20px rgba(0, 0, 0, 1), 2px 2px 20px rgba(0, 0, 0, 1), 2px 2px 20px rgba(0, 0, 0, 1), 2px 2px 20px rgba(0, 0, 0, 1), 2px 2px 20px rgba(0, 0, 0, 1), 2px 2px 20px rgba(0, 0, 0, 1);
}

/* タイトル：左揃え・折り返しなしで右へオーバーラップ */
.lessonprogram2 .lp__title2 {
  margin: 0 0 8px;
	font-size: clamp(18px, 2.4vw, 36px);
  line-height: 1.6;
  text-align: left;
  white-space: nowrap;

  position: absolute;   /* ブロックC内で絶対配置 */
  top: 0;
  left: 0;
  width: 200%;          /* 必要に応じて幅を広げる */
}

/* 説明文：通常のフロー、左揃え */
.lessonprogram2 .lp__desc {
    margin: 10px 0 0;
    line-height: 1.8;
    text-align: right;
    color: #fff0c1;
    font-size: clamp(13px, 1.6vw, 16px);
    font-weight: 500;
}

.lessonprogram2 .lp__desc2 {
    text-align: left;
	margin: 70px 0 0;
    line-height: 1.8;
    color: #fff0c1;
    font-size: clamp(13px, 1.6vw, 16px);
    font-weight: 500;
}






/* ブロックD：右下 */
.lessonprogram2 .bockD2 {
  grid-column: 2 / 3; 
  grid-row: 2 / 3; 
  height: 220px;
  color: #262626;
}

/* ブロックA：左上せり出し（見かけ上だけ外へ出す） */
.lessonprogram2 .blockA2 {
  position: absolute;
  right: -50px;
  top: 20px;
  width: 120px;
  height: 120px;
  color: #fff;
  align-items: center;
  justify-content: center;
  text-align: center;
  line-height: 1.2;
  z-index: 3;
  transform: translateX(calc(-1 * var(--blockA-offset)));
  color: #e7c55a;
  font-family: Georgia;
}

.lessonprogram2 .lp__num-label {
  font-size: clamp(12px, 1.4vw, 18px);
  font-style: italic;
  margin-right: 0.4em;
  display: block;
}

.lessonprogram2 .lp__num-digit {
  font-size: clamp(32px, 5vw, 74px);
  font-weight: bold;
  font-style: italic;
  line-height: 0.8;
}

.lessonprogram2 .blockD2 {
	grid-column: 1 / 2;
  grid-row: 2 / 3;
  height: 220px;
  color: #262626;
  font-weight:700;
}


.lesson__annotation {
 text-align:center;
	font-size:12px;
    margin-top: 4rem;
}



/* SP簡易調整 */
@media (max-width: 1100px) {
.lessonprogram2 .lesson__item {
        display: flow;
        height: 530px;
    margin: 130px auto 0;
}
	
.lessonprogram2 .lesson__item2 {
        display: flow;    
	padding-left: var(--blockA-offset);
        padding-right: 0;
        margin: 130px auto 0;
        height: 550px;
}
	
.lessonprogram2 .imgB {
    margin-top: 60px;
    width: 60%;
}
	
.lessonprogram2 .blockC {
        position: relative;
        right: 10px;
        margin-right: 4%;
        top: -200px;
	 text-shadow: 2px 2px 20px rgba(0, 0, 0, 1), 2px 2px 20px rgba(0, 0, 0, 1), 2px 2px 20px rgba(0, 0, 0, 1), 2px 2px 20px rgba(0, 0, 0, 1), 2px 2px 20px rgba(0, 0, 0, 1), 2px 2px 20px rgba(0, 0, 0, 1);
}
	
.lessonprogram2 .blockD {
        margin-right: 4%;
        top: -230px;
}
	
.lessonprogram2 .blockD2 {
        top: -190px;
        margin-right: 4%;
        padding-left: 0px;
}
	
  .lessonprogram2 {
    grid-template-columns: 1fr;
    padding-left: 0; /* モバイルでは余白を解除 */
  }
  .lessonprogram2 .imgB2 {
    margin-top: 60px;
    width: 60%;
    left: 35%;
  }
    .lessonprogram2 .blockC2 {
        position: relative;
        margin-right: 4%;
        top: -200px;
        left: -20px;
		text-shadow: 2px 2px 20px rgba(0, 0, 0, 1), 2px 2px 20px rgba(0, 0, 0, 1), 2px 2px 20px rgba(0, 0, 0, 1), 2px 2px 20px rgba(0, 0, 0, 1), 2px 2px 20px rgba(0, 0, 0, 1), 2px 2px 20px rgba(0, 0, 0, 1);
    }

  .lessonprogram2 .blockA2 {
    transform:none;
        top: 30px;
        left: 86%;
  }
	
.lessonprogram2 .lp__title2 {
    position: initial;
}
.lessonprogram2 .lp__desc2 {
    margin: 10px 0 0;
}
}



/* iPad 縦向き */
@media screen and (min-width: 768px) and (max-width: 1100px) {
    .lessonprogram2 .lesson__item {
		height: 580px;
    }
}








@media (max-width:700px) {
.lessonprogram2 .blockA2 {
        left: initial;
        position: absolute;
        right: -30px;
	}
.lessonprogram2 .imgB2 {
        left: 32%;
	}
    .lessonprogram2 .lesson__item {
        height: ;
    }
    .lessonprogram2 .lesson__item2 {
        height: ;
        position: relative;
    }
	
}

@media (max-width:500px) {
    .lessonprogram2 .lesson__item {
        height: 360px;
    }
    .lessonprogram2 .lesson__item2 {
        height: 360px;
        position: relative;
    }
	
}




/* ===== lessonprogram2 end ===== */










/* ===== voice ===== */

/* セクション全体 */
.voice {
  position: relative;
	min-height: 70svh;
  display: grid;
  place-items: center;
  overflow: hidden;
  color: #fff;
  margin-top: 230px;

width: 100vw;
left: 50%;
right: 50%;
margin-left: -50vw;
margin-right: -50vw;

  /* 背景画像 */
  background: url("http://illony.togarizm.com/wp-content/uploads/2025/09/img_68c1b2a978797.jpeg")
              center / cover no-repeat fixed;
}


.voice h2.hero {
	margin-top:3rem;
}




.voice__list {
    top: 60px;
  list-style: none;
  margin: 0;
  padding: 0;
  position: relative;
  z-index: 1;
  min-height: 420px;
}

/* 吹き出し */
.voice__item {
  position: absolute;
  width: min(460px, 86vw);
  background: rgba(156, 98, 105, 0.3); /* くすんだローズ色 */
  color: #fff;
  padding: 18px 22px;
  border-radius: 14px;
  line-height: 1.9;
  backdrop-filter: saturate(120%) blur(2px);
    margin: 1em;
}


/* 吹き出しの三角形（右下） */
.voice__item::after {
  content: "";
  position: absolute;
  bottom: -14px;   /* 吹き出しの下に配置 */
  right: 28px;     /* 右端からの位置 */
  width: 0;
  height: 0;
  border-left: 14px solid transparent;
  border-right: 14px solid transparent;
    border-top: 14px solid rgba(156, 98, 105, 0.3);
}


.voice__item p {
  margin: 0;
}

/* 配置（PC想定） */
.item--a {
	  right: 6%;
    top: -30%;
}
.item--b {
	left: 8%;
    top: -10%;
}
.item--c {
    right: 0%;
    bottom: 54%;
}
.item--d {
    left: 0;
    bottom: 26%;
}


/* レスポンシブ対応：モバイルでは縦並び */


@media (max-width:1100px) {
.voice__item {
    position: absolute;	
	}
}



@media (max-width: 960px) {
  .voice__list {
    min-height: unset;
        padding: 10px 40px;
        top: -60px;
  }
  .voice__item {
    position: static;
    width: auto;
    margin: 14px auto;
    margin-top: 40px;
    }
  }









/* ===== voice end ===== */




/* ===== flow ===== */
.flow {
	margin-top:230px;
    text-align: center;
}

.flow__fig {
	text-align:center;
	margin-top:6rem;
}


.spfig {
	display:none;
}



@media (max-width: 960px) {
.flow__fig {
	margin-top:2rem;
}

.pcfig {
	display:none;
}
.spfig {
	display:initial;
}
.spfig img {
    max-width: 90%;
}
	
}

/* ===== flow end ===== */















/* ===== afterdiploma ===== */

/* ---- 可変パラメータ ---- */
.afterdiploma{
  --wrap-pad: 16px;                    /* 左右余白(スマホ時) */
  --bg-height: clamp(280px, 42vw, 460px);
  --block-top: clamp(40px, 13vw, 150px); /* B/Cの上端位置（背景Aの上から） */
  --blockC-w: clamp(260px, 38%, 460px);/* Cの幅 */
  --gap: 100px;
	margin-top:230px;
}

/* ---- ベース ---- */
.afterdiploma .afterdiploma__wrap{
  position: relative;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 var(--wrap-pad) 64px;
  box-sizing: border-box;

  display: grid;
  grid-template-columns: 1fr var(--blockC-w); /* Bは左域、Cは右域 */
  grid-auto-rows: auto;
  column-gap: var(--gap);
}

/* 見出し（帯） */
.afterdiploma .hero {

}

/* 背景画像A（2カラムにまたがる） */
.afterdiploma .afterdiploma__bgA{
  grid-column: 1 / 3;
  position: relative;
  margin-top: 0px;                /* 見出しとの重なり具合 */
  min-height: var(--bg-height);
	background: #000000 center/cover no-repeat;
  z-index: 1;width: 100vw;
left: 50%;
right: 50%;
margin-left: -50vw;
margin-right: -50vw;
}

/* ブロックB（背景Aの上に重ねる） */
.afterdiploma .afterdiploma__blockB{
  position: absolute;              /* 背景A内で位置決め */
  top: var(--block-top);
  padding: 22px 28px;
  color: #fff;
	font-size: clamp(14px, 1.6vw, 16px);
  line-height: 1.5;
  z-index: 3;
  text-align: center;
    left: 20%;
  max-width: 500px;
}

/* ブロックC（右カラム。上端をBに揃え、背景Aに重ねる） */
.afterdiploma .afterdiploma__blockC{
  grid-column: 2;                  /* 右側に配置 */
  align-self: start;
  margin-top: calc(-1 * (var(--bg-height) - var(--block-top)));
  /* ↑ 背景Aの高さ分だけ上に引き上げ、Bと同じ上端へ */
  padding: 0;
  z-index: 4;                      /* 背景Aより前面 */
  overflow: hidden;
}

/* C内の画像をフィットさせる */
.afterdiploma .afterdiploma__blockC img{
  display: block;
  width: 100%;
  height: auto;
}



@media (max-width: 1200px) {
	.afterdiploma {
}
.afterdiploma .afterdiploma__blockB {
    max-width: 300px;
}
.afterdiploma .afterdiploma__blockC img {
    width: 80%;
}
}




/* PC幅で左右のはみ出しを解消（見出し帯を端まで） */
@media (min-width: 1224px){
  .afterdiploma .afterdiploma__wrap{ padding-left: 0; padding-right: 0; }
  .afterdiploma .afterdiploma__title{ left: 0; right: 0; }
}

/* ---- モバイル：縦積みで読みやすく ---- */
@media (max-width: 768px){
  .afterdiploma .afterdiploma__wrap{
    grid-template-columns: 1fr;
    column-gap: 0;
    /* NG: position:absolute; */
    position: static;        /* ←通常フローに戻す */
  }
  .afterdiploma .afterdiploma__bgA{ grid-column: 1; margin-top: 48px; }
  .afterdiploma .afterdiploma__blockB{
    position: static;              /* 通常フローへ */
    margin: 16px 0 0;
        max-width: 100%;
  }
  .afterdiploma .afterdiploma__blockC{
    grid-column: 1;
    margin-top: -20px;
    position: relative;
    /* NG: right:-20%; */
    right: auto;             /* ←はみ出し防止 */
    left: 0;
	  width: 90%;
        margin-left: 110px;
  }
}

.afterdiploma__annotation {
    text-align: center;
    font-size: 12px;
	margin-top:3rem;
}



/* ===== afterdiploma end ===== */






/* ============ faq ============ */
.faq {
  position: relative;
  isolation: isolate;
  /* 背景画像はここを書き換え */
  --faq-bg: url("http://illony.togarizm.com/wp-content/uploads/2025/09/img_68c2547276808.jpeg");
  --panel-bg: rgba(20, 20, 20, 0.55);
  --panel-border: rgba(255, 255, 255, 0.12);
  --text: #fff;
  --muted: rgba(255,255,255,0.8);
  --radius: 18px;
  --gap: 20px;
width: 100vw;
left: 50%;
right: 50%;
margin-left: -50vw;
margin-right: -50vw;
	margin-top:230px;
}

.faq__bg {
  position: absolute;
  inset: 0;
  background-image: var(--faq-bg);
  background-size: cover;
  background-position: center;
  z-index: -2;
}
.faq::before {
  /* うっすら暗くして可読性を上げる */
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(80% 60% at 50% 0%, rgba(0,0,0,0.35), transparent 70%),
    rgba(0,0,0,0.45);
  z-index: -1;
}

.faq__inner {
  max-width: 960px;
  margin: 0 auto;
  padding: 72px 20px 96px;
  color: var(--text);
}

.faq .hero {
    margin: 50px 0 80px;
}

.faq__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 16px;
}

/* パネル（Q&A 2段を一つに） */
.faq__item {
  background: var(--panel-bg);
  border: 1px solid var(--panel-border);
  border-radius: var(--radius);
  box-shadow: 0 6px 24px rgba(0,0,0,.35) inset,
              0 8px 24px rgba(0,0,0,.25);
  overflow: hidden;
  backdrop-filter: blur(4px);
    padding: 1.4rem;
}

/* 行（Q / A） */
.faq__row {
  display: grid;
  grid-template-columns: 40px 1fr;
  align-items: start;
  gap: 12px;
  padding: 16px 18px;
}

.faq__row + .faq__row {
    margin-top: 2rem;
}

/* バッジ（Q / A の丸） */
.faq__badge {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  font-weight: 700;
  font-size: 14px;
  line-height: 1;
  user-select: none;
}
.faq__badge--q {color: #FFD966; }
.faq__badge--a {}

/* テキスト */
.faq__row p {
  margin: 0;
  font-size: clamp(14px, 1.7vw, 16px);
  line-height: 1.9;
  color: var(--muted);
}

/* レスポンシブ微調整 */


@media (max-width: 1100px){
	.faq__list {

	}
.faq__item {
    margin: 0;
}
.faq__badge {
        font-size: 3rem;
}
}


@media (min-width: 960px) {
  .faq__row { padding: 18px 22px; grid-template-columns: 44px 1fr; }
  .faq__badge { 
	  width: 30px; 
	  height: 30px; 	  
        font-size: 3rem;
        top: -14px;
        position: relative; }
}


@media (max-width: 399px) {
.faq__row {
    display: flow;
    padding: initial;
}
.faq__row p {
    margin-top: 34px;
}
.faq__item {
        margin: 0;
}
}


/* ===== faq end ===== */








/* ===== ytmovie ===== */

.ytmovie {
	text-align:center;
	margin-top:230px;
}

.ytmovie iframe {
	margin-top:3rem;
}
.video-wrapper {
  position: relative;
  width: 100%;
  /* 560:315 = 16:9 → 9 / 16 = 56.25% */
  padding-top: 56.25%;
}

.video-wrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}




.ytmovie2 {
	text-align:center;
	margin-top:230px;
}

.video-wrapper2 {
	text-align:center;
}


.video-wrapper2 {
	width: 100%;
	aspect-ratio: 16 / 9;
    max-width: 1200px;
    margin: 0 auto;
}

.video-wrapper2 iframe {
	width: 100%;
	height: 100%;
}


@media (max-width: 1199px) {
.video-wrapper2 {
    padding: 4%;
}
}



/* ===== ytmovie end ===== */







/* ===== afterword ===== */


.afterword {
    /* max-width: 1200px; */
    margin: 0 auto;
    background: url(http://illony.togarizm.com/wp-content/uploads/2025/09/img_68c26b63f2732.jpeg) no-repeat center / cover;
    padding: 80px 20px;
    position: relative;
    margin-top: 230px;
    width: 100vw;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
    margin-top: 230px;
}


.afterword__tsub {
 display:block;
  font-size: clamp(16px, 1.67vw, 24px);
    font-weight: 100;
    margin-top: 1rem;
}



/* ブロックB */
.afterword__blockB {
  color: #fff;
  padding: 40px;
  margin: 40px auto 0; /* 上に余白を入れて背景に重ねる */
  position: relative;
    max-width: 670px;
}


.afterword__blockB p {

}



/* ===== afterword end ===== */










/* ===== cta ===== */

/* CTA */
.cta {
  background: #000;
  color: #fff;
    padding: 0 16px 64px;
	margin-top:230px;
}
.cta__inner {
  max-width: 980px;
  margin: 0 auto;
  text-align: center;
}

.cta__btn {
  display: inline-block;
  margin: 0 auto;
  padding: 12px 36px;
  border-radius: 9999px;
  background: #d7748d;          /* ピンク */
  color: #fff;
  text-decoration: none;
  font-weight: 600;
  line-height: 1;
  box-shadow: 0 2px 0 rgba(255,255,255,.08) inset, 0 6px 16px rgba(0,0,0,.35);
  transition: transform .12s ease, opacity .2s ease;
}
.cta__btn:hover { opacity: .92; transform: translateY(-1px); }

.cta__benefits {
  list-style: none;
  margin: 65px auto 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: min(6vw, 64px);
  align-items: start;
}
.benefit img {
  width: 56px;
  height: auto;
  display: block;
  margin: 0 auto 12px;
}
.benefit__text {
  margin: 0;
    font-size: clamp(14px, 1.6vw, 18px);
  line-height: 1.9;
  opacity: .85;
}

.cta__ps {	
    font-size: 0.8rem;
    margin-bottom: 10px;
    display: block;
    line-height: 1.8rem;
}
}




/* Responsive */
@media (max-width: 768px) {
  .cta { padding: 52px 16px; }
  .cta__benefits { grid-template-columns: 1fr; gap: 28px; }
  .cta__btn { padding: 12px 30px; }
}




/* ===== cta end ===== */