@charset "utf-8";

/* ================================

infoNet burgerMenu.css   ver3.0

================================ */
#header{position:relative;z-index:90;}

/* burgerMotion
------------------------- */
.burgerMotion{position:absolute;top:0;right:0;z-index:20;width:50px;height:50px;cursor:pointer;}
.burgerMotion p{position:relative;width:50px;height:100%;margin:0 auto;padding:0;}
.burgerMotion p span{display:inline-block;position:absolute;top:0;right:0;bottom:0;left:0;width:24px;height:3px;margin:auto;border-radius:3px;background-color:#666;vertical-align:middle;transition:background 0.25s ease-in-out 0.25s;}

/* burgerMotion main
------------------------- */
.burgerMotion.main{background-color:#353a40;}
.burgerMotion.main p{}
.burgerMotion.main p span{background-color:#fff;}
.burgerMotion.main p span:before,
.burgerMotion.main p span:after{content:"";display:block;position:absolute;left:0;width:100%;height:3px;border-radius:3px;transition:transform ease-in-out 0.25s 0s,margin ease-in-out 0.25s 0.25s;}
.burgerMotion.main p span:before{margin-top:-9px;background-color:#fff;}
.burgerMotion.main p span:after{margin-top:9px;background-color:#fff;}
.burgerMotion.main.active p span{background-color:rgba(255, 255, 255, 0);transition:background 0.25s ease-in-out 0.0s;}
.burgerMotion.main.active p span:before{transform:rotate(45deg);margin-top:0;transition:transform ease-in-out 0.25s 0.25s,margin ease-in-out 0.25s;}
.burgerMotion.main.active p span:after{transform:rotate(-45deg);margin-top:0;transition:transform ease-in-out 0.25s 0.25s,margin ease-in-out 0.25s;}

/* burgerMotion sub
------------------------------ */
.burgerMotion.sub{right:50px;background-color:#5fc2f0;}
.burgerMotion.sub p:before{content:"";display:block;position:absolute;top:calc(50% - 12px);left:calc(50% - 12px);width:24px;height:24px;background:url(/Portals/0/images/common/ico_language_sp.png) center center no-repeat;background-size:contain;}
.burgerMotion.sub p:after{display:none;}
.burgerMotion.sub p span{display:none;}
.burgerMotion.sub p span:before,
.burgerMotion.sub p span:after{display:none;}
.burgerMotion.sub.active p span:before,
.burgerMotion.sub.active p span:after{}
.burgerMotion.sub.active p span:before{}
.burgerMotion.sub.active p span:after{}

/* burgerMotion logo
------------------------------ */
.burgerMotion.logo{position:relative;z-index:10;width:100%;height:auto;background-color:#fff;}
.burgerMotion.logo p{width:100%;}
.burgerMotion.logo p:after{display:none;}
.burgerMotion.logo p span{display:block;position:static;width:100%;height:auto;padding:5px 0 5px 20px;border-radius:inherit;background:none;}
.burgerMotion.logo p span img{width:225px;}
.burgerMotion.logo p span:before,
.burgerMotion.logo p span:after{}
.burgerMotion.logo p span:before{content:"";display:block;position:absolute;top:calc(50% - 4px);right:12px;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);width:6px;height:6px;border:2px solid #00a8ec;border-top-width:0;border-right-width:0;transition:all 0.25s ease-out;}
.burgerMotion.logo p span:after{content:"";display:block;position:absolute;top:calc(50% - 0.5em);right:30px;width:1px;height:1em;margin:0 0 0 16px;background-color:#ccc;vertical-align:middle;}
.burgerMotion.logo.active{background-color:#5fc2f0;}
.burgerMotion.logo.active p span:before,
.burgerMotion.logo.active p span:after{}
.burgerMotion.logo.active p span:before{transform:rotate(135deg);}
.burgerMotion.logo.active p span:after{}

/* burgerItem
------------------------- */
.burgerItem{position:relative;z-index:100;transition:left 0.3s ease-in-out,right 0.3s ease-in-out;}
.burgerItem > *{position:relative;z-index:10;}

/* horizonLeft */
.horizonLeft{overflow-x:hidden!important;}
.horizonLeft .burgerItem{position:absolute;top:100%;left:100%;}
.horizonLeft.navOpen .burgerItem{left:0;}

/* horizonRight */
.horizonRight{overflow-x:hidden!important;}
.horizonRight .burgerItem{position:absolute;top:0;right:100%;}
.horizonRight.navOpen .burgerItem{right:100%;}

/* burgerCloseMotion
------------------------- */
.burgerCloseMotion{}

/* burgerOverlay
------------------------- */
.burgerOverlay{position:fixed;top:0;left:0;z-index:5;width:100%;background-color:rgba(0,0,0,0.5);}