#mile-cont{position: relative;}
#mile-cont::after{position: absolute; color: #f3f3f3; content: attr(data-content); left:51.5%; bottom:0; font-size: 200px; font-weight: bold; line-height: 1; z-index: 0;}
#mile-cont>div{z-index: 5;}

.mile-nav{width:100%; font-size:20px; overflow-x:auto; padding-bottom: 30px; padding-top: 10px; margin-bottom: 8vw;}
.mile-nav::-webkit-scrollbar{display: none;}
.mile-nav>ul{width:200%; position: relative; height: 30px;}
.mile-nav>ul>div{position: absolute; left:51.865px; right:51.865px; bottom:-15px; height: 1px; background-color: #d8d8d8;}
.mile-nav>ul>li{display: block; width: 103.73px; float: left; text-align: center;}
.mile-nav>ul>li>a{display: block; width: 100%; position: relative;}
.mile-nav>ul>li>a::after{content:"|"; position: absolute; left:49%; bottom:-20px; font-size: 10px; color: #d8d8d8; z-index: 5;}
.mile-nav>ul>li.active{margin-top: -15px; z-index: 10;}
.mile-nav>ul>li.active>a{font-size: 30px; font-weight: bold; color:#b08c5c;}
.mile-nav>ul>li.active>a::after{font-weight: bold; font-size: 20px; bottom:-24px; color:#b08c5c;}
.mile-cont{clear: both; display: none; font-size: 16px;}
.mile-cont.active{display: block;}

@media (max-width:1200px) {
  #mile-cont::after{font-size: 100px;}
}

@media (max-width:768px) {
  #mile-cont::after{font-size: 100px;}
  .mile-cont{clear: both; display: none; font-size: 14px;}
}

@media (max-width:600px) {
  #mile-cont::after{display: none;}
}