@charset "utf-8";

/* ----------------------------------------------

パンくず

---------------------------------------------- */
.pan {
background-color:#F8F8F8;
text-align:center;
padding:3em 0 2.5em 0;
background-image: url(/kikin/images/bg_pan.png);
background-repeat:no-repeat;
background-position: center top;
background-size: cover;
}

.panbox {
width: 990px;
margin: 0 auto;
text-align: left;
}

.panbox h2 {
font-size: 36px;
letter-spacing:0.1em;
line-height: 1.3;
color: #FFF;
margin:0 0 0.2em 0;
font-family: Georgia,游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN",HGS明朝E,serif;
}

.panbox ul {
padding: 0 4px;
margin: 0 ;
overflow: hidden;
}

.panbox ul li {
font-size: 14px;
color: #FFF;
display: inline-block;
float: left;
list-style: none;
padding: 0 ;
margin-right: 0.5em;
}

.panbox ul li a {
color: #FFF;
}

.panbox ul li::after {
  content: "＞";
  margin: 0 0 0 0.5em;
}

.panbox ul li:last-child::after {
  content: "";
}

.panbox ul li a:hover {
margin: 0 ;
}

.pan-sp {
display:none;
}

@media screen and (max-width: 768px) {
	.pan {
	padding: 2em 0 1.5em 0;
	}
	.panbox {
	width: 96%;
	font-size: 26px;
	text-align:center;
	}
	.panbox h2 {
	font-size: 26px;
	letter-spacing: 0;
	}
	.panbox ul {
	display:none;
	}
	.pan-sp {
	display:block;
	border-top: 1px solid #C4C4C4;
	background-color: #F6F6F6;
	margin: 3em 0 0 0;
	padding: 0.5em 0;
	}
	.pan-sp ul {
	display:block;
	padding:0;
	}
	.pan-sp ul li {
	color: #333
	}
	.pan-sp ul li a {
	color: #333
	}
}


/* ----------------------------------------------

コンテンツ

---------------------------------------------- */
.contentsbox {
width: 990px;
margin:0 auto;
padding: 4em 0 3em 0;
}

.main {
}

.main h3 {
font-size: 32px;
line-height: 1.5;
color: #0075B9;
margin: 0 0 1em 0;
font-family: Georgia,游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN",HGS明朝E,serif;
}

.mainbox {
margin:0 auto;
text-align:left;
}

.mainbox h3 {
font-size: 26px;
line-height:1.4;
margin:2em 0 1.3em 0;
padding:0 0 0 16px;
border-left:6px solid #0075B9;
font-family: Georgia,游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN",HGS明朝E,serif;
}

.mainbox h4 {
font-size: 22px;
font-weight: normal;
line-height: 1.5;
padding: 0.3em 0;
margin: 2em 0 1em 0;
border-top: 3px solid #0075B9;
border-bottom: 2px dotted #919191;
}

.mainbox h5 {
font-size:18px;
margin:2em 0 1em 0;
}

.mainbox p.day {
text-align:right;
}

.mainbox p.imgright {
float: right;
font-size: 13px;
display: inline-block;
text-align: right;
margin: 0 0 2em 2em;
}

span.caption {
font-size: 14px;
line-height: 1.3;
}

.red {
color: #F12E36;
}

blockquote {
border:1px solid #CCC;
background-color:#F4F4F4;
padding:1em 1.5em 0 1.5em;
margin: 2em 0 2em 0;
}

.mainbox blockquote h3:first-child {
font-size: 22px;
margin: 0.5em 0 1.3em 0;
}

.mainbox blockquote h4:first-child {
font-size: 20px;
margin: 0.5em 0 1.3em 0;
}


.mainbox p.linkbt {
text-align:center;
}

.mainbox p.linkbt a {
display:inline-block;
font-size: 18px;
color: #FFF;
padding: 1em 5em;
margin: 3em auto 1em auto;
background-color: #BC9F70;
text-decoration:none;
border-radius: 6px;
    transition: 1.0s;
}

.mainbox p.linkbt a:hover {
background-color :#666;
}

.mainbox p.fig {
text-align:center;
display:inline-block;
margin:0 2px 1em 2px;
font-size: 13px;
}


.mainbox p.info_noborder {
line-height:1.6;
padding: 0 0 0 30px;
margin: 0 0 0.8em 0;
background-image: url(/kikin/images/img_kome.svg);
background-repeat: no-repeat;
background-position: 0 0.35em;
background-size: 14px 14px;
}

.mainbox p.info {
margin: 0 0 0.8em 0;
padding: 0.5em 16px 0.5em 30px;
background-image: url(/kikin/images/img_kome.svg);
background-repeat: no-repeat;
background-position: 4px 0.8em;
background-size: 14px 14px;
border: 1px solid #CCC;
background-color: #F4F4F4;
}



.textcenter { text-align:center;}

.aligncenter{
    max-width:100%;
    margin:0 auto 1em auto;
    vertical-align: bottom;
    display:block;
}

.alignright {
    float:right;
    max-width:300px;
    padding: 5px;
    margin:0 0 1em 1em;
    border: 1px solid #CCC;
    vertical-align: bottom;
}

.alignleft {
    float:left;
    max-width:300px;
    padding: 5px;
    margin:0 1em 1em 0;
    border: 1px solid #CCC;
    vertical-align: bottom;
    }

@media screen and (max-width: 768px) {
	.contentsbox {
	width: 90%;
	padding: 2em 0 0 0;
	text-align:left;
	}
	.main h3 {
	font-size: 24px;
	text-align: center;
	}
	.mainbox h3 {
	font-size: 20px;
	text-align:left;
	}
	.mainbox h4 {
	font-size: 18px;
	}
	.mainbox h5 {
	font-size:16px;
	line-height: 1.5;
	}
	.mainbox p.imgright {
	display: block;
	float: none;
	margin: 0 auto 1em auto;
	text-align: center;
	}
	.mainbox p.linkbt a {
	display:block;
	font-size: 16px;
	padding: 1em ;
	margin: 2em auto 1em auto;
	text-align:center;
	}
	.mainbox blockquote h3:first-child {
	font-size: 20px;
	}
	.mainbox blockquote h4:first-child {
	font-size: 18px;
	}
	.mainbox p.fig {
	display: block;
	}
}

/* ----------------------------------------------

リスト系

---------------------------------------------- */

.mainbox ul {
padding:0 0 0 26px;
margin:0 0 1em 0;
overflow:hidden;
}

.mainbox ul li {
list-style-type:disc;
}

.mainbox ol {
padding:0 0 0 26px;
margin:0 0 1em 0;
}

.mainbox ol li {
list-style-type:decimal;
}

.mainbox ul li a.pdf {
padding: 0 30px 0 0;
background-image: url(/kikin/images/img_pdf.svg);
background-repeat: no-repeat;
background-position: right 0;
background-size: 16px 20px;
}

.mainbox ul li a.wrd {
padding: 0 30px 0 0;
background-image: url(/kikin/images/img_word.svg);
background-repeat: no-repeat;
background-position: right 0;
background-size: 16px 20px;
}

span.size {
font-size: 13px;
margin: 0 0 0 1em;
}

.mainbox div.listbox ul,
.mainbox div.listbox2 ul {
width: 100%;
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
}

.mainbox div.listbox ul li {
width: 33.33%;
margin: 0 0 0.8em 0;
padding: 0 3em 0 0;
line-height: 1.4;
}

.mainbox div.listbox2 ul li {
width: 25%;
margin: 0 0 0.8em 0;
padding: 0 3em 0 0;
line-height: 1.4;
}

.mainbox ul.ulbt {
padding: 2em 0;
margin: 0;
width: 100%;
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
}

.mainbox ul.ulbt li {
list-style-type:none;
width: 49%;
margin: 0 0.5% 0.5em 0.5%;
text-align:center;
}

.mainbox ul.ulbt li a {
display: block;
    color: #FFF;
    padding: 1.5em 1em;
    background-color: #BC9F70;
    text-decoration: none;
    border-radius: 6px;
    transition: 1.0s;
}

.mainbox ul.ulbt li span {
font-size: 14px;
}

.mainbox ul.ulbt li a:hover {
background-color: #666;
}

@media screen and (max-width: 768px) {
	.mainbox div.listbox ul li {
	width: 100%;
	padding:0;
	}
	.mainbox ul.ulbt li {
	list-style-type:none;
	width: 100%;
	margin: 0 0 0.5em 0;
	}
	.mainbox ul.ulbt li a {
	padding: 0.8em 1em;
	text-align:left;
	}
	.mainbox div.listbox2 ul li {
	width: 50%;
	}
}

/* ----------------------------------------------

テーブル

---------------------------------------------- */

.mainbox table {
width:100%;
margin:0 auto 1em auto;
}

.mainbox th {
text-align:left;
font-weight:normal;
padding:12px 20px;
background-color:#F2F2F2;
border:1px solid #CCC;
}

.mainbox td {
text-align:left;
padding:12px 20px;
border:1px solid #CCC;
}

.mainbox table.thcolor th {
width: 30%;
}


/* ----------------------------------------------

Information

---------------------------------------------- */
.topnav {
margin: 0 0 1em 0;
}

.topnav ul {
width: 100%;
text-align:left;
font-size:0;
padding:0;
}

.topnav ul li {
list-style-type:none;
display:inline-block;
margin: 0 2px 1em 2px;
text-align:center;
}

.topnav ul li a {
display:block;
font-size: 14px;
color: #FFF;
padding: 0.3em 0.8em;
border-top-left-radius:6px;
border-top-right-radius:6px;
background-color: #0075B9;
text-decoration:none;
}

.topnav ul li a:hover {
background-color: #181818;
}

.informationbox dl {
overflow:hidden;
padding: 0.5em 0;
margin: 0.5em 0;
border-bottom: 1px dotted #666;
}

.informationbox dt {
width:20%;
float:left;
padding-left: 6px;
}

.informationbox dd {
width:80%;
float:right;
}

#pagefooter {
margin: 3em 0 0 0;
text-align:center;
}

#pagefooter a {
font-size: 14px;
color: #FFF;
padding: 0.5em 2em;
background-color: #181818;
text-decoration:none;
}

#pagefooter a:hover {
background-color: #0075B9;
}

/* ----------------------------------------------

よくある質問

---------------------------------------------- */
.faqbox {
padding: 0.5em 0 2em 0;
}

.faqbox h4 {
font-size: 18px;
color: #0075B9;
text-decoration:underline;
border:none;
padding: 0 0 0 40px;
margin: 1em 0;
background-image: url(/kikin/images/img_faq_q.svg);
background-repeat: no-repeat;
background-position: 0 0.1em;
background-size: 24px 24px;
}

.faq_abox {
padding: 0 0 1em 40px;
background-image: url(/kikin/images/img_faq_a.svg);
background-repeat: no-repeat;
background-position: 0 0.1em;
background-size: 24px 24px;
border-bottom: 1px dotted #666;
}

/* ----------------------------------------------

寄附者芳名

---------------------------------------------- */

.list_menu {
margin: 2em 0;
}

.list_menu dl {
margin-bottom: 1em;
overflow:hidden;
}

.list_menu dl dt {
width: 100px;
float:left;
padding: 0.2em 0;
text-align:center;
background-color :#F2F2F2;
border: 1px solid #CCC;
}

.list_menu dl dd {
float:left;
width: 160px;
text-align:center;
border-right :1px solid #CCC;
}

.list_menu dl dd a {
display:block;
padding: 0.2em 1.5em 0 1.5em;
}

@media screen and (max-width: 768px) {
	/* テーブル -*/
	.mainbox table.thcolor th {
	width: 100%;
	display:block;
	}
	.mainbox td {
	width: 100%;
	display:block;
	}

	/* information -*/
	.topnav ul li {
	width: auto;
	margin: 0 2px 0 2px;
	}
	.topnav ul li a {
	display:block;
	font-size: 13px;
	padding: 0.2em 1em;
	margin: 0 0 0.4em 0;
	border-top-left-radius:0;
	border-top-right-radius:0;
	}
	.informationbox dt {
	width: 100%;
	display:block;
	padding:0;
	}
	.informationbox dd {
	width: 100%;
	display:block;
	padding:0;
	}
	#pagefooter a {
	padding: 0.2em 1em;
	}

	/* よくある質問 -*/
	.faqbox h4 {
	font-size: 16px;
	}
	.list_menu dl dt {
	width: 100px;
	float:none;
	margin-bottom: 1em;
	}
	.list_menu dl dd {
    width: inherit;
    float: none;
    display: inline-block;
    text-align: left;
    border: none;
    margin: 0 1em 1em 0;
	}
	.list_menu dl dd a {
	padding:0;
	}
}

/* ----------------------------------------------

プロジェクト

---------------------------------------------- */
.projectbox {
margin-top: 3em;
}

.project_list {
width: 100%;
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
}

.project_list dl {
width: 23%;
margin: 0 1% 1em 1%;
padding: 0.5em;
border:1px solid #E6E6E6;
cursor:pointer;
position:relative;
}

.project_list dt {
height: 140px;
margin-bottom: 0.1em;
overflow: hidden;
position: relative;
}

.project_list dt img {
position: absolute;
top:50%;
left:0;
transform: translateY(-50%);
}

.project_list a {
}
.project_list a::before {
content: "";
position: absolute;
top: -1px;
left: -1px;
right: -1px;
bottom: -1px;
}

.project_list a:hover::before {
background:rgba(244,244,244,0.3);
}

.project_list dl dd h4 {
font-size: 15px;
padding: 0.2em 0.8em;
margin: 0 0 0.5em 0;
border:none;
}

.project_list dl dd h4.general {background-color:#FEEBF6;}
.project_list dl dd h4.project {background-color:#CADFF8;}
.project_list dl dd h4.others {background-color:#F0F4E7;}

.project_list dl dd h4 a {
color: #333;
text-decoration:none;
}

.project_list dl dd p {
font-size: 13px;
line-height: 1.6;
margin: 0;
}

.project_entry {
margin-top: 3em;
}

.project_image {
width: 80%;
margin: 0 auto 2em auto;
}

.project_entry p.catch {
font-size: 18px;
letter-spacing:0.1em;
}

.project_entry h3 {
font-size: 24px;
letter-spacing:0.1em;
color :#FFF;
line-height: 1.5;
padding: 0.3em 1em;
background-color: #0075B9;
border:none;
}

.project_entry ul {
padding: 0;
}

.project_entry ul li {
list-style-type:none;
letter-spacing:0.1em;
line-height: 1.6;
padding: 0.3em 0 0.3em 2em;
background-image: url(/kikin/images/icon_en.svg);
background-repeat: no-repeat;
background-position: 0 0.6em;
background-size: 15px 15px;
}


.project_entry h4 {
font-size: 18px;
font-weight: 700;
line-height: 1.4;
margin: 2em 0 1.3em 0;
padding: 0 0 0 16px;
border:none;
border-left: 6px solid #0075B9;
}

ul.projectbt {
text-align: center;
margin-top: 3em;
}

ul.projectbt li {
display: inline-block;
margin: 0 0.2em 1em 0.2em ;
}
ul.projectbt li a {
font-size: 18px;
    display: block;
    color: #FFF;
    padding: 1.5em 4em;
    background-color: #BC9F70;
    text-decoration: none;
    border-radius: 6px;
    transition: 1.0s;
position: relative;
}

ul.projectbt li a::after {
content:"→";
position: absolute;
top:50%;
right: 1em;
transform: translateY(-50%);
}

ul.projectbt li a:hover {
background-color: #666;
}

.project_voicebox ul li {
list-style-type:none;
letter-spacing:0.1em;
padding: 0.7em 0 0.7em 3em;
border-bottom: 2px dotted #0075B9;
background-image: url(/kikin/images/icon_comment.svg);
background-repeat: no-repeat;
background-position: 0.2em 0.8em;
background-size: 26px 26px;
}

@media screen and (max-width: 768px) {
	/* プロジェクトの紹介 */
	.projectbox {
	margin-top:2em;
	}
	.project_list dl {
	width: 100%;
	}
	.project_list dt {
	height: 200px;
	}
	.project_entry h4 {
	font-size: 16px;
	}
	ul.projectbt li a {
	font-size: 15px;
    padding: 1em;
	}
	.main h3.h3project {
	font-size: 20px;
	text-align:center;
	}
	.project_entry {
	padding: 0;
	margin-top: 1em;
	}
	.project_image {
	width: 100%;
	margin-bottom: 1em;
	}
	.project_entry p.catch {
	font-size: 16px;
	}
	.project_entry h3 {
	font-size: 20px;
	letter-spacing: 0;
	}

}