@charset "utf-8";
/********************
Theme Name: 生き活き市民基金
Theme URI: http://www.lively-citizens-fund.org/
Description: かながわ生き活き市民基金は、一人では支えきれない地域の活動をおおぜいの市民の協力で、解決する仕組みです。
Author: ほっとリンク
Author URI: http://wco-hotlink.com/
Version: 1.0
********************/

/**********
 RESET
 **********/
*, *:before, *:after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	margin:0;
	padding:0;
	font-family: "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
	font-size: 14px;
}

fieldset,img { 
	border:0;
}

/**********
 COLORS
草色
hsla(75,80%,40%,1);
#8FB814;

紺色
hsla(210,80%,20%,1);
#0A335C;

青緑
hsla(180,80%,40%,1);
#14B8B8;
**********/

body {
	position: relative;
	background: #83b200;
	background: -moz-linear-gradient(-45deg, #516e00 1%, #efffc3 50%, #83b200 51%, #efffc3 100%);
	background: -webkit-linear-gradient(-45deg, #516e00 1%,#efffc3 50%,#83b200 51%,#efffc3 100%);
	background: linear-gradient(135deg, #516e00 1%,#efffc3 50%,#83b200 51%,#efffc3 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#516e00', endColorstr='#efffc3',GradientType=1 );
}

#container {
	background:url(./images/background.png) repeat;
	text-align:left;
	width:1000px;
	min-height:480px;
	margin:10px auto 0;
	padding:10px 10px 0 10px;
}
.clearfix {
	display: inline-table;
}  
.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;  
}

/**********
 EFFECT
 **********/
.dropshadow{
	-webkit-box-shadow:0px 0px 9px -4px #ccc inset;
	-moz-box-shadow:0px 0px 9px -4px #ccc inset;
	box-shadow:0px 0px 9px -4px #ccc inset;
}
.downshadow{
	-webkit-box-shadow:0px 6px 3px -3px #ccc;
	-moz-box-shadow:0px 6px 3px -3px #ccc;
	box-shadow:0px 6px 3px -3px #ccc;
}
.noteline_gray {
	background-image: linear-gradient(hsla(12,20%,20%,0.1) 0.1rem, transparent 0.1rem);
	background-size: auto 2rem;
	line-height:2rem;
	padding-bottom: 1rem;
}

/**********
 TEXT
 **********/

h1 {
	width: 80px;
	height: 80px;
	margin: 0px;
	padding-left:10px;
	font-size: large;
	display:inline-block;
	float:left;
	z-index: 4;
}

h2{
	margin: 2rem 0 0;
	padding-left:1em;
	font-size: 18px;
	font-weight:bold;
	line-height:2rem;
}
h3{
	margin: 2rem 0 0;
	padding-left:1em;
	font-size: 16px;
	font-weight:bold;
	line-height:2rem;
}
h4{
	margin: 2rem 0 0;
	padding-left:1em;
	font-size: 15px;
	font-weight:bold;
	line-height:2rem;
}
.h5 {
	margin: 2rem 0 0;
	color:#008000;
	font-weight:bold;
	border-bottom: 1px solid #008000;
}
.bold{
	font-weight:bold;
}
.red {
	color:#ff0000;
}

/********************
 MENU NAVIGATION
********************/

#dropmenu {
	position:relative;
	width: 900px;
	height: 80px;
	padding-top:5px;
	float:right;
	z-index: 5;
}

#menu-nav{
	list-style-type: none;
	height: 60px;
	margin: 0;
	padding: 0;
}
#menu-nav li{
	position: relative;
	width: 280px;
	float: right;
	margin: 0;
	padding: 0;
	text-align: center;
	border-left: dotted 1px #ccc; 
}
#menu-nav li a{
	display: block;
	margin: 0;
	padding: 21px 0 21px;
	color: hsla(75,50%,17%,1);
	font-size: 18px;
	line-height: 1;
	text-decoration: none;
}
#menu-nav li ul{
	list-style: none;
	position: absolute;
	width: 100%;
	top: 100%;
	left: 0;
	margin: 0;
	padding: 0;
}
#menu-nav li:last-child ul{
	left: 0%;
	width: 100%
}
#menu-nav li ul li{
	overflow: hidden;
	width: 100%;
	height: 0;
	color: hsla(0,0%,100%,1);
	-moz-transition: .2s;
	-webkit-transition: .2s;
	-o-transition: .2s;
	-ms-transition: .2s;
	transition: .2s;
}
#menu-nav li ul li a{
	padding-left: 10px;
	text-align: left;
	font-size: 14px;
	font-weight: normal;
}
#menu-nav li:hover ul li{
	overflow: visible;
	height: 40px;
	border-top: 1px solid hsla(75,50%,100%,1);
	border-bottom: 1px solid hsla(75,50%,17%,1);
}
#menu-nav li:hover ul li:first-child{
  border-top: 0;
}

.menu-item-17{
	background: hsla(210,80%,90%,0.4);
	color: hsla(210,80%,20%,1);
}
.menu-item-17:hover{
	background: hsla(210,80%,90%,0.6);
}
.menu-item-17 li{
	background: hsla(0,0%,100%,1);
	color: hsla(210,80%,20%,1);
}
.menu-item-17 li:hover{
	background: hsla(210,80%,90%,1);
}
.menu-item-18{
	background: hsla(180,80%,90%,0.4);
	color: hsla(180,80%,20%,1);
}
.menu-item-18:hover{
	background: hsla(180,80%,90%,0.6);
}
.menu-item-18 li{
	background: hsla(0,0%,100%,1);
	color: hsla(180,80%,20%,1);
}
.menu-item-18 li:hover{
	background: hsla(180,80%,90%,1);
}
.menu-item-9{
	background: hsla(75,80%,90%,0.4);
	color: hsla(75,80%,20%,1);
}
.menu-item-9:hover{
	background: hsla(75,80%,90%,0.6);
}
.menu-item-9 li{
	background: hsla(0,0%,100%,1);
	color: hsla(75,80%,20%,1);
}
.menu-item-9 li:hover{
	background: hsla(75,80%,90%,1);
}


/********************
  FOOTER
********************/

footer {
	width: 1000px;
	margin:0 auto;
	padding:0 10px;
	background: hsla(0,100%,100%,1);
	font-size: 12px;
	text-align: left;
}

footer img {
	margin:20px;
	float:left;
}

footer p {
	margin-left:100px;
	margin-right:75px;
	padding-left: 20px;
	padding-bottom: 20px;
}

#copyright{
	width: 1000px;
	margin: 5px auto;
	padding: 2px;
}
#copyright p{
	padding: 2px;
	font-size:x-small;
	color: #333;
	text-align: right;
}


/********************
  SCROLL
********************/

#page-top {
    position: fixed;
    bottom: 20px;
    right: 20px;
	opacity: 0.5;
}
#page-top a {
    background: #ddd;
    color: #333;
    text-decoration: none;
    width: 100px;
    padding: 10px 0;
    text-align: center;
    display: block;
	border:#999 2px solid;
    border-radius: 8px;
}
#page-top a:hover {
    text-decoration: none;
    background: #999;
    color: #fff;
}

/************************************************************
  TOP PAGE DESIGN
************************************************************/

#topframe{
	background:#fff;
	margin-top:0px;
}

/********************
  FLEXBOX
********************/
.flexbox-container {
	display:-webkit-box;
	display:-moz-box;
	display:-webkit-flexbox;
	display:-moz-flexbox;
	display:-ms-flexbox;
	display:-webkit-flex;
	display:-moz-flex;
	display:flex;
	-webkit-flex-wrap: wrap; /* Safari */
	flex-wrap:         wrap;
	-webkit-align-content: stretch; /* Safari */
	align-content:         stretch;
	justify-content: space-between;
}
.flexbox-container-left {
	display:-webkit-box;
	display:-moz-box;
	display:-webkit-flexbox;
	display:-moz-flexbox;
	display:-ms-flexbox;
	display:-webkit-flex;
	display:-moz-flex;
	display:flex;
	-webkit-flex-wrap: wrap; /* Safari */
	flex-wrap:         wrap;
	-webkit-align-content: stretch; /* Safari */
	align-content:         stretch;
	justify-content: row;
}

.flex_320{
	position: relative;
	width:320px;
	height:380px;
	margin-bottom:10px;
}
.flex_485{
	position: relative;
	width:485px;
	height:380px;
	margin-bottom:10px;
}
.flex_650{
	position: relative;
	width:650px;
	height:380px;
	margin-bottom:10px;
}
.flex_33{
	position: relative;
	width:33%;
	min-height:300px;
	margin-bottom:10px;
}
.flex_20{
	position: relative;
	width:20%;
	min-height:300px;
	margin-bottom:10px;
}
.flex_50{
	position: relative;
	width:49%;
	min-height:300px;
	margin-bottom:10px;
}
.flex_66{
	position: relative;
	width:66%;
	min-height:300px;
	margin-bottom:10px;
}
.flex_100{
	position: relative;
	width:100%;
	min-height:300px;
	margin-bottom:10px;
}
.flex_eraberu{
	position: relative;
	width:48%;
	margin:0 5px 5px 0;
	background:#eff;
}
.topimage{
	background:url("images/topimage_left.jpg") no-repeat;
	background-size: contain;
}
.topimage p{
	display:block;
	width:100%;
	margin:8px;
}
.topimage strong{
	font-size:13pt;
	padding:2px 0;
}
.topimage a{
	display:block;
	width:95%;
	padding:0.5em 0;
	text-align:center;
	text-decoration:none;
}
a.toplink_green{
	border:2px solid hsla(75,80%,40%,1);
	background:hsla(75,80%,40%,0.8);
	color:hsla(75,100%,100%,1);
}
a.toplink_green:hover{
	background:hsla(75,80%,40%,0.2);
	color:hsla(75,80%,40%,1);
}
a.toplink_bluegreen{
	border:2px solid hsla(180,80%,40%,1);
	background:hsla(180,80%,40%,0.8);
	color:hsla(180,100%,100%,1);
}
a.toplink_bluegreen:hover{
	background:hsla(180,80%,40%,0.2);
	color:hsla(180,80%,40%,1);
}
a.toplink_blue{
	border:2px solid hsla(210,80%,40%,1);
	background:hsla(210,80%,40%,0.8);
	color:hsla(210,100%,100%,1);
}
a.toplink_blue:hover{
	background:hsla(210,80%,40%,0.2);
	color:hsla(210,80%,40%,1);
}
a.toplink_purple{
	border:2px solid hsla(300,80%,40%,1);
	background:hsla(300,80%,40%,0.8);
	color:hsla(300,100%,100%,1);
}
a.toplink_purple:hover{
	background:hsla(300,80%,40%,0.2);
	color:hsla(300,80%,40%,1);
}
a.toplink_red{
	border:2px solid hsla(0,80%,40%,1);
	background:hsla(0,80%,40%,0.8);
	color:hsla(0,100%,100%,1);
}
a.toplink_red:hover{
	background:hsla(0,80%,40%,0.2);
	color:hsla(0,80%,40%,1);
}

/********************
  LOGBOX
********************/

.logbox{
	border:1px solid hsla(210,100%,34%,1);
}
.logbox h2{
	background: hsla(210,80%,20%,1);
	color: hsla(0,0%,100%,1);
}
.logbox ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
.logbox li {
	clear: both;
	margin: 10px 0;
	border-bottom:#ccc 1px dotted;
	color: #333;
	font-size:14px;
}
.logbox li span {
	display: block;
	float: left;
	width: 8em;
	margin: 2px 0;
	padding: 0;
	text-align: center;
	font-size: 10px;
	background: hsla(60,27%,91%,0.5);
}
.logbox li span a{
	font-size: 10px;
}
.logbox li span.news {
	background: hsla(180,27%,91%,0.8);
}
.logbox li span.topics {
	background: hsla(30,27%,91%,0.8);
}
.logbox li span.event {
	background: hsla(315,27%,91%,0.8);
}
.logbox li span.ikiiki {
	background: hsla(210,27%,91%,0.8);
}
.logbox li span.writer {
	background: hsla(240,27%,91%,0.8);
}
.logbox .listlink {
	font-size: 12px;
	text-align: right;
	padding-right:1em;
}
.logbox li span.ymd {
	display: inline;
	float: right;
	padding: 0;
	font-size: 10px;
	background: #fff;
	color: #999;
}
.logbox li a{
	padding-left:10px;
}
.logbox a{
	color: hsla(75,100%,17%,1);
	text-decoration: none;
}
.logbox a:hover{
	color: hsla(75,100%,34%,1);
	text-decoration: underline;
}

/********************
  PIN BOARD
********************/
.pinboard{
	width:80%;
	margin:10px auto;
    background:hsla(0,100%,100%,0.5);
	border: 1px solid #cccccc;
    box-shadow:1px 1px 10px 0px #cccccc;
    padding: 40px 10px 10px 10px;
    position: relative;
    z-index: 2;
}
.pinboard:before{
    background-image: -webkit-gradient(radial, 30% 30%, 0, 30% 30%, 10, from(#ffe5ed), to(#e50044));
    border-radius: 50%;
    box-shadow: .5px .5px 4px 1px rgba(128, 128, 128, 0.5);
    content: '';
    display: block;
    position: absolute;
    top: 5px;
    left: 50%;
    width: 15px;
    height: 15px;
    z-index: 4;
}
.pinboard:after{
    background-image: linear-gradient(-80deg, transparent 47%, #333333 47%, #333333 52%, transparent 52%, transparent);
    content: '';
    position: absolute;
    top: 15px;
    left: 50%;
    width: 10px;
    height: 13px;
    z-index: 3;
}
.impact{
	font-size: 24px;
	font-weight:bold;
}
.flower {
	background:url(./images/flower.png) no-repeat;
}

/********************
  FIXSIZE BOX 
********************/
.fix{
	border:1px solid hsla(75,100%,34%,1);
}
.fix h2{
	background: hsla(75,100%,34%,1);
	color: hsla(0,0%,100%,1);
}
.fix p{
	padding-left:1em;
	padding-right:1em;
}
.fix a{
	color: hsla(75,100%,17%,1);
	text-decoration: none;
}
.fix a:hover{
	color: hsla(75,100%,34%,1);
	text-decoration: underline;
}

/********************
  ERABERU
********************/
.eraberu{
	border:1px solid hsla(15,100%,34%,1);
}
.eraberu h2{
	background:linear-gradient(90deg,#f99,#fda,#9f9,#99f);
	color: hsla(0,0%,100%,1);
}
.eraberu p{
	padding-left:1em;
}
.eraberu a{
	color: hsla(15,100%,34%,1);
	text-decoration: none;
}
.eraberu a:hover{
	color: hsla(15,100%,68%,1);
	text-decoration: underline;
}
.eraberu img{
	margin:0 auto;
}

/********************
  Facebook
********************/
.fb{
	border:1px solid hsla(220,44%,41%,1);
}
.fb h2{
	background: hsla(220,44%,41%,1);
	color: hsla(0,0%,100%,1);
}
.fb p{
	padding-left:1em;
}
.fb-page{
	border:none;
}

/********************
RESEARXCH PERFORMANCE (2nd MENU)
********************/
#menu-research, #menu-book, #menu-writer{
	list-style-type:none;
}

#menu-research li, #menu-book li, #menu-writer li{
	clear: both;
	padding-left:40px;
	color: #333;
}

/********************
  RANDOM
********************/
#random {
	width:650px;
	margin-bottom:10px;
	clear:both;
}
#random div{
	position: relative;
	width:320px;
	height:380px;
	border:1px solid hsla(15,100%,34%,1);
	font-size: 15px;
    -webkit-box-shadow:0px 6px 3px -3px #ccc;
       -moz-box-shadow:0px 6px 3px -3px #ccc;
            box-shadow:0px 6px 3px -3px #ccc;
}
#random h2{
	background:linear-gradient(90deg,#f99,#fda,#9f9,#99f);
	color: hsla(0,0%,100%,1);
	font-size: 20px;
	font-weight:bold;
}
#random p{
	margin:0;
	padding:0 0 0 1em;
}
#random a{
	color: hsla(15,100%,34%,1);
	text-decoration: none;
}
#random a:hover{
	color: hsla(15,100%,68%,1);
	text-decoration: underline;
}

/************************************************************
  CONTENTS
************************************************************/
#mainframe{
	width: 850px;
	min-height:650px;
	margin: 5px auto 0;
	font-size:14px;
	background: hsla(0,100%,100%,0.5);
	color: #333;
}

#mainframe ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
.smalltext{
	font-size:small;
	background:#f0f0f0;
	color:#333;
	line-height:125%;
}
.topizo{
	list-style: none;
	font-size: 10px;
}
.indent{
	text-indent: -1rem;
	padding-left: 2rem;
}
.donation{
	position: relative;
	width:320px;
	height:380px;
	margin-bottom:5px;
	border:1px solid hsla(75,100%,34%,1);
	font-size: 14px;
}
.donation h2{
	background: hsla(75,100%,34%,1);
	color: hsla(0,0%,100%,1);
}
.donation p{
	padding-left:1em;
}
.donation a{
	color: hsla(75,100%,17%,1);
	text-decoration: none;
}
.donation a:hover{
	color: hsla(75,100%,34%,1);
	text-decoration: underline;
}
.donation ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
.donation li {
	clear: both;
	padding-left:10px;
	color: #333;
	font-size:14px;
}


/********************
  組織関連:紺色
hsla(210,80%,20%,1);
#0A335C;
********************/
.blue {
	color: hsla(210,80%,20%,1);
}
.blue h2{
	background: hsla(210,80%,20%,1);
	color: hsla(0,0%,100%,1);
}
.blue h3{
	background: hsla(210,80%,40%,0.5);
	color: hsla(0,0%,100%,1);
}
.blue p {
	padding-left:1em;
}
.blue a{
	color: hsla(210,80%,20%,1);
	text-decoration: none;
}
.blue a:hover{
	color: hsla(210,80%,50%,1);
	font-weight:bold;
	text-decoration: underline;
}
.blue .listtitle {
	padding-left:40px;
	background: hsla(210,80%,90%,1);
	font-size: 13px;
	font-weight:bold;
}
.blue .listdate {
	text-align: right;
	font-size: 10px;
}

.info li {
	line-height:2rem;
	padding-left:200px;
}
.info .subtitle {
	display: inline-block;
	float: left;
	width: 160px;
	margin-left:-160px;
	font-size: 13px;
	font-weight:bold;
}

.disclosure li {
	line-height:2rem;
	padding-left:120px;
}
.disclosure .listpdf {
	margin: 10px 0;
	background-image:url("./images/pdf_icon.png");
	background-repeat:no-repeat;
	background-position:90px 0px;
	color: #333;
}


.starting li {
	padding-left:40px;
}
.starting li span {
	display: inline-block;
	float: left;
	width: 140px;
}
.starting .listname {
	padding-left: 120px;
	font-size: 13px;
}

#map_column{
	width:500px;
}
#map_cap {
	width: 300px;
	font-size: 13px;
}


/********************
  寄付関連:草色
hsla(75,80%,40%,1);
#8FB814;
********************/

.green {
	color: hsla(75,80%,20%,1);
}
.green h2{
	background: hsla(75,80%,40%,1);
	color: hsla(0,0%,100%,1);
}
.green h3{
	background: hsla(75,80%,40%,0.5);
	color: hsla(0,0%,100%,1);
}
.green h4{
	margin: 0;
	padding-left:1em;
	font-size: 18px;
	font-weight:bold;
	line-height:2rem;
	background: hsla(75,80%,40%,1);
	color: hsla(0,0%,100%,1);
}
.green a{
	color: hsla(75,80%,40%,1);
	text-decoration: none;
}
.green a:hover{
	color: hsla(75,80%,60%,1);
	font-weight:bold;
}
.donations p{
	padding-left:1em;
}

.donations img{
	margin:15px auto;
}
.donations li {
	padding-left:40px;
}
.donations .caution {
	font-size: 13px;
	color: hsla(0,66%,50%,1);
}
.listpdf{
	margin-top:0.5rem;
	padding-left:60px;
	background-image:url("./images/pdf_icon.png");
	background-repeat:no-repeat;
	background-position:30px 0px;
	height:2.5rem;
}
.listdocx{
	margin-top:0.5rem;
	padding-left:60px;
	background-image:url("./images/docx_icon.png");
	background-repeat:no-repeat;
	background-position:30px 0px;
	height:2.5rem;
}
.square_btn{
    display: inline-block;
	margin:10px 0 0 50px;
    padding: 0.5em 1em;
	color: hsla(75,100%,100%,0.5);
    text-decoration: none;
	background: hsla(75,50%,34%,1);
    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.29);
    border-bottom: solid 3px hsla(75,60%,60%,0.5);
    border-radius: 20px;/*角の丸み*/
    font-weight: bold;
    text-shadow: -1px -1px rgba(255, 255, 255, 0.8), 1px 1px rgba(0, 0, 0, 0.5);
  }
.square_btn:active{/*ボタンを押したとき*/
    -ms-transform: translateY(4px);
    -webkit-transform: translateY(4px);
    transform: translateY(4px);
    box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.2);
    border-bottom: none;
}
.square_btn:hover{
	color: hsla(75,100%,100%,0.5);
	text-decoration: none;
}


.leadtext{
	padding:0 50px 1px;
}

.contributors{
	width:410px;
	margin-top: 5px;
	background: hsla(180,100%,100%,1);
	border:1px solid hsla(75,100%,34%,1);
	border-left:5px solid hsla(75,100%,34%,1);
}
.contributors .subtitle {
	display: inline-block;
	width: 90px;
	margin-left: -100px;
	padding-left: 10px;
	font-size: 10px;
}
.contributors p{
	padding:0 10px 10px 100px;
}
.link {
	border-bottom:1px solid hsla(255,80%,40%,0.5);
	font-weight:bold;
	line-height:150%;
	text-align: right;
	padding-right: 40px;
}


/********************
  助成関連:青緑
hsla(180,80%,40%,1);
#14B8B8;
********************/
.bluegreen {
	color: hsla(180,80%,20%,1);
}
.bluegreen h2{
	background: hsla(180,80%,40%,1);
	color: hsla(0,0%,100%,1);
}
.bluegreen h3{
	background: hsla(180,80%,40%,0.5);
	color: hsla(0,0%,100%,1);
}
.bluegreen a{
	color: hsla(180,80%,40%,1);
	text-decoration: none;
}
.bluegreen a:hover{
	color: hsla(180,80%,60%,1);
	font-weight:bold;
	text-decoration: underline;
}

.assist li {
	padding-left:80px;
}
.assist li span {
	display: inline-block;
	float: left;
	width: 70px;
	margin-left:-70px;
	padding: 2px 0;
	font-size: 13px;
	color: hsla(75,50%,17%,1);
}
.assist .caution {
	padding-left:60px;
	font-size: 13px;
	color: hsla(0,66%,50%,1);
}
.assist .listpdf{
	padding-left:70px;
	background-image:url("./images/pdf_icon.png");
	background-repeat:no-repeat;
	background-position:40px 0px;
	height:2.5rem;
}
.assist .listdocx{
	padding-left:70px;
	background-image:url("./images/docx_icon.png");
	background-repeat:no-repeat;
	background-position:40px 0px;
	height:2.5rem;
}

.assist .aster {
	font-size: 13px;
	color: hsla(0,66%,50%,1);
}

.assist img{
	margin:10px 5px;
}


/********************
  お知らせ関連:紺色
hsla(210,80%,20%,1);
#0A335C;
********************/
.news p{
	padding:0 40px 10px;
}
.news .listdate {
	text-align: right;
	font-size: 10px;
}

.imageflame{
	display: inline-block;
	float: right;
	margin: 10px;
}
/********************
  TEXT
********************/
span.red {
	color: red;
}
span.green {
	color: green;
}
span.blue {
	color: blue;
}
span.purple {
	color: purple;
}
span.orange {
	color: orange;
}
span.brown {
	color: brown;
}
span.pink {
	color: pink;
}
/********************
 エラベル
********************/
.button{
	position: relative;
	width:100%;
	margin-top:-200px;
	z-index:10;
}
.progress{
	position: relative;
	display:block;
	z-index:1;
	width:100%;
	height: 160px;
}
#loading {
  position: absolute;
  left: 50%;
}

.target {
	float:left;
	width:160px;
	height:160px;
	margin-left:10px;
}
.targettext {
	display:inline-block;
	width:160px;
	height:160px;
	background: hsla(180,80%,90%,0.6);
	border:1px solid hsla(180,44%,41%,1);
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
	font-size: 12px;
	text-align:center;
}
.num3 {
	font-size:22px;
}
.targettext b{
	font-size: 20px;
	font-weight:bold;
}
.finish {
	display:inline-block;
	width:160px;
	height:160px;
	background: hsla(360,80%,90%,0.6);
	border:1px solid hsla(360,44%,41%,1);
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
	font-size: 12px;
	text-align:center;
}
.finish b{
	font-size: 20px;
	color:hsla(360,90%,50%,1);
	font-weight:bold;
}
.finish p{
	font-size: 12px;
	line-height: 120%;
}


#link_jump {
	float:right;
	width:160px;
	height:160px;
	margin-right:30px;
}
.jump_button {
	display:inline-block;
	width:160px;
	height:160px;
	background: hsla(75,80%,80%,0.6);
	border:1px solid hsla(75,44%,41%,1);
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
	font-size: 18px;
	font-weight:bold;
	text-align:center;
	line-height: 160px;
}


/********************
form
********************/
dl {
  display: flex; /* Flexible Boxを有効化 */
  flex-wrap: wrap; /* はみ出そうな時の折り返しを有効化 */
}
dt {
	margin: 0;
	border-bottom:#ccc 1px dotted;
	padding: 10px;
	background: #eee;
}
dt.w25 {
	width: 25%;
}
dt.w50 {
	width: 50%;
}
dt.white {
	background: #fff;
	font-size: 12px;
}
dd {
	background: #fff;
	margin: 0;
	border-bottom:#ccc 1px dotted;
	padding: 10px;
}
dd.w75 {
	width: 75%;
}
dd.w25 {
	width: 25%;
}


.form li {
	padding:5px 40px;
	font-size:14px;
}
.form .caution {
	font-size: 12px;
	color: hsla(0,66%,50%,1);
}
.form .caution2 {
	font-size: 12px;
	color: hsla(270,66%,50%,1.00);
}
input[type="text"],input[type="email"],input[type="tel"],input[type="number"],input[type="date"],textarea, select {
	width: 300px;
	padding: 0.2em;
	outline: none;
	border: 1px solid hsla(75,5%,50%,0.5);
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	font-size: 16px;
}
input[type="text"]:focus,input[type="email"]:focus,input[type="tel"]:focus,input[type="number"]:focus,input[type="date"]:focus,textarea:focus {
	box-shadow: 0 0 4px hsla(0,100%,60%,0.5);
	border: 1px solid hsla(0,100%,60%,0.5);
}
input.submitbuttom {
	border-radius: 0;	
	background: -moz-linear-gradient(top, #FFF 0%, #EEE);
	background: -webkit-gradient(linear, left top, left bottom, from(#FFF), to(#EEE));
	border: 1px solid #DDD;
	color: #111;
	padding: 10px 30px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
}
input.submitbuttom:hover {
	background: -moz-linear-gradient(top, #EFEFEF 0%, #EEE);
	background: -webkit-gradient(linear, left top, left bottom, from(#EFEFEF), to(#EEE));
}



/********************
 POSTING PAGE
********************/

.post {
	width:100%;
	min-height:200px;
	margin: 20px 0;
	padding: 10px 20px;
	border:1px solid hsla(75,100%,34%,1);
	font-size:15px;
	font-weight:normal;
	color:#333;
}

.post h2{
	background: hsla(75,100%,34%,1);
	color: hsla(0,0%,100%,1);
}
.post h2 a{
	padding-left:1em;
	color: hsla(0,0%,100%,1);
	line-height:2rem;
	text-decoration: none;
}
.post .subtitle{
	font-weight:bold;
}
.post h3{
	background: hsla(75,80%,40%,0.5);
	color: hsla(0,0%,100%,1);
}

.post-date{
	text-align: right;
	font-size:small;
	line-height:1rem;
	color: hsla(75,100%,17%,1);
}
.post-category,
.post-tag,
.comment-num,
.post-author{
	text-align: right;
	font-size:xx-small;
	line-height:1rem;
}

.post-category a,
.post-tag a,
.comment-num a,
.post-author a{
	font-size:xx-small;
	line-height:1rem;
	color: hsla(75,100%,17%,1);
	text-decoration: underline;
}



/****************************************
          Comments Area
*****************************************/
#comment-area{
	color:#333 ;
	background-color:#f0f0f0;
	font-family: 'Josefin Sans', sans-serif;
	padding: 10px 40px;
}
#comment-area h3{
	font-size: 150%;
}

.required{ color: #fe56aa;}

.commets-list,
.trackback-list{
	overflow: hidden;
	margin-top: -20px;
	margin-bottom: 40px;
}
	.commets-list li,
	.trackback-list li{
		overflow: hidden;
		margin-top: -1px;
		padding: 20px 0 0;
		width: 100%;
		border-top: 1px solid #ddd;
		border-bottom: 1px solid transparent;
	}
		.commets-list .avatar{
			float: left;
			margin-right: 10px;
			margin-bottom: 10px;
		}

		.comment-meta,
		.reply,
		.comment-notes,
		.form-allowed-tags,
		span.small{
			font-size: 80%;
		}

		.comment-body p{
			clear: both;
		}
		.reply{
			text-align: right;
		}

/****************************************
          WordPress Misc
*****************************************/

.aligncenter {
	display: block;
	margin-right: auto;
	margin-left: auto;
}

.alignleft {
	float: left;
}

.alignright {
	float: right;
}

.wp-caption {
	margin: 10px;
	padding-top: 4px;
	border: 1px solid #ddd;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	background-color: #f3f3f3;
	text-align: center;
}

.wp-caption-text,
.gallery-caption{
	font-size: 80%;
}

.wp-caption img {
	margin: 0;
	padding: 0;
	border: 0 none;
}

.wp-caption-dd {
	margin: 0;
	padding: 0 4px 5px;
	font-size: 11px;
	line-height: 17px;
}

img.alignright {
    display: inline-block;
    margin: 0 0 1em 1.5em;
}

img.alignleft {
    display: inline-block;
    margin: 0 1.5em 1em 0;
}

.pager{
	overflow: hidden;
	margin-top: 40px;
	margin-bottom: 40px;
	border-top: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
}
.pager > div{
	width: 50%;
}

.pager .alignright{
	text-align: right;
	}

.pager a{
	display: block;
	padding: 0.5em;
	border: none;
	color: hsla(75,80%,20%,1);
	text-decoration: none;
}
.pager a:hover{
	border-left: 1px solid #ddd;
	background: hsla(75,80%,40%,0.5);
	color: hsla(75,80%,100%,1);
}

.listpager{
	margin:10px 0;
}
.page-numbers{
	display: inline-block;
	padding: 0.5em 1em;
	border:1px solid hsla(210,80%,20%,1);
	color: hsla(210,80%,20%,1);
	text-decoration: none;
	text-align: center;
}
.listpager a:hover{
	background: hsla(210,80%,20%,0.3);
	color: hsla(210,80%,100%,1);
}
.current {
	background: hsla(210,80%,20%,0.2);
}
figure{
	background:#fff;
	border:none;
	max-width:33%;
	padding:5px;
}
.figcaption{
	color:#555;
	font-size:x-small;
	font-weight:bold;
	line-height:120%;
}
blockquote{
	position: relative;
	width:90%;
	margin-bottom:5px;
	padding:5px 20px;
	border:1px solid hsla(75,100%,34%,1);
}

.eraberulink{
	position:relative;
	margin-top:10px;
	margin-bottom:-40px;
}
.pickup{
	font-size: 20px;
	color:hsla(360,90%,50%,1);
	font-weight:bold;
}

table{
	padding:1px;
	background:#ccc;
}
th{
	padding:1px;
	background:#ddd;
}td{
	padding:1px;
	background:#fff;
}