@charset "utf-8";
/* CSS Document */
:root{
  --primary: #ff99cc;
  --ff-mincho: "dnp-shuei-mincho-pr6n", "游明朝", yu-mincho-pr6n, "YuMincho", "Yu Mincho", "Hiragino Mincho ProN", "MS PMincho", serif;
  --ff-en: "linotype-didot", Didot, linotype-didot, aw-conqueror-didot, serif;
  --ff-helv: "Helvetica Neue" , Helvetica ,serif;
  --ff-noto: "Noto Sans JP", var(--ff-gothic);
		--space-1: 0rem;
		--space-1: 1rem;
  --space-2: 2rem;
  --space-3: 3rem;
  --space-4: 4rem;
  --space-5: 5rem;
  --space-6: 6rem;
}
.mt-0 { margin-top: var(--space-0); }
.mt-1 { margin-top: var(--space-1); }
.mt-2 { margin-top: var(--space-2); }
.mt-3 { margin-top: var(--space-3); }
.mt-4 { margin-top: var(--space-4); }
.mt-5 { margin-top: var(--space-5); }
.mt-6 { margin-top: var(--space-6); }
.mb-1 { margin-bottom: var(--space-1); }
.mb-2 { margin-bottom: var(--space-2); }
.mb-3 { margin-bottom: var(--space-3); }
.mb-4 { margin-bottom: var(--space-4); }
.mb-5 { margin-bottom: var(--space-5); }
.mb-6 { margin-bottom: var(--space-6); }
.innerContet{
margin-bottom: 6rem;
}
.t_layout ul{
margin-bottom: 0;
}
.container01 p,
.container02 p,
.container03 p,
.container04 p,
.container05 p {
        margin: 2rem 0;
        line-height: 1.7;
        font-size: 1rem;
								}
.container01 p.imgLayout,
.container02 p.imgLayout{
max-width: 70%;
margin: 0 auto;
}
.container02 p.mt-0{
margin-top: 0;
}
.container03 ul.field{
margin-top: 0;
}
.container03 li{
margin-bottom: 2rem;
}
.container01{
	margin-top: 90px;
	text-align: left;
}
.nextHeading01 p{
	margin-bottom: 2rem;
}
.nextHeading01 p.imgLayout50,
.container01 p.imgLayout50,
.container02 p.imgLayout50{
max-width: 50%;
margin: 0 auto;
}
.container01 p.imgLayout80,
.container02 p.imgLayout80{
max-width: 80%;
margin: 0 auto;
}

/* h2 タイトル上　数字　*/
.ff-title {
    font-family: var(--ff-mincho);
    font-weight: 500;
    font-style: normal;
}
.fc-primary {
    color: var(--primary);
}
.no{
font-size: clamp(28px, 11.7333333333vw, 48px);
    line-height: 1;
}
/* h2 ラインタイトル*/
h2 {
color: #5f55a3;
/*color: #ada1e6;*/
    display: block;
    text-align: center; 
				margin: 2rem 0;
				font-size: clamp(1.3rem, 11.7333333333vw, 1.6rem);
}
h2::before,
h2::after {
    border-top: none;
    content: none;
    flex-grow: 0;
}
h2::before {
    margin-right: 0;
}
h2::after {
    margin-left: 0;
}
h2 span{
margin:0.625rem 0 0;
}
/* h4 ラインタイトル*/
h4.tith4{
font-size:1.1rem;
text-align: left;
}
/* h3 ラインタイトル*/
h3 {
font-family: "dnp-shuei-mincho-pr6n", sans-serif;
font-style: normal;
font-weight: 500;
font-size: clamp(1.1rem, 1.169rem + 0.14vw, 1.4rem);
    line-height: 1.5;
    display: flex;
    align-items: center;
    text-align: center; /* for no-flexbox browsers */
				margin: 2rem 0;
}
h3::before,
h3::after {
    border-top: 1px solid;
    content: "";
    display: inline; /* for IE */
    flex-grow: 1;
}
h3::before {
    margin-right: 0.5em;
}
h3::after {
    margin-left: 0.5em;
}
h3 span{
margin:0.625rem 0 0;
}
.container03 ul.Upside{
display: flex;
justify-content: space-evenly;
flex-wrap: wrap;
margin-top: 2rem;
}
.container03 .Upside li{
    width: 38%;
    margin-right: 0px;
    margin-bottom: 50px;
}
.Upside li p{
font-size: 0.9rem;
}
.Upside li img{
max-width:  100%;
height: auto;
}
.youtubeIcon {
    max-width: 1.2rem;
    height: auto;
}
p.talkingReel{
background-color: #f6f6f6;
padding: 0.5em;
}
p.talkingReel span.fc-primary{
font-weight: 700;
}
.container03 ul.field h4,
.container03 ul.Upside h4 {
    line-height: 1.5;
    margin: 15px 0;
    font-size: 16px;
	font-weight: 700;
}
/*箇条書き*/
.container01 ul.maru li,
.container02 ul.maru li{
width: 100%;
padding-left: 1em;
text-indent: -1em;
font-size: 0.9rem;
text-align: left;
}
.container01 ul.maru li::before,
.container02 ul.maru li::before{
	content: "●";
	color: #ff99cc;
	margin-right: 10px;
}

.innerContetItem{
display: flex;
  flex-wrap: wrap;      
  align-items: baseline; 
/*  margin-bottom: 1em;*/
}
.innerContetItem dt{
display: block;
}
.innerContetItem dt::before{
content: "●";
  color: #ff99cc;
  margin-right: 0.5em;
}
dfn{
font-style: normal;
}
.innerContetItem dt{
margin: 0;
  font-size: 1rem;
		font-weight: bold;
}
.innerContetItem dd{
width: 100%;         
  margin: 0.5em 0 2rem 1rem; 
  line-height: 1.8;
}
.footer_address .course_Content h3{
text-align: center;
display: flex;
justify-content: center;
}
/*.footer_address p{
text-align: left;
}*/
.footer_address h3::before,
.footer_address h3::after{
border-top: none;
content: none;
text-align: center;
}
dl.innerContetItem.mb-6{
/*margin-bottom: 4rem;*/
}
.container06 ul li img {
     margin-bottom: 0; 
}
.container06 ul li h3{
margin-top: 0.5rem;
}
@media only screen and (max-width: 767px) {

.innerContet{
margin-bottom: 4rem;
}
.container01 p,
.container02 p,
.container03 p,
.container04 p,
.container05 p {
        margin: 0 0 2rem;
        line-height: 1.5;
        font-size: 1rem;
								}
	.container01 p.imgLayout,
.container02 p.imgLayout{
max-width: 100%;
}
.nextHeading01 p.imgLayout50,
.container01 p.imgLayout50,
.container02 p.imgLayout50{
max-width: 100%;

}
.container01 p.imgLayout80,
.container02 p.imgLayout80{
max-width: 100%;

}							
								
								
								
								
/* */
.container03 ul.Upside{
display: block;
}
.container03 .Upside li h4{
/*color: #ada1e6;*/
font-size: 1.1rem;
}
.container03 .Upside li {
    float: none;
    width: 100%;
    margin-right: 40px;
    margin-bottom: 35px;
}
.container03 .Upside li{
  margin-right: 0px;
}
.container03 .Upside p {
    margin: 16px 0 4rem ;
}
.container01 p.imgLayout,
.container02 p.imgLayout{
max-width: 100%;
margin: 0 auto;
}
dl.innerContetItem.mb-6{
margin-bottom: 0rem;
}
.container03 .field p {
        margin: 16px 0 4rem ;
    }
}
/* ===== ブレンドタイプ診断エリアの新レイアウト ===== */
/* モバイル（スマホ）ファーストで記述 */
.blend-type-intro {
  display: flex;
  flex-direction: column; /* スマホでは縦並び */
  gap: 0; /* 【修正】DLタグの既存マージンとの重複を避け、余白を詰める */
  margin-bottom: 20px;
}
.blend-type-intro__text {
  width: 100%;
}
.blend-type-intro__img {
  width: 100%;
}
.blend-type-intro__img img {
  width: 100%;
  height: auto;
  border-radius: 8px; /* 画像の角を丸める */
}

/* 動画の最大幅を制限＆中央寄せするコンテナ */
.video-container {
  width: 100%;
  margin: 30px auto; /* 左右をautoにしてセンター配置 */
}

/* 【追加】動画キャッチテキスト（AIO/GEO対策・UX向上） */
.video-catch {
  text-align: center;
  font-weight: bold;
  font-size: 1.1rem;
  margin-bottom: 12px;
  line-height: 1.5;
}

/* YouTube動画のレスポンシブ用ラッパー */
.video-wrapper {
  position: relative;
  width: 100%;
  padding-top: 56.25%; /* 16:9アスペクト比の維持 */
  border-radius: 8px;
  overflow: hidden;
  background-color: #000;
}
.video-wrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/* PC・タブレット環境（768px以上）でのレイアウト */
@media screen and (min-width: 768px) {
  /* 文章と画像を2カラム（横並び）にする */
  .blend-type-intro {
    flex-direction: row; 
    align-items: center; /* 垂直方向の中央揃え */
    gap: 30px; /* PC時は横の余白を設ける */
  }

  /* 文章エリアの幅を狭く（約38%）、画像エリアを広く（約62%）する設定 */
  .blend-type-intro__text {
    flex: 0 0 38%; 
  }
  .blend-type-intro__img {
    flex: 0 0 62%;
  }
  /* PC環境では動画の幅が広がりすぎないように制限 */
  .video-container {
    max-width: 480px; /* 400px前後の適正サイズに制限 */
  }
}
/* スマホ表示で画像との間を詰めるため、テキスト要素（dl, dd）の下余白をリセット */
.blend-type-intro__text dl.innerContetItem,
.blend-type-intro__text dl.innerContetItem dd:last-child {
  margin-bottom: 0.5rem;
}
/* 診断誘導CTAボタン（コース紹介ページと統一したデザイン） */
.diagnosis-cta-section {
    text-align: center;
    margin: 3rem auto 4rem;
    width: 100%;
}
.diagnosis-cta-lead {
    font-family: "yu-mincho-pr6n", "Yu Mincho", "游明朝", serif;
    font-size: 15px;
    color: #333;
    margin-bottom: 1rem;
    letter-spacing: 0.1em;
}

/* 詳細度を上げてグローバルなリンクの下線を打ち消す */
a.diagnosis-cta-btn,
a.diagnosis-cta-btn:link,
a.diagnosis-cta-btn:visited,
a.diagnosis-cta-btn:hover,
a.diagnosis-cta-btn:active {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: rgba(225, 133, 179, 1.00); 
    border: 1px solid rgba(225, 133, 179, 1.00); 
    border-radius: 0; 
    padding: 20px 0;
    text-decoration: none; /* 下線を確実に非表示に */
    transition: all 0.3s ease;
    width: 100%;
    max-width: 450px;
}
.diagnosis-cta-btn .btn-inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-right: 12px;
}
.diagnosis-cta-btn .main-txt {
    font-family: "yu-mincho-pr6n", "Yu Mincho", "游明朝", serif;
    font-size: 18px;
    color: #fff;
    font-weight: 500; 
    letter-spacing: 0.1em;
    line-height: 1.3;
    white-space: nowrap;
}
.diagnosis-cta-btn .cta-icon {
    font-size: 18px;
    color: #fff;
    transition: transform 0.3s ease;
}

/* ホバー時のデザイン調整 */
@media (hover: hover) {
    a.diagnosis-cta-btn:hover {
        background-color: rgba(236, 235, 235, 1.00); 
        border-color: rgba(236, 235, 235, 1.00);
        text-decoration: none;
    }
    a.diagnosis-cta-btn:hover .main-txt,
    a.diagnosis-cta-btn:hover .cta-icon {
        color: #333; 
    }
    a.diagnosis-cta-btn:hover .cta-icon {
        transform: translateX(6px);
    }
}
a.diagnosis-cta-btn:active {
    background-color: rgba(220, 220, 220, 1.00); 
    border-color: rgba(220, 220, 220, 1.00);
    text-decoration: none;
}
a.diagnosis-cta-btn:active .main-txt,
a.diagnosis-cta-btn:active .cta-icon {
    color: #333;
}

/* レスポンシブ調整 */
@media screen and (max-width: 768px) {
    .diagnosis-cta-section {
        margin: 2.5rem auto 3rem;
    }
    .diagnosis-cta-lead {
        font-size: 13px;
    }
}
@media only screen and (max-width: 639px) {
    a.diagnosis-cta-btn,
    a.diagnosis-cta-btn:link,
    a.diagnosis-cta-btn:visited,
    a.diagnosis-cta-btn:hover,
    a.diagnosis-cta-btn:active {
        width: 90%; 
        padding: 16px 0; 
    }
    .diagnosis-cta-btn .main-txt {
        font-size: 15px;
        letter-spacing: 0.05em;
    }
    .diagnosis-cta-btn .cta-icon {
        font-size: 16px;
    }
}