@charset "utf-8";
.ir-tmpl{background: url(../images/ir-tmpl.png) no-repeat;}
#top_layout{position:relative;margin-bottom:0;width:100%;height:85px;background-color:#fff;z-index:97;}
#top_layout .layout.top_wrap{max-width:100%;width:100%;}
#top_layout #logo{position:absolute;top:26px;left:20px;width:auto;height:46px;z-index:10}
#top_layout #logo a{display:block;width:290px;height:46px;}
#top_layout #logo a *{vertical-align:middle}
#top_layout #logo a img,
#top_layout #logo a span{display:inline-block;height:46px;}
#top_layout #logo a span{margin-left:15px;padding-left:15px;border-left:1px solid #ddd;font-size:24px;line-height:1.2;font-weight:bold;color:#000}
#top_layout .utile_wrap{position:absolute; top:19px; right:33px;z-index:10;}
#top_layout .utile_wrap ul{height:46px;}
#top_layout .utile_wrap li { float:left;margin-left:7px;}
#top_layout .utile_wrap li.text{margin-top: 10px;}
#top_layout .utile_wrap li.text a{position:relative;padding-left:10px;font-size:12px;text-transform: uppercase;color:#2b2b2b;letter-spacing:1px}
#top_layout .utile_wrap li.text a:before{content:'';position:absolute;top:35%;left:0;width:4px;height:4px;border-radius:50%;background-color:#333}
#top_layout .utile_wrap li.box {/*margin-top:-15px;margin-right:-33px;*/margin-top:24px;margin-right:-33px;width:52px;height:52px;background:#fff;}
#top_layout .utile_wrap li.box button,
#top_layout .utile_wrap li.box a{width:100%; height:100%; display:block;  position:relative; z-index: 0; padding: 0;  border: 0 none;display:block;}
#top_layout .utile_wrap li.box a:after{ position: absolute; display: block; width: 100%; height: 0; bottom: 0; background: #464646; content: ""; z-index: -1; transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;}
#top_layout .utile_wrap li.box a:hover:after,
#top_layout .utile_wrap li.box a:focus:after{background:#464646; height:41px;}
#top_layout .utile_wrap li.box i {display: block;width: 100%;height: 100%;}
#top_layout .utile_wrap li.box .allmenu{background-position:-455px -44px}
#top_layout .utile_wrap li.pc{display:inline-block;margin-top: -12px}
#top_layout .utile_wrap li.mo{display:none}
#gnb_layout{position:relative;height:85px;background-color:#fff;transition:all 0.3s ease-out;-webkit-transition:all 0.3s ease-out;-o-transition:all 0.3s ease-out;-moz-transition:all 0.3s ease-out;overflow:hidden}
#gnb {position: absolute;top:0;left: 0;width: 100%;height:76px;z-index:2}
#gnb_layout.action{position:relative;background-color:#fff;}
#gnb_layout .layout{position:relative;padding:0;text-align:center}
#gnb_layout .depth1_ul{display:inline-block;width:100%;height:100%;text-align:center;z-index:14;}
#gnb_layout .depth1_ul:after {display: block; content: ''; clear: both;}
#gnb_layout .depth1_ul>li{display:inline-block;max-width:200px;min-width:120px;height:100%;margin:0 -2px;vertical-align:top;}
#gnb_layout .depth1_ul>li>a{display:block;height:100%;padding:20px 5px;font-size:20px;color:#121212;font-family:"nsr",sans-serif;font-weight:600;letter-spacing:-1px;transition: all .3s;line-height:85px}
#gnb_layout .depth1_ul>li>a *{vertical-align:middle}
#gnb_layout .depth1_ul>li>a span{vertical-align:middle;display:block;line-height:45px}
#gnb_layout .depth1_ul>li>a span:before{content: ''; display:inline-block;height:100%;vertical-align:middle;}
#gnb_layout .depth1_ul.n6>li>a,
#gnb_layout .depth1_ul.n7>li>a,
#gnb_layout .depth1_ul.n8>li>a{font-size:16px;}
#gnb_layout .depth1_ul>li>a:hover,
#gnb_layout > ul > li.on > a {color: #df3128;}
#gnb_layout .depth1_ul > li  .depth2_ul {width:100%; border-left: 1px solid #d8e0e9; margin: 0 -1px 0 0; padding:15px 0; transition: all 300ms cubic-bezier(1, 0, 0, 1); opacity: 0; transform: translateX(50px);}
#gnb_layout .depth1_ul > li  .depth2_ul > li {line-height: 1.3; text-align: left;}
#gnb_layout .depth1_ul > li  .depth2_ul > li:first-child {margin-top: 0;}
#gnb_layout .depth1_ul > li  .depth2_ul > li > a {display:block;padding:7px 20px;position: relative; font-weight: 400; font-size:14px;letter-spacing: -1px; line-height: 1; color: #4d4d57; transition: all .3s; vertical-align: top;}
#gnb_layout .depth1_ul > li  .depth2_ul > li > a:hover,
#gnb_layout .depth1_ul > li  .depth2_ul > li > a:focus {background-color:#df3128;color:#fff;}
#gnb_layout .depth1_ul > li:last-child > .depth2_ul {border-right: 1px solid #ededed;}
#gnb_layout .depth1_ul > li  .depth2_ul > li > .depth3_ul{display:none;}
#gnb_layout .depth1_ul > li  .depth2_ul > li > a span{display:block;position:relative;line-height:1.2;}
#gnb_layout .depth1_ul > li  .depth2_ul > li > a span:before{display: block; content: '';position: absolute;top:7px;left:-8px;width:3px;height:3px;background-color:#df3128;}
#gnb_layout .depth1_ul > li  .depth2_ul > li > a:hover span:before{background-color:#fff}
#gnb_layout.open .depth1_ul > li .depth2_ul {opacity: 1; transform: translateX(0);}
#gnb_layout.open .depth1_ul > li:nth-child(2) .depth2_ul {transition-delay: .03s;}
#gnb_layout.open .depth1_ul > li:nth-child(3) .depth2_ul {transition-delay: .06s;}
#gnb_layout.open .depth1_ul > li:nth-child(4) .depth2_ul {transition-delay: .09s;}
#gnb_layout.open .depth1_ul > li:nth-child(5) .depth2_ul {transition-delay: .12s;}
#gnb_layout.open .depth1_ul > li:nth-child(6) .depth2_ul {transition-delay: .15s;}
#gnb_layout.open .depth1_ul > li:nth-child(7) .depth2_ul {transition-delay: .18s;}
#gnb_layout.open .depth1_ul > li:nth-child(8) .depth2_ul {transition-delay: .21s;}
#gnb_layout.open .depth1_ul > li:nth-child(9) .depth2_ul {transition-delay: .24s;}
#gnb_layout.open .depth1_ul > li:nth-child(10) .depth2_ul {transition-delay: .27s;}
#gnb_layout .line {display: block; position: absolute; top: 86px; right: 0; left: 0; width: 100%; height: 1px; background: #ededed; opacity: .7;}
#gnb_layout.open #gnb_layout{border-bottom:1px solid #d8e0e9;}
#gnb_layout:after {display: block; content: ''; position: absolute; top: 86px; left: 0; z-index: 1; width: 100%; height: 100%; background:#fafafa; transition: all .3s; opacity:1;}
@media screen and (max-width:1600px){
	#gnb_layout .layout{padding:0 220px 0 250px;}
	#gnb_layout .depth1_ul.n3>li{width:33.33%}
	#gnb_layout .depth1_ul.n4>li{width:25%}
	#gnb_layout .depth1_ul.n5>li{width:20%}
	#gnb_layout .depth1_ul.n6>li{width:16.66%}
	#gnb_layout .depth1_ul.n7>li{width:14.28%}
	#gnb_layout .depth1_ul.n8>li{width:12.5%}
}
@media screen and (max-width:1280px){
	#gnb_layout .depth1_ul>li>a{padding:20px 0;    font-weight: 400;}
}
@media screen and (max-width:1199px){
	#gnb_layout .layout{padding-right:10px}
	#gnb_layout .depth1_ul{float:none;text-align:center}
	#top_layout .utile_wrap{top:-10px;z-index:10;}
}
@media screen and (max-width:1023px){
  #gnb_layout{display:none;}
  #top_layout{z-index:auto;margin-bottom:0;}
  #top_layout .utile_wrap li.pc{display:none}
  #top_layout .utile_wrap li.mo{display:inline-block;margin-top:16px;margin-right:-17px}
  #top_layout #logo{top:16px;}
}
/* mobile menu */
#mobile-menu{ padding:0 !important;}
#mobile-menu .modal-dialog {-webkit-transform: translate(25%,0); transform: translate(25%,0); margin: 0; width: 250px; max-width: 250px; float:right; height: 100%;}
#mobile-menu.in .modal-dialog,
#mobile-menu.show .modal-dialog {-webkit-transform:translate(-30px,0);transform: translate(-30px,0);}
#mobile-menu .modal-dialog .modal-content { width: 280px; border-radius: 0; border:  0 none; height: 100%;overflow-y: scroll;}
#mobile-menu .modal-dialog .modal-content .modal-body { padding:0; background:#fff;position:relative;}
#mobile-menu .modal-dialog .modal-content .modal-body .util-mobile{padding:18px;background-color:#df3128}
#mobile-menu .modal-dialog .modal-content .modal-body .util-mobile li{display:inline-block;padding-right:15px;margin-right:15px;position:relative;}
#mobile-menu .modal-dialog .modal-content .modal-body .util-mobile li:before{display: block; content: ''; position: absolute; top: 10px; right: 0;width:2px;height:10px;background-color:#efefef; }
#mobile-menu .modal-dialog .modal-content .modal-body .util-mobile li a{display:block;color:#fff;font-size:16px;font-weight: 400;letter-spacing: 0;line-height:1.5}
#mobile-menu .modal-dialog .modal-content .modal-body .header-mobile{padding:18px;padding-right:56px;background-color:#353a41}
#mobile-menu .modal-dialog .modal-content .modal-body .header-mobile h1{font-size:18px;color:#fff;font-weight: bold;letter-spacing: 0;line-height:1.5}
#mobile-menu .modal-dialog .modal-content .modal-body ul { padding: 0; margin:0;}
#mobile-menu .modal-dialog .modal-content .modal-body ul.show {display:block !important;}
#mobile-menu .modal-dialog .modal-content .modal-body .depth1_ul > li { border-bottom: 1px solid #ddd; text-align:left;}
#mobile-menu .modal-dialog .modal-content .modal-body .depth1_ul>li a{display:block; position:relative; width:100%; padding: 14px 30px; font-size:20px;line-height:1.2;background-color: transparent; text-align: left;}
#mobile-menu .modal-dialog .modal-content .modal-body .depth1_ul>li a:before { position: absolute;  top: 50%;  right:25px;  width: 12px;  height: 12px;  display: block;  content: "";  border-top: 2px solid #ddd; border-left: 2px solid #ddd;  border-bottom: 2px solid transparent; border-right: 2px solid transparent; transform: translate( 0,-19%) rotate(45deg);}
#mobile-menu .modal-dialog .modal-content .modal-body .depth1_ul .on .a:before { transform: translate( 0,-74%) rotate(-136deg);}
#mobile-menu .modal-dialog .modal-content .modal-body .depth2_ul {padding: 15px 35px; border-top:1px solid #ddd;background-color: #f6f6f6;}
#mobile-menu .modal-dialog .modal-content .modal-body .depth2_ul>li a {display:block;padding:5px 14px;color:#5a5f65;font-size:16px;line-height:1.2;position: relative;}
#mobile-menu .modal-dialog .modal-content .modal-body .depth2_ul>li a:after {content: '';display: block;width: 5px;height: 2px;background: #df3128;position: absolute;top: 12px;left:0;display:block;}
#mobile-menu .modal-dialog .modal-content .modal-body .depth2_ul>li a:before{display:none;}
#mobile-menu .modal-dialog .modal-content .modal-body .depth3_ul {padding:0 0 0 25px;}
#mobile-menu .modal-dialog .modal-content .modal-body .depth3_ul>li a {display:block;padding:0 14px;color:#5a5f65;font-size:16px;line-height:1.2;position: relative;}
#mobile-menu .modal-dialog .mobile-close{position: absolute; top: 69px; right:5px;width:40px;height:40px;z-index:99}
#mobile-menu .modal-dialog .mobile-close span{display:block;width:100%;height:100%;font-size:0;position: relative;}
#mobile-menu .modal-dialog .mobile-close span:before,
#mobile-menu .modal-dialog .mobile-close span:after {position: absolute;content: '';height: 2px;width: inherit;background: #fff;left: 0;transition: all .3s ease-in;}
#mobile-menu .modal-dialog .mobile-close span:before {top: 50%;transform: rotate(45deg);}
#mobile-menu .modal-dialog .mobile-close span:after {bottom: 50%;transform: rotate(-45deg);}
