@charset "UTF-8";
/* CSS Document */

/*------------------------------------*
  $Base
 *------------------------------------*/
body#communityBody {
	background-color: #e7f0fc;
	color: #333;
}

a:hover img { opacity: 0.8;}
a {color: #555;}
a:link { text-decoration: none; color: #555;}
a:hover { text-decoration: underline; color: #555;}

.contentsBoxCmAbout a {color: #fff;}
.contentsBoxCmAbout a:link { text-decoration: none; color: #fff;}
.contentsBoxCmAbout a:hover { text-decoration: underline; color: #fff;}

p { line-height: 180%;}

/*------------------------------------*
  $header
 *------------------------------------*/

/*------------------------------------*
  $contents
 *------------------------------------*/
 
.pc_pankuzu  { width: 980px; margin: 20px auto; font-size: 90%;} 
.sp_pankuzu { background-color: #c6deff; width: 100%; padding: 8px 10px 5px 22px; font-size: 85%;}
.mainImg_cmBox{ width: 100%; background-color: #000629;}
.mainImg_cm { max-width:1480px; margin: 0 auto;}
.mainImg_cm　img.pc { width: 100%;}


.contentsBoxCm01 { background-color: #e7f0fc; margin: 0; padding: 80px 0; width: 100%;}
.contentsBoxCm02 { background-color: #d4e0f1; margin: 0; padding: 80px 0; width: 100%;}
.contentsBoxCm01.endBox {padding: 30px 0 60px;}
.contentsBoxCmAbout { background-color: #062542; margin: 0; padding: 80px 0; color: #fff; width: 100%;}
.contCm01 { width: 980px; margin: 0 auto; }
.contCm01 h3{ font-size: 180%; margin-bottom: 20px; text-align: center;}

.contentsBoxCm01 h2 { font-size: 260%; margin: 0 0 25px 0;}
.contentsBoxCmAbout .about_txt01 { width: 980px; margin: 40px auto 20px; text-align: left;}
.contentsBoxCmAbout .about_txt02 { width: 620px; margin: 0 auto; text-align: left;}
.contentsBoxCmAbout .about_h4{ font-size: 120%; font-weight: bold;  text-align: center; margin: 50px 0 20px;}

.text_s01 { font-size: 90%; line-height: 110%;}

.contentsBoxCmAbout .section { width: 648px; padding: 30px 0 10px;}

.contentsBoxCmAbout ul { margin: 60px 0 80px;}
.contentsBoxCmAbout ul li { width: 230px; display: inline-block; margin: 0 11px 0 0; padding: 0;vertical-align: top;}
.contentsBoxCmAbout ul li:last-child { margin: 0;}
.contentsBoxCmAbout ul li .txt { text-align: left; font-size: 80%;}

.cm_link01 { margin-top: 7px; margin-bottom: 20px;}
.contentsBoxCmAbout ul .cm_link01 { margin-top: 7px; margin-bottom: 0px;text-align: left;}
.contentsBoxCmAbout ul .cm_link01 img { margin: 0 5px 0 0;}

.cont01Txt { text-align: center; margin: 40px 0 0 0;}

.contCm01.hokokuBox { text-align: left;}

.hokokuBox { width: 980px; text-align: left;}
.hokokuBox ul { margin: 60px 0 80px;}
.hokokuBox ul li { width: 300px; display:inline-block; margin: 0 35px 35px 0; vertical-align: top;}
.hokokuBox ul li:nth-child(3n) { margin: 0;}
.hokokuBox ul li .hokoku_date { font-size: 90%; margin: 15px 0 10px;}
.hokokuBox ul li .hokoku_txt{margin-top: 15px;}


.towa_txt01 { width: 800px; margin: 0 auto; padding: 30px 0;}
.mirai_txt01 { width: 800px; margin: 0 auto; padding: 30px 0; text-align: left;}

.towaMidashi01 { text-align: center; margin: 40px 0;}
.towaMidashi01 h4 { padding: 7px 40px; border: 1px solid #004696; display: inline-flex; font-size: 120%; font-weight: normal; border-radius: 7px; }

.towa_komidashi01 { text-align: center; font-size: 130%; font-weight: bold; margin: 30px 0 15px 0;}
.towa_txt02 { width: 620px; margin: 0 auto; font-size: 110%;}
.towa_txt03 { text-align: center; font-size: 120%; margin: 15px 0;}

.towaBox ul { margin: 35px 0 0 0;}
.towaBox ul li { display: inline-block; margin: 5px 32px 30px 0; width: 300px; vertical-align: top; font-size: 85%; text-align: justify;}
.towaBox ul li:nth-child(3n) { margin:5px 0 15px 0 ;}
.towaBox ul li img { margin: 15px 0 15px 0;}
.towaBox ul li .evaname { text-align: center; font-size: 130%; font-weight: bold; margin-bottom: 10px;}

.btm_attentionBox { background-color: #fff; }
.miraiBox {width: 985px; margin: 40px auto 0;}
.miraiBox img { margin: 10px 0;}
.miraiBox p { text-align: center;}


/*　活動報告ページ*/
.re_subttl { font-weight: bold; font-size: 115%;}
.katsudo_Ttl { font-size: 120%; font-weight: bold; margin: 60px 0 20px;}
.katsudo_img { margin: 0;}
.katsudo_img li { display: inline-block; width: 475px; margin: 0px 0 0 0;}
.katsudo_img li img { margin: 25px 0 30px 0;}
.katsudo_img li:nth-child(2n)  img { margin: 25px 0 30px 25px;}
.btm_aboutBox { border: 1px solid #d1d0c9; background-color: #fff; padding: 40px 50px 60px 50px; text-align: left; margin:0px 0 0px 0!important;}


#pagerReport { width:100%; margin: 80px 0 0;}
#pagerReport li { display: inline-block;　color: #fff !important; background: #004696; padding: ０px; }
#pagerReport li.back { width: 475px; margin: 0 0 0 0;}
#pagerReport li.next { width: 475px; margin: 0 25px 0 0;}
#pagerReport li a { color: #fff; display: block;}
#pagerReport li .pagerBox { display: table; padding: 10px;}
#pagerReport li .pagerImg { display: table-cell; vertical-align: middle; padding: 0px 15px 15px 10px;}
#pagerReport li .pagerTxt { display: table-cell; vertical-align: middle; text-align: left;}
#pagerReport li.back .pagerTxt { width: 420px; padding: 0 10px 0 10px; }


/*------------------------------------*
  $ ボタン/リンク
 *------------------------------------*/

a.btn-blueCm01{
  padding: 24px 110px!important;
  margin: 10px 0;
  color: #fff !important;
  background: #004696;
  text-decoration: none;
  font-weight: bold;
  font-size:150%;
  text-align:center;
  text-decoration:none !important;
  letter-spacing: 1px;
}
a.btn-blueCm01:before {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  margin: -3px 5px 0 0;
  background: url("https://qzss.go.jp/ex-demo/images/link_icon01.png") no-repeat;
  background-size: contain;
  vertical-align: middle;
}
a.btn-blueCm01:hover {
    opacity: 0.8;
}

a.btn-blueCm02{
  padding: 24px 90px!important;
  margin: 30px 0!important;
  color: #fff !important;
  background: #004696;
  text-decoration: none;
  font-weight: bold;
  font-size:120%;
  text-align:center;
  text-decoration:none !important;
  letter-spacing: 1px;
}
a.btn-blueCm02:before {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  margin: -3px 5px 0 0;
  background: url("https://qzss.go.jp/ex-demo/images/link_icon01.png") no-repeat;
  background-size: contain;
  vertical-align: middle;
}
a.btn-blueCm02:hover {
    opacity: 0.8;
}

.cm_link01{ vertical-align: middle; text-align: center; }
.cm_link01 img{ vertical-align: middle; margin: 0; width: 15px; height: auto;}
.cm_link01 span { font-size: 90%;}

.btnBox01 { text-align: center; margin: 40px auto 0;}

.snslink01 .pc { width: 23px;}
.snslink02 .pc { width: 24px;}

/* 矢印非表示 */
.cp_box input {
	display: none;
}

/*------------------------------------*
  $IPAD
 *------------------------------------*/
@media all and (max-width: 960px) {

/*980px 幅調整*/
header { width: 100%; margin: 0;}
#mainText { width: 100%; margin: 0; padding-bottom: 10px;}
.cont01 { width: 100%; margin: 0; text-align: center;}
footer { width: 100%; margin: 0 auto -40px; text-align: center;}

}

/*------------------------------------*
  $SMP
 *------------------------------------*/
@media all and (max-width: 767px) {

.mainImg_cm { width: 100%; margin: 0 auto;}
.contCm01 { width: 90%; margin: 0 5%; font-size: 85%;}
.contCm01 h3{ font-size: 150%; margin-bottom: 20px; text-align: center;}
.contentsBoxCmAbout .about_txt { width: 100%; text-align: left; font-size: 100%;}
.contentsBoxCmAbout .section { width: 100%; padding: 30px 0 10px;}

.contentsBoxCm01 { background-color: #e7f0fc; margin: 0; padding: 40px 0; width: 100%;}
.contentsBoxCm02 { background-color: #d4e0f1; margin: 0; padding: 40px 0; width: 100%;}
.contentsBoxCm01.endBox {padding: 30px 0 60px;}
.contentsBoxCmAbout { background-color: #062542; margin: 0; padding: 30px 0; color: #fff; width: 100%;}
.contentsBoxCm01 h2 { font-size: 160%; margin: 0 0 10px 0;}

.contentsBoxCmAbout .about_txt { width: 100%; margin: 0 auto; text-align: left;}
.contentsBoxCmAbout .about_txt01 { width:100%; margin:20px 0 10px; text-align: left;}
.contentsBoxCmAbout .about_txt02 { width: 100%; margin: 0 auto; text-align: left;}
.contentsBoxCmAbout .about_h4{ font-size: 110%; font-weight: bold;  text-align: center; margin: 30px 0 20px;}

.fb_icon_top { margin: 0 10px 30px 0; }

.cm_link01{ vertical-align: middle; font-size:90%; text-align: center;}
.cm_link01 img{ vertical-align: middle; margin: 0 0 4px 0; width: 15px; height: auto; }
.cm_link01 span { font-size: 90%;}

.contentsBoxCmAbout ul { margin: 30px 0 20px;}
.contentsBoxCmAbout ul li { width: 45%; display: inline-block; margin: 0 2% 10px 2%; padding: 0;}
.contentsBoxCmAbout ul li:last-child { margin: 0;}
.contentsBoxCmAbout ul li .txt { text-align: left; font-size: 85%;}
.contentsBoxCmAbout ul li img.linkImg { width: 100%;}

.contentsBoxCmAbout ul .cm_link01 { margin-top: 7px; font-size: 95%; text-align: center;}
.contentsBoxCmAbout ul .cm_link01 img { margin: 0 5px 3px 0; width: 10px;}

.cont01Txt { text-align: center; margin: 20px 0 0 0; font-size: 80%;}

.hokokuBox { width: 96%; margin: 0 2%; text-align: left;}
.hokokuBox ul { margin: 30px 0 10px;}
.hokokuBox ul li { width: 48%; display: inline-block; margin: 10px 2% 0 0 ; padding: 0; font-size: 80%; vertical-align: top;}
.hokokuBox ul li:last-child { margin: 10px 2% 0 0;}
.hokokuBox ul li:nth-child(2n) { margin: 10px 0 0 0;}
.hokokuBox ul li .hokoku_date { font-size: 90%; margin: 5px 0 5px;}
.hokokuBox ul li img { width: 100%;}



.towaMidashi01 { text-align: center; margin: 30px 0;}
.towaMidashi01 h4 { padding: 7px 30px; border: 1px solid #004696; display: inline-flex; font-size: 110%; font-weight: normal; border-radius: 0px; }

.towa_komidashi01 { text-align: center; font-size: 110%; font-weight: bold; margin: 30px 0 15px 0;}
.towa_txt01 { width: 100%; margin: 0 auto; padding: 5px 0;}
.towa_txt02 { width: 100%; margin: 0 auto; font-size: 90%;}
.towa_txt03 { text-align: center; font-size: 100%; margin: 15px 0;}

.towaBox ul { margin: 10px 0 0 0;}
.towaBox ul li { width: 45%; display: inline-block; text-align: left; margin: 0px 2% 15px 2%; font-size:80%; }
.towaBox ul li:nth-child(3n) { margin:0px 2% 15px 2%;}
.towaBox ul li img { margin: 20px 0 10px 0; width: 100%;}
.towaBox ul li .evaname { text-align: center; font-size: 130%; font-weight: bold; margin-bottom: 5px;}

.miraiBox { width: 94%; margin: 10px 3% 10px;}


.mirai_txt01 { width: 100%; margin: 0 auto; padding: 10px 0; text-align: left;}


/*　活動報告ページ*/
.re_subttl { font-weight: bold; font-size: 115%;}
.katsudo_Ttl { font-size: 120%; font-weight: bold; margin: 60px 0 10px;}
.katsudo_img { margin: 0px 0 30px;}
.katsudo_img li { display: inline-block; width: 49%; margin: 0;}
.katsudo_img li img { margin: 10px 2% 10px 0;}
.katsudo_img li:nth-child(2n) img  { margin: 10px 0 10px 2%;}
.katsudo_img img { width: 100%;}
.btm_aboutBox { border: 1px solid #d1d0c9; background-color: #fff; padding: 20px 20px 0; text-align: left; margin:0 5% 0px 5%!important;}
.btm_aboutBox .exp_text02 { font-size: 80%;}

#pagerReport { width:100%; margin: 40px 0 0;}
#pagerReport li { display: inline-block;　color: #fff !important; background: #004696; padding: 0px; }
#pagerReport li.back { width: 100%; margin: 0px 0 10px 0;}
#pagerReport li.next { width: 100%; margin: 0px 0 10px 0;}
#pagerReport li a { color: #fff; display: block;}
#pagerReport li .pagerBox { display: table;　padding: 10px;}
#pagerReport li .pagerImg { display: table-cell; vertical-align: middle; padding: 0px 15px 10px 10px;}
#pagerReport li .pagerTxt { display: table-cell; vertical-align: middle; text-align: left;}

/*------------------------------------*
  $ ボタン/リンク
 *------------------------------------*/

a.btn-blueCm01{
width: 100%;
margin-left: 5%;
display: block;
  padding: 12px 0!important;
  margin: 10px 0;
  color: #fff !important;
  background: #004696;
  text-decoration: none;
  font-weight: bold;
  font-size:100%;
  text-align:center;
  text-decoration:none !important;
  letter-spacing: 1px;
}
a.btn-blueCm01:before {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  margin: -3px 5px 0 0;
  background: url("https://qzss.go.jp/ex-demo/images/link_icon01.png") no-repeat;
  background-size: contain;
  vertical-align: middle;
}

.btnBox01 { text-align: center; margin: 0px 5% 0;}




a.btn-blueCm02{
width: 100%;
margin-left: 5%;
display: block;
  padding: 12px 5px!important;
  margin: 0;
  color: #fff !important;
  background: #004696;
  text-decoration: none;
  font-weight: bold;
  font-size:90%;
  text-align:center;
  text-decoration:none !important;
  letter-spacing: 1px;
}
a.btn-blueCm02:before {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  margin: -3px 5px 0 0;
  background: url("https://qzss.go.jp/ex-demo/images/link_icon01.png") no-repeat;
  background-size: contain;
  vertical-align: middle;
}

.btnBox02 { text-align: center; margin: 0px 5% 0;}


/*------------------------------------*
  $ エヴァンジェスト 続きを読むボタン
 *------------------------------------*/
.cp_box *, .cp_box *:before, .cp_box *:after {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
.cp_box {
	position: relative;
}
.cp_box label {
	position: absolute;
	z-index: 1;
	bottom: 0;
	width: 100%;
	height: 20px; /* グラデーションの高さ */
	cursor: pointer;
	text-align: center;
	/* 以下グラデーションは背景を自身のサイトに合わせて設定してください */
	background: linear-gradient(to bottom, rgba(250, 252, 252, 0) 0%, rgba(231, 240, 252, 0.95) 90%);
}
.cp_box input:checked + label {
	background: inherit; /* 開いた時にグラデーションを消す */
}
.cp_box label:after {
	line-height: 1rem;
	position: absolute;
	z-index: 2;
	top: 20px;
	left: 50%;
	width: 50%;
	content: '▼';
	transform: translate(-50%, 0);
	letter-spacing: 0.05em;
	color: #333;
	border-radius: 0px;
}
.cp_box input {
	display: none;
}
.cp_box .cp_container {
	overflow: hidden;
	height: 120px; /* 開く前に見えている部分の高さ */
	transition: all 0.5s;
}
.cp_box input:checked + label {
	/* display: none ; 閉じるボタンを消す場合解放 */
}
.cp_box input:checked + label:after {
	content: '▲閉じる';
}
.cp_box input:checked ~ .cp_container {
	height: auto;
	padding-bottom: 10px; /* 閉じるボタンのbottomからの位置 */
margin-bottom: 20px;
	transition: all 0.5s;
}

}