@charset "utf-8";
/* kor */
html.desktop{margin-top: 0!important;}
body {margin:0 auto; width:100%; max-width: 1920px; overflow-x: hidden; font-family: 'NotoSansKR', sans-serif; word-break: keep-all; /* letter-spacing: -0.062em;*/ color: #000000;  font-size: 18px;  font-weight: 400; line-height: 1.75; background: #ffffff; }
/* [lang="en"] {font-family: 'Roboto', 'NotoSansKR', sans-serif;}
[lang="en"],
.font_en,
.font_num{ font-family: 'Roboto', sans-serif; letter-spacing: 0;} */
button{border:none; background:none; outline:none; cursor: pointer;}
a{color:#3a4146;}
/* .score{font-family: 'ScoreD', sans-serif; font-weight: 400;}
.gmarket{font-family: 'gmarket', 'NotoSansKR', sans-serif; font-weight: 400;} */
.spoqa{font-family: 'Spoqa', 'NotoSansKR', sans-serif; font-weight: 400;}
.titilliium{font-family: 'TitilliumWeb', sans-serif;}

/* h1,h2,h3,h4,h5,h6{color:#000000;} */

.clearfix::after {content: ""; clear: both; display: table;}
.sr{position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px);}

#skip>a{width: 1px; height: 1px; position: absolute; left: -10000px; top: auto; overflow: hidden; display:block;}
#skip>a:hover,
#skip>a:focus, 
#skip>a:active{position:fixed; top:0; left:0; padding:20px; display:block; width:100%; height:auto; font-size: 16px; text-align: center; color:#ffffff; background:#555555; z-index: 9999;}

.jump_space{ display: inline-block; width: 12px;}
.jump_space2-4{ display: inline-block; width: 1.875em;}
.jump_space3-4{ display: inline-block; width: 0.4375em;}

.text_line_ellipsis{overflow:hidden; text-overflow: ellipsis; white-space:nowrap;  } /*1줄*/
.text_dline_ellipsis{ overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; /* 라인수 */ -webkit-box-orient: vertical;   word-wrap:break-word; line-height: 1.75em; height: 3.5em; /* line-height 가 1.2em 이고 3라인을 자르기 때문에 height는 1.2em * 3 = 3.6em */ }
.text_tline_ellipsis{ overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; /* 라인수 */ -webkit-box-orient: vertical;   word-wrap:break-word; line-height: 1.75em; height: 5.25em; /* line-height 가 1.2em 이고 3라인을 자르기 때문에 height는 1.2em * 3 = 3.6em */ }
.text_ellipsis { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; /* 라인수 */ -webkit-box-orient: vertical;   word-wrap:break-word; line-height: 1.5em; height: 3em; /* line-height 가 1.2em 이고 3라인을 자르기 때문에 height는 1.2em * 3 = 3.6em */ }/*2줄*/


 body.active_burger {position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; overflow: hidden; } 
.wrap{width:1200px; margin:0 auto; box-sizing: border-box;}

header{position: fixed; top:0; left:50%; transform:translateX(-50%); width:100%; max-width:1920px; background: transparent; box-sizing: border-box; z-index:999; transition: top, background-color, 0.5s;  }
header .header_wrap{position:relative; padding:32px 48px 20px; display:flex; justify-content: space-between; align-items: center; transition: padding .5s; }
header .header_wrap h1{flex-shrink: 0; width:254px; height:28px; z-index: 2; overflow: hidden;}
header .header_wrap h1 a{display: flex; align-items: center; height:100%;}
header .header_wrap h1 #logo{width: 100%; height: auto; fill:#ffffff;}


header .header_wrap .menu_container{position:absolute; top:50%; left:50%; z-index: 1; transform: translate(-50%,-50%);  display:flex; justify-content: center; align-items: center; width:100%;}
header .header_wrap .menu_container .gnb{display:flex; justify-content: center; align-items: center;}
header .header_wrap .menu_container .gnb .dep_1{position:relative; }
header .header_wrap .menu_container .gnb .dep_1>a{position:relative; padding:28px 45px 20px; display: flex; align-items: center; font-weight: 500; color:#ffffff; text-transform: uppercase; }
/* header .header_wrap .menu_container .gnb .dep_1>a span::before{content:""; position: absolute; bottom:-1px; left:50%; transform: translateX(-50%); display: block; width:0%; height:1px; background: #000000; z-index: 1; transition: width .3s;}
header .header_wrap .menu_container .gnb .dep_1>a span::after{content:""; position: absolute; top:10px; left:50%; transform: translateX(-50%); display: block; width:24px; height:8px; border-radius: 10px 0 10px 0; background: #004498; z-index: 1; opacity: 0; visibility: hidden; transition: opacity,visibility, transform, .3s;}
header .header_wrap .menu_container .gnb .dep_1>a.active span::before{width:100%; }
header .header_wrap .menu_container .gnb .dep_1>a.active span::after{ opacity: 1; visibility: visible; transform: translateX(-50%) translateY(10px); } */

header .header_wrap .menu_container .gnb .dep_1 .dep_2{position:absolute; top:100%; left:0; width:100%; height:0; opacity: 0; visibility: hidden; transition:opacity, visibility, height, 0.3s; overflow: hidden;}
header .header_wrap .menu_container .gnb .dep_1 .dep_2.active{height:250px; opacity: 1; visibility: visible;}
header .header_wrap .menu_container .gnb .dep_1 .dep_2.dep2_active{background: #f7f7f7;}
header .header_wrap .menu_container .gnb .dep_1 .dep_2>ul{position: relative; padding:12px 0px; height:100%;}
header .header_wrap .menu_container .gnb .dep_1 .dep_2 ul li a{position:relative; padding:8px 16px; font-size:0.9em; line-height: 1.5; color:#777777; text-transform: uppercase; }
header .header_wrap .menu_container .gnb .dep_1 .dep_2 ul li a.menu_en{font-size:0.72em;}
header .header_wrap .menu_container .gnb .dep_1 .dep_2 ul li a:before{content: ""; position: absolute; top:50%; left:0; transform: translateY(-50%); display: block; width:6px; height:4px; border-radius: 4px 0 4px 0; background: #004498; opacity: 0; transition: top, opacity, 0.3s;}
header .header_wrap .menu_container .gnb .dep_1 .dep_2>ul>li:hover>a::before,
header .header_wrap .menu_container .gnb .dep_1 .dep_2>ul>li>a:hover::before,
header .header_wrap .menu_container .gnb .dep_1 .dep_2>ul>li>a.active::before{opacity: 1; left:6px;}
header .header_wrap .menu_container .gnb .dep_1 .dep_2>ul>li:hover>a,
header .header_wrap .menu_container .gnb .dep_1 .dep_2>ul>li>a:hover,
header .header_wrap .menu_container .gnb .dep_1 .dep_2>ul>li>a.active{color:#000000;}

header .header_wrap .menu_container .gnb .dep_1 .dep_2 .dep_3{position:absolute; top:auto; left:0; width:100%; transform: translateX(20px); opacity: 0; visibility: hidden; transition:opacity, visibility, transform, 0.5s; }
header .header_wrap .menu_container .gnb .dep_1 .dep_2 .dep_3 ul{padding-top:16px; border-top: 1px solid #eeeeee; display: flex; flex-wrap: wrap;}
header .header_wrap .menu_container .gnb .dep_1 .dep_2 .dep_3.active{opacity: 1; visibility: visible; transform: translateX(0); }
header .header_wrap .menu_container .gnb .dep_1 .dep_2 .dep_3 ul li{width:50%;}
header .header_wrap .menu_container .gnb .dep_1 .dep_2 .dep_3 ul li a{ padding: 4px 28px; font-size:0.9em;  }
header .header_wrap .menu_container .gnb .dep_1 .dep_2 .dep_3 ul li a:hover,
header .header_wrap .menu_container .gnb .dep_1 .dep_2 .dep_3 ul li a.active{color:#005bac;}


header .header_wrap .hamburger_btn_wrap{position: relative; z-index: 1; margin:0 -12px; display: flex; align-items:center;}
header .header_wrap .hamburger_btn_wrap>div{padding:0 12px;}
header .header_wrap .hamburger_btn_wrap .hamburger{display: none;}
header .header_wrap .hamburger_btn_wrap .hamburger_btn{padding:9px 6px;}
header .header_wrap .hamburger_btn_wrap .hamburger_btn span{margin:6px 0; display: block; width:28px; height:3px; background: #ffffff; transition: width .3s; }
header .header_wrap .hamburger_btn_wrap .hamburger_btn:hover span{background: #0077df;}
header .header_wrap .hamburger_btn_wrap .hamburger_btn:hover span:nth-child(2){width:22px;}
header .header_wrap .hamburger_btn_wrap .hamburger_btn:hover span:nth-child(3){width:16px;}
header .navBg {display:block;  z-index:998; width:100%; height:0;  background:#ffffff; overflow: hidden;
	-webkit-transition:height 0.3s ease;
	-moz-transition:height 0.3s ease;
	-o-transition:height 0.3s ease;
	transition:height 0.3s ease; 
	box-shadow: 0 1px 0 rgb(235 235 235);
}
header .navBg.on{height:250px; }
header .navBg .nav_inner{position: relative; width:540px; height:100%;}

header .header_wrap .hamburger_btn_wrap .lang{position:relative; font-size:16px;}
header .header_wrap .hamburger_btn_wrap .lang a{color:#ffffff; } 

header .header_wrap .hamburger_btn_wrap .lang ul{display: none; position: absolute; left:50%; transform:translateX(-50%); padding:10px 0;   background:#222222; z-index: 2; }
header .header_wrap .hamburger_btn_wrap .lang ul.on{display: block;}
header .header_wrap .hamburger_btn_wrap .lang ul li a{padding:4px 20px; font-size:16px;}
header .header_wrap .hamburger_btn_wrap .lang a:hover{color:#004498;}

/* header .navBg .nav_inner::before{content:"WE ARE THE BEST HOYOUNG"; position: absolute; left:80px; bottom:40px; display: block; font-size:48px; font-weight: bold; line-height: 1.25; text-transform: uppercase; color: #f0f0f5;} */

/* header .navBg.on_add{height:200px; } */


header.on{background: #ffffff;}
header.on .header_wrap h1 #logo {fill:#004498;}
header.on .header_wrap{/*padding-left:20px; padding-right:20px;*/  box-shadow: 0 1px 0 rgb(235, 235, 235);}
header.on .header_wrap .menu_container .gnb .dep_1>a{color:#222222;  }
header.on .header_wrap .hamburger_btn_wrap .hamburger_btn span{ background: #222222;}
header.on .header_wrap .hamburger_btn_wrap .hamburger_btn:hover span{background: #0077df;}
header.on .header_wrap .menu_container .gnb .dep_1>a.active span::after{transform: translateX(-50%) translateY(4px); }
header.on .header_wrap .hamburger_btn_wrap .lang>a{color:#222222;} 

header.on_menu{background: #ffffff;}
header.on_menu .header_wrap h1 #logo {fill:#004498;}
header.on_menu .header_wrap{box-shadow: 0 1px 0 rgb(235, 235, 235);}
header.on_menu .header_wrap .menu_container .gnb .dep_1>a{color:#222222;}
header.on_menu .header_wrap .menu_container .gnb>.dep_1:hover>a,
header.on_menu .header_wrap .menu_container .gnb>.dep_1>a:hover,
header .header_wrap .menu_container .gnb>.dep_1>a.active{color:#004498;}
header.on_menu .header_wrap .hamburger_btn_wrap .hamburger_btn span{ background: #222222;}
header.on_menu .header_wrap .hamburger_btn_wrap .lang>a{color:#222222;} 

header .m_menu_container{position:fixed; top:0; left:0; display:none; width:100%; height:100vh; z-index: 999; background-color: #ffffff; overflow-x:hidden; overflow-y:scroll;   }
/* header .m_menu_container::before{content: ""; position: absolute; bottom:0; left:50%; transform:translate(-50%); display: block; width:50%; height:248px; background: url("../images/common/m_nav_bg.svg")no-repeat center / 100%; z-index: -1; opacity: 0.08;} */
header .m_menu_container .m_menu_inner{margin-top:10%; display: flex; justify-content: center; width:100%;}
header .m_menu_container .m_menu_inner .mgnb{display:flex; text-align: center;}
header .m_menu_container .m_menu_inner .mgnb>li{padding-left:60px; padding-right:60px;}
header .m_menu_container .m_menu_inner .mgnb>li>a{position:relative; padding-top:8px; padding-bottom:8px; font-size:28px; }
/* header .m_menu_container .m_menu_inner .mgnb>li>a span::before{content:""; position: absolute; top:-10px; left:50%; transform: translateX(-50%); display: block; width:24px; height:8px; border-radius: 10px 0 10px 0; background: #2f318b; z-index: 1; opacity: 0; visibility: hidden; transition: opacity,visibility, transform, .3s;} */
/* header .m_menu_container .m_menu_inner .mgnb>li:hover>a>span::before{ opacity: 1; visibility: visible; transform: translateX(-50%) translateY(10px); } */
header .m_menu_container .m_menu_inner .mgnb>li:hover>a,
header .m_menu_container .m_menu_inner .mgnb>li>a:hover,
header .m_menu_container .m_menu_inner .mgnb>li>a.active{color:#2f318b;}
header .m_menu_container .m_menu_inner .mgnb .dep_2{display: block; height:auto; padding-bottom:100px;}
header .m_menu_container .m_menu_inner .mgnb>li>.dep_2>ul>li>a{position:relative; padding-top:6px; padding-bottom:8px; font-size:20px; color:#666666;}
header .m_menu_container .m_menu_inner .mgnb>li>.dep_2>ul>li>a::before{content:""; position:absolute; bottom:0; left:50%; transform: translateX(-50%); display:block; width:0; height:2px; background: #0077df; transition:width 0.3s;}
header .m_menu_container .m_menu_inner .mgnb>li>.dep_2>ul>li:hover>a::before,
header .m_menu_container .m_menu_inner .mgnb>li>.dep_2>ul>li>a:hover::before,
header .m_menu_container .m_menu_inner .mgnb>li>.dep_2>ul>li>a.active::before{width:100%;}
header .m_menu_container .m_menu_inner .mgnb>li>.dep_2>ul>li:hover>a,
header .m_menu_container .m_menu_inner .mgnb>li>.dep_2>ul>li>a:hover,
header .m_menu_container .m_menu_inner .mgnb>li>.dep_2>ul>li>a.active{color:#000000;}

header .m_menu_container .close_btn{position:absolute; top:29px; right:60px; width:48px; height:48px; transition:transform .3s;}
header .m_menu_container .close_btn .close_line{position:absolute; top:50%; left:50%; width:50%; height:3px; background:#666666; transition:background-color .3s;}
header .m_menu_container .close_btn .close_line.line_1{transform: translate(-50%, -50%) rotate(45deg);}
header .m_menu_container .close_btn .close_line.line_2{transform: translate(-50%, -50%) rotate(-45deg);}
header .m_menu_container .close_btn:hover{transform: rotate(90deg);}
header .m_menu_container .close_btn:hover .close_line{background:#0077df;}
/* header .m_menu_container .m_menu_ham_wrap{margin:39px 76px; display: flex; align-items: center;}
header .m_menu_container .m_menu_ham_wrap .sns ul{display: flex; align-items:center;}
header .m_menu_container .m_menu_ham_wrap .sns ul li{padding:0 8px;}
header .m_menu_container .m_menu_ham_wrap .sns ul li a svg path{fill:#ffffff;}
header .m_menu_container .m_menu_ham_wrap .sns ul li a svg path{fill:#222222;}
header .m_menu_container .m_menu_ham_wrap .sns ul li a:hover svg path{fill:#C70026;}
*/
header .m_menu_container .m_menu_ham_wrap .lang{position:relative; margin-left:20px; font-size:16px;}
header .m_menu_container .m_menu_ham_wrap .lang>a{color:#222222; display: flex; align-items: center;} 
header .m_menu_container .m_menu_ham_wrap .lang>a .lang_arrow { margin-left: 10px; display: block; width: 4px; height: 6px; border-top: 6px solid #222222;
border-left: 4px solid transparent; border-right: 4px solid transparent; transition: border-color .5s; z-index: -1;}
header .m_menu_container .m_menu_ham_wrap .lang ul{display: none; position: absolute; left:50%; transform:translateX(-50%); padding:10px 0;   background:#222222; z-index: 2; }
header .m_menu_container .m_menu_ham_wrap .lang ul.on{display: block;}
header .m_menu_container .m_menu_ham_wrap .lang ul li a{padding:4px 20px; font-size:16px; color:#ffffff;}
header .m_menu_container .m_menu_ham_wrap .lang a:hover{color:#0077df;}
header.on .m_menu_container .close_btn{top:19px; right:76px;}


main{max-width: 1920px; overflow-x: hidden;}


#footer{max-width: 1920px; overflow-x: hidden; }
#footer .footer_wrap{padding:60px 0 100px; background: #111111; font-size:16px; }

#footer .footer_wrap .link_wrap{display:flex; align-items: center; flex-wrap: wrap; margin:0 -20px; padding:18px 0; }
#footer .footer_wrap .link_wrap li a{position: relative; padding:0 20px; font-weight: 500; color:#ffffff;}
#footer .footer_wrap .link_wrap li a:after{content:""; position:absolute; top:50%; right:-1px; transform:translateY(-50%); display:block; width:2px; height: 12px; background:#404040; }
#footer .footer_wrap .link_wrap li a:hover{color:#004998;}
#footer .footer_wrap .link_wrap li:last-child a:after{display:none;}
#footer .footer_wrap .footer_info address .factory_info{margin:0 -16px; display: flex; flex-wrap: wrap;  font-size:14px; color:#ffffff;}
#footer .footer_wrap .footer_info address .factory_info p{position:relative; padding:4px 16px; }
#footer .footer_wrap .footer_info address .factory_info p:not(:last-child) ::before{content: ""; position: absolute; top:50%; right:0; transform: translateY(-50%); display: block; width:1px; height:14px; background: rgba(255,255,255,.5);}

#footer .footer_wrap .footer_bottom{margin-top:40px; padding-top:40px; border-top:1px solid rgba(255, 255, 255, 0.1)  }
#footer .footer_wrap .footer_bottom .inner_wrap{display: flex; justify-content: space-between; flex-wrap: wrap; }
#footer .footer_wrap .footer_bottom .inner_wrap .copyright{color:#ffffff; font-size:14px; padding:0 40px 40px 0;}
#footer .footer_wrap .footer_bottom .inner_wrap .img_wrap{width:256px;}
#footer .footer_wrap .footer_info .copyright{margin-top:24px; color:#aaaaaa;}


/*scroll_top_btn*/
.scroll_top_btn{position: fixed; bottom: 40px; right:10px; z-index: 999; opacity: 0; visibility: hidden; transition: opcity, visibility, .3s; }
.scroll_top_btn.on{opacity: 1; visibility: visible;}
.scroll_top_btn button{position:relative; display: block; width:64px; height:64px; background: #ffffff; border:1px solid #dddddd; transition: background-color, .3s;}
.scroll_top_btn button::before{content:""; position:absolute; top:50%; left:50%; transform: translate(-50%, -20%) rotate(45deg); display: block; width:20%; height:20%; border-top:2px solid #222222; border-left:2px solid #222222; transition: background-color, .3s;}
.scroll_top_btn button:hover{background: #005bac;}
.scroll_top_btn button:hover::before{border-color:#ffffff;}
.scroll_top_btn button span{text-align: center; text-transform: uppercase; color:#ffffff; }

/*bread crumb*/
/* .breadcrumb .mo_breadcrumb_btn{padding:20px 5% 10px; width:100%; display: none; justify-content: space-between; align-items: center; border-bottom:1px solid #f1f1f1;}
.breadcrumb .mo_breadcrumb_btn .breadcrumb_arrow{ margin-left: 10px; display: block; width: 4px; height: 6px; border-top: 6px solid #222222; border-left: 4px solid transparent; border-right: 4px solid transparent; transition: border-color .5s; z-index: -1;}
.breadcrumb .dept_1{margin:20px -20px 0;  display: flex; align-items: center; flex-wrap: wrap;}
.breadcrumb .dept_1 li a{position:relative; padding:20px; transition:color, font-weight, .3s;}
.breadcrumb .dept_1 li a span{position:relative;}
.breadcrumb .dept_1 li a span::before{content:""; position: absolute; bottom:-4px; left:50%; transform: translateX(-50%); display: none; width:100%; height:2px; background: #005bac; }
.breadcrumb .dept_1 li a:hover span,
.breadcrumb .dept_1 li a.active span{color:#005bac;}
.breadcrumb .dept_1 li a.active span::before{display: block;}
.breadcrumb .dept_1 li a.active{font-weight: bold; } */



.breadcrumb{border-bottom:1px solid #e6e6e6;}
.breadcrumb .inner_wrap{display: flex;}
.breadcrumb .inner_wrap>div{position: relative;}
/* .breadcrumb .inner_wrap>div::before{content: ""; position:absolute; top:50%; right:-1px; transform: translateY(-50%); display: block; width:2px; height:16px; background: #222222; }
.breadcrumb .inner_wrap>div:last-child::before{display: none;} */
.breadcrumb .inner_wrap>div>a{display: flex; justify-content: space-between; align-items: center; height:100%; padding:18px 24px; border-left:1px solid #e6e6e6;}
.breadcrumb .inner_wrap>div:last-child>a{border-right:1px solid #e6e6e6;}
.breadcrumb .inner_wrap>div>a>i{width:12px; height:15px;}
.breadcrumb .inner_wrap .dep{position: relative;}
.breadcrumb .inner_wrap .dep>a{ width:280px; font-size:18px; font-weight: 500; text-transform: uppercase; color:#222222; }
.breadcrumb .inner_wrap .dep>a i{margin-left: 10px; display: block; width: 6px; height: 6px; border-left:2px solid #222222; border-bottom: 2px solid #222222; transform: rotate(-45deg); transition: transform .3s;}
.breadcrumb .inner_wrap .dep a.active{color:#2D47B5;}
.breadcrumb .inner_wrap .dep a.active i{transform: rotate(135deg); border-color: #2D47B5;}
.breadcrumb .inner_wrap .dep ul{position: absolute; top:100%; left:0; padding:0 24px; display:none; height:0; width:100%;  background:#222222; overflow: hidden; z-index: 99;}
.breadcrumb .inner_wrap .dep ul li a{padding:8px 0; font-size:16px; text-transform: uppercase; color:#ffffff; }
.breadcrumb .inner_wrap .dep ul li:first-child a{padding:16px 0 8px;}
.breadcrumb .inner_wrap .dep ul li:last-child a{padding:8px 0 16px;}
.breadcrumb .inner_wrap .dep ul li a:hover{color:#37b2ff;}



/*privacy */
.privacy .inner_wrap{flex-wrap: wrap;}
.privacy .inner_wrap article{width:100%;}
.privacy .privacy_innerwrap .container dl{margin-bottom:60px;}
.privacy .privacy_innerwrap .container dl dt h4{font-size:28px; font-weight:bold;}
.privacy .privacy_innerwrap .container dl dd{margin-top:10px;}
.privacy .privacy_innerwrap .container dl dd h5{font-size:18px; }
.privacy .privacy_innerwrap .container dl dd p{margin:0px 0 16px; color:#555555;}


/*no_content */
article.no_content{display:flex; justify-content: center;  align-items: center; width:100%; height:280px;}
article.no_content .content_box{text-align: center;}
article.no_content .content_box h3 {font-size: 32px; font-weight: bold;}
article.no_content .content_box p { color: #666666;}


@media(max-width:1700px){
  header .header_wrap h1 {width: 220px;}
  header .header_wrap .menu_container .gnb .dep_1>a {padding: 28px 40px 20px;}
}

@media(max-width:1600px){
	header .header_wrap h1 {width: 214px;}
  header .header_wrap .menu_container .gnb .dep_1>a {padding: 28px 32px 20px; font-size:16px;}
  header .header_wrap .menu_container .gnb .dep_1 .dep_2>ul {font-size: 16px;}

}

@media(max-width:1440px){
  header .header_wrap {padding: 32px 32px 20px;}
	header .header_wrap h1 {width: 180px;}
	/* header .header_wrap .menu_container .gnb .dep_1>a {padding: 30px 45px 22px; font-size:16px;} */

 
  header .header_wrap .menu_container .gnb .dep_1>a {padding: 28px 28px 20px; }

}


@media(max-width:1240px){
	.wrap {width: 100%; padding:0 5%; margin: 0 auto;}

	header .header_wrap h1 {width: 140px;}
	/* header .header_wrap .menu_container .gnb .dep_1>a {padding: 30px 32px 22px;} */
  
	header .header_wrap { padding: 8px 5% 8px;}
	header.on .header_wrap {padding: 8px 5% 8px;}
	header .header_wrap h1 {width: 160px;}
	header .header_wrap .hamburger_btn_wrap .hamburger{display: block;}
	header .header_wrap .menu_container{display: none;}
	header .m_menu_container::before{left:0; transform:translate(0); width:60%; height:200px; opacity: 0.1;}
	header .m_menu_container .m_menu_inner {display: block; width:auto; height: 100%;}
	header .m_menu_container .m_menu_inner {padding:80px 0; justify-content: flex-start;}
	header .m_menu_container .m_menu_inner .mgnb {position:relative; display:block;}
	header .m_menu_container .m_menu_inner .mgnb a {text-align: left; }	
	header .m_menu_container .m_menu_inner .mgnb>li>a::before {top: 12px; left: 32px;  width:12px; height:6px; transition: left, opacity, 0.3s;}
	header .m_menu_container .m_menu_inner .mgnb>li:hover>a::before,
	header .m_menu_container .m_menu_inner .mgnb>li>a:hover::before{opacity: 1; top: 2px; }
	header .m_menu_container .m_menu_inner .mgnb>li>a span::before{content:""; position: absolute; top:26px; left:-10px; transform: translateX(0); width:16px;}
	header .m_menu_container .m_menu_inner .mgnb>li:hover>a span::before{transform: translateX(8px);}
	header .m_menu_container .m_menu_inner .mgnb>li>a{display: flex; align-items: center; font-size:32px; }
	header .m_menu_container .m_menu_inner .mgnb>li>a i{position:static; top:inherit; left:inherit; transform:translateX(0); margin-left:8px; display: block;}
	header .m_menu_container .m_menu_inner .mgnb .dep_2{padding-bottom: 0; padding-left:20px; width:100%; display: none; height:0; background:#f5f5f5; overflow: hidden;  }
	header .m_menu_container .m_menu_inner .mgnb>li>.dep_2>ul{margin:12px 0 20px;}
	header .m_menu_container .m_menu_inner .mgnb>li>.dep_2>ul>li>a {font-size: 18px;}
	header .m_menu_container .m_menu_inner .mgnb>li>.dep_2>ul>li>a::before{left:0; transform: translateX(0);}
	header .m_menu_container .m_menu_inner .mgnb>li>.dep_2>ul>li:hover>a::before,
	header .m_menu_container .m_menu_inner .mgnb>li>.dep_2>ul>li>a:hover::before{width:4%;}

	header .m_menu_container .close_btn {top: 8px; right: 4%;}
	header.on .m_menu_container .close_btn {top: 8px; right: 3%;}
	header .m_menu_container .m_menu_ham_wrap {margin: 20px 5%;}
	
} 


@media(max-width:1024px){	
	body {font-size: 16px;}
/* 	
	header .header_wrap { padding: 8px 5% 8px;}
	header.on .header_wrap {padding: 8px 5% 8px;}
	header .header_wrap h1 {width: 160px;}
	header .header_wrap .hamburger_btn_wrap .hamburger{display: block;}
	header .header_wrap .menu_container{display: none;}
	header .m_menu_container::before{left:0; transform:translate(0); width:60%; height:200px; opacity: 0.1;}
	header .m_menu_container .m_menu_inner {display: block; width:auto; height: 100%;}
	header .m_menu_container .m_menu_inner {padding:80px 0; justify-content: flex-start;}
	header .m_menu_container .m_menu_inner .mgnb {position:relative; display:block;}
	header .m_menu_container .m_menu_inner .mgnb a {text-align: left; }	
	header .m_menu_container .m_menu_inner .mgnb>li>a::before {top: 12px; left: 32px;  width:12px; height:6px; transition: left, opacity, 0.3s;}
	header .m_menu_container .m_menu_inner .mgnb>li:hover>a::before,
	header .m_menu_container .m_menu_inner .mgnb>li>a:hover::before{opacity: 1; top: 2px; }
	header .m_menu_container .m_menu_inner .mgnb>li>a span::before{content:""; position: absolute; top:26px; left:-10px; transform: translateX(0); width:16px;}
	header .m_menu_container .m_menu_inner .mgnb>li:hover>a span::before{transform: translateX(8px);}
	header .m_menu_container .m_menu_inner .mgnb>li>a{display: flex; align-items: center; font-size:32px; }
	header .m_menu_container .m_menu_inner .mgnb>li>a i{position:static; top:inherit; left:inherit; transform:translateX(0); margin-left:8px; display: block;}
	header .m_menu_container .m_menu_inner .mgnb .dep_2{padding-bottom: 0; padding-left:20px; width:100%; display: none; height:0; background:#f5f5f5; overflow: hidden;  }
	header .m_menu_container .m_menu_inner .mgnb>li>.dep_2>ul{margin:12px 0 20px;}
	header .m_menu_container .m_menu_inner .mgnb>li>.dep_2>ul>li>a {font-size: 18px;}
	header .m_menu_container .m_menu_inner .mgnb>li>.dep_2>ul>li>a::before{left:0; transform: translateX(0);}
	header .m_menu_container .m_menu_inner .mgnb>li>.dep_2>ul>li:hover>a::before,
	header .m_menu_container .m_menu_inner .mgnb>li>.dep_2>ul>li>a:hover::before{width:4%;}

	header .m_menu_container .close_btn {top: 8px; right: 4%;}
	header.on .m_menu_container .close_btn {top: 8px; right: 3%;}
	header .m_menu_container .m_menu_ham_wrap {margin: 20px 5%;}
	 */
	/* #footer .footer_wrap {font-size: 15px;}
	#footer .footer_wrap .inner_wrap article{width: 100%;}
	#footer .footer_wrap .footer_info_wrap .footer_logo {width: auto; display: flex; justify-content: center;}
	
	#footer .footer_wrap .link_wrap {justify-content: center;}
	#footer .footer_wrap .footer_info{padding-top: 20px; border-top: 1px solid #202020;}
	#footer .footer_wrap .footer_info address {justify-content: center; text-align: center;}
	#footer .footer_wrap .footer_info address p:nth-child(3){margin-right:28px;}
	#footer .footer_wrap .footer_info address p:nth-child(3)::before {top:9px; right: -15px;}	
	#footer .footer_wrap .inner_wrap .footer_out_info {margin-top:40px;}
	#footer .footer_wrap .inner_wrap .footer_out_info .copyright { margin-top: 24px; text-align: center;} */


}

@media(max-width:768px){
	.scroll_top_btn{bottom: 0;}
	.scroll_top_btn button{ width:48px; height:48px;}

	/* .breadcrumb .mo_breadcrumb_btn{display: flex;}
	.breadcrumb .wrap {padding: 0!important;}
	.breadcrumb .inner_wrap{position: relative;}
	.breadcrumb .dept_1{position: absolute; top:58px; left:0; display: none; margin:0; padding:0 5%; width:100%; height:0; z-index: 2; background: #222222; overflow: hidden;}
	.breadcrumb .dept_1 li:first-child{padding-top:10px;}
	.breadcrumb .dept_1 li:last-child{padding-bottom:10px;}
	.breadcrumb .dept_1 li a { padding: 10px 0; font-size: 15px; color:#ffffff;}
	.breadcrumb .dept_1 li a::before{ bottom:8px; left:0;  display: none; width:100%; transform: translateX(0);} */

	.breadcrumb .wrap{padding: 0!important;}
	.breadcrumb .inner_wrap .bread_home{flex-shrink: 0;}
	.breadcrumb .inner_wrap .dep.br_dep_1{display: none;}
	.breadcrumb .inner_wrap .dep.br_dep_2{width:100%;}
	.breadcrumb .inner_wrap .dep.br_dep_2>a{width:100%; font-size:15px; }
	.breadcrumb .inner_wrap>div>a { padding: 12px 20px;}
	.breadcrumb .inner_wrap .dep ul li a {font-size: 14px;}

	header .m_menu_container::before{width:100%;}
	header .m_menu_container .m_menu_inner .mgnb>li {padding-left: 40px; padding-right: 40px;}

	#footer .footer_wrap {padding: 40px 0 60px;}
	#footer .footer_wrap .link_wrap {padding: 12px 0;}
	#footer .footer_wrap .footer_info address .factory_info p {padding: 0 16px;}
	#footer .footer_wrap .footer_info address .fact_02{margin-top:16px;}
	#footer .footer_wrap .footer_bottom {margin-top: 28px; padding-top: 28px;}
	#footer .footer_wrap .footer_bottom .inner_wrap .copyright {padding: 0 0px 28px 0;}
	#footer .footer_wrap .footer_bottom .inner_wrap .img_wrap {width: 120px;}

	
}

@media(max-width:540px){
	body {font-size: 15px;}
	header .header_wrap h1 {width: 140px;}
	header .m_menu_container .m_menu_inner .mgnb>li {padding-left: 5%; padding-right: 5%;}
	header .m_menu_container .m_menu_inner .mgnb>li>a{font-size:28px; }

	#footer .footer_wrap {font-size: 14px;}

	
#footer .footer_wrap .footer_info address .factory_info p:not(:last-child) ::before {display: none;}
	

}

@media(max-width:480px){
	header .m_menu_container .close_btn {top: 8px; right: 2%;}
	header.on .m_menu_container .close_btn {top: 8px; right: 2%;}
	header .m_menu_container .m_menu_inner .mgnb>li>a{font-size:24px; }

	#footer .footer_wrap .link_wrap li a {padding: 0 12px;}
	#footer .footer_wrap .footer_out_info>ul>li {width: 100%;}

}

@media(max-width:400px){
	#footer .footer_wrap .family_site_wrap .family_site_list {right: inherit; left:0;}
}

/* 20241223 */
header .header_wrap .menu_container .gnb .dep_1>a {padding: 28px 32px 20px;}
header .header_wrap .menu_container .gnb .dep_1 .dep_2 ul li a {padding: 8px 12px; font-size: 0.85em;}
header .header_wrap .hamburger_btn_wrap .lang .lang_btn  {display: flex; align-items: center; gap: 4px;}
header .header_wrap .hamburger_btn_wrap .lang .lang_btn .icon_20{display: block; width:28px; height: 28px;}
header .header_wrap .hamburger_btn_wrap .lang .lang_btn .icon_20 svg{width:100%; height:100%;}
header.on .header_wrap .hamburger_btn_wrap .lang .lang_btn svg *{stroke: #000000;}
header.on_menu .header_wrap .hamburger_btn_wrap .lang .lang_btn svg *{stroke: #000000;}
@media(max-width:1800px){
  header .header_wrap h1 {width: 220px;}
  header .header_wrap .menu_container .gnb .dep_1>a {padding: 28px 24px 20px;}  
}	
@media(max-width:1600px){
  header .header_wrap h1 {width: 200px;}
}	
@media(max-width:1440px){
  header .header_wrap .menu_container {left: inherit; right: 120px; transform: translate(0, -50%);  justify-content: flex-end;}
  header .header_wrap .menu_container .gnb .dep_1>a {padding: 28px 22px 20px;}  
  header .header_wrap .hamburger_btn_wrap .lang .lang_btn span{display: none;} 
}