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:920px;
}

.container{
  width: 1024px;
  padding: 0;
  margin: 0 auto;
}

.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: rgb(39,99,152);
}

.choice h1:after {
  position: absolute;
  left: 0;
  bottom: 0;
  content: '';
  width: 90%;
  height: 0;
  border-bottom: 3px solid #778899;
}

.index{
  width:945px;
  height:810px;
  margin:0 40px;
  background:rgb(39,99,152);
  border-radius :8px;
}

.flex-box {
  padding:  10px;
  display: flex;
}

.menu-item-top {
  margin:10px 10px 0 10px;
  align-self: stretch;
}

.menu-item {
  margin:0px 10px 0 10px;
  align-self: stretch;
}

img {
  width:287px;
  border-radius:8px;
}

.menu-left{
  margin:10px 10px 0 20px;
}

.menu-item-top img:hover{
  opacity:0.7;
}

.menu-item img:hover{
  opacity:0.7;
}

.menu-left img:hover{
  opacity:0.7;
}


.btn:hover{
  opacity:1;
}

.bottom-wrapper{
  height;100px;
}

.btn-choice{
  display:flex;
}

.btn-back{
  padding:8px 15px;
  margin:5px 0 10px 330px;
  background:#000055;
  color:white;
  display:inline-block;
  opacity:0.8;
  border-radius:4px;
}

.btn-choice a{
  font-size:30px;
  color:white;
  text-decoration:none;
}
