body{position: relative;}
#about{font-size: 16px;}
#about p{text-align: justify; margin-bottom: 1em;}
#about h1,#about h2,#about h3,#about h4{font-size: 38px; font-weight: normal; margin-bottom: 1em;}
#about ul#myScrollspy{margin-top: 5vw;}
#about ul#myScrollspy>li{background: url(../images/icon_1.png) no-repeat left center; padding-left: 7%; background-size: auto 90%;}
#about ul#myScrollspy>li:nth-of-type(2){background-image: url(../images/icon_2.png);}
#about ul#myScrollspy>li:nth-of-type(3){background-image: url(../images/icon_3.png);}
#about ul#myScrollspy>li:nth-of-type(4){background-image: url(../images/icon_4.png);}
#about ul#myScrollspy>li dt{font-size: 60px; line-height: 1em; margin-bottom: 10px; color: #145096;}
#about ul#myScrollspy>li dt>sup{font-size: .3em; top:-1.8em;}
#about ul#myScrollspy>li dd{font-size: 14px; line-height: 1em; color: #727272; }

@media (max-width: 1400px) {
  #about ul#myScrollspy>li dt{font-size: 50px;}
  #about ul#myScrollspy>li dd{font-size: 12px;}
}

@media (max-width: 1200px) {
  #about ul#myScrollspy>li{padding-left: 7%;}
  #about ul#myScrollspy>li dt{font-size: 40px;}
  #about h1,#about h2,#about h3,#about h4{font-size: 30px;}
}

@media (max-width: 1024px) {
  #about ul#myScrollspy>li dt{font-size: 30px;}
}

@media (max-width: 768px) {
  #about .col-half{width:100%;}
  #about ul#myScrollspy>li{margin-top:3vw; margin-bottom: 3vw;}
  #about ul#myScrollspy>li dt{font-size: 20px;}
  #about ul#myScrollspy>li dt>sup{font-size: .2em; top:-1.2em;}
  #about h1,#about h2,#about h3,#about h4{font-size: 26px;}
}

@media (max-width: 450px) {
  #about .col-four.f-l{width:47%; float: left;}
  #about ul#myScrollspy>li{padding-left: 14%;}
  #about p{margin-bottom: 3vw;}
  #about .pd{padding: 5vw;}
  #about h1,#about h2,#about h3,#about h4{font-size: 20px;}
  #sub>div{width:500px;}
}