@charset "UTF-8";

/**
 * micro clearfix 
 */
/* For modern browsers */
.cf:before, .cf:after {
	content: "";
	display: table;
}
.cf:after { clear: both; }
/* For IE 6/7 (trigger hasLayout) */
.cf { zoom: 1; }

.clear {
	clear: both;
}




/**
 * #sgfs_search
 */
#sgfs_search {
	/*display:none;*/
	position:fixed;
	z-index:1000;
	width:200px;
	height:80px;
	top:0px;
	left:50%;
	margin-left:260px;
	background:url(../img/search/btn_search.png) no-repeat center top;
	background-size:contain;
	cursor:pointer;
	text-indent:120%;
	white-space:nowrap;
	overflow:hidden;
}
#sgfs_search:hover {
	background:url(../img/search/btn_search_on.png) no-repeat center top;
	background-size:contain;
}

@media only screen and (min-width:768px) {
	#sgfs_search {
		transition:top 0.2s ease-in;
		top:-80px;
	}
	#sgfs_search.show {
		top:0px;
	}
}
@media only screen and (min-width:768px) and (max-width:959px) {
	#sgfs_search {
		margin-left:169px;
	}
}
@media only screen and (max-width:767px) {
	#sgfs_search {
		width:100%;
		height:auto;
		top:auto;
		bottom:0;
		left:0;
		margin-left:0;
		background:rgba(0,0,0,0.80);
		text-indent:0;
	}
	#sgfs_search:hover {
		background:rgba(0,0,0,0.80);
	}
}


/**
 * #sgfs_cover
 */
#sgfs_cover {
	display:none;
	position:fixed;
	z-index: 1100;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background:rgba(255,255,255,0.6);
}
#sgfs_cover.on {
	display:block;
}

/**
 * #sgfs_search_win
 */
#sgfs_search_win {
	box-shadow:-3px 0 3px 0 rgba(0,0,0,0.1);
	position:fixed;
	z-index: 1101;
	width:560px;
	top:0;
	right:-560px;
	/*left: 50%;
	margin-left:-100px;*/
	max-height:100%;
	overflow:auto;
	overflow-x:hidden;
	background-color:#fff;
	transition:right 0.15s ease-out; 
}
#sgfs_search_win.on  {
	transition:right 0.3s ease-out; 
	right:0;
}

#sgfs_search_win h2 {
	position:relative;
	background:rgba(0,0,0,0.88) url(../img/search/sgf-logo.png) no-repeat 15px 12px;
	background-size:48px auto;
	margin:0;
	padding:30px 0;
	text-align:center;
	line-height:0;
	vertical-align:bottom;
}


#sgfs_search_win .sgfs_btn_close {
	position:absolute;
	top:24px;
	right:20px;
	cursor:pointer;
	transition:all 0.08s ease-out;
}
#sgfs_search_win .sgfs_btn_close:hover {
	transform:rotate(90deg);
}

#sgfs_search_win h3 {
	padding:0;
	margin:30px 0 15px 0;
}
.sgfs_inner {
	text-align:center;
}
.sgfs_inner ul {
	width:92.857%;
	margin:auto;
}
.sgfs_inner li {
	float:left;
	width:46%;
	margin:2%;
}
.sgfs_inner li a:hover {
	opacity:0.6;
}
.sgfs_inner li img {
	width:100%;
	height:auto;
}

.sgfs_inner form div {
	position:relative;
	box-shadow:1px 1px 3px 0 rgba(0,0,0,0.6) inset;
	text-align:center;
	width:58.928%;
	margin:50px auto;
	border-radius:8px;
}

#searchform #s {
	box-sizing:border-box;
	background:none;
	width:100% !important;
	margin:0;
	padding:20px 45px 20px 15px;
	font-size:100%;
	color:#000;
}
#searchform #searchsubmit {
	box-sizing:border-box;
	position:absolute;
	top:5px;
	right:10px;
	left:auto;
	width:28px;
	height:28px;
	margin:0;
	padding:0;
	background: url(../img/search/icon_search.png) no-repeat 0 0;
	background-size:contain;
}
#searchform #searchsubmit:hover {
	opacity:0.6;
}

#sgfs_search_foot {
	position:relative;
	background:rgba(0,0,0,0.88) url(../img/search/sgf-logo.png) no-repeat 15px 12px;
	background-size:48px auto;
	margin:0;
	padding:42px 0;
	text-align:center;
	color:#fff;
	font-size:12px;
	line-height:0;
	vertical-align:bottom;
}
#sgfs_search_foot p {
	padding:0;
	margin:0;
}
@media only screen and (max-width:560px) {
	#sgfs_search_win {
		width:100%;
		right:-100%;
	}
	
	#sgfs_search_win h2 {
		background-size:24px auto;
		padding:20px 0;
	}
	#sgfs_search_win h2 img {
		width:180px;
		height:auto;
	}
	
	#sgfs_search_win .sgfs_btn_close {
		width:24px;
		top:15px;
		right:10px;
	}
	#sgfs_search_win h3 {
		margin:20px 0 10px 0;
		line-height:0;
	}
	#sgfs_search_win h3 img {
		width:auto;
		height:14px;
	}
	
	.sgfs_inner form div {
		width:80%;
		margin:30px auto;
	}
	
	#sgfs_search_foot {
		background-size:24px auto;
		padding:26px 0 28px 0;
		font-size:8px;
	}
}