.black_title { color: #232323; font-size: 1.2rem; font-weight: bold; margin: 20px auto; text-align: center; width: 60%; float: left; }
.menuopen { width: 20%; float: left; height: 60px; }

ul.menu { padding: 0; list-style: none; width: 420px; margin: 0 auto; clear: both; display: table; }
ul.menu .list { font-size: 14px; position: relative; width: 100%; box-sizing: border-box; height: 50px; vertical-align: top; background: #FFF; clear: both; }
ul.menu .list.first_itembox:after { content: ''; background: url(/images/icon/mobile/allicon.png); background-position: -100px -300px; width: 100px; height: 100px; position: absolute; left: 135px; top: -25px; transform: scale(0.22); }
ul.menu .list .second_itembox:after { content: ''; background: url(../image/allicon.png); background-position: -800px -100px; width: 100px; height: 100px; transform: scale(0.2); position: absolute; left: 135px; top: -30px; }
ul.menu .list a { text-decoration: none; color: #4b606c; padding: 0; display: block; height: 100%; box-sizing: border-box;text-shadow:none; }
ul.menu .list a:hover { transition: 300ms all; color: #f99a04; }
ul.menu .list .items { height: 0px; overflow: hidden; }
ul.menu .list .items a { padding: 17px; color: #f99a04;text-shadow:none; }
ul.menu .list .items a:hover { color: #f96004; transition: 300ms all; }
ul.menu .list:last-child { border-bottom: none; }
ul.menu > .list.first_itembox.active:after { content: ''; background: url(/images/icon/mobile/allicon.png); background-position: -200px -300px; width: 100px; height: 100px; position: absolute; left: 135px; top: -25px; transform: scale(0.22); }
ul.menu > .list .second_itembox.active:after { content: ''; background: url(/images/icon/mobile/allicon.png); background-position: -700px -100px; width: 100px; height: 100px; transform: scale(0.22); position: absolute; left: 135px; top: -25px; }
.sidenav ul.menu .list:after { content: ''; background: url(/images/icon/mobile/allicon.png); background-position: -700px -100px; width: 100px; height: 100px; transform: scale(0.2); position: absolute; left: 175px; top: -30px; }
.sidenav ul.menu .list.active:after { content: ''; background: url(/images/icon/mobile/allicon.png); background-position: -800px -100px; width: 100px; height: 100px; transform: scale(0.2); position: absolute; left: 175px; top: -30px; }
.sidenav ul.menu .list.nosub:after { display: none; }
ul.menu .active > .items { display: block; background: #f8f8f9; padding: 0px; color: #4b606c; transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1); transition: all 200ms; clear: both; float: left; width: 100%; height: auto; /*max-height: 345px; overflow: scroll;*/ }
ul.menu .active > .items li { padding: 0px; list-style: none; }
ul.menu .active > .items li:last-child { padding-bottom: 0px; }
ul.menu .active > .items .active > .items { background-color: #f8f8f9; }
ul.menu .active > a { color: #4b606c; }
ul.menu .active .list { background: #efeff1; }
ul.menu .active .list a { padding: 17px 0px 17px 0px; text-align: right; width: 120px; }
.aw { margin-left: 50px; }
.notification-icon { width: 15px; height: 15px; border-radius: 25px; background-color: #e40f1e; font-size: 0.8rem; color: #FFF; padding: 2px; text-align: center; position: relative; right: -180px; top: -94px;opacity:0.7; }
.items .notification-icon { width: 15px; height: 15px; border-radius: 25px; background-color: #e40f1e; font-size: 0.8rem; color: #FFF; padding: 2px; text-align: center; position: relative; right: -200px; top: -94px;opacity:0.7; }
/*左側主選單*/
.sideword { margin: 0 5px; display: inline-block; /*font-size: 1.2rem;*/ vertical-align: top; word-wrap: break-word; /*width: 110px;*/ font-weight: bold; margin-left: -65px; }
.iconbasic { overflow: hidden; display: inline-block; position: relative; top: -35px; left: -35px; }
.menuicon { width: 30px; height: 30px; }
.menuleft { margin-top: -15px; margin-left: -20px; }
.sidenav { height: 100%; width: 0; position: fixed; z-index: 9999; top: 0; left: 0; background-color: #FFFFFF; overflow-x: hidden; padding-top: 60px; transition: 0.3s; box-shadow: 5px 5px 5px 0px rgba(170, 170, 170, 0.30); }
.sidenav a { padding: 8px 8px 8px 32px; text-decoration: none; font-size: 1.2rem; color: #4b606c; display: block; transition: 0.3s }
.sidenav a:hover, .offcanvas a:focus { color: #4b606c; }
.sidenav .closebtn { position: absolute; top: 0; left: 120px; font-size: 36px; margin-left: 65px; width: 20%;text-shadow:none; }
.sidenav .dropdown-btn { padding: 0; }
.sidenav a, .dropdown-btn { padding: 10px 8px 10px 16px; text-decoration: none; font-size: 16px; color: #4b606c; display: block; border: none; background: none; text-align: left; cursor: pointer; outline: none; }
.sidenav a:hover, .dropdown-btn:hover { color: #4b606c; }
.sidenav ul.menu { margin: 0 auto; }

.sidenav ul.menu .list a { padding: 10px; }
.sidenav ul.menu .list a:hover { transition: 300ms all; color: #7497ab; }
.sidenav ul.menu .list .items a { padding: 0; margin: 10px; color: #8e9192; height: 35px; margin-top: 10px; padding-top:5px; }
.side_iconbottom { position: relative; overflow: hidden; display: inline-block; margin-left: -29px; margin-right: -27px; margin-top: -27px; }
.basicbtn { display: flex; position: absolute; bottom: 40px;z-index:-1;width:240px;text-align:center; }
.basicbtn a{width:33%;text-align:center;text-shadow:none;}
.min_btn_circle { margin: 20px 0; }
.min_btn { background-color: #f2f2f2; border-radius: 35px; border: 3px solid #ebe6e2; width: 40px; height: 40px; }
.min_btn_word { display: block; font-size: .8rem; color: #8e9192; width: auto; margin: 0 auto; text-align: center; }

/*右側表單功能選單*/
.menuright { margin-top: -15px; margin-right: -20px; float: right; }
.sidenav_right .closebtn { position: absolute; top: 0; right: -10px; font-size: 36px; width: 20%; }
.sidenav_right { height: 100%; width: 0; position: fixed; z-index: 9999; top: 0; right: 0; background-color: #FFFFFF; overflow-x: hidden; padding-top: 60px; transition: 0.3s; box-shadow: -5px 5px 5px 0px rgba(170, 170, 170, 0.30); }
.sidenav_right a { padding: 8px 8px 8px 32px; text-decoration: none; font-size: 16px; color: #4b606c; display: block; transition: 0.3s;text-shadow:none; }
.sidenav_right a:hover, .offcanvas a:focus { color: #4b606c; }
.sidenav_right a:hover, .dropdown-btn:hover { color: #4b606c; }
.sidenav_right a, .dropdown-btn { padding: 0 8px 0 16px; text-decoration: none; font-size: 16px; color: #4b606c; display: block; border: none; background: none; width: 100%; text-align: left; cursor: pointer; outline: none;text-shadow:none; }
.second_itembox { border-top: 3px solid #f99a04; }
.second_item { color: #777777; margin-top: -5px; }
.pc_btnbox { margin-left: -45px; }
.pc_btn { background-color: #f99a04; width: 150px; margin: 20px 30px; height: 30px; padding: 2px 4px; color: #fff; border-radius: 45px; text-align: center; padding-top: 10px; }
/*#main { transition: margin-left .5s; padding: 20px; }*/
.dropdown-container { display: none; background-color: #7ea0b9; }
