/*
Copyright ﾂｩ 2013 Adobe Systems Incorporated.
Licensed under the Apache License, Version 2.0 (the 窶廰icense窶�);
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an 窶廣S IS窶� BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/

.megamenu {
  /*position: relative;*/
  display: flex;
}

.accessible-megamenu {
    color: #000;
    display:block;
    z-index: 2;
}

.megamenu ol {
	margin-bottom: 0;
	display:flex;
	justify-content: center;
	align-items: center;
}

.megamenu ol li{
	/*display:flex;
	justify-content: center;
	align-items: center;*/
}


/*繝｡繧ｬ繝｡繝九Η繝ｼ
----------------------------------------------------*/
.megamenu ol li div/*js隱ｭ縺ｿ霎ｼ縺ｿ蜑阪↓荳€迸ｬ繝｡繧ｬ繝｡繝九Η繝ｼ譏�繧九�繧帝亟縺�*/,
.accessible-megamenu .accessible-megamenu-panel {
    position: absolute;
	background:rgba(255, 255, 255, 0.95);
    display: block;
    cursor: default;
	
    visibility: hidden;
    top: 100px;
    overflow: hidden;
    opacity: 0;
}

.accessible-megamenu .accessible-megamenu-panel.open {
    visibility: visible;
	top:100px;
	left:0;
	width:100%;
    opacity: 1;
    z-index: 1001;
	
	-webkit-transition: all .3s;
	transition: all .3s;
}

/*.nav_search .accessible-megamenu-panel{
	top:55px;
	right:260px;
	width:420px;
	background:none;
}
.nav_search .accessible-megamenu-panel.open{
	top:55px;
	right:280px;
	width:435px;
	background:#FFF;
}

.fixnavi .nav_search .accessible-megamenu-panel,
.fixnavi .nav_search .accessible-megamenu-panel.open{
	top:45px;
}*/

/*@media screen and (max-width:1170px){
.nav_search .accessible-megamenu-panel.open{
	right:16.5em;
}
}*/

/*.nav_search .accessible-megamenu-panel #google_top{
	width:380px;
	padding:8px;
	border:0;
	border-bottom:1px solid #707070;
}

.nav_search .accessible-megamenu-panel #btn_search{
	width:28px;
	height:18px;
	padding-left:10px;
	vertical-align:middle;
}*/

.megamenu div.cf{
	padding:30px 40px;
}

.megamenu div h2{
	width:100%;
	margin-bottom:30px;
	padding-bottom:20px;
	border-bottom:1px solid #BBB;
	font-size:2.6rem;
}

#headIn .megamenu .accessible-megamenu div h2 a{
	margin:0 0 0.5em 2em;
	padding:0 0 0 1.5rem;
	background:url("../img/yihbp/icon_link.png") no-repeat left 0.7em / 0.8rem;
	font-size: 16px;
	color: #000!important;
	display: inline-block;
}

#headIn .megamenu .accessible-megamenu div h2 a:hover{
	background:url("../img/yihbp/icon_link.png") no-repeat 3px 0.7em / 0.8rem;
	text-decoration: underline;
}

.megamenu .box_4col{
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr;
}

.megamenu .box_3col{
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
}

.megamenu .box_2col{
	display: grid;
	grid-template-columns: 1fr 1fr;
}

.megamenu div ul,
.megamenu div ul li{
	margin:0;
	height: auto;
	display:block;
}

#headIn .megamenu .accessible-megamenu-panel div a{
	margin:0 0 0.5em 0;
	padding:0 0 0 1.5rem;
	background:url("../img/yihbp/icon_link.png") no-repeat left 0.7em / 0.8rem;
	color: #000!important;
	display:block;
}

#headIn .megamenu .accessible-megamenu-panel div a:hover{
	background:url("../img/yihbp/icon_link.png") no-repeat 3px 0.7em / 0.8rem;
	text-decoration: underline;
}

.megamenu div h3{
	font-family: "Noto Sans JP";
	font-size: 18px;
	color: #CE902A;
}

/*繝上Φ繝舌�繧ｬ繝ｼ
----------------------------------------------------*/
.accessible-megamenu:not(.js-accessible-megamenu) .accessible-megamenu-panel > h2 {
    display: none;
}

.accessible-megamenu-toggle {
  display: none;
  background: none;
  border: 0;
  padding: 0;
  position: absolute;
  z-index: 1;
  top: 3px;
  right: 3%;
  width: 35px;
}

.accessible-megamenu-toggle > span:not(.sr-only) {
  display: block;
  width: 35px;
  height: 2px;
  margin-bottom:6px;
  position: relative;

  background: #324C9C;
  border-radius: 3px;
  z-index: 1;
  transform-origin: 0 0;
  transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
              background 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
              margin 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
              opacity 0.55s ease;
}

.accessible-megamenu-toggle > span {
  margin-top: 5px;
}

.accessible-megamenu-toggle > span:nth-last-child(1) {
  transform-origin: 0% 100%;
}

/*
 * Transform all the slices of hamburger
 * into a crossmark.
 */
.accessible-megamenu-toggle[aria-expanded=true] > span
{
  margin-top: 0;
  opacity: 1;
  transform: rotate(45deg) translate(6px, -3px);
  background: #324C9C;
  border-radius: 0;
}
/*5.-1*/

.accessible-megamenu-toggle[aria-expanded=true] > span:nth-last-child(1)
{
  transform: rotate(45deg) translate(-7px, -13px);
}

/*
 * But, hide the middle one.
 */
.accessible-megamenu-toggle[aria-expanded=true] > span:nth-last-child(3)
{
  opacity: 0;
  transform: rotate(0deg) scale(0.2, 0.2);
}

/*
 * the last one should go the other direction.
 */
.accessible-megamenu-toggle[aria-expanded=true] > span:nth-last-child(2)
{
  transform: rotate(-45deg) translate(-10px, 17px);
}
/*15.20*/

.accessible-megamenu-toggle em{
	display:none;
}



@media (max-width: 960px) {

header #headIn{
	float:none;
	padding: 0;
	width:100%;
}

/*.accessible-megamenu {
	height:0;
}*/

.megamenu{
	position:relative;
	top:-500px;
	padding:0;
	display: block;
	overflow:scroll;
}

.scroll-lock .megamenu{
	position: fixed;
	top:0;
	width:100%;
	height:100vh;
	padding:0 6vw;
	background:rgba(255, 255, 255, .95);
	overflow-y: scroll; 
}

.megamenu ol{
	padding:14vw 0 0 0;
	clear:both;
	display:block;
}

.accessible-megamenu-toggle[aria-expanded=true] ~ .accessible-megamenu{
	/*height:calc(100vh - 24vw);*/
}

.megamenu ol li{
	height:auto;
	padding:0;
    /*background:none!important;*/
	border-bottom:1px solid #CCC;
	display:block;
}

/*.megamenu ol li a{
	width:100%;
	padding:3% 0!important;
	font-size:3.6vw;
	display:block;
}

.megamenu ol li:hover{
    background: rgba(255,255,255,0.95);
}*/

.megamenu ol li a{
	position: relative;
}
.megamenu ol li a span{
	position: absolute;
	top:0.5em;
	right:0.5em;
	width: 6vw;
	height: 6vw;
	padding: 0;
	background:url(../img/icon_plus.png) no-repeat 97% center / 4vw;
}

.megamenu ol li a.open span{
	background:url(../img/icon_minus.png) no-repeat 97% center / 4vw;
}


/*繝｡繧ｬ繝｡繝九Η繝ｼ
----------------------------------------------------*/
.accessible-megamenu .accessible-megamenu-panel {
    position: absolute;
	width:100%;
    background: rgba(255,255,255,0.0);
    display: block;
    left:0;
    cursor: default;

    visibility: hidden;
    top: -9999em;
	left:0;
    width:100%;
    max-height: 0px;
    overflow: hidden;
    opacity: 0;
    -webkit-transition: opacity 250ms ease 250ms, max-height 500ms ease, visibility 0s linear 500ms, top 0s linear 500ms;
       -moz-transition: opacity 250ms ease 250ms, max-height 500ms ease, visibility 0s linear 500ms, top 0s linear 500ms;
        -ms-transition: opacity 250ms ease 250ms, max-height 500ms ease, visibility 0s linear 500ms, top 0s linear 500ms;
         -o-transition: opacity 250ms ease 250ms, max-height 500ms ease, visibility 0s linear 500ms, top 0s linear 500ms;
            transition: opacity 250ms ease 250ms, max-height 500ms ease, visibility 0s linear 500ms, top 0s linear 500ms;
}

.accessible-megamenu .accessible-megamenu-panel.open {
    visibility: visible;
    top: 0;
	left:0;
    width:100%;
    max-height: 600px;
    opacity: 1;
    z-index: 1001;
    -webkit-transition: opacity 250ms ease, max-height 500ms ease, visibility 0s linear 0s, top 0s linear 0s;
       -moz-transition: opacity 250ms ease, max-height 500ms ease, visibility 0s linear 0s, top 0s linear 0s;
        -ms-transition: opacity 250ms ease, max-height 500ms ease, visibility 0s linear 0s, top 0s linear 0s;
         -o-transition: opacity 250ms ease, max-height 500ms ease, visibility 0s linear 0s, top 0s linear 0s;
            transition: opacity 250ms ease, max-height 500ms ease, visibility 0s linear 0s, top 0s linear 0s;
}



.megamenu .box_4col,
.megamenu .box_3col,
.megamenu .box_2col{
	display: block;
}

.megamenu div{
	padding: 2vw;
	background: #FFF;
}

.megamenu div.cf{
	padding:0;
}

.megamenu div ul li{
	border-bottom: 0!important;
}

.megamenu div ul li a{
	padding: 2% 2% 1% 6%!important;
}

.megamenu div h2{
	display: none;
}

.megamenu div ul{
	float: none;
	width: 100%;
	margin-bottom: 6vw;
	display: block!important;
}

.megamenu div ul li,
.megamenu div ul li:last-child{
	width: 100%;
}

.megamenu div ul li a{
	background: none;
	font-size: 4.0vw;
    font-weight: normal;
}

.megamenu div ul li:last-child a{
	text-align: left!important;
}

	
/*繝上Φ繝舌�繧ｬ繝ｼ
----------------------------------------------------*/
.accessible-megamenu-toggle {
	position:fixed;
	top:1vw;
	right:3%;
	height:60px;
	display: block;
	z-index: 3;
}

  .accessible-megamenu-toggle ~ .accessible-megamenu > .accessible-megamenu-top-nav-item {
    height: 0;
    overflow: hidden;
    visibility: collapse;
	opacity:0;
  }

  .accessible-megamenu-toggle[aria-expanded=true] ~ .accessible-megamenu > .accessible-megamenu-top-nav-item {
    height: auto;
    overflow: visible;
    visibility: visible;
	opacity:1;
  }

  .accessible-megamenu > .accessible-megamenu-top-nav-item {
    border-right: 0;
    float: none;
    width: 100%;
    height: auto;
  }

  .accessible-megamenu > .accessible-megamenu-top-nav-item a[aria-expanded] {
    box-shadow: none;
  }

  .accessible-megamenu .accessible-megamenu-panel,
  .accessible-megamenu .accessible-megamenu-panel.open {
    position: relative;
    top: 0;
    border: 0;
    box-shadow: none;
    padding-bottom: 0;
  }

  .accessible-megamenu .accessible-megamenu-panel.open {
    padding-bottom: 0.769em;
    /*max-height: 350px;*/
    overflow: auto;
  }
  
  .accessible-megamenu-toggle em{
	position:relative;
	top:-2px;
	font-style:normal;
	font-size:13px;
	text-align:center;
	color: #324C9C;
	display:block;
}

.accessible-megamenu-toggle[aria-expanded=true] > em{
	top:6px;
}