/*header*/
#header {/*position: fixed; */ position: relative; top: 0; left: 0; width: 100%; height: 110px; z-index: 1000;  -webkit-transition: all .3s; -moz-transition: all .3s; -o-transition: all .3s; transition: all .3s;  /*border-bottom:1px solid #dfdfdf; */}
#header .header_inner {margin: 0 auto; position: relative;/*  padding-left:70px; */}
#header h1 {position:absolute; top:0; left: 7%; margin-top: 25px; -webkit-transition: all .3s; -moz-transition: all .3s; -o-transition: all .3s; transition: all .3s; z-index: 10;}
#header.blk h1 {margin-top: 15px;}
#header h1 a {position: relative; display: block; width: 322px; height:53px;}
#header h1 a img {position: absolute; top: 0; left: 0; -webkit-transition: all .3s; -moz-transition: all .3s; -o-transition: all .3s; transition: all .3s;}
#header h1 a img.logo {opacity: 0; filter:alpha(opacity=0); -mox-opacity:0;}
.mobile_logo {display:none;}
#header .btn_allmenu {display: none;}
#header .btn_tel_m {display: none;}
#header .lang {position:absolute;right:5%;top: 5px;line-height:100px;padding:0 20px;box-sizing:border-box;z-index:1000;}
#header .lang .tt { cursor: pointer; width:100%; }
#header .lang .tt > a {color:#222; font-weight:500; font-size: 18px; /*display: flex; align-items: center; justify-content: space-between;*/ border-radius:30px; border:1px solid rgba(000,000,000,0.3); padding:5px 25px; }
#header .lang .tt > a:hover {color:#222; font-weight:500; font-size: 18px; /*display: flex; align-items: center; justify-content: space-between;*/ background:#00a040; color:#fff; border-radius:30px; border:1px solid rgba(000,000,000,0.3); padding:5px 25px; -webkit-transition: all .3s; -moz-transition: all .3s; -o-transition: all .3s;}
/*#header .lang .tt img { vertical-align: text-top; margin-left: 10px;} */
#header .lang ul {display: none; position: absolute; left: 0; width: 100%; border: 1px solid #888; background: #fff; border-radius: 20px; box-sizing: border-box; overflow: hidden; transition:0.5s;}
#header .lang ul li {height: 35px; font-size: 13px; line-height: 37px;}
/*#header .lang ul li a {display: block; padding: 0 25px;}*/
#header .lang ul li a { display:inline-block; vertical-align:top;  border-radius:30px; border:1px solid rgba(255,255,255,0.5); padding:0 25px; height:40px; line-height:40px; text-align:center;font-family:'NanumSquare','Noto Sans KR'; font-size:18px; color:#fff;  background:rgba(255,255,255,0);}
#header .lang ul li a:hover { background:rgba(255,255,255,0.2); }

#header:hover,
#header.scroll {background: #fff; }
#header.blk {height:95px;  box-shadow: #00000033 1px 1px 15px 1px;}

.sub #header {background: #fff; }

#header.blk {background: #fff; z-index:1000; border-bottom: 1px solid #eee;}
#header:hover h1 a img.logo,
#header.scroll h1 a img.logo,
#header.blk h1 a img.logo  {opacity: 1; filter:alpha(opacity=1); -mox-opacity:1;}
#header:hover h1 a img.logo_w,
#header.scroll h1 a img.logo_w,
#header.blk h1 a img.logo_w  {opacity: 0; filter:alpha(opacity=0); -mox-opacity:0;}
#header:hover .tt,
#header.scroll .tt,
#header.blk .tt  {border-color: #888;}
#header:hover .tt span,
#header.scroll .tt span,
#header.blk .tt span  {color: #222;}
/*#header:hover .lang ,
#header.scroll .lang {background: #b4c1c7;}
*/
#header.blk .lang {/*background: #b4c1c7; height:85px; line-height:85px;*/ top:0px; -webkit-transition: all .3s; -moz-transition: all .3s; -o-transition: all .3s; transition: all .3s;}

#header .inner {max-width:100%; padding:0 5%; box-sizing:border-box;}

#topmenu {font-size: 0; white-space: nowrap; z-index: 505; /* max-width:1200px; margin:0 auto; */ width:90%; padding:15px 0 0px 30% ; text-align:left; display: inline-block; float: left;  box-sizing:border-box;}
#topmenu .menu > li {position: relative; display: inline-block; /*margin-right:100px;*/ /* margin: 0 100px 0 0; */ vertical-align: top; /* width:20%; */}
#topmenu .menu > li:first-child {margin-left: 0;}
#topmenu .menu > li:nth-child(1) {width:25%;}
#topmenu .menu > li:nth-child(2) {width:25%;}
#topmenu .menu > li:nth-child(3) {width:25%;}
#topmenu .menu > li:nth-child(4) {width:25%;}
/*#topmenu .menu > li:nth-child(5) {width:18%;}*/

#topmenu .menu > li span {font-family:'Noto Sans KR','Malgun Gothic', 'Nanum Gothic', Sans-serif;}
#topmenu .menu > li > a {position:relative; display: inline-block; font-size: 22px; font-weight: 600; color: #000;  -webkit-transition: all .3s; -moz-transition: all .3s; -o-transition: all .3s; transition: all .3s; border-bottom: 1px solid transparent;line-height: 80px;}

#topmenu .menu > li:hover > a, #topmenu .menu > li a.On {color: #00a040 !important; /* border-bottom: 1px solid #222; */ }
#topmenu .menu > li:hover > a:after, #topmenu .menu > li a.On:after {content:''; width:100%; height:2px; background: #00a040; position:absolute; left:0; bottom:10px; }
/*#topmenu .menu > li a.On {color: #00a040 !important;  border-bottom: 2px solid #00a040; }*/

#topmenu .submenu {display: none; position: absolute; left: 0; width: 100%; z-index: 50}
#topmenu .submenu ul {width:100%; height: 330px; padding-top: 5px; box-sizing: border-box; }
#topmenu .submenu ul li {text-align:left; font-size: 17px; font-weight: 400; line-height: 32px;}
#topmenu .submenu ul li a {color: #666; -webkit-transition: all .3s; -moz-transition: all .3s; -o-transition: all .3s; transition: all .3s;}
#topmenu .submenu ul li a:hover {color: #222; font-weight: 400;}

#header .submenu_bg {display: none; position: absolute; top: 85px; width: 100%; height: 330px;/*  border-top: 1px solid #ddd; */ border-bottom: 1px solid #eee; background: #fff; z-index: 1;}

#header:hover #topmenu .menu > li > a,
#header.scroll #topmenu .menu > li > a,
#header.blk #topmenu .menu > li > a  {color: #222;}

#header.blk #topmenu .menu > li > a  {line-height: 70px;}

#AllMenu {display:none;}


/*======================= Tablet 1280 px ~ =======================*/

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

#header .lang {right:0%;}
#header .lang .tt > a {font-size: 17px;padding:5px 15px; }
#header h1 {left:2%;}
#header h1 a {position: relative; display: block; width: 200px; }
#header h1 a img {width:200px;}
    
#header .inner {max-width:1000px;}
#topmenu {width:100%; padding:15px 0 10px 18% ; }
#topmenu .menu > li:nth-child(2) {width:30%;}
#topmenu .menu > li:nth-child(3) {width:28%;}


    
}

/*======================= Tablet 1024 px ~ =======================*/


@media only screen and (max-width:1024px){
.pc {display:none !important;}
.tablet {display:block !important;}

.inner {padding: 0 30px;}
#topmenu {display:none;}
#header .lang {display:none;}


/* allmenu */
#header {height:90px;}
#header h1 { margin-top:10px;}
#header h1 a img {width:auto;}    
 
#header .btn_allmenu {display: block; position: absolute; top: 28px; right: 30px; width: 30px; height: 30px;}
#header .btn_allmenu img {position: absolute; top: 0; left: 0; -webkit-transition: all .3s; -moz-transition: all .3s; -o-transition: all .3s; transition: all .3s; width:30px; }
#header .btn_allmenu img.b {opacity: 0; filter:alpha(opacity=0); -mox-opacity:0;}

#header:hover .btn_allmenu img.b,
#header.scroll .btn_allmenu img.b,
#header.blk .btn_allmenu img.b  {opacity: 1; filter:alpha(opacity=1); -mox-opacity:1;}
#header:hover .btn_allmenu img.w,
#header.scroll .btn_allmenu img.w,
#header.blk .btn_allmenu img.w  {opacity: 0; filter:alpha(opacity=0); -mox-opacity:0;}



/* 전체메뉴 */
#AllMenu {display:block; position:fixed; top:0; right:-100vw; width:100%; height:100%; background:#fff; color:#222; z-index:1100; opacity: 0; filter:alpha(opacity=0); -mox-opacity:0; -webkit-transition: all .3s; -moz-transition: all .3s; -o-transition: all .3s; transition: all .3s;}
#AllMenu.on {right: 0;}
#AllMenu .btn_close {position:absolute; top:50px; right:5%; width:20px; z-index: 500;}
#AllMenu .btn_close img {vertical-align:top;  width:100%;}

#AllMenu .AllMenu_wrap {position: relative; padding:55px 0; height: 100vh; }
#AllMenu .menu_wrap {padding: 0 60px;}
#AllMenu .menu_wrap dl {width:100%; height:auto; padding:0; border:none; text-align:center; }
#AllMenu .menu_wrap dl:first-child {border:none;}
#AllMenu .menu_wrap dl dt {position:relative; padding:0; font-size:25px; line-height:2.5; font-weight:500;}
#AllMenu .menu_wrap dl dt i {content:''; position:absolute; top:0; left:0; width:100%; height:100%; z-index:1; cursor:pointer;}
#AllMenu .menu_wrap dl dd {display:none; padding:15px 0; border-top:1px solid #ebebeb; border-bottom:1px solid #ebebeb; font-size:18px; font-weight:400; line-height:3;}
#AllMenu .menu_wrap dl dd > ul > li:hover a {color:#222;}
#AllMenu .allmenu_util {margin-top:50px;/*  position: absolute; width: 100%; bottom: 130px; */}
#AllMenu .allmenu_util .link {float:none; width:100%;}
#AllMenu .allmenu_util .link ul {text-align:center;}
#AllMenu .allmenu_util .link ul li {float:none; display:inline-block; vertical-align:middle; padding:10px;  }
#AllMenu .allmenu_util .link ul li img {width:42px; height:42px;}
#AllMenu .allmenu_util .center {position: relative; height: 80px; padding: 0 25px;background: #b4c1c7; margin-top:35px; }
#AllMenu .allmenu_util .center a {color:#222; font-weight:500; font-size: 18px; /*display: flex; align-items: center; justify-content: space-between;*/ border-radius:30px; border:1px solid rgba(000,000,000,0.3); padding:5px 25px; }
#AllMenu .allmenu_util .center > a:hover {color:#222; font-weight:500; font-size: 18px; /*display: flex; align-items: center; justify-content: space-between;*/ background:#0f6bb0; color:#fff; border-radius:30px; border:1px solid rgba(000,000,000,0.3); padding:5px 25px; -webkit-transition: all .3s; -moz-transition: all .3s; -o-transition: all .3s;}



/* 메인비쥬얼 */
.mainvisual_section .mainTxt ul li strong {font-size: 50px;}
#mainvisual ul.slick-dots {width:auto; left:15%; bottom:50px;}
#mainvisual button.slick-arrow.slick-next {right:auto; left:27%;}
#mainvisual button.slick-arrow.slick-prev {left:5%; }
#mainvisual button.slick-arrow {bottom:50px;}


}

/*===============================================================*/
/*======================= Tablet 900 px ~ =======================*/
/*===============================================================*/
@media only screen and (max-width:900px){
/* 메인-section2 */
.main_section_tit_w {font-size:20px;}
.main_section_tit_w br.br_none {display:none;}


/* 서브-폰트 */


}


/*===============================================================*/
/*======================= Tablet 850 px ~ =======================*/
/*===============================================================*/
@media only screen and (max-width:850px){

.mainvisual_section .mainTxt .tt > p {font-size: 30px; margin-bottom: 5px;}
.mainvisual_section .mainTxt .tt strong {font-size: 46px;}


}



/*===============================================================*/
/*======================= Tablet 768 px ~ =======================*/
/*===============================================================*/
@media only screen and (max-width:768px){



}



/*===============================================================*/
/*======================= Mobile 640 px ~ =======================*/
/*===============================================================*/
@media only screen and (max-width:640px){
.pct {display:none !important;}
.mobile {display:block !important;}
.tablet {display:none !important;}

.inner { padding: 0 5%;}


/* header */
/*#header { height: 60px;  z-index:1001;}*/
#header {height:80px;}
/*#header h1 {padding-left:1%; padding-top:20px;}*/
#header h1 a {width: 170px;}
.pc_logo {display:none;}
.mobile_logo {display:block;}
/* #header .btn_allmenu {top: 15px; width: 28px; height: 30px;} */
#header .btn_tel_m {right: 13%; top: 16px; width: 28px; height: 30px;}
#header .btn_allmenu {right: 5%;}

#header.blk {height:65px !important;}
#header.blk h1 a img {width:170px;}

#header.blk .btn_allmenu { top: 22px;}



/* 전체메뉴 */
#AllMenu .btn_close {top:28px; right:5%; z-index: 500;}
/* #AllMenu .AllMenu_wrap {padding:25% 0;} */
#AllMenu .menu_wrap dl dt {font-size:5vw;}
#AllMenu .menu_wrap dl dd {padding:3% 0; font-size:4vw; line-height:2;}
#AllMenu .allmenu_util {margin-top:8%;}
#AllMenu .allmenu_util .link ul li {padding:2%; font-size:3.4vw;}
#AllMenu .allmenu_util p {font-size:2.8vw; text-align:center;}
#AllMenu .allmenu_util p span {padding-left:3%;}
#AllMenu .allmenu_util .center { height: 70px; margin-top:15px;}
#AllMenu .allmenu_util .center .tt > a { font-size:4vw; line-height:70px; }



}


/*===============================================================*/
/*======================= Mobile 520 px ~ =======================*/
/*===============================================================*/
@media only screen and (max-width:520px){



}



/*===============================================================*/
/*======================= Mobile 420 px ~ =======================*/
/*===============================================================*/
@media only screen and (max-width:420px){

  
#mainvisual button.slick-arrow {bottom:30px;}
#mainvisual ul.slick-dots { bottom:30px;} 
#mainvisual button.slick-arrow.slick-next {right: 25%;}
#mainvisual button.slick-arrow.slick-prev {left: 25%;}

#mainvisual button.slick-arrow {display:none !important;}



}
/*===============================================================*/
/*======================= Mobile 380 px ~ =======================*/
/*===============================================================*/
@media only screen and (max-width:380px){

}


/*===============================================================*/
/*======================= Mobile 320 px ~ =======================*/
/*===============================================================*/
@media only screen and (max-width:320px){

}


 
.rsnsbox {position: fixed; right:1%; top: 310px; width:90px; opacity: 1; z-index: 90; text-align: right; }
.rsnsbox ul li {float:left; width:100%; margin-bottom:10px;}

@media only screen and (max-width:1024px){
	.rsnsbox {width:35px;}
	.rsnsbox ul li img {width:100%;}
}

@media only screen and (max-width:680px){
  .rsnsbox {display:none;}
}