@import url(//spoqa.github.io/spoqa-han-sans/css/SpoqaHanSansNeo.css);
@import url('https://fonts.googleapis.com/css2?family=Mulish:wght@200;300;400;500;600;700;800;900&display=swap');
/* =============================
 
/* Reset CSS

============================= */
html{font-size:62.5%;  overflow-x:hidden;}
/*
html { font-size:62.5%; }, ¶Ç´Â html { font-size:10px; }·Î Çϸé 
10px˼ 1rem,
12px˼ 1.2rem,
14px˼ 1.4rem 
ÀÌ µÇ±â ¶§¹®¿¡ µû·Î °è»êÇÒ ÇÊ¿ä°¡ ¾ø¾î pxÀ» »ç¿ë ÇÒ¶§ ó·³ »ç¿ë ÇÒ ¼ö ÀÖ´Ù
*/
/*
.header_wrap {position: fixed; top:0; left:0; width:100%; z-index:99999; background:#fff;}*/
@font-face {
    font-family: 'Binggrae-Two';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_one@1.0/Binggrae-Bold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
* {
    margin:0; 
    padding:0;
    box-sizing:border-box; 
	-moz-box-sizing:border-box; 
	-webkit-box-sizing:border-box;
    /* outline:none; */
    /* border:none; */
    text-decoration:none;
    /* text-transform:capitalize; */
    /* transition:all .2s linear; */
    letter-spacing:-0.05rem;
}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,textarea,p,blockquote,th,td,input,select,textarea,button {margin:0;padding:0}
fieldset,img {border:0 none;vertical-align:top;}
dl,ul,ol,li {list-style:none}
blockquote, q {quotes: none}
blockquote:before, blockquote:after, q:before, q:after {content:'';content:none}
input,select,textarea,button {vertical-align:middle}
button {border:0 none; background-color:transparent; cursor:pointer}
body,th,td,input,select,textarea,button {font-family:'Spoqa Han Sans Neo','Malgun Gothic','¸¼Àº °íµñ',AppleGothic,Dotum,"µ¸¿ò",sans-serif;}
a {color:#333;text-decoration:none}
a:active, a:hover {text-decoration:none;}
address,caption,cite,code,dfn,em,var {font-style:normal;font-weight:normal}
table {border-collapse:collapse;border-spacing:0;}
body {background:#fff;}

html.fp-enabled, 
.fp-enabled body {margin:0 auto}
html{min-width: 320px; max-width:640px;  /*width: 100%;  max-width: 1920px;*/  margin: 0 auto;}
body{min-width: 320px; max-width:640px;   /*width: 100%; max-width: 1920px;*/  margin: 0 auto; background: white;}

select, input{
	border:1px solid #bbb;
	padding-left:0.5rem;
	font-size:1.4rem;
	ime-mode:active;
}
/*È­»ìÇ¥ ¾ø¾Ú*/
select::-ms-expand{display:none;}
select{
    box-shadow: none;
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    background-image: url("../img/select_arrow.png");
    background-position: center right;
    background-repeat: no-repeat;
    background-size: 20px 20px;
}
select:focus {outline: none;}

.Mulish {font-family:'Mulish', 'Spoqa Han Sans Neo','Malgun Gothic','¸¼Àº °íµñ',AppleGothic,Dotum,"µ¸¿ò",sans-serif;}

/*º»¹®À¸·Î ¹Ù·Î°¡±â*/
#goBodyContents{position:absolute;top:0;left:0;width:100%;height:0;text-align:center;overflow:hidden;color:#fff;font-size:0;line-height:0}

a {
	/*
    outline-style:none;
    -khtml-transition:all 0.3s; 
    -moz-transition:all 0.3s; 
    -ms-transition:all 0.3s; 
    -o-transition:all 0.3s; 
    -webkit-transition:all 0.3s; 
    transition:all 0.3s;
    */
}

 .fl {float: left;}
 .fr {float:right;}
 .both:after {content:''; display:block; clear: both;}
 .txtL {text-align: left;}
 .txtR {text-align: right;}
 .txtC {text-align: center;}
 .dn {display: none;}

nav ul {font-size:0;}
nav li {display:inline-block; vertical-align: top;}

/* =============================
 
 header CSS

============================= */
header {position: relative; z-index:9999; min-width: 320px; max-width:640px; width:100%; margin:0 auto;}
.header_wrap {z-index:9999;  background:#fff; width:100%; -khtml-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out;  -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;}

.header_top {position: relative; z-index:201; padding:0 8.33333333333%; border-bottom:1px solid #d5d5d5; text-align:center;}
.header_wrap.fix {
    background:none; position: fixed;  top: 0;  left: 50%; min-width: 320px; max-width:640px; 
    width: 100%; 
    z-index: 99; border:none;  -webkit-transform: translate(-50%,0); -ms-transform: translate(-50%,0); transform: translate(-50%,0);
}
.header_wrap.fix .header_top {border-bottom:none;}

.header_wrap.on {height:100%;}

.top_logo {position: absolute; top:50%; left:8.33333333333%; -webkit-transform: translate(0,-50%); -ms-transform: translate(0,-50%); transform: translate(0,-50%);}
.top_logo .logoB {display:block;}
.top_logo .logoW {display:none;}
.all_meun_btn {position: absolute; top:50%; right:8.33333333333%; -webkit-transform: translate(0,-50%); -ms-transform: translate(0,-50%); transform: translate(0,-50%);}
.all_meun_btn a {position: relative; display:block; width:46px; height:46px; padding:14px 0; font-size:0;}
.all_meun_btn a span {display:block; width:70%; height:2px; background:#000; margin-top:8px; float:right;}
.all_meun_btn a:before {content:''; display:block; width:100%; height:2px; background:#000; position: absolute; top:14px; right:0;} 
.all_meun_btn a:after {content:''; display:block; width:85%; height:2px; background:#000; position: absolute; bottom:14px; right:0;} 

.all_meun_btn span,
.all_meun_btn.on span,
.all_meun_btn a:before,
.all_meun_btn a:after  {-khtml-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out;  -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;}
.all_meun_btn.on a span {width:0;}
.all_meun_btn.on a:before,
.all_meun_btn.on a:after {width:100%; top:50%; right:-10px; bottom:auto;  -khtml-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out;  -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;}
.all_meun_btn.on a:before {transform: rotate(45deg);} 
.all_meun_btn.on a:after {transform: rotate(-45deg);}

.top_meun {text-align:center; display:inline-block; vertical-align: top;}
.top_meun li {margin:0 3.5rem}
.top_meun li a {position: relative; display:block; padding:40px 7px; font-size:20px; font-weight:600;}
.top_meun li a:after {content:''; display:block; width:0; height:2px; background:#f18d00; position: absolute; bottom:-1px; left:50%; -webkit-transform: translate(-50%,0); -ms-transform: translate(-50%,0); transform: translate(-50%,0);}
.top_meun li.on a:after,
.top_meun li a:hover:after {width:100%; -khtml-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out;  -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;}

.sub_meun {
    background:#fff; text-align:center; padding:0 16rem; display:none; border-bottom:solid 1px #ccc;
}
.sub_meun ul {font-size:0;}
.sub_meun ul, 
.sub_meun li {display:inline-block; vertical-align: top;}
.sub_meun li a {position: relative; display:block; padding:20px 15px; font-size:16px; color:#7a7a7a;}
.sub_meun li a:after {content:''; display:block; width:1px; height:14px; background:#d5d5d5; position: absolute; top:50%; left:0; -webkit-transform: translate(0,-50%); -ms-transform: translate(0,-50%); transform: translate(0,-50%);} 
.sub_meun li:first-child a:after {display:none;} 

.header_all_meun {position: absolute; top:100%; left:0; width:100%; background:RGBA(255,255,255,0.95); text-align:left; padding:100px 8.33333333333%; letter-spacing:-1px; display:none; z-index:200}
.header_all_meun * {-khtml-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out;  -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;}
.header_all_meun > ul {display:table; width:100%;}
.header_all_meun > ul > li {display:table-cell; vertical-align: top; text-align:left; padding:0 60px; width:290px;;}
.header_all_meun > ul > li:nth-child(2) {width:calc(100% - 800px);}
.header_all_meun > ul > li:last-child {width:220px; padding-right:0;}
.header_all_meun h3 {position: relative; font-size:30px; font-weight:600; line-height:1;}
.header_all_meun h3:after {content:''; display:block; width:40px; height:3px; background:#000000; position: absolute; top:50%; left:-60px; -webkit-transform: translate(0,-50%); -ms-transform: translate(0,-50%); transform: translate(0,-50%);}  
.header_all_meun h3 a {}
.header_all_meun .all_link {padding-top:30px; font-size:0;}
.header_all_meun .all_link a {display:block; font-size:18px; color:#000; line-height:1.1; padding:10px 0; font-weight:400;}
.header_all_meun .all_link a span {border-bottom:1px solid RGBA(255,255,255,0);}
.header_all_meun .all_link a:hover span {border-bottom:1px solid #e48d12; color:#e48d12;}
.header_all_meun .all_link h4 {font-size:18px; line-height:1;}
.header_all_meun .all_link h4 a {color:#e38604; font-weight:600;}
.header_all_meun .all_link .fl {width:55%;} 
.header_all_meun .all_link .fr {width:45%;}
.header_all_meun .all_sub_link {display:table; vertical-align: top; width:100%; margin-bottom:20px;}
.header_all_meun .all_sub_link dt,
.header_all_meun .all_sub_link dt {display:table-cell; vertical-align: top; line-height:20px;}
.header_all_meun .all_sub_link dt {width:100px;}
.header_all_meun .all_sub_link dd a {position: relative; font-size:16px; padding-left:15px;}
.header_all_meun .all_sub_link dd a:after {content:''; display:block; width:6px; height:6px; background:#000000; position: absolute; top:50%; left:0; -webkit-transform: translate(0,-50%); -ms-transform: translate(0,-50%); transform: translate(0,-50%); border-radius: 100%;}   

 
/* =============================
 
/* footer CSS

============================= */
.btn_top.go_top {z-index:100; position: fixed; bottom: 50px; right: 1%;}
.btn_top.go_top a {position: relative; display:inline-block; vertical-align: top; transform: rotate( 90deg ); padding-left:18px; font-size:12px; line-height:15px; color:#000000; font-weight:800; font-family:'Mulish', 'Spoqa Han Sans Neo',sans-serif;}
.btn_top.go_top a:after {content:''; position: absolute; top:-1.5px; left:0; display:block; width:15px; height:18px; background:url(../img/ico_top.png) left center no-repeat; transform: rotate( -90deg );}

.footer_wrap {width:100%; background:#f2f2f2; padding:0 8.33333333333%;}
.footer_top {border-top:1px solid #d9d9d9; border-bottom:1px solid #d9d9d9;}
.footer_top li,
.footer_top dl,
.footer_top dt,
.footer_top dd {display:inline-block; vertical-align: top;}
.footer_top li {padding:32px 0; margin-right:30px;}
.footer_top li a span {border-bottom:1px solid #f2f2f2; color:#6e6e6e; font-size:16px; line-height:1.2; font-weight:500;}
.footer_top li a:hover span {border-bottom:1px solid #2d2d2d; color:#000000}
.footer_top dl {padding:32px 0; margin-left:30px;font-size:0; }
.footer_top dl dt {color:#6e6e6e; margin-right:8px; font-size:16px; line-height:1.2; font-weight:500;}
.footer_top dl dd {color:#000; font-size:16px; line-height:1.2; font-weight:600; }

.footer_bottom {position: relative; padding:40px 0;}
.footer_bottom p {font-size:14px; color:#000000; padding:12px 0 0 0; font-weight:600;}
.footer_bottom dl {font-weight:400; font-size:0; margin-bottom:12px;}
.footer_bottom dt,
.footer_bottom dd {display:inline-block; vertical-align: top;}
.footer_bottom dl dt {color:#6e6e6e; width:110px; font-size:16px; line-height:1.2;}
.footer_bottom dl dd {color:#000; font-size:16px; line-height:1.2;}
.footer_bottom .global_select {position: absolute; top:50%; right:0; -webkit-transform: translate(0,-50%); -ms-transform: translate(0,-50%); transform: translate(0,-50%);} 
.footer_bottom .global_select select {background-color: transparent; background-image:url(../img/ico_arrow01.png); background-size:10px 7px; background-position:96% center; border-color:#bababa; line-height:50px; height:50px; width:230px; padding-left:20px; color:#474747;}
.footer_bottom .global_select select option  {min-height: 30px; line-height:30px;}