@charset "UTF-8";

/* layout
++--------------------------------------------++*/
.kiji-bk{
	background: var(--color-bk5);}

@media (min-width: 768px){
	.kiji-wrapper{
		padding: 1em 7em}
}

@media (max-width: 767px){
	.kiji-wrapper{
		padding: 1em 1em}
}

/* faq
++--------------------------------------------++*/
dl{margin: 0 0 3em;}

.accordion .btn{
	/*text-align: center;*/
	border-left: 4px solid var(--color-bk4);
	background-color: var(--color-bk3);
	/*color: #ffff;*/
	font-size: 16px; font-size: 1.6rem;
	padding: 1em 2.5em 1em 1.5em;
	margin: 0.25em auto;
	cursor: pointer;}

.accordion dd{
	padding: 1em 2em;
	border: solid 1px #E6E6E6;
	background-color: #F7F7F7;}

dt:before{
	content: 'Q';
	font-size: 20px; font-size: 2.0rem;
	color: var(--color-accent2);
	padding-right: 1em;}

dd:before{
	content: 'A';
	font-size: 20px; font-size: 2.0rem;
	color: var(--color-accent2);
	padding-right: 0.5em;}

.accordion p{
	padding: 1em 0 0;}

.accordion ul{
	padding: 0 0 0em;
	list-style: circle inside;}

.accordion ul li{
	padding: 0em 0 0.5em 1em;}

/* effect
++--------------------------------------------++*/
.accordion dt{
	position:relative;}

.accordion dt .effect-a,
.accordion dt .effect-b{
	display: block;
	position: absolute;
	width: 18px;
	height: 1px;
	border-top: 3px solid #564e41;
	top: 48%;
	right: 3%;}

.accordion dt .effect-a{
	transform: rotate(90deg);}

.accordion dt.active .effect-a{
	transform: rotate(0deg);
	transition: transform 0.4s linear;}

.accordion dt.active .effect-b{
	content: "";
	display: none;}

/*.taka a{
	display: block;
	padding: 50px;
	background: #4d4448;
	font-size: 16px; font-size: 1.6rem;
	transform: rotate(-20deg);}

.taka a:hover{
	/*transform: rotate(0deg);*/
	/*padding: 300px;
	transition: padding 1.3s linear;
}*/

/* +- */
/*.accordion dt:after {
	content: "";
	position: absolute;
	width: 19px;
	height: 1px;
	border-top: 3px solid #564e41;
	top: 50%;
	right: 3%;}

.accordion dt:before{
	content: "";
	position: absolute;
	width: 1px;
	height: 19px;
	border-right: 3px solid #564e41;
	top: 36%;
	right: 4.7%;}

.accordion dt.active:before{
	content: "";
	display: none;}*/
