@charset "UTF-8";

/*******************************
TOP
*******************************/
/* ---------------------
kv
--------------------- */


/* ---------------------
リード
--------------------- */
.p-top-lead__img{
  width: 100%;
  margin-bottom: 20px;
}
.p-top-lead__text{
  margin-inline: auto;
  width: 92%;
}
.p-top-lead__plist .cat{
  display: inline-block;
  padding: 4px 10px;
  margin: 1.5px 3px  1.5px 0;
  background-color: var(--color--gold);
  border-radius: var(--radius-sm);
  color: var(--color--wh);
}

/* ---------------------
選ばれる理由
--------------------- */
.p-top-riyu__inner{
  width: 100%;
  padding: var(--space-4) 0;
  border-bottom: 1px solid var(--color--gray);
}
.p-top-riyu__inner .img{
  width: 30%;
  max-width: 100px;
  margin: 0 auto;
}
.p-top-riyu__inner h4{
  margin: var(--space-2) 0;
}

/* ---------------------
留学プログラム
--------------------- */
.p-top-program__list {
  justify-content: space-between;
}
.p-top-program__box{
  width: 100%;
  max-width: 450px;
  margin: 0 auto var(--space-4);
}
.p-top-program__box .text_box{
  padding: var(--space-2);
  text-align: center;
}
.p-top-program__box h4{
  position: relative;
  margin-bottom: 20px;
}
.p-top-program__box h4::after{
  content: "";
  display: block;
  line-height: 0;
  position: absolute;
  bottom: -10px;
  left: 0;
  right: 0;
  margin-inline: auto;
  width: 100px;
  border-bottom: 3px solid var(--color--gold);
}
.p-program__btn{
  padding: 0 var(--space-2) var(--space-2);
}
.p-top-program__list02{
  justify-content: space-between;
}
.p-top-program__box02{
  width: 100%;
  max-width: 450px;
  margin: 0 auto var(--space-4);
  padding: var(--space-4);
  border: 1px solid var(--color--gold);
  justify-content: space-between;
}
.p-top-program__box02 .img{
  width: 60px;
  align-self: center;
}
.p-top-program__box02 .text_box{
  width: calc( 100% - 80px );
  align-self: center;
}
.p-top-program__box02 h4{
  color: var(--color--gold);
}

/* ---------------------
現在募集中のプログラム
--------------------- */
.p-top-currently__ttl{
  display: inline-block;
  position: relative;
  height: 40px;/*リボンの高さ*/
  line-height: 40px;/*リボンの高さ*/
  padding: 0 30px 0 20px;/*横の大きさ*/
  background-color: var(--color--gold);
  color: var(--color--wh);
}
.p-top-currently__ttl:after {
  position: absolute;
  content: '';
  width: 0px;
  height: 0px;
  z-index: 1;
  top: 0;
  right: 0;
  border-width: 20px 10px 20px 0px;
  border-color: transparent #fff transparent transparent;
  border-style: solid;
}
.p-top-currently__limited,
.p-top-currently__list{
  display: block;
  width: 100%;
}

/* ---------------------
インスタ
--------------------- */
.p-top-insta__ttl {
  display: block;
  width: 100%;
  padding-top: 35px;
  position: relative;
}
.p-top-insta__ttl h2::before {
  content: url(../../images/common/Instagram_Glyph_Gradient.svg);
  display: block;
  width: 30px;
  height: 30px;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
}


/*====== TB（600px～）======*/
@media screen and (min-width: 600px) {
  /* ---------------------
  選ばれる理由
  --------------------- */
  .p-top-riyu__box{
    justify-content: space-between;
  }

  .p-top-riyu__inner{
    width: 33.33333%;
    padding: var(--space-4);
    border-bottom: none;
    border-right: 1px solid var(--color--gray);
  }
  .p-top-riyu__inner:last-of-type{
    border-right: none;
  }
  /* ---------------------
  留学プログラム
  --------------------- */
  .p-top-program__box{
    width: 48.5%;
    margin-inline: 0;
  }
  .p-top-program__box02{
    width: 32.33333%;
    margin-inline: 0;
  }
  /* ---------------------
  現在募集中のプログラム
  --------------------- */

  /* ---------------------
  インスタ
  --------------------- */
  .p-top-insta__ttl {
    padding-top: 45px;
  }
  .p-top-insta__ttl h2::before {
    width: 40px;
    height: 40px;
  }
}/*====== TBここまで ======*/


/*====== PC（1024px～）======*/
@media screen and (min-width: 1024px) {
  /* ---------------------
  リード
  --------------------- */
  .p-top-lead__img{
    margin-bottom: 0;
    width: 47%;
    align-self: center;
  }
  .p-top-lead__text{
    padding: 0 4vw;
    width: 53%;
    align-self: center;
  }
  /* ---------------------
  選ばれる理由
  --------------------- */
  /* ---------------------
  留学プログラム
  --------------------- */
  .p-top-program__list{
    justify-content: center;
    margin-right: -2%;
  }
  .p-top-program__box{
    width: 31.33333%;
    margin-right: 2%;
  }
  /* ---------------------
  現在募集中のプログラム
  --------------------- */
  .p-top-currently__detail {
    justify-content: space-between;
  }
  .p-top-currently__limited{
    width: 49%;
  }
  .p-top-currently__list .p-currently__list_box{
    margin: var(--space-2) 0 ;
  }
  /* ---------------------
  インスタ
  --------------------- */
  /* ---------------------
  体験談・Blog
  --------------------- */
  
}/*====== PC（1024px〜）ここまで ======*/


/*******************************
各種プログラム 共通
単身留学
親子留学
団体留学
スポーツ留学
大学・社会人留学
*******************************/
/* こんな方におすすめ！ */
.p-p-recommend{
  padding: var(--space-4)  var(--space-2);
}
.p-p-recommend .c-checklist li{
  font-weight: var(--weight-6);
}

/* プログラム概要 */
.p-p-overview__inner{
  width: 100%;
  background-color: var(--color--wh);
  padding: var(--space-4) var(--space-2);
  margin-bottom: var(--space-4);
}
.p-p-overview__ttl{
  display: flex;
  margin-bottom: 0.75em;
}
.p-p-overview__ttl .img{
  display: block;
  width: 35px;
  height: auto;
  margin-right: 0.5em;
}
.p-p-overview__ttl .text{
  display: block;
  align-self: center;
}
.p-p-overview__detail p,
.p-p-overview__detail li{
  font-size: var(--font-md);
}
.p-p-overview__note{
  margin-top: 0.5em;
}

/* p-pro-bnr */
.p-pro-bnr{
  width: 100%;
  justify-content: space-between;
}
.p-p-bnr__inner{
  position: relative;
  display: block;
  width: 100%;
  background-color: var(--color--wh);
  margin-bottom: var(--space-4);
}
.p-p-bnr__inner a{
  width: 100%;
}
.p-p-bnr__text{
  width: 100%;
  padding: var(--space-2);
  align-self: center;
}

.p-p-bnr__img{
  width: 100%;
}
/* サポート */
.p-p-support__inner,
.p-p-support__inner_fll{
  width: 100%;
  background-color: var(--color--wh);
  padding: var(--space-4) var(--space-2);
  margin-bottom: var(--space-4);
}
.p-p-support__ttl{
  display: flex;
  margin-bottom: 0.75em;
}
.p-p-support__ttl .img{
  display: block;
  width: 35px;
  height: auto;
  margin-right: 0.5em;
}
.p-p-support__ttl .text{
  display: block;
  align-self: center;
}
.p-p-support__detail p,
.p-p-support__detail li{
  font-size: var(--font-md);
}

/* p-pro-flexbox */
.p-p-flexbox__imgbox,
.p-p-flexbox__txtbox,
.p-p-flexbox02__imgbox,
.p-p-flexbox02__txtbox {
  align-self: center;
  width: 100%;
}
.p-p-flexbox03__imgbox,
.p-p-flexbox03__txtbox {
  width: 100%;
}


/*====== TB（600px～）======*/
@media screen and (min-width: 600px) {
/* こんな方におすすめ！ */
  .p-p-recommend{
    padding: var(--space-4);
  }
/* プログラム概要 */
  .p-p-overview__inner{
    padding: var(--space-4);
  }
  .p-p-overview__ttl .img{
    width: 50px;
  }
/* p-pro-bnr */
  .p-p-bnr__inner{
    width: 49%;
    margin-bottom: 0;
  }
  
/* サポート */
  .p-p-support__inner,
  .p-p-support__inner_fll{
    padding: var(--space-4);
  }
  .p-p-support__ttl .img{
    width: 50px;
  }
  
}


/*====== PC（1024px～）======*/
@media screen and (min-width: 1024px) {
/* プログラム概要 */
  .p-p-overview__box{
    justify-content: space-between;
  }
  .p-p-overview__inner{
    width: 49%;
  }
  
/* p-pro-bnr */
  .p-p-bnr__text{
    width: 50%;
  }
  .p-p-bnr__img{
    width: 50%;
  }
  
/* サポート */
  .p-p-support__box{
    justify-content: space-between;
  }
  .p-p-support__inner{
    width: 49%;
  }
/* p-pro-flexbox */
  .p-pro-flexbox,
  .p-pro-flexbox03{
    justify-content: space-between;
  }
  .p-pro-flexbox_row-reverse,
  .p-pro-flexbox02_row-reverse{
    justify-content: space-between;
    flex-direction: row-reverse;
  }
  .p-p-flexbox__imgbox{
    width: 400px;
    margin-bottom: 0;
  }
  .p-p-flexbox__txtbox{
    width: calc( 100% - 440px );
    margin-bottom: 0;
  }
  .p-p-flexbox02__imgbox{
    width: 300px;
    margin-bottom: 0;
  }
  .p-p-flexbox02__txtbox{
    width: calc( 100% - 340px );
    margin-bottom: 0;
  }
  
  .p-p-flexbox03__imgbox{
    width: 58%;
    margin-bottom: 0;
  }
  .p-p-flexbox03__txtbox{
    width: 40%;
    margin-bottom: 0;
  }

}
/*====== PC（1400px～）======*/
@media screen and (min-width: 1400px) {
/* p-pro-bnr */
  .p-p-bnr__text{
    padding: var(--space-4);
  }
}


/*******************************
募集中のプログラム
*******************************/
.p-currently__list{
  justify-content: space-between;
}
.p-currently__list_box{
  width: 100%;
  margin: var(--space-4) 0 ;
  background-color: var(--color--wh);
}
.p-currently__list_imgbox{
  width: 120px;
  position: relative;
  background: var(--color--gray);
}
.p-currently__list_cat{
  position: absolute;
  top: 0;
  left: 0;
  display: inline-block;
  padding: 2px 10px;
  background-color: var(--color--gold);
  color: var(--color--wh);
  font-size: var(--font-ss);
  z-index: 1;
}
.p-currently__list_textbox{
  width: calc( 100% - 120px );
  padding: var(--space-2);
}
.p-currently__list_ttl{
  margin-bottom: 0.5em;
  font-size: var(--font-base);
  
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2; /* 表示したい行数（例：2行） */
  overflow: hidden;
  text-overflow: ellipsis;
}
.p-currently__list_subject li{
  display: inline-block;
  padding: 2px 5px;
  border: 1px solid var(--color--gold);
  margin-right: 5px;
  color: var(--color--gold);
  font-size: var(--font-ss);
}
.p-currently__list_btn{
  width: 100%;
  padding: 0 var(--space-2) var(--space-2);
}

/*====== TB（600px～）======*/
@media screen and (min-width: 600px) {
 .p-currently__list_box{
   position: relative;
  }
  .p-currently__list_imgbox{
    width: 200px;
  }
  .p-currently__list_textbox{
    width: calc( 100% - 200px );
    min-height: 170px;
  }

  .p-currently__list_btn{
    position: absolute;
    bottom: -5px;
    right: 0;
    width: 200px;
  }

}/*====== TBここまで ======*/


/*====== PC（1024px～）======*/
@media screen and (min-width: 1024px) {
  #currently .p-currently__list_box,
  #program .p-currently__list_box{
    width: 49%;
    margin: 1% 0 ;
  }

  
}/*====== PC（1024px〜）ここまで ======*/


/*******************************
ECOAST&COの魅力
*******************************/
/* p-ecoast-sec01 */
.p-ecoast-sec01__box{
  justify-content: space-between;
}
.p-ecoast-sec01__imgbox{
  width: 100%;
  margin-bottom: var(--space-4);
}
.p-ecoast-sec01__txtbox{
  width: 100%;
}

/*====== TB（600px～）======*/
@media screen and (min-width: 600px) {
  .p-ecoast-sec01__imgbox{
    width: 60%;
  }
}

/*====== PC（1024px～）======*/
@media screen and (min-width: 1024px) {
  .p-ecoast-sec01__imgbox{
    width: 41%;
    margin-bottom: 0;
    align-self: center;
  }
  .p-ecoast-sec01__txtbox{
    width: 55%;
    align-self: center;
  }
}


/*******************************
スタッフ紹介
*******************************/
/* p-staff-sec02 */
.p-staff-sec02__box{
  padding: var(--space-4);
  margin-bottom: var(--space-4);
  justify-content: space-between;
}

.p-staff-sec02__imgbox{
  width: 200px;
  margin: 0 auto;
  margin-bottom: var(--space-4);
  align-self: center;
}
.p-staff-sec02__ttl{
  width: 100%;
  margin-bottom: var(--space-4);
  align-self: center;
}
.p-staff-name{
  margin-bottom: 0.7em;
}
.p-staff-name__en{
  font-size: 80%;
}
.p-staff-post{
  display: inline-block;
  padding: 3px 10px;
  background-color: var(--color--gold);
  color: var(--color--wh);
}
.p-staff-sec02__txtbox{
  width: 100%;
}

/*====== TB（600px～）======*/
@media screen and (min-width: 600px) {
  /* p-staff-sec02 */
  .p-staff-sec02__imgbox{
    width: 300px;
    margin: 0;
    margin-bottom: var(--space-4);
  }
  .p-staff-sec02__ttl{
    width: calc( 100% - 340px );
    margin-bottom: var(--space-4);
  }
}
/*====== PC(1200px～) ======*/
@media screen and (min-width: 1200px) {
  .p-staff-sec02__box{
    padding: var(--space-6);
  }
}

/*******************************
会社概要
*******************************/


/*******************************
提携先
*******************************/
/* p-partner-nav */
.p-partner-nav{
  justify-content: flex-start;
}
.p-partner-nav li{
  width: 24%;
  margin-bottom: var(--space-1);
  margin-right: 1%;
}
.p-partner-nav li a{
  display: block;
  width: 100%;
  height: 30px;
  line-height: 30px;
  border: 1px solid var(--color--gold);
  border-radius: 15px;
  text-align: center;
  font-size: var(--font-ss);
  font-weight: var(--weight-6);
  color: var(--color--gold);
  position: relative;
}
.p-partner-nav li.nav-item{
  width: 100%;
}
.p-partner-nav li.nav-item a{
  display: block;
  width: 100%;
  background-color: var(--color--gold);
  font-size: var(--font-sm);
  color: var(--color--wh);
}
.p-partner-nav li.nav-item a::before{
  content: '';
  /*絶対配置で下線の位置を決める*/
  position: absolute;
  top: 9px;
  right: 23px;
  /*下線の形状*/    
  width: 1px;
  height: 10px;
  background: var(--color--wh);
}
.p-partner-nav li.nav-item a::after{
  content: '';
  /*絶対配置で矢印の位置を決める*/
  position: absolute;
  top: 17px;
  right: 20px;
  /*矢印の形状*/
  width: 5px;
  height: 5px;
  border: 1px solid var(--color--wh);
  border-left: 0;
  border-top: 0;
  transform: rotate(45deg);
  transform-origin: top right;
}

/* p-partner-box */
.p-partner-box{
  padding: var(--space-4);
  margin-bottom: var(--space-4);
  justify-content: space-between;
}
.p-partner-imgbox{
  width: 150px;
  margin: 0 auto;
  margin-bottom: var(--space-4);
  align-self: center;
}
.p-partner-imgbox img{
  width: auto;
  max-width: 150px;
  max-height: 150px;
  margin: auto;
}
.p-partner-textbox{
  width: 100%;
  align-self: center;
}
.p-partner-school_name a:hover{
  color: var(--color--key-dark);
}
.p-partner-school_name_en{
 font-size: 80%;
}
.p-partner-school_address{
  padding: 10px 0;
  margin-bottom: 10px;
  border-bottom: 1px solid var(--color--gray);
}
.p-partner-school_text{
  width: 100%;
  font-size: var(--font-sm);
}

/*====== TB(700px〜) ======*/
@media screen and (min-width: 700px) {
  /* p-staff-sec02 */
  .p-partner-nav li,
  .p-partner-nav li.nav-item{
    width: 19%;
  }
  .p-partner-nav li a{
    font-size: var(--font-sm);
  }
  .p-partner-nav li a::before{
    content: '';
    /*絶対配置で下線の位置を決める*/
    position: absolute;
    top: 9px;
    right: 23px;
    /*下線の形状*/    
    width: 1px;
    height: 10px;
    background: var(--color--gold);
  }
  .p-partner-nav li a::after{
    content: '';
    /*絶対配置で矢印の位置を決める*/
    position: absolute;
    top: 17px;
    right: 20px;
    /*矢印の形状*/
    width: 5px;
    height: 5px;
    border: 1px solid var(--color--gold);
    border-left: 0;
    border-top: 0;
    transform: rotate(45deg);
    transform-origin: top right;
  }
  
  /* p-partner-box */
  .p-partner-imgbox{
    margin: 0;
    margin-bottom: 0;
  }
  .p-partner-textbox{
    width: calc( 100% - 180px );
  }
}
/*====== PC（1024px～）======*/
@media screen and (min-width: 1024px) {
  .p-partner-school_name_en{
   margin-left: 1em;
  }
}


/*******************************
留学の流れ
*******************************/
.p-flow-info__imgbox{
  width: 100%;
  align-self: center;
  margin-bottom: var(--space-4);
}
.p-flow-info__txtbox{
  width: 100%;
  align-self: center;
}
.p-flow-info__txtbox h2{
  font-size: var(--heading-h1);
}
.p-flow-info__txtbox h2 span{
  font-size: 50%;
  color: var(--color--bk);
  position: relative;
  top:-10px;
}

/*====== TB（600px～）======*/
@media screen and (min-width: 600px) {
  .p-flow-info__txtbox h2 span{
    top:-5px;
    margin-left: 10px;
  }
}

/*====== PC（1024px～）======*/
@media screen and (min-width: 1024px) {
  .p-flow-info__box{
    justify-content: space-between;
  }
  .p-flow-info__box:nth-of-type(2n){
    flex-direction: row-reverse;
  }
  .p-flow-info__imgbox{
    width: 400px;
    margin-bottom: 0;
  }
  .p-flow-info__txtbox{
    width: calc( 100% - 440px );
  }
}

/*******************************
オーストラリア教育制度
*******************************/
#education .c-table02{
  max-width: 700px;
}

/* ---------------------
オーストラリア教育の特徴
--------------------- */
.p-education-feature__inner{
  width: 100%;
  padding: var(--space-4) 0;
}
.p-education-feature__inner .img{
  width: 30%;
  max-width: 100px;
  margin: 0 auto;
}
.p-education-feature__inner h4{
  margin: var(--space-2) 0;
}

/* ---------------------
ECOASTのサポート
--------------------- */
.p-education-support__txtbox .c-checklist li{
  font-weight: var(--weight-6);
}

/*====== TB（600px～）======*/
@media screen and (min-width: 600px) {
  #education .c-table02 th,
  #education .c-table02 td{
  padding: 10px 50px;
  }

  /* ---------------------
  オーストラリア教育の特徴
  --------------------- */
  .p-education-feature__box{
    justify-content: space-between;
  }
  .p-education-feature__inner{
    width: 30%;
    padding: var(--space-4) 0 0;
  }
}

/*====== PC（1024px～）======*/
@media screen and (min-width: 1024px) {
  /* ---------------------
  ECOASTのサポート
  --------------------- */
  .p-education-support__box{
    justify-content: space-between;
  }
  .p-education-support__txtbox {
    width: calc( 100% - 440px );
    align-self: center;
  }
  .p-education-support__imgbox{
    width: 400px;
    align-self: center;
  }
}

/*******************************
ゴールドコースト情報
*******************************/
.p-goldcoast-info__imgbox{
  width: 100%;
  align-self: center;
  margin-bottom: var(--space-4);
}
.p-goldcoast-info__txtbox{
  width: 100%;
  align-self: center;
}
.p-goldcoast-info__txtbox h2{
  font-size: var(--heading-h1);
}
.p-goldcoast-info__txtbox h2 span{
  font-size: 50%;
  color: var(--color--bk);
  position: relative;
  top:-10px;
}

/*====== TB（600px～）======*/
@media screen and (min-width: 600px) {
  .p-goldcoast-info__txtbox h2 span{
    top:-5px;
    margin-left: 10px;
  }
}

/*====== PC（1024px～）======*/
@media screen and (min-width: 1024px) {
  .p-goldcoast-info__box{
    justify-content: space-between;
  }
  .p-goldcoast-info__box:nth-of-type(2n){
    flex-direction: row-reverse;
  }
  .p-goldcoast-info__imgbox{
    width: 400px;
    margin-bottom: 0;
  }
  .p-goldcoast-info__txtbox{
    width: calc( 100% - 440px );
  }
}


/*******************************
よくある質問
*******************************/
/* p-faq-nav */
.p-faq-nav{
  justify-content: flex-start;
}
.p-faq-nav li{
  width: 100%;
  margin-bottom: var(--space-1);
  margin-right: 1%;
}
.p-faq-nav li a{
  display: block;
  width: 100%;
  height: 30px;
  line-height: 30px;
  border: 1px solid var(--color--gold);
  border-radius: 15px;
  background-color: var(--color--gold);
  text-align: center;
  font-size: var(--font-sm);
  font-weight: var(--weight-6);
  color: var(--color--wh);
  position: relative;
}
.p-faq-nav li a::before{
  content: '';
  /*絶対配置で下線の位置を決める*/
  position: absolute;
  top: 9px;
  right: 17px;
  /*下線の形状*/
  width: 1px;
  height: 10px;
  background: var(--color--wh);
}
.p-faq-nav li a::after{
  content: '';
  /*絶対配置で矢印の位置を決める*/
  position: absolute;
  top: 17px;
  right: 14px;
  /*矢印の形状*/
  width: 5px;
  height: 5px;
  border: 1px solid var(--color--wh);
  border-left: 0;
  border-top: 0;
  transform: rotate(45deg);
  transform-origin: top right;
}

/* p-faq-box */
.p-faq-box{
  background-color: var(--color--wh);
  margin-bottom: var(--space-4);
  padding: var(--space-2);
}
.p-faq-box dt,
.p-faq-box dd{
  padding-left: 35px;
  position: relative;
}
.p-faq-box dt{
  margin-bottom: var(--space-3);
  font-weight: var(--weight-6);
}

.p-faq-q,
.p-faq-a{
  display: block;
  width: 25px;
  height: 25px;
  line-height: 23px;
  border: 1px solid var(--color--gold);
  border-radius: 5px;
  font-weight: var(--weight-6);
  text-align: center;
  position: absolute;
  top: 0;
  left: 0;
}
.p-faq-q{
  background-color: var(--color--gold);
  color: var(--color--wh);
}
.p-faq-a{
  color: var(--color--gold);
}

.p-faq-box ul.c-disc>li{
  margin-bottom: 0;
}
.p-faq-box__note{
  font-size: var(--font-sm);
}

/*====== TB（600px～）======*/
@media screen and (min-width: 600px) {
  /* p-faq-nav */
  .p-faq-nav li{
    width: 49%;
  }

  /* p-faq-box */
  .p-faq-box{
    padding: var(--space-4);
  }
  .p-faq-box dt,
  .p-faq-box dd{
    padding-left: 45px;
  }
  .p-faq-q,
  .p-faq-a{
    width: 30px;
    height: 30px;
    line-height: 28px;
  }
}

/*====== PC（1024px～）======*/
@media screen and (min-width: 1024px) {
  /* p-faq-nav */
  .p-faq-nav li{
    width: 32.33333%;
  }
}


/*******************************
/* WP投稿 single.php（共通）
*******************************/
/* 見出し */
.wp-block-heading{
  margin-bottom: var(--space-2);
}
/* 本文 */
.wp-block-paragraph{
  margin-bottom: var(--space-2);
}
.wp-block-paragraph a{
  color: var(--color--key-dark);
  text-decoration: underline;
}

/*******************************
体験談・Blog News
*******************************/
/* ---------------------
体験談・Blog 一覧（トップページ）
--------------------- */
.p-top-voice__list,
.p-top-blog__list{
  width: 100%;
  justify-content: space-between;
}

/* ---------------------
体験談・Blog 一覧（共通）
--------------------- */
.p-top-voice__list,
.p-top-blog__list{
  width: 100%;
  justify-content: space-between;
}
.p-voice__list_box,
.p-blog__list_box{
  width: 100%;
  margin: var(--space-1) 0 ;
  background: var(--color--wh);
}
.p-voice__list_imgbox,
.p-blog__list_imgbox{
  width: 100%;
}
.p-voice__list_textbox,
.p-blog__list_textbox{
  width: 100%;
  padding: var(--space-2);
}
.p-voice__list_cat{
  display: inline-block;
  margin-bottom: 0.5em;
  padding: 3px 10px;
  background-color: var(--color--gold);
  color: var(--color--wh);
  font-size: var(--font-sm);
}
.p-blog__list_time{
  margin-bottom: 0.5em;
}
.p-voice__list_ttl,
.p-blog__list_ttl{
  font-size: var(--font-base);
  
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2; /* 表示したい行数（例：2行） */
  overflow: hidden;
  text-overflow: ellipsis;
}
.p-voice__list_btn,
.p-blog__list_btn{
  display: block;
  width: 100%;
  padding: 0 var(--space-2) var(--space-2);
}

/*------------------------------
News 一覧
------------------------------*/
.p-news__list{
  margin-bottom: var(--space-5);
}
.p-news__list li{
  padding: 15px 0;
  border-bottom: 1px solid #ccc;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.p-news__list li:first-of-type{
  border-top: 1px solid #ccc;
}
.p-news__list .timecat{
  width: 100%;
  margin-bottom: 0.5em;
}
.p-news__list .time{
  margin-right: 15px;
}
.p-news__list .cat a{
  padding: 2px 10px;
  background: var(--color--gold);
  color: #fff;
}
.p-news__list .title{
  width: 100%;
}
.p-news__list .title a:hover{
  text-decoration: underline;
  opacity: 0.7;
}


/*------------------------------
News 詳細ページ
------------------------------*/
.p-voice-content,
.p-news-content {
  padding-bottom: var(--space-6);
  border-bottom: 1px solid var(--color--gray);
}
.p-voice-content .voice-time,
.p-news-content .news-time{
  margin-bottom: var(--space-2);
}
.p-voice-content .headline,
.p-news-content .headline{
  margin-bottom: var(--space-4);
  color: var(--color--gold);
}
.p-voice-content .wp-post-image,
.p-voice-content .wp-block-image,
.p-news-content .wp-post-image,
.p-news-content .wp-block-image{
  display:block;
  width: auto;
  max-width: 100%;
  height: auto;
  margin: var(--space-4) auto;
}
.p-voice-content .wp-post-image img,
.p-voice-content .wp-block-image img,
.p-news-content .wp-post-image img,
.p-news-content .wp-block-image img{
  width: auto;
  max-width: 100%;
  height: auto;
}


/*====== TB（600px～）======*/
@media screen and (min-width: 600px) {
  /* ---------------------
  体験談・Blog 一覧（共通）
  --------------------- */
  .p-voice__list_box,
  .p-blog__list_box{
    width: 32%;
  }
  /*------------------------------
   News 一覧
  ------------------------------*/
  .p-news__list .timecat{
    width: 200px;
    margin-bottom: 0;
  }
  .p-news__list .time{
    margin-right: 25px;
  }
  .p-news__list .title{
    width: calc( 100% - 200px);
  }
}/*====== TB（600px〜）ここまで ======*/

/*====== PC（1024px～）======*/
@media screen and (min-width: 1024px) {
  /*------------------------------
  News  一覧
  ------------------------------*/
  .p-news__list li{
    padding: 15px;
  }
}/*====== PC（1024px〜）ここまで ======*/