/*menu*/

#headerarea{width:100%;position:relative;z-index: 100; box-sizing: border-box;}
#headerarea:after{content:"";clear:both;display:block}
.is-fixed #headerarea {display: block; position:fixed; top:0; left:0; margin-bottom:0; box-shadow: 0 5px 5px 0 rgba(0,0,0,0.05); background: rgba(255,255,255,0.8);}


.search{float:right;padding:0.5vw 2vw 0 1vw;}
.search .btn10{padding:1vw 1vw;}

.logo{display: block; width:13%; margin: 2% auto 1%;}
.logo a{font-size:28px;display:block;padding:0 0 0 20px}
.is-fixed .logo{padding:0; position: relative;}

.letsgo{ display: block; width: 100px; height: 100px; /*position: absolute; left: 2vw; top: 0.1vw; 左上の時有効*/ text-align: center; border-radius: 50%;
background-image: linear-gradient(#fb8985 0%, #fc666f 100%);box-shadow: 0 2px 0 rgba(0, 0, 0, 0.19);color: #fff;text-decoration: none;font-weight: bold;text-shadow: 1px 1px 1px rgba(101, 27, 64, 1); 
bottom: 2vw; right: 2vw; position: fixed; /*右下の時有効*/
transform: rotate(-5deg);
-moz-transform: rotate(-5deg);
-webkit-transform: rotate(-5deg);
}
.letsgo p {
position: relative;
top:50%;
transform: translateY(-50%);
}

.letsgo div {
position: relative;
top:25%;
transform: translateY(-25%);
}
.letsgo:hover{ color: #fff; background:#fb8985; }

nav#header_navi ul{float:none}
nav#header_navi li{float:none}

nav#header_navi li a.nav01{width: 100%; padding: 2vw 3vw; background:rgba(10, 85, 147,0.9); letter-spacing: 0.1em; box-sizing: border-box; font-weight: bold; color: #fff;}
nav#headerarea nav#header_navi a{padding:8px 0; margin: 0 0 1px;color: #fff;}
nav#headerarea nav#header_navi a:hover{color:#ccc;border-radius:3px}

nav#header_navi .dropdown{position:relative;box-sizing: border-box;}
nav#header_navi li a:hover{background:#004063; color: #fff;}
nav#header_navi li a:after{font-family: "Font Awesome 5 Free"; font-weight: 900; content:"\f105"; position:absolute; right: 3vw;}

nav#header_navi li ul{display:none}
nav#header_navi li:hover ul{display:inline}
nav#header_navi li li{float:none}
nav#header_navi .dropdown ul{position:absolute;left:0; right: 1vw; top:100%;background:#fff;padding:20px 0;border-bottom:3px solid #34495e;box-sizing: border-box;}
nav#header_navi .dropdown li{white-space:nowrap}
nav#header_navi .dropdown li a{padding:10px 0px;font-size:13px;min-width:200px;box-sizing: border-box;}
nav#header_navi .mega-dropdown{width:100%;position:absolute;top:100%;left:0; right: 1vw; background:#004063;overflow:hidden;padding:25px;/*border-bottom:3px solid #34495e;*/box-shadow: 2px 2px 4px gray;color: #fff;}
nav#header_navi li li a{float:none;color:#fff;display:block;padding:8px 0px;border-radius:3px;font-size:13px}
nav#header_navi li li a:hover{color: #ccc;}
.mega-col{width:23%;float:left;margin: 0 2% 0 0;}
.mega-col:last-child{margin-right: 0;}
nav#header_navi img{ width: auto; height: auto;}

nav#header_navi li.li_tit {border-bottom: 1px solid #ccc;font-size: 90%; font-weight: bold; margin: 0 0 2%; padding: 0 0 1%;}
nav#header_navi li li a:before { content: '●'; color:#73C2B5; position:relative; margin: 0 3px 0 0; font-size: 50%;}

#menu-icon{position:absolute;right:0;margin-top:10px;margin-right:30px;display:none}
#menu-icon span{border:1px solid #2b2d42; /*border:1px solid #fff;*/ display:block;-webkit-transition:all .2s;transition:all .1s}
#menu-icon span.first{ width:40px; margin-bottom:7px;}
#menu-icon span.second{ width:30px; margin-bottom:7px;}
#menu-icon span.third{ width:22px;}

.is-fixed #menu-icon span{border:1px solid #2b2d42;}

nav#header_navi{display:none;width:50%;clear:both;float:none;max-height:600px; overflow-y:scroll;padding:0; position: absolute; right: 0;}
#menu-icon{display:inline;cursor:pointer;}
.is-fixed #menu-icon{display:inline;top:2vw;cursor:pointer; margin-top:0;}

#menu-icon.active .first{transform:rotate(45deg);-webkit-transform:rotate(45deg);margin-top:10px}
#menu-icon.active .second{transform:rotate(135deg);-webkit-transform:rotate(135deg);position:relative;top:-9px; width: 40px;}
#menu-icon.active .third{display:none}
.search{display: none;}

nav#header_navi ul li a{float:none;padding:8px;display:block}
#headerarea nav#header_navi ul ul{display:block;position:static;background:none;border:none;padding:0}
#headerarea nav#header_navi ul ul.mega-col,#headerarea nav#header_navi ul ul.mega-dropdown{padding:4vw;}

nav#header_navi li li a{font-size: 1em;}
nav#header_navi li li a:before {font-size: 80%;}
#headerarea nav#header_navi ul li li a:before{content:"- "}
.mega-col{width:100%}
nav#header_navi .mega-dropdown{box-shadow: none;}	
nav#header_navi li a.nav01 span{ display: inline; width: 100%; font-size: .8em; text-align: center; padding: 4px; font-style: normal; font-weight: normal;}	

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

.logo{display: block; width:36%; margin: 2% auto 1%;}
.is-fixed #menu-icon{display:inline;top:4vw;cursor:pointer; margin-top:0;}
.letsgo{ display:none;}

}