@charset=utf-8;

body {
font-family: "Hiragino Kaku Gothic Pro", "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", YuGothic, "ヒラギノ角ゴ Pro W3", メイリオ, Meiryo, sans-serif;
	font-size: 14px;
	font-style: normal;
	line-height: 17px;
	color: #000000;
//  margin: auto;
//  width: 90%;

}
.title_Top{
	font-size: 30px;
	font-style: normal;
//        font-weight: bold;
	line-height: 42px;
	text-color: #000000;
  display: flex;
  justify-content: center;
}
.box1 {
	width:800px;
//    padding: 1em 1em;
//    margin: 0 0 1em 0;
    color: #000000;
    background: #ffffff;
    border: solid 1px #999999;/*線*/
    border-top: solid 10px #AE14C9;
    border-radius: 10px;/*角の丸み*/
}
.box2 {
	width: 800px;
//    padding: 1em 1em;
    margin: 1em 0;
    color: #ffffff;
    background: #AE14C9;
    border: solid 1px #999999;/*線*/
    border-radius: 10px;/*角の丸み*/
	font-size: 16px;
	font-style: normal;
	line-height: 32px;
}
.box3 {
	width: 780px;
    padding: 1em 1em;
    margin: 1em 0;
    color: #000000;
    background: #ffffff;
    border: solid 1px #999999;/*線*/
    border-radius: 10px;/*角の丸み*/
}
.next_button{
    border: 1px solid #999999;
    /*コレ*/border-radius: 5px;
    display: block;
    width: 200px;
    padding: 10px;
    box-sizing: border-box;
    background: #6fa1ff;
    color: #fff;
    text-decoration: none;
    text-align: center;
    margin: 8px 0;
	font-size: 18px;
	font-weight: bold;
}
.next_button:hover {
  color: #000000;
  opacity: 0.5;
}
/* 見出し付きボックス */
.cstm-box-titled {
	width: 800px;
    border-radius: 10px;/*角の丸み*/
    background: #ffffff;
//   --box-color: #AE14C9; /* 基本色 */
   margin: 1em 0; /* 外側余白（上下・中央寄せ） */
   border: 1px solid #999999; /* 枠線 */
//   max-width: 100%; /* 最大幅 */

	font-size: 18px;
}

.cstm-box-titled .box-title {

   background-color: #AE14C9; /* 見出し背景色 */
   color: #fff; /* タイトル文字色 */
   padding: 0.4em 0.5em; /* 内側余白 */
   text-align: center; /* 中央揃え */
  // font-weight: bold; /* 太字 */
     border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}

.box-content {
	padding: 1em 2em; /* コンテンツの内側余白 */
	font-size: 14px;
	line-height: 17px;
    color: #333333;
}
.textbox{
	width:80%;
    border: none;
    outline: none;
    border: 1px solid lightgray;
    border-bottom: 2px solid #999;
    padding: 5px 10px;
}

input + #list{
  display: none;
}
input:checked + #list {
  display:block;
}
#check{
  display:none;
}

input + #listB{
  display: none;
}
input:checked + #listB {
  display:block;
}
#checkB{
  display:none;
}
#switch{
width: 20px;
height: 20px;
background: url(arrow_open.gif) no-repeat;
background-size: 100% 100%;
cursor: pointer;
}
#switch.on_switch{
background: url(arrow_close.gif) no-repeat;
background-size: 100% 100%;
}
#switchB{
width: 20px;
height: 20px;
background: url(arrow_open.gif) no-repeat;
background-size: 100% 100%;
cursor: pointer;
}
#switch.on_switchB{
background: url(arrow_close.gif) no-repeat;
background-size: 100% 100%;
}

.table_width {
	max-width: 800px;
}
@media screen and (max-width: 480px) {
	/* 480px以下に適用されるCSS（スマホ用） */
.table_width {
	width: 100%;
}
.box1 {
	width:100%;
//    padding: 1em 1em;
//    margin: 0 0 1em 0;
    color: #000000;
    background: #ffffff;
    border: solid 1px #999999;/*線*/
    border-top: solid 10px #AE14C9;
    border-radius: 10px;/*角の丸み*/
}
}