@charset "utf-8";

#top_layout{position:relative;width:100%;height:84px;z-index:100;}
#top_layout #logo{position:absolute;top:26px;left:0;width:auto;height:36px;z-index:10}
#top_layout #logo a{display:block;}
#top_layout #logo a *{vertical-align:middle}
#top_layout #logo a img,
#top_layout #logo a span{display:inlinr-block;}
#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:15px; right:0;z-index:10;}
#top_layout .utile_wrap ul{height:46px;}
#top_layout .utile_wrap li { float:left;margin-left:17px;}
#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: 23px;/* margin-right:-33px; */width: 30px;height: 30px;position: relative;}
#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;/* border: 1px solid; */}


/*
#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:-430px -34px}
*/


#top_layout .utile_wrap li.box .navbar-toggle-iconn{position:relative;width:30px;height:12px;margin:12px auto 0;cursor:pointer}
#top_layout .utile_wrap li.box .navbar-toggle-icon span{display:block;position:absolute;height:2px;width:100%;background-color: #4a5755;opacity:1;left:0;-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-o-transform:rotate(0deg);-ms-transform:rotate(0deg);transform:rotate(0deg);}
#top_layout .utile_wrap li.box .navbar-toggle-icon span:nth-child(2){display:block;top:0}
#top_layout .utile_wrap li.box .navbar-toggle-icon span:nth-child(3){top:8px;width:54%}
#top_layout .utile_wrap li.box .navbar-toggle-icon span:nth-child(4){top:-8px;width:80%}
#top_layout .utile_wrap li.box .navbar-toggle-icon span{background-color: #4a5755;}



#top_layout .utile_wrap li.pc{display:inline-block}
#top_layout .utile_wrap li.mo{display:none}
#gnb_layout{position:relative;height: 84px;border-bottom: 1px solid rgba(255,255,255,0.1);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: 84px;z-index:2;}
#gnb_layout.action{position:relative;background-color:#fff;}
#gnb_layout .layout{position:relative;padding: 0 124px 0 260px;}
#gnb_layout .depth1_ul{display:inline-block;height:100%;width: 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;height:100%;width: 16.66%;margin:0 -2px;vertical-align:top;}
#gnb_layout .depth1_ul>li>a{display:block;min-width:140px;height:100%;padding:16px 30px;line-height:58px;font-size:20px;color:#121212;font-family:"nsr",sans-serif;font-weight:600;letter-spacing:-1px;transition: all .3s;}
#gnb_layout .depth1_ul>li>a:hover,
#gnb_layout > ul > li.on > a {color: #1F3C86;}
#gnb_layout .depth1_ul > li  .depth2_ul {height:225px; border-left: 1px solid #d8e0e9; margin: 0 -1px 0 0; padding: 22px 0 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 26px;position: relative; font-weight: 700; font-size:16px; line-height: 1.3; 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:#E5EAF5;color:#1F3C86;}
#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.open{height:290px;}
#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: 84px;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: 84px;left: 0;z-index: 1;width: 100%;height: 100%;background: #1F3C86;transition: all .3s;opacity: 1;}

@media screen and (max-width:1199px){
	#gnb_layout .depth1_ul{float:none;text-align:center}
	#gnb_layout .depth1_ul>li>a{padding:6px 20px;font-size:18px;}
	#gnb_layout .layout{padding-left:200px}
}
@media screen and (max-width:1023px){
  #gnb_layout{display:none;}
  #top_layout{z-index:auto;}
  #top_layout .utile_wrap li.pc{display:none}
  #top_layout .utile_wrap li.mo{display:inline-block}

  #top_layout .utile_wrap li.text{display:none;}
}
/* mobile menu */
#mobile-menu{overflow:auto; 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%;}
#mobile-menu .modal-dialog .modal-content .modal-body {padding: 0 0 30px 0;background:#fff;}
#mobile-menu .modal-dialog .modal-content .modal-body .header-site{background:#df3128;}
#mobile-menu .modal-dialog .modal-content .modal-body .header-site ul li{display:inline-block;}
#mobile-menu .modal-dialog .modal-content .modal-body .header-site ul li a{position:relative;display:block;padding: 15px 15px 20px;color:#fff;}
#mobile-menu .modal-dialog .modal-content .modal-body .header-site ul li a:before{display:inline-block;position:absolute;right:0;top: 23px;width:1px;height: 15px;background:#fff;content:'';}
#mobile-menu .modal-dialog .modal-content .modal-body .header-site ul li:last-child a:before{display:none;}
#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 30px; border-top:1px solid #ddd;background-color: #f6f6f6;}
#mobile-menu .modal-dialog .modal-content .modal-body .depth2_ul li a {display:block;padding:2px 0;color:#222;font-size:13px;line-height:1.2;font-weight: bold;}
#mobile-menu .modal-dialog .modal-content .modal-body .depth2_ul li a:before{display:none;}
#mobile-menu .modal-dialog .mobile-close{position: absolute;top: 14px;right: 15px;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: 16px;transform: rotate(45deg);}
#mobile-menu .modal-dialog .mobile-close span:after {bottom: 23px;transform: rotate(-45deg);}