@charset "utf-8";

/* ------------------------------------------------------------------------------------------------------ GlobalNavi */

.headernavi,
.headernavi *,
.headernavi *:before,
.headernavi *:after {
	background-repeat: no-repeat;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
}

.headernavi {
	width: 100%;
	font-size: 13px;
}

.headernavi ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.searchmenu {
   /* padding: 20px;*/
    padding:0;
    background-color: #cacaca;
}

.searchmenu .searchwrap {
    width: 100%;
    /*height: 32px;*/
    margin: 0 auto;
}

.gsc-search-box{
	width:185px!important;
	position:relative;
	overflow:hidden;
}

.gsc-control-cse.gsc-control-cse-ja{
	height:55px;
	background-color:#cacaca;
	border:none;
}
.gsc-control-wrapper-cse{
	position:relative;
	top:-5px;
}

table.gstl_50#gs_id50{
	background-color:#cacaca;
	position:relative;
	border:none !important;
}

input.gsc-input{
	width:120px !important;
	height:26px !important;
}

td.gsc-search-button{
	width:auto;
	height:27px;
	position:relative;
	top:2px;
	overflow:hidden;
	background-color:#cacaca;
}
button.gsc-search-button.gsc-search-button-v2{
	position:relative;
	top:-1px;
	left:-22px;
}

#gs_st50{display:none;}

@media screen and (max-width: 1000px) {

.searchmenu .searchwrap {
	max-width:400px;
    width: 90%;
    /*height: 32px;*/
    margin: 0 auto;
}

.gsc-search-box{
	width:100% !important;
}

input.gsc-input{
	width:100% !important;
}

td.gsc-search-button{
	overflow:visible;
}

button.gsc-search-button.gsc-search-button-v2{
	left:0;
}

#gs_st50{display:block;}
	
}



/*
.searchmenu form {
    display: block;
    width: 100%;
    height: 32px;
    margin: 0 auto;
    padding-left: 15px;
    border-radius: 16px;
    background-color: #fff;
    background-image: url(../shared/img_search.png);
    background-size: 17px auto;
    background-position: 97% 50%;
    background-repeat: no-repeat;
}

.searchmenu form input[type="text"] {
    width: 85%;
    height: calc(100% - 2px);
    border: none;
    outline: none;
}

.searchmenu form input[type="button"] {
    display:none;
}
*/

@media screen and (min-width: 1001px) {

.headernavi {
    display: flex !important;
    flex-direction: row-reverse;
    width: 1000px;
    margin: 0 auto;
}


/*
.searchmenu {
    width: 198px;
    padding: 14px 20px 13px;
}

.searchmenu form {
    height: 28px;
    border-radius: 14px;
    background-position: 92% 50%;
}

.searchmenu form input[type="text"] {
    width: 113px;
}
*/
} /* min 1001px -- */


/***********************************************
 Menu base
 ***********************************************/
ul.g-menu {
}

ul.g-menu li {
    position: relative;
	margin: 0;
	padding: 0;
}

ul.g-menu li a {
	display: block;
	text-decoration: none;
}


@media screen and (min-width: 1001px) {

ul.g-menu {
    position: relative;
    width: 802px;
    height: 55px;
}

ul.g-menu {
    letter-spacing: -0.4em;
}

ul.g-menu li {
    font-family:'kozuka-gothic-pro';
    letter-spacing: 0.07em;
}

} /* min 1001px -- */


/***********************************************
 Top-category
 ***********************************************/
ul.g-menu > li {
	background-color: #0098e8;
}

ul.g-menu > li > a:first-child,
ul.g-menu > li > span:first-child {
    display: block;
	width: 100%;
	height: 100%;
	padding: 18px 40px 17px 20px;
	border-bottom: 1px solid #e4e4e4;
	color: #fff;
    cursor: pointer;
}

ul.g-menu > li > a:first-child {
    background-image: url(../shared/img_yajirushi-next.png);
    background-position: right 25px center;
    background-repeat: no-repeat;
}

/*
 * 会員専用ページ
 */
ul.g-menu > li:nth-last-child(1) {
	background-color: #48c850;
}


@media screen and (min-width: 1001px) {

ul.g-menu > li {
	display: inline-block;
    width: auto;
    height: 100%;
	vertical-align: top;

	-webkit-transition: background-color 0.5s, border-color 0.5s;
	-moz-transition: background-color 0.5s, border-color 0.5s;
	-ms-transition: background-color 0.5s, border-color 0.5s;
	-o-transition: background-color 0.5s, border-color 0.5s;
	transition: background-color 0.5s, border-color 0.5s;
}

ul.g-menu > li > a:first-child,
ul.g-menu > li > span:first-child {
    padding: 16px 19px 0;
	border-bottom: none;
}

ul.g-menu > li > a:first-child {
    background-image: none;
}

/*
 * 会員専用ページ
 */
ul.g-menu > li:nth-last-of-type(1) {
    position: absolute;
    top: 0;
    right: 0;
}

/*!
 * マウスオーバー
 */
ul.g-menu > li:hover {
    background-color: #0086cf;
}

ul.g-menu > li:nth-last-of-type(1):hover {
    background-color: #3ead46;
}

} /* min 1001px -- */


/***********************************************
 Sub-category
 ***********************************************/

/*
 * 第１階層
 */
ul.g-menu > li > ul {
    display: none;
	width: 100%;
}

ul.g-menu > li > ul > li {
	background-color: #fff;
    border-top: 1px solid #e4e4e4;
}

ul.g-menu > li > ul > li:first-child {
    border-top: none;
}

ul.g-menu > li > ul > li > span,
ul.g-menu > li > ul > li > a {
	display: block;
	position: relative;
	padding: 18px 40px 17px 20px;
	color: #4d4d4d;
}

ul.g-menu > li > ul > li > a {
    background-image: url(../shared/img_yajirushi-next2.png);
    background-position: right 25px center;
    background-repeat: no-repeat;
}

/*
 * 第２階層
 */
ul.g-menu > li > ul > li ul {
	position: static;
}

ul.g-menu > li > ul > li ul li {
	width: 100%;
	background-color: #ebf0f5;
	border-top: 1px solid #e4e4e4;
}

ul.g-menu > li > ul > li ul li a {
	padding: 18px 40px 17px 20px;
    color: #4d4d4d;
}

ul.g-menu > li > ul > li ul li a {
    background-image: url(../shared/img_yajirushi-next2.png);
    background-position: right 25px center;
    background-repeat: no-repeat;
}


@media screen and (min-width: 1001px) {

/*
 * 第１階層
 */
ul.g-menu > li > ul {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 99;
	width: 240px;
}

ul.g-menu > li > ul > li {
	background-color: #0086cf;
    border-top: none;
}

ul.g-menu > li > ul > li:first-child {
    border-top: none;
}

ul.g-menu > li > ul > li > span,
ul.g-menu > li > ul > li > a {
    padding: 18px 30px 17px 19px;
    color: #fff;
}

ul.g-menu > li > ul > li > a {
    background-image: none;
}

ul.g-menu > li > ul > li > span {
    background-image: url(../shared/img_yajirushi-next.png);
    background-position: right 25px center;
    background-repeat: no-repeat;
}

ul.g-menu > li > ul > li:hover {
    background-color: #006da8;
}

/*
 * 第２階層
 */
ul.g-menu > li > ul > li ul {
	position: absolute;
	top: 0;
	left: 100%;
	width: 240px;
}

ul.g-menu > li > ul > li ul li {
    background-color: #006da8;
    border-top: none;
}

ul.g-menu > li > ul > li ul li:first-child {
	border-top: none;
}

ul.g-menu > li > ul > li ul li span,
ul.g-menu > li > ul > li ul li a {
    padding: 18px 30px 17px 19px;
    color: #fff;
}

ul.g-menu > li > ul > li ul li a {
    background-image: none;
}

ul.g-menu > li > ul > li ul li span {
    background-image: url(../shared/img_yajirushi-next.png);
    background-position: right 25px center;
    background-repeat: no-repeat;
}

ul.g-menu > li > ul > li ul li a:hover {
	background-color: #005d8f;
}

} /* min 1001px -- */



/***********************************************
 icon
 ***********************************************/
ul.g-menu li .sub-toggle {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 62px;
	background-image: url(../shared/img_plus.png);
    background-size: 14px 14px;
	background-position: right 23px center;
	cursor: pointer;
}

ul.g-menu > li > ul > li > .sub-toggle {
	background-image: url(../shared/img_plus2.png) !important;
}

ul.g-menu li .sub-toggle > i {
	display: none;
}

/*
 * iconクリック時
 */
ul.g-menu li .sub-toggle.expanded {
	background-image: url(../shared/img_minus.png);
}

ul.g-menu > li > ul > li > .sub-toggle.expanded {
	background-image: url(../shared/img_minus2.png) !important;
}


@media screen and (min-width: 1001px) {

ul.g-menu li .sub-toggle {
	display: none;
}

} /* min 1001px -- */



/***********************************************
 Menu button
 ***********************************************/
.menucollapser {
	position: absolute;
	top: 0;
	right: 0;
    z-index: 100;
	width: 60px;
	height: 60px;
}

.collapse-button {
	height: 100%;
	background-image: url(../shared/btn_spmenu.svg);
    background-position: center;
    background-repeat: no-repeat;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	cursor: pointer;
}

.collapse-button.open {
	background-image: url(../shared/btn_spmenu_close.svg);
}


@media screen and (min-width: 431px) {

.menucollapser {
	height: 80px;
}

} /* min 431px -- */


