@charset "utf-8";

/* ==========================================================
 hoge
========================================================== */

/*  */
.cse .gsc-control-cse, .gsc-control-cse {
	padding: 3em 0!important;
}

@media screen and (max-width: 767px) {
	.cse .gsc-control-cse, .gsc-control-cse {
		padding: 1.5em 0 2em!important;
	}
}

.gsc-results-wrapper-visible{
	border-right: 10px solid #ededed;
	border-left: 10px solid #ededed;
	border-bottom: 10px solid #ededed;
}
.gsc-tabsArea {
	border: none!important;
	height: auto!important;
	margin-top: 0!important;
}
.gsc-tabsArea > div {
	height: auto!important;
}
.gsc-tabHeader {
	width: 33%;
	position: relative!important;
	border-right: 1px solid #ccc!important;
	padding: 3% 0!important;
	vertical-align: middle; 
	line-height: 2%!important;
	background-color: #ededed!important;
}
.gsc-tabHeader:last-of-type {
	width: 34%;
}
.gsc-tabHeader:last-of-type {
	border-right: 0!important;
}

.gsc-tabHeader.gsc-tabhActive {
	border-top: none!important;
	border-left: none!important;
}
.gsc-tabHeader.gsc-tabhActive::after {
	content: "";
    background-color: #f9bd2b;
    width: 100%;
    height: 3px;
    display: block;
    position: absolute;
    bottom: 0;
}

.gsc-above-wrapper-area {
	margin: 2%;
}
.gsc-wrapper {
	margin: 2%;
}
.gsc-result .gs-title {
	height: 1.35em!important;
}
@media screen and (min-width: 768px) {
	.contents {
		max-width: 1024px;
		margin-right: auto;
		margin-left: auto;
	}
	.gsc-tabHeader {
		font-size: 1.2em;
	}
	.gsc-tabHeader:hover::after{
		content:"";
		opacity: 1;
		width: 100%;
		height: 3px;
		display: block;
		position: absolute;
		bottom: 0;
		background-color: #f9bd2b;
	    -moz-transition: bottom 0.3s;
	    -o-transition: bottom 0.3s;
	    -webkit-transition: bottom 0.3s;
	    transition: bottom 0.3s;
	}
}

@media screen and (max-width: 767px) {
	.contents {
		padding-right: 15px;
		padding-left: 15px;
	}
	.gsc-tabHeader {
		height: none;
		padding: 8% 0!important;
	}
}