/* layout */
#wrap{position:relative; width:100%; height:0px; min-width:1100px; z-index:1000000000;  transition: 0.5s ease-in-out;}
#header{overflow:hidden;  left:0; background:rgba(0,0,0,0.0);  top:0; z-index:1000; width:100%; height:125px; transition: 0.8s ease-in-out; }
.header .inner{position:relative; width:100%; max-width:100%; height:97px; margin:0 auto;  transition: 0.5s ease-in-out;}
.header .inner:after{display:block; clear:both; content:"";  transition: 0.5s ease-in-out;}
.header h1{overflow:hidden; position:absolute; left:45px; top:5px; width:251px; padding-top:29px;} /* 로고위치조절 */
.header h1 a{overflow:hidden; display:block; height:50px; background:url(/_images/logo.png?ver=13) 0 0 no-repeat; text-indent:-9999px;}
.header .gnb_wrap{ top:0px;  width:880px; margin:0 auto;   } /* 1단계 메뉴 위치 조절 */
.header .gnb{text-align:center;  transition: 0.5s ease-in-out;}
.header .gnb ul{ float:left}
.header .gnb li{float:left;  text-align:center; } /*1단계 메뉴 가로값 */

.header .gnb li.nav1{float:left;  padding:0 0px; background:none; text-align:center; }
.header .gnb li.nav2{float:left;  padding:0 0px;  background:none; text-align:center; }
.header .gnb li.nav3{float:left; padding:0 0px;  background:none; text-align:center; }
.header .gnb li.nav4{float:left;  padding:0 0px;  background:none; text-align:center; }
.header .gnb li.nav5{float:left;  padding:0 0px;  background:none; text-align:center; }
.header .gnb li.nav6{float:left;  padding:0 0px;  background:none; text-align:center; }
.header .gnb li.nav7{float:left;   padding:0 0px; background:none; text-align:center; }

/* depth2 가로길이 */
.header.all .gnb li.nav1{ background:none;   width:170px;  background:url(../_images/menu_line.jpg?ver=2) no-repeat; background-position:0px bottom; height:400px; top:0;  z-index:1;}
.header.all .gnb li.nav2{ background:none;  width:170px;  background:url(../_images/menu_line.jpg) no-repeat; background-position:0px bottom;  height:400px; top:0; z-index:1;}
.header.all .gnb li.nav3{ background:none;  width:170px;  background:url(../_images/menu_line.jpg) no-repeat; background-position:0px bottom; height:400px; top:0; z-index:1;}
.header.all .gnb li.nav4{ background:none;  width:170px;  background:url(../_images/menu_line.jpg) no-repeat; background-position:0px bottom;  height:400px; top:0; z-index:1;}
.header.all .gnb li.nav5{ background:none;  width:250px; background:url(../_images/menu_line.jpg) no-repeat; background-position:0px bottom;  height:400px; top:0; z-index:1;}
.header.all .gnb li.nav6{ background:none;  width:170px;  background:url(../_images/menu_line_last.png?ver=12) no-repeat; background-position:0px bottom;  height:400px;top:0;  z-index:1;}

.header.all .gnb li.nav1:hover{ background:url(../_images/im_bg.jpg?ver=3) no-repeat; background-position:0 12px}
.header.all .gnb li.nav2:hover{ background:url(../_images/im_bg.jpg?ver=2) no-repeat; background-position:0 12px}
.header.all .gnb li.nav3:hover{ background:url(../_images/im_bg.jpg?ver=2) no-repeat; background-position:0 12px}
.header.all .gnb li.nav4:hover{ background:url(../_images/im_bg.jpg?ver=2) no-repeat; background-position:0 12px}
.header.all .gnb li.nav5:hover{ background:url(../_images/im_bg.jpg?ver=2) no-repeat; background-position:0 12px}
.header.all .gnb li.nav6:hover{ background:url(../_images/im_bg.jpg?ver=2) no-repeat; background-position:0 12px}




.header.all .gnb li a.ab_1{z-index:100;}
.header.all .gnb li a.ab_2{z-index:100;}
.header.all .gnb li a.ab_3{z-index:100}
.header.all .gnb li a.ab_4{z-index:100 }
.header.all .gnb li a.ab_5{z-index:100}
.header.all .gnb li a.ab_6{z-index:100}
.header.all .gnb li a.ab_7{z-index:100}

.header.all .gnb li ul.ab_1_1{top:120px;  }
.header.all .gnb li ul.ab_2_1{top:120px;}
.header.all .gnb li ul.ab_3_1{top:120px;}
.header.all .gnb li ul.ab_4_1{top:120px;}
.header.all .gnb li ul.ab_5_1{ top:120px;}
.header.all .gnb li ul.ab_6_1{top:120px;}

.header .gnb a{display:inline-block;   text-decoration:none; line-height:1em; color:#191919;  font-family:'Noto Sans KR','Roboto','Nanum Barun Gothic', sans-serif;   font-size:17px; font-weight:bold;}
.header .gnb:after{display:block; clear:both; content:"";}
.header .gnb .depth1{position:relative; }
.header .gnb .depth1 > a{display:block; transition: 0.5s ease-in-out; height:57px; padding:48px 15px 0;  font-family:'Noto Sans KR','Roboto','Nanum Barun Gothic', sans-serif;   font-size:17px; font-weight:bold;} /* 1단계 메뉴 폰트 조절 */
.header .gnb .depth1 > a:hover,  .header .gnb .depth1.on > a{color:#1e2384; }   /* 1단계 메뉴 호버시 색상조절 */
.header .gnb .depth2{display:none;}
.header .gnb .h3{width:200px}

.header .util_menu{position:absolute; right:38px; top:43px;  list-style:none} /* 로그인 위치조절*/
.header .util_menu a{display:inline-block; font-size:14px; padding-right:13px; font-family:'roboto' sans-serif; font-weight:400;  text-decoration:none; vertical-align:middle; line-height:1em; color:#575757;} /* 로그인 폰트*/
.header .util_menu a:nth-of-type(5){ padding-right:5px;}
.header .util_menu a:nth-of-type(6){ padding-right:5px;}
.header .util_menu a:hover{color:#0e764d; text-decoration:none;}
.header .util_menu a:before{content:''}
.header .util_menu .menu2,.header .util_menu .menu3{position:relative; margin-left:0px;}
.header .util_menu .menu2:before,.header .util_menu .menu3:before{position:absolute;  left:0px; top:59%; width:1px; height:16px; margin-top:-8px; background:#aaa; content:"";}
.header .util_menu .menu4{overflow:hidden; width:46px; height:20px; line-height:20px; margin:3px 0 0 0px;  font-size:12px; text-align:center;}
.header .util_menu .menu5{width:24px; height:20px; text-indent:-9999px;}

/* header */
#header.on{ }
#header.on:before{  bottom:-50px; width:940px; margin:0 auto; height:50px; background:#6b9ecc; content:"";}
.header.on h1 a{ }
.header.on .gnb .depth1 > a{color:#333;}
.header.on .gnb .depth1 > a:hover{color:#485aad;}  /* 1단계 메뉴 호버시 색상조절 */
.header.on .util_menu a{color:#666;}
.header.on .util_menu .menu2:before{background:#666;}
.header.on .util_menu .menu3{background-position:0 -50px;}
.header.on .util_menu .menu4{}

/* header_hover */
#header.all{height:330px; transition: 0.5s ease-in-out; background:url(../_images/sub_menu_bgm.jpg?ver=16) no-repeat; background-position:0 0px;  z-index:1100;} /*2단계 높이값 */
#header.all:before{ margin:0 auto; top:107px; width:940px; content:"";} /* hover시 1단계 높이값 top으로 조절 */
.header.all h1 a{ background:url(../_images/logo.png?ver=10) no-repeat; background-size:150px}
.header.all .util_menu a{color:#afafaf;   font-size:14px; padding-right:14px; font-family:'roboto' sans-serif; font-weight:300; }
.header.all .util_menu a:nth-of-type(5){ padding-right:5px;}
.header.all .util_menu a:nth-of-type(6){ padding-right:5px;}
.header.all .util_menu a:hover{color:#000;}
.header.all .util_menu .menu2:before,.header.all .util_menu .menu3:before{background:#666;}
.header.all .util_menu .menu4{}
.header.all .util_menu .menu5{background-position:-100px -50px;}
.header.all .gnb_wrap{ width:1100px; margin:0 auto;  }
.header.all .gnb_wrap .gnb{ width:1100px; margin:0 auto; text-align:center;}
.header.all .gnb_wrap .gnb a{color:#666;}
.header.all .gnb_wrap .gnb a:hover, .header.all .gnb_wrap .gnb a:focus{color:#000; transition:all .4s ease-in-out;} /*2단계 메뉴 호버시  폰트 조절 */
.header.all .gnb_wrap .depth1{overflow:hidden; }
.header.all .gnb_wrap .gnb a:hover{}
.header.all .gnb_wrap .depth1 > a{margin-bottom:10px; color:#000; transition:all .4s ease-in-out;}  /*1단계 호버시 폰트컬러, 2단계와 1단계 사이 height 값*/
.header.all .gnb_wrap .depth1 > a:hover,.header.all .gnb_wrap .depth1 > a:focus{color:#2772d8; }
.header.all .gnb_wrap .depth1.menu1{margin-left:0;}
.header.all .gnb_wrap .depth2{display:block; }
.header.all .gnb_wrap .depth2 li a:hover .gnb_wrap .depth1 a{color:#1e2384;  font-size:30px}
.header.all .gnb_wrap .depth2 > li{display:block;  width:100%; padding:0px 0%;  text-align:center;} /*2단계 메뉴 속성 */
.header.all .gnb_wrap .depth2 > li > a{ width:94%; padding:10px 0;  text-align:center; font-family:'Noto Sans KR','Roboto','Nanum Barun Gothic', sans-serif; font-size:14px; font-weight:400;   color:#333;} /*2단계 메뉴 폰트 조절*/

.header.all .gnb_wrap .depth2 > li > a:hover{ width:100%; padding:10px 0; text-decoration:underline; font-weight:600;color:#0062cd}
.header.all .gnb_wrap .depth2 > li:first-child{padding-top:0px;} /* 2단계 메뉴 높이 위치 설정 */

.header.all .gnb_wrap .depth3{}
.header.all .gnb_wrap .depth3 > li{display:block;  width:100%; margin-bottom:17px; font-size:13px; line-height:7px; color:#666;}
.header.all .gnb_wrap .depth3 > li a{display:inline-block; font-size:13px;  font-family:'Nanum Barun Gothic', sans-serif; line-height:7px; font-weight:300;}


#header.fixed{position:fixed;top:0; background:#fff; box-shadow:1px 2px 20px rgba(0,0,0,.07); border-bottom:0px;  left:0;width:100%; height:107px; z-index:100;-webkit-transition:all .8s ease-in-out;-moz-transition:all .8s ease-in-out;-o-transition:all .8s ease-in-out;transition:all .4s ease-in-out;min-width:1100px}
#header.fixed.all{height:335px;  transition: 0.8s ease-in-out; background:url(../_images/sub_menu_bgm.jpg) no-repeat; background-position:0 0px;   z-index:1100;} /* 2단계 스크롤시 높이값 .all앞에 공백없애야 적용됨 */
#header.fixed.all:before{position:absolute; left:0; top:0px; width:100%; height:107px; content:"";} /* hover시 1단계 높이값 top으로 조절 */
.header.fixed .gnb .depth1 > a{color:#212121; }
.header.fixed  h1{overflow:hidden; position:absolute; left:45px; top:0px; width:251px; padding-top:5px; padding-left:0px;} /* 로고위치조절 */
.header.fixed  h1 a{overflow:hidden; display:block; height:68px; background:url(/_images/logo.png?ver=10) 0 100% no-repeat;  text-indent:-9999px;}
.header.fixed .util_menu{position:absolute; right:40px; top:45px;    } /* 로그인 위치조절*/
.header.fixed .util_menu a{display:inline-block;  font-size:14px; padding-right:13px;  font-family:'roboto' sans-serif; font-weight:300;  text-decoration:none; vertical-align:middle; line-height:1em; color:#b5b5b5;}
.header.fixed .util_menu a:nth-of-type(5){ padding-right:5px;}
.header.fixed .util_menu a:nth-of-type(6){ padding-right:5px;}
.header.fixed .on{ }
.header.fixed .on:before{position:absolute; left:0; bottom:-50px; width:100%; height:50px; background:#6b9ecc; content:"";}
.header.fixed .gnb_wrap{ margin:0 auto; top:0px; width:880px;} /* 1단계 메뉴 위치 조절 */
.header.fixed .gnb_wrap .depth2 > li{display:block; width:100%; } /*2단계 메뉴 속성 */
.header.fixed .gnb_wrap .depth2 > li > a{ font-family:'Noto Sans KR','Roboto','Nanum Barun Gothic', sans-serif; font-size:14px; font-weight:300;   line-height:16px;  color:#333;} /*2단계 메뉴 폰트 조절*/
.header.fixed .gnb_wrap .depth2 > li:first-child{padding-top:0px; } /* 2단계 메뉴 높이 위치 설정 */
.header.fixed.all .gnb_wrap{width:1100px; margin:0 auto}
.header.fixed.all h1 a{ background:url(../_images/logo.png?ver=10) no-repeat; background-size:150px; margin-top:30px}



@media (min-width:620px) and (max-width:1399px)
{
	
.header h1{overflow: hidden;
        position: absolute;
        left: 30px;
        top: 16px;
 background-size:120px 22px;
        padding-top: 29px;} /* 로고위치조절 */
.header h1 a{overflow:hidden; display:block; height:45px; background:url(/_images/logo.png?ver=11) 0 0 no-repeat;  background-size:120px 22px; text-indent:-9999px;}

.header.all h1{overflow: hidden;
        position: absolute;
        left: 30px;
        top: 16px;
        padding-top: 29px;	
		width:120px;
		height:45px;
		}
.header.all h1 a{overflow:hidden; display:block; height:45px; background:url(/_images/logo.png?ver=12) 0 0 no-repeat; background-size:120px 22px; text-indent:-9999px;}
.header.fixed.all h1{overflow: hidden;
        position: absolute;
        left: 30px;
        top: 0px;
        padding-top: 15px;	
		width:120px;
		height:65px;}
.header.fixed h1 a{overflow:hidden; display:block; height:45px; background:url(/_images/logo.png?ver=12) 0 0 no-repeat; background-size:120px 22px; text-indent:-9999px;}
.header.fixed h1{overflow: hidden;
        position: absolute;
        left: 30px;
        top: 16px;
        padding-top: 29px;	
		width:120px;
		height:45px;	}

		 /* 로고위치조절 */
.header.fixed.all h1 a{overflow:hidden; display:block; height:45px; background:url(/_images/logo.png?ver=11) 0 0 no-repeat;  background-size:120px 22px; text-indent:-9999px;
		}


.header.all .gnb li.nav1{ background:none;   width:160px;  background:url(../_images/menu_line.jpg?ver=2) no-repeat; background-position:0px bottom; height:400px; top:0;  z-index:1;}
.header.all .gnb li.nav2{ background:none;  width:120px;  background:url(../_images/menu_line.jpg) no-repeat; background-position:0px bottom;  height:400px; top:0; z-index:1;}
.header.all .gnb li.nav3{ background:none;  width:115px;  background:url(../_images/menu_line.jpg) no-repeat; background-position:0px bottom; height:400px; top:0; z-index:1;}
.header.all .gnb li.nav4{ background:none;  width:115px;  background:url(../_images/menu_line.jpg) no-repeat; background-position:0px bottom;  height:400px; top:0; z-index:1;}
.header.all .gnb li.nav5{ background:none;  width:218px; background:url(../_images/menu_line.jpg) no-repeat; background-position:0px bottom;  height:400px; top:0; z-index:1;}
.header.all .gnb li.nav6{ background:none;  width:139px;  background:url(../_images/menu_line_last2.png?ver=20) no-repeat; background-position:0px bottom;  height:400px;top:0;  z-index:1;}

.header .gnb_wrap{position:absolute;  top:0px; width:820px; left: 50%; transform: translateX(-50%);  margin-left:auto; } 
.header.fixed .gnb_wrap{position:absolute;  top:0px;  width:820px; left: 50%; transform: translateX(-50%); margin-left:auto;} 
.header.all .gnb_wrap{ width:860px; left: 50%; transform: translateX(-50%);}
.header.fixed.all .gnb_wrap{ width:860px; left: 50%; transform: translateX(-50%);}

.header .util_menu{position:absolute; right:28px; top:43px;  list-style:none} /* 로그인 위치조절*/
.header .util_menu a{display:inline-block; font-size:11px; padding-right:6px; font-family:'roboto' sans-serif; font-weight:400;  text-decoration:none; vertical-align:middle; line-height:1em; color:#575757;} /* 로그인 폰트*/

.header.all .util_menu{position:absolute; right:28px; top:43px;  list-style:none}
.header.fixed .util_menu{position:absolute; right:28px; top:43px;  list-style:none} /* 로그인 위치조절*/
.header.fixed .util_menu a{display:inline-block; font-size:11px; padding-right:6px; font-family:'roboto' sans-serif; font-weight:400;  text-decoration:none; vertical-align:middle; line-height:1em; color:#575757;} /* 로그인 폰트*/

.header.all .util_menu{position:absolute; right:38px; top:43px;  list-style:none} /* 로그인 위치조절*/
.header.all .util_menu a{display:inline-block; font-size:11px; padding-right:6px; font-family:'roboto' sans-serif; font-weight:400;  text-decoration:none; vertical-align:middle; line-height:1em; color:#575757;} /* 로그인 폰트*/


.header .gnb .depth1{position:relative; }
.header .gnb .depth1 > a{display:block; transition: 0.5s ease-in-out; height:57px; padding:48px 15px 0;  font-family:'Noto Sans KR','Roboto','Nanum Barun Gothic', sans-serif;   font-size:15px; font-weight:bold;} /* 1단계 메뉴 폰트 조절 */
.header.all .gnb_wrap .depth2 > li > a{ font-family:'Noto Sans KR','Roboto','Nanum Barun Gothic', sans-serif; padding:7px 0; font-size:13px; font-weight:300;   line-height:20px;  color:#333;} 
.header.fixed .gnb_wrap .depth2 > li > a{ font-family:'Noto Sans KR','Roboto','Nanum Barun Gothic', sans-serif; padding:7px 0; font-size:13px; font-weight:300;   line-height:20px;  color:#333;} /*2단계 메뉴 폰트 조절*/
.header.all .gnb_wrap .depth2 > li > a:hover{ padding:7px 0;}
#header.all{height:350px; transition: 0.5s ease-in-out; background:url(../_images/sub_menu_bgm.jpg?ver=16) no-repeat; background-position:0 0px;  z-index:1100;} 
#header.fixed.all{height:350px; transition: 0.5s ease-in-out; background:url(../_images/sub_menu_bgm.jpg?ver=16) no-repeat; background-position:0 0px;  z-index:1100;} 


}



@media (min-width:1400px) and (max-width:1500px){
.header h1{overflow: hidden;
        position: absolute;
        left: 30px;
        top: 16px;
 background-size:120px 22px;
        padding-top: 29px;} /* 로고위치조절 */
.header h1 a{overflow:hidden; display:block; height:45px; background:url(/_images/logo.png?ver=11) 0 0 no-repeat;  background-size:120px 22px; text-indent:-9999px;}

.header.all h1{overflow: hidden;
        position: absolute;
        left: 30px;
        top: 16px;
        padding-top: 29px;	
		width:120px;
		height:45px;
		}
.header.all h1 a{overflow:hidden; display:block; height:45px; background:url(/_images/logo.png?ver=12) 0 0 no-repeat; background-size:120px 22px; text-indent:-9999px;}
.header.fixed.all h1{overflow: hidden;
        position: absolute;
        left: 30px;
        top: 0px;
        padding-top: 15px;	
		width:120px;
		height:65px;}
.header.fixed h1 a{overflow:hidden; display:block; height:45px; background:url(/_images/logo.png?ver=12) 0 0 no-repeat; background-size:120px 22px; text-indent:-9999px;}
.header.fixed h1{overflow: hidden;
        position: absolute;
        left: 30px;
        top: 16px;
        padding-top: 29px;	
		width:120px;
		height:45px;	}

		 /* 로고위치조절 */
.header.fixed.all h1 a{overflow:hidden; display:block; height:45px; background:url(/_images/logo.png?ver=11) 0 0 no-repeat;  background-size:120px 22px; text-indent:-9999px;
		}



.header .util_menu{position:absolute; right:38px; top:44px;  list-style:none} /* 로그인 위치조절*/
.header .gnb_wrap{position:absolute;  top:0px; width:880px; left: 50%; transform: translateX(-50%);  margin-left:auto; } 
.header.fixed .gnb_wrap{position:absolute;  top:0px;  width:880px; left: 50%; transform: translateX(-50%); margin-left:auto;} 
.header.fixed .util_menu{position:absolute; right:40px; top:6px;    } /* 로그인 위치조절*/
.header.fixed .util_menu a{color:#575757}




.header.all .gnb li.nav1{ background:none;   width:170px;  background:url(../_images/menu_line.jpg?ver=2) no-repeat; background-position:0px bottom; height:400px; top:0;  z-index:1;}
.header.all .gnb li.nav2{ background:none;  width:170px;  background:url(../_images/menu_line.jpg) no-repeat; background-position:0px bottom;  height:400px; top:0; z-index:1;}
.header.all .gnb li.nav3{ background:none;  width:170px;  background:url(../_images/menu_line.jpg) no-repeat; background-position:0px bottom; height:400px; top:0; z-index:1;}
.header.all .gnb li.nav4{ background:none;  width:170px;  background:url(../_images/menu_line.jpg) no-repeat; background-position:0px bottom;  height:400px; top:0; z-index:1;}
.header.all .gnb li.nav5{ background:none;  width:250px; background:url(../_images/menu_line.jpg) no-repeat; background-position:0px bottom;  height:400px; top:0; z-index:1;}
.header.all .gnb li.nav6{ background:none;  width:170px;  background:url(../_images/menu_line_last.png?ver=12) no-repeat; background-position:0px bottom;  height:400px;top:0;  z-index:1;}

.header.all .gnb_wrap{ width:1100px; left: 50%; transform: translateX(-50%);}
.header.fixed.all .gnb_wrap{ width:1100px; left: 50%; transform: translateX(-50%);}

.header .util_menu{position:absolute; right:38px; top:43px;  list-style:none} /* 로그인 위치조절*/
.header .util_menu a{display:inline-block; font-size:11px; padding-right:6px; font-family:'roboto' sans-serif; font-weight:400;  text-decoration:none; vertical-align:middle; line-height:1em; color:#575757;} /* 로그인 폰트*/


.header.fixed .util_menu{position:absolute; right:38px; top:43px;  list-style:none} /* 로그인 위치조절*/
.header.fixed .util_menu a{display:inline-block; font-size:11px; padding-right:6px; font-family:'roboto' sans-serif; font-weight:400;  text-decoration:none; vertical-align:middle; line-height:1em; color:#575757;} /* 로그인 폰트*/

.header.all .util_menu{position:absolute; right:38px; top:43px;  list-style:none} /* 로그인 위치조절*/
.header.all .util_menu a{display:inline-block; font-size:11px; padding-right:6px; font-family:'roboto' sans-serif; font-weight:400;  text-decoration:none; vertical-align:middle; line-height:1em; color:#575757;} /* 로그인 폰트*/




}







.portfolio{ width:170px; background:#330099; text-align:center; transition: color 0.25s ease-in-out;}
.portfolio::before{ content: '';  display:block;   position: absolute;  left:50%;  top:35px;width:0; height: 0; border-radius: 999px; background:#fff; transition: .5s ease; }
/* 서브메뉴 호버시*/
.portfolio:hover::before{   position: absolute; left:50%; top:35px; width: .4rem; height: .4rem; border-radius: 999px; background:#1e2384; }
.portfolio:hover{ opacity:1;pointer-events:auto; touch-action:auto;  position: absolute; left:0px;}

.portfolio:hover .gnb_wrap .depth1 a{color:#1e2384; font-size:30px}

#header.fixed .portfolio .box{ background:#FFFFFF; top:70px }
#header.fixed .portfolio:hover .box .b1 a.btn_color{color:#000;}
#header.fixed .portfolio:hover .box .b1 a.btn_color:hover{color:#1e2384}
/* 서브메뉴 액션*/
#header.fixed .portfolio .box::before{ content: '';  display:block;  position: absolute; left:22.5px;  height:1px; top:0; width:1px; height:1px; background:#000; transition: .5s ease; }
/* 서브메뉴 호버시*/
#header.fixed .portfolio:hover .box::before{width:50px;}



.portfolio2{ transition: color 0.25s ease-in-out;}
.portfolio2::before{ content: '';  display:block;  position: absolute;  left:50%;  top:35px; width:0; height: 0; border-radius: 999px; background:#fff; transition: .5s ease; }
/* 서브메뉴 호버시*/
.portfolio2:hover::before{  position: absolute; left:50%; top:35px; width: .4rem; height: .4rem; border-radius: 999px; background:#1e2384; }
.portfolio2:hover{ opacity:1; pointer-events:auto; touch-action:auto;  position: absolute; left:0px;}
.portfolio2:hover .b1 a.btn_color{color:#000; font-size:16px; transition: color 0.1s ease-in-out;-webkit-transition: color 0.1s ease-in-out;}
.portfolio2:hover .b1 a.btn_color:hover{color:#3390cf}

#header.fixed .portfolio2 .box{ background:#FFFFFF; top:70px }
#header.fixed .portfolio2:hover .box .b1 a.btn_color{color:#000;}
#header.fixed .portfolio2:hover .box .b1 a.btn_color:hover{color:#3390cf}
/* 서브메뉴 액션*/
#header.fixed .portfolio2 .box::before{ content: '';  display:block;  position: absolute; left:22.5px;  height:1px; top:0; width:1px; height:1px; background:#000; transition: .5s ease; }
/* 서브메뉴 호버시*/
#header.fixed .portfolio2:hover .box::before{width:50px;}


.portfolio3{ transition: color 0.25s ease-in-out;}
.portfolio3::before{ content: '';  display:block;  position: absolute;   left:50%;  top:35px; width:0; height: 0; border-radius: 999px; background:#fff; transition: .5s ease; }
/* 서브메뉴 호버시*/
.portfolio3:hover::before{ position: absolute; left:50%; top:35px; width: .4rem; height: .4rem; border-radius: 999px; background:#1e2384; }
.portfolio3:hover{ opacity:1; width:150px;  pointer-events:auto; touch-action:auto;  position: absolute; left:0px;}
.portfolio3:hover .b1 a.btn_color{color:#000; font-size:16px; transition: color 0.1s ease-in-out;-webkit-transition: color 0.1s ease-in-out;}
.portfolio3:hover .b1 a.btn_color:hover{color:#3390cf}

#header.fixed .portfolio3 .box{ background:#FFFFFF; top:70px }
#header.fixed .portfolio3:hover .box .b1 a.btn_color{color:#000;}
#header.fixed .portfolio3:hover .box .b1 a.btn_color:hover{color:#3390cf}
/* 서브메뉴 액션*/
#header.fixed .portfolio3 .box::before{ content: '';  display:block;  position: absolute; left:22.5px;  height:1px; top:0; width:1px; height:1px; background:#000; transition: .5s ease; }
/* 서브메뉴 호버시*/
#header.fixed .portfolio3:hover .box::before{width:50px;}



.portfolio4{ transition: color 0.25s ease-in-out;}
.portfolio4::before{ content: '';  display:block;  position: absolute;   left:50%;  top:35px; width:0; height: 0; border-radius: 999px; background:#fff; transition: .5s ease; }
/* 서브메뉴 호버시*/
.portfolio4:hover::before{ position: absolute; left:50%; top:35px; width: .4rem; height: .4rem; border-radius: 999px; background:#1e2384; }
.portfolio4:hover{ opacity:1; width:150px;  pointer-events:auto; touch-action:auto;  position: absolute; left:0px;}
.portfolio4:hover .b1 a.btn_color{color:#000; font-size:16px; transition: color 0.1s ease-in-out;-webkit-transition: color 0.1s ease-in-out;}
.portfolio4:hover .b1 a.btn_color:hover{color:#3390cf}

#header.fixed .portfolio4 .box{ background:#FFFFFF; top:70px }
#header.fixed .portfolio4:hover .box .b1 a.btn_color{color:#000;}
#header.fixed .portfolio4:hover .box .b1 a.btn_color:hover{color:#3390cf}
/* 서브메뉴 액션*/
#header.fixed .portfolio4 .box::before{ content: '';  display:block;  position: absolute; left:22.5px;  height:1px; top:0; width:1px; height:1px; background:#000; transition: .5s ease; }
/* 서브메뉴 호버시*/
#header.fixed .portfolio4:hover .box::before{width:50px;}


.portfolio5{  transition: color 0.25s ease-in-out;}
.portfolio5::before{ content: '';  display:block;  position: absolute;  left:50%;  top:35px; width:0; height: 0; border-radius: 999px; background:#fff; transition: .5s ease; }
/* 서브메뉴 호버시*/
.portfolio5:hover::before{ position: absolute; left:50%; top:35px; width: .4rem; height: .4rem; border-radius: 999px; background:#1e2384;  }
.portfolio5:hover{ opacity:1; pointer-events:auto; touch-action:auto;  position: absolute; left:0px;}
.portfolio5:hover .b1 a.btn_color{color:#000; font-size:16px; transition: color 0.1s ease-in-out;-webkit-transition: color 0.1s ease-in-out;}
.portfolio5:hover .b1 a.btn_color:hover{color:#3390cf}

#header.fixed .portfolio5 .box{ background:#FFFFFF; top:70px }
#header.fixed .portfolio5:hover .box .b1 a.btn_color{color:#000;}
#header.fixed .portfolio5:hover .box .b1 a.btn_color:hover{color:#3390cf}
/* 서브메뉴 액션*/
#header.fixed .portfolio5 .box::before{ content: '';  display:block;  position: absolute; left:22.5px;  height:1px; top:0; width:1px; height:1px; background:#000; transition: .5s ease; }
/* 서브메뉴 호버시*/
#header.fixed .portfolio5:hover .box::before{width:50px;}



.portfolio6{ transition: color 0.25s ease-in-out;}
.portfolio6::before{ content: '';  display:block;  position: absolute;   left:50%;  top:35px; width:0; height: 0; border-radius: 999px; background:#fff; transition: .5s ease; }
/* 서브메뉴 호버시*/
.portfolio6:hover::before{ position: absolute; left:50%; top:35px; width: .4rem; height: .4rem; border-radius: 999px; background:#1e2384; }
.portfolio6:hover{ opacity:1; pointer-events:auto; touch-action:auto;  position: absolute; left:0px;}
.portfolio6:hover .b1 a.btn_color{color:#000; font-size:16px; transition: color 0.1s ease-in-out;-webkit-transition: color 0.1s ease-in-out;}
.portfolio6:hover .b1 a.btn_color:hover{color:#3390cf}

#header.fixed .portfolio6 .box{ background:#FFFFFF; top:70px }
#header.fixed .portfolio6:hover .box .b1 a.btn_color{color:#000;}
#header.fixed .portfolio6:hover .box .b1 a.btn_color:hover{color:#3390cf}
/* 서브메뉴 액션*/
#header.fixed .portfolio6 .box::before{ content: '';  display:block;  position: absolute; left:22.5px;  height:1px; top:0; width:1px; height:1px; background:#000; transition: .5s ease; }
/* 서브메뉴 호버시*/
#header.fixed .portfolio6:hover .box::before{width:50px;}