@charset "utf-8";
@import url(//spoqa.github.io/spoqa-han-sans/css/SpoqaHanSans-kr.css); 
@import url(//fonts.googleapis.com/css?family=Roboto:300,400,500,700);
@import url(//cdn.rawgit.com/mfd/f3d96ec7f0e8f034cc22ea73b3797b59/raw/856f1dbb8d807aabceb80b6d4f94b464df461b3e/gotham.css);
@import url(//fonts.googleapis.com/css2?family=Titillium+Web:wght@200;300;400;600;700;900&display=swap);
@import url(//fonts.googleapis.com/css2?family=Montserrat:wght@100;300;400;500;600;700;800&display=swap);
@import url(//fonts.googleapis.com/css2?family=Play:wght@400;700&display=swap);


@font-face { 
  font-family: 'Noto Sans KR'; 
  font-style: normal; 
  font-weight: 100; 
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.woff2) format('woff2'), 
      url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.woff) format('woff'), 
      url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.otf) format('opentype'); 
} 
@font-face { 
  font-family: 'Noto Sans KR'; 
  font-style: normal; 
  font-weight: 300; 
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff2) format('woff2'), 
      url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff) format('woff'), 
      url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.otf) format('opentype'); 
} 
@font-face { 
  font-family: 'Noto Sans KR'; 
  font-style: normal; 
  font-weight: 400; 
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff2) format('woff2'), 
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff) format('woff'), 
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.otf) format('opentype'); 
 } 
@font-face { 
  font-family: 'Noto Sans KR'; 
  font-style: normal; 
  font-weight: 500; 
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff2) format('woff2'), 
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff) format('woff'), 
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.otf) format('opentype'); 
 } 
@font-face { 
  font-family: 'Noto Sans KR'; 
  font-style: normal; 
  font-weight: 700; 
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff2) format('woff2'), 
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff) format('woff'), 
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.otf) format('opentype'); 
 } 
@font-face { 
  font-family: 'Noto Sans KR'; 
  font-style: normal; 
  font-weight: 900; 
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.woff2) format('woff2'), 
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.woff) format('woff'), 
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.otf) format('opentype'); 
 } 


html,body { font-family:'Noto Sans KR', 'Spoqa Han Sans', "Apple SD Gothic Neo", "Malgun Gothic", Sans-serif; }
body {overflow-y:visible;overflow-x:auto;}
#doc {overflow:hidden;position:relative;background:#fff;min-width:360px; z-index:8999;min-width:360px;opacity:1;-webkit-transition: opacity 0.3s ease-out;-moz-transition: opacity 0.3s ease-out;-o-transition: opacity 0.3s ease-out;transition: opacity 0.3s ease-out;}
#doc.show{ transition-delay:0s; opacity:1;}
	@media only screen and (max-width:1200px){
		
	}
	@media only screen and (max-width:999px){
		
	}
	@media only screen and (max-width:680px){
		
	}
	@media only screen and (max-width:480px){
		
	}	
	

/*=======================================================
  css default
=========================================================*/
.div-cont {position:relative;text-align:left;margin:0 auto 0 auto; max-width:1440px; padding:0 20px; box-sizing:border-box;}
.div-cont:after {clear:both;content:"";display:block;}
	@media only screen and (max-width:1240px){
		
	}
	@media only screen and (max-width:999px){
		
	}
	@media only screen and (max-width:680px){
		.div-cont{padding:0 20px;}

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

.div-cont02 {position:relative;text-align:left;margin:0 auto 0 auto; max-width:1440px; padding:0 20px; box-sizing:border-box;}
.div-cont02:after {clear:both;content:"";display:block;}
	
	@media only screen and (max-width:680px){
		.div-cont02{padding:0 0px;}

	}
	

.body-slide-wr{position:relative;width:100%;transition:margin 0.3s ease;}
.body-slider-ovclick{position:fixed;z-index:2600;width:100%;height:100%;left:0;top:0;background:rgba(0,0,0,0.65);cursor:pointer }
.header-slider-ovclick{position:fixed;z-index:2010;width:100%;height:100%;/* height:calc(100% - 60px) */;left:0;top:0;background:rgba(0,0,0,0.65);cursor:pointer }
	@media only screen and (min-width:1201px){
		.header-slider-ovclick{display:none !important}
	}

/*=======================================================
    z-index dafault
=========================================================*/
#header-wrap{position:fixed;z-index:2005;}
#container-wrap{position:relative;z-index:1005;}
#footer-wrap{position:relative;z-index:1000;}


/*=======================================================
    #header-wrap 
=========================================================*/
#header-wrap {left:0; width:100%; top:0px; min-width:360px; -webkit-transition: top 1s ease-in-out;-moz-transition: top 1s ease-in-out;-o-transition: top 1s ease-in-out;transition: top 1s ease-in-out}
.show #header-wrap{top:0;}
#header-wrap:after{position:absolute;left:50%; top:0; width:20000px;background:none;margin-left:-10000px;height:100%; box-sizing:border-box;background:none; z-index:-1;-webkit-transition: background 0.3s ease-out;-moz-transition: background 0.3s ease-out;-o-transition: background 0.3s ease-out;transition: background 0.3s ease-out;display:block; content:"";}
#header-wrap.fix:after, #header-wrap.isOver:after, #header-wrap.fixed:after{background:#fff;box-shadow: 0 1px 5px rgba(0, 0, 0, 0.12); -webkit-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.12); -moz-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.12) ;}
#header{position:relative; z-index:5001; }

#header .inner{/* max-width:1240px; */ min-width:360px; position:relative; margin:0 auto; padding:0 20px; box-sizing:border-box; height:100px; }
.sub#header .inner{/* max-width:1240px; */ min-width:360px; position:relative; margin:0 auto; padding:0 20px; box-sizing:border-box; height:100px;background:#fff; } /*¼­ºêÁö¾ØºñÃß°¡*/

#logo{position:absolute; left:50px; top:30px; width:140px; height:35px; z-index:2009;}
#logo a{display:block; height:35px;background:url(../img/logo.png) no-repeat left center; background-size:100% auto}

.sub #logo a{display:block; height:35px;background:url(../img/logo-over.png) no-repeat left center; background-size:100% auto} /*¼­ºêÁö¾ØºñÃß°¡*/

#header-wrap.fix #logo a,#header-wrap.fixed #logo a, #header-wrap.isOver #logo a{background-image:url(../img/logo-over.png)}


#header .bt-mnall{position:absolute;z-index:2599; width:30px; height:30px; top:50%;margin-top:-15px; right:17px; display:none;}
#header .bt-mnall .bar{position:absolute;left:3px;width:24px;height:1px;background:#fff}
.sub #header .bt-mnall .bar{position:absolute;left:3px;width:24px;height:1px;background:#111}
#header .bt-mnall .bar.no1{top:6px}
#header .bt-mnall .bar.no2{top:14px}
#header .bt-mnall .bar.no3{top:22px}
#header .bt-mnall .bar.no1, #header .bt-mnall .bar.no3{transition:transform .3s ease;-webkit-transition:transform .3s ease}
#header .bt-mnall .bar.no2{transition:left .3s ease, opacity .3s;-webkit-transition:left .3s ease, opacity .3s}
#header .bt-mnall.active .bar.no1{left:3px;transform:translateY(8px) rotate(45deg);-webkit-transform:translateY(8px) rotate(45deg)}
#header .bt-mnall.active .bar.no2{left:-10px;opacity:0;filter:alpha(opacity=0)}
#header .bt-mnall.active .bar.no3{left:3px;transform:translateY(-8px) rotate(-45deg);-webkit-transform:translateY(-8px) rotate(-45deg)}

#header .bt-mnall:hover .bar.no1 {-webkit-animation: line-animate .6s forwards;animation: line-animate .6s forwards}
#header .bt-mnall:hover .bar.no2 {-webkit-animation: line-animate .6s .2s forwards; animation: line-animate .6s .2s forwards}
#header .bt-mnall:hover .bar.no3 {-webkit-animation: line-animate .6s .4s forwards; animation: line-animate .6s .4s forwards}

#header .bt-mnclose {position:absolute;display:none;z-index:2599; width:65px; height:65px; background:url(../img/layout/bt-mnclosew.png) no-repeat center center; background-size:22px auto;right:0; top:0;}

#header .bt-allmenu{position:absolute;z-index:2599; width:30px; height:30px; top:50%;margin-top:-15px; right:25px;}
#header .bt-allmenu .bar{position:absolute;left:3px;width:24px;height:1px;background:#fff;}
.sub #header .bt-allmenu .bar{position:absolute;left:3px;width:24px;height:1px;background:#111;}/*¼­ºêÁö¾ØºñÃß°¡*/
#header .bt-allmenu .bar.no1{top:6px}
#header .bt-allmenu .bar.no2{top:14px}
#header .bt-allmenu .bar.no3{top:22px}
#header .bt-allmenu .bar.no1, #header .bt-allmenu .bar.no3{transition:transform .3s ease;-webkit-transition:transform .3s ease}
#header .bt-allmenu .bar.no2{transition:left .3s ease, opacity .3s;-webkit-transition:left .3s ease, opacity .3s}
#header .bt-allmenu.active .bar.no1{left:3px;transform:translateY(8px) rotate(45deg);-webkit-transform:translateY(8px) rotate(45deg)}
#header .bt-allmenu.active .bar.no2{left:-10px;opacity:0;filter:alpha(opacity=0)}
#header .bt-allmenu.active .bar.no3{left:3px;transform:translateY(-8px) rotate(-45deg);-webkit-transform:translateY(-8px) rotate(-45deg)}

#header .bt-allmenu:hover .bar:before{left:0;}
#header .bt-allmenu:hover .bar:after{left:100%;}

#header .bt-allmenu:hover .bar.no1 {-webkit-animation: line-animate .6s forwards;animation: line-animate .6s forwards}
#header .bt-allmenu:hover .bar.no2 {-webkit-animation: line-animate .6s .2s forwards; animation: line-animate .6s .2s forwards}
#header .bt-allmenu:hover .bar.no3 {-webkit-animation: line-animate .6s .4s forwards; animation: line-animate .6s .4s forwards}


#header-wrap.fix .bt-allmenu .bar , #header-wrap.fixed .bt-allmenu .bar ,#header-wrap.isOver .bt-allmenu .bar{background:#111}
#header-wrap.fix .bt-mnall .bar , #header-wrap.fixed .bt-mnall .bar ,#header-wrap.isOver .bt-mnall .bar{background:#111}


#header .language {position:absolute;z-index:2599; right:88px; top:39px; height:30px; }
#header .language ul{}
#header .language ul:after{display:block; content:"";clear:both}
#header .language li{float:left;}
#header .language li:nth-child(n+2){margin-left:20px;}
#header .language li a{ color:#fff; font-family:'GothamPro'; font-weight:500; text-transform:uppercase; display:block; position:relative;}
#header .language li a:after {content:'';position:absolute;bottom:-3px;left:0;width:100%;height:1px;background-color:#fff;opacity:0;-webkit-transform:scaleX(0);-moz-transform:scaleX(0);transform:scaleX(0);-webkit-transform-origin:100% 50%;-moz-transform-origin:100% 50%;transform-origin:100% 50%;-webkit-transition:-webkit-transform .3s cubic-bezier(.77,0,.175,1),opacity .5s;-moz-transition:-moz-transform .3s cubic-bezier(.77,0,.175,1),opacity .5s;transition:transform .3s cubic-bezier(.77,0,.175,1),opacity .5s}
#header .language li a:hover:after {opacity:1;-webkit-transform-origin:0 50%;-moz-transform-origin:0 50%;transform-origin:0 50%;-webkit-transform:scaleX(1);-moz-transform:scaleX(1); transform:scaleX(1);-webkit-transition:-webkit-transform .3s cubic-bezier(.77,0,.175,1),opacity .3s; -moz-transition:-moz-transform .3s cubic-bezier(.77,0,.175,1),opacity .3s;transition:transform .3s cubic-bezier(.77,0,.175,1),opacity .3s}

.sub #header .language li a{ color:#111; font-family:'GothamPro'; font-weight:500; text-transform:uppercase; display:block; position:relative;}/*¼­ºêÁö¾ØºñÃß°¡*/
.sub #header .language li a:after {content:'';position:absolute;bottom:-3px;left:0;width:100%;height:1px;background-color:#111; opacity:0;-webkit-transform:scaleX(0);-moz-transform:scaleX(0);transform:scaleX(0);-webkit-transform-origin:100% 50%;-moz-transform-origin:100% 50%;transform-origin:100% 50%;-webkit-transition:-webkit-transform .3s cubic-bezier(.77,0,.175,1),opacity .5s;-moz-transition:-moz-transform .3s cubic-bezier(.77,0,.175,1),opacity .5s;transition:transform .3s cubic-bezier(.77,0,.175,1),opacity .5s}
.sub #header .language li a:hover:after {opacity:1;-webkit-transform-origin:0 50%;-moz-transform-origin:0 50%;transform-origin:0 50%;-webkit-transform:scaleX(1);-moz-transform:scaleX(1); transform:scaleX(1);-webkit-transition:-webkit-transform .3s cubic-bezier(.77,0,.175,1),opacity .3s; -moz-transition:-moz-transform .3s cubic-bezier(.77,0,.175,1),opacity .3s;transition:transform .3s cubic-bezier(.77,0,.175,1),opacity .3s}



#header-wrap.fix .language li a, #header-wrap.isOver .language li a{color:#242424;} 
#header-wrap.fix .language li a:after, #header-wrap.isOver .language li a:after{background-color:#242424;}
	@media only screen and (max-width:1560px) {	
		#logo{width:110px;height:40px; top:32px}
		#logo a{height:40px;}
		
	}
	@media only screen and (min-width:1185px) and (max-width:1400px){
	
	}
	@media only screen and (max-width:1185px) {
		#header .bt-mnall{display:block;}
		#header .bt-allmenu{display:none !important;}

	
	}
	@media only screen and (max-width:999px) {
	
		#logo{width:100px;height:36px; top:18px}
		#logo a{height:36px;}

		#header .inner{height:65px;}
        .sub #header .inner{height:65px;}
		
		#header .language {top:22px; right:70px;}
		#header .language li a{font-size:13px;}
	}
	@media only screen and (max-width:680px) {
		#logo{width:90px;height:30px; left:15px;top:18px}

		#header .language li a{font-size:12px;}
		#header .language li:nth-child(n+2){margin-left:15px;}
	}






#allmenu-wrap{position:fixed; top:0;left:0; display:none; overflow:hidden; z-index:3005;background:#fff; padding-right:80px; width:100%;height:100%; box-sizing:border-box; overflow-y:auto;}	
#allmenu-wrap .close {position:absolute;z-index:2599; width:30px; height:30px; background:url(../img/layout/bt-mnclose.png) no-repeat center center; background-size:20px auto;right:25px; top:34px; }
#allmenu-wrap .allmenu{position:absolute; left:0; top:0; height:100%; overflow:hidden; width:100%;z-index:233; display:flex;align-items: center; justify-content: center;}
#allmenu-wrap .logo{position:absolute; left:20px; top:28px; width:122px; height:46px; z-index:2009;background:url(../img/logo-over.png) no-repeat left center; background-size:100% auto}
#allmenu-wrap .copy{position:absolute; left:0; bottom:0; width:100%; line-height:20px; text-align:center; color:#252525; padding:30px 0;}

#allmenu-wrap .allmenu ul{max-width:1400px; margin-top:-20px;}
#allmenu-wrap .allmenu .mn_l1{position:relative; padding-left:300px;}
#allmenu-wrap .allmenu .mn_l1:nth-child(n+2){margin-top:70px;}
#allmenu-wrap .allmenu .mn_a1{color:#111; letter-spacing:-0.03em; position:absolute; left:0; top:0; font-size:45px;letter-spacing:-0.03em; line-height:60px; font-weight:600; }
#allmenu-wrap .allmenu .mn_a1:after{width:0;height:20px; left:-10px;bottom:5px; background:#e51937; position:absolute;  display:block;  content:"";z-index:-1; opacity:0.3;-webkit-transition: width 0.3s ease-in-out;-moz-transition: width 0.3s ease-in-out;-o-transition: width 0.3s ease-in-out;transition: width 0.3s ease-in-out;}
#allmenu-wrap .allmenu .depth2-wrap{}
#allmenu-wrap .allmenu .depth2:after{display:block; content:"";clear:both}
#allmenu-wrap .allmenu .depth2{min-height:60px; box-sizing:border-box; padding-top:17px;}
#allmenu-wrap .allmenu .mn_l2{float:left;}
#allmenu-wrap .allmenu .mn_l2:nth-child(n+2){margin-left:50px;}
#allmenu-wrap .allmenu .mn_a2{display:block; font-size:24px; font-weight:400; color:#a1a1a1; line-height:1.2em; letter-spacing:-0.03em;font-weight:700;}

#allmenu-wrap .allmenu .mn_l1:hover .mn_a2{color:#444;}
#allmenu-wrap .allmenu .mn_l1:hover .mn_a2:hover{color:#e51937}

#allmenu-wrap .allmenu .mn_l1:hover .mn_a1:after{width:calc(100% + 20px)}
	@media only screen and (max-width:1560px) {	
		#allmenu-wrap .logo{width:110px;height:40px; top:32px}
		#allmenu-wrap .allmenu .mn_l1{padding-left:240px;}
		#allmenu-wrap .allmenu .mn_l1:nth-child(n+2){margin-top:50px;}
		#allmenu-wrap .allmenu .mn_a1{font-size:40px;}
		#allmenu-wrap .allmenu .mn_a1:after{height:16px;}
		#allmenu-wrap .allmenu .mn_a2{font-size:20px;}
		#allmenu-wrap .allmenu .mn_l2:nth-child(n+2){margin-left:40px;}
		
		#allmenu-wrap .copy{font-size:13px;}
	}
	@media only screen and (max-width:1300px){
		#allmenu-wrap .allmenu .mn_l1{padding-left:200px;}
		#allmenu-wrap .allmenu .mn_l1:nth-child(n+2){margin-top:35px;}
		#allmenu-wrap .allmenu .mn_a1{font-size:35px;}
		#allmenu-wrap .allmenu .mn_a1:after{height:12px;}
		#allmenu-wrap .allmenu .mn_a2{font-size:17px;}
		#allmenu-wrap .allmenu .mn_l2:nth-child(n+2){margin-left:30px;}

		#allmenu-wrap .copy{font-size:12px;}
	}
	@media only screen and (max-width:999px) {
		#allmenu-wrap{display:none !important;}
	}
	@media only screen and (max-width:680px) {
		
	}

	

	

	/*=======================================================
		#mainNavi-wrap 
	=========================================================*/
	@media only screen and (min-width:1185px){
		#header .bt-mnall, #header .bt-mnclose{display:none !important;}

		#header .bt-mnall{display:none;}
		#mainNavi-wrap {height:85px;overflow:hidden;position:absolute;left:0;top:6px;width:100%;display:block;z-index:2007;}
		#mainNavi-wrap .tmn-tit {display:none;}

		#mainNav {position:relative;}
		.tm-top{display:none}
		
		.topmenu {display:block;position:relative;text-align:center; font-size:0;}
		.topmenu:after {display:block;content:"";clear:both;}
		.topmenu .tgl-btn {display:none;}
		.topmenu .mn_a1 {font-size:20px;line-height:1.35em;display:block;color:#fff; padding:32px 0 31px 0;width:160px; font-weight:500; letter-spacing:-0.01em; text-transform:uppercase;position:relative; text-align:center; z-index:14;-webkit-transition: color 0.3s ease-in-out, width 0.3s ease-in-out;-moz-transition: color 0.3s ease-in-out, width 0.3s ease-in-out;-o-transition: color 0.3s ease-in-out, width 0.3s ease-in-out;transition: color 0.3s ease-in-out, width 0.3s ease-in-out;}

		.sub .topmenu .mn_a1 {font-size:20px;line-height:1.35em;display:block;color:#111; padding:32px 0 31px 0;width:160px; font-weight:500; letter-spacing:-0.01em; text-transform:uppercase;position:relative; text-align:center; z-index:14;
		-webkit-transition: color 0.3s ease-in-out, width 0.3s ease-in-out;-moz-transition: color 0.3s ease-in-out, width 0.3s ease-in-out;-o-transition: color 0.3s ease-in-out, width 0.3s ease-in-out;transition: color 0.3s ease-in-out, width 0.3s ease-in-out;} /*¼­ºêÁö¾ØºñÃß°¡*/
		
		.topmenu .mn_l1:first-child .mn_a1:after{display:none;}
		.topmenu .mn_l1:first-child{margin-left:80px;}
		.topmenu .mn_l1 {display:inline-block;vertical-align:top;position:relative;}
		.topmenu .mn_a1:hover{color:#e51937}
		.topmenu .is-open .mn_a1, .topmenu .is-over .mn_a1{color:#e51937}

		.isOver .topmenu .mn_a1{width:200px}

		.topmenu .mn_l1.is-open .depth2-wrap{}
		.topmenu .depth2-wrap {position:absolute;top:94px;display:none;visibility:hidden;padding:0; width:100% !important;}
		/* .topmenu .depth2-wrap:after{position:absolute; left:0; top:0; width:100%;height:0; background:#2d4478; display:block; content:""; z-index:1; -webkit-transition: height 0.4s ease-in-out;-moz-transition: height 0.4s ease-in-out;-o-transition: height 0.4s ease-in-out;transition: height 0.4s ease-in-out;}
		.topmenu .mn_l1.is-over .depth2-wrap:after{height:100%;} */
		.topmenu .depth2 {position:relative;height:auto;padding:25px 0 25px 0px;min-height:350px; box-sizing:border-box; z-index:2;}
		.topmenu .mn_l1:nth-child(n+2) .depth2:before{width:1px; height:350px; border-left:1px solid #dedede; left:-1px; top:50%;margin-top:-175px; display:block;content:""; position:absolute;}
		.topmenu .depth2 li{}
		.topmenu .depth2 .mn_l2 {text-align:center;}
		.topmenu .depth2 .mn_a2 {line-height:1.2em;padding:7px 0 7px 0; display:block;}
		.topmenu .depth2 .mn_a2 span {display:inline-block;line-height:1.2em ; padding:3px 2px;/*text-transform:uppercase;*/ position:relative;font-weight:400; font-size:16px;letter-spacing:-0.03em;color:#414a4f; position:relative; -webkit-transition: color 0.4s ease-in-out;-moz-transition: color 0.4s ease-in-out;-o-transition: color 0.4s ease-in-out;transition: color 0.4s ease-in-out;}
		.topmenu .depth2 .mn_a2 span:before{width:0;left:50%; height:1px; background:#ea0a2a; display:block; content:""; position:absolute; bottom:-4px;-webkit-transform: translateX(-50%); -moz-transform: translateX(-50%);-ms-transform: translateX(-50%); -o-transform:  translateX(-50%);transform: translateX(-50%);-webkit-transition: width 0.3s ease-out;-moz-transition: width 0.3s ease-out;-o-transition: width 0.3s ease-out;transition: width 0.3s ease-out;} 
		.topmenu .depth2 .mn_a2:hover span:before{width:96%;}
		.topmenu .depth2 .mn_a2:hover span {color:#e51937 !important; }

		/* .topmenu .mn_l1.is-open .depth2 .mn_a2 span {color:rgba(255,255,255,0.7)} */
	
		#mainNavi-wrap .ovbar {position:absolute;height:2px;top:100px;display:none !important;overflow:hidden; opacity:0}
		#mainNavi-wrap .ovbar:after {position:absolute;bottom:0;left:0;background:#ea0a2a; height:1px;content:"";display:block;z-index:200; width:100%;-webkit-transition: all 0.3s ease-out;-moz-transition: all 0.3s ease-out;-o-transition: all 0.3s ease-out;transition: all 0.3s ease-out;}
		#header-wrap.isOver #mainNavi-wrap .ovbar, #header-wrap.fix #mainNavi-wrap .ovbar{opacity:1}
		#header-wrap.over #mainNavi-wrap .ovbar{opacity:1}

		.tm-language, .tm-link{display:none;}
		
		#header-wrap.fix .topmenu .mn_a1{color:#242424;} 
		#header-wrap.isOver .topmenu .mn_a1{color:#242424;} 
		#header-wrap.isOver .topmenu .mn_a1:hover, #header-wrap.isOver .topmenu .is-over .mn_a1{color:#ea0a2a;}

		#header-wrap.over .topmenu .mn_a1{color:#242424;} 
		#header-wrap.over .topmenu .mn_a1{color:#242424;} 
		#header-wrap.over .topmenu .mn_a1:hover, #header-wrap.over .topmenu .is-over .mn_a1{color:#ea0a2a;}

		.mn-bar {position:absolute;background:#fff;border-top:1px solid #dedede;border-bottom:1px solid #dedede;top:100px;width:20000px; left:50%;margin-left:-10000px;z-index:2000; height:0; box-sizing:border-box;/* box-shadow: 0 1px 5px rgba(0, 0, 0, 0.12); -webkit-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.12); -moz-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.12) ; */}
	}
	@media only screen and (min-width:1401px) and (max-width:1600px){
		.topmenu .mn_l1:first-child{margin-left:40px;}

		.topmenu .mn_a1 {width:140px; font-size:17px;}
		.topmenu .depth2 {padding:20px 0}
		.topmenu .depth2 .mn_a2 span {font-size:15px;}


		.isOver .topmenu .mn_a1{width:170px}
	}
	@media only screen and (min-width:1185px) and (max-width:1401px){
		.topmenu .mn_l1:first-child{margin-left:0;}
		.topmenu .mn_a1 {width:110px;font-size:17px;}
		.topmenu .depth2 {padding:20px 0}
		.topmenu .depth2 .mn_a2 span {font-size:14px;}

		.isOver .topmenu .mn_a1{width:140px}
	}
	@media only screen and (max-width:1185px) {
		#header-wrap .mn-bg {display:none;}
		#mainNavi-wrap{position:relative; z-index:4300; text-align:left; height:0 !Important}
		#mainNavi {position:fixed;background:#fff;transition:right 0.3s ease;z-index:7000;right:-290px;min-width:290px;box-sizing:border-box;overflow-y:auto;overflow-x:hidden;top:0;width:290px;height:100%; padding-bottom:60px; min-height:480px;-webkit-transition: right 0.3s ease-out;-moz-transition: right 0.3s ease-out;-o-transition: right 0.3s ease-out;	transition: right 0.3s ease-out;}
		#mainNavi.mn-h-open {right:0;}

		.tm-top{ height:75px; background:url(../img/logo.png) no-repeat 25px center #e51937; background-size:100px auto;}
	
		.topmenu {width:100%;display:block;position:absolute; left:0; top:129px; height:calc(100% - 189px);overflow-y:auto;z-index:141;padding:20px; box-sizing:border-box;}
		.topmenu:after {display:block;content:"";clear:both;}
		.topmenu li {line-height:1.3em;position:relative;text-transform:uppercase}
		.topmenu .mn_l1:first-child{margin-left:0;}
		.topmenu a {position:relative;}
		.topmenu .mn-txt{display:none;}

		.topmenu .has-sub .tgl-btn {padding:0;display:block;width:20px;height:20px;position:absolute;right:5px;top:8px;border:0;z-index:102;text-indent:-9999em;background:transparent;}
		.topmenu .has-sub .tgl-btn:before {content:'';position:absolute;left:0;top:50%;width:11px;height:1px;background:#e51937;transform: rotate(45deg);-webkit-transition: all 0.3s ease-out;-moz-transition: all 0.3s ease-out;-o-transition: all 0.3s ease-out;transition: all 0.3s ease-out;}
		.topmenu .has-sub .tgl-btn:after {content:'';position:absolute;right:0;top:50%;width:12px;height:1px;background:#e51937;transform: rotate(-45deg);-webkit-transition: all 0.3s ease-out;-moz-transition: all 0.3s ease-out;-o-transition: all 0.3s ease-out;transition: all 0.3s ease-out;}
		.topmenu .mn_l1 > .tgl-btn {right:12px;top:16px;}
		.topmenu .mn_l1.is-open > .tgl-btn:before, .topmenu .mn_l1.over > .tgl-btn:before{background:#252525;left:0;transform: rotate(-45deg);}
		.topmenu .mn_l1.is-open > .tgl-btn:after, .topmenu .mn_l1.over > .tgl-btn:after{background:#252525;right:0;transform: rotate(45deg);}
	
		.topmenu .mn_l2 > .tgl-btn {width:16px;height:16px;right:12px;top:16px;}
		.topmenu .mn_l2 > .tgl-btn:before, .topmenu .mn_l2 > .tgl-btn:after {height:1px;}
		.topmenu .mn_l2.is-open > .tgl-btn:before, .topmenu .mn_l2.over > .tgl-btn:before {transform: rotate(0);}
		.topmenu .mn_l2.is-open > .tgl-btn:after, .topmenu .mn_l2.over > .tgl-btn:after {transform: rotate(0);}

		.topmenu .mn_a1 {position:relative;display:block;padding:17px 30px 17px 10px;overflow:hidden;font-size:18px;font-weight:500;letter-spacing:-0.02em;white-space:normal;cursor:pointer;color:#000; z-index:101}
		.topmenu .over .mn_a1, .topmenu .is-open .mn_a1{font-weight:500;color:#e51937;}


		.topmenu li > div {display:none; opacity:0;}
		.topmenu .depth2-wrap {position:relative; width:auto !important}
		.topmenu .depth2 {position:relative;background:#f7f7f7;padding:15px 0;border-bottom:1px solid #ededed;}
		.topmenu .depth2:after {clear:both;content:"";display:block}
		.topmenu .depth2 a {font-size:14px;line-height:1.3em;display:block;}
		.topmenu .depth2 .mn_l2:last-child{border-bottom:none}
		.topmenu .depth2 .mn_a2 {display:block;padding:5px 30px 5px 32px; position:relative;}
		.topmenu .depth2 .mn_a2:before{width:5px;height:0; position:Absolute; left:20px; top:14px; border-bottom:1px solid #666; display:block; content:""}
		.topmenu .depth2 .mn_a2 span.img{display:none;}
		.topmenu .depth2 .mn_a2 span {font-size:15px;font-weight:400;cursor:pointer;color:#555;}
		.topmenu .depth2 .mn_a2:hover span{color:#111} 
		

		.mn-bar {display:none;}
		
		.tm-language{background:#e51937}
		.tm-language ul{padding:13px 25px 20px 20px;text-align:right;}
		.tm-language ul:after{display:block; content:"";clear:both;}
		.tm-language li{display:inline-block;vertical-align:top;}
		.tm-language li:nth-child(n+2){ margin-left:20px;}
		.tm-language li a{display:block; line-height:20px; color:#fff;font-family:'GothamPro'; font-weight:500; font-size:14px; text-align:center;position:relative;}
		.tm-language li a:after {content:'';position:absolute;bottom:-3px;left:0;width:100%;height:1px;background-color:#fff;opacity:0;-webkit-transform:scaleX(0);-moz-transform:scaleX(0);transform:scaleX(0);-webkit-transform-origin:100% 50%;-moz-transform-origin:100% 50%;transform-origin:100% 50%;-webkit-transition:-webkit-transform .3s cubic-bezier(.77,0,.175,1),opacity .5s;-moz-transition:-moz-transform .3s cubic-bezier(.77,0,.175,1),opacity .5s;transition:transform .3s cubic-bezier(.77,0,.175,1),opacity .5s}
		.tm-language li a:hover:after ,.tm-language li.active a:after {opacity:1;-webkit-transform-origin:0 50%;-moz-transform-origin:0 50%;transform-origin:0 50%;-webkit-transform:scaleX(1);-moz-transform:scaleX(1); transform:scaleX(1);-webkit-transition:-webkit-transform .3s cubic-bezier(.77,0,.175,1),opacity .3s; -moz-transition:-moz-transform .3s cubic-bezier(.77,0,.175,1),opacity .3s;transition:transform .3s cubic-bezier(.77,0,.175,1),opacity .3s}
		
		.tm-link{position:Absolute; left:0; bottom:0; width:100%;display:block; border-top:1px solid #dadada; background:#f5f5f5;}
		.tm-link ul{font-size:0; padding:17px 10px;}
		.tm-link ul:after{display:block;content:"";clear:both;}
		.tm-link li{float:left; width:50%; position:Relative;display:inline-block;vertical-align:top;}
		.tm-link li:nth-child(n+2):before{width:1px;height:14px; top:50%;margin-top:-7px; background:#dadada; display:block; content:""; left:-1px;position:absolute;}
		.tm-link li a{font-size:14px; color:#555;  line-height:25px; display:block;text-align:center;}
		.tm-link li a span{display:inline-block;vertical-align:top;}
		.tm-link li a:hover{color:#111}

		.tm-link li:nth-child(1) a span{background:url(../img/layout/mn-ico01.png) no-repeat left center; padding-left:25px}
		.tm-link li:nth-child(2) a span{background:url(../img/layout/mn-ico02.png) no-repeat left center; padding-left:25px;}
	}
	@media only screen and (max-width:680px){
		
	}
	
	

/* ======================================================
   #container-wrap 
=========================================================*/
#container-wrap{}
#container-wrap #contents{ /*min-height:700px;*/}
/* .main #container-wrap {position:relative; height:100%; min-height:768px} */

.main #container-wrap{}
.sub #container-wrap {}
.sub #container-wrap #contents{padding:170px 20px 150px;}
	@media only screen and (max-width:1200px){

	}
	@media only screen and (max-width:1184px) {
		.sub #container-wrap {margin-top:65px;}
	}
	@media only screen and (max-width:999px){
		.sub #container-wrap #contents{padding:65px 20px}
	}
	@media only screen and (max-width:680px){
		.sub #container-wrap #contents{padding:40px 15px}
	}
	@media only screen and (max-width:480px){

	}


/* ======================================================
    cont-top & top-vis & top-btn 
=========================================================*/
.cont-top{text-align:center; margin-bottom:50px;}
.cont-top h2{font-size:45px; font-weight:700;letter-spacing:-0.03em; line-height:1.2em; color:#000;}	
.cont-top p{margin-top:40px;font-size:16px; color:#777; font-weight:400; letter-spacing:-0.02em; line-height:1.3em; position:relative;}
.cont-top .btxt{margin-top:40px;font-size:19px; color:#111; font-weight:500; letter-spacing:-0.02em; line-height:1.3em; position:relative;}
.cont-top p:before{width:1px; height:16px; background:#666; position:absolute ;left:50%; top:-30px; display:block; content:"";transform: scale(1,1) rotate(35deg)skew(0,0) translate(0,0); -webkit-transform: scale(1,1) rotate(35deg)skew(0,0) translate(0,0); -moz-transform: scale(1,1) rotate(35deg)skew(0,0) translate(0,0); transform-origin: 50% 50%; }


.top-btn{ z-index:2004;right:-70px;width:45px;height:45px;background:url(../img/Layout/top-btn.jpg) no-repeat center center;background-size:100% auto; bottom:20px; position:fixed;-webkit-transition: all 0.3s ease-out;-moz-transition: all 0.3s ease-out;-o-transition: all 0.3s ease-out;transition: all 0.3s ease-out; }
.top-btn.over{right:20px; }
.top-btn:hover{background-image:url(../img/Layout/top-btno.jpg)}

.cont-top.no-dot p{margin-top:20px}
.cont-top.no-dot p:before{display:none;}

#top-vis{height:450px; position:relative;z-index:1005; overflow:hidden;}
#top-vis .img{height:450px;position:relative;}
#top-vis .img img{width:100%;height:450px;object-fit:cover;transform:scale(1.35, 1.35); -webkit-transform:scale(1.3, 1.3); -moz-transform:scale(1.3, 1.3); -ms-transform:scale(1.3, 1.3);-webkit-transition: transform 3s ease-in-out;-moz-transition: transform 3s ease-in-out;-o-transition: transform 3s ease-in-out;transition: transform 3s ease-in-out;}
#top-vis .txt{position:absolute; left:50%; top:50%; margin-top:5px;max-width:1400px;text-align:center; width:100%; box-sizing:border-box; padding:0 20px; z-index:5;-webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%);  -ms-transform: translate(-50%, -50%);  -o-transform: translate(-50%, -50%);  transform: translate(-50%, -50%);}
#top-vis .txt .btxt{font-size:40px; font-weight:700; color:#fff; letter-spacing:-0.03em; line-height:1.3em;opacity:0;-webkit-transform: translateY(40%); -moz-transform: translateY(40%);-ms-transform: translateY(40%); -o-transform:  translateY(40%);transform: translateY(40%);-webkit-transition: opacity 1s ease-in-out, transform 1s ease-in-out;-moz-transition: opacity 1s ease-in-out, transform 1s ease-in-out;-o-transition: opacity 1s ease-in-out, transform 1s ease-in-out;transition: opacity 1s ease-in-out, transform 1s ease-in-out;}
#top-vis .txt .stxt{margin-top:20px;font-size:18px; font-weight:400; color:#fff; letter-spacing:-0.03em; line-height:1.3em;opacity:0;-webkit-transform: translateY(40%); -moz-transform: translateY(40%);-ms-transform: translateY(40%); -o-transform:  translateY(40%);transform: translateY(40%);-webkit-transition: opacity 1s ease-in-out, transform 1s ease-in-out;-moz-transition: opacity 1s ease-in-out, transform 1s ease-in-out;-o-transition: opacity 1s ease-in-out, transform 1s ease-in-out;transition: opacity 1s ease-in-out, transform 1s ease-in-out;}
	
#top-vis.ani .img img{transform:scale(1, 1); -webkit-transform:scale(1, 1); -moz-transform:scale(1, 1); -ms-transform:scale(1, 1);}
#top-vis.ani .txt .btxt{transition-delay: 0.3s;opacity:1;-webkit-transform: translateY(0); -moz-transform: translateY(0);-ms-transform: translateY(0); -o-transform:  translateY(0);transform: translateY(0);}
#top-vis.ani .txt .stxt{transition-delay: 0.6s;opacity:1;-webkit-transform: translateY(0); -moz-transform: translateY(0);-ms-transform: translateY(0); -o-transform:  translateY(0);transform: translateY(0);}
	
	@media only screen and (max-width:1600px){
		.cont-top h2{font-size:41px;}
	}
	@media only screen and (max-width:1200px){
		.cont-top h2{font-size:37px;}
		.cont-top p{font-size:15px;}

		#top-vis .txt .btxt{font-size:35px;}
		#top-vis .txt .stxt{font-size:16px;}
	}
	@media only screen and (min-width:1000px){
		
	}
	@media only screen and (max-width:999px){
		.cont-top{margin-bottom:30px;}
		.cont-top h2{font-size:32px;}
		.cont-top p{font-size:14px;word-break: keep-all; padding:0 15px;}
		.cont-top .btxt{font-size:16px; }
		.cont-top.no-dot p{margin-top:15px}

		.top-btn{width:40px;height:40px; bottom:15px;}
		.top-btn.over{right:15px;}

		#top-vis{height:240px;}
		#top-vis .img{height:240px;}
		#top-vis .img img{height:240px;}

		#top-vis .txt{text-align:center;}
		#top-vis .txt .btxt{font-size:30px;}
		#top-vis .txt .stxt{font-size:14px;}
	}
	@media only screen and (max-width:680px){
		.cont-top h2{font-size:28px;}
		.cont-top p{font-size:13px; margin-top:30px;}
		.cont-top p:before{height:12px; top:-21px;}

		.cont-top.no-dot p{margin-top:10px}

		.top-btn{width:35px;height:35px;bottom:10px;}
		.top-btn.over{right:10px;}
		
		#top-vis{height:300px;}
		#top-vis .img{height:300px;}
		#top-vis .img img{height:300px;}
		
		
		#top-vis .txt .btxt{font-size:25px;}
		#top-vis .txt .stxt{font-size:13px;}
	}
	@media only screen and (max-width:480px){
		.cont-top h2{font-size:25px;}
	}


/* ======================================================
    snbNav
=========================================================*/
#snbNavi-wrap{position:relative; z-index:999; top:100px; }
/*#snbNavi-wrap.fix .fix{position:fixed; left:0; top:0; width:100%; background:#fff;}*/
#snbNavi-wrap.fix .fix{position:fixed; left:0; top:100px; display:block; width:100%; background:#111;  content:""; height:80px; }
#snbNavi-wrap.fix .snbNavi.desktop{top:100px; }
#snbNavi-wrap.fix .snbNavi.desktop:before{width:1000px;}

#snbNavi-wrap .snbNavi.desktop{position:absolute;left:50%; margin-left:-50px; top:-64px; max-width:1330px;width:100%; box-sizing:border-box; padding-left:0px;box-sizing:border-box; opacity:0; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%);-ms-transform: translateX(-50%); -o-transform:  translateX(-50%);transform: translateX(-50%);-webkit-transition: opacity 0.5s ease-in-out, margin-left 1s ease-in-out;-moz-transition:opacity 0.5s ease-in-out, margin-left 1s ease-in-out;;-o-transition: opacity 0.5s ease-in-out, margin-left 1s ease-in-out;;transition: opacity 0.5s ease-in-out, margin-left 1s ease-in-out;}
#snbNavi-wrap .snbNavi.desktop:after{width:10000px;height:100%; background:rgba(73,168,64,1); position:absolute;left:100px; top:0; display:block;content:"";z-index:-1;}
#snbNavi-wrap .snbNavi.desktop:before{width:100px; height:100%; background:rgba(73,168,64,1); position:absolute;right:calc(100% - 100px); top:0; display:block;content:"";z-index:-1;border-top-left-radius:0px; -webkit-transition: all 1s ease-in-out;-moz-transition: all 1s ease-in-out;-o-transition: all 1s ease-in-out;transition: all 1s ease-in-out;}
#snbNavi-wrap .snbNavi.desktop .snb-slide{}
#snbNavi-wrap .snbNavi.desktop ul{}
#snbNavi-wrap .snbNavi.desktop li{float:left;width:16.66666%;}
#snbNavi-wrap .snbNavi.desktop li a{display:block; font-size:18px; letter-spacing:-0.02em;color:#fff; position:Relative; line-height:64px;text-align:center; box-sizing:border-box; padding:0 10px;}
#snbNavi-wrap .snbNavi.desktop li.active a{background:#fff; color:#111;}
#snbNavi-wrap .snbNavi.desktop li a:after{background:#eee; position:Absolute; left:0 ;bottom:0 ;display:block;content:""; width:100%; height:0;-webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;}
#snbNavi-wrap .snbNavi.desktop li a:hover:after{ height:64px; z-index:-2;}
#snbNavi-wrap .snbNavi.desktop li a:hover{background:#eee; color:#111;}

.snbNav.mobile{max-width:1240px; margin:0 auto;position:relative; box-sizing:border-box; z-index:999;}
.snbNav.mobile:before{position:absolute; z-index:-1;left:50%; top:0; width:20000px;margin-left:-10000px;height:100%; box-sizing:border-box;border-top:1px solid #e1e1e1;border-bottom:1px solid #e1e1e1;display:block;content:"";}
.snbNav.mobile:after{display:block; content:"";clear:both;}
.snbNav.mobile dl{min-width:50%; float:left; position:relative;}
.snbNav.mobile dl:first-child:before{width:1px;height:100%; position:absolute; left:0; top:0; display:block; content:"";background:#dbdbdb;}
.snbNav.mobile dl:nth-child(n+2):before{width:1px;height:100%; position:absolute; left:0; top:0; display:block; content:"";background:#dbdbdb;}
.snbNav.mobile dl:last-child:after{width:1px;height:100%; position:absolute; right:0; top:0; display:block; content:"";background:#dbdbdb;}
.snbNav.mobile dt{}
.snbNav.mobile dt a{display:block; line-height:48px;height:50px; padding-left:15px; color:#353535; font-size:15px; position:relative;}
.snbNav.mobile dt a:after{width:14px;height:8px; position:absolute;right:12px; top:50%;margin-top:-4px; background:url(../img/sub/left-depth.png) no-repeat center center; background-size:12px auto;display:block; content:""}
.snbNav.mobile dt.active a:after{background-image:url(../img/sub/left-deptho.png);}
.snbNav.mobile dd{position:absolute;display:none; left:0; top:50px; width:calc(100% + 1px);background:#fff;box-sizing:border-box; border:1px solid #dbdbdb;border-top:0;}
.snbNav.mobile dd ul{}
.snbNav.mobile dd li{}
.snbNav.mobile dd li a{line-height:40px; font-size:14px; color:#555;letter-spacing:-0.02em; padding:0 15px; display:block;}
.snbNav.mobile dd li a:hover{background:#f4f4f4}
.snbNav.mobile dd li:nth-child(n+2){/* border-top:1px solid #dbdbdb; */}	
.snbNav.mobile dd li.active a{background:#f0f0f0; font-weight:700; color:#111;}

.snbNav.mobile dl:nth-child(n+2) dd{left:0;}

.snbNav.desktop{position:relative; }
.snbNav.desktop:after{position:absolute; z-index:-1;left:0; top:0; width:100%;height:100%; box-sizing:border-box;border-top:1px solid #e1e1e1;border-bottom:1px solid #e1e1e1; display:block;content:"";}
.snbNav.desktop ul{font-size:0;text-align:center;padding:0 20px;margin:0 auto;max-width:1280px; box-sizing:border-box;}
.snbNav.desktop ul:after{display:block; content:"";clear:both;}
.snbNav.desktop li{display:inline-block;vertical-align:top; position:relative;}
.snbNav.desktop li:nth-child(n+2):before{width:0;height:14px; border-left:1px solid rgba(0,0,0,0.1); display:block; content:""; position:absolute ;left:-1px ;top:50%;margin-top:-7px;}
.snbNav.desktop li a{font-size:18px; min-width:170px; color:#aaa;display:block; line-height:80px; padding:0 45px;box-sizing:border-box; position:relative;}
.snbNav.desktop li a span{position:relative;display:inline-block;vertical-align:top; }
.snbNav.desktop li a span:after{left:50%;width:0;height:4px; position:absolute;  bottom:0; background:#e51937; display:block;content:"";-webkit-transition: width 0.3s ease-in-out;-moz-transition: width 0.3s ease-in-out;-o-transition: width 0.3s ease-in-out;transition: width 0.3s ease-in-out;-webkit-transform: translateX(-50%); -moz-transform: translateX(-50%);-ms-transform: translateX(-50%); -o-transform:  translateX(-50%);transform: translateX(-50%);}
.snbNav.desktop li a:hover{color:#777}
.snbNav.desktop li.active a{color:#ea0a2a; font-weight:700;}
.snbNav.desktop li.active a span:after, .snbNav.desktop li a:hover span:after{ width:100%;}

/* .snbNav.desktop .c1 li{width:50%;}
.snbNav.desktop .c2 li{width:50%;}
.snbNav.desktop .c3 li{width:33.3333%;}
.snbNav.desktop .c4 li{width:25%;}
.snbNav.desktop .c5 li{width:20%;}
.snbNav.desktop .c6 li{width:16.666666666666%;}
.snbNav.desktop .c7 li{width:14.2857%;}
.snbNav.desktop .c8 li{width:12.5%;}
.snbNav.desktop .c9 li{width:11.111111111111%;}
.snbNav.desktop .c10 li{width:10%;} */
	@media only screen and (max-width:1600px){
		.snbNav.desktop li a{font-size:18px; line-height:75px;}
	}
	@media only screen and (max-width:1400px){
		.snbNav.desktop li a{font-size:17px; line-height:65px;}
		#snbNavi-wrap.fix .fix{height:75px;}
	}
	@media only screen and (min-width:1000px){
		.snbNav.mobile{display:none}
		
	}
	@media only screen and (max-width:999px){
		.snbNav.mobile{display:block}
		.snbNav.desktop{display:none}
		#snbNavi-wrap{top:0px; }
		#snbNavi-wrap.fix .fix{position:fixed; left:0; top:65px; display:block; width:100%; background:#fff;  content:"";  }

	}
	@media only screen and (max-width:680px){
		
	}
	@media only screen and (max-width:480px){
		.snbNav.mobile dt a{font-size:14px;line-height:43px;height:45px;}
		.snbNav.mobile dd{top:45px}
		.snbNav.mobile dd li a{font-size:14px; line-height:43px;}
	}



/* ======================================================
   .top-btn 
=========================================================*/
.top-btn{ z-index:2004;right:-70px;width:50px;height:50px; text-align:Center; background:url(../img/layout/top-btn.png) no-repeat center center;background-size:100% auto; border-radius:100%; bottom:20px; text-transform:uppercase; color:#fff; font-size:13px; font-weight:500; position:fixed;-webkit-transition: right 0.3s ease-out;-moz-transition: right 0.3s ease-out;-o-transition: right 0.3s ease-out;transition: right 0.3s ease-out; }
.top-btn.over{right:20px;}
.top-btn:hover{background-image:url(../img/layout/top-btno.png)}
	@media only screen and (max-width:1185px) {
		.top-btn{width:40px;height:40px; right:-40px; bottom:15px;}
		.top-btn.over{right:15px;}
	}
	@media only screen and (max-width:999px) {
		.top-btn{width:30px;height:30px;}
	}
	@media only screen and (max-width:480px) {
		.top-btn{bottom:10px;}
		.top-btn.over{right:10px;}
	}


/* ======================================================
    #footer-wrap 
=========================================================*/
#footer-wrap {display:block; position:relative;background:#212121; padding:85px 0;}
#footer {position:relative;text-align:left;}

.f-logo{width:122px;height:46px;background:url(../img/f-logo.png) no-repeat left center;background-size:100% auto; margin-bottom:40px;}

.f-info{position:relative;}
.f-info:after{display:block; content:"";clear:both}
.f-info .fl:nth-child(1){width:760px;}
.f-info dl{position:relative; padding-left:50px;}
.f-info dl:after{display:block; content:"";clear:both}
.f-info dl dt{position:absolute; left:0; top:0; font-size:18px;color:#fff; letter-spacing:-0.03em; line-height:20px; font-weight:500;}
.f-info dl dd{float:left;font-size:18px; color:#aaa; letter-spacing:-0.02em; line-height:20px;}


.f-info dl dd:nth-child(n+3){margin-left:0px; padding-right:20px;}


.f-info .copy{margin-top:65px;font-size:14px; color:#aaa; letter-spacing:-0.01em; line-height:20px;}

.f-info .link {padding-top:46px;position:Absolute; left:760px; top:0;}
.f-info .link li{}
.f-info .link li:nth-child(n+2){margin-top:12px}
.f-info .link li a{font-size:19px; color:#aaa; letter-spacing:-0.03em; line-height:22px;}
.f-info .link li:last-child a{color:#fff;}

.f-family{position:absolute; width:275px;right:20px;  top:0;}
.f-family .sel{display:block; position:relative;line-height:48px; padding:0 10px 0 20px; font-size:13px;border:1px solid #6b6b6b; color:#6b6b6b;}
.f-family .sel:after{width:12px;height:12px; position:absolute;right:20px; top:50%; margin-top:-6px; background:url(../img/layout/family-arrow.png) no-repeat center center; display:block; content:"";opacity:0.4;-webkit-transition: transform 0.3s ease-in-out;-moz-transition: transform 0.3s ease-in-out;-o-transition: transform 0.3s ease-in-out;transition: transform 0.3s ease-in-out;}
.f-family.active .sel:after{transform: scale(1,1) rotate(90deg)skew(0,0) translate(0,0);-webkit-transform: scale(1,1) rotate(90deg)skew(0,0) translate(0,0); -moz-transform: scale(1,1) rotate(90deg)skew(0,0) translate(0,0); }
.f-family ul{position:absolute; right:0; bottom:49px; width:100%;max-height:119px; overflow-y:auto;background:#202020; border:1px solid #555;padding:20px 20px;box-sizing:border-box; display:none}
.f-family li{}
.f-family li:nth-child(n+2){margin-top:7px;}
.f-family li a{font-size:14px; color:#999; line-height:1.5em;}
.f-family li a:hover{color:#fff;}

.f-family ul::-webkit-scrollbar { width: 10px; }
.f-family ul::-webkit-scrollbar-thumb {background-color: #555;}
.f-family ul::-webkit-scrollbar-track { background-color:#aaa; }
	@media only screen and (max-width:1560px) {	
		.f-logo{width:110px;height:40px;margin-bottom:30px;}
		.f-info .fl:nth-child(1){width:650px;}

		.f-info dl dt{font-size:15px;}
		.f-info dl dd{font-size:15px;}
		.f-info dl dd:nth-child(n+3){margin-left:20px;}
		
		.f-info .link{left:650px;padding-top:40px;}
		.f-info .link li a{font-size:17px;}
		.f-family{width:250px;}
	}
	@media only screen and (max-width:1300px) {
		#footer-wrap {padding:60px 0}
		.f-info .fl:nth-child(1){width:570px;}

		.f-info dl dt{font-size:14px;}
		.f-info dl dd{font-size:14px;}
		.f-info dl dd:nth-child(n+3){margin-left:15px;}

		.f-info .link{left:570px;}
		.f-info .link li a{font-size:16px;}

		.f-family{width:220px;}
		.f-family .sel{line-height:43px; padding-left:15px;}
		.f-family ul{bottom:44px; padding:15px;}
	
	}
	@media only screen and (max-width:999px) {
		#footer-wrap {padding:45px 0}
		.f-logo{width:100px;height:36px;margin-bottom:20px;}
		.f-info .fl{float:none;}
		.f-info .fl:nth-child(1){width:auto;}

		.f-info dl{padding-left:45px;}
		.f-info dl dt{font-size:14px;}
		.f-info dl dd{font-size:14px;}
		
		.f-info .link{left:auto; top:auto; position:relative; padding-top:0; margin-top:25px;}
		.f-info .link ul:after{display:block; content:"";clear:both;}
		.f-info .link li{float:left;}
		.f-info .link li:nth-child(n+2){margin-top:0; margin-left:20px;}
		.f-info .link li a{font-size:15px;}

		.f-info .copy{margin-top:40px; font-size:13px}
	}
	@media only screen and (max-width:680px) {
		.f-logo{width:90px;height:30px;}
		.f-family{position:relative; width:auto;right:auto;  top:auto; margin-top:25px;}
		
		.f-info dl{padding-left:40px;}
		.f-info dl.mg10t dd:nth-child(4){width:100%;margin-left:0}
		.f-info dl dt{font-size:13px;}
		.f-info dl dd{font-size:13px;}

		.f-info dl dd:nth-child(n+3){margin-left:15px;}
		.f-info dl dd:nth-child(n+4){margin-left:0px;}

		.f-info .link li a{font-size:14px;}
		.f-info .link li:nth-child(n+2){margin-left:17px;}

		.f-info .copy{margin-top:20px; font-size:12px;}
	}
	@media only screen and (max-width:480px) {
		.f-info .link li a{font-size:13px;}
		.f-info .link li:nth-child(n+3){margin-left:15px;}


	}


	@keyframes line-animate {
		0% {
			-webkit-transform: scaleX(1);
			transform: scaleX(1);
			-webkit-transform-origin: 100% 0;
			transform-origin: 100% 0
		}

		33% {
			-webkit-transform: scaleX(0);
			transform: scaleX(0);
			-webkit-transform-origin: 100% 0;
			transform-origin: 100% 0
		}

		40% {
			-webkit-transform: scaleX(0);
			transform: scaleX(0);
			-webkit-transform-origin: 0 0;
			transform-origin: 0 0
		}

		100% {
			-webkit-transform: scaleX(1);
			transform: scaleX(1);
			-webkit-transform-origin: 0 0;
			transform-origin: 0 0
		}
	}