@charset 'utf-8';

/* navigation first */
.gnb { float:left; position:relative; padding:0; *z-index:1000;/*ie7*/ }

.gnb-item { float:left; position:relative; display:block; background:url(line2_wall.gif) no-repeat 0 18px; }
.gnb-item:first-child { background:none; }
.gnb-item .gnb-link { 
	height:45px; position:relative; display:block;  
}
.gnb-item .gnb-link span { 
	padding:16px 30px 14px; display:block;
	font-size:15px; color: #e5ddd2; white-space: nowrap; font-weight:600; line-height:14px; border-top:0px solid #F6F3ED;
    -webkit-transition: all 0.2s ease-out;  /* Chrome 1-25, Safari 3.2+ */
	   -moz-transition: all 0.2s ease-out;  /* Firefox 4-15 */
	        -o-transition: all 0.2s ease-out;  /* Opera 10.50–12.00 */
		         transition: all 0.2s ease-out;  /* Chrome 26, Firefox 16+, IE 10+, Opera 12.10+ */
}

.gnb-item:hover .gnb-link.ex-list { 
	color: #594b48; background:#e5ddd2;
	-webkit-border-radius:2px 2px 0 0; border-radius:2px 2px 0 0; 
}
.gnb-item:hover .gnb-link span { 
	color: #594b48; background:#e5ddd2;
	text-decoration: none;
	-webkit-border-radius:2px 2px 2px 2px; border-radius:2px 2px 2px 2px; 
}
.gnb-item a.on span { color:#8DC63F; }

/* navigation second */
.sub-wrap {
	position: absolute; top: 45px; min-width:188px; z-index:1001;
	overflow: hidden; padding:0; 
	-webkit-box-shadow:3px 3px 3px 0 rgba(35,35,35,0.1); box-shadow:3px 3px 3px 0 rgba(35,35,35,0.1); 
	-webkit-border-radius:0 2px 2px 2px; border-radius:0 2px 2px 2px; 
}
.sub-wrap { padding:0 0 8px; background:#e5ddd2 /* url(header_bg.gif) repeat */; }

.sub-item { position:relative; }
.sub-item a {
	position:relative; display:block;
	padding:6px 15px; height:20px; *width:148px; line-height:20px; line-height:17px\9;
	font-size:13px; font-weight:400; color:#594b48; 
	border-bottom:0px solid #c9bdbb; border-top:1px dotted #f3ede6;
    -webkit-transition: all 0.2s ease-out;  /* Chrome 1-25, Safari 3.2+ */
	   -moz-transition: all 0.2s ease-out;  /* Firefox 4-15 */
	        -o-transition: all 0.2s ease-out;  /* Opera 10.50–12.00 */
		         transition: all 0.2s ease-out;  /* Chrome 26, Firefox 16+, IE 10+, Opera 12.10+ */
}
.sub-wrap .sub-item { padding:0 8px; }
.sub-wrap .sub-item:first-child { padding:8px 8px 0; }
.sub-wrap .sub-item:first-child a { border-top:none; }
.sub-wrap .sub-item:last-child a { border-bottom:none; }
.gnb-item:hover .sub-wrap { left:0; }

.sub-item a:hover {
	border-style:solid;
	color: #fff;
	background-color: #6c9351;
	background-image: linear-gradient(top bottom,rgba(255,255,255,0.12) 0,rgba(255,255,255,0) 43%,rgba(255,255,255,0) 100%);
	background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0%,rgba(255,255,255,0.12)),color-stop(43%,rgba(255,255,255,0)),color-stop(100%,rgba(255,255,255,0)));
	background-image: -o-linear-gradient(top,rgba(255,255,255,0.12) 0,rgba(255,255,255,0) 43%,rgba(255,255,255,0) 100%);
	background-image: -ms-linear-gradient(top,rgba(255,255,255,0.12) 0,rgba(255,255,255,0) 43%,rgba(255,255,255,0) 100%);
	background-image: -moz-linear-gradient(top,rgba(255,255,255,0.12) 0,rgba(255,255,255,0) 43%,rgba(255,255,255,0) 100%);
	background-image: -webkit-linear-gradient(top,rgba(255,255,255,0.12) 0,rgba(255,255,255,0) 43%,rgba(255,255,255,0) 100%);
}

.sub-item:hover::before,
.sub-item:hover::after  {
	display: block;
	width: 1px; height:28px;
	background: #4495ff;
	position: absolute;
	top: 0; left:-1px;
	content: ""; z-index:2002;
}
.sub-item:hover::after { left:auto; right:-1px}

.gnb .yuki1, .gnb .yuki2, .gnb .yuki3, .gnb .yuki4, .gnb .yuki5, .gnb .yuki6, .gnb .yuki7, .account .sub-wrap,
.gnb .yuki8, .gnb .yuki9, .gnb .yuki10, .gnb .yuki11, .gnb .yuki12, .gnb .yuki13, .gnb .yuki14 {
	left:-999em;
}