body{
  margin:0;
  background:#ccc;
  font-size:0;
}

.wrapper{
  background:white;
  width:1024px;
  margin:0 auto;
}

#iframe-head, #iframe-foot{
  border:none;
  margin: auto;
  display: block;
}

.top-wrapper{
  height:100px;
}

.container{
  width: 1024px;
  padding: 0;
  margin: 0 auto;
  overflow:hidden;
}

.choice h1{
  position: relative;
  padding: 5px;
  border-left: 10px solid #778899;
  font-size:40px;
  margin:10px 0 20px 20px;
  border-bottom: 5px solid #7ed1e;
}

.choice h1:before {
  position: absolute;
  left: -10px;
  bottom: 0;
  content: '';
  width: 10px;
  height: 50%;
  background-color: green;
}

.choice h1:after {
  position: absolute;
  left: 0;
  bottom: 0;
  content: '';
  width: 90%;
  height: 0;
  border-bottom: 3px solid #778899;
}

.select-wrapper {
  height:750px;
}

.flex{
  display:flex;
}

.exp-cap p{
  font-size:32px;
  font-weight:bold;
  margin:200px 0 0 20px;
}

.red{
  font-size:32px;
  font-weight:bold;
  color:maroon;
}

.select-visual img{
  width:600px;
  margin:0px 0 0 10px;
  border:solid 2px green;
  border-radius:4px;
  
}

.obj{
  text-align:center;
}

.obj img{
  width:150px;
}

.obj p{
  font-size:32px;
  font-weight:bold;
  margin-top:0;
}

.acordion-wrapper {
  height:1200px;
  padding-bottom: 10px;
  color: #5f5d60;
}

.acordion{
  float:left;
  margin-left:5px;
}

.heading h2{
  font-size:16px;
  margin:10px 0 5px 5px;
}

#effect-list {
  width: 380px;
  margin: 0 auto;
  padding: 0;
  list-style: none;
}

#effect-list li:hover{
  opacity:0.9;
}

.effect-list-item {
  margin:0px;
  padding:2px 0 0 30px;
  border:2px solid midnightblue;
  position:relative;
  cursor:pointer;
  text-align: left;
  border-radius:4px;
}

.effect-list-item h3 {
  font-size: 25px;
  color:black;
}

.number{
  font-size: 28px;
  color:rgb(240,2,172);
}

.effect-list-item span {
  position:absolute;
  top:0;
  right:5px;
  color:#ccc;
  font-size:35px;
}

.answer {
  font-size: 35px;
  display: none;
  padding: 5px 20px;
  margin-bottom: 15px;
}

.answer p{
  font-size:22px;
  font-weight:bold;
  color:rgb(50,50,50);
  margin-bottom:15px;
}

.answer a{
  color:blue;
  text-decoration:none;
}

.answer a:hover{
  opacity:0.5;
}

.level{
  width:23px;
  display:inline-block;
  margin:0 0 0 25px;
}

.full-img img{
  width:625px;
  margin-top:70px;
  border:solid 2px green;
  border-radius:4px;
}


.bottom-wrapper{
  height;200px;
  overflow:hidden;
}

.btn-choice{
  float:right;
  margin-right:20px;
}

.btn-rev{
  padding:8px 15px;
  margin:5px 0 10px 250px;
  background:#007700;
  color:white;
  display:inline-block;
  opacity:0.8;
  border-radius:4px;
}

.btn-back{
  padding:8px 15px;
  margin:5px 0 10px 30px;
  background:#000055;
  color:white;
  display:inline-block;
  opacity:0.8;
  border-radius:4px;
}

.btn-choice a{
  font-size:30px;
  color:white;
  text-decoration:none;
}




#footer{
  height:250px;
  background:#333F50;
}

#footer a{
  font-size:20px;
  color:white;
  text-decoration:none;
  margin:20px 180px;
  display:inline-block;
}


#footer img{
  width:300px;
  margin:30px 180px;
  display:block;
}
