/** =======================
 *Menu PC
 ===========================*/
 
.accordion_menu {width: 250px;color:#454545;font-size: 16px;letter-spacing: 0px;}
.accordion_menu ul, ul#accordion_menu li, .accordion_menu a, ul.secondary {	list-style-type: none;	text-decoration: none;}
 .accordion_menu .individual a {background: #fff;cursor: pointer;display: block;padding: 17px 15px 17px 66px;color: #454545;position: relative;-webkit-transition: all 0.4s ease;-o-transition: all 0.4s ease;	transition: all 0.4s ease;}
.accordion_menu .link {cursor: pointer;display: block;padding: 17px 15px 17px 66px;color: #4D4D4D;position: relative;-webkit-transition: all 0.4s ease;-o-transition: all 0.4s ease;	transition: all 0.4s ease;}
.accordion_menu .link ::after{
	content: "";
    display: block;
    width: 8px;
    height: 8px;
    border: 1px solid #bcbcbc;
    border-top: 0;
    border-right: 0;
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -moz-transition: all 0.2s ease-out;
    -o-transition: all 0.2s ease-out;
    -webkit-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
}
.accordion_menu .open .link ::after{
	content: "";
    display: block;
	margin-top: 5px;
    width: 8px;
    height: 8px;
    border: 1px solid #bcbcbc;
    border-top: 0;
    border-right: 0;
    -moz-transform: rotate(135deg);
    -ms-transform: rotate(135deg);
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);
    -moz-transition: all 0.2s ease-out;
    -o-transition: all 0.2s ease-out;
    -webkit-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
}
/*nav bar icons*/
.accordion_menu .individual a.home {background: url(../images/funBIZ-icon.png) left top no-repeat;background-size: 32px;background-position: 24px 10px;-moz-transition: none; -o-transition: none; -webkit-transition: none; transition: none;}
.accordion_menu .individual a.bulletin {background: url(../images/funBIZ-icon.png) left top no-repeat;background-size: 32px;background-position: 24px -192px;-moz-transition: none; -o-transition: none; -webkit-transition: none; transition: none;}
.accordion_menu .individual a.download {background: url(../images/funBIZ-icon.png) left top no-repeat;background-size: 32px;background-position: 24px -564px;-moz-transition: none; -o-transition: none; -webkit-transition: none; transition: none;}
.accordion_menu .individual a.faq {background: url(../images/funBIZ-icon.png) left top no-repeat;background-size: 32px;background-position: 24px -660px;-moz-transition: none; -o-transition: none; -webkit-transition: none; transition: none;}
.accordion_menu .individual a.invoice {background: url(../images/funBIZ-icon.png) left top no-repeat;background-size: 32px;background-position: 24px -948px;-moz-transition: none; -o-transition: none; -webkit-transition: none; transition: none;} /*20210422 kai*/

.accordion_menu .individual a.home:hover {background: url(../images/funBIZ-icon.png) left top no-repeat;background-size: 32px;background-position: 24px -275px;}
.accordion_menu .individual a.bulletin:hover {background: url(../images/funBIZ-icon.png) left top no-repeat;background-size: 32px;background-position: 24px -478px;}
.accordion_menu .individual a.download:hover {background: url(../images/funBIZ-icon.png) left top no-repeat;background-size: 32px;background-position: 24px -612px;-moz-transition: none; -o-transition: none; -webkit-transition: none; transition: none;}
.accordion_menu .individual a.faq:hover  {background: url(../images/funBIZ-icon.png) left top no-repeat;background-size: 32px;background-position: 24px -708px;-moz-transition: none; -o-transition: none; -webkit-transition: none; transition: none;}
.accordion_menu .individual a.invoice:hover  {background: url(../images/funBIZ-icon.png) left top no-repeat;background-size: 32px;background-position: 24px -996px;-moz-transition: none; -o-transition: none; -webkit-transition: none; transition: none;} /*20210422 kai*/

.accordion_menu li i {	position: absolute;	right: 25px;color:#cccccc;-webkit-transition: all 0.4s ease;-o-transition: all 0.4s ease;transition: all 0.4s ease;}
.accordion_menu li .open i {top:25px;-webkit-transform: rotate(180deg);-ms-transform: rotate(180deg);-o-transform: rotate(180deg);transform: rotate(180deg);}

.accordion_menu li.local_trade > div {background: url(../images/funBIZ-icon.png) left top no-repeat;background-size: 32px;background-position: 24px -30px;-moz-transition: none; -o-transition: none; -webkit-transition: none; transition: none;}
.accordion_menu li.aboard_trade > div  {background: url(../images/funBIZ-icon.png) left top no-repeat;background-size: 32px;background-position: 24px -72px;-moz-transition: none; -o-transition: none; -webkit-transition: none; transition: none;}
.accordion_menu li.linepay > div {background: url(../images/funBIZ-icon.png) left top no-repeat;background-size: 32px;background-position: 24px -852px;-moz-transition: none; -o-transition: none; -webkit-transition: none; transition: none;}
.accordion_menu li.authorize > div {background: url(../images/funBIZ-icon.png) left top no-repeat;background-size: 32px;background-position: 24px -113px;-moz-transition: none; -o-transition: none; -webkit-transition: none; transition: none;}
.accordion_menu li.setting > div {background: url(../images/funBIZ-icon.png) left top no-repeat;background-size: 32px;background-position: 24px -152px;-moz-transition: none; -o-transition: none; -webkit-transition: none; transition: none;}
.accordion_menu li.location > div {background: url(../images/funBIZ-icon.png) left top no-repeat;background-size: 32px;background-position: 24px -235px;-moz-transition: none; -o-transition: none; -webkit-transition: none; transition: none;}

.accordion_menu li.open .link,.accordion_menu li > div:hover, .accordion_menu a:hover {color: #0080cc}

.accordion_menu li.local_trade.open > div {background: url(../images/funBIZ-icon.png) left top no-repeat;background-size: 32px;background-position: 24px -315px;-moz-transition: none; -o-transition: none; -webkit-transition: none; transition: none;}
.accordion_menu li.local_trade > div:hover {background: url(../images/funBIZ-icon.png) left top no-repeat;background-size: 32px;background-position: 24px -315px;-moz-transition: none; -o-transition: none; -webkit-transition: none; transition: none;}

.accordion_menu li.aboard_trade.open > div {background: url(../images/funBIZ-icon.png) left top no-repeat;background-size: 32px;background-position: 24px -357px;-moz-transition: none; -o-transition: none; -webkit-transition: none; transition: none;}
.accordion_menu li.aboard_trade > div:hover {background: url(../images/funBIZ-icon.png) left top no-repeat;background-size: 32px;background-position: 24px -357px;-moz-transition: none; -o-transition: none; -webkit-transition: none; transition: none;}

.accordion_menu li.linepay.open > div {background: url(../images/funBIZ-icon.png) left top no-repeat;background-size: 32px;background-position: 24px -900px;-moz-transition: none; -o-transition: none; -webkit-transition: none; transition: none;}
.accordion_menu li.linepay > div:hover {background: url(../images/funBIZ-icon.png) left top no-repeat;background-size: 32px;background-position: 24px -900px;-moz-transition: none; -o-transition: none; -webkit-transition: none; transition: none;}

.accordion_menu li.authorize.open > div {background: url(../images/funBIZ-icon.png) left top no-repeat;background-size: 32px;background-position: 24px -399px;-moz-transition: none; -o-transition: none; -webkit-transition: none; transition: none;}
.accordion_menu li.authorize > div:hover {background: url(../images/funBIZ-icon.png) left top no-repeat;background-size: 32px;background-position: 24px -399px;-moz-transition: none; -o-transition: none; -webkit-transition: none; transition: none;}

.accordion_menu li.setting.open > div {background: url(../images/funBIZ-icon.png) left top no-repeat;background-size: 32px;background-position: 24px -438px;-moz-transition: none; -o-transition: none; -webkit-transition: none; transition: none;}
.accordion_menu li.setting > div:hover {background: url(../images/funBIZ-icon.png) left top no-repeat;background-size: 32px;background-position: 24px -438px;-moz-transition: none; -o-transition: none; -webkit-transition: none; transition: none;}

.accordion_menu li.location.open > div {background: url(../images/funBIZ-icon.png) left top no-repeat;background-size: 32px;background-position: 24px -521px;-moz-transition: none; -o-transition: none; -webkit-transition: none; transition: none;}
.accordion_menu li.location > div:hover {background: url(../images/funBIZ-icon.png) left top no-repeat;background-size: 32px;background-position: 24px -521px;-moz-transition: none; -o-transition: none; -webkit-transition: none; transition: none;}

.accordion_menu .subsidiary {border-top:1px solid #e6e6e6}
.accordion_menu .subsidiary:last-child  {border-top:1px solid #e6e6e6;border-bottom:1px solid #e6e6e6}

/**
 * Submenu
 -----------------------------*/
.submenu {display: none;color:#454545;background: #f4f4f4;font-size: 16px;border-top: 1px solid #e6e6e6;border-top: 1px solid #e6e6e6;}
.submenu a {display: block;	color:#454545;padding: 15px;padding-left: 66px;-webkit-transition: all 0.25s ease;-o-transition: all 0.25s ease;transition: all 0.25s ease;}
.submenu a:hover {color: #0080cc} 
.submenu input[type="checkbox"] {position: absolute;opacity: 0;}
.submenu input:checked + ul.secondary {color:#454545}
.submenu label.secondary {display: block;cursor:pointer}
.submenu ul  {padding:0 18px 0 62px;background: #e6e6e6;/*display: none;*/}
.submenu ul li {border-bottom:1px solid #c6c6c6;}
.submenu ul li:last-child {border:0;}
.submenu ul li a {padding-left: 25px;cursor:pointer;display:block;}

.submenu input + ul::after  {
	ccontent: "";
    display: block;
	position: absolute;
    width: 8px;
    height: 8px;
    border: 1px solid #bcbcbc;
    border-top: 0;
    border-right: 0;
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -moz-transition: all 0.2s ease-out;
    -o-transition: all 0.2s ease-out;
    -webkit-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
	}
.submenu input:checked + label ::after {
	content: "";
    display: block;
	margin: -9px 0 0 150px;
    position: absolute;
    width: 8px;
    height: 8px;
    border: 1px solid #bcbcbc;
    border-top: 0;
    border-right: 0;
    -moz-transform: rotate(135deg);
    -ms-transform: rotate(135deg);
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);
    -moz-transition: all 0.2s ease-out;
    -o-transition: all 0.2s ease-out;
    -webkit-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;}
}
button.menu-btn, span.menu-header {visibility: hidden;}
.pushy { position:absolute;width: 250px; top: 0; left:17.5%;z-index:50; -webkit-overflow-scrolling: touch;box-shadow:0 -22px 16px 0px rgba(169, 169, 169, 0.4)}
.pushy-content { visibility: visable}
.pushy-left { -webkit-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);}
.site-header {visibility:hidden;}


/** =======================
 *Menu Mobile
 ===========================*/


  /*iPhone5 */
@media screen and (min-width:320px) and (max-width:1279px)  {
	button.menu-btn { visibility:visible;position: absolute;width: 100%;text-align: left;background: #fff; height: 67px;color: #000;font-size: 1.6em;font-weight: bold;border: 0;top: -46px;padding-left:10px;box-shadow:0 0 18px 3px rgba(169, 169, 169, 0.5);background: url(../images/funBIZ-logo_opacity_l_2.png) center top no-repeat, #fff;background-size: 198px;background-position: 51% 8px;}
    span.menu-header { visibility:visible;position: absolute;width: 96%;display: block;text-align: left;background: #fff; height: 40px;color: #000;font-size: 1.6em;font-weight: bold;border: 0;top: -40px;padding: 10px;box-shadow:0 0 18px 3px rgba(169, 169, 169, 0.5);background: url(../images/funBIZ-logo_opacity_l_2.png) center top no-repeat, #fff;background-size: 198px;background-position: 51% 6px;}

    button.menu-btn i.menu {float:left;width:34px;height:28px;margin-top: 5px;background: url(../images/funBIZ-icon-content.png)center top no-repeat;background-size:100%}

   #container a.menu_logout  {position: absolute;z-index: 50;width: 65px; height: 35px; right: 0;margin: -40px 0 0 0;padding-top: 25px;font-size: 0.9em;font-weight: bold;color:#000;text-decoration:none;}

    .menu-btn:hover {opacity: 0.6;}
	.pushy { position: fixed; width: 250px;height: 100%; left:0;top: 0; z-index: 9999; overflow:hidden;-webkit-overflow-scrolling: touch;overflow:hidden;background:#fff;box-shadow:0 0 0}
	.pushy-content { visibility: hidden}
	
	/* Menu Movement */
	.pushy-left { -webkit-transform: translate3d(-250px, 0, 0); -ms-transform: translate3d(-250px, 0, 0);transform: translate3d(-250px, 0, 0);}
	.pushy-open-left #container,.pushy-open-left .push { -webkit-transform: translate3d(250px, 0, 0); -ms-transform: translate3d(250px, 0, 0); transform: translate3d(250px, 0, 0);}
	.pushy-right {-webkit-transform: translate3d(200px, 0, 0); -ms-transform: translate3d(250px, 0, 0);  transform: translate3d(250px, 0, 0);}
	.pushy-open-right #container,.pushy-open-right .push { -webkit-transform: translate3d(-250px, 0, 0); -ms-transform: translate3d(-250px, 0, 0); transform: translate3d(-250px, 0, 0);}

	.pushy-open-left .pushy,	.pushy-open-right .pushy { -webkit-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0);}
	.pushy-open-left .pushy-content {visibility: visible;}
	
	/* Menu Transitions */
	.pushy-content {  transition: visibility 0.2s cubic-bezier(0.16, 0.68, 0.43, 0.99);}

	/* Site Overlay */
	.site-overlay {display: none;}
	.pushy-open-left .site-overlay {display: block; position: fixed;top: 0; right: 0; bottom: 0;left: 0; z-index: 1000; background-color: rgba(0, 0, 0, 0.5); -webkit-animation: fade 500ms; animation: fade 500ms;}

	@keyframes fade { 0% {opacity: 0;} 100% { opacity: 1; }}
	@-webkit-keyframes fade {  0% {opacity: 0;} 100% {opacity: 1; }}
      .pushy-left,.pushy-open-left .pushy, .pushy-open-right .pushy {visibility: hidden;}

}

    @media screen and (min-width:768px) and (max-width:1279px) {
      /* #container {left: -20%;}*/
       .pushy-left,.pushy-open-left .pushy, .pushy-open-right .pushy {margin-left:30%;visibility: hidden;}

    }

/** =======================
 * Tablet view
 ===========================*/


@media screen and (min-width:1280px) and (max-width:1366px) {
    .site-header {display: none;}
    .pushy {height: 144vh;left:2%;}
}