@charset "utf-8";

/* ----------------------------------------------------------
 Frameworks
-----------------------------------------------------------*/

/* Category Title */
.techinfo    #contents:before { background: transparent url("/techinfo/weldqa/images/categoryTitle.jpg") no-repeat center bottom; }
#topics      #contents:before { background: transparent url("/techinfo/images/categoryTitle.jpg")  no-repeat center bottom; }
.categoryTop #contents:before { background: transparent url("/techinfo/images/categoryTitle.jpg")  no-repeat center center; }

.techinfo #contents h2 { color: #000; }
#topics      #contents h2 ,
.categoryTop #contents h2 { color: #fff; }
.techinfo #contents h2 a { color: #999; }


/* LocalNav */
.techinfo header #globalNav ul li a[href*="techinfo"] { background: #fff; }


/*---------- techinfoNav ----------*/

#techinfoNav {
	margin-top: 30px !important;
	}
	#techinfoNav ul {
		margin: 0;
		}
		#techinfoNav ul li {
			float: left;
			width: 595px;
			margin: 0 0 0 10px;
			}
			#techinfoNav ul li:nth-of-type(1) { margin-left: 0; }
			
			#techinfoNav ul li a {
				height: 220px;
				padding: 25px;
				display: -webkit-flex;
				display: flex;
				-webkit-align-items: center;
				align-items: center;
				font-size: 1.5rem;
				white-space: nowrap;
				transition: all ease-out .3s;
				}
				#techinfoNav ul li#tnAbout  a { color: #fff; background: transparent url("/techinfo/images/bnrAbout.jpg")  no-repeat; }
				#techinfoNav ul li#tnTopics a { color: #fff; background: transparent url("/techinfo/images/bnrTopics.jpg") no-repeat; }
				#techinfoNav ul li#tnFaq    a { color: #333; background: transparent url("/techinfo/images/bnrFaq.jpg")    no-repeat; }
				
				#techinfoNav ul li a:hover { box-shadow: inset 0 0 0 8px rgba(255,255,255,0.5); }



/* ----------------------------------------------------------
 Techinfo > index.html
-----------------------------------------------------------*/

/*---------- topicsSec ----------*/

#topicsSec {
	position: relative;
	}
	#topicsSec h3 {
		font-size: 1.75rem;
		line-height: 2.5rem;
		}

	#topicsSec dl {
		}
		#topicsSec dl dt {
			float: left;
			padding: 10px 2px;
			}
		#topicsSec dl dd {
			padding: 10px 0 10px 6rem;
			background: linear-gradient(to right, #333 25%, rgba(255,255,255,0) 0%) repeat-x left bottom;
			background-size: 4px 1px;
			}

	#topicsSec > p {
		position: absolute;
		right: 0; top: 0;
		margin: 0;
		}
		#topicsSec > p a {
			width: 50px; height: 50px;
			display: block;
			font-size: 14px;
			line-height: 50px;
			color: #ffffff;
			text-align: center;
			background: rgba(0,51,153,1);
			transition: all ease-out .2s;
			}
			#topicsSec > p a:hover { opacity: .7; }


/*---------- topicsSec ----------*/

#pagenationNav {
	}
	#pagenationNav ul {
		margin: 0;
		display: -webkit-flex;
		display: flex;
		-webkit-flex-wrap: wrap;
		flex-wrap: wrap;
		-webkit-align-items: center;
		align-items: center;
		-webkit-justify-content: center;
		justify-content: center;
		}
		#pagenationNav ul li {
			}
			#pagenationNav ul li a {
				width: 45px; height: 45px;
				margin: 0 1px;
				display: -webkit-flex;
				display: flex;
				-webkit-align-items: center;
				align-items: center;
				-webkit-justify-content: center;
				justify-content: center;
				white-space: nowrap;
				box-shadow: inset 0 0 0 1px rgba(0,0,0,0.1);
				border-radius: 5px;
				}
				#pagenationNav ul li.current a {
					color: #fff;
					background: #3668a6;
					box-shadow: none;
					}







/* ----------------------------------------------------------
 Techinfo > weldqa > index.html
-----------------------------------------------------------*/

/*---------- categorySec ----------*/

#categorySec {
	}
	#categorySec #categoryNav {
		}
		#categorySec #categoryNav ul {
			margin: 0 0 25px; padding: 0 0 25px;
			border-bottom: 1px dotted #ccc;
			}
			#categorySec #categoryNav ul li {
				float: left;
				width: 595px;
				margin: 0 0 0 10px;
				}
				#categorySec #categoryNav ul li:nth-of-type(1) { margin-left: 0; }
				
				#categorySec #categoryNav ul li a {
					position: relative;
					padding: 35px;
					display: block;
					font-size: 1.5rem;
					color: #fff;
					text-align: center;
					background: #0666a8;
					box-shadow: inset 0 0 0 1px rgba(255,255,255,0.2);
					border: 5px solid transparent;
					transition: all ease-out .3s;
					}
					#categorySec #categoryNav ul li:nth-of-type(2) a { background: #2c9e64; }
					
					#categorySec #categoryNav ul li a:hover { box-shadow: inset 0 0 0 2px rgba(255,255,255,0.3); }
					
					#categorySec #categoryNav ul li a:after {
						position: absolute;
						right: 15px; top: 50%;
						width: 12px; height: 12px;
						content: "";
						display: block;
						visibility: visible;
						border-top:   2px solid #fff;
						border-right: 2px solid #fff;
						transform: translateY(-50%) rotate(45deg);
						transition: all ease-out .3s;
						}
						#categorySec #categoryNav ul li a:hover:after { right: 10px; }

		#categorySec #categoryNav dl {
			float: left;
			width: 232px;
			margin: 0 0 0 10px;
			}
			#categorySec #categoryNav dl:nth-of-type(1) { margin-left: 0; }
			
			#categorySec #categoryNav dl dt {
				margin: 0 0 10px;
				}
				#categorySec #categoryNav dl dt a {
					position: relative;
					padding: 5px 10px;
					display: block;
					font-size: 1.125rem;
					font-weight: bold;
					text-align: center;
					background: #eee;
					transition: all ease-out .3s;
					}

			#categorySec #categoryNav dl dd {
				}
				#categorySec #categoryNav dl dd a {
					position: relative;
					display: inline-block;
					padding: 0 0 0 18px;
					}
					#categorySec #categoryNav dl dd a:after {
						position: absolute;
						left: 0; top: 0.9rem;
						width: 6px; height: 6px;
						content: "";
						display: block;
						visibility: visible;
						border-top:   2px solid #0666a8;
						border-right: 2px solid #0666a8;
						transform: translateY(-50%) rotate(45deg);
						}


/*---------- listSec ----------*/

#listSec {
	}
	#listSec ul {
		}
		#listSec ul li {
			position: relative;
			padding: 10px 10px 10px 5rem;
			font-size: 0.875rem;
			color: #999;
			background-position: left 1.3rem;
			border-bottom: 1px dotted #ddd;
			}
			#listSec ul li:before {
				width: 3rem;
				margin: 0 1.5rem 0 -4.5rem;
				display: inline-block;
				content: attr(data-number);
				color: #fff;
				text-align: center;
				border-radius: 3px;
				}
				#listSec ul li.icoFolum:before { background: #0666a8; }
				#listSec ul li.icoQa:before    { background: #2c9e64; }
			
			
			#listSec ul li a {
				margin: 0 15px 0 0;
				font-size: 1rem;
				color: #333;
				}
				#listSec ul li a:hover { text-decoration: underline; }



/* ----------------------------------------------------------
 Techinfo > weldqa > detail.html
-----------------------------------------------------------*/

/*---------- categorySec ----------*/

#categorySec h3 {
	position: relative;
	}
	#categorySec h3 span {
		position: absolute;
		left: 0; top: -1.6rem;
		margin: 0; padding: 0.05rem 0.5rem;
		display: inline-block;
		content: attr(data-number);
		font-size: 0.875rem;
		font-weight: 400;
		color: #fff;
		line-height: 1.5rem;
		text-align: center;
		border-radius: 3px;
		}
		#categorySec h3 span.icoFolum { background: #0666a8; }
		#categorySec h3 span.icoQa    { background: #2c9e64; }



/* ----------------------------------------------------------
 Techinfo > weldqa > index.html
-----------------------------------------------------------*/

#weldqa.categoryMode #listSec h4,
#weldqa.categoryMode #listSec li {
  display: none;
}






/* ----------------------------------------------------------
 Techinfo > index.html
-----------------------------------------------------------*/