#contents_visual .container div {
  width: 234px;
  height: 50px;
  margin-top: -25px;
  background: url(../images/environment/header.png);
}

#schedule > section {
  width: 340px;
  display: inline-block;
  margin-right: 27px;
  vertical-align:top;
}
#schedule > section.right {
  margin-right: 0;
}

#future .copy {
  display: block;
  margin: 60px auto;
}
#future ul.flow {
  margin-bottom: 60px;
}
#future ul.flow li {
  margin-bottom: 20px;
  padding-bottom: 74px;
  background: url(../images/environment/future/arrow.png) center bottom no-repeat;
}
#future ul.flow li:last-child {
  margin: 0;
  padding: 0;
  background: none;
}
#future ul.flow li.last {
  margin: 0;
  padding: 0;
  background: none;
}
#future ul.flow li .container {
  text-align: center;
  color: #fff;
  padding: 12px;
}
#future ul.flow li .container.c01 {
  border: 6px solid #82C0DF;
  background-color: #1492D1;
}
#future ul.flow li .container.c02 {
  border: 6px solid #cef1de;
  background-color: #5ac38c;
}
#future ul.flow li .container.c03 {
  border: 6px solid #ede8b1;
  background-color: #d0c229;
}
#future ul.flow li .container.c04 {
  border: 6px solid #f4d7c4;
  background-color: #df7b38;
}
#future ul.flow li .time {
  font-size: 13px;
  color: #fff;
  margin-bottom: 12px;
}
#future ul.flow li .theme {
  color: #fff;
  font-size: 20px;
/*  border-bottom: 1px solid #fff; */
  padding-bottom: 6px;
  margin-bottom: 12px;
}
#future .graph {
  display: block;
  margin: 0 auto;
}

table.timeline {
  border-collapse: collapse;
  width: 100%;
}
table.timeline td {
  padding: 4px 6px;
}
table.timeline th {
  background: url(../images/environment/timeline_bg.png) center top repeat-y;
  width: 32px;
}
table.timeline th div {
  width: 32px;
  height: 32px;
  -moz-border-radius: 16px;
  -webkit-border-radius: 16px;
  border-radius: 16px;
  background-color: #4E66AC;
  color: #fff;
  font-weight: bold;
  line-height: 32px;
  overflow: hidden;
}
table.timeline th div.empty {
  width: 16px;
  height: 16px;
  -moz-border-radius: 8px;
  -webkit-border-radius: 8px;
  border-radius: 8px;
  margin: 0 auto;
  background-color: #7C8CC8;
}
table.timeline td {
  vertical-align: top;
  padding-left: 8px;
}
table.timeline td div {
  min-height: 32px;
}
table.timeline td.c01 {
  color: #8C6239;
}
table.timeline td.c02 {
  color: #F26C4F;
}
table.timeline td.c03 {
  color: #4E66AC;
}
table.timeline td.c04 {
  color: #64AD02;
}
table.timeline td.c05 {
  color: #00AEEF;
}
table.timeline td.c06 {
  color: #a3ae26;
}

#history figure {
  margin: 0;
  padding: 0;
}
#history figure.right {
  width: 320px;
  float: right;
  margin: 0 0 24px 24px;
}
#history figure img {
  width: 100%;
  height: auto;
  display: block;
}
#history #book {
  padding: 8px;
  background-color: #f0e8d9;
  *zoom: 1;
}
#history #book:after {
  content: "";
  display: table;
  clear: both;
}
#history #book img {
  width: 160px;
  float: left;
  margin: 0 24px 0 0;
}
#history table {
  border-collapse: collapse;
  width: 100%;
}
#history table th {
  white-space: nowrap;
  width: 70px;
  border-top: 1px solid #cccccc;
  border-bottom: 1px solid #cccccc;
  border-right: 1px solid #cda96d;
  padding: 8px;
  text-align: left;
  vertical-align: top;
  color: #cda96d;
  background-color: #f0eae1;
}
#history table td {
  border-top: 1px solid #cccccc;
  border-bottom: 1px solid #cccccc;
  padding: 8px;
  line-height: 26px;
}
#history table td small {
  display: block;
}


#history iframe{
  width: 707px;
 height:398px;
}



@media screen and (max-width: 640px) {
  #contents_visual .container div {
    left: 12px;
    width: 117px;
    height: 23px;
    margin-top: -11.5px;
    background: url("../images/environment/header_m.png") left center no-repeat;
    -moz-background-size: 117px 23px;
    -o-background-size: 117px 23px;
    -webkit-background-size: 117px 23px;
    background-size: 117px 23px;
  }

  #schedule > section {
    width: 100%;
    margin-right: 0;
    box-sizing: border-box;
  }
  #schedule > section .contents_body {
    margin: 0 12px;
  }

  #future .copy {
    width: 94%;
    height: auto;
  }
  #future ul.flow li {
    margin-bottom: 20px;
    padding-bottom: 47px;
    background: url("../images/environment/future/arrow.png") center bottom no-repeat;
    -moz-background-size: 10.5px 27px;
    -o-background-size: 10.5px 27px;
    -webkit-background-size: 10.5px 27px;
    background-size: 10.5px 27px;
  }

  #qa section img.right {
    float: none;
    width: 96%;
    height: auto;
    margin: 0 auto;
  }

#history iframe{
	width:420px;
	height:315px;
}

}