@charset "UTF-8";
/*다국어*/
#language { position: absolute; right: 10rem; width: 7rem; z-index: 5; font-size: 2.3rem; line-height: 1; text-align: left; color: #424242; margin-top: 0; margin-right: 0; margin-bottom: 0; }
#language:before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; -moz-transition: all 0.1s ease; -webkit-transition: all 0.1s ease; transition: all 0.1s ease; width: 100%; height: 100%; background: white; z-index: 0; border-radius: 3.5rem; box-shadow: 0 -1px 1px rgba(0, 0, 0, 0.12), 0 1px 4px rgba(0, 0, 0, 0.24); }
#language .select, #language ul li { cursor: pointer; text-decoration: none; width: 100%; height: 100%; float: left; -moz-transition: all 0.1s ease; -webkit-transition: all 0.1s ease; transition: all 0.1s ease; position: relative; }
#language .select { padding: 1rem; z-index: 1; display: flex; align-items: center; color: #fff; height: 7rem; }
#language .select i { flex: none; font-size: 2.4rem; }
#language .select .icon-angle-down { margin-left: auto; -moz-transition: all 0.1s ease; -webkit-transition: all 0.1s ease; transition: all 0.1s ease; color: #424242; }
#language span { display: flex; width: 100%; height: 100%; position: relative; }
#language span:before { content: ''; position: absolute; top: 0; left: 0; z-index: 1; width: 100%; height: 100%; border-radius: 100%; border: 1px solid #000; opacity: 0.3; box-sizing: border-box; }
#language span img { width: 100%; height: 100%; }
#language ul { position: absolute; top: 7rem; z-index: 0; -moz-transition: all 0.1s ease; -webkit-transition: all 0.1s ease; transition: all 0.1s ease; overflow: hidden; width: 100%; height: 0; }
#language ul:hover { height: 7rem; }
#language ul:hover li { color: #757575; }
#language ul li { width: 100%; height: 7rem; list-style: none; padding: 1rem; line-height: 1.5; }
#language ul li.hide { z-index: -1; opacity: 0; display: none; }
#language ul li:hover { color: black; text-decoration: underline; }
#language ul li:hover span:before { opacity: 0.5; }
#language:hover:before { height: 14rem !important; }
#language:hover .select .icon-angle-down { transform: translate(0, 10%) rotate3d(100, 0, 0, 180deg) scale(1.3); }
#language:hover ul { height: 7rem !important; }

#header.headerFixed #language:before { box-shadow: 0 3px 6px rgba(0, 0, 0, 0.12), 0 3px 6px rgba(0, 0, 0, 0.24); }
#header.headerFixed #language .select { color: #424242; }
