@charset "UTF-8";
/* 2024.0214 Kishimoto */
@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@100;200;300;400;500;600&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;200;300;400;500;600;700;800;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Pinyon+Script&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@200;300;400;500;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@200..900&display=swap');
/* --------------------------------
     カラーズ通信詳細ページ
	 基本設定
---------------------------------- */
*, *:before, *:after {
  -moz-box-sizing: inherit;
  -webkit-box-sizing: inherit;
  box-sizing: inherit;
  margin: 0;
  padding: 0;
}
html {
  font-size: 62.5%;
  max-width: 100%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  scroll-behavior: smooth; /*スムーススクロール*/
}
body {
  margin: 0 auto;
  padding: 0;
  max-width: 100%;
  height: auto;
  overflow-x: hidden !important;
}
p {
  font-size: 1.1vw;
  color: #666;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 300;
  line-height: 1.5;
}
h2 {
  font-size: 36px;
  font-size: 3.6rem;
  font-weight: bold;
}
dt {
  font-size: 16px;
  font-size: 1.6rem;
  font-weight: bold;
}
dd {
  font-size: 16px;
  font-size: 1.4rem;
  line-height: 1.6em; /* padding-top: 0.6em; 
	padding-bottom: 1.3em; */
}
img {
  width: 100%;
  border: 0;
  vertical-align: bottom;
  max-width: 100%;
  height: auto;
}
/* clearfix　ここから */
.clearfix:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}
/* clearfix　ここまで */
* {
  margin: 0;
  padding: 0;
}
/* Google Map レスポンシブ　ここまで */
/* パソコンで見たときは"pc"のclassがついた画像が表示される */
.pc {
  display: block !important;
}
.sp {
  display: none !important;
}
.pinkpink { /*coloursのUピンク共通*/
  color: #F39;
}
.red_text { /*赤文字*/
  color: #C00;
}
.yellow_marker { /*黄色の蛍光マーカー線*/
  background: linear-gradient(transparent 85%, #FF3 85%);
}
.precautions_span { /*注意事項span*/
  color: red;
  font-weight: 600;
  animation-name: tenmetsu;
  animation-duration: 1s;
  animation-direction: alternate;
  animation-iteration-count: infinite;
}
@keyframes tenmetsu { /*注意事項span 点滅させる*/
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
.usuda_application_a { /*カラーズ通信No.9　パンプアップ申し込み臼田さんメール　 20241003 */
}
.irregular_p { /*カラーズ通信No.9　パンプアップ申し込み変更のコメント 20241003*/
  width: 55%;
  margin: 0 auto 5% auto;
  color: red;
  font-size: 1.2vw;
  font-weight: 400;
  padding-left: 1.2vw;
  text-indent: -1.2vw;
}
@media screen and (max-width:767.98px) { /* 変更点。0.02引く。 */
  .pc {
    display: none !important;
  }
  .sp {
    display: block !important;
  }
  .clearfix:after { /* clearfix　ここから */
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
  } /* clearfix　ここまで */
  h2 {
    font-size: 26px;
    font-size: 2.6rem;
    font-weight: bold;
  }
  p {
    font-size: 4.2vw;
    color: #666;
    font-family: 'Noto Sans JP', sans-serif;
    font-weight: 100;
  }
  .irregular_p { /*カラーズ通信No.9　パンプアップ申し込み変更のコメント 20241003*/
    width: 85%;
    margin: 0 auto 5% auto;
    color: red;
    font-size: 4vw;
    font-weight: 400;
    padding-left: 4vw;
    text-indent: -4vw;
  }
}
/* ---------------------基本設定　ここまで ---------------------- */
/*-------------------
web通信各ページ内
------------------ */
/*タイトル周り　他ページとデザイン合わせ*/
body main {
  width: 100%;
  margin: 0 auto;
}
.magazine_section {
  width: 80%;
  margin: 0 auto;
  padding: 10% 0 0 0;
}
.background_boder {
  position: absolute;
  width: 100%;
  top: 50px;
  z-index: -1;
}
.work h3 small {
  display: block;
  font-size: 15px;
  letter-spacing: 1px;
  color: #1A3D48;
}
.barlow-bold-italic {
  font-family: "Barlow", sans-serif;
  font-weight: 700;
  font-style: italic;
}
.work h3 b {
  font-size: 30px;
  padding-bottom: 0px;
  display: block;
  padding-top: 0px;
  padding-left: 10px;
  border-left: 5px solid #f0b643;
  margin-top: 10px;
  margin-bottom: 35px;
  color: #1A3D48;
}
section {
  display: block;
}
.qa h3 small {
  display: block;
  font-size: 15px;
  letter-spacing: 1px;
  margin-top: 50px;
  color: #1A3D48;
}
@media screen and (max-width:767.98px) { /* 変更点。0.02引く。 */
  body main {
    margin: auto;
    width: 100%;
  }
  .magazine_section {
    width: 90%;
    margin: 0 auto;
    padding: 30% 0 0 0;
  }
  .background_boder {
    position: absolute;
    width: 100%;
    top: 50px;
  }
  .work h3 small {
    display: block;
    font-size: 15px;
    letter-spacing: 1px;
    color: #1A3D48;
  }
  .work h3 b {
    font-size: 23px;
    padding-bottom: 0px;
    display: block;
    padding-top: 0px;
    padding-left: 10px;
    border-left: 5px solid #f0b643;
    margin-top: 10px;
    margin-bottom: 10%;
    color: #1A3D48;
  }
}
/*====================================================================
   各WEBマガジン　記事詳細ページ       web_magazine_vol●●●●.html
=====================================================================*/
/*--- タイトル周り -----*/
.web_magazine_introduction_section {
  width: 80%;
  margin: 2% auto;
  text-align: center;
}
.web_magazine_h2 {
  font-family: "Oswald", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 2.4vw;
  color: #000;
  background: linear-gradient(transparent 60%, #ede8e4 60%); /*薄いグレー*/
  display: inline-block;
  padding: 0 2%;
}
.introduction_div {
  background-color: #efefed;
  width: 100%;
  margin: 5% auto;
  padding: 3%;
}
.web_magazine_title_div {
  text-align: center;
}
.h3_main_p {
  font-size: 1.8vw;
  font-weight: 600;
  position: relative;
  line-height: 1.5;
}
.h3_main_p::before {
  background-color: #000; /* 線の色 */
  border-radius: 5px; /* 線の両端を丸く */
  bottom: -2px; /* 線の位置 */
  content: "";
  height: 1px; /* 線の高さ */
  left: 50%; /* 線の中央寄せ */
  position: absolute;
  transform: translateX(-50%); /* 線の中央寄せ */
  width: 10%; /* 線の長さ */
}
.h3_sub_p {
  font-size: 1.4vw;
  font-weight: 100;
  margin: 1% auto;
}
.magazine_index_box_div {
  width: 100%;
  margin: 3% auto 1% auto;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-around;
}
.magazine_index_box_div .magazine_images_p {
  flex-basis: 20%;
  margin: 0;
}
.magazine_images_p img {
  width: 100%;
  margin: 0;
  padding: 0;
}
.index_div {
  flex-basis: 70%;
  width: 100%;
  margin: 0;
  background-color: #fff;
  padding: 2%;
}
.index_h4 {
  text-align: center;
  font-family: "Oswald", sans-serif;
  font-weight: 600;
  font-style: normal;
  font-size: 1.6vw;
}
.index_div ol {
  width: 90%;
  margin: 2% auto;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  padding: 0;
}
.index_div li {
  flex-basis: 100%;
  text-align: left;
  font-size: 1.8vw;
  margin: 0.5em 0;
  font-weight: 600;
  color: #d43b74;
}
.index_div li a {
  text-decoration: none;
  color: #000;
  font-size: 1.6vw;
}
.index_div li a:hover {
  opacity: 0.5;
}
@media screen and (max-width:767.98px) { /* 変更点。0.02引く。 */
  .web_magazine_introduction_section {
    margin: 5% auto;
    width: 95%;
  }
  .web_magazine_h2 {
    font-size: 8vw;
  }
  .introduction_div {
    width: 90%;
    margin: 8% auto;
    padding: 3%;
    z-index: 0;
    position: relative;
  }
  .h3_main_p {
    font-size: 6vw;
    margin: 3% auto;
    z-index: -1;
  }
  .h3_main_p::before {
    width: 50%;
    z-index: -1;
  }
  .h3_sub_p {
    font-size: 4.4vw;
  }
  .magazine_index_box_div .magazine_images_p {
    flex-basis: 100%;
    margin: 0 0 5% 0;
  }
  .magazine_images_p img {
    width: 90%;
  }
  .index_div {
    flex-basis: 100%;
  }
  .index_h4 {
    font-size: 8vw;
  }
  .index_div ol {
    padding: 0 0 0 5%;
    flex-direction: column;
    flex-wrap: nowrap;
  }
  .index_div li {
    font-size: 5vw;
    font-weight: 600;
    line-height: 1.5;
  }
  .index_div li a {
    text-decoration: none;
    color: #000;
    font-size: 5vw;
  }
}
/*-----------------------------------
     各index別コンテンツ
-----------------------------------*/
/*---- 基本共通 --*/
.category_content_section {
  width: 80%;
  margin: 0 auto;
  padding: 0;
}
.pink_tittle_div {
  background-color: #f6e2ea; /*薄いピンク*/
  width: 100%;
  margin: 0 auto;
  padding: 0 1em 1em 1em;
}
.ttl_note_h2 {
  width: 100%;
  margin: 0 auto;
  padding: 0.5em 1em;
  font-weight: 600;
  font-size: 1.8vw;
}
.sub_catch_h3 {
  font-size: 1.6vw;
  font-weight: 100;
  background-color: #000;
  color: #fff;
  padding: 0.3em 1em;
  display: inline-block;
  position: relative;
  top: -10px;
  left: 3%;
}
.content_div {
  width: 90%;
  margin: 5% auto;
}
@media screen and (max-width:767.98px) { /* 変更点。0.02引く。 */
  .category_content_section {
    width: 90%;
    margin: 0 auto;
    padding: 0;
  }
  .pink_tittle_div {
    width: 100%;
    margin: 10% auto 1%;
    padding: 0 0.5em 1em 0.5em;
  }
  .ttl_note_h2 {
    width: 100%;
    margin: 0 auto;
    padding: 0.3em 0.5em;
    font-size: 5vw;
    line-height: 1.2;
  }
  .content_div {
    width: 90%;
    margin: 3% auto;
  }
  .sub_catch_h3 {
    font-size: 4vw;
    top: -10px;
    left: 5%;
    width: 90%;
  }
}
/*------------------------------------------------
 カラーズ通信 No.1
 インストラクターの養成とプログラム開発＆提供機関 
      ＜Wellness Colours Academy＞とは？
-----------------------------------------------*/
.concept_div {
  width: 100%;
  margin: 3% auto;
  border: 1px solid #000;
}
.concept_div h4 {
  text-align: center;
  font-size: 2vw;
  margin: 3% auto 0 auto;
  font-weight: 400;
}
.span_en {
  color: #F431CC;
  font-size: 1.4vw;
}
.concept_div_ul {
  width: 90%;
  margin: 0 auto;
  padding: 3%;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
}
.concept_div_li_left {
  flex-basis: 62.5%;
  margin: 0 5% 0 0;
}
.concept_div_li_right {
  flex-basis: 32.5%;
  margin: 0;
}
.concept_div_li_left_p {
  line-height: 2;
  font-size: 1.3vw;
}
.equation_p {
  text-align: center;
  border-top: 1px solid #000;
  border-bottom: 1px solid #000;
  margin: 5% auto;
  font-size: 1.6vw;
  padding: 1vw 0;
}
.sub_div {
  width: 100%;
  margin: 3% auto;
}
.provided_program_ul {
  width: 100%;
  margin: 5% auto;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
}
.provided_program_li {
  flex-basis: 28%;
  margin: 0 auto;
}
.h6_dt {
  text-align: center;
  display: block;
  border-bottom: 3px solid #ccc;
  margin: 0 auto 3% auto;
  font-size: 1.3vw;
  line-height: 1.5;
}
.provided_program_li_text {
  flex-basis: 38%;
  margin: 0 auto;
}
.program_dd {
  margin: 1% 0;
  font-size: 1.1vw;
}
@media screen and (max-width:767.98px) { /* 変更点。0.02引く。 */
  .concept_div {
    width: 100%;
  }
  .concept_div h4 {
    font-size: 5vw;
  }
  .span_en {
    font-size: 4vw;
    line-height: 0.8;
  }
  .concept_div_ul {
    width: 100%;
    flex-direction: column;
  }
  .concept_div_li_left {
    flex-basis: 100%;
    margin: 0 auto;
  }
  .concept_div_li_left_p {
    font-size: 4vw;
  }
  .concept_div_li_right {
    flex-basis: 100%;
    margin: 0 15%;
  }
  .equation_p {
    margin: 5% 0;
    font-size: 4vw;
  }
  .provided_program_ul {
    flex-direction: row;
    flex-wrap: wrap-reverse;
  }
  .provided_program_li {
    flex-basis: 48%;
    margin: 5% auto;
  }
  .provided_program_li_text {
    flex-basis: 100%;
  }
  .h6_dt {
    font-size: 5vw;
  }
  .program_dd {
    font-size: 4.3vw;
  }
}
/*-------------------------------------------------
 自分の可能性を広げよう!　養成スクールスケジュール
--------------------------------------------------*/
.course_name_h6 {
  text-align: left;
  font-size: 2vw;
  margin: 2% auto;
  border-bottom: 1px solid #000;
  border-left: 8px solid #000;
  line-height: 1.5;
}
.target_type_span {
  background: linear-gradient(transparent 70%, #ffff00 70%); /*黄色*/
  display: inline-block;
  padding: 0 0.5em;
  font-size: 1.2vw;
  margin: 0 0 1% 1%;
}
table {
  border-collapse: collapse;
  width: 100%;
}
.tb01 tr {
  border: 10px solid #fff;
  margin: 1% 0;
  background-color: #fff;
}
.tb01 th {
  padding: 1vw;
  border: none;
  box-sizing: border-box;
  text-align: center;
  background: #999;
  color: #fff;
  font-size: 1.2vw;
  font-weight: 100;
  width: 15%;
}
.tb01 td {
  padding: 1vw;
  border: none;
  box-sizing: border-box;
  font-size: 1.6vw;
  font-weight: 100;
  width: 85%;
  line-height: 1.5;
}
.deadline_dl {
  width: 40%;
  margin: 1% 0 1% auto;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  padding: 0;
  border: 2px solid #C00;
}
.deadline_dt {
  flex-basis: 30%;
  color: #fff;
  background-color: #C00;
  padding: 3%;
  text-align: center;
  font-size: 1.6vw;
}
.deadline_dd {
  flex-basis: 70%;
  padding: 3%;
  text-align: center;
  font-size: 1.6vw;
}
.inquiry_div {
  width: 100%;
  margin: 5% auto;
  padding: 2%;
  background-color: #FFC;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
}
.inquiry_p {
  flex-basis: 50%;
  color: #000;
  font-weight: 600;
  font-size: 1.2vw;
}
.inquiry_p::after {
  font-family: 'Font Awesome 5 Free';
  font-weight: bold;
  content: '\f054';
  font-size: 1.4vw;
  color: #000;
  /*position: absolute;
    width: 25px;
    height: 25px;
    top: -5px;
    bottom: 0;
    right: 0;
    left: 0;*/
  margin: 0 auto;
  text-align: center;
  padding: 0 0 0 3%;
}
.inquiry_a {
  flex-basis: 30%;
  font-size: 1.7vw;
  text-decoration: none;
  color: #000;
}
.inquiry_a::before {
  font-family: 'Font Awesome 5 Free';
  font-weight: normal;
  content: '\f0e0';
  font-size: 2vw;
  color: #000;
  /*position: absolute;
    width: 25px;
    height: 25px;
    top: -5px;
    bottom: 0;
    right: 0;
    left: 0;*/
  margin: 0 auto;
  text-align: center;
  padding: 0 5% 0 3%;
}
.training_course_info_p {
  font-size: 1.1vw;
  color: #000;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 300;
  display: block;
  padding: 0.5vw 2vw;
}
.training_course_teacher_link {
  text-decoration: none;
  margin: 1vw 0 0 0;
  padding: 0.5em 2em;
  background-color: #F068A8;
  color: #fff;
  display: inline-block;
}
.training_course_teacher_link:hover {
  opacity: 0.7;
}
.contact_a_link { /*coloursお問い合わせフォームリンクボタン*/
  color: #fff;
  background-color: #1a3d48;
  display: inline-block;
  margin: 2% auto;
  padding: 0.1em 0.5em;
}
.contact_a_link:hover {
  opacity: 0.7;
}
@media screen and (max-width:767.98px) { /* 変更点。0.02引く。 */
  .course_name_h6 {
    border-bottom: 1px solid #000;
    border-left: 5px solid #000;
    text-align: left;
    font-size: 5.2vw;
    padding: 0 0 2% 3%;
    line-height: 1.2;
  }
  .target_type_span {
    font-size: 4vw;
  }
  .tb01 {
    width: 100%;
  }
  table.tb01 th {
    display: block;
    width: 100%;
    border-bottom: none;
    font-size: 4vw;
    padding: 0.3em 1vw;
  }
  table.tb01 td {
    display: block;
    width: 100%;
    border-bottom: none;
    font-size: 5vw;
  }
  .tb01 tr:last-child {}
  .deadline_dl {
    width: 100%;
    margin: 0 auto;
    flex-direction: column;
  }
  .deadline_dt {
    flex-basis: 100%;
    font-size: 4.2vw;
    padding: 1%;
  }
  .deadline_dd {
    flex-basis: 100%;
    font-size: 5vw;
    padding: 1%;
  }
  .inquiry_div {
    width: 90%;
    flex-direction: column;
    margin: 5% auto;
    padding: 0;
  }
  .inquiry_p {
    flex-basis: 100%;
    margin: 0;
    padding: 5% 0 0 0;
    font-size: 4.2vw;
    line-height: 1;
    text-align: center;
  }
  .inquiry_p::after {
    font-family: 'Font Awesome 5 Free';
    font-weight: bold;
    content: '\f107';
    font-size: 8vw;
    color: #000;
    /*position: relative;*/
    margin: 0 auto;
    text-align: center;
    padding: 0 0 0 3%; /*z-index: -1;*/
  }
  .inquiry_a {
    flex-basis: 100%;
    font-size: 5vw;
    width: 100%;
    margin: 0;
    padding: 0 0 5% 0;
    text-align: center;
    font-weight: bold;
  }
  .inquiry_a::before {
    font-size: 6vw;
    padding: 0 3% 0 0;
  }
  .training_course_info_p {
    font-size: 3.7vw;
    padding: 2%;
  }
  .training_course_teacher_link {
    margin: 2% auto;
    padding: 0.5em 2em;
    width: 100%;
    text-align: center;
  }
}
/*--------------------------------------------------------------
 カラーズ通信 No.1
  インストラクターとしての豆知識
  好かれるインストラクター・嫌われるインストラクター特徴と比較
---------------------------------------------------------------*/
.comparison_ul {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: stretch;
  align-content: stretch;
}
.comparison_ok_li {
  flex-basis: 45%;
  margin: 1% auto;
}
.comparison_ng_li {
  flex-basis: 45%;
  margin: 1% auto;
}
.comparison_div {
  width: 100%;
  margin: 1% auto;
}
.ok_h6 {
  width: 100%;
  margin: 1% auto;
  text-align: center;
  font-size: 2.4vw;
  font-weight: 600;
  color: #099;
}
.ok_h6::before {
  font-family: 'Font Awesome 5 Free';
  font-weight: bold;
  content: '\f111';
  font-size: 2.8vw;
  color: #099;
  position: relative;
  margin: 0 auto;
  padding: 0 3% 0 0;
}
.ng_h6 {
  width: 100%;
  margin: 1% auto;
  text-align: center;
  font-size: 2.4vw;
  font-weight: 600;
  color: #C36;
}
.ng_h6::before {
  font-family: 'Font Awesome 5 Free';
  font-weight: bold;
  content: '\f00d';
  font-size: 3vw;
  color: #C36;
  position: relative;
  margin: 0 auto;
  padding: 0 3% 0 0;
}
.ok_catch {
  background-color: #099;
  color: #fff;
  padding: 0 2%;
}
.ng_catch {
  background-color: #C36;
  color: #fff;
  padding: 0 2%;
}
.comparison_p {
  font-size: 1.1vw;
  padding: 2%;
}
.comparison_point_div {
  width: 90%;
  margin: 5% auto;
  border: 2px solid #ede8e4;
  padding: 3%;
}
.comparison_point_p {
  font-size: 1.4vw;
  color: #000;
  font-weight: 600;
  line-height: 2;
}
.marker {
  background: linear-gradient(transparent 50%, #FF3 50%);
}
@media screen and (max-width:767.98px) { /* 変更点。0.02引く。 */
  .content_div {
    width: 95%;
    margin: 3% auto;
  }
  .comparison_ok_li {
    flex-basis: 100%;
    margin: 1% auto;
  }
  .ok_h6 {
    font-size: 8vw;
  }
  .ok_h6::before {
    font-size: 8vw;
    z-index: -1;
  }
  .ok_catch {
    font-size: 4.2vw;
  }
  .comparison_ng_li {
    flex-basis: 100%;
    margin: 1% auto;
  }
  .ng_h6 {
    font-size: 8vw;
  }
  .ng_h6::before {
    font-size: 8vw;
    z-index: -1;
  }
  .ng_catch {
    font-size: 4.2vw;
  }
  .comparison_p {
    font-size: 3.8vw;
    padding: 2%;
  }
  .comparison_point_p {
    font-size: 4.6vw;
  }
}
/*------------------------
 カラーズ通信 No.2
 インストラクターインタビュー 
-------------------------*/
.interview_ul {
  width: 70%;
  margin: 0 auto 5% auto;
  padding: 0;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: stretch;
}
.interview_li_left {
  flex-basis: 30%;
}
.interview_li_left img {
  width: 100%;
  margin: 0;
  padding: 0;
}
.interview_li_right {
  flex-basis: 70%;
  padding: 0 5%;
  font-size: 1.2vw;
}
.name_romaji_text {
  font-size: 2vw;
  color: #F39;
}
.chinese_characters_text {
  font-size: 3vw;
  font-weight: 600;
}
/*---- インタビュータブ ----*/
.cp_qa *, .cp_qa *:after, .cp_qa *:before {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.cp_qa .cp_actab {
  position: relative;
  overflow: hidden;
  width: 100%;
  margin: 0 0 1em 0;
  color: #1b2538;
}
.cp_qa .cp_actab input {
  position: absolute;
  opacity: 0;
}
/* 質問 */
.cp_qa .cp_actab label {
  line-height: 1;
  position: relative;
  display: block;
  margin: 0 0 0 0;
  padding: 1em 2em 1em 2.5em;
  cursor: pointer;
  text-indent: 1vw;
  border-radius: 0.5em;
  background: #FFC;
  font-size: 1.6vw;
  font-weight: 600;
}
.cp_qa .cp_actab label::before {
  font-size: 2vw;
  margin-left: -2vw;
  padding-right: 0.5em;
  content: 'Q';
  color: #999;
  font-weight: 200;
}
.cp_qa .cp_actab label:hover {
  transition: all 0.3s;
  color: #666;
}
/* --質問の＋アイコン */
.cp_qa .cp_actab label::after {
  font-size: 1.7em;
  font-weight: bold;
  line-height: 2em;
  position: absolute;
  top: 0;
  right: 0;
  content: '\2b';
  display: inline-block;
  width: 2em;
  height: 2em;
  -webkit-transition: transform 0.4s;
  transition: transform 0.4s;
}
/* 答え */
.cp_qa .cp_actab .cp_actab-content {
  position: relative;
  overflow: hidden;
  max-height: 0;
  padding: 0 0 0 2.5em;
  -webkit-transition: max-height 0.2s;
  transition: max-height 0.2s;
  border-radius: 0 0 0.5em 0.5em;
}
.cp_qa .cp_actab .cp_actab-content::before {
  font-size: 2vw;
  position: absolute;
  margin: 0;
  padding: 0;
  content: 'A';
  font-weight: 200;
  color: #FF7633;
}
.cp_qa .cp_actab .cp_actab-content p {
  margin: 2.4vw 2% 2% 0;
  font-size: 1.6vw;
  color: #000;
  font-weight: 400;
}
/* 質問を開いた時の仕様 */
/* --答えの高さ */
.cp_qa .cp_actab input:checked ~ .cp_actab-content {
  max-height: 100%;
  border: 10px solid #FFC;
  background-color: #FFC;
}
/* 質問をクリックした時のアイコンの動き */
.cp_qa .cp_actab input:checked ~ label {
  color: #666;
  border-radius: 0.5em 0.5em 0 0;
}
/* 質問をクリックした時の+の動き */
.cp_qa .cp_actab input[type=checkbox]:checked + label::after {
  -webkit-transform: rotateZ(45deg);
  transform: rotateZ(45deg);
  -webkit-transform-origin: 50% 50%;
  transform-origin: 50% 50%;
}
.interview_sub_div {
  width: 100%;
  margin: 5% auto;
}
.schedule_div {
  width: 100%;
  margin: 0 auto;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
}
.time_schedule { /*写真を横に入れる場合*/
  flex-basis: 45%;
  text-align: center;
  border: 2px solid #000;
  margin: 3% auto 0 auto;
}
.schedule_div img {
  flex-basis: 50%;
  margin: 0 auto;
}
.time_schedule_one { /*写真を横に入れない場合*/
  flex-basis: 60%;
  text-align: center;
  border: 2px solid #000;
  margin: 3% auto 0 auto;
}
.time_schedule_tittle {
  background-color: #000;
  color: #fff;
  display: inline-block;
  margin: 0 auto;
  padding: 0 0.5em;
  position: relative;
  top: -15px;
  font-size: 1.3vw;
}
.time_schedule dl {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  margin: 0 auto 5% auto;
}
.time_schedule dt {
  flex-basis: 30%;
  font-size: 1.4vw;
  text-align: right;
}
.time_schedule dd {
  margin: 0 0 0 3%;
  flex-basis: 60%;
  font-size: 1.3vw;
  text-align: left;
}
.appeal_ul { /*No3田島さんより追加*/
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  margin: 5% auto;
}
.appeal_li {
  flex-basis: 49%;
  margin: 0 auto;
}
@media screen and (max-width:767.98px) { /* 変更点。0.02引く。 */
  .interview_ul {
    width: 90%;
    margin: 0 auto 5% auto;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
  }
  .interview_li_left {
    flex-basis: 100%;
  }
  .interview_li_right {
    flex-basis: 100%;
    padding: 5%;
    font-size: 4vw;
  }
  .name_romaji_text {
    font-size: 3.8vw;
  }
  .chinese_characters_text {
    font-size: 6vw;
  }
  /*タブ　質問*/
  .cp_qa .cp_actab label {
    line-height: 1.5;
    font-size: 4.2vw;
    padding: 2vw 10vw 2vw 4vw;
  }
  .cp_qa .cp_actab label::before {
    font-size: 4vw;
  }
  .cp_qa .cp_actab label::after {
    line-height: 1.5;
    width: 1.5em;
    height: 1.5em;
  }
  .cp_qa .cp_actab .cp_actab-content::before {
    font-size: 4vw;
  }
  .cp_qa .cp_actab .cp_actab-content {
    padding: 0 0 0 3vw;
  }
  .cp_qa .cp_actab .cp_actab-content p {
    margin: 5vw 2% 5% 1vw;
    font-size: 3.4vw;
    line-height: 1.8;
  } /*タブここまで*/
  .interview_sub_div {
    width: 90%;
    margin: 5% auto;
  }
  .time_schedule {
    flex-basis: 100%;
    margin: 5% auto;
  }
  .schedule_div img {
    flex-basis: 100%;
    margin: 0 auto;
  }
  .time_schedule_tittle {
    font-size: 4.4vw;
    line-height: 0.6;
    padding: 5%;
  }
  .time_schedule dt {
    flex-basis: 30%;
    font-size: 4.4vw;
  }
  .time_schedule dd {
    margin: 0 0 0 3%;
    flex-basis: 60%;
    font-size: 4.4vw;
  }
}
/*--------------------------------------
 カラーズ通信 No.2
 インストラクターとしての豆知識
 好かれるインストラクター
 コミュニケーションスキルをもっている人
----------------------------------------*/
.communication_p {
  font-size: 1.2vw;
  color: #000;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 300;
}
.what_communication_div {
  width: 85%;
  margin: 5% auto;
  padding: 0.2em 0.5em;
  background: #d6ebff;
  box-shadow: 0px 0px 0px 10px #d6ebff;
  border: dashed 2px white;
  text-align: center;
}
.what_communication_inner_div {
  width: 100%;
  margin: 2% auto 5% auto;
  text-align: center;
}
.what_communication_div_h6 {
  margin: 2% auto;
  font-size: 2vw;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 600;
  display: inline-block;
  padding: 0 0 0 2%;
  background: linear-gradient(transparent 85%, #FF3 85%);
}
.what_big {
  font-size: 3vw;
  color: #2385ED;
}
.what_communication_p {
  font-size: 1.4vw;
  color: #000;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 300;
  padding: 0;
}
.what_communication_inner_div ul {
  width: 70%;
  margin: 1% auto;
  text-align: left;
  font-size: 1.5vw;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 600;
  line-height: 2;
}
.what_communication_inner_div li {
  margin: 0;
  display: inline-block;
  background: linear-gradient(transparent 70%, #FF3 70%);
}
.skill_div {
  width: 100%;
  margin: 0 auto;
  padding: 2%;
}
.skill_h6 {
  font-size: 1.6vw;
  border-bottom: 1px solid #000;
}
.skill_h6::first-letter {
  font-size: 2vw;
  color: #2385ED;
  padding: 0 2% 0 0;
}
.skill_p {
  font-size: 1.2vw;
  color: #000;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 300;
  padding: 0 4%;
  line-height: 1.5;
}
.skill_div ul {
  width: 90%;
  margin: 0 auto;
  padding: 1%;
  font-size: 1.2vw;
  line-height: 1.8;
}
.skill_div li {}
.setsumei_span {
  padding-left: 1.2vw;
  text-indent: -1.2vw;
  font-size: 1.2vw;
  margin: 0 auto;
}
.skill_point_div {
  width: 90%;
  margin: 2% auto;
  padding: 1% 2% 2% 2%;
  border: 4px dotted #F93;
}
.skill_point_div_h6 {
  font-size: 1.4vw;
  color: #ED7A06;
}
.skill_point_div_p {
  font-size: 1.2vw;
  color: #000;
  font-weight: 300;
}
@media screen and (max-width:767.98px) { /* 変更点。0.02引く。 */
  .communication_p {
    font-size: 3.7vw;
    padding: 2%;
  }
  .what_communication_div {
    width: 95%;
    box-shadow: 0px 0px 0px 5px #d6ebff;
  }
  .what_communication_div_h6 {
    font-size: 6vw;
    line-height: 0.7;
    background: none;
    margin: 8% auto;
  }
  .what_big {
    font-size: 8vw;
  }
  .what_communication_inner_div {
    width: 100%;
    margin: 2% auto 5% auto;
    text-align: left;
  }
  .what_communication_p {
    font-size: 4vw;
  }
  .what_communication_inner_div ul {
    width: 100%;
    font-size: 5vw;
  }
  .what_communication_inner_div li {
    padding-left: 4.6vw;
    text-indent: -4.6vw;
    background: none;
    font-size: 4.6vw;
    color: #F39;
  }
  .skill_h6 {
    font-size: 4.8vw;
  }
  .skill_h6::first-letter {
    font-size: 6vw;
  }
  .skill_p {
    font-size: 4vw;
    padding: 0 2%;
  }
  .skill_div ul {
    width: 100%;
    font-size: 4vw;
  }
  .setsumei_span {
    padding-left: 0;
    text-indent: 0;
    font-size: 4vw;
    margin: 0 auto;
  }
  .skill_point_div {
    width: 100%;
    margin: 5% auto;
  }
  .skill_point_div_h6 {
    font-size: 4.6vw;
  }
  .skill_point_div_p {
    font-size: 4vw;
  }
}
/*-----------------------------
カラーズ通信 No.3
 インストラクターとしての豆知識
 ホスピタリティとは？
------------------------------*/
.hospitality_ul {
  width: 90%;
  margin: 1% auto;
  padding: 0;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  text-align: left;
  line-height: 1.5;
}
.hospitality_li {
  padding-left: 1.3vw;
  text-indent: -1.3vw;
  font-size: 1.3vw;
  flex-basis: 100%;
}
.first_step_service_div {
  width: 85%;
  margin: 0 auto;
  padding: 0;
}
.first_step_service_h6 {
  font-size: 1.6vw;
  margin: 2% auto;
}
.first_step_service_p {
  font-size: 1.2vw;
  color: #000;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 300;
  margin: 0 auto 3% auto;
}
.first_step_service_ul {
  width: 75%;
  margin: 1% auto;
  padding: 0;
}
.first_step_service_li {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  text-align: left;
  align-items: center;
  margin: 3% auto;
}
.first_number {
  font-size: 6vw;
  color: #fc5940;
  font-weight: 600;
  flex-basis: 10%;
  display: block;
  line-height: 1;
}
.first_step_service_li_p {
  flex-basis: 90%;
  display: block;
  padding: 0 2%;
  font-size: 1.2vw;
  color: #000;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 300;
}
@media screen and (max-width:767.98px) { /* 変更点。0.02引く。 */
  .hospitality_ul {
    width: 100%;
  }
  .hospitality_li {
    padding-left: 4.2vw;
    text-indent: -4.2vw;
    font-size: 4.2vw;
    flex-basis: 100%;
  }
  .first_step_service_div {
    width: 95%;
    margin: 0 auto;
    padding: 0;
  }
  .first_step_service_ul {
    width: 100%;
    margin: 1% auto;
    padding: 0;
  }
  .first_number {
    font-size: 15vw;
  }
  .first_step_service_li_p {
    font-size: 3.7vw;
    padding: 2%;
  }
  .first_step_service_h6 {
    font-size: 5vw;
    line-height: 1.5;
  }
  .first_step_service_p {
    font-size: 3.7vw;
    padding: 2%;
  }
}
/*--------------------------------------
カラーズ通信 No.4
 適切なフィードバックと
 相手が前向きに捉えられるアドバイスの仕方
---------------------------------------*/
.tittle_img_vol05 {
  width: 70%;
  margin: 0 auto;
  padding: 0;
  display: block;
}
.q_a_box_div {
  width: 90%;
  margin: 0 auto;
  padding: 0;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
}
.left_people {
  flex-basis: 15%;
}
.right_people {
  flex-basis: 15%;
}
.q_a_box_div dl {
  flex-basis: 80%;
  margin: 0 auto;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
}
.q_a_box_div dt {
  flex-basis: 15%;
}
.q_a_box_div dd {
  flex-basis: 85%;
  font-size: 1.8vw;
  line-height: 1.5;
  font-weight: 600;
  padding: 0 0 0 2%;
}
/*--- フードバックポイント ---*/
.feedback_point_div {}
.feedback_point_h5 {
  text-align: center;
  font-size: 2vw;
  color: #e9625b; /*サーモン*/
}
.point_h5_span {
  font-size: 3.5vw;
  font-weight: 600;
  color: #e9625b; /*サーモン*/
  background: linear-gradient(transparent 70%, #FF3 70%);
}
.feedback_dl {
  margin: 1% auto;
}
.feedback_dt {
  margin: 1% 0;
  font-size: 1.6vw;
  padding: 0 0 0 1%;
  line-height: 1.5;
}
.color_yellow {
  background-color: #FCF2BE;
}
.color_pink {
  background-color: #F7D4E3;
}
.color_green {
  background-color: #CDF5B2;
}
.color_orange {
  background-color: #F5CAAA;
}
.color_blue {
  background-color: #B7E6FD;
}
.feedback_dd {
  margin: 1% 0 3% 3%;
  font-size: 1.3vw;
}
@media screen and (max-width:767.98px) { /* 変更点。0.02引く。 */
  .tittle_img_vol05 {
    width: 100%;
    margin: 0 auto;
    padding: 0;
  }
  .left_people {
    flex-basis: 25%;
  }
  .right_people {
    flex-basis: 25%;
  }
  .q_a_box_div {
    width: 95%;
    margin: 0 auto;
    padding: 0;
  }
  .q_a_box_div dl {
    flex-basis: 75%;
    margin: 0 auto;
  }
  .q_a_box_div dt {
    flex-basis: 20%;
  }
  .q_a_box_div dd {
    flex-basis: 80%;
    font-size: 4.5vw;
  }
  /*--- フードバックポイント ---*/
  .feedback_point_div {}
  .feedback_point_h5 {
    font-size: 5vw;
  }
  .point_h5_span {
    font-size: 7vw;
  }
  .feedback_dt {
    margin: 3% 0;
    font-size: 4.6vw;
    padding: 0 0 0 3%;
  }
  .feedback_dd {
    margin: 1% 5% 10% 5%;
    font-size: 4.2vw;
  }
}
/*------------------------------------------------
 カラーズ通信 No.5
 インストラクターとしての豆知識
Vivo＆Bearsiフィットネスプログラムには何がありますか？
------------------------------------------------*/
.fitness_program_div {
  width: 100%;
  margin: 0 auto;
  padding: 0;
}
.fitness_program_h6 {
  font-size: 2vw;
  margin: 2% auto;
  padding: 0 0.5em;
  color: #fff;
}
.popular_program_tittle01 {
  background-color: #F0CD41;
}
.popular_program_tittle02 {
  background-color: #6CBF6C;
}
.popular_program_tittle03 {
  background-color: #6993BD;
}
.popular_program_tittle04 {
  background-color: #E89B75;
}
.popular_program_tittle05 {
  background-color: #52AEAE;
}
.popular_program_tittle06 {
  background-color: #EC90BE;
}
.popular_program_tittle07 {
  background-color: #E36E62;
}
.fitness_program_h6::first-letter {
  font-size: 3vw;
}
.fitness_program_ul {
  width: 100%;
  margin: 0 auto;
  padding: 0 3vw;
}
.fitness_program_li {
  margin: 2% auto;
}
.popular_program_name_p {
  font-size: 1.6vw;
  color: black;
  font-weight: 600;
}
.popular_program_explanation {
  padding: 0 0 0 1.3vw;
}
.summary_div {
  border-top: dotted;
  width: 100%;
  margin: 5% auto;
  padding: 3% 5%;
}
.summary_div_img {
  width: 100%;
  margin: 3% auto;
  padding: 0;
}
@media screen and (max-width:767.98px) { /* 変更点。0.02引く。 */
  .fitness_program_h6 {
    font-size: 5vw;
  }
  .fitness_program_h6::first-letter {
    font-size: 8vw;
  }
  .popular_program_name_p {
    font-size: 4.2vw;
  }
  .popular_program_explanation {
    padding: 0 0 0 4.2vw;
  }
  .summary_div {
    margin: 8% auto;
    padding: 5%;
  }
  .summary_div_img {
    margin: 8% auto;
    padding: 0;
  }
}
/*------------------------------------------------
 カラーズ通信 No.6
 インストラクターとしての豆知識　熱中症について
------------------------------------------------*/
.heatstroke_tittle_ul {
  width: 90%;
  margin: 1% auto;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: flex-end;
}
.heatstroke_tittle_li01 {
  flex-basis: 15%;
  order: 1;
}
.heatstroke_tittle_li02 {
  flex-basis: 70%;
  text-align: center;
  order: 2;
  padding: 0 1% 3% 1%;
}
.heatstroke_tittle_h5 {
  font-size: 2vw;
  font-weight: 600;
  line-height: 2;
}
.heatstroke_tittle_h6 {
  font-size: 1.6vw;
  font-weight: 400;
  background-color: #FFC;
}
.heatstroke_tittle_li03 {
  flex-basis: 15%;
  order: 3;
}
.conditions_div {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: stretch;
  width: 70%;
  margin: 0 auto 2% auto;
  line-height: 1.5;
}
.conditions_ul {
  flex-basis: 50%;
}
.conditions_li {
  font-size: 1.4vw;
  font-weight: 400;
}
.heatstroke_p {
  font-size: 1.2vw;
  font-weight: 100;
}
.red_word {
  text-align: center;
  font-weight: 600;
  color: red;
  font-size: 1.4vw;
}
/*-- 応急処置でたいせつな3つのポイント --*/
.first_aid_div {
  margin: 8% auto;
  border: 5px solid #b3dcf5;
  padding: 3% 0;
}
.first_aid_h6 {
  text-align: center;
  font-weight: 600;
  font-size: 2vw;
  color: #0f80c4;
  margin: 0 auto 3% auto;
}
.first_aid_point_div {
  width: 90%;
  margin: 0 auto;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: center;
}
.first_aid_point_img {
  flex-basis: 30%;
}
.point_img_left { /*左にイラスト*/
  order: 1;
}
.point_img_right { /*右にイラスト*/
  order: 2;
}
.point_instructions_div {
  flex-basis: 70%;
  padding: 0 0 0 5%;
}
.first_aid_point_p {
  font-size: 1.2vw;
  padding: 0.5em;
}
.point_heading {
  font-size: 1.6vw;
  font-weight: 400;
  border-left: 8px solid #0f80c4;
  border-bottom: 2px solid #999;
  padding: 0 0.5em;
}
.explanation_left { /*pcでは左に文字spでは下に文字*/
  order: 1;
}
.explanation_right { /*pcでは右に文字spでは下に文字*/
  order: 2;
}
.first_aid_p {
  text-align: center;
  color: #0f80c4;
  font-size: 1.4vw;
}
/*-- 熱中症にならないためには!? --*/
.prevention_div {}
.prevention_h5 {
  text-align: center;
  font-weight: 600;
  font-size: 2vw;
}
.prevention_h6 {
  font-size: 1.6vw;
  font-weight: 400;
  background-color: #FFC;
  text-align: center;
  display: block;
  margin: 1% auto;
}
.prevention_p {
  font-size: 1.2vw;
  font-weight: 100;
}
.prevention_ul {}
.prevention_li {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: stretch;
  margin: 4% auto;
}
.heading_sentence_p {
  flex-basis: 35%;
  display: block;
  font-size: 1.8vw;
  font-weight: 600;
  background-color: #f8e5c3;
  color: orange;
}
.prevention_content_p {
  flex-basis: 65%;
  display: block;
  padding: 0 1em;
  font-size: 1.2vw;
}
@media screen and (max-width:767.98px) { /* 変更点。0.02引く。 */
  .heatstroke_tittle_ul {
    width: 100%;
    margin: 1% auto;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: flex-end;
  }
  .heatstroke_tittle_li01 {
    flex-basis: 48%;
    order: 1;
  }
  .heatstroke_tittle_li02 {
    flex-basis: 100%;
    order: 3;
  }
  .heatstroke_tittle_li03 {
    flex-basis: 52%;
    order: 2;
  }
  .heatstroke_tittle_h5 {
    font-size: 5.2vw;
  }
  .heatstroke_tittle_h6 {
    font-size: 5vw;
  }
  .conditions_div {
    width: 90%;
    margin: 0 auto 5% auto;
    flex-wrap: wrap;
  }
  .conditions_ul {
    flex-basis: 100%;
  }
  .conditions_li {
    font-size: 5vw;
    font-weight: 400;
  }
  .heatstroke_p {
    font-size: 4vw;
    font-weight: 100;
    width: 95%;
    margin: 0 auto;
  }
  .red_word {
    text-align: left;
    font-weight: 600;
    color: red;
    font-size: 4.6vw;
    margin: 0 3%;
  }
  /*-- 応急処置でたいせつな3つのポイント --*/
  .first_aid_div {
    width: 100%;
    margin: 8% auto;
    border: 5px solid #b3dcf5;
    padding: 3% 0;
  }
  .first_aid_point_div {
    width: 100%;
    margin: 0 auto;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
  }
  .first_aid_h6 {
    font-size: 7vw;
    margin: 0 auto 5% auto;
  }
  .point_instructions_div {
    flex-basis: 95%;
    padding: 0;
    margin: 0 auto;
  }
  .point_heading {
    font-size: 5.5vw;
    font-weight: 400;
    border-left: none;
    border-bottom: none;
    padding: 0 0.5em;
    color: #0f80c4;
  }
  .first_aid_point_p {
    font-size: 4.2vw;
    padding: 0.5em 0.5em 2em 1em;
  }
  .first_aid_point_img {
    flex-basis: 80%;
    margin: 0 auto;
  }
  .point_img_left { /*pcでは左にイラストspでは上にイラスト*/
    order: 1;
  }
  .point_img_right { /*pcでは右にイラストspでは上にイラスト*/
    order: 1;
  }
  .explanation_left { /*pcでは左に文字spでは下に文字*/
    order: 2;
  }
  .explanation_right { /*pcでは右に文字spでは下に文字*/
    order: 2;
  }
  .first_aid_p {
    text-align: left;
    margin: 0 3%;
    font-size: 4.6vw;
  }
  /*-- 熱中症にならないためには!? --*/
  .prevention_h5 {
    font-size: 5.2vw;
  }
  .prevention_h6 {
    font-size: 5vw;
    padding: 0 0.5em;
    text-align: left;
    line-height: 1.3;
  }
  .prevention_p {
    font-size: 4vw;
    margin: 3%;
  }
  .prevention_ul {}
  .prevention_li {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: stretch;
    margin: 4% auto;
  }
  .heading_sentence_p {
    flex-basis: 100%;
    font-size: 5vw;
  }
  .prevention_content_p {
    flex-basis: 100%;
    font-size: 4vw;
    padding: 2% 3%;
  }
}
/*------------------------------------------------
 カラーズ通信 No.7
------------------------------------------------*/
.favorite_things_div { /*イントラ紹介　好きなもの */
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
}
.ranking_title_p {
  flex-basis: 100%;
  font-size: 1.4vw;
}
.ranking_ul {
  flex-basis: 40%;
  margin: 3% 0;
  padding: 0;
}
.ranking_li {
  font-size: 1.4vw;
  margin: 1% 0;
}
.ramen_illustration_img {
  flex-basis: 30%;
  margin: 0;
  padding: 0;
  display: block;
}
.ramen_illustration_img img {
  margin: -10% 0 0 0;
}
@media screen and (max-width:767.98px) { /* 変更点。0.02引く。 */
  .ranking_title_p {
    font-size: 4vw;
  }
  .ranking_ul {
    flex-basis: 60%;
    margin: 3% 0;
    padding: 0;
  }
  .ranking_li {
    font-size: 4vw;
    margin: 1% 0;
  }
  .ramen_illustration_img {
    flex-basis: 40%;
    margin: 0;
    padding: 0;
    display: block;
  }
  .ramen_illustration_img img {
    margin: 0;
  }
}
/*--------------------------
   カラーズ通信 No.8
   今からできる夏バテ対策
--------------------------*/
.natsubate_h6 {
  margin: 3% 0;
  background-color: #FF0;
  font-size: 1.8vw;
  color: #EB481F;
  padding: 0 0.5em;
  display: block;
  width: 100%;
}
.natsubate_p {
  margin: 0 3%;
}
.genin_div {
  width: 90%;
  margin: 3% auto;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
}
.genin_ul {
  flex-basis: 50%;
}
.genin_img {
  flex-basis: 40%;
}
.genin_li {
  font-weight: 600;
  font-size: 1.6vw;
  line-height: 1.5;
}
.ckeck_list_div {
  width: 80%;
  margin: 2% auto;
  border: 2px solid #EB481F;
}
.ckeck_list_title {
  display: block;
  width: 100%;
  text-align: center;
  background-color: #EB481F;
  color: #fff;
  font-size: 1.6vw;
  font-weight: 600;
}
.ckeck_list_ul {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
  padding: 3%;
}
.ckeck_list_li {
  flex-basis: 50%;
  font-size: 1.4vw;
  line-height: 1.5;
}
.natsubate_red_p {
  color: #C00;
  font-weight: 600;
  font-size: 1.6vw;
  display: block;
  margin: 2% auto;
  text-align: center;
}
.byouki_p {
  font-weight: 600;
  font-size: 2vw;
  margin: 1% 5%;
}
.marker_yellow {
  background: linear-gradient(transparent 50%, #ffff66 50%);
}
.taisaku_list_div {
  width: 90%;
  margin: 5% auto;
  border: 2px solid #1F8774;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
}
.taisaku_list_title {
  flex-basis: 100%;
  display: block;
  width: 100%;
  text-align: center;
  background-color: #1F8774;
  color: #fff;
  font-size: 1.6vw;
  font-weight: 600;
}
.taisaku_p {
  margin: 3%;
}
.taisaku_ul {
  flex-basis: 55%;
  padding: 0 0 2% 5%;
}
.taisaku_li {
  font-size: 1.4vw;
  line-height: 1.5;
}
.taisaku_img {
  flex-basis: 40%;
  margin: 0 0 2% 0;
}
@media screen and (max-width:767.98px) { /* 変更点。0.02引く。 */
  .natsubate_h6 {
    font-size: 6vw;
  }
  .natsubate_p {
    margin: 0 3%;
    font-size: 4vw;
  }
  .genin_div {
    width: 80%;
  }
  .genin_ul {
    flex-basis: 100%;
  }
  .genin_img {
    flex-basis: 100%;
    margin: 2%;
  }
  .genin_li {
    font-size: 5vw;
  }
  .ckeck_list_title {
    font-size: 5vw;
  }
  .ckeck_list_li {
    flex-basis: 100%;
    font-size: 4.3vw;
  }
  .natsubate_red_p {
    font-size: 5vw;
    text-align: left;
    margin: 2%;
  }
  .byouki_p {
    font-size: 5vw;
  }
  .taisaku_list_title {
    font-size: 5vw;
  }
  .taisaku_ul {
    flex-basis: 90%;
    margin: 0 auto;
  }
  .taisaku_li {
    font-size: 5vw;
  }
  .taisaku_img {
    flex-basis: 100%;
  }
  .taisaku_li::first-letter {
    margin: 0 0 0 -5vw;
  }
}
/*--------------------------
   カラーズ通信 No.9
   あなたは知っている？ 正しいデトックス方法
--------------------------*/
.lesson_img_nakao { /*イントラ中尾さん写真*/
  width: 40%;
  margin: 0 auto;
  display: block;
}
.detox_p {
  margin: 0 3%;
}
.detox_h6 {
  margin: 3% 0;
  background-color: #FF0;
  font-size: 1.8vw;
  color: #EB481F;
  padding: 0 0.5em;
  display: block;
  width: 100%;
}
.what_detox_div {
  width: 70%;
  margin: 0 auto 2% auto;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
}
.what_detox_left_p {
  flex-basis: 70%;
  display: block;
  font-size: 1.4vw;
  font-weight: 600;
}
.what_detox_right_img {
  flex-basis: 18%;
  display: block;
  margin: 0 3%;
}
.what_detox_right_img img {
  width: 100%;
  margin: 0;
  padding: 0;
}
.detox_kouka_p {}
.detox_kouka_div {
  width: 100%;
  margin: 0 auto;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  align-items: flex-start;
}
.detox_kouka_ul {
  flex-basis: 25%;
  margin: 2%;
}
.detox_kouka_li {
  font-size: 1.8vw;
  font-weight: 600;
  line-height: 1.5;
}
.detox_kouka_img {
  flex-basis: 20%;
}
.detox_method_div { /*デトックス方法*/
  padding: 2%;
  margin: 8% auto;
  border: 2px solid #F06;
}
.detox_method_h5 {
  text-align: center;
  background-color: #F06;
  color: #fff;
  display: block;
  font-size: 1.8vw;
  padding: 0 0.5em;
  margin: 0 auto;
}
.detox_method_h6 {
  color: #F06;
  font-size: 1.6vw;
  margin: 2% 2% 0 2%;
}
.detox_method_p {
  margin: 0 2%;
}
.recommendation_tittle {
  margin: 0 2%;
  font-size: 1.4vw;
  font-weight: 600;
}
.detox_recommendation_ul {
  margin: 0 2%;
}
.detox_recommendation_li {
  font-size: 1.4vw;
  font-weight: 600;
  line-height: 1.5;
}
.be_careful_ul {
  margin: 2% 4%;
}
.be_careful_li {
  font-size: 1.4vw;
  font-weight: 600;
  line-height: 1.5;
}
.detox_summary_p {
  text-align: center;
  font-size: 1.8vw;
  font-weight: 600;
  color: #F06;
}
.detox_summary_img {
  text-align: center;
  width: 60%;
  margin: 2% auto;
  padding: 0;
  display: block;
}
@media screen and (max-width:767.98px) { /* 変更点。0.02引く。 */
  .lesson_img_nakao { /*イントラ中尾さん写真*/
    width: 80%;
    margin: 0 auto;
    display: block;
  }
  .detox_h6 {
    font-size: 6vw;
  }
  .what_detox_div {
    width: 90%;
  }
  .what_detox_left_p {
    flex-basis: 70%;
    display: block;
    font-size: 4vw;
  }
  .what_detox_right_img {
    flex-basis: 30%;
    display: block;
    margin: 0;
  }
  .detox_kouka_ul {
    flex-basis: 40%;
    margin: 5% 0;
  }
  .detox_kouka_li {
    font-size: 3.6vw;
  }
  .detox_kouka_img {
    flex-basis: 25%;
    margin: 5% 0;
  }
  .detox_method_h5 {
    font-size: 5vw;
  }
  .detox_method_h6 {
    font-size: 4.8vw;
  }
  .recommendation_tittle {
    margin: 2% 2% 0 2%;
    font-size: 4.2vw;
  }
  .detox_recommendation_li {
    font-size: 4.2vw;
  }
  .be_careful_li {
    font-size: 4.2vw;
  }
  .detox_summary_p {
    text-align: left;
    font-size: 4.4vw;
    margin: 2%;
  }
  .detox_summary_img {
    text-align: center;
    width: 80%;
  }
}
/*--------------------------
   カラーズ通信 No.9
   今さら聞けない？ ウェルビーイングとは？
--------------------------*/
.well_being_who_div {
  border: 2px solid #e9611d;
  margin: 5% 3%;
}
.well_being_main_img {
  margin: 0 auto 3% auto;
}
.well_being_h6 {
  background-color: #e9611d;
  color: #fff;
  font-size: 1.6vw;
  font-weight: 600;
  text-align: center;
  display: block;
  padding: 0.3em;
}
.being_p {
  margin: 0 3%;
}
.what_well_being_div {
  width: 100%;
  margin: 2%;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
}
.what_well_being_left_p_div {
  flex-basis: 60%;
}
.what_well_being_right_img {
  flex-basis: 36%;
  padding: 2%;
}
.origin_well_being_p {
  background-color: #F5E0B8;
  display: block;
  padding: 2% 4%;
  border-radius: 10px;
  margin: 2% auto;
}
.well_being_small_tittle_h6 {
  font-size: 1.8vw;
  font-weight: 600;
  color: #e9611d;
  margin: 3%;
}
.perma_span {
  font-size: 1.3vw;
  font-weight: 600;
  background-color: yellow;
}
.perma_img {
  margin: 2% auto;
  padding: 0;
  width: 80%;
  display: block;
}
.boost_div {
  margin: 3%;
}
.boost_div_h6 {
  font-size: 1.6vw;
  font-weight: 600;
  background-color: #fdbf2d;
  padding: 0.3em 1em;
  color: #fff;
  margin: 2% auto;
  display: block;
  width: 100%;
}
.boost_flex_box {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
}
.boost_text_box01 {
  flex-basis: 80%;
  padding: 2%;
}
.boost_img_box01 {
  flex-basis: 20%;
  padding: 2%;
}
.boost_text_box02 {
  flex-basis: 70%;
  padding: 2%;
}
.boost_img_box02 {
  flex-basis: 30%;
  padding: 2%;
}
.boost_text_box03 {
  flex-basis: 80%;
  padding: 2%;
}
.boost_img_box03 {
  flex-basis: 20%;
  padding: 2%;
}
.boost_text_box04 {
  flex-basis: 80%;
  padding: 2%;
}
.boost_img_box04 {
  flex-basis: 20%;
  padding: 2%;
}
.well_being_summary_p {
  background-color: #FCE7E7;
  padding: 3%;
  font-size: 1.4vw;
  font-weight: 500;
}
@media screen and (max-width:767.98px) { /* 変更点。0.02引く。 */
  .well_being_h6 {
    font-size: 6vw;
  }
  .what_well_being_div {
    width: 95%;
    margin: 2%;
    display: flex;
    flex-direction: column;
  }
  .what_well_being_left_p_div {
    flex-basis: 100%;
    padding: 2%;
  }
  .what_well_being_right_img {
    flex-basis: 100%;
  }
  .origin_well_being_p {
    padding: 3% 5%;
  }
  .well_being_small_tittle_h6 {
    font-size: 6vw;
    padding-left: 6vw;
    text-indent: -6vw;
  }
  .perma_span {
    font-size: 4.4vw;
  }
  .perma_img {
    margin: 2% auto;
    padding: 0;
    width: 95%;
    display: block;
  }
  .boost_div_h6 {
    font-size: 5vw;
    padding: 0 0.5em;
  }
  .boost_flex_box {
    flex-direction: column;
  }
  .boost_text_box01 {
    flex-basis: 100%;
    padding: 2%;
    order: 1;
  }
  .boost_img_box01 {
    flex-basis: 100%;
    padding: 2% 20%;
    order: 2;
  }
  .boost_text_box02 {
    flex-basis: 100%;
    padding: 2%;
    order: 1;
  }
  .boost_img_box02 {
    flex-basis: 100%;
    padding: 2%;
    order: 2;
  }
  .boost_text_box03 {
    flex-basis: 100%;
    padding: 2%;
    order: 1;
  }
  .boost_img_box03 {
    flex-basis: 100%;
    padding: 2% 20%;
    order: 2;
  }
  .boost_text_box04 {
    flex-basis: 100%;
    padding: 2%;
    order: 1;
  }
  .boost_img_box04 {
    flex-basis: 100%;
    padding: 2% 20%;
    order: 2;
  }
  .well_being_summary_p {
    padding: 3%;
    font-size: 4.6vw;
  }
}
/*--------------------------
   カラーズ通信 No.10
   快眠ライフを送る3つの方法
--------------------------*/
.good_sleep_tittle_img {}
.good_sleep_p {
  margin: 0 3%;
}
.good_sleep_02_img {
  margin: 3% auto;
}
.one_block_div {
  width: 100%;
  margin: 0 auto;
}
.good_sleep_h3 {
  margin: 0 auto;
  width: 100%;
  color: #ff5b6e; /*ピンク*/
  font-size: 2.2vw;
  font-weight: 600;
  padding: 5% 2%;
}
.good_sleep_03_img {
  margin: 3% auto;
  width: 100%;
  padding: 0;
}
.good_sleep_h4 {
  font-size: 1.8vw;
  font-weight: 400;
  text-align: center;
}
.hormone_div {
  margin: 3% auto;
  padding: 4%;
  background-color: #F3E8D3;
  border-radius: 15px;
  width: 70%;
}
.hormone_div_h6 {
  font-size: 1.8vw;
  font-weight: 600;
}
.hormone_div_p {
  padding: 2% 0 0 0;
  font-size: 1.2vw;
  font-weight: 300;
}
.p_img_div {
  margin: 3% auto;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
  width: 90%;
}
.p_img_div_text01 {
  flex-basis: 60%;
  font-size: 1.4vw;
}
.p_img_div_img01 {
  flex-basis: 30%;
  margin: 0 0 0 5%;
}
.quality_h6 {
  padding: 0.1em 0.5em;
  background-color: #ff5b6e;
  font-size: 1.8vw;
  font-weight: 600;
  color: #fff;
  width: 90%;
  margin: 0 auto;
}
.p_img_div_text02 {
  flex-basis: 70%;
  font-size: 1.4vw;
}
.p_img_div_img02 {
  flex-basis: 25%;
  margin: 0 0 0 5%;
}
.p_img_div_text03 {
  flex-basis: 100%;
  font-size: 1.4vw;
}
.p_img_div_img03 {
  flex-basis: 100%;
  margin: 3% auto;
}
.p_img_div_text04 {
  flex-basis: 70%;
  font-size: 1.4vw;
}
.p_img_div_img04 {
  flex-basis: 25%;
  margin: 0 0 0 5%;
  width: 100%;
}
.p_img_div_text05 {
  flex-basis: 100%;
  font-size: 1.4vw;
}
.good_sleep_summary_div {
  margin: 5% auto;
  padding: 2% 0;
  border-top: 3px dotted #ff5b6e;
  border-bottom: 3px dotted #ff5b6e;
  text-align: center;
}
.good_sleep_summary_div p {
  font-size: 1.8vw;
  font-weight: 600;
  color: #ff5b6e;
}
@media screen and (max-width:767.98px) { /* 変更点。0.02引く。 */
  .good_sleep_h3 {
    width: 100%;
    margin: 5% auto;
    padding: 0;
    font-size: 5.2vw;
    line-height: 1.2;
  }
  .good_sleep_h4 {
    font-size: 3.6vw;
    font-weight: 400;
    text-align: center;
  }
  .hormone_div {
    margin: 5% auto;
    padding: 4%;
    background-color: #F3E8D3;
    border-radius: 15px;
    width: 100%;
  }
  .hormone_div_h6 {
    font-size: 5vw;
    font-weight: 600;
  }
  .hormone_div_p {
    padding: 2% 0 0 0;
    font-size: 3.6vw;
    font-weight: 300;
  }
  .quality_h6 {
    padding: 0.1em 0.5em;
    font-size: 4.2vw;
    width: 100%;
    margin: 0 auto;
  }
  .p_img_div {
    margin: 3% auto;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: flex-start;
    width: 100%;
  }
  .p_img_div_text01 {
    flex-basis: 100%;
    font-size: 4vw;
  }
  .p_img_div_img01 {
    flex-basis: 100%;
    margin: 0;
  }
  .p_img_div_text02 {
    flex-basis: 100%;
    font-size: 4vw;
  }
  .p_img_div_img02 {
    flex-basis: 100%;
    margin: 0;
  }
  .p_img_div_text03 {
    flex-basis: 100%;
    font-size: 4vw;
  }
  .p_img_div_img03 {
    flex-basis: 100%;
    margin: 0;
  }
  .p_img_div_text04 {
    flex-basis: 100%;
    font-size: 4vw;
  }
  .p_img_div_img04 {
    flex-basis: 100%;
    margin: 0;
  }
  .p_img_div_text05 {
    flex-basis: 100%;
    font-size: 4vw;
  }
  .good_sleep_summary_div {
    text-align: left;
  }
  .good_sleep_summary_div p {
    font-size: 4.4vw;
  }
}
/*--------------------------
   カラーズ通信 No.11
   冬は痩せやすい季節!? 基礎代謝が高い人の習慣6選
--------------------------*/
.metabolism_tittle_img {
  width: 90%;
  margin: 0 auto;
  padding: 0;
}
.metabolism_p {
  text-align: center;
  font-size: 1.4vw;
  font-weight: 500;
}
.metabolism_h4 {
  font-size: 1.8vw;
  background-color: #d8e7b1; /*kimidori*/
  padding: 0.3em 0.5em;
  margin: 8% auto 3% auto;
}
.metabolism_base_text {
  font-size: 1.2vw;
}
.metabolism_map_img {
  margin: 5% auto;
}
.metabolism_red_text {
  text-align: center;
  font-size: 1.6vw;
  font-weight: 500;
  color: #C03;
}
.metabolism_habit_ul {
  width: 90%;
  margin: 0 auto;
}
.metabolism_habit_li {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
  width: 98%;
  margin: 1% auto 5% auto;
}
.habit_flex_div01 {
  flex-basis: 75%;
  padding: 0 8% 0 0;
}
.habit_flex_img01 {
  flex-basis: 25%;
}
.habit_flex_div02 {
  flex-basis: 65%;
  padding: 0 8% 0 0;
}
.habit_flex_img02 {
  flex-basis: 35%;
}
.habit_flex_div03 {
  flex-basis: 75%;
  padding: 0 8% 0 0;
}
.habit_flex_img03 {
  flex-basis: 25%;
}
.habit_flex_div04 {
  flex-basis: 65%;
  padding: 0 8% 0 0;
}
.habit_flex_img04 {
  flex-basis: 35%;
}
.habit_flex_div05 {
  flex-basis: 65%;
  padding: 0 8% 0 0;
}
.habit_flex_img05 {
  flex-basis: 35%;
}
.habit_flex_div06 {
  flex-basis: 65%;
  padding: 0 8% 0 0;
}
.habit_flex_img06 {
  flex-basis: 35%;
}
.metabolism_habit_h6 {
  font-size: 1.6vw;
  color: #C03;
  padding: 0 0 3% 0;
}
.habit_flex_div p {
  padding: 0 0 0 3%;
}
.metabolism_habit_summary_div {
  width: 90%;
  margin: 0 auto 5% auto;
  border: 4px dotted #000;
  padding: 3%;
  background-color: #FFC;
  text-align: center;
}
.metabolism_habit_summary_div p {
  font-size: 1.5vw;
  color: #000;
  font-weight: 700;
}
@media screen and (max-width:767.98px) { /* 変更点。0.02引く。 */
  .metabolism_tittle_img {
    width: 100%;
    margin: 0 auto;
    padding: 0;
  }
  .metabolism_p {
    text-align: left;
    font-size: 4.2vw;
    font-weight: 500;
  }
  .metabolism_h4 {
    font-size: 4.4vw;
    background-color: #d8e7b1;
    padding: 0.3em 1em;
    margin: 8% auto 3% auto;
    line-height: 1.3;
  }
  .metabolism_base_text {
    font-size: 4vw;
  }
  .metabolism_red_text {
    text-align: left;
    font-size: 4.6vw;
    font-weight: 500;
    color: #C03;
  }
  .metabolism_habit_ul {
    width: 95%;
    margin: 3% auto;
  }
  .metabolism_habit_li {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: flex-start;
    width: 100%;
    margin: 1% auto 5% auto;
  }
  .metabolism_habit_h6 {
    font-size: 4.6vw;
    color: #C03;
  }
  .habit_flex_div p {
    font-size: 3.8vw;
  }
  .habit_flex_div01, .habit_flex_div02, .habit_flex_div03, .habit_flex_div04, .habit_flex_div05, .habit_flex_div06 {
    flex-basis: 100%;
    padding: 0;
  }
  .habit_flex_img01, .habit_flex_img03 {
    flex-basis: 100%;
    padding: 0 10%;
  }
  .habit_flex_img02, .habit_flex_img04, .habit_flex_img05, .habit_flex_img06 {
    flex-basis: 100%;
    padding: 0;
  }
  .metabolism_habit_summary_div {
    width: 100%;
    text-align: left;
  }
  .metabolism_habit_summary_div p {
    font-size: 4vw;
  }
}
/*--------------------------
   カラーズ通信 No.12
   正月太りをリセットする方法3選!脂肪燃焼のしくみとは？
--------------------------*/
.fat_burning_tittle_img {}
.fat_burning_intro_div {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
  width: 90%;
  margin: 5% auto;
}
.fat_burning_intro_div p {
  flex-basis: 80%;
  font-size: 1.5vw;
  font-weight: 500;
  padding: 0 5% 0 0;
}
.fat_burning_intro_div img {
  flex-basis: 20%;
}
.fat_burning_h4 {
  text-align: center;
  margin: 2% auto;
  background-color: #C96;
  font-size: 1.8vw;
  padding: 0.3em 0.5em;
}
.comparison_ul {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
  width: 90%;
  margin: 5% auto;
}
.comparison_li {
  flex-basis: 48%;
  margin: 0 1%;
  padding: 0;
  border: 2px solid #755e47;
}
.comparison_li h6 {
  text-align: center;
  background-color: #755e47;
  color: #fff;
  padding: 0.2em 0.3em;
  font-size: 1.6vw;
}
.item_div {
  padding: 3%;
  margin-left: 1.4vw;
}
.item_div p {
  font-size: 1.4vw;
}
.item_div p::first-letter {
  margin-left: -1.4vw;
}
.steps_div {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
  width: 95%;
  margin: 5% auto;
}
.steps_div_left {
  flex-basis: 70%;
  padding: 0 5% 0 0;
}
.steps_div_right {
  flex-basis: 30%;
}
.steps_div_left_step01 {
  background-color: #901582;
  text-align: center;
  font-size: 1.5vw;
  color: #fff;
  padding: 0.3em;
}
.steps_div_left_step02 {
  background-color: #51a637;
  text-align: center;
  font-size: 1.5vw;
  color: #fff;
  padding: 0.3em;
}
.steps_div_left p {
  padding: 2%;
  font-size: 1.4vw;
  font-weight: 300;
}
.top_big_number_h5 {
  font-size: 2vw;
  padding: 0 0 0 3%;
}
.top_big_number_h5::first-letter {
  font-size: 3vw;
  color: #C00;
}
.reset_means_div {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
  width: 95%;
  margin: 2% auto;
}
.reset_means_div_p_left01 {
  flex-basis: 60%;
  font-size: 1.4vw;
  font-weight: 300;
  padding: 2% 5% 2% 2%;
}
.reset_means_div_right_img01 {
  flex-basis: 40%;
  padding: 0 10%;
}
.meal_h6 {
  font-size: 1.5vw;
  padding: 0.3em;
  background-color: #d8e7b1;
}
.reset_means_div_p {
  font-size: 1.4vw;
  font-weight: 300;
  padding: 2% 5% 2% 2%;
}
.nuts_div {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  margin: 0 auto;
}
.nuts_div_left_p {
  flex-basis: 80%;
}
.nuts_div_right_img {
  flex-basis: 20%;
}
.reset_means_div_img {
  padding: 0 5%;
}
.summary_red_big_p {
  text-align: center;
  font-size: 2.2vw;
  font-weight: 600;
  color: #C00;
}
.img_yukie {
  display: block;
  width: 40%;
  margin: 5% auto;
}
@media screen and (max-width:767.98px) { /* 変更点。0.02引く。 */
  .fat_burning_intro_div {
    flex-direction: column;
    width: 98%;
  }
  .fat_burning_intro_div p {
    flex-basis: 100%;
    font-size: 5vw;
    padding: 0;
  }
  .fat_burning_intro_div img {
    flex-basis: 100%;
    padding: 0 20%;
  }
  .fat_burning_h4 {
    font-size: 6vw;
    margin: 8% auto 3% auto;
  }
  .comparison_ul {
    flex-direction: column;
    width: 100%;
  }
  .comparison_li {
    flex-basis: 100%;
    margin: 3% auto;
    width: 100%;
  }
  .comparison_li h6 {
    font-size: 5.5vw;
  }
  .item_div {
    padding: 3%;
    margin-left: 4.8vw;
  }
  .item_div p {
    font-size: 4.8vw;
  }
  .item_div p::first-letter {
    margin-left: -4.8vw;
  }
  .steps_div {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: flex-start;
    width: 100%;
    margin: 5% auto;
  }
  .steps_div_left {
    flex-basis: 100%;
    padding: 0;
    width: 100%;
  }
  .steps_div_right {
    flex-basis: 100%;
    padding: 0;
    width: 100%;
  }
  .steps_div_left_step01 {
    font-size: 5.2vw;
    text-align: left;
    line-height: 1.5;
    padding: 0.1em 1em;
  }
  .steps_div_left_step02 {
    font-size: 5.2vw;
    text-align: left;
    line-height: 1.5;
    padding: 0.1em 1em;
  }
  .steps_div_left p {
    padding: 3% 0;
    font-size: 4.8vw;
    font-weight: 300;
  }
  .top_big_number_h5 {
    font-size: 6vw;
    padding: 0 0 0 3%;
  }
  .top_big_number_h5::first-letter {
    font-size: 7vw;
  }
  .reset_means_div {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: flex-start;
    width: 100%;
    margin: 3% auto;
  }
  .reset_means_div_p_left01 {
    flex-basis: 100%;
    font-size: 4.8vw;
    font-weight: 300;
    padding: 2%;
  }
  .reset_means_div_right_img01 {
    flex-basis: 100%;
    padding: 0 20%;
  }
  .meal_h6 {
    font-size: 5vw;
    padding: 0.3em;
    margin: 5% 0;
  }
  .reset_means_div_p {
    font-size: 4.8vw;
    font-weight: 300;
    padding: 2%;
  }
  .nuts_div {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: flex-start;
    width: 100%;
    margin: 0 auto;
  }
  .nuts_div_right_img {
    flex-basis: 100%;
    padding: 0 10%;
  }
  .summary_red_big_p {
    text-align: left;
    font-size: 6vw;
    font-weight: 600;
    color: #C00;
  }
  .img_yukie {
    width: 80%;
    margin: 5% auto;
    display: block;
  }
}
/*-----------------------
  カラーズ通信 No.13
  部位別コース導入の経緯
  選ばれるパーソナルトレーナーになるには？
-----------------------*/
.background_div {
  background-color: #ffffcc;
  padding: 6%;
}
.background_tittle_h6 {
  text-align: center;
  font-size: 2vw;
  line-height: 1.5;
  border-bottom: 2px solid #d43b74;
  padding: 0 0 2% 0;
  margin: 0 10% 5% 10%;
}
.l_r_box_div {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: stretch;
  margin: 2% auto;
}
.l_box {
  flex-basis: 40%;
}
.r_box {
  flex-basis: 60%;
}
.arrow_pink {
  width: 20%;
  display: block;
  margin: 3% auto;
}
.trainer_p {
  font-size: 1.3vw;
  font-weight: 400;
}
.trainer_h4 {
  text-align: center;
  margin: 2% auto;
  background-color: #520063;
  font-size: 2vw;
  color: #fff;
  padding: 0.3em 0.5em;
}
.inner_div {
  width: 94%;
  margin: 3%;
}
.trainer_h6 {
  font-size: 1.8vw;
  margin: 5% 0 3% 0;
}
.knowledge_ul {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-around;
  align-items: stretch;
  width: 80%;
  margin: 3% auto;
}
.knowledge_li {
  font-size: 1.8vw;
}
.check_icon {
  width: 10%;
  top: 0.2vw;
  position: relative;
  margin: 0 3%;
}
.trainer_technique_ul {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-around;
  align-items: stretch;
}
.trainer_technique_text_li {
  flex-basis: 70%;
}
.trainer_technique_img_li {
  flex-basis: 30%;
}
.charm_h4 {
  text-align: center;
  margin: 2% auto;
  background-color: #fb7d93;
  font-size: 2vw;
  color: #fff;
  padding: 0.3em 0.5em;
}
.charm_h6 {
  font-size: 1.8vw;
  margin: 5% 0 3% 0;
}
.charm_h6::first-letter {
  font-size: 2.4vw;
  color: #ee3077;
}
.course_p {
  display: block;
  text-align: center;
  border: 1px solid gray;
  margin: 3% 10%;
  font-size: 1.4vw;
}
@media screen and (max-width:767.98px) { /* 変更点。0.02引く。 */
  .background_div {
    padding: 8% 6%;
  }
  .background_tittle_h6 {
    font-size: 6vw;
    padding: 0 0 2% 0;
    margin: 0;
  }
  .l_r_box_div {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: stretch;
    margin: 2% auto;
  }
  .trainer_p {
    font-size: 5vw;
  }
  .trainer_h4 {
    font-size: 7vw;
    margin: 8% auto;
  }
  .trainer_h6 {
    font-size: 6vw;
    margin: 5% 0 3% 0;
  }
  .inner_div {
    width: 100%;
    margin: 0;
  }
  .knowledge_ul {
    width: 100%;
  }
  .knowledge_li {
    font-size: 6vw;
  }
  .check_icon {
    width: 20%;
  }
  .trainer_technique_ul {
    flex-direction: column;
  }
  .trainer_technique_text_li {
    flex-basis: 100%;
  }
  .trainer_technique_img_li {
    flex-basis: 100%;
  }
  .charm_h4 {
    font-size: 7vw;
  }
  .charm_h6 {
    font-size: 6vw;
  }
  .charm_h6::first-letter {
    font-size: 8vw;
  }
  .course_p {
    text-align: center;
    margin: 3% auto;
    font-size: 5vw;
  }
}
/*--------------------------------
  カラーズ通信 No.14
  自律神経の乱れに注意！整える方法5選
---------------------------------*/
.img_okakoi {
  width: 60%;
  margin: 0 auto;
  text-align: center;
}
.img_okakoi img {
  width: 100%;
  margin: 0 auto;
}
.autonomic_nervous_system_h5 {
  font-size: 2.6vw;
  font-weight: 600;
  color: #ee0282;
  text-align: center;
  margin: 0 auto 5% auto;
}
.autonomic_nervous_system_p {}
.autonomic_nervous_system_h6 {
  font-size: 1.8vw;
  text-align: center;
  color: #fff;
  background-color: #230BDA;
  padding: 0.3em;
  margin: 3% auto;
}
.autonomic_nervous_system_ul {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: stretch;
  margin: 3% auto;
}
.autonomic_nervous_system_li {
  border: 2px solid #CC6;
  margin: 0 2%;
}
.flex_two_box {
  flex-basis: 45%;
}
.box_dl {
  font-size: 1.8vw;
}
.box_dt {
  background-color: #CC6;
  text-align: center;
  padding: 0.3em;
  font-size: 2vw;
}
.box_dd {
  padding: 0 5%;
}
.down_arrow {
  text-align: center;
}
.down_arrow img {
  width: 10%;
}
.possibility_p {
  text-align: center;
  font-size: 1.8vw;
  margin: 2% auto;
}
.cause_div {
  border: 2px solid #CC6;
}
.cause_div_tittle {
  background-color: #CC6;
  text-align: center;
  padding: 0.3em;
  font-size: 2vw;
  color: #3E3A39;
  font-weight: bold;
}
.cause_div_ul {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-around;
  align-items: stretch;
  margin: 2% auto;
}
.cause_div_li01 {
  flex-basis: 40%;
  padding: 0.3em;
  font-size: 1.8vw;
  line-height: 1.5;
}
.cause_div_li02 {
  flex-basis: 50%;
  padding: 0.3em;
  font-size: 1.8vw;
  line-height: 1.5;
}
.method_five_div {
  width: 90%;
  margin: 5% auto;
}
.method_five_div_h6 {
  font-size: 2vw;
  border-bottom: 2px solid #ee0282;
  padding: 0.3em;
}
.method_five_div_h6::first-letter {
  font-size: 3vw;
  color: #ee0282;
}
.method_five_div_p {
  font-size: 1.6vw;
  margin: 2% auto;
}
.fine02_img {
  width: 70%;
  text-align: center;
  margin: 5% auto;
}
.fine02_img img {
  width: 80%;
  margin: 0 auto;
}
.text_pink_p {
  color: #ee0282;
}
@media screen and (max-width:767.98px) { /* 変更点。0.02引く。 */
  .img_okakoi {
    width: 90%;
    margin: 0 auto;
    text-align: center;
  }
  .autonomic_nervous_system_h5 {
    font-size: 6.4vw;
  }
  .autonomic_nervous_system_h6 {
    font-size: 5vw;
  }
  .autonomic_nervous_system_ul {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-items: stretch;
    margin: 3% auto;
  }
  .flex_two_box {
    flex-basis: 100%;
    margin: 2% auto;
  }
  .box_dl {
    font-size: 4.9vw;
  }
  .box_dt {
    font-size: 5vw;
  }
  .down_arrow img {
    width: 20%;
  }
  .possibility_p {
    text-align: left;
    font-size: 5.4vw;
    margin: 2% auto;
  }
  .cause_div_tittle {
    background-color: #CC6;
    text-align: center;
    padding: 0.3em;
    font-size: 5vw;
    color: #3E3A39;
    font-weight: bold;
  }
  .cause_div_ul {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;
    align-items: stretch;
    margin: 2% auto;
  }
  .cause_div_li01 {
    flex-basis: 100%;
    padding: 0.3em 0;
    font-size: 4.8vw;
    line-height: 1.5;
  }
  .cause_div_li02 {
    flex-basis: 100%;
    padding: 0.3em 0;
    font-size: 4.8vw;
    line-height: 1.5;
  }
  .method_five_div {
    width: 100%;
    margin: 5% auto;
  }
  .method_five_div_h6 {
    font-size: 6vw;
    padding: 0.3em 0;
  }
  .method_five_div_h6::first-letter {
    font-size: 7vw;
  }
  .method_five_div_p {
    font-size: 4.4vw;
    margin: 2% auto;
  }
  .fine02_img {
    width: 90%;
  }
}
/*---------------------------------
　カラーズ通信 No.15
  今バレエピラティスがアツイ!
---------------------------------*/
.interview_sub_div01 { /*辻田さんスケジュールの箇所*/
  width: 100%;
  margin: 5% auto;
}
.schedule_div01 {
  width: 100%;
  margin: 0 auto;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
}
.time_schedule01 {
  flex-basis: 60%;
  text-align: center;
  border: 2px solid #000;
  margin: 3% auto 0 auto;
}
.ir_img {
  flex-basis: 35%;
  display: block;
}
.ir_img img {
  width: 95%;
  margin: 5% auto;
  padding: 1% 5%;
}
.time_schedule_tittle01 {
  background-color: #000;
  color: #fff;
  display: inline-block;
  margin: 0 auto;
  padding: 0 0.5em;
  position: relative;
  top: -15px;
  font-size: 1.3vw;
}
.time_schedule01 dl {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  margin: 0 auto 5% auto;
}
.time_schedule01 dt {
  flex-basis: 30%;
  font-size: 1.4vw;
  text-align: right;
}
.time_schedule01 dd {
  margin: 0 0 0 3%;
  flex-basis: 65%;
  font-size: 1.3vw;
  text-align: left;
}
/*2025 4月号から掲載　オープンチャット解説*/
.open_chat_div {
  width: 70%;
  margin: 0 auto 5% auto;
  padding: 2%;
  border: 2px solid #A26E06;
}
.open_chat_h4 {
  text-align: center;
  font-size: 2.2vw;
  line-height: 1.5;
}
.open_chat_qr {
  width: 30%;
  margin: 2% auto;
  display: block;
}
.open_chat_catch_p {
  text-align: center;
  color: #A26E06;
  font-size: 1.6vw;
  font-weight: 600;
}
.open_chat_div p {
  text-align: center;
}
/*----今、『バレエピラティス』がアツい..！ --*/
.trendy_lesson_h5 {
  font-size: 3vw;
  text-align: center;
  color: #EB0B7C;
  margin: 0 auto 5% auto;
}
.ballet_pilates_img {
  text-align: center;
  width: 60%;
  margin: 1% auto 5% auto;
  display: block;
}
.trendy_lesson_catch_p {
  font-size: 1.4vw;
  text-align: center;
  font-weight: 600;
}
.trendy_lesson_h6 {
  background-color: #EB0B7C;
  color: #fff;
  padding: 0.3em 1em;
  font-size: 1.8vw;
  margin: 3% auto;
}
.trendy_lesson_p {}
.trendy_lesson_ul {
  width: 90%;
  margin: 5% auto;
}
.trendy_lesson_li {
  border: 2px solid #fbd76c;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  margin: 1% auto;
  align-items: stretch;
}
.li_reason_left {
  flex-basis: 35%;
  background-color: #fbd76c;
  padding: 1em;
  font-size: 1.3vw;
  font-weight: 600;
}
.li_explanation_right {
  flex-basis: 65%;
  padding: 1em;
}
.trendy_lesson_summary_p {
  text-align: center;
  font-size: 2vw;
  font-weight: 600;
  color: #df0606;
  margin: 3% auto;
  display: block;
}
@media screen and (max-width:767.98px) { /* 変更点。0.02引く。 */
  .schedule_div01 {
    width: 100%;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: flex-start;
  }
  .time_schedule01 {
    flex-basis: 100%;
    text-align: center;
    margin: 3% auto 0 auto;
  }
  .time_schedule_tittle01 {
    background-color: #000;
    color: #fff;
    display: inline-block;
    margin: 0 auto;
    padding: 0 0.5em;
    position: relative;
    top: -15px;
    font-size: 4vw;
  }
  .time_schedule01 dl {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    margin: 0 5% 5% 5%;
  }
  .time_schedule01 dd {
    margin: 0;
    flex-basis: 100%;
    font-size: 4vw;
    text-align: left;
  }
  .time_schedule01 dt {
    flex-basis: 100%;
    font-size: 4vw;
    text-align: left;
  }
  /*2025 4月号から掲載　オープンチャット解説*/
  .open_chat_div {
    width: 100%;
    margin: 0 auto 5% auto;
    padding: 5%;
  }
  .open_chat_h4 {
    font-size: 5.5vw;
  }
  .open_chat_qr {
    width: 80%;
    margin: 5% auto;
    display: block;
  }
  .open_chat_catch_p {
    font-size: 5vw;
  }
  .open_chat_div p {
    text-align: left;
  }
  /*-- 今、『バレエピラティス』がアツい..！ --*/
  .trendy_lesson_h5 {
    font-size: 5.5vw;
    text-align: left;
  }
  .ballet_pilates_img {
    width: 100%;
    margin: 1% auto 5% auto;
  }
  .trendy_lesson_catch_p {
    font-size: 5vw;
    text-align: left;
    font-weight: 600;
  }
  .trendy_lesson_h6 {
    padding: 0.3em 1em;
    font-size: 5vw;
    margin: 3% auto;
    line-height: 1.5;
  }
  .trendy_lesson_ul {
    width: 100%;
    margin: 5% auto;
  }
  .trendy_lesson_li {
    flex-direction: column;
    margin: 5% auto;
  }
  .li_reason_left {
    flex-basis: 100%;
    padding: 0.2em;
    font-size: 5vw;
  }
  .li_explanation_right {
    flex-basis: 100%;
    padding: 0.2em 0.3em 0.5em 0.3em;
  }
  .trendy_lesson_summary_p {
    text-align: center;
    font-size: 5vw;
  }
}
/*----------------------------------------------------
   カラーズ通信 No.16
  業界最多!? 豊富な「リフォーマー養成コース」を徹底解説!
----------------------------------------------------*/
.thorough_explanation_h5 {}
.thorough_explanation_p {
  margin: 2% auto;
  font-size: 1.7vw;
  font-weight: 600;
}
.thorough_explanation_ul {}
.thorough_explanation_li {}
.thorough_explanation_li_in_h6 {
  text-align: center;
  margin: 5% auto 2% auto;
}
.thorough_explanation_li_in_h6 p {
  display: inline-block;
  font-size: 2vw;
  text-align: center;
  margin: 0 auto; /* 外側の余白（上下と中央配置） */
  padding: 0.3em 2em; /* 内側余白 */
  background: none; /* 元のボックス背景色なし */
  border: 2px solid #a18505; /* 線の太さ（1px）、種類（実線）、色*/
  position: relative; /* 配置（基準となる位置） */
}
.thorough_explanation_li_in_h6 p:after {
  background-color: #a18505; /* ずらしたボックスの背景色 */
  border: none; /* 枠線なし */
  content: ''; /* 擬似要素にコンテンツなし */
  position: absolute; /* 配置（ここを動かす） */
  top: 7px; /* 上から7pxずらす */
  left: 7px; /* 左から7pxずらす */
  width: 100%; /* 幅100%（親要素に合わせる） */
  height: 100%; /* 高さ100%（親要素に合わせる） */
  opacity: 0.3;
}
.thorough_explanation_format_p {
  font-size: 1.4vw;
  font-weight: 500;
  line-height: 1.8;
}
.course_list_illustration {
  margin: 5% auto;
}
.small_h6 {
  text-align: center;
  font-size: 1.6vw;
  color: #a18505;
  margin: 3% auto 0 auto;
}
.explanation_small_ul {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  margin: 5% auto;
  align-items: stretch;
}
.explanation_small_li_img {
  flex-basis: 50%;
  padding: 0 5% 0 0;
}
.explanation_small_li_text {
  flex-basis: 50%;
}
@media screen and (max-width:767.98px) { /* 変更点。0.02引く。 */
  .thorough_explanation_p {
    margin: 2% auto;
    font-size: 4.2vw;
    font-weight: 600;
  }
  .thorough_explanation_li_in_h6 {}
  .thorough_explanation_li_in_h6 p {
    font-size: 5vw;
  }
  .thorough_explanation_format_p {
    font-size: 4.2vw;
  }
  .small_h6 {
    font-size: 5vw;
  }
  .explanation_small_li_img {
    flex-basis: 100%;
    padding: 3% 0;
  }
  .explanation_small_li_text {
    flex-basis: 100%;
  }
}
/*----------------------------------------------------
   カラーズ通信 No.17
  インストラクターとしての豆知識 
いつも満席レッスンのインストラクターってどんな人!? 
選ばれるインストラクター特徴3選
----------------------------------------------------*/
.selected_ir_p {
  margin: 2% auto;
  font-size: 1.7vw;
  font-weight: 600;
}
.selected_ir_h6 {
  text-align: center;
  margin: 5% auto 2% auto;
  font-size: 2vw;
  padding: 0 0 2% 0;
  border-bottom: 1px solid #a18505;
  color: #a18505;
}
.number_h6_p {
  padding: 0 3% 0 0;
  font-size: 3vw;
}
.selected_ir_img_p {
  margin: 5% auto;
  padding: 0;
  width: 100%;
}
.selected_ir_format_p {
  font-size: 1.4vw;
  font-weight: 500;
  line-height: 1.8;
}
@media screen and (max-width:767.98px) { /* 変更点。0.02引く。 */
  .selected_ir_p {
    font-size: 4.2vw;
  }
  .selected_ir_h6 {
    font-size: 5.5vw;
    text-align: left;
  }
  .number_h6_p {
    padding: 0 3% 0 0;
    font-size: 8vw;
  }
  .selected_ir_img_p {}
  .selected_ir_format_p {
    font-size: 4.6vw;
    font-weight: 500;
    line-height: 1.6;
  }
}
/*======================================================
 colours通信　デザインリニューアル　2025 ７月号より〜(Vo18.html〜)
======================================================*/
.index_new_ol {}
.index_div .index_new_li {
  color: #a62f24;
}
.new_index_a {
  font-family: "Noto Serif JP", serif;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: normal;
  line-height: 1.5;
}
.new_tittle_h3_div {
  width: 100%;
  border-top: 1.5px solid #000;
}
.ttl_note_new_h2 {
  width: 100%;
  margin: 0 auto;
  padding: 0 1em;
  font-weight: 600;
  font-size: 2vw;
  font-family: "Noto Serif JP", serif;
}
.name_romaji_text_red {
  color: #a62f24;
  font-family: "Noto Serif JP", serif;
  font-size: 1.2vw;
  display: block;
  margin: 4% auto 0 auto;
}
.chinese_characters_text_new {
  font-size: 3vw;
  font-weight: 600;
  font-family: "Noto Serif JP", serif;
  display: block;
  margin: 0 auto;
}
/*---- インタビュータブ ----*/
.cp_qa_new {
  font-family: "Noto Serif JP", serif;
}
.cp_qa_new *, .cp_qa_new *:after, .cp_qa_new *:before {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.cp_qa_new .cp_actab {
  position: relative;
  overflow: hidden;
  width: 100%;
  margin: 0 0 1em 0;
  color: #1b2538;
}
.cp_qa_new .cp_actab input {
  position: absolute;
  opacity: 0;
}
/* 質問 */
.cp_qa_new .cp_actab .label_new {
  line-height: 1;
  position: relative;
  display: block;
  margin: 0 0 0 0;
  padding: 1em 2em 1em 2.5em;
  cursor: pointer;
  text-indent: 1vw;
  font-size: 1.6vw;
  font-weight: 600;
  border-bottom: 1px solid #000;
}
.cp_qa_new .cp_actab .label_new::before {
  font-size: 2vw;
  margin-left: -2vw;
  padding: 0.1em 0.3em;
  content: 'Q';
  color: #fff;
  font-weight: 200;
  background-color: #000;
}
.cp_qa_new .cp_actab .label_new:hover {
  transition: all 0.3s;
  color: #666;
}
/* --質問の＋アイコン */
.cp_qa_new .cp_actab .label_new::after {
  font-size: 1.7em;
  font-weight: bold;
  line-height: 2em;
  position: absolute;
  top: 0;
  right: 0;
  content: '\2b';
  display: inline-block;
  width: 2em;
  height: 2em;
  -webkit-transition: transform 0.4s;
  transition: transform 0.4s;
}
/* 答え */
.cp_qa_new .cp_actab .cp_actab-content {
  position: relative;
  overflow: hidden;
  max-height: 0;
  padding: 0 0 0 2.5em;
  -webkit-transition: max-height 0.2s;
  transition: max-height 0.2s;
  border-radius: 0 0 0.5em 0.5em;
}
.cp_qa_new .cp_actab .cp_actab-content::before {
  font-size: 2vw;
  position: absolute;
  margin: 0;
  padding: 3% 0 0 0;
  content: 'A';
  font-weight: 200;
  color: #a62f24;
  font-family: "Noto Serif JP", serif;
}
.cp_qa_new .cp_actab .cp_actab-content p {
  margin: 5vw 2% 2% 0;
  font-size: 1.3vw;
  line-height: 1.8;
  color: #000;
  font-weight: 400;
  font-family: "Noto Serif JP", serif;
  border-bottom: 1px solid #000;
  padding: 1% 0 3% 0;
}
/* 質問を開いた時の仕様 */
/* --答えの高さ */
.cp_qa_new .cp_actab input:checked ~ .cp_actab-content {
  max-height: 100%;
}
/* 質問をクリックした時のアイコンの動き */
.cp_qa_new .cp_actab input:checked ~ .label_new {
  color: #666;
  border-radius: 0.5em 0.5em 0 0;
}
/* 質問をクリックした時の+の動き */
.cp_qa_new .cp_actab input[type=checkbox]:checked + .label_new::after {
  -webkit-transform: rotateZ(45deg);
  transform: rotateZ(45deg);
  -webkit-transform-origin: 50% 50%;
  transform-origin: 50% 50%;
}
/*------ 養成スクール　-----*/
.school_tittle_h6_new {
  background-color: #a18505;
  text-align: center;
  font-family: "Noto Serif JP", serif;
  font-size: 1.6vw;
  color: #fff;
  font-weight: 400;
  padding: 0.3em;
}
.school_small_div {
  width: 100%;
  background-color: #fff;
  padding: 2%;
  margin: 3% auto;
}
.lesson_name_p {
  font-size: 1.6vw;
  color: #a18505;
  font-family: "Noto Serif JP", serif;
  margin: 1% 0;
  text-align: center;
  border-bottom: 1px solid #a18505;
}
.lesson_dl {
  width: 100%;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  margin: 1% auto;
  align-items: stretch;
  font-size: 1.3vw;
}
.lesson_dl dt {
  width: 13%;
  flex-basis: 13%;
  background-color: #999;
  color: #fff;
  display: block;
  text-align: center;
  margin: 1%;
  line-height: 1.5;
}
.lesson_dl dd {
  width: 83%;
  flex-basis: 83%;
  display: block;
  margin: 1%;
  line-height: 1.5;
}
/*---豆知識 ---*/
.tittle18_img {
  margin: 2% auto;
  width: 100%;
}
.mame_p {
  font-size: 1.4vw;
  font-family: "Noto Serif JP", serif;
  margin: 0 auto 2% auto;
}
.mame_h6 {
  font-size: 2vw;
  color: darkred;
  font-family: "Noto Serif JP", serif;
  margin: 3% auto;
  border-bottom: 1px solid #000;
  border-left: 5px solid darkred;
  padding: 0 3% 1% 3%;
}
.mame_h6::first-letter {
  font-size: 3vw;
  margin: 0 3% 0 0;
}
.mame_matome_p {
  text-align: center;
  font-size: 2.2vw;
  font-family: "Noto Serif JP", serif;
  background-color: khaki;
  display: inline-block;
  margin: 0 auto 3% auto;
  width: 100%;
}
@media screen and (max-width:767.98px) { /* 変更点。0.02引く。 */
  .new_tittle_h3_div {
    width: 100%;
    border-top: none;
    border-bottom: 1px solid #000;
    padding: 0 0 2% 0;
  }
  .ttl_note_new_h2 {
    font-size: 5vw;
  }
  .name_romaji_text_red {
    font-size: 4.4vw;
  }
  .chinese_characters_text_new {
    font-size: 8vw;
  }
  /*タブ　質問*/
  .cp_qa_new .cp_actab .label_new {
    line-height: 1.5;
    font-size: 4.2vw;
    padding: 2vw 10vw 2vw 4vw;
  }
  .cp_qa_new .cp_actab .label_new::before {
    font-size: 4vw;
  }
  .cp_qa_new .cp_actab .label_new::after {
    line-height: 1.5;
    width: 1.5em;
    height: 1.5em;
  }
  .cp_qa_new .cp_actab .cp_actab-content::before {
    font-size: 4vw;
  }
  .cp_qa_new .cp_actab .cp_actab-content {
    padding: 0 0 0 3vw;
  }
  .cp_qa_new .cp_actab .cp_actab-content p {
    margin: 5vw 2% 5% 1vw;
    font-size: 3.4vw;
    line-height: 1.8;
  } /*タブここまで*/
  /*------ 養成スクール　-----*/
  .school_tittle_h6_new {
    font-size: 5vw;
  }
  .school_small_div {
    width: 100%;
    padding: 5%;
  }
  .lesson_name_p {
    font-size: 5vw;
  }
  .lesson_dl {
    width: 100%;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: flex-start;
    margin: 1% auto;
    align-items: stretch;
    font-size: 4.4vw;
  }
  .lesson_dl dt {
    width: 100%;
    flex-basis: 100%;
  }
  .lesson_dl dd {
    width: 100%;
    flex-basis: 100%;
  }
  .mame_p {
    font-size: 4.4vw;
  }
  .mame_h6 {
    font-size: 5.4vw;
    line-height: 1.3;
    margin: 5% auto 3% auto;
  }
  .mame_h6::first-letter {
    font-size: 8vw;
  }
  .mame_matome_p {
    text-align: center;
    font-size: 6vw;
    line-height: 1.5;
    display: block;
    margin: 2% auto;
    width: 100%;
  }
}