/*-------------------------------------------------------------------
faqstyle.css
よくある質問
-------------------------------------------------------------------*/

@charset "utf-8";


/*-------------------------------------------------------------------
テーブル
-------------------------------------------------------------------*/
table.actab{
  width: 100%;
  border-collapse:separate;
  border-spacing: 0;

margin: 0 auto;
padding: 1em 1em 1em 1em;

/*table-layout: fixed;*/
/*table-layout: auto;*/

/*
margin: 0.5em 0.5em 0.5em 0;
padding: 1em 1em 1em 3em;
border-radius: 0.3em;
background: #f9e697;
box-shadow: 0 1px 2px 0 rgba(0,0,0,0.3);
*/

}

table.actab th:first-child{
/*  border-radius: 5px 0 0 0;*/
}

table.actab th:last-child{
/*  border-radius: 0 5px 0 0;*/
  border-right: 1px solid #3c6690;
}


table.actab th{
  text-align: center;
  color:white;
  /*background: linear-gradient(#4265A5,#6699ff);*/
  background: linear-gradient(#429900,#255500);
  /*border-left: 1px solid #334D7F;
  border-top: 1px solid #334D7F;
  border-bottom: 1px solid #334D7F;*/
  border-left: 1px solid #163300;
  border-top: 1px solid #163300;
  border-bottom: 1px solid #163300;
  box-shadow: 0px 1px 1px rgba(255,255,255,0.3) inset;
  /*width: 25%;*/
  padding: 10px 0;
}



table.actab th:wid01{
  width: 20%;
}
table.actab th:wid02{
  width: 25%;
}
table.actab th:wid03{
  width: 30%;
}



table.actab td{
  text-align: center;
  border-left: 1px solid #a8b7c5;
  border-bottom: 1px solid #a8b7c5;
  border-top:none;
  box-shadow: 0px -3px 5px 1px #eee inset;
  width: 25%;
  padding: 10px 0;

background: #fff;

}

table.actab td:last-child{
  border-right: 1px solid #a8b7c5;
}

table.actab tr:last-child td:first-child {
/*  border-radius: 0 0 0 5px;*/
}

table.actab tr:last-child td:last-child {
/*  border-radius: 0 0 5px 0;*/
}



/****************************
リスト
****************************/
div.aclist {
/*    width: 20em;
    margin: 10px;
    padding: 5px;
    border: 2px solid #8c8c8c ;*/
    margin: 0;
    padding: 0;
}
   .ulstty1 { list-style-type: circle; }
   .ulstty2 { list-style-type: disc; }
   .ulstty3 { list-style-type: square; }
   .olstty1 { list-style-type: decimal; }
   .olstty2 { list-style-type: lower-alpha; }
   .olstty3 { list-style-type: lower-greek; }
   .olstty4 { list-style-type: upper-alpha; }



/****************************
フラットボタンのホバーエフェクト
****************************/
button {
    /*margin: 0 20px 40px;*/
    margin: 0 10px 20px;
    padding: 1em 2em;
    border: none;
  box-sizing:border-box;
  /*width:150px;*/
  width:200px;
  display: inline-block;
  /*font-size: 114%;*/
  font-size: 1.2em;
  position: relative;
    cursor: pointer;
}
button::before,
button::after {
   box-sizing:border-box;
}
/*　buttonA　*/
.buttonA {
  border:3px solid rgb(51,102,204);
  background-color: rgba(51,102,204,.0);
  color:  rgba(51,102,204,1);
font-weight: bold;
/*
  border:3px solid rgb(27,115,186);
  background-color: rgba(27,115,186,.0);
  color:  rgba(27,115,186,1);
*/

}
.buttonA:hover {
  border:3px solid rgb(51,102,204);
  background-color: rgba(51,102,204,1);
/*
  border:3px solid rgb(27,115,186);
  background-color: rgba(27,115,186,1);
*/
  color: #fff;

}


ul.faqgroup {
  display: flex;
  list-style: none;
/*  justify-content: space-between;*/
}



/**************************************
よくある質問　アコーディオンメニュー
**************************************/
.half {
  float: left;
  width: 100%;
  /*padding: 0 1em;*/
  margin: 1em 1em;

}
/* Acordeon styles */
.tab {
  position: relative;
  margin-bottom: 1px;
  width: 97%;
  /* アコーディオン タブ文字色 */
  /*color: #fff;*/
  overflow: hidden;
}
input {
  position: absolute;
  opacity: 0;
  z-index: -1;
}
label {
  position: relative;
  display: block;
  padding: 0 0 0 1em;
  /* アコーディオン タブ背景色 */
  /*background: #da3c41;*/
  /*background: #6699ff;*/
  background: #FFC966;
  font-weight: bold;
font-size: 1.2em;
  line-height: 3;
  cursor: pointer;
}
/*
.blue label {
  background: #2980b9;
}
*/
.tab-content {
  max-height: 0;
  overflow: hidden;
  /* タブ内背景色 */
  /*background: #f2f2f2;*/
  background: #FFF5E5;
/*
  -webkit-transition: max-height .35s;
  -o-transition: max-height .35s;
  transition: max-height .35s;
*/

/*margin: 0 0 0.5em 0;*/
padding: 0 0.5em 1em 0.5em;
font-size: 1.1em;
font-weight: bold;
}
/*
.blue .tab-content {
  background: #3498db;
}
*/
.tab-content p {
/*  margin: 1em;*/
  margin-left: 1em;
  color: #000;/* タブ内文字色 */
line-height: 1em
max-height: 0%;
}


/*2行目以降、1文字字下げ*/
.indent-1 {
  margin-left: 1em;	/*tab-content内で使用するため、全体的に1文字余白*/
  padding-left:1em;	/*左側に1文字分の余白を作る*/
  text-indent:-1em;	/*最初の行だけその余白分のスペースに文字を移動させる*/
}
.indent-2 {
  padding-left:1em;	/*左側に2文字分の余白を作る*/
  text-indent:-1em;	/*最初の行だけその余白分のスペースに文字を移動させる*/
}

/* :checked */
input:checked ~ .tab-content {
  /*max-height: 20em;*/
  max-height: 100%;
}
/* Icon */
label::after {
  position: absolute;
  right: 0;
  top: 0;
  display: block;
  width: 3em;
  height: 3em;
  line-height: 3;
  text-align: center;
/*
  -webkit-transition: all .35s;
  -o-transition: all .35s;
  transition: all .35s;
*/
}
input[type=checkbox] + label::after {
  content: "+";
}
input[type=radio] + label::after {
  content: "\25BC";
}
input[type=checkbox]:checked + label::after {
  transform: rotate(315deg);
}
input[type=radio]:checked + label::after {
  transform: rotateX(180deg);
}



/****************************
対象商品
****************************/
.target_prd li{
	display:inline-block;
	margin:5px 2px;　/*←上下5px、左右2pxのマージン指定の場合*/
	list-style-type: none;
}
.target_prd li img {
	border:solid 1px #ccc;　/*←画像を1pxのグレーの枠線で囲む指定の場合*/
}


.target_banner{
    text-align: left;
    margin:2px 10px 5px 50px;

}

.target_banner figure {
    display: inline-block;
    margin:5px 10px;
}
.target_banner figure img {
    vertical-align: top;
    border:solid 1px #ccc;
}
.target_banner figure figcaption {
    text-align: center;
    font-weight: bold;
}


/****************************
回答内の画像
****************************/
.ans_imagebox{
  float: left;
}

.ans_imageclear{
  clear: both;	/*横並びを解除*/
}


/****************************
バナー
****************************/
.faq_banner {
  position: relative;
  margin-bottom: 20px;
  width: 97%;
  line-height: 3;
  background: #009933;
  text-align: center;
  border-radius: 10px;
  box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}

.faq_banner a {
  color: #ffffff;
  text-decoration: none;
  font-size: 1.2em;
  font-weight: bold;
  letter-spacing: 1px;
}

.faq_banner:hover {
  background: #2a7f57;
}

.faq_banner a:hover {
  text-decoration: none;
}