@font-face {
	font-family: 'Pretendard Variable';
	font-weight: 45 920;
	font-style: normal;
	font-display: swap;
	src: local('Pretendard Variable'), url('../fonts/PretendardVariable.woff2') format('woff2-variations');
}

@font-face {
    font-family: 'Pretendard';
    src: url('../fonts/Pretendard-Thin.woff') format('woff');
    font-weight: 100;
    font-display: swap;
}
@font-face {
    font-family: 'Pretendard';
    src: url('../fonts/Pretendard-ExtraLight.woff') format('woff');
    font-weight: 200;
    font-display: swap;
}
@font-face {
    font-family: 'Pretendard';
    src: url('../fonts/Pretendard-Light.woff') format('woff');
    font-weight: 300;
    font-display: swap;
}
@font-face {
    font-family: 'Pretendard';
    src: url('../fonts/Pretendard-Regular.woff') format('woff');
    font-weight: 400;
    font-display: swap;
}
@font-face {
    font-family: 'Pretendard';
    src: url('../fonts/Pretendard-Medium.woff') format('woff');
    font-weight: 500;
    font-display: swap;
}
@font-face {
    font-family: 'Pretendard';
    src: url('../fonts/Pretendard-SemiBold.woff') format('woff');
    font-weight: 600;
    font-display: swap;
}
@font-face {
    font-family: 'Pretendard';
    src: url('../fonts/Pretendard-Bold.woff') format('woff');
    font-weight: 700;
    font-display: swap;
}
@font-face {
    font-family: 'Pretendard';
    src: url('../fonts/Pretendard-ExtraBold.woff') format('woff');
    font-weight: 800;
    font-display: swap;
}
@font-face {
    font-family: 'Pretendard';
    src: url('../fonts/Pretendard-Black.woff') format('woff');
    font-weight: 900;
    font-display: swap;
}

@font-face {
  font-family: 'GmarketSans';
  font-weight: 300;
  font-style: normal;
  src: url('https://cdn.jsdelivr.net/gh/webfontworld/gmarket/GmarketSansLight.eot');
  src: url('https://cdn.jsdelivr.net/gh/webfontworld/gmarket/GmarketSansLight.eot?#iefix') format('embedded-opentype'),
       url('https://cdn.jsdelivr.net/gh/webfontworld/gmarket/GmarketSansLight.woff2') format('woff2'),
       url('https://cdn.jsdelivr.net/gh/webfontworld/gmarket/GmarketSansLight.woff') format('woff'),
       url('https://cdn.jsdelivr.net/gh/webfontworld/gmarket/GmarketSansLight.ttf') format("truetype");
  font-display: swap;
} 
@font-face {
  font-family: 'GmarketSans';
  font-weight: 500;
  font-style: normal;
  src: url('https://cdn.jsdelivr.net/gh/webfontworld/gmarket/GmarketSansMedium.eot');
  src: url('https://cdn.jsdelivr.net/gh/webfontworld/gmarket/GmarketSansMedium.eot?#iefix') format('embedded-opentype'),
       url('https://cdn.jsdelivr.net/gh/webfontworld/gmarket/GmarketSansMedium.woff2') format('woff2'),
       url('https://cdn.jsdelivr.net/gh/webfontworld/gmarket/GmarketSansMedium.woff') format('woff'),
       url('https://cdn.jsdelivr.net/gh/webfontworld/gmarket/GmarketSansMedium.ttf') format("truetype");
  font-display: swap;
} 
@font-face {
  font-family: 'GmarketSans';
  font-weight: 700;
  font-style: normal;
  src: url('https://cdn.jsdelivr.net/gh/webfontworld/gmarket/GmarketSansBold.eot');
  src: url('https://cdn.jsdelivr.net/gh/webfontworld/gmarket/GmarketSansBold.eot?#iefix') format('embedded-opentype'),
       url('https://cdn.jsdelivr.net/gh/webfontworld/gmarket/GmarketSansBold.woff2') format('woff2'),
       url('https://cdn.jsdelivr.net/gh/webfontworld/gmarket/GmarketSansBold.woff') format('woff'),
       url('https://cdn.jsdelivr.net/gh/webfontworld/gmarket/GmarketSansBold.ttf') format("truetype");
  font-display: swap;
} 
/*--------------------------------------------------------------
# General
--------------------------------------------------------------*/

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video {margin:0;padding:0;border:0;line-height:150%; font-weight:400; font-family:'Pretendard', Arial, sans-serif; font-size: 16px;} /* delete vertical-align,font:inherit; */
body {transition: .3s;}
body,html {width:100%; height:100%; font-size:16px; color:#444; line-height:150%; word-break:break-all; -webkit-text-size-adjust: 100%; -moz-text-size-adjust: 100%; -ms-text-size-adjust: 100%; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;}
* {font-family:'Pretendard', Arial, sans-serif; font-size:16px; font-weight:400; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; word-break: keep-all}
ol,ul,li {list-style:none;}
blockquote, q {quotes:none;}
blockquote:before,blockquote:after,q:before,q:after {content:'';content:none;}
table caption {overflow:hidden; font-size:0; line-height:0; font-size:15px;}
dt{display:block;}
hr{display:none;}
a, button{cursor:pointer;text-decoration:none;color:#444;}
a:focus, button:focus, i:focus, input:focus	{outline: 5px solid #164194;}
a:hover, a:active, a:visited, a:link{text-decoration:none;}
address{font-style:normal;}
input,select,img{vertical-align:middle;}
.input_search {border:0; background-color:#fff; padding-left:5px; color:#888;}
.hide {display:none;}
.ls0 { letter-spacing:0 !important; }
img{max-width:100%; height: auto;}
h1, h2, h3, h4, h5 {font-weight: 400;}
/*input:focus, select:focus, option:focus, textarea:focus{outline: none;}
textarea:focus,
img:focus, input[type="text"]:focus,
input[type="password"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="time"]:focus,
input[type="week"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="color"]:focus,
.uneditable-input:focus,
select:focus {border-color: none; box-shadow: none;  outline: 0 none;}*/

.blind {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0); /* 占쎈쨨占쎈뿭援� 占쎈눀占쎌뒧占쎈뎄�뜝�럩�뮡�뜝�룞�삕占쎈ご�뜝占� �뜝�럩留꾢뜝�럥�돵 �뜝�럡�뀬�뜝�럩�뮔 */
  clip-path: polygon(0 0, 0 0, 0 0); /* inset(50%) �뜝�룞�삕 �뜝�럥吏쀥뜝�럩逾у뜝�럥由� �뜝�럥�걫�뜝�럩寃� */
  border: 0;
}

#skip-nav {position: relative;  z-index: 3000;}
#skip-nav a {position: absolute; top: -30px; left: 0; width: 138px; border: 1px solid #4ec53d; background: #333;text-align: center; opacity: 0;}  
#skip-nav span {display: inline-block;  padding: 2px 6px 0 0;  font-size: 13px;  line-height: 26px;  color: #fff;  letter-spacing: -1px;  white-space: nowrap;}

/*--------------------------------------------------------------
# Header
--------------------------------------------------------------*/
#wrap {position: relative; width: 100%; overflow: hidden;}


.container {max-width:1200px; width:100%; position: relative; margin: 0 auto;}
.container.speak_box.password_check{max-width:800px; width:100%; position: relative; margin: 0 auto;}
.clearfix:before,
.clearfix:after {content: " "; /* 1 */ display: table; /* 2 */}
 .clearfix:after {clear: both;}


.top-bar {background: #282F42; height:45px;}
.top-bar .top-container  {max-width:1200px; width:100%; position: relative; margin:0 auto; display: flex; justify-content: space-between;}
.top-bar .top-button li, .top-bar .top-mypage li  {float: left;}
.top-bar .top-button li button, .top-bar .top-mypage li a {color:#fff; font-size: 16px; font-weight: 200;}
.top-bar .top-button li button, .top-bar .top-mypage li span {color:#fff; font-size: 16px; font-weight: 200;}

.top-bar .top-button li button {border:0; background: none; display: block; border-right:1px solid rgba(255,255,255,0.1); line-height: 45px; padding:0 15px; color:#fff;}
.top-bar .top-button li button:hover, .top-bar .top-mypage li a:hover {text-decoration: underline;}
.top-bar .top-button li button i {padding-right:8px; color:#EFF0F1; font-size:13px;}

.top-bar .top-button li.screen-control {border-left:1px solid #686D7A; border-right:1px solid #686D7A; color:#fff; padding:7px 10px;}
.top-bar .top-button li.screen-control button {border:1px solid #686D7A; margin:0 5px; width:30px; height:30px; border-radius: 5px; display: inline-block; line-height: 30px;}
.top-bar .top-button li.screen-control button i {margin-left:-5px;}
.top-bar .top-button li.screen-control button:hover {background-color: #fff;}
.top-bar .top-button li.screen-control button:hover i {color:#222;}
.top-bar .top-mypage {margin-right:10px;}
.top-bar .top-mypage li a {line-height: 45px; margin-left:20px;}
.top-bar .top-mypage li span {line-height: 45px; margin-left:20px;}

.navigation {height: 110px; border-bottom:1px solid #e5e5e5; z-index: 99999; }
.brand {  position: absolute; padding-left: 20px; float: left; line-height: 110px; }
.nav-container { max-width: 1200px; margin: 0 auto; }
nav {float: right;}
nav ul {list-style: none; margin: 0; padding: 0; }
nav ul li {float: left; position: relative;}


.search {width: 100%; position: relative; display: flex; box-shadow: 0 5px 10px rgba(0,64,151,0.1); }
.searchTerm { width: 100%; border: 3px solid #164194; border-right: none; padding: 0 20px; height: 54px; border-radius: 10px 0 0 10px; color: #666; font-size:1.13em; }
.searchTerm:focus{ color: #164194; }
.searchButton { width: 60px; height: 60px; border: 1px solid #164194; background: #164194; text-align: center; color: #fff; border-radius: 0 10px 10px 0;  cursor: pointer; }

.animenu {float:right;}
.animenu__btn {display: none; cursor: pointer; background-color: #111; border: 0; padding: 10px; height: 40px;
width: 40px; margin-top:0; margin-right:20px; float:right; border-radius: 5px;}
.animenu__btn:hover {background-color: #0186ba;}
.animenu__btn__bar { display: block; width: 20px; height: 2px; background-color: #fff; transition: 0.15s cubic-bezier(0.75, -0.55, 0.25, 1.55);}
.animenu__btn__bar + .animenu__btn__bar {margin-top: 4px;}
.animenu__btn--active .animenu__btn__bar {margin: 0;position: absolute;}
.animenu__btn--active .animenu__btn__bar:nth-child(1) {transform: rotate(45deg);}
.animenu__btn--active .animenu__btn__bar:nth-child(2) {opacity: 0;}
.animenu__btn--active .animenu__btn__bar:nth-child(3) {transform: rotate(-45deg);}
.animenu {display: block;}
.animenu li, .animenu a {display: inline-block; font-size: 15px;}
.animenu a {color: #252525; text-decoration: none;}
.animenu__nav > li {position: relative;}
.animenu__nav > li > a {padding: 39px 25px; text-transform: uppercase; font-size:1.25em;}
.animenu__nav > li:hover > ul {opacity: 1; visibility: visible; margin: 0;}
.animenu__nav > li:hover > a {color: #fff; border-bottom:3px solid #164194; background: #164194;}
.animenu__nav > li:focus-within > ul {opacity: 1; visibility: visible; margin: 0;}
.animenu__nav > li:focus-within > a {color: #222;}

.animenu__nav__dropdown {min-width: 100%; position: absolute; top: 100%; left: 0; z-index: 1;opacity: 0;
visibility: hidden; margin: 20px 0 0 0; background-color: #164194;border-color: #164194; transition: margin 0.15s, opacity 0.15s;}
.animenu__nav__dropdown > li {width: 100%; border-bottom: 1px solid rgba(255,255,255,0.1);}
.animenu__nav__dropdown > li:last-child { border: 0;}
.animenu__nav__dropdown a {padding: 10px; width: calc(100% - 20px); border-color: rgba(255,255,255,0.1); color:#fff;}
.animenu__nav__dropdown a:hover {background-color: #052942; border-color: #FFFFFF; color: #F4F4F8; border-width: 3px}
.animenu__nav__dropdown a:focus {background-color: #FFFFFF; border-color: #FFFFFF; color: #FFFFFF; border-width: 3px; outline: 5px solid #164194;}
.animenu__nav__dropdown a:focus-within {background-color: #052942; border-color: #164194; color: #F4F4F8;}

@media screen and (max-width: 767px) {

.navigation {height: 80px;}
.brand {position: absolute; padding-left: 20px; float: left; line-height:80px;}
.brand img {width:70%;}
.animenu {float:left; width:100%;  z-index:999; position:absolute; top:70px;}
.animenu__btn {display: inline-block;}

.animenu__nav, .animenu__nav__dropdown {display: none;}
.animenu__nav {margin: 50px 0; z-index: 99999;}
.animenu__nav > li {width: 100%; border-right: 0; border-bottom: 1px solid #ddd;}
.animenu__nav > li:last-child {border: 0;}
.animenu__nav > li > a {width: 100%; padding: 10px; border-color: #111;  position: relative;}
.animenu__nav > li > a:hover {color:#fff;}
.animenu__nav a:hover  {background-color: #164194;  border-color: #164194;  color: #fff;}
.animenu__nav__dropdown {position: static;  background-color: #f4f4f8;  margin: 0;  transition: none;  visibility: visible;  opacity: 1; }
.animenu__nav__dropdown > li:first-child > a:after {content: none;}
.animenu__nav__dropdown a {padding-left: 20px; width: 100%; color:#222 !important; border-bottom:1px solid #ddd}


/* Footer*/
#footer dl dd {display:grid; margin-bottom:3px;}
.site-link { }
}

@media screen and (min-width: 768px) {
/* Footer*/
#footer dl dd {display:flex; margin-bottom:3px;}
.site-link { position:absolute; float:right; right:0; top:0;}
}

.animenu__nav--active {display: block !important; z-index: 99999; background-color: #fff; z-index:9999;}
.animenu__nav--active .animenu__nav__dropdown {display: block;}

@media (max-width: 1200px) {
}

@media screen and (max-width:1200px) {
  .container {width:100%; /*padding:0 20px;*/}

}