/***********************************************************************
************************************************************************
**********       ここから独自のスタイルを記述する       ****************
************************************************************************
***********************************************************************/

/***********************************************
******************  共通部品  ******************
************************************************/

*, *:before, *:after{
	-webkit-box-sizing: border-box;
	box-sizing: border-box
}

body{
	font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
	color: #333333;
	letter-spacing: 0.1em;
	text-align:justify;
}

h1, h2, h3, h4, h5, h6{
  line-height: 1.2;
}

p{
	line-height: 1.6;
	margin-block-end: 0.7rem;
}

.clear-both{
	clear: both;
}

/*-----------------------------------------
------- ４色カラーバー | ここから ---------
------------------------------------------*/
#color-bar-box{
	margin-top: 2rem;;
}

.color-bars{
	width: 25%;
	padding-bottom: 2rem;
	float: left;
}

#color-barR{
	border-top: 0.2rem solid rgb(192, 0, 0);
}

#color-barB{
	border-top: 0.2rem solid rgb(0, 112, 192);
}

#color-barY{
	border-top: 0.2rem solid rgb(253, 216, 62);
}

#color-barG{
	border-top: 0.2rem solid rgb(29, 150, 105);
}





/*  ややくすんだ方
#color-barR{
	border-top: 0.2rem solid #eb4b5e;
}

#color-barB{
	border-top: 0.2rem solid #4bacea;
}

#color-barY{
	border-top: 0.2rem solid #ebd84b;
}

#color-barG{
	border-top: 0.2rem solid #8ab92a;
}
*/


/*-----------------------------------------
------- ４色カラーバー | ここまで ---------
------------------------------------------*/

/*-----------------------------------------
------------- 色 | ここまで ---------------
------------------------------------------*/
.hot-info{
  /* 黄色と白のグラデーション */
  background: linear-gradient(0deg, rgb(255, 255, 255) 28.21%, rgb(253, 255, 194) 100.00%);
  background: linear-gradient(0deg, rgb(255, 255, 255) 39.48%, rgb(222, 222, 222) 99.36%);
  background: linear-gradient(0deg, rgb(222, 222, 222) 98.00%, rgb(56, 56, 56) 97.58%);
  background: linear-gradient(0deg, rgb(255, 255, 255) 39.48%, rgb(222, 222, 222) 100.00%);
  background: linear-gradient(0deg, rgb(222, 222, 222) 0.00%, rgb(236, 236, 236) 15.17%, rgb(249, 249, 249) 38.89%, rgb(255, 255, 255) 67.64%, rgb(245, 240, 240) 86.32%, rgb(222, 222, 222) 100.00%);
  background: linear-gradient(0deg, rgb(222, 222, 222) 0.00%, rgb(236, 236, 236) 16.95%, rgb(249, 249, 249) 31.77%, rgb(255, 255, 255) 71.20%, rgb(245, 240, 240) 84.54%, rgb(222, 222, 222) 100.00%);
}

/*-----------------------------------------
------------- 色 | ここまで ---------------
------------------------------------------*/




/***********************************************************************************************
************************************************************************************************
************************************************************************************************
************************************************************************************************
************************************************************************************************
***********************************************************************************************/
@media screen and (min-width: 1024px) {
/**************************************
*****  パソコン用のヘッダー ***********
***************************************/

/* そのうち使うかもしれない
#header-spacer{
	margin: 0;
	padding-top: 7.8rem;
}
*/

#ccHeaderArea{
	border-top: solid 0.3rem #191919;
	background-color: #ffffff;
}


/*-----------------------------------------
------- ロゴと名称 | ここから -------------
------------------------------------------*/

.margin-bottom-0-header-container .mb-3{
	margin-bottom: 0 !important;
}

#header-container{
	margin: 0.8rem 0 0.5rem 0;
	text-decoration: none;
	display: table;
}

#header-container a{
	text-decoration: none;
}

#header-logo{
	display: table-cell;
	vertical-align: middle;
}

#header-logo img{
	margin-top: 0.2rem;
	height: 2.5rem;
}

#header-nameplace{
	padding-left: 0.3rem;
	font-weight: bold;
	color: #191919;
	display: table-cell;
	vertical-align: middle;
}

h1#header-name{
	margin-bottom: 0;
	font-size: 1.2rem;
	font-weight: bold;
	line-height: 1.1;
}

#header-NPO{
	font-size: 0.8rem;
}

/*-----------------------------------------
------- ロゴと名称 | ここまで -------------
------------------------------------------*/


/*-----------------------------------------
----- グローバルメニュー | ここから -------
------------------------------------------*/

/*
.header-global-menu{
}


.header-global-menu .container{
}
*/

.header-global-menu .container .mb-3{
	margin-bottom: 0 !important;
}
/*
.header-global-menu .nav-tabs{
}
*/

/* /* nav-itemはタブの各カテゴリのこと。１～６に対して */
.header-global-menu li.nav-item{
	height: 3.6rem;
	padding-top: 0.2rem;
	font-size: 0.8rem;
	border-top: solid 1px #f0f0f0;
	box-shadow: 0px 1px 1px 1px #f0f0f0;
	position: relative;
}
/*
.header-global-menu li.nav-item .active{
}

.header-global-menu .nav-item:nth-child(1){
}
.header-global-menu .nav-item:nth-child(2){
}
.header-global-menu .nav-item:nth-child(3){
}
.header-global-menu .nav-item:nth-child(4){
}
.header-global-menu .nav-item:nth-child(5){
}
.header-global-menu .nav-item:nth-child(6){
}
*/

.header-global-menu .nav-item:nth-child(1)::before{
	font-family: "Font Awesome 6 Free";
	content: "\f015";
	font-weight: 900;
	font-size: 1.3rem;
	color: #4d4d4d;
	position:relative;
	z-index: 2;
}

.header-global-menu .nav-item:nth-child(2)::before{
	font-family: "Font Awesome 6 Free";
	content: "\f0c0";
	font-weight: 900;
	font-size: 1.3rem;
	color: #4d4d4d;
	position:relative;
	z-index: 2;
}

.header-global-menu .nav-item:nth-child(3)::before{
	font-family: "Font Awesome 6 Free";
	content: "\f542";
	font-weight: 600;
	font-size: 1.3rem;
	color: #4d4d4d;
	position:relative;
	z-index: 2;
}

.header-global-menu .nav-item:nth-child(4)::before{
	font-family: "Font Awesome 6 Free";
	content: "\f044";
	font-size: 1.3rem;
	color: #4d4d4d;
	position:relative;
	z-index: 2;
}

.header-global-menu .nav-item:nth-child(5)::before{
	font-family: "Font Awesome 6 Free";
	content: "\f249";
	font-size: 1.3rem;
	color: #4d4d4d;
	position:relative;
	z-index: 2;
}

.header-global-menu .nav-item:nth-child(6)::before{
	font-family: "Font Awesome 6 Free";
	content: "\f0e0";
	font-size: 1.3rem;
	color: #4d4d4d;
	position:relative;
	z-index: 2;
}

/* カテゴリからドロップダウンを出すためのa要素 */
.header-global-menu li.nav-item a.nav-link{
	padding: 2rem 0.2rem 0 0.2rem;
	color: #333333;
	border: none;
	border-radius: 0;
	display: block;
	position: absolute;
	top: 0;
	width: 100%;
	height: 101%;
}

.header-global-menu li.nav-item a.nav-link.depth-0{
	cursor: default;	/* カーソルのリンク型にしない */
}

.header-global-menu li.nav-item a.nav-link.active{
	border-bottom: solid 1px #f0f0f0;
}


.header-global-menu li.nav-item .dropdown-menu{
	padding: 0;
}

.header-global-menu li.nav-item .dropdown-menu a{
	padding-top: 0.6em;
	padding-right: 2.3rem;
	line-height: 3.2;
	border-bottom: solid 1px #f0f0f0;
}

.header-global-menu li.nav-item .dropdown-menu a:first-child{
	border-top: solid 1px #f0f0f0;
}

/* マウスホバーの設定 */
.header-global-menu li.nav-item .dropdown-menu a.dropdown-item:hover,
.header-global-menu li.nav-item .dropdown-menu a.dropdown-item:focus{
	color: #333333;
	background-color: #c5e7fc;
}
.header-global-menu .nav-item:nth-child(1):hover{ /* １行前と関連が高いので、ここまで下げて書いた */
	background-color: #c5e7fc;
}

/* 各ページへのリンク：１階層目 */
.header-global-menu li.nav-item .dropdown-menu a.dropdown-item.depth-1{
	cursor: pointer;	/* カーソルの形状をリンク型にする */
}

/* 各ページへのリンク：２階層目 */
.header-global-menu li.nav-item .dropdown-menu a.dropdown-item.depth-2{
	width: 90%;
	margin-left:10%;
	padding: 0.25rem 1.5rem 0.25rem 0;
}

/*
.header-global-menu li.nav-item .dropdown-menu a.dropdown-item.depth-2 span.px-2:nth-child(2)::after{
	content: "";
}
*/

/* アクティブ状態での設定 */
.header-global-menu li.nav-item .dropdown-menu a.dropdown-item.depth-1.active,
.header-global-menu li.nav-item .dropdown-menu a.dropdown-item.depth-2.active{
	color: #333333;
	background-color: #e8e8e8;
	font-size: 0.9rem;

	pointer-events: none; /* リンクを不活化する */
	cursor: default;	/* カーソルのリンク型にしない */
}

.header-global-menu li.nav-item .dropdown-menu a.dropdown-item.depth-1.active::after,
.header-global-menu li.nav-item .dropdown-menu a.dropdown-item.depth-2.active::after{
	content: "〈 here 〉";
	color: #9c166a;
	padding-left: 0;
}

/*-----------------------------------------
----- グローバルメニュー | ここまで -------
------------------------------------------*/

}/*************************************
***************************************/


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

#footer-wrapper{
	margin-top: 3rem;
	background-color: #303030;
}

#footer-container{
	padding-top: 2.5rem;
	color: #ffffff;
}

.footer-menu-container{
	padding-top: 2rem;
	max-width: 100rem;
	margin: auto;
}

.footer-menu-box{
	margin-bottom: 2rem;
}

.footer-menu-title{
	width: 80%;
	padding-bottom: 0.1rem;
	font-size: 0.9rem;
	border-bottom: 0.1rem solid #696969;
}

.footer-menu-list{
	padding-top: 0.5rem;
}

.footer-menu-list li{
	line-height: 1.8;
}

.footer-menu-list li .small-letter{
	font-size: 0.8rem;
}

.footer-menu-list li a{
	color: #ffffff;
	text-decoration: none;
}

.footer-menu-list li a:hover{
	color: #ffffaa;
	text-decoration: underline;
}

#copyright{
	margin-top: 2rem;
	padding: 1rem 1rem 0.5rem 1rem;
	font-size: 0.8rem;
	text-align: center;
	border-top: 0.1rem solid #696969;
}

#copyright a{
	color: #ffffff;
}

#copyright a:hover{
	text-decoration: underline;
}

footer .mb-3{
	margin-bottom: 0 !important;
}




/***** カウンターここから  ****/

.footer-counter{
	font-size: 0.7rem;
	text-align: center;
	color: #888888;
	background-color: #303030;
	z-index: -1;
}

.footer-counter .card{
	padding: 0.3rem 0 1.5rem 0;
}


/***** カウンターここまで  ****/



/***********************************************
******  フッターにあるページトップに戻る  ******
************************************************/

#page_top{
	width: 50px;
	height: 40px;
	position: fixed;
	right: 15px;
	bottom: 40px;
	opacity: 0.6;
	border-radius: 15px;
	background-color: #00723b;
}

#page_top a{
	position: relative;
	display: block;
	width: 50px;
	height: 40px;
	color: #ffffff;
	text-decoration: none;
	text-align: center;
}

#page_top a::before{
	font-family: "Font Awesome 6 Free";
	content: '\f062';
	font-weight: 900;
	font-size: 1rem;
	color: #ffffff;
	position: absolute;
	width: 25px;
	height: 25px;
	top: 10px;
	bottom: 10px;
	right: 0;
	left: 0;
	margin: auto;
}

/***********************************************
************************************************/


/***********************************************
****************  ページ共通  ******************
************************************************/

/*-----------------------------------------
-------- ページタイトル | ここから --------
------------------------------------------*/

h1.page-title{
	margin-bottom: 4rem;
	padding: 0.8rem 1.4rem;
	color: #ffffff;
	font-size: 1.6rem;
	background-image: url(./images/kyouikunet/common/page-title.png);
	background-repeat: no-repeat;
	background-size: 100%;
}

/*-----------------------------------------
-------- ページタイトル | ここまで --------
------------------------------------------*/

/*-----------------------------------------
------ ページのh1タイトル | ここから ------
------------------------------------------*/

.about-title{
	margin-bottom: 6rem;
	text-align: center;
}

.about-title h1{
	margin: 0rem auto;
	padding: 0.8rem 4rem 0.5rem 4rem;

	color: #333333;
	font-weight: bold;
	text-align: center;

	border: solid 3px #333333;
	border-radius: 4rem;

	display: inline-block;
}

.about-title-short{  /* 固定記事プラグインのソースコード内に追加する */
	margin-bottom: 2rem;
}

/*-----------------------------------------
------ ページのh1タイトル | ここまで ------
------------------------------------------*/


/*-----------------------------------------
-------  パンくずリンク | ここから  -------
------------------------------------------*/

.page-breadcrumb-menu{
	margin-top: 0.5rem;
}

/*
.page-breadcrumb-menu .container{
}

.page-breadcrumb-menu .container .card{
}

.page-breadcrumb-menu .container .card.mb-3{
}

.page-breadcrumb-menu .container .card .card-body{
}

.page-breadcrumb-menu .container .card .card-body nav{
}
*/

.page-breadcrumb-menu .container .card .card-body nav ol.breadcrumb{
	margin-bottom: 0;
	background-color: transparent;
}

.page-breadcrumb-menu .container .card .card-body nav ol.breadcrumb li.breadcrumb-item{
	font-size: 0.7rem;
}

/*
.page-breadcrumb-menu .container .card .card-body nav ol.breadcrumb li.breadcrumb-item a{
}

.page-breadcrumb-menu .container .card .card-body nav ol.breadcrumb li.breadcrumb-item a::before{
}
*/

/*-----------------------------------------
-------  パンくずリンク | ここまで  -------
------------------------------------------*/


/***********************************************
****************   パソコン用  *****************
****************  トップページ  ****************
************************************************/

.Top-class{
}


/* アイキャッチ・カルーセル | ここから */
.top-eyecatch-container-bottom-0{
	margin-bottom: 0;
	padding-bottom: 0;
}

.top-eyecatch{

}

.top-eyecatch .mb-3{
	margin-bottom: 0 !important;
}

.top-eyecatch p{
	margin: 0;
	padding: 0;
}

.top-eycatch img{
	max-width: 1100px;
}

/* アイキャッチ・カルーセル | ここまで */

#top-first-statement{
	margin: 0 0 3rem 0;
	padding: 0.6rem 0.5rem 0.4rem 0.5rem;
	color: white;
	letter-spacing: 0.03em;
	text-align: center;
	background-color: #191919;
}


/* ご案内 | ここから */
.top-titles{
	width: 30%;
	margin: 2rem auto 1rem auto;
	padding: 0.5rem 0.2rem 0.5rem 0.2rem;

	color: #333333;
	font-weight: bold;
	font-size: 1.6rem;
	text-align: center;
	border: solid 3px #333333;
	border-radius: 4rem;
	background-color: #ffffff;
}

.top-titles p{
	margin: 0;
}

/* ポスターの設定 */
.top-event-poster-box .container{
	padding-right: 0;
}

.top-event-poster-box .card{
	padding: 1rem 0.2rem 1rem 0.2rem;
	border: none;
	border-radius: 0;
	background-color: #f1f1f1;
}

/* 記述の設定 */
.top-event-description-box .container{
	/*padding-left: 0;*/
	margin-bottom: 5rem;
	width: 80%;
}

.top-event-description-box .card{
	border: solid 3px #333333;
	border-radius: 0;
	padding: 2rem 3.5rem;
}

.top-event-description-box .card-body p.fluid-text{
	display: inline-block;
	width: 90px;
}

/*
.top-event-description-box .card-body img{
	max-width: 100px;
	max-height: 100px;
	margin: auto 10px auto 0;
}
*/

.top-event-description-box .card-body p.fluid-text +p{
	display: inline-block;
	vertical-align: top;
	max-width: 625px;
}

.top-event-description{
	padding: 1rem;
}

/* ボタンの設定 */
.top-event-detail a{
	padding: 0.5rem 1.2rem;
	color: #ffffff;
	font-weight: bold;
	border-radius: 10px;
	background-color: #eb4b5e;
}

.top-event-detail a:hover {
	background-color: #d37800;
	text-decoration: none;
}

/* ご案内 | ここまで */


/* 新着情報 | ここから*/
.top-whats-new h1.card-header{
	width: 50%;
	margin: 2rem auto 0rem auto;
	padding: 0.5rem 0.2rem 0.5rem 0.2rem;

	color: #333333;
	font-weight: bold;
	font-size: 1.4rem;
	text-align: center;
	border: solid 2px #333333;
	border-radius: 4rem;
	background-color: #ffffff;
}

.top-whats-new dl{
	padding-top: 1rem;
	border-top: dotted 1px #cccccc;
}


.top-whats-new dt{  /* 時間 */
	padding-top: 0.5rem;
	font-size: 0.8rem;
}

.top-whats-new dd:nth-child(2n){  /* タイトル */
	font-size: 1.1rem;
}

.top-whats-new dd:nth-child(3n){  /* 投稿者 */
	font-size: 0.7rem;
	text-align: right;
	border-bottom: dotted 1px #cccccc;
}

.top-whats-new .badge,
.plugin-blogs .badge{
	font-weight: normal;
}

/* 新着情報 | ここまで*/


/* Pick up | ここから*/
.top-pick-up h1.card-header{
	width: 50%;
	margin: 2rem auto 0rem auto;
	padding: 0.5rem 0.2rem 0.5rem 0.2rem;

	color: #333333;
	font-weight: bold;
	font-size: 1.4rem;
	text-align: center;
	border: solid 2px #333333;
	border-radius: 4rem;
	background-color: #ffffff;
}

.top-pick-up h1.card-header:before,
.top-pick-up h1.card-header:after{
	font-family: "Font Awesome 6 Free";
	content: "\f058";
	font-weight: 900;

	color: #4178e3;
	font-size: 0.9rem;
}

.top-pick-up .card-body{
	margin-top: 1.9rem;
	padding: 1.25rem 2rem 2rem 2rem;
	border-top: dotted 1px #cccccc;
}


/* Pick up | ここまで*/

/* 協育アドバイザーネットについて | ここから*/

.top-kyouiku-net{
	margin-bottom: 6rem;
}

.top-kyouiku-net .card-body{
	text-align: center;
	border-top: solid 26px #777777;
	border-bottom: solid 26px #777777;
	background-color: #ffffff;
}

.top-kyouiku-net img{
	width: 100%;
}

.top-kyouiku-net-title{
	width: 70%;
	margin: 2rem auto 2rem auto;
	padding: 1rem 0rem 0.7rem 0rem;
	font-size: 1.6rem;
	font-weight: bold;
	border: solid 2px #333333;
	border-radius: 4rem;
}

.top-our-activites{
	margin-bottom: 2rem;
}

.top-our-activities a{

	padding: 0.6rem 1.2rem;
	color: #ffffff;
	border-radius: 10px;
	background-color: #4178e3;
}

.top-our-activities a:hover {
	background-color: #4bacea;
	text-decoration: none;
}

/* 協育アドバイザーネットについて | ここまで*/


/* ねがい | ここから*/

.top-hope{
	margin-bottom: 6rem;
	text-align: center;
	border: solid 1px #191919;
	background-color: #ffffff;
}

.top-hope h4{
	margin: 5rem auto 3rem auto;
	font-weight: bold;
	font-size: 2rem;
}

.top-hope p{
	margin-bottom: 2rem;
	font-size: 1.4rem;
	line-height: 2.5;
}

.top-hope img{
	width: 100%;
}

/* ねがい | ここまで*/


.top-intro-movie .top-movie-title{

}



/***********************************************
************************************************
**************   団体情報   ********************
************************************************
************************************************/

/*------------------------------------------
-------- Aboutページ共通 | ここから --------
-------------------------------------------*/

.about-common-class .container{
	padding-bottom: 3rem;
	background-color: #fafafa;
}


.about-common-class .card{
	width: 91.67%;
	margin: auto;
	padding: 1rem 5rem 3rem 5rem;
	border: solid 3px #333333;
}

.about-common-class .card-body{
	padding: 4rem;
	background-color: #ffffff;
}


/* h1.about-title は全ページ共通にある */

.about-common-class h2{	/* 強調した見出し */
	margin-bottom: 2.5rem;
	padding: 1.9rem 1rem 1.7rem 1rem;

	color: #333333;
	font-weight: bold;
	font-size: 1.3rem;

	border: none;
	border-top: solid 6px #777777;
	border-bottom: solid 6px #777777;
	background-color: #fafafa;
}

.about-common-class h3{	/* 強調のない見出し */
	font-size: 1.4rem;
}

.about-common-class h6{
	margin-bottom: 5px;
	font-size: 12px;
}

.about-common-class p{
	line-height: 1.8;
}


/*------------------------------------------
-------- Aboutページ共通 | ここまで --------
-------------------------------------------*/


/***********************************************
**************   団体概要   ********************
************************************************/

.about-outline-table td:first-child{
	width: 130px;
	background-color: #fbfbfb;
}


/***********************************************
*************   代表者ご挨拶   *****************
************************************************/

.about-greeting .representative{
	margin-bottom: 2.5rem;
	width: 100%;
	display: table;
	background: linear-gradient(65deg, #f3f3f3, #f2f7ff 65%, #fafafa 80%, #e0ecff);
}

.about-greeting .person{
	display: table-cell;
	vertical-align: middle;
}

.about-greeting .person:first-child{
	width: 130px;
}


/***********************************************
******************   沿革   ********************
************************************************/

.about-history-table td:first-child{
	width: 100px;
	background-color: #fbfbfb;
}


/***********************************************
*****************   理 念   ********************
************************************************/


.about-philosophy-strong{
	font-size: 2.1rem;
	background-color: #fbffb2;
}


/***********************************************
****************     活動方針    ***************
************************************************/

/* なし */


/***********************************************
***************     事業概要     ***************
************************************************/

.about-business-outline h2::before{
	font-family: "Font Awesome 6 Free";
	content: "\f111";
	font-size: 1.8rem;
	font-weight: 900;
	margin-right: 0.5em;
}

.about-business-outline h2.about-a::before{
	color: #e37641;
}

.about-business-outline h2.about-b::before{
	color: #4178e3;
}

.about-business-outline h2.about-c::before{
	color: #e3e241;
}


/***********************************************
*************  事業計画/事業報告    ************
************************************************/

.about-business-plan-and-report h2,
.about-regular-general-meeting h2{	/* 強調した見出し */
	margin-bottom: 2.5rem;
	padding: 1.2rem 1rem 0.9rem 1rem;

	font-size: 1.3rem;

	border: solid 1px #eeeeee;
	border-top: solid 2px #555555;
	border-left: solid 10px #555555;
}

/***********************************************
*************      定期総会     ****************
************************************************/

/* 事業計画/事業報告と同じ */


/***********************************************
**************   設立趣旨書   ******************
************************************************/

.about-purpose .container{
	padding-bottom: 3rem;
	background-color: #fafafa;
}


.about-purpose .card{
	width: 91.67%;
	margin: auto;
	padding: 5rem 6rem 6rem 6rem;
	border: solid 3px #333333;
}

.about-purpose .name-purpose{
	font-size: 1.6rem;
	line-height: 1.3;
}

.about-purpose h1{
	margin: 0 0 1rem 0;
	padding: 0;
	border: 0;
	background-color: transparent;
}

.about-purpose h2{
	margin: 0 0 1rem 0;
	padding: 0;
	border: 0;
	background-color: transparent;
}


/***********************************************
************************************************
**************   活動内容   ********************
************************************************
************************************************/

/***********************************************
**************   活動内容共通   ****************
************************************************/

/*------------------------------------------
-------- activitiesページ共通 | ここから --------
-------------------------------------------*/

.activities-common-class .container{
	padding-bottom: 3rem;
	background-color: #fafafa;
}


.activities-common-class .card{
	width: 91.67%;
	margin: auto;
	padding: 1rem 6rem 6rem 6rem;
	border: solid 3px #333333;
}

.activities-common-class .card-body{
	padding: 4rem;
	padding-bottom: 2rem;
	background-color: #ffffff;
}


/* h1タイトルはページ共通にある */

.activities-common-class h2{	/* 強調した見出し */
	margin-bottom: 2.5rem;
	padding: 1.9rem 1rem 1.7rem 1rem;

	color: #333333;
	font-weight: bold;
	font-size: 1.3rem;

	border: none;
	border-top: solid 6px #777777;
	border-bottom: solid 6px #777777;
	background-color: #fafafa;
}

.activities-common-class h3{	/* 強調のない見出し */
	font-size: 1.4rem;
}

.activities-common-class h6{
	margin-bottom: 5px;
	font-size: 12px;
}

.activities-common-class p{
	line-height: 1.8;
}

/*------------------------------------------
----- activitiesページ共通 | ここまで ------
-------------------------------------------*/


/***********************************************
**************   主な活動   ********************
************************************************/

.activities-common-class h2.higher{
	border-top: solid 6px #e37641;
	border-bottom: solid 6px #e37641;
	background-color: #fff2ed;
}

.activities-common-class h2.expand{
	border-top: solid 6px #4178e3;
	border-bottom: solid 6px #4178e3;
	background-color: #edfaff;
}

.activities-common-class h2.connect{
	border-top: solid 6px #e3e241;
	border-bottom: solid 6px #e3e241;
	background-color: #ffffed;
}

.activity-examples{
margin-top: 8rem;
padding-top: 5rem;
border-top: solid 2px #555555;
}


/***********************************************
********   A.高まろう～C.繋げよう   ************
************************************************/


.about-title h1.higher-h1{
	width: 100%;
	color: #333333;
	border: solid 6px #e37641;
	background-color: #fff2ed;
	line-height: 0.9;
}

.about-title h1.expand-h1{
	width: 100%;
	color: #333333;
	border: solid 6px #4178e3;
	background-color: #edfaff;
	line-height: 0.9;
}

.about-title h1.connect-h1{
	width: 100%;
	color: #333333;
	border: solid 6px #e3e241;
	background-color: #ffffed;
	line-height: 0.9;
}

.about-title .subtitle-h1{
	font-size: 1.4rem;
}

/* h2見出しは「主な活動」を流用している */


/***********************************************
*******  活動ブログ・事務局からのお知らせ  *****
************************************************/

.blog-common-class .container{
	padding-bottom: 3rem;
	background-color: #fafafa;
}

.blog-common-class .card{
	width: 91.67%;
	margin: auto;
	padding: 2rem 6rem 3rem 6rem;
	border: solid 3px #333333;
}


.blog-common-class .card-body{
	padding: 3rem;
	background-color: #ffffff;
}

.blog-common-class .card-body article{
	margin-bottom: 0;
	padding: 3rem 1.8rem 1.5rem 1.8rem;
	border-bottom: solid 3px #333333;
	background:
		linear-gradient(135deg, rgba(192, 0, 0, 0.7) 1.5rem, transparent 0)
}

.blog-office-mark .card-body article{
	background:
		linear-gradient(135deg, rgba(58, 204, 46, 1.0) 1.5rem, transparent 0)
}

.blog-common-class .card-body article:first-child{
	border-top: solid 3px #444444;
}

.plugin-blogs header{
	margin-bottom: 2rem;
	padding-bottom: 1rem;
	border-bottom: dotted 1px #cccccc;
}

.plugin-blogs header h2{
	margin-bottom: 1.5rem;
	font-weight: bold;
}

.plugin-blogs header b{
	padding-left: 1rem;
	font-size: 0.8rem;
}

.plugin-blogs header b::before{
	content:"（";
}

.plugin-blogs header b::after{
	content:"）";
}

.plugin-blogs footer.row .mb-1{
	padding-bottom: 2rem !important;
}


/***********************************************
************************************************
**************   会報/実施報告   ***************
************************************************
************************************************/

/***********************************************
******************    会報     *****************
************************************************/

.newsletter-class .card{
	border: solid 3px #333333;
}

.newsletter-class .card-body{
	padding: 0;
	background-image: url(./images/kyouikunet/newsletter/bg-newsletter.png);
	background-repeat: no-repeat;
	background-size: cover;
}

.newsletter-class h1{
	margin-top: 4rem;
	background-color: #ffffff;
}

.newsletter-class .news-description{
	width: 80%;
	margin: 0 auto;
	padding: 1rem;
	background-color: #ffffff;

}

.newsletter-shelf h1.card-header{
	color: #333333;
	font-weight: bold;
	background-image: url(images/kyouikunet/newsletter/year-label.png);
	background-repeat: no-repeat;
	background-size: cover;
}

.newsletter-shelf h1.card-header::before{
	font-family: "Font Awesome 6 Free";
	content: '\f773';
}


/***********************************************
******   デザイン実践交流会・受託事業     ******
************************************************/

/*------------------------------------------
-------- タブの設定 | ここから -------------
-------------------------------------------*/

.report-tab .container{
	width: 90%;
}

.report-tab .container .mb-3{
	margin-bottom: 0 !important;
}

.report-tab a.nav-link{
	padding-left: 1.5rem;
	padding-right: 1.5rem;
	color: #333333;
	border: solid 1px #333333;
}

.report-tab a.nav-link:hover{
	color: #333333;
	border: solid 1px #333333;
	background-color: #c5e7fc;
}

.report-tab a.nav-link.active{
	color: #ffffff;
	border: solid 1px #333333;
	background-color: #001e3d;
}

/*------------------------------------------
-------- タブの設定 | ここまで -------------
-------------------------------------------*/

/*------------------------------------------
-------- 実践報告の内容 | ここから ---------
-------------------------------------------*/

.report-common .container{
	padding-bottom: 3rem;
	background-color: #fafafa;
}

.report-common .card{
	width: 91.67%;
	margin: auto;
	padding: 1rem 6rem 6rem 6rem;
	border: solid 3px #333333;
}

.report-common h1.card-header{
	color: #ffffff;
	border: none;
	background-color: #ffffff;
}

.report-common .card-body h1{
	width: 95%;
	margin: 3rem auto 6rem auto;
	font-size: 2.2rem;
	font-weight: bold;
	text-align: center;
	line-height: 1.5;

	padding: 2rem 0.5rem 1.5rem 0.5rem;
	border-top: solid 6px #444444;
	border-bottom: solid 6px #444444;
}

.report-common .card-body h1 .subtitle{
	font-size: 1.4rem;
}

.report-common h2{	/* 強調した見出し */
	margin-bottom: 3rem;
	padding: 0.6em 0.5em 0.4em 0.5em;

	font-size: 1.5rem;
	font-weight: bold;

	border: solid 1px #cccccc;
	border-left: solid 10px #469bff;
}

.report-common h3{	/* 強調のない見出し */
	font-size: 1.5rem;
	font-weight: bold;
}

.report-common h4{
}

.report-common h5{
}

.report-common h6{
	margin-bottom: 5px;
	font-size: 12px;
}

.report-common p{
	line-height: 1.8;
}


/*------------------------------------------
-------- 実践報告の内容 | ここまで ---------
-------------------------------------------*/

/*------------------------------------------
-------- リンクメニュー | ここから ---------
-------------------------------------------*/

.report-tab-menu .container{
	width: 91.67%;
}

.report-tab-menu h1.card-header{
	color: #f0f0f0;
	background-color: #f0f0f0;
}

.report-tab-menu a.list-group-item{
	padding-top: 1rem;
	padding-bottom: 1rem;
	color: #333333;
}

.report-tab-menu a.list-group-item:hover{
	padding-top: 1rem;
	padding-bottom: 1rem;
	text-decoration: none;
	background-color: #c5e7fc;
}

.report-tab-menu a.list-group-item.depth-0::after{
	content: "（→ 会報ページへ）";
	font-size: 0.9rem;
}

.report-tab-menu a.list-group-item.depth-1{
	padding-top: 0.8rem;
	padding-bottom: 0.8rem;
	padding-left:2rem;
	color: #ffffff;
	font-size: 1rem;
	background-color: #001e3d;

	pointer-events: none; /* リンクを不活化する */
	cursor: default;	/* カーソルのリンク型にしない */
}

.report-tab-menu a.list-group-item.depth-2::before{
	font-family: "Font Awesome 6 Free";
	content: '\f138';
	color: #4178e3;
	font-weight: 900;
	padding-left:4rem;
}

.report-tab-menu a.list-group-item.depth-2.active{
	border: solid 1px #cccccc;
	background-color: #e8e8e8;
	pointer-events: none; /* リンクを不活化する */
	cursor: default;	/* カーソルのリンク型にしない */
}

.report-tab-menu a.list-group-item.depth-2.active::after{
	content: "〈here〉";
	color: #9c166a;
	font-size: 1.1rem;
}

.report-tab-menu a.list-group-item.depth-2 span.px-2{
	padding: 0 !important;
}

/*------------------------------------------
-------- リンクメニュー | ここまで ---------
-------------------------------------------*/


/***********************************************
***************    製作ビデオ     **************
************************************************/

/*------------------------------------------
-------- 動画一覧ページ | ここから ---------
-------------------------------------------*/

.movies-shelf .img-box{
	background-color: #191919;
}

.movies-shelf .img-box:hover{
    opacity: 0.6;
}

.movies-shelf .type-box{
	background-color: #eeeeee;
}

.movies-shelf .type-box a{
	background-color: #eeeeee;
	display: block;
	width: 100%;
	height: 100%;
}

.movies-shelf .movie-title-box{
	border: solid 1px #eeeeee;
	background-color: #ffffff;

	height: 8em;
	display: block;
	overflow: hidden;
	text-overflow: ellipsis;
}

.movies-shelf .release-date-box{
	padding: 0;
	font-size: 0.8rem;
	text-align: right;
	background-color: #ffffff;
}

.movies-shelf .release-date-box p{
	margin: 0;
}

/*------------------------------------------
-------- 動画一覧ページ | ここまで ---------
-------------------------------------------*/

/*------------------------------------------
-------- 動画個別ページ | ここから ---------
-------------------------------------------*/

.movie-detail .container{
	padding-bottom: 3rem;
	background-color: #fafafa;
}

.movie-detail .card{
	width: 91.67%;
	margin: auto;
	padding: 3rem 6rem 2rem 6rem;
}

.movie-detail-table td{
	padding: 1rem 2rem 0.5rem 2rem;
}

.movie-production-date-box-detail{
	font-size: 0.9rem;
}

td.movie-title-box-detail{
	padding-top: 1.3rem;
	padding-bottom: 1.2rem;
	font-size: 1.1rem;
	font-weight: bold;
	background-color: #fafafa;
}

td.movie-title-box-detail .subtitle{
	font-size: 0.9rem;
}

.movie-player-box-detail{
	text-align: center;
}

td.release-date-box-detail{
	padding: 0;
	font-size: 0.8rem;
	text-align: right;
}

.release-date-box-detail p{
	margin: 0;
}

/*------------------------------------------
-------- 動画個別ページ | ここまで ---------
-------------------------------------------*/


/***********************************************
***************    協育を学ぶ     **************
************************************************/

.study-kyouiku .container{
	padding-bottom: 3rem;
	background-color: #fafafa;
}


.study-kyouiku .card{
	width: 91.67%;
	margin: auto;
	padding: 1rem 6rem 4rem 6rem;
	border: solid 3px #333333;
}

.study-kyouiku .card-body{
	margin: 2rem;
	padding: 2rem 2rem 1rem 2rem;
}


/* h1タイトルのオリジナルはページ共通にある */

.study-kyouiku h1{	/* タイトル */
	font-size: 2.5rem;
	font-weight: bold;
	line-height: 1.5;
}

.study-kyouiku h2 {
	margin-bottom: 3rem;
	font-size: 1.4rem;
	padding: 1.5rem 2rem 1.2rem 0;

	padding-left: 4.5em;
	text-indent: -3em;

	border: none;
	background-color: rgba(178, 216, 255, 0.4);
	position: relative;
}

.study-kyouiku h2:before{
	content: '';
	position: absolute;
	top: -10px;
	left: -8px;
	width: 5%;
	height: 30%;
	background-color: rgba(255, 178, 178, 0.6);
	transform:rotate(7deg);
}

.study-kyouiku h2:after{
	content: '';
	position: absolute;
	top: -3px;
	left: -2px;
	width: 5%;
	height: 30%;
	background-color: rgba(248, 255, 178, 0.8);
	transform:rotate(5deg);
}

.study-kyouiku  h5{
	margin-bottom: 1rem;
	border-bottom: solid 1px #0072bc;
}

.study-kyouiku  h5:before{
	font-family: "Font Awesome 6 Free";
	content: "\f058";
	color: #0072bc;
	font-weight: 900;
	font-size: 1.2rem;
	padding-right: 0.2em;
}


/***********************************************
********  先進事例、資料/文献のリスト    *******
************************************************/

.literature-style .container{
	padding-bottom: 3rem;
	background-color: #fafafa;
}

.literature-style .card{
	width: 91.67%;
	margin: auto;
	padding: 1rem 6rem 2rem 6rem;
	border: solid 3px #333333;
}

.literature-style .card-body{
	margin: 2rem;
	padding: 2rem 2rem 1rem 2rem;
}

/* h1タイトルのオリジナルはページ共通にある */

.literature-style h1{
	font-size: 1.8rem;
	font-weight: bold;
	line-height: 1.5;
}

.literature-style h2{	/* 強調した見出し */
	margin-bottom: 2rem;
	padding: 1.1rem;
	font-size: 1.1rem;
	font-weight: bold;
	line-height: 1.6;
	border: none;
	background-color: #f4f4f4;
}

.literature-style h3{  /* 強調のない見出し */
	font-size: 1.1rem;
	font-weight: bold;
	line-height: 1.6;
}

.literature-style h6{
	margin-bottom: 5px;
	font-size: 12px;
}


/***********************************************
********  教育委員会へのリンクリスト    ********
************************************************/

.link-style .container{
	padding-bottom: 3rem;
	background-color: #fafafa;
}


.link-style .card{
	width: 91.67%;
	margin: auto;
	padding: 1rem 6rem 2rem 6rem;
	border: solid 3px #333333;
}

.link-style .card-body{
	margin: 2rem;
	padding: 2rem 2rem 1rem 2rem;
}


/* h1タイトルのオリジナルはページ共通にある */

.link-style h1{
	font-size: 1.8rem;
	font-weight: bold;
	line-height: 1.5;
}

.link-style .list-height{
	padding: 0.5rem 0;
}


/***********************************************
********    お問い合わせ＆会員登録     *********
************************************************/

.modal-content{
	padding: 2rem;
}

.myForm .container{
	padding-bottom: 3rem;
	background-color: #fafafa;
}

.myForm .card{
	width: 91.67%;
	margin: auto;
	padding: 1rem 6rem 3rem 6rem;
}

.myForm .card-body{
	padding: 0rem 2.5rem;
}

.myForm .form-group{
	margin-top: 3rem;
}

.myForm .card-header{
	color: #ffffff;
	background-color: #444444;
}

.myForm strong.badge-danger{
	font-size: 70%;
	font-weight: normal;
	background-color: #bc5a5c;
}

.myForm button.btn.btn-primary{
	margin-top: 2rem;
	padding: 0.5rem 1.1rem;
	letter-spacing: 0.1em;
	background-color: #0072BC;
}

.myForm button.btn.btn-primary:hover{
	background-color: #005B96;
}



/***********************************************
*******    事務局の部屋のサイトマップ    *******
************************************************/

.office-sitemap .container{
	/*width: 70%;*/
}

.office-sitemap .card-body nav > ul{ /*  カテゴリ */
	margin: 1rem 0;
	border: solid 2px #555555;
}

.office-sitemap .card-body nav > ul > li > ul{ /* depth-1 */
	margin: 1rem 0;
	border: solid 2px #cccccc;
}

.office-sitemap ul a{
	padding-top: 0.8rem;
	padding-bottom: 0.8rem;
	color: #333333;
	display: block;
}

.office-sitemap ul a:hover{
	text-decoration: none;
	background-color: #c5e7fc;
}

.office-sitemap ul a.depth-0{
	font-size: 1.6rem;
	font-weight: bold;
}

.office-sitemap ul a.depth-1{
	font-size: 1.2rem;
	font-weight: bold;
}

.office-sitemap ul a.depth-2{
	font-size: 1rem;
	border-top: solid 1px #cccccc;
}




/***********************************************************************************************
************************************************************************************************
************************************************************************************************
************************************************************************************************
************************************************************************************************
***********************************************************************************************/
@media screen and (max-width: 575px) {
/* 350px以上で意図通りに見える */
/***********************************************
*************  スマートフォン用 ****************
****************  ページ共通  ******************
************************************************/

/*-----------------------------------------
-------- Webサイト名 | ここから -----------
------------------------------------------*/

.navbar-brand{
	margin-right: 0;
	font-size: 0.68rem;
}

/*-----------------------------------------
-------- Webサイト名 | ここまで -----------
------------------------------------------*/


/*-----------------------------------------
-------- ページタイトル | ここから --------
------------------------------------------*/

h1.page-title{
	font-size: 1.2rem;
}

/*-----------------------------------------
-------- ページタイトル | ここまで --------
------------------------------------------*/


/*-----------------------------------------
------ ページのh1タイトル | ここから ------
------------------------------------------*/

.about-title{
	margin-bottom: 3rem;
}

.about-title h1{
	padding-bottom: 0.7rem;
	font-size: 1.3rem;
}

.about-title-short{  /* 固定記事プラグインのソースコード内に追加する */
	margin-bottom: 2rem;
}

/*-----------------------------------------
------ ページのh1タイトル | ここまで ------
------------------------------------------*/


/**************************************
*****  スマートフォン用のヘッダー *****
***************************************/

#header-container{
	margin: 1rem auto 0 auto;
	text-align: center;
}

#header-container a{
	text-decoration: none;
}

#header-logo img{
	padding-bottom: 0.6rem;
}

#header-logo img{
	height: 4rem;
}

#header-nameplace{
	font-weight: bold;
	color: #000000;
}

/*-----------------------------------------
------- 囲み枠 | ここから -----------------
------------------------------------------*/
#header-nameplace{
  position: relative;
  padding: 0.25em 1em 0.65em 1em;
  border-top: solid 2px black;
  border-bottom: solid 2px black;
}

#header-nameplace:before, #header-nameplace:after {
  content: '';
  position: absolute;
  top: -7px;
  width: 2px;
  height: -webkit-calc(100% + 14px);
  height: calc(100% + 14px);
  background-color: black;
}

#header-nameplace:before {
  left: 7px;
}

#header-nameplace:after {
  right: 7px;
}
/*-----------------------------------------
------- 囲み枠 | ここまで -----------------
------------------------------------------*/

h1#header-name{
	font-size: 1.1rem;
	font-weight: bold;
}

#header-container p, h1{
	line-height: 1.9rem;
}

#header-NPO{
	font-size: 0.9rem;
}


.to-office{
	margin: 0.5rem auto 0 auto;
	padding: 0;
	width: 60%;
}

.to-office .card-body a{
	text-align: center;
	color: darkslategray;
	text-decoration: underline;
	background-color: mintcream;
}


/**************************************
***************************************/



/***********************************************
*************   スマートフォン用  **************
****************  トップページ  ****************
************************************************/

#top-first-statement{
	text-align: left;
}

/* ご案内 | ここから */
.top-titles{
	width: 70%;
}

/* ポスター（左）の設定 */
.top-event-poster-box .container{
	padding-right: 15px;
}


/* 記述（右）の設定 */
.top-event-description-box .container{
	padding-left: 15px;
}

.top-event-description-box .container{
	margin-bottom: 5rem;
	width: 100%;
}

.top-event-description-box .card{
	border-radius: 0;
	padding: 0rem;
}

.top-event-description-box .card-body p.fluid-text{
  width: 100%;
  text-align: center;
}

.top-event-description{
	padding: 1rem;
}

/* ご案内 | ここまで */


/* Pick up | ここから*/
.top-pick-up h1.card-header{
	width: 70%;
}

/* Pick up | ここまで*/



/* 協育アドバイザーネットについて | ここから*/

.top-kyouiku-net{
	margin-bottom: 3rem;
}

.top-kyouiku-net .card-body{
	border-top: solid 13px #777777;
	border-bottom: solid 13px #777777;
}

.top-kyouiku-net .card-body p{
	text-align: left;
}

.top-kyouiku-net-title{
	width: 100%;
	margin: 0.5rem auto 2rem auto;
	padding: 0.5rem 0rem 0.3rem 0rem;
	font-size: 0.8rem;
	text-align: center;
	border-radius: 1rem;
}

/* 協育アドバイザーネットについて | ここまで*/


/* ねがい | ここから*/
.top-hope{
	margin-bottom: 2rem;
}

.top-hope h4{
	font-size: 1.4rem;
}

.top-hope p{
	font-size: 1rem;
	line-height: 2;
}

/* ねがい | ここまで*/

/**************************************
***************************************/


/***********************************************
*************   スマートフォン用  **************
****************  団体情報  ********************
************************************************/

/*------------------------------------------
-------- Aboutページ共通 | ここから --------
-------------------------------------------*/

.about-common-class .container{
	padding-bottom: 0rem;
}

.about-common-class .card{
	width: 100%;
	padding: 15px;
}

.about-common-class .card-body{
	padding: 0rem;
}


/* h1.about-title は全ページ共通にある */

.about-common-class h2{	/* 強調した見出し */
	margin-bottom: 2.5rem;
	padding: 1.9rem 1rem 1.7rem 1rem;

	color: #333333;
	font-weight: bold;
	font-size: 1.3rem;

	border: none;
	border-top: solid 6px #777777;
	border-bottom: solid 6px #777777;
	background-color: #fafafa;
}

.about-common-class h3{	/* 強調のない見出し */
	font-size: 1.4rem;
}

.about-common-class h6{
	margin-bottom: 5px;
	font-size: 12px;
}

.about-common-class p{
	line-height: 1.8;
}


/*------------------------------------------
-------- Aboutページ共通 | ここまで --------
-------------------------------------------*/


/***********************************************
**************   団体概要   ********************
************************************************/

.about-outline-table td:first-child{
	width: auto;
}


/***********************************************
*************   代表者ご挨拶   *****************
************************************************/

.about-greeting .representative{
	margin-bottom: 2.5rem;
	width: 100%;
	display: table;
	background: linear-gradient(65deg, #f3f3f3, #f2f7ff 65%, #fafafa 80%, #e0ecff);
}

.about-greeting .person{
	display: table-cell;
	vertical-align: middle;
}

.about-greeting .person:first-child{
	width: auto;
}

.about-greeting .person:nth-child(2){
	padding-left: 0.5rem;
}


/***********************************************
******************   沿革   ********************
************************************************/

.about-history-table td:first-child{
	font-size: 0.7;
	width: 88px;
}


/***********************************************
*****************   理 念   ********************
************************************************/


.about-philosophy-strong{
	font-size: 1.6rem;
}


/***********************************************
****************     活動方針    ***************
************************************************/

/* なし */


/***********************************************
***************     事業概要     ***************
************************************************/

.about-business-outline h2::before{
	font-size: 1.4rem;
}

/***********************************************
*************  事業計画/事業報告    ************
************************************************/


/***********************************************
*************      定期総会     ****************
************************************************/

/* 事業計画/事業報告と同じ */


/***********************************************
**********      個人情報の保護     *************
************************************************/

.policy-title{
	margin: 2rem;
	font-size: 1.3rem;
}


/***********************************************
**************   設立趣旨書   ******************
************************************************/


.about-purpose .name-purpose{
	font-size: 1.2rem;
	line-height: 1.3;
}

.about-purpose h1{
	font-size: 1.6rem;
}

.about-purpose h2{
	margin: 0 0 1rem 0;
	padding: 0;
	font-size: 1.1rem;
	border: 0;
	background-color: transparent;
}


/***********************************************
************************************************
************   スマートフォンの   **************
**************     活動内容   ******************
************************************************
************************************************/

/***********************************************
**************   活動内容共通   ****************
************************************************/

/*------------------------------------------
-------- activitiesページ共通 | ここから --------
-------------------------------------------*/

.activities-common-class .container{
	padding-bottom: 0rem;
}

.activities-common-class .card{
	width: 100%;
	padding: 15px;
}

.activities-common-class .card-body{
	padding: 0;
}


/*------------------------------------------
----- activitiesページ共通 | ここまで ------
-------------------------------------------*/


/***********************************************
**************   主な活動   ********************
************************************************/

.activities-common-class h1{
	padding: 0.8rem 3rem 0.6rem 3rem;
}


/***********************************************
********   A.高まろう～C.繋げよう   ************
************************************************/


.about-title h1.higher-h1{
	padding: 1rem;
}

.about-title h1.expand-h1{
	padding: 1rem;
}

.about-title h1.connect-h1{
	padding: 1rem;
}

.about-title .subtitle-h1{
	font-size: 0.8rem;
}

/* h2見出しは「主な活動」を流用している */


/***********************************************
*******  活動ブログ・事務局からのお知らせ  *****
************************************************/

.blog-common-class .container{
	padding-bottom: 0rem;
}

.blog-common-class .card{
	width: 100%;
	padding: 15px;
}

.blog-common-class .card-body{
	padding: 2rem 0;
}

.blog-common-class .card-body article{
	margin-bottom: 0;
	padding: 2rem 1rem;
}

.plugin-blogs header h2{
	font-size: 1.3rem;
	font-weight: bold;
}

.plugin-blogs footer.row .mb-1{
	padding-bottom: 1rem !important;
}


/***********************************************
************************************************
**************   会報/実施報告   ***************
************************************************
************************************************/

/***********************************************
******************    会報     *****************
************************************************/

.newsletter-class .news-description{
	width: 95%;
}


/***********************************************
******   デザイン実践交流会・受託事業     ******
************************************************/

/*------------------------------------------
-------- タブの設定 | ここから -------------
-------------------------------------------*/

.report-tab .container{
	width: 100%;
}

.report-tab li.nav-item{
	width: 100%;
	display: block;
}

.report-tab a.nav-link{
	padding-left: 0.5rem;
	padding-right: 0.5rem;
}

/*------------------------------------------
-------- タブの設定 | ここまで -------------
-------------------------------------------*/

/*------------------------------------------
-------- 実践報告の内容 | ここから ---------
-------------------------------------------*/

.report-common .container{
	padding-bottom: 0;
}

.report-common .card{
	width: 100%;
	padding: 15px;
}

.report-common .card-body{
	padding: 0;
}

.report-common h1.card-header{
	color: #ffffff;
	font-size: 0.2rem;
	border: none;
	background-color: #ffffff;
}

.report-common .card-body h1{
	font-size: 1.2rem;
	margin-bottom: 4rem;
	padding-top: 1rem;
	padding-bottom: 0.7rem;
}

.report-common .card-body h1 .subtitle{
	font-size: 1.1em;
}

.report-common h2{	/* 強調した見出し */
	margin-bottom: 2.5rem;
	font-size: 1.2rem;
}

.report-common h3{	/* 強調のない見出し */
	font-size: 1.3rem;
}

.report-common h4{
}

.report-common h5{
}

.report-common h6{
	margin-bottom: 5px;
	font-size: 12px;
}

.report-common p{
	line-height: 1.8;
}


/* YouTubeの埋め込み対応｜ここから */
.report-common .player{
	position: relative;
	width: 100%;
	padding-top: 56.25%;
}

.report-common .player iframe{
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	height: 100%;
}
/* YouTubeの埋め込み対応｜ここまで */


/*------------------------------------------
-------- 実践報告の内容 | ここまで ---------
-------------------------------------------*/

/*------------------------------------------
-------- リンクメニュー | ここから ---------
-------------------------------------------*/

.report-tab-menu .container{
	width: 100%;
}

.report-tab-menu a.list-group-item.depth-0::after{
	content: "（→ 会報ページへ）";
	font-size: 0.8rem;
}

.report-tab-menu a.list-group-item.depth-1{
	padding-left: 0.25rem;
}

.report-tab-menu a.list-group-item.depth-2::before{
	padding-left: 0;
}

/*------------------------------------------
-------- リンクメニュー | ここまで ---------
-------------------------------------------*/


/***********************************************
***************    製作ビデオ     **************
************************************************/

/*------------------------------------------
-------- 動画一覧ページ | ここから ---------
-------------------------------------------*/

.movies-shelf .type-box{
	padding: 0;
}

.movies-shelf .movie-title-box{
	height: auto;
}


/*------------------------------------------
-------- 動画一覧ページ | ここまで ---------
-------------------------------------------*/

/*------------------------------------------
-------- 動画個別ページ | ここから ---------
-------------------------------------------*/

.movie-detail .container{
	padding-bottom: 0rem;
}

.movie-detail .card{
	width: 100%;
	padding: 15px;
}

.movie-detail .card-body{
	padding: 0rem;
}

.movie-detail-table td{
	padding: 0.5rem;
}

.movie-production-date-box-detail{
	font-size: 0.8rem;
}

.movie-player-box-detail .player{
	position: relative;
	width: 100%;
	padding-top: 56.25%;
}

.movie-player-box-detail .player iframe{
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	height: 100%;
}

/*------------------------------------------
-------- 動画個別ページ | ここまで ---------
-------------------------------------------*/


/***********************************************
***************    協育を学ぶ     **************
************************************************/

.study-kyouiku .container{
	padding-bottom: 0rem;
}

.study-kyouiku .card{
	width: 100%;
	padding: 15px;
	border: none;
}

.study-kyouiku .card-body{
	margin: 15px;
	padding: 0;
}


/* h1タイトルのオリジナルはページ共通にある */

.study-kyouiku h1{	/* タイトル */
	padding: 0.5rem 0.7rem;
	font-size: 1.15rem;
}

.study-kyouiku h2 {
	margin-bottom: 3rem;
	font-size: 1.1rem;
	padding: 0.5rem;
	padding-left: 1rem;
	text-indent: 0em;

	border: none;
	background-color: rgba(178, 216, 255, 0.4);
	position: relative;
}

.study-kyouiku h2:before{
	width: 15px;
	height: 25px;
}

.study-kyouiku h2:after{
	width: 15px;
	height: 25px;
}


/***********************************************
********  先進事例、資料/文献のリスト    *******
************************************************/

.literature-style .container{
	padding-bottom: 0;
}

.literature-style .card{
	width: 100%;
	padding: 15px;
	border: none;
}

.literature-style .card-body{
	margin: 15px 0;
	padding: 0;
}

/* h1タイトルのオリジナルはページ共通にある */

.literature-style h1{
	padding: 0.5rem 0.7rem;
	font-size: 1rem;
}

.literature-style h2{	/* 強調した見出し */
	font-size: 1rem;
}

.literature-style h3{  /* 強調のない見出し */
	font-size: 1.1rem;
	font-weight: bold;
	line-height: 1.6;
}

.literature-style h6{
	margin-bottom: 5px;
	font-size: 12px;
}


/***********************************************
********  教育委員会へのリンクリスト    ********
************************************************/

.link-style .container{
	padding-bottom: 0;
}

.link-style .card{
	width: 100%;
	padding: 15px;
	border: none;
}

.link-style .card-body{
	margin: 15px;
	padding: 0;
}


/* h1タイトルのオリジナルはページ共通にある */

.link-style h1{
	padding: 0.5rem 0.7rem;
	font-size: 1rem;
}


/***********************************************
********    お問い合わせ＆会員登録     *********
************************************************/

.myForm .container{
	padding-bottom: 0rem;
}

.myForm .card{
	width: 100%;
	padding: 15px;
}

.myForm .card-body{
	margin: 15px;
	padding: 0rem;
}


.myForm .form-group label.control-label{
	flex: none;
	max-width: 100%;
	display: block;
	background: repeating-linear-gradient(-45deg, #f2f2f2, #e5e5e5 5px, #f2f2f2 5px, #e5e5e5 10px);
}



}/***********************************************
********  スマートフォンここまで  ***************
*************************************************
************************************************/










/***********************************************************************************************
************************************************************************************************
************************************************************************************************
************************************************************************************************
************************************************************************************************
***********************************************************************************************/
@media screen and (min-width:576px) and ( max-width:1023px){

/****************************************
*****  タブレット用のヘッダー ***********
*****************************************/

#ccHeaderArea{
	border-top: solid 0.3rem #191919;
	background-color: #ffffff;
}


/*-----------------------------------------
------- ロゴと名称 | ここから -------------
------------------------------------------*/

.margin-bottom-0-header-container .mb-3{
	margin-bottom: 0 !important;
}

#header-container{
	margin: 0.8rem 0 0.5rem 0;
	text-decoration: none;
	display: table;
}

#header-container a{
	text-decoration: none;
}

#header-logo{
	display: table-cell;
	vertical-align: middle;
}

#header-logo img{
	margin-top: 0.2rem;
	height: 2.5rem;
}

#header-nameplace{
	padding-left: 0.3rem;
	font-weight: bold;
	color: #191919;
	display: table-cell;
	vertical-align: middle;
}

h1#header-name{
	margin-bottom: 0;
	font-size: 1.2rem;
	font-weight: bold;
	line-height: 1.1;
}

#header-NPO{
	font-size: 0.8rem;
}

/*-----------------------------------------
------- ロゴと名称 | ここまで -------------
------------------------------------------*/


/***********************************************
***************   タブレット用  ****************
****************  ページ共通  ******************
************************************************/

/*-----------------------------------------
------ ページのh1タイトル | ここから ------
------------------------------------------*/

.about-title{
	margin-bottom: 4rem;
}

.about-title h1{
	padding: 0.8rem 1.5rem 0.5rem 1.5rem;
	border-radius: 2rem;
}


/*-----------------------------------------
------ ページのh1タイトル | ここまで ------
------------------------------------------*/


/***********************************************
***************   タブレット用  ****************
****************  トップページ  ****************
************************************************/


/* ご案内 | ここから */
.top-titles{
	width: 40%;
}

/* ポスター（左）の設定 */
.top-event-poster-box{
	flex: none;
	max-width: 100%;
}

.top-event-poster-box .container{
	padding-right: 15px;
}

.top-event-poster-box p{
	text-align :center;
}

.top-event-poster-box img{
	max-height: 300px;
}

/* 記述（右）の設定 */
.top-event-description-box{
	flex: none;
	max-width: 100%;
}

.top-event-description-box .container{
	margin-bottom: 5rem;
	width: 100%;
}

.top-event-description-box .card{
	border-radius: 0;
	padding: 0rem;
}

.top-event-description-box .card-body p.fluid-text +p{
	display: inline-block;
	vertical-align: top;
	max-width: 100%;
}



/* ご案内 | ここまで */



/* 新着情報 | ここから*/
.top-whats-new h1.card-header{
	width: 80%;
}

.top-whats-new dd:nth-child(2n){  /* タイトル */
	font-size: 1rem;
}

/* 新着情報 | ここまで*/


/* Pick up | ここから*/
.top-pick-up h1.card-header{
	width: 80%;
}

.top-pick-up h1.card-header:before,
.top-pick-up h1.card-header:after{
	font-size: 1rem;
}

.top-pick-up .card-body{
	margin-top: 1.9rem;
	padding: 1.25rem 20px 2rem 20px;
}


/* Pick up | ここまで*/

/* 協育アドバイザーネットについて | ここから*/

.top-kyouiku-net{
	margin-bottom: 6rem;
}

.top-kyouiku-net .card-body{
	border-top: solid 13px #777777;
	border-bottom: solid 13px #777777;
}

.top-kyouiku-net-title{
	width: 95%;
	margin: 1rem auto 2rem auto;
	font-size: 1.4rem;
	border-radius: 3rem;
}

/* 協育アドバイザーネットについて | ここまで*/


/* ねがい | ここから*/

.top-hope h4{
	font-size: 1.8rem;
}

.top-hope p{
	font-size: 1.15rem;
	line-height: 2;
}

/* ねがい | ここまで*/


/***********************************************
************************************************
**************   団体情報   ********************
************************************************
************************************************/

/*------------------------------------------
-------- Aboutページ共通 | ここから --------
-------------------------------------------*/

.about-common-class{
	flex: none;
	max-width: 100%;
}

.about-common-class .card{
	padding: 3%;
}


.about-common-class .card-body{
	padding: 3rem 1rem 2rem 1rem;
}


/* h1.about-title は全ページ共通にある */

.about-common-class h2{	/* 強調した見出し */
	margin-bottom: 2.5rem;
	padding: 1.9rem 1rem 1.7rem 1rem;

	color: #333333;
	font-weight: bold;
	font-size: 1.3rem;

	border: none;
	border-top: solid 6px #777777;
	border-bottom: solid 6px #777777;
	background-color: #fafafa;
}

.about-common-class h3{	/* 強調のない見出し */
	font-size: 1.4rem;
}

.about-common-class h6{
	margin-bottom: 5px;
	font-size: 12px;
}

.about-common-class p{
	line-height: 1.8;
}


/*------------------------------------------
-------- Aboutページ共通 | ここまで --------
-------------------------------------------*/


/***********************************************
**************   団体概要   ********************
************************************************/

.about-outline-table td:first-child{
	width: 100px;
	font-size: 0.8rem;
}


/***********************************************
*************   代表者ご挨拶   *****************
************************************************/


/***********************************************
******************   沿革   ********************
************************************************/

.about-history-table td:first-child{
	width: 90px;
	font-size: 0.8rem;
}


/***********************************************
*****************   理 念   ********************
************************************************/


/***********************************************
****************     活動方針    ***************
************************************************/

/* なし */


/***********************************************
***************     事業概要     ***************
************************************************/


/***********************************************
*************  事業計画/事業報告    ************
************************************************/


/***********************************************
*************      定期総会     ****************
************************************************/

/* 事業計画/事業報告と同じ */


/***********************************************
**************   設立趣旨書   ******************
************************************************/

.about-purpose .card{
	padding: 1.5rem;
}


/***********************************************
************************************************
**************   活動内容   ********************
************************************************
************************************************/

/***********************************************
**************   活動内容共通   ****************
************************************************/

/*------------------------------------------
-------- activitiesページ共通 | ここから --------
-------------------------------------------*/

.activities-common-class{
	flex: none;
	max-width: 100%;
}

.activities-common-class .card{
	padding: 3%;
}

.activities-common-class .card-body{
	padding: 1.5rem;
}

/*------------------------------------------
----- activitiesページ共通 | ここまで ------
-------------------------------------------*/


/***********************************************
**************   主な活動   ********************
************************************************/


/***********************************************
********   A.高まろう～C.繋げよう   ************
************************************************/

.about-title .subtitle-h1{
	font-size: 1.35rem;
}


/***********************************************
*******  活動ブログ・事務局からのお知らせ  *****
************************************************/

.blog-common-class{
	flex: none;
	max-width: 100%;
}

.blog-common-class .card{
	padding: 3%;
}

.blog-common-class .card-body{
	padding: 2.5rem 1.5rem;
}

.plugin-blogs header h2{
	font-size: 1.8rem;
}


/***********************************************
************************************************
**************   会報/実施報告   ***************
************************************************
************************************************/

/***********************************************
******************    会報     *****************
************************************************/

/*--------------------------------------------*/
/***** メディアクエリで狭い幅に対応する *******/
@media screen and (min-width: 576px) and (max-width: 757px) {

.newsletter-shelf{
	flex: none;
	max-width: 100%;
}

}/** ここでメディアクエリを閉じる **/
/*--------------------------------------------*/



/***********************************************
******   デザイン実践交流会・受託事業     ******
************************************************/

/*------------------------------------------
-------- タブの設定 | ここから -------------
-------------------------------------------*/

/*------------------------------------------
-------- タブの設定 | ここまで -------------
-------------------------------------------*/

/*------------------------------------------
-------- 実践報告の内容 | ここから ---------
-------------------------------------------*/

.report-common .card{
	padding: 3%;
}

.report-common h1.card-header{
	font-size: 0.2rem;
}

.report-common .card-body h1{
	width: 95%;
	margin: 3rem auto 6rem auto;
	font-size: 2.2rem;
	font-weight: bold;
	text-align: center;
	line-height: 1.5;

	padding: 2rem 0.5rem 1.5rem 0.5rem;
	border-top: solid 6px #444444;
	border-bottom: solid 6px #444444;
}

.report-common .card-body h1 .subtitle{
	font-size: 1.4rem;
}

.report-common h2{	/* 強調した見出し */
	margin-bottom: 3rem;
	padding: 0.6em 0.5em 0.4em 0.5em;

	font-size: 1.5rem;
	font-weight: bold;

	border: solid 1px #cccccc;
	border-left: solid 10px #469bff;
}

/*--------------------------------------------*/
/***** メディアクエリで狭い幅に対応する *******/
@media screen and (min-width: 576px) and (max-width: 757px) {

.report-common .card-body h1{
	font-size: 1.6rem;
}

.report-common h2{	/* 強調した見出し */
	font-size: 1.3rem;
}

}/** ここでメディアクエリを閉じる **/
/*--------------------------------------------*/


.report-common h3{	/* 強調のない見出し */
	font-size: 1.5rem;
	font-weight: bold;
}

.report-common h4{
}

.report-common h5{
}

.report-common h6{
	margin-bottom: 5px;
	font-size: 12px;
}

.report-common p{
	line-height: 1.8;
}

/* YouTubeの埋め込み対応｜ここから */
.report-common .player{
	position: relative;
	width: 100%;
	padding-top: 56.25%;
}

.report-common .player iframe{
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	height: 100%;
}
/* YouTubeの埋め込み対応｜ここまで */


/*------------------------------------------
-------- 実践報告の内容 | ここまで ---------
-------------------------------------------*/

/*------------------------------------------
-------- リンクメニュー | ここから ---------
-------------------------------------------*/


.report-tab-menu a.list-group-item.depth-1{
	padding-left: 0.3rem;
}

.report-tab-menu a.list-group-item.depth-2::before{
	padding-left: 1rem;
}

/*------------------------------------------
-------- リンクメニュー | ここまで ---------
-------------------------------------------*/


/***********************************************
***************    製作ビデオ     **************
************************************************/

/*------------------------------------------
-------- 動画一覧ページ | ここから ---------
-------------------------------------------*/

.movies-shelf .type-box{
	padding: 0;
}

.movies-shelf .movie-title-box{
	height: auto;
}


/*------------------------------------------
-------- 動画一覧ページ | ここまで ---------
-------------------------------------------*/

/*------------------------------------------
-------- 動画個別ページ | ここから ---------
-------------------------------------------*/

.movie-detail{
	flex: none;
	max-width:100%;
}

.movie-detail .card{
	padding: 3%;
}

.movie-detail-table td{
	padding: 0.5rem;
}

.movie-production-date-box-detail{
	font-size: 0.8rem;
}

.movie-player-box-detail .player{
	position: relative;
	width: 100%;
	padding-top: 56.25%;
}

.movie-player-box-detail .player iframe{
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	height: 100%;
}

/*------------------------------------------
-------- 動画個別ページ | ここまで ---------
-------------------------------------------*/


/***********************************************
***************    協育を学ぶ     **************
************************************************/

.study-kyouiku{
	flex: none;
	max-width: 100%;
}

.study-kyouiku .card{
	padding: 3%;
}

.study-kyouiku .card-body{
	margin: 1rem;
	padding: 2rem 0.5rem 1rem 0.5rem;
}


/* h1タイトルのオリジナルはページ共通にある */

.study-kyouiku h1{	/* タイトル */
	font-size: 2rem;
	line-height: 1;
}


/***********************************************
********  先進事例、資料/文献のリスト    *******
************************************************/

.literature-style{
	flex: none;
	max-width: 100%;
}

.literature-style .card{
	padding: 3%;
}

.literature-style .card-body{
	margin: 1rem;
	padding: 2rem 0.5rem 1rem 0.5rem;
}

/*--------------------------------------------*/
/***** メディアクエリで狭い幅に対応する *******/
@media screen and (min-width: 576px) and (max-width: 757px) {

.literature-style .card-body h1{
	font-size: 1.6rem;
}

}/** ここでメディアクエリを閉じる **/
/*--------------------------------------------*/


/***********************************************
********  教育委員会へのリンクリスト    ********
************************************************/

.link-style{
	flex: none;
	max-width: 100%;
}

.link-style .card{
	padding: 3%;
}

.link-style .card-body{
	margin: 2rem;
	padding: 2rem 2rem 1rem 2rem;
}

/*--------------------------------------------*/
/***** メディアクエリで狭い幅に対応する *******/
@media screen and (min-width: 576px) and (max-width: 757px) {

.link-style .card-body h1{
	font-size: 1.6rem;
}

}/** ここでメディアクエリを閉じる **/
/*--------------------------------------------*/


/***********************************************
********    お問い合わせ＆会員登録     *********
************************************************/

.myForm{
	flex: none;
	max-width: 100%;
}

.myForm .card{
	padding: 3%;
}

/*--------------------------------------------*/
/***** メディアクエリで狭い幅に対応する *******/
@media screen and (min-width: 576px) and (max-width: 757px) {

.inquiry-title-h1 h1{
	font-size: 2rem;
}

.myForm .form-group label.control-label{
	flex: none;
	max-width: 100%;
	display: block;
	background: repeating-linear-gradient(-45deg, #f2f2f2, #e5e5e5 5px, #f2f2f2 5px, #e5e5e5 10px);
}

}/** ここでメディアクエリを閉じる **/
/*--------------------------------------------*/


}/***********************************************
***********  タブレットここまで  ****************
*************************************************
************************************************/