/* common
------------------------------------------------------------------------------*/
.inner {
  padding: 0 calc( 60 / 750 * 100vw );
}

/* #ttl h2
------------------------------------------------------------------------------*/
#main #ttl h2 {
  background: url("/common/img/top_vision_logo.svg") center calc( 76 / 750 * 100vw ) / calc( 226 / 750 * 100vw ) auto no-repeat;
}

/* #about
------------------------------------------------------------------------------*/
#about {
}

/* .cnt */
#about .cnt .inner {
  padding-bottom: calc( 105 / 750 * 100vw );
}
#about .cnt h2 {
  position: relative;
  font-size: calc( 40 / 750 * 100vw );
  line-height: calc( 74 / 750 * 100vw );
  letter-spacing: 0.15em;
  padding-bottom: calc( 33 / 750 * 100vw );
  margin-bottom: calc( 26 / 750 * 100vw );
}
#about .cnt h2::after {
  content: "";
  display: block;
  width: calc( 76 / 750 * 100vw );
  border-bottom: #00a0e9 solid calc( 4 / 750 * 100vw );
  position: absolute;
  left: 0;
  bottom: 0;
}
#about .cnt h2 strong {
  font-size: calc( 58 / 750 * 100vw );
  letter-spacing: 0.05em;
}
#about .cnt h2 strong strong {
  color: #00a0e9;
}

/* .movie */
#about .movie.cnt {
  background: #f3f3f3;
}
#about .movie.cnt .inner {
  padding-top: calc( 455 / 750 * 100vw );
}
#about .movie.cnt div.mv {
  position: absolute;
  left: calc( 60 / 750 * 100vw );
  top: calc( 60 / 750 * 100vw );
  width: calc( 630 / 750 * 100vw );
  /*
  padding-top: calc( 630 / 16 * 9 / 750 * 100vw );
  */
}
#about .movie.cnt div.mv iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  vertical-align: bottom;
}

/* .g2040 */
#about .g2040.cnt .inner {
  padding-top: calc( 637 / 750 * 100vw );
}
#about .g2040.cnt div.logo {
  position: absolute;
  left: calc( 296 / 750 * 100vw );
  top: calc( 120 / 750 * 100vw );
  width: calc( 158 / 750 * 100vw );
}
#about .g2040.cnt dl {
  margin: calc( 110 / 750 * 100vw ) 0 calc( 60 / 750 * 100vw );
}
#about .g2040.cnt dl dt {
  font-size: calc( 34 / 750 * 100vw );
  line-height: calc( 34 / 750 * 100vw );
  letter-spacing: 0.1em;
  font-weight: bold;
  margin-bottom: calc( 26 / 750 * 100vw );
  padding: calc( 3 / 750 * 100vw ) 0 calc( 3 / 750 * 100vw ) calc( 55 / 750 * 100vw );
  background: url("/common/img/icn_octa.svg") left center / auto 100% no-repeat;
}
#about .g2040.cnt dl dd strong {
  color: #00a0e9;
  font-size: calc( 29 / 750 * 100vw );
  line-height: calc( 53 / 750 * 100vw );
  letter-spacing: 0.075em;
  font-weight: bold;
}
#about .g2040.cnt dl dd p.atte {
  display: block;
  font-size: calc( 18 / 750 * 100vw );
  line-height: calc( 18 / 750 * 100vw );
  letter-spacing: 0.075em;
  font-weight: normal;
}
#about .g2040.cnt dl dd + dt {
  margin-top: calc( 48 / 750 * 100vw );
}

/* #keyword
------------------------------------------------------------------------------*/
#keyword h2.ttl {
  margin-bottom: calc( 118 / 750 * 100vw );
}

/* .cnt */
#keyword .cnt {
  overflow-x: hidden;
}
#keyword .cnt .inner {
  padding-bottom: calc( 105 / 750 * 100vw );
}
#keyword .cnt h2 {
  position: relative;
  margin-bottom: calc( 40 / 750 * 100vw );
}
#keyword .cnt h2 p {
  display: block;
  position: relative;
  color: #00a0e9;
  font-size: calc( 28 / 750 * 100vw );
  line-height: calc( 28 / 750 * 100vw );
  letter-spacing: 0.1em;
  padding: calc( 48 / 750 * 100vw ) 0 calc( 15 / 750 * 100vw ) calc( 162 / 750 * 100vw );
}
#keyword .cnt h2 p::after {
  content: "";
  display: block;
  width: 100vw;
  border-bottom: #00a0e9 solid calc( 4 / 750 * 100vw );
  position: absolute;
  left: calc( 162 / 750 * 100vw );
  bottom: 0;
}
#keyword .cnt h3 {
  color: #00a0e9;
  font-size: calc( 46 / 750 * 100vw );
  line-height: calc( 70 / 750 * 100vw );
  letter-spacing: 0.075em;
  font-weight: bold;
  margin-bottom: calc( 20 / 750 * 100vw );
}
#keyword .cnt h3 strong {
  display: inline-block;
  background: url("/common/img/txt_line_y.png") left 88% / auto calc( 28 / 750 * 100vw ) repeat-x;
}
#keyword .cnt rt {
  font-size: 0.4em;
}
#keyword .cnt p.txt + div.img {
  margin-top: calc( 47 / 750 * 100vw );
}

/* .ky01 */
#keyword .ky01.cnt .inner {
}
#keyword .ky01.cnt h2 {
  padding-bottom: calc( 438 / 750 * 100vw );
  background: url("/vision/img/vision_keyword01_img01_sp.png") left bottom / 100% auto no-repeat;
}
#keyword .ky01.cnt h2 p {
  background: url("/vision/img/vision_keyword01_no.svg") left bottom / auto 100% no-repeat;
}

/* .ky02 */
#keyword .ky02.cnt .inner {
}
#keyword .ky02.cnt h2 {
  padding-bottom: calc( 410 / 750 * 100vw );
  background: url("/vision/img/vision_keyword02_img01_sp.png") left bottom / 100% auto no-repeat;
}
#keyword .ky02.cnt h2 p {
  background: url("/vision/img/vision_keyword02_no.svg") left bottom / auto 100% no-repeat;
}

/* .ky03 */
#keyword .ky03.cnt .inner {
}
#keyword .ky03.cnt h2 {
  padding-bottom: calc( 410 / 750 * 100vw );
  background: url("/vision/img/vision_keyword03_img01_sp.png") left bottom / 100% auto no-repeat;
}
#keyword .ky03.cnt h2 p {
  background: url("/vision/img/vision_keyword03_no.svg") left bottom / auto 100% no-repeat;
}

/* #dbook
------------------------------------------------------------------------------*/
#dbook {
  background: url("/dbook/img/dbook_bg_sp.png") center top / 100% auto no-repeat;
}
#dbook .inner {
  padding: calc( 60 / 750 * 100vw ) calc( 30 / 750 * 100vw ) calc( 120 / 750 * 100vw );
}
#dbook h2.ttl {
  padding: calc( 46 / 750 * 100vw ) 0 calc( 60 / 750 * 100vw );
}
#dbook .books {
  background: #fff;
  padding-left: calc( 60 / 750 * 100vw );
  padding-bottom: 1px;
  font-size: 0;
}
#dbook .books dl {
  display: inline-block;
  padding: calc( 60 / 750 * 100vw ) 0;
  margin-right: calc( 60 / 750 * 100vw );
  margin-bottom: calc( 60 / 750 * 100vw );
  width: calc( 254 / 750 * 100vw );
  vertical-align: top;
  position: relative;
}
#dbook .books dl dt {
  display: table;
  height: calc( 360 / 750 * 100vw );
}
#dbook .books dl dt p {
  display: table-cell;
  vertical-align: middle;
}
#dbook .books dl dt p img {
  box-shadow: calc( 6 / 750 * 100vw ) calc( 8 / 750 * 100vw ) calc( 10 / 750 * 100vw ) 0px rgba(0, 0, 0, 0.2);
}
#dbook .books dl dd.ttl {
  font-size: calc( 24 / 750 * 100vw );
  line-height: calc( 34 / 750 * 100vw );
  letter-spacing: 0.1em;
  font-weight: bold;
  padding: calc( 24 / 750 * 100vw ) 0 calc( 10 / 750 * 100vw );
}
#dbook .books dl dd.size {
  background: #e2f4fe;
  display: inline-block;
  color: #00a0e9;
  font-size: calc( 16 / 750 * 100vw );
  line-height: calc( 16 / 750 * 100vw );
  letter-spacing: 0.1em;
  font-weight: bold;
  padding: calc( 8 / 750 * 100vw ) calc( 15 / 750 * 100vw );
}
#dbook .books dl dd.txt {
  font-size: calc( 18 / 750 * 100vw );
  line-height: calc( 30 / 750 * 100vw );
  letter-spacing: 0.075em;
  padding: calc( 20 / 750 * 100vw ) 0;
}
#dbook .books dl dd.link a {
  position: absolute;
  left: 0;
  bottom: 0;
  display: block;
  background: #00a0e9;
  width: calc( 96 / 750 * 100vw );
  height: calc( 60 / 750 * 100vw );
  box-sizing: border-box;
  color: #fff;
  font-size: calc( 28.8 / 750 * 100vw );
  line-height: calc( 28.8 / 750 * 100vw );
  letter-spacing: 0.1em;
  text-decoration: none;
  font-weight: bold;
  text-align: center;
  padding-top: calc( 17 / 750 * 100vw );
}
#dbook .books dl dd.dl a {
  position: absolute;
  right: 0;
  bottom: 0;
  display: block;
  background: #000;
  width: calc( 147 / 750 * 100vw );
  height: calc( 60 / 750 * 100vw );
  box-sizing: border-box;
  color: #fff;
  font-size: calc( 19.2 / 750 * 100vw );
  line-height: calc( 19.2 / 750 * 100vw );
  letter-spacing: 0em;
  text-decoration: none;
  font-weight: bold;
  text-align: center;
  padding-top: calc( 21 / 750 * 100vw );
}
#dbook .books dl.en dd.ttl {
  font-size: calc( 18 / 750 * 100vw );
  line-height: calc( 34 / 750 * 100vw );
  letter-spacing: 0.05em;
}
#dbook .books dl.en dd.dl a,
#dbook .books dl.en dd.link a {
  font-size: calc( 22 / 750 * 100vw );
  line-height: calc( 22 / 750 * 100vw );
  letter-spacing: 0.1em;
  padding-top: calc( 20.4 / 750 * 100vw );
}

/* #popup
------------------------------------------------------------------------------*/
#popup {
  display: none;
  height: 100%;
  width: 100%;
  position: fixed;
  top: 0;
  left: 0;
  padding-top: calc( 30 / 750 * 100vw );
  box-sizing: border-box;
  z-index: 5500;
}
#popup .bg {
  height: 100%;
  width: 100%;
  background: rgba(0, 0, 0, 0.9);
  position: fixed;
  top: 0;
  left: 0;
  z-index: 5510;
}
#popup .cnt {
  position: relative;
  top: 50%;
  left: calc( 15 / 750 * 100vw );
  width: calc( 720 / 750 * 100vw );
  height: calc( 720 /16 * 9 / 750 * 100vw );
  margin-top: calc( -720 / 16 * 9 / 750 * 100vw / 2 );
  z-index: 5520;
}
#popup .cnt iframe {
  width: 100%;
  height: 100%;
}
#popup #popup-close {
  width: calc( 50 / 750 * 100vw );
  position: absolute;
  right: calc( 30 / 750 * 100vw );
  top: calc( 30 / 750 * 100vw );
  z-index: 5530;
  line-height: 0.1;
}