@charset "UTF-8";

/* visual-S */
.visual{
  display: flex; justify-content: center; align-items: center;
  width: 100%; height: 525px;
  margin-bottom: 160px;
  background: url(../sub/img/sub-visual.png);
  position: relative;
}
.visual > strong{font-size: 50px; font-weight: 700; line-height: 60px; color: #fff;}
/* visual-E */
/* lnb-S */
.lnb{
  width: 100%; height: 54px;
  border-top: 1px solid rgba(255,255,255,0.3);
  background-color: rgba(0,0,0,0.5);
  position: absolute; left: 0; top: 470px;
}
.lnb-wrap{
  display: flex; justify-content: flex-start; align-items: center;
  width: 750px; height: 55px;
  padding-left: 10%;
}
.lnb-wrap > a{
  width: 56px; height: 55px;
  border: 1px solid rgba(255,255,255,0.3);
  border-top: none;
  border-bottom: none;
  font-size: 24px; line-height: 55px; color: #fff; text-align: center;
}
.lnb-li{
  flex: 1px;
  height: 55px;
  border-right: 1px solid rgba(255,255,255,0.3);
  font-size: 20px; font-weight: 700; line-height: 55px; color: #fff; text-align: center;
  position: relative;
}
.lnb-li > span{
  position: absolute; right: 0; top: 50%;
  transform: translate( -20px , -50%);
  cursor: pointer;
}
.lnb-li .sub-expand_more{display: none;}
.lnb-li > ul{
  display: none;
  width: 100%;
  position: absolute; left: 0; bottom: 55px;
}
.lnb-li > ul > li{
  width: 100%; height: 55px;
  background-color: #fff;
  transition: all .3s;
}
.lnb-li > ul > li > a{
  display: flex; justify-content: center; align-items: center;
  font-size: 16px; font-weight: 400; color: #777;
  transition: all .5s;
}
/* lnb-hover */
.lnb-li > ul > li:hover > a{
  font-weight: 700; color: #015060;
  background-color: #e9e9e9;
}
/* lnb-E */
/* FOOTER-S */
.f-site{border-top: 1px solid #e9e9e9;}
/* FOOTER-E */