@charset "UTF-8";

/* セクションタイトル */
.section-title {
  color: #000;
  font-size: clamp(20px, 6vw, 60px);
  font-weight: 700;font-weight: 400;
  letter-spacing: 0.05em;
}

/* ボタン */
.btn {
  max-width: 120px;
  background-color: #fff;
  display: block;
  border: solid 1px #1f1f1f;
  font-size: 12px;
  padding: 10px 0;
  text-align: center;
  position: relative;
  z-index: 10;
}
.btn::before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -10;
  background-color: #1f1f1f;
  transform-origin: 100% 50%;
  transform: scaleX(0);
  transition: transform ease 0.3s;
}
.btn:hover {
  color: #fff;
  opacity: 1;
}
.btn:hover::before {
  transform-origin: 0% 50%;
  transform: scaleX(1);
}
/* moreボタン */
.m_btn {
  max-width: 160px;
  background-color: #1f1f1f;
   color: #fff;
  display: block;
  border: solid 1px #1f1f1f;
  font-size: 18px;
  padding: 10px 0;
  text-align: center;
  position: relative;
  z-index: 10;
}
.m_btn::before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -10;
  background-color: #fff;
  transform-origin: 100% 50%;
  transform: scaleX(0);
  transition: transform ease 0.3s;
}
.m_btn:hover {
  color: #fff; color: #1f1f1f;
  opacity: 1;
}
.m_btn:hover::before {
  transform-origin: 0% 50%;
  transform: scaleX(1);
}
/* more_cボタン */
.m_btn_c {
  max-width: 160px;max-width: 360px;
  background-color: #1f1f1f;
   color: #fff;
  display: block;
  border: solid 1px #1f1f1f;
  font-size: 18px;
  padding: 10px 0;
  text-align: center;
  position: relative;
  z-index: 10;
  margin:20px 10px 40px;
}
.m_btn_c::before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -10;
  background-color: #fff;
  transform-origin: 100% 50%;
  transform: scaleX(0);
  transition: transform ease 0.3s;
}
.m_btn_c:hover {
  color: #fff; color: #1f1f1f;
  opacity: 1;
}
.m_btn_c:hover::before {
  transform-origin: 0% 50%;
  transform: scaleX(1);
}
/*-------------------------------------------
TOPICS
-------------------------------------------*/
.topics {
  margin: 20px auto 120px;
}
/*-------------------------------------------
資格取得支援金
-------------------------------------------*/

.support{
	width:100%;
	max-width:1000px;
	margin:0 auto;
	display:flex;
	justify-content:space-between;
}
.support .com{
	width:78%;
}
.support .bn_box{
	width:200px;
}
.support_con{
	width:100%;
	max-width:800px;
	margin:0 auto;
	padding:0 20px;
	
}
.support_con ol, .support_con ul{
	margin-left:3em;
	padding-bottom:10px;
}
.support_con h3{
	padding-bottom:10px;
}
.support_con p{
	padding-bottom:10px;
}
.support_con a{
	text-decoration:underline;
}



/*-------------------------------------------
合格体験レポート
-------------------------------------------*/

/* ボタン 合格体験レポート｜開催履歴（リンクボタン共通）------------*/
.e_report_c{
	text-align: center;
}
.e_report{
	text-align: left;
}
.c_box{
	text-align:center;
}
.e_report_c .ca_btn{
	display:inline-block;
}
.e_report .ca_btn{
	display:inline-block;
}
.ca_btn {
  padding:10px 20px;
  margin-right:10px;
  margin-bottom:10px;
  border: solid 1px #009B7C;
  border-radius: 30px;
  display: block;
  font-size: 18px;
  line-height:1.0;
  text-align: center;
  vertical-align:middle;
   color: #009B7C;
   font-weight:600;
}
.ca_btn:hover {
  background-color: #009B7C;
  color: #fff;
}
.current .ca_btn{
	background-color: #009B7C;
  color: #fff;
}
@media screen and (max-width: 767px) {
	.e_report{
	/*text-align: left;*/
	}
	.ca_btn {
  padding:8px 10px;
  font-weight:500;
	
}
}

.bg_e_report{
  background: -moz-linear-gradient(top, #ECECEC, #FFF, 30%, #FFF);
  background: -webkit-linear-gradient(top, #ECECEC, #FFF, 30%, #FFF);
  background: linear-gradient(to bottom, #ECECEC, #FFF, 30%, #FFF);
  padding:40px 20px;
}

#taiken{
	margin:0 auto;
	max-width:1000px;
}
#taiken h3{
	padding-bottom:15px;
	font-weight:500;
}
#taiken h4{
	color:#003399;
	font-weight:500;
	border-bottom:#003399 solid 1px;
	margin-bottom:30px;
	padding-bottom:10px;
}
ul.tai li{
	margin:5px 0 20px;
	padding:0px 10px 2px 15px;
	background: url(images/mark01.jpg) left 5px no-repeat;
}
.fc_blue{
	color: #003399;
}
.box_photo{
	text-align:center;
}
.ph_link{s
	margin-top:10px;
}
.ph_link a{
	text-decoration:underline;
}
.new_mark{
	  padding:5px 5px 6px;
  margin-left:10px;
  margin-bottom:5px;
  background-color:#003399;
  display: inline-block;
  line-height:1.0;
  text-align: center;
  vertical-align:middle;
  color: #fff;
  width:80px;

}

/*-------------------------------------------
開催履歴
-------------------------------------------*/
.ev_history{
	margin:0 auto;
	max-width:600px;
}
.ev_history h3{
	padding-bottom:5px;
	font-weight:500;
}

ul.rireki{
	margin:0 0 30px;
	padding:0;
}
ul.rireki li{
	list-style:none;
	color: #000;
	max-width:100%;
	/*height:40px;*/
	margin: 1px;
	padding: 0 20px 0 10px;
	line-height:40px;
	font-size:16px;
	border-bottom:#000 dotted 1px;
	text-align:left;
	
	clear:both;
}
ul.rireki li a{
	text-decoration:none;
}
ul.rireki li .more {
	text-decoration:underline;
	float:right;
	padding-right:10px;
	
}
/*開催履歴moreページ　info-------------------------*/
.info_cont{
	max-width:550px;max-width:650px;
	margin:20px auto 20px;
	padding:50px;padding:30px;
	
	background-color:#FFF;
	font-size:12px;
	
}
.info_cont h2{
	float:left;
	font-size:1.4em;
	font-weight:600;
}
.closeBtn{
	float: right;
	margin-top:-30px;
}
hr{
	clear: both;
	visibility:hidden;
	height:0;
	margin:0;
	border:none;
}
.info_cont hr{
	margin-bottom:40px;
}
.info_cont p{
	font-size:1.2em;
	line-height:1.8;
	
	margin-bottom:10px;

}
.info_cont img{
	display:block;
	margin:0 auto;
}
.info_cont p.ph_com{
	text-align:center;
}
.info_cont ul{
	font-size:1.2em;
	line-height:1.8;
}
.info_cont ol{
	font-size:1.2em;
	line-height:1.8;
}

.close_txt{
	text-align:center;
	margin-top:50px;
}
@media (max-width:400px){
	.info_cont{
		padding:50px 20px;
	}
	.info_cont p.ph_com{
	text-align: left;
}
	.info_cont hr{
	margin-bottom:0;
}
}


/*-------------------------------------------
会報誌　newsletter
-------------------------------------------*/
.newsletter{
	margin:0 20px 50px;
}
.newsletter .rea_list {
  max-width: 1000px;max-width: 1400px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 50px; gap: 3vw;
  margin-top: 170px;margin-top: 40px;
}
.newsletter .rea_list li {

}
.newsletter .rea_list li .date{
	font-size:20px;
	letter-spacing:0.05em;
	padding:5px 0 0 10px;
}
.newsletter .rea_list li .title{
	font-size:20px;
	font-weight:500;
	line-height:1.0;
	padding-left:10px;
}
.bg_gray{
	background:#FAFAFA;
}
.bg_green{
	background:#009B7C;
	padding:0 0 10px;
}
.bg_green a{
	color:#FFF;
}
@media screen and (max-width: 1024px) {
.newsletter .rea_list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 50px; gap: 3vw;
  margin-top: 170px;margin-top: 40px;
}
.newsletter .rea_list li {
  width:100%;
}
	
}
@media screen and (max-width: 767px) {

.newsletter .rea_list {
    margin-top: 0;
  }
.newsletter .rea_list {
  display: grid;
  grid-template-columns: repeat(1, 1fr);
  gap: 50px; gap: 3vw;
  margin-top: 170px;margin-top: 40px;margin-top: 10px;
}
.newsletter .rea_list li {
  width:100%;
}
}

/*-------------------------------------------
BLOG
-------------------------------------------*/
.blog{
	width:100%;
    max-width:1240px;
}
/*-------------------------------------------
EVENT
-------------------------------------------*/
.event{
	width:100%;
    max-width:1240px;
}
/*-------------------------------------------
 COMMITTEE
-------------------------------------------*/
#committee{
	padding-bottom:40px;
}
#committee h3{
	margin:0 auto 20px;
	max-width:1000px;
	line-height:1.8;
	padding:0 10px;
	color:#009B7C;
	border-bottom:#009B7C solid 1px;
}

#committee h3 .ja{
	font-size:26px;
	font-weight:600;
	letter-spacing:0.02em;
	margin-left:-20px;
}
#committee h3 .en{
	font-size:20px;
	font-weight:500;
	letter-spacing:0.02em;
}
.committee_ph{
	margin:20px auto;
	max-width:418px;
}


/*-------------------------------------------
page_header　トップ以外の波画像の場合
-------------------------------------------*/
.page_header {
  margin-bottom: 120px;
  margin: -300px auto 120px;margin: -300px auto 60px;
  position: relative;
}
.page_header .section-title {
  margin-bottom: 20px;
  text-align:center;
}
.page_header .section-title img{
  width:100%;
  max-width:325px;
}
.head_line{
	margin:50px auto 50px;
	border-top:#009B7C solid 2px;
	width:100px;
}
.head_line_s{
	margin:50px auto 50px;
	border-top:#009B7C solid 2px;
	width:100px;
}
.head_line_ss{
	margin:30px auto 30px;
	border-top:#009B7C solid 2px;
	width:100px;
}
.head_text{
	margin:10px auto 50px;
	max-width:1000px;
	line-height:1.8;
	padding:0 10px;
}
.head_text_c{
	margin:10px auto 30px;
	max-width:800px;
	line-height:1.8;
	text-align:center;
}

/*-------------------------------------------
page_header　波以外のページ
-------------------------------------------*/
.page_header_in {
  margin-bottom: 120px;
  margin: 200px auto 60px;margin: 0px auto 60px;
  position: relative;
}
.page_header_in .section-title {
  margin-bottom: 20px;
  text-align:center;
}
.page_header_in .section-title img{
  width:100%;
  max-width:325px;
}


/*-------------------------------------------
スマートフォン
-------------------------------------------*/
@media screen and (max-width: 767px) {
  .section-title {
    font-size: 12vw;
  }
  .head_line_s{
	margin:20px auto 0;
  }
/*-------------------------------------------
page_header　トップ以外の波画像の場合
-------------------------------------------*/
.page_header {
  margin-bottom: 120px;
  margin: -200px auto 30px;
  position: relative;
  }
.page_header .section-title img{
  width:100%;
  max-width:225px;
  }

}


/*-------------------------------------------
Mainvisual　トップ以外の波画像の場合
-------------------------------------------*/
.mainvisual_p {
  position: relative;
}
.mainvisual_p picture img{
	width:100%;
	height:60vh;
	object-fit:cover;
	object-position:bottom;
}
.mainvisual_p .wave {
  position: absolute;
  bottom: -2px;
}

/*-------------------------------------------
緑風会 ABOUT
-------------------------------------------*/

/*---------aboutBtn-----------*/
.about{
	display:flex;
	margin:20px auto;
	max-width:800px;
}
.about .ab_btn {
  max-width: 360px;width: 360px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #fff;
  border-radius: 50px;
  border:#009B7C 1px solid;
  box-shadow: 0px 4px 0px 0px #009B7C;
  font-weight: bold;
  padding: 20px 0;
  margin: 0 auto;
  color:#009B7C;
  font-size:28px;
  letter-spacing:0.2em;
}
.about .ab_btn:hover {
  transform: translateY(5px);
  box-shadow: none;
}

/* ボタンのスタイル */
.ad_ya {
  position: relative;
  display: inline-block;
}
.ad_ya::before,
.ad_ya::after {
  content: "";
  position: absolute;
  top: calc(50% - 2px);
  right: 0;
  width: 20px;
  height: 4px;
  border-radius: 9999px;
  background-color: #009B7C;
  transform-origin: calc(100% - 2px) 50%;
  
  right:30px;
}
.ad_ya::before {
  transform: rotate(45deg);
}
.ad_ya::after {
  transform: rotate(-45deg);
}

/*information------------------------*/
.information {
	width:100%;
	max-width:940px;
	margin:0 auto 100px;;
    padding: 20px;
}
.information .section-title {
  text-align:center;
  font-weight:500;
  font-size:50px;
  margin-bottom:50px;
}

#info{
	margin:0;
	width:100%;
	max-width:940px;
}
#info dl{
	display:inline-block;
	margin:0;
	padding:1em 1em 0 0;
	font-size:1.2em;
}
#info dt{
	float:left;
	width:7em;
	color:#000;
	line-height:1.4;
}
#info dd{
	margin-left:7em;
	margin-bottom:6px;
	color:#333;
	line-height:1.6;
}
#info .line_inf{
	border-bottom:#000 solid 1px;
	padding:0 0 20px;
	margin-bottom:20px;
	width:100%;
	max-width:940px;
}
/*--*/
#info_a{
	margin:0;
	width:100%;
	max-width:940px;
}
#info_a dl{
	margin:0 0 40px;
	padding:0;
}
#info_a dt{
	line-height:1.4;
}
#info_a dt.title{
	color:#000;
	font-weight:600;
	font-size:1.2em;
	padding-bottom:20px;
	
}
#info_a dd{
	margin-bottom:6px;
	color:#333;
}


@media screen and (max-width: 767px) {
	.mainvisual_p picture img{
	 height: 300px;

    }
	
	.about .ab_btn {
		font-size:28px;font-size:20px;
		margin: 0 5px;
	}
	.ad_ya::before,
	.ad_ya::after {
  	  right:20px;
	}

	.information .section-title {
	font-size:40px;
	margin-bottom:10px;
	}
	#info dl{
	line-height:1.8;
	font-size:17px;
	}
	#info dt{
	float: none;
	width:100%;
	}
	#info dd{
	margin-left:0;
	margin-bottom:0px;
	}
	#info .line_inf{
	margin-bottom:0;
	}
/*--*/
	#info_a dl{
	line-height:1.8;
	}
	#info_a dt{
	float: none;
	width:100%;
	}
	#info_a dd{
	margin-left:0;
	margin-bottom:0px;
	}

}



/*ヘッダー画像が波以外のページタイトル---------------------------------*/
.page_title{
	text-align:center;
	color:#009B7C;
	
}
.page_title .en{
	font-size:26px;
	font-weight:500;
	letter-spacing:0.2em;
	;
}
.page_title .ja{
	font-size:46px;
	font-weight:600;
	letter-spacing:1.0em
}
.page_title .ja_s{
	font-size:46px;
	font-weight:600;
	letter-spacing:0.2em
}
.page_title .ja_ss{
	font-size:46px;
	font-weight:600;
	letter-spacing:0.00em
}

@media screen and (max-width: 767px) {
		
.page_title .en{
	font-size:20px;
	font-weight:500;
	letter-spacing:0.1em;
	;
	}
.page_title .ja{
	font-size:40px;
	font-weight:600;
	letter-spacing:0.6em
}
.page_title .ja_s{
	font-size:40px;
	font-weight:600;
	letter-spacing:0.05em
	}
.page_title .ja_ss{
	font-size:38px;
	font-weight:600;;
	letter-spacing:0.00em
	}
	
}

/*-------------------------------------------
TOPICSのMOREページ
-------------------------------------------*/
.t_page_title{
	text-align: left;
	color:#009B7C;
}
@media screen and (max-width: 767px) {
	.t_page_title{
		font-size:22px;
		display: block;
		line-height:1.2;
	}
}
.yd{
	border-right:#ccc solid 1px;
	width:80px;
	padding:10px 10px 10px 0;
	margin-right:20px;
	float:left;
	
	
}
.yd .year{
	font-size:14px;
	font-weight:normal;
	text-align:center;
	line-height:1.0;
	color:#666;
	
}

.yd .date{
	font-size:24px;
	font-weight:normal;
	text-align:center;
	line-height:1.0;
	font-weight:600;
	color:#666;
}
.more_img{
	margin:0 auto;
	padding:0 10px 40px;
	width:100%;
	max-width:800px;
}
.more_img img{
	margin-bottom:3px;
}
.t_more{
	margin-top:-20px;
}
.t_more .tag{
	color: #fff;
  font-size:16px;
  background-color:#000;
  padding: 0.3rem 0.5rem;
  margin-right:10px;
}
.p_space p{
	padding-bottom:1.0em;
}
.p_space p a{
	text-decoration:underline;
	color:#008669;
	
}
.articles{
	margin:10px auto 150px;
	max-width:1000px;
	line-height:1.8;
	padding:0 10px;
}
.articles h2{
    background: #000;
	color:#FFF;
    padding: 15px;
    position: relative;
	font-size:20px;

    margin: 25px auto;
}
.articles h2::after {
    content: "";
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-color: #000 transparent transparent transparent;
    border-width: 30px 30px 0px 30px;
    position: absolute;
    left: calc(50% - 15px);left:20px;
    bottom: -15px;
	
}
.articles h3{
	font-size:20px;
    margin: 25px auto;
	border-left:#333 solid 8px;
	padding-left:15px;
}
/*-----------------------------------------------------------*/
/*パンくずリスト*/
.pan{
	margin:0 auto;
	max-width:1100px;
	padding:0 20px 30px;
}
.breadcrumb {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
}

.breadcrumb li:not(:last-of-type)::after {
  content: "/";
  margin: 0 0.6em; /* 記号の左右の余白 */
  color: #777; /* 記号の色 */
}

/* ページ送り */
.pagination {
	margin:70px auto 0;
    display: flex;
    justify-content: center;
    font-size: 1.5rem;
    text-align: center;
}
.pagination a:hover {
    background: #2FBDA6;
    color: #fff;
}
.pagination a,
.pagination .current {
    border-radius: 50%;
    padding-top: 4px;padding-top: 0;
    display: inline-block;
    width: 36px;
    height: 36px;
    margin: 0 6px;
}
.pagination .current {
    background: #000;
    color: #fff;
}
.pagination .pagenext{
	 font-size: 1.4rem;
	 padding-top: 2px;
}

/*クエリポイント*/
.pc_non{
		display:none;
	}

@media screen and (max-width: 1024px) {
	.pc_non{
		display: block;
	}
	
}

/*ページ内スクロール調整*/
#report{
	margin-top:-80px;
	padding-top:80px;
}
#ta01,#ta02,#ta03,#ta04,#ta05,#ta06,#ta07{
	margin-top:-80px;
	padding-top:80px;
}
@media screen and (max-width: 1024px) {
#report{
	margin-top:-0px;
	padding-top:0px;
}
#ta01,#ta02,#ta03,#ta04,#ta05,#ta06,#ta07{
	margin-top:-0px;
	padding-top:0px;
}	
	
}