header { width: 100%;  position:absolute;  z-index: 100;}
header a { color: #fff;}
.header-conteiner { display: flex;  max-width: 120rem; margin: 7rem auto 6rem; transition: none;  justify-content: center;  }
.header-conteiner h1 a { display:block; width: 20.3rem; height: 7.5rem; background: url(../images/logo_w.png) no-repeat left bottom / auto 100%;  }
.header-conteiner .gnb {   width: 100%; max-width: 79.8rem;  margin: 0 2rem; }
.header-conteiner .gnb > ul { display: flex; justify-content: space-between; margin-top: 1.5rem;}
.header-conteiner .gnb > ul li { text-align: center; font-size: 1.9rem; font-weight: 600; letter-spacing: -.1rem;}
.header-conteiner .gnb > ul li a { display: block; width: 100%; min-width: 9.7rem; height: 3.4rem; line-height: 3.4rem; } 
.header-conteiner .gnb > ul > li > ul { display: none;  margin-top: 2.5rem; opacity:0;  transition: .1s;  }
.header-conteiner .gnb.active > ul > li > ul{opacity: 1; animation-delay: .2s;}
.header-conteiner .gnb > ul > li > ul li ~ li { margin-top: 2.5rem; }

.header-conteiner .gnb > ul > li > ul > li > a { position: relative; height: 2.7rem; font-size: 1.8rem; font-weight: 600;} 
.header-conteiner .gnb > ul > li > ul > li > a::after { content: ''; width: 0; position: absolute; left: 0;	bottom: -.5rem;	height: .2rem;;  background: #91af96;	transition: .5s; }
.header-conteiner .gnb > ul > li > ul > li > a:hover::after { width: 100%; }

.header-conteiner > ul {display: flex; margin-left: 3.1rem;}
.header-conteiner > ul > li {  width: 5.6rem; max-height: 5.6rem; line-height: 5.6rem;  font-size: 1.6rem;  border: 1px solid #fff;   border-radius: 5.6rem; transition: .3s; text-align: center; overflow: hidden; }
.header-conteiner > ul > li ~ li { margin-left: 1.5rem;}
.header-conteiner > ul > li > a { display:block; width: 5.6rem; height: 5.6rem;  border-radius: 50%; transition: .3s; }
.header-conteiner > ul > li > ul { }
.header-conteiner > ul > li > ul > li  { line-height: 3rem; font-size: 1.3rem; }
.header-conteiner > ul > li > ul > li a { opacity: 1;}
.header-conteiner > ul > li > ul > li:last-child  { margin-bottom: 1rem; }
.header-conteiner > ul > li:hover { background-color: rgba(255, 255, 255, 0.781);  }
.header-conteiner > ul > li:hover > a { background-color: #fff; color: #595757;}
.header-conteiner > ul > li:nth-child(2):hover { max-height: 100%; }

.header-conteiner > ul > li > ul > li a {position: relative; font-weight: 500; color: #595757; }
.header-conteiner > ul > li > ul > li a::after { content: ''; width: 0; position: absolute; left: 0;	bottom: -.2rem;	height: .2rem;;  background: #91af96;	transition: .5s; }
.header-conteiner > ul > li > ul > li a:hover::after { width: 100%; }
.bg {position: absolute; z-index: 10; top: 0; left: 0;  width: 100%; height: 0; z-index: -1; background-color: #fff; opacity: 0; transition: .2s;}
.bg.active { height: 100%; opacity: 1;}
.container { display: none;}

/* 호버 임펙트  */
.header-conteiner .gnb .tab1:hover .tab2 li { display: block;}