@charset "utf-8";
/* CSS Document */

.sp-div{clear:both; margin-bottom:20px;}
.spno{ display:none;}


/*▼▼▼▼▼初期化▼▼▼▼▼*/
body, div, dl, dt, dd, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, ul, li, blockquote, th, td, tr, img { padding: 0px; margin: 0px; font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", ns-serif; font-size: 16px; line-height: 1.5em; letter-spacing: 1px; }
table { border-collapse: collapse; }
ul, li { list-style: none; }
h1, h2, h3, h4, h5, h6 { padding: 0px; margin: 0px; font-size: 100%; font-weight: normal; }
a { overflow: hidden; outline: none; }
img { border: none; vertical-align: bottom; }
table td { border: none; vertical-align: top; }
h1 { text-indent: -9999px; }
h3 { text-indent: -9999px; }
h4 { text-indent: -9999px; }
.text99 { text-indent: -9999px; }
a:hover { text-decoration: none; }
a:hover { opacity: 0.5; filter: alpha(opacity=50); }
body * { -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; transition: 0.5s; }
/*▲▲▲▲▲初期化▲▲▲▲▲*/


.kadomaru{-webkit-border-radius: 10px;-moz-border-radius: 10px;border-radius:10px;behavior: url(/pie/PIE.htc);}
.mincho {font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;}	
.marugo{font-family:"ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";}
.textshadow{text-shadow: 1px 1px 10px #666666,
    -1px 1px 10px  #666666,
    1px -1px 10px  #666666,
    -1px -1px 10px  #666666;}

/*▼エリア・背景設定▼*/
body {  text-align: center; min-width:480px;}
#body-top {}
#body-bottom { }
#body-bottom-01{}
#conteiner { width:480px; margin: 0 auto; overflow: hidden; text-align: left;}
#home #main {}
#main { background:none;width:480px;overflow: hidden;clear:both;padding-bottom:100px; padding-top:20px;}


#mleft {  width:460px; margin:auto;}
#mright {  width:460px; margin:auto; display:none;}
#mright_youtube {  width:460px; margin:auto; }
.youtube { margin:auto;margin-bottom:50px;height: 0; overflow: hidden; padding-bottom: 124.5%; /* (1663 / 935) * 70 */ position: relative; width: 70%; max-width: 935px; /* 最大幅を935pxに制限 */}
.youtube iframe { position: absolute; left: 0; top: 0; height: 100%; width: 100%; }




/*▼ヘッダー▼*/
#header {width: 480px; overflow: hidden; margin:auto;}
#header .top { width:480px; overflow:hidden;}
#header .left { width:460px; margin:auto;}
#header .right { width:311px; overflow:hidden; margin:auto;padding-top:9px; margin-bottom:20px; text-align:center;}
#header h1 { height:22px; overflow: hidden; }
#header #hname a { width:460px; height:52px; background-size:100%;display: block; text-indent: -9999px; background-image: url(../images2/common/hname.png);}
#header .right .area-01{ width:311px; overflow:hidden;}

#header #htel a{ background: url(../images2/common/htel.jpg) 0 0 no-repeat; width:311px; height:34px; display:block; text-indent:-9999px; margin-bottom:7px;}
#header #hmail a{ background: url(../images2/common/hmail.jpg) 0 0 no-repeat; width:311px; height:41px; display:block; text-indent:-9999px;}
#header #line { width:150px; overflow:hidden; margin:auto 0 50px;}


/*▼メインナビゲーション▼*/
#navi{ margin-left:171px;width:853px; height:62px; display:none;}

#navi ul li {  text-indent: -9999px; }
#navi ul li a { height: 62px; display: block; background-image:url(../images2/common/navi.jpg);}
#navi ul li a:hover{ background-image:;}
#navi ul li#navi01 a { background-position: 0 0; width:77px; }
#navi ul li#navi02 a { background-position: -77px 0; width:252px; }
#navi ul li#navi03 a { background-position: -329px 0; width:131px; }
#navi ul li#navi04 a { background-position: -460px 0; width: 155px; }
#navi ul li#navi05 a { background-position: -615px 0; width: 238px; }







/*▼フッター▼*/
/*.page-top {
	  position: fixed;
    bottom: 60px;
    right: 40px;
	background-image: url(../images2/common/totop.png);
	width:76px; height:76px; text-indent:-9999px;
    -ms-filter: "alpha(opacity=80)";
    -moz-opacity: 0.8;
    -khtml-opacity: 0.8;
    opacity: 0.8;
	-webkit-transition: 0s; -moz-transition: 0s; -ms-transition: 0s; transition: 0s;
}*/
.totop { width:197px;margin-bottom:70px; padding-top:16px; margin:auto;}
.totop a { width:197px; height:26px; display: block; background-image: url(../images2/common/to-top.jpg);text-indent: -9999px;}
#footer {}
#footer .fmid { width: 460px; overflow: hidden; margin:auto;clear:both;}
#footer .left { width:460px; }
#footer .right { width:460px;  padding-top:40px;}
#footer .fname{margin-bottom:15px; padding-top:0px;}
#footer .fname a { width:425px; height:101px; display: block; text-indent: -9999px; background-image: url(../images2/common/fname.png); margin:auto;}
#footer #fadd { padding:10px 0 10px 0px; background-color:#FDECF6;-webkit-border-radius: 10px;-moz-border-radius: 10px;border-radius:10px;behavior: url(/pie/PIE.htc);}
#footer .ftel a { width:311px; height:36px; display: block; text-indent: -9999px; background-image: url(../images2/common/ftel.jpg); margin:auto;}



#footer ul{width:460px;  overflow:hidden;padding-top:20px; margin-bottom:30px;}
#footer ul li { background:url(../images2/common/fmark.jpg) 0 6px no-repeat; padding:6px; padding-left:18px;font-size:16px; background-color:#ffe6e6; border-bottom:#FFF solid 1px;}
#footer ul li a { text-decoration: none; color: #0f6d3f; }


#footer #tamonten { clear: both;text-align:center; font-size:10px; display:none;}
#footer #tamonten a {display: block; cursor: default; color: #333; text-decoration:none; opacity: 1; filter: alpha(opacity=100); }

/*▼メインカラム共通▼*/


#mleft h2 {text-indent:0px;color:#0d6539; font-size:24px; margin-bottom:20px;font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;text-shadow: 1px 1px 5px #fff,
    -21px 1px 5px  #fff,
    1px -1px 5px  #fff,
    -1px -1px 5px  #fff;}
	
#mleft h3 { background:url(../images2/common/h3.jpg) 0 0 no-repeat; padding:8px 0px 8px 20px; text-indent:0px; color:#f859a0; font-size:20px; margin-top:10px; margin-bottom:15px; font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;}

#mp{width:480px;background-image:url(../images2/common/mpsp.jpg); padding:10px 0px;}

#mp p{ font-size:30px; font-weight:bold; text-align:center;font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
text-shadow: 1px 1px 10px #fff,
    -1px 1px 10px  #fff,
    1px -1px 10px  #fff,
    -1px -1px 10px  #fff;color:#1e8150;}


#center #mp p.p-01,
#company #mp p.p-01,
#contact #mp p.p-01,
#day #mp p.p-01,
#dayservice #mp p.p-01,
#longstay #mp p.p-01,
#management #mp p.p-01,
#recruit #mp p.p-01,
#shortstay #mp p.p-01{font-size:25px; padding-top:0px;}


/*▼右カラム▼*/
#mright .banner a{ width:300px;display:block; margin-bottom:20px; text-indent:-9999px;}
#mright #banner-01 a{background-image: url(../images2/common/banner-01.jpg); height:182px;}
#mright #banner-02 a{background-image: url(../images2/common/banner-02.jpg); height:96px;}
#mright #banner-03 a{background-image: url(../images2/common/banner-03.jpg); height:182px;}
#mright #banner-04 a{background-image: url(../images2/common/banner-04.jpg); height:96px;}
#mright #banner-05 a{background-image: url(../images2/common/banner-05.jpg); height:257px;}
#mright #ig { width:460px; margin-bottom:20px;}
#mright #fb { width:460px; margin-bottom:20px;}



/*▼▼▼▼▼ホーム▼▼▼▼▼*/
#home #mp {width:480px; height:260px;clear: both; text-indent:-9999px; background:url(../images2/home/mpsp.jpg) no-repeat;}

#home #mleft .box{ width:460px; overflow:hidden; margin-bottom:50px;}
#home #mleft .box-bnr{ margin-bottom:20px;}
#home #mleft .box-bnr img{ max-width:100%;}

#home #mleft #box-01{ background:url(../images2/home/box-01sp.png) 0 0 no-repeat; width:460px; height:267px;}
#home #mleft #box-01 .tb-01{ height:147px; text-indent:-9999px;}
#home #mleft #box-01 .inner{ width:460px;}

#home #mleft h2{ font-size:20px; background-color:#ffefef; font-weight:bold; margin-bottom:10px; color:#0d6539;text-align:center; padding:5px; background-image:none;}

#home #mleft #box-02{ min-height:320px; margin-bottom:50px;}
#home #mleft #box-02 .inner{width:460px; padding-top:20px;}
#home #mleft li{ background:url(../images2/home/ico.jpg) 0 4px no-repeat; padding-left:20px; margin-bottom:10px;}
#home #mleft li.li-01{ font-weight:bold;}


#home #mleft #box-03{ width:460px; overflow:hidden;margin-bottom:50px;}
#home #mleft #box-03 .left{ width:460px; }
#home #mleft #box-03 .right{ width:460px; }
#home #mleft #box-03 .inner{}
#home #mleft #box-03 .map{ background:url(../images2/home/map.jpg) right 0 no-repeat; padding-top:20px; min-height:141px;}

#home #mleft #box-04 table{ width:460px;}
#home #mleft #box-04 table td{ padding-bottom:10px; padding-top:10px; border-bottom:#999 solid 1px;}
#home #mleft #box-04 table td.td-01{ width:150px; background:url(../images2/home/ico.jpg) 0 14px no-repeat; padding-left:25px; color:#0d6539; font-weight:bold;}
#home #mleft #box-04 table tr:last-child td.td-01{ border:none; padding:0px; padding-top:10px; padding-left:25px;}
#home #mleft #box-04 table tr:last-child td{ border:none; padding:0px; padding-top:10px;}


#home #mleft .p-01{ font-weight:bold;}
#home #mleft .p-02{ margin-left:30px;}
#home #mleft .p-03{ padding-left: 1em;text-indent: -1em;}

#home #mleft .banner-07{ display:block; margin:40px auto 0;}


/*▼▼▼▼▼notice▼▼▼▼▼*/

#notice #mleft #box-01{ background-image: url(../images2/notice/box-01sp.jpg); width:460px; height:2119px; text-indent:-9999px; margin-bottom:50px;}
#notice #mleft #box-02-top{ background-image: url(../images2/notice/h3-01sp.jpg); width:460px; height:48px; text-indent:-9999px;}
#notice #mleft #box-02{ border:#FA599F solid 2px; background-color:#FEF8F8;padding:20px; margin-bottom:50px;border-bottom-left-radius: 6px; 
border-bottom-right-radius: 6px; 
-webkit-border-bottom-left-radius: 6px; 
-webkit-border-bottom-right-radius: 6px;
-moz-border-radius-bottomleft: 6px;
-moz-border-radius-bottomright: 6px;
}

#notice #mleft .area{border:#FA599F solid 2px; background:url(../images2/notice/area.jpg) 0 0 repeat; padding:20px;border-bottom-left-radius: 6px; 
border-bottom-right-radius: 6px; 
-webkit-border-bottom-left-radius: 6px; 
-webkit-border-bottom-right-radius: 6px;
-moz-border-radius-bottomleft: 6px;
-moz-border-radius-bottomright: 6px;}
#notice #mleft .area h3{ background:url(../images2/notice/h3.png) 0 0 no-repeat; margin-bottom:15px; text-indent:0px; padding:9px 0px 7px 50px;color:#f859a0; font-size:20px;font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;text-shadow: 1px 1px 5px #fff,
    -21px 1px 5px  #fff,
    1px -1px 5px  #fff,
    -1px -1px 5px  #fff;}

#notice #mleft .p-01{ color:#f859a0; font-weight: bold; font-size:18px; margin-bottom:15px; letter-spacing:normal;}
#notice #mleft .p-02{padding-left: 1em;text-indent: -1em; font-size:12px;}
#notice #mleft li{ background: url(../images2/notice/ico.png) 0 4px no-repeat; padding-left:20px; }
#notice #mleft li.li-01{ font-weight:bold;}
#notice #mleft .margin-bottom20{margin-bottom:20px;}
#notice #mleft .yazirushi{ background-image:url(../images2/notice/shita.jpg); width:51px; height:27px; margin:auto; margin-bottom:20px; text-indent:-9999px;}

/*▼▼▼▼▼contact▼▼▼▼▼*/
#contact #mleft .box{margin-bottom:50px; width:694px; overflow:hidden; clear:both;}
#contact #mleft #box-01{width:460px;margin-bottom:50px;}

#contact #mleft #box-01 .tel a{ background-image: url(../images2/contact/tel.png); width:460px; height:46px; background-size:100%;display:block; text-indent:-9999px; margin:auto; margin-bottom:10px;}
#contact #mleft #box-01 .tb-01{}
#contact #mleft #box-01 p{ text-align:center;font-weight:bold; font-size:18px; color:#666;font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;}
#contact #mleft .textbox{margin-bottom:20px;}

#contact #mleft #box-02{}

#contact #mleft #box-02 table { width:460px; margin:auto;}
#contact #mleft #box-02 table th { width:200px; padding:5px;border:#CCC solid 1px; color:#096536;}
#contact #mleft #box-02 table td { padding:5px; border:#CCC solid 1px;}
#contact #mleft #box-02 table .bk-01{ background-color:#FEF8F8;}
#contact #mleft #box-02 table .bk-02{ background-color:#e7faf0; color:#900; font-weight:bold;}
#contact #mleft #pp { overflow:scroll; width:460px; height:240px; border:1px solid #cccccc; margin-top:30px;}

#contact #mleft .p-01{ font-size:12px;padding-left: 1em;text-indent: -1em;}
#contact #mleft .p-02{ letter-spacing:normal; margin-bottom:10px;}
#contact #mleft .p-03{ color:#D94543;}

#contact #mleft #box-03 { width:460px;margin-bottom:50px;}
/*#contact #mleft #box-03 .tel a{ background-image: url(../images2/contact/line.jpg); width:460px; height:46px; background-size:100%;display:block; text-indent:-9999px; margin:auto; margin-bottom:10px;}*/
#contact #mleft #box-03 .tb-01{}
#contact #mleft #box-03 p{ text-align:center;font-weight:bold; font-size:18px; color:#666;font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;}
#contact #mleft .textbox{ margin-bottom:20px;}
#contact #mleft #box-03 img { display:block; margin:0 auto;}
#contact #mleft p.attention { color:#F00; font-weight:bold; font-size:20px; text-align:left; margin-bottom:10px;}
#contact #mleft p.attention2 { color:#F00; font-weight:bold; font-size:20px; text-align:left;}


/*▼▼▼▼▼recruit▼▼▼▼▼*/
#recruit #mp { background-size:160%;}
#recruit #mp p .span{ display:block; font-size:18px; line-height:1.8em;}
#recruit #mp p .pink{ font-size:20px;}
#recruit .pink{ color:#f80d76;}

#recruit #mleft .p-01{ font-size:12px;padding-left: 1em;text-indent: -1em;}
#recruit #mleft .p-02{ letter-spacing:normal; margin-bottom:10px;}
#recruit #mleft .p-03{ color:#D94543;}

#recruit #mleft .box{margin-bottom:50px; width:460px; overflow:hidden; clear:both;}
#recruit #mleft #box-01{ background-image:url(../images2/recruit/img-01.jpg); background-size:100%;width:460px; height:1264px; margin-bottom:50px; text-indent:-9999px;}

#recruit #mleft #box-02 table { width:460px; margin:auto;}
#recruit #mleft #box-02 table th { padding:5px;border:#CCC solid 1px; color:#096536; padding:10px;}
#recruit #mleft #box-02 table td { padding:5px; border:#CCC solid 1px; padding:10px;}
#recruit #mleft #box-02 table .bk-01{ background-color:#FEF8F8;}

#recruit #mleft #box-03 table { width:460px; margin:auto;}
#recruit #mleft #box-03 table th { width:200px; padding:5px;border:#CCC solid 1px; color:#096536; padding:10px;}
#recruit #mleft #box-03 table td { padding:5px; border:#CCC solid 1px; padding:10px;}
#recruit #mleft #box-03 table .bk-01{ background-color:#FEF8F8;}

#recruit #mleft #box-04{width:460px;margin-bottom:50px;}
#recruit #mleft #box-04 .tel a{ background-image: url(../images2/contact/tel.png); width:460px; height:46px; background-size:100%;display:block; text-indent:-9999px; margin:auto; margin-bottom:10px;}
#recruit #mleft #box-04 .tb-01{text-indent:-9999px;}
#recruit #mleft #box-04 p{ text-align:center;font-weight:bold; font-size:18px; color:#666;font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;}

#recruit #mleft #box-05{width:460px;margin-bottom:50px;}
#recruit #mleft #box-05 .tel a{ background: url(../images2/recruit/line.png); width:460px; height:108px; background-size:100%;display:block; text-indent:-9999px; margin:auto; margin-bottom:10px;background-size:cover;}
#recruit #mleft #box-05 .tb-01{text-indent:-9999px;}
#recruit #mleft #box-05 p{ text-align:center;font-weight:bold; font-size:18px; color:#666;font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;}
#recruit #mleft .textbox{margin-bottom:20px;}

#recruit #mleft #box-youtube{ overflow:hidden;}
#recruit #mleft #box-youtube .entry{margin-bottom:30px;}
#recruit #mleft #box-youtube .entry:last-child{ margin-bottom:0px;}


/*▼▼▼▼▼system▼▼▼▼▼*/

#system #mleft h3 { background-color: #f1eeee; border:#fb9c9d solid 1px;background-image:none;padding:5px 0px 5px 10px; text-indent:0px; color:#f859a0; font-size:20px; margin-top:10px; margin-bottom:15px; font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;}


#system #mleft .p-01{ font-size:30px; color:#f859a0; font-weight:bold; line-height:1.2em;}
#system #mleft .p-02{ letter-spacing:normal; margin-bottom:10px;}
#system #mleft .p-03{ color:#D94543;}

#system #mleft .box{ margin-bottom:50px; width:460px; overflow:hidden; clear:both;}

#system #mleft #img-01 { background-image:url(../images2/system/img-01.jpg); background-size:100%;width:460px; height:62px; text-indent:-9999px; margin-bottom:30px;}
#system #mleft #img-02 { background-image:url(../images2/system/img-02.jpg); background-size:100%; width:460px; height:72px; text-indent:-9999px; margin-bottom:30px;}
#system #mleft #img-03 { background-image:url(../images2/system/img-03.jpg); background-size:100%; width:460px; height:62px; text-indent:-9999px; margin-bottom:30px;}


#system #mleft #box-02 { margin-top:-50px;}
#system #mleft #box-02 table { width:460px; margin:auto;}
#system #mleft #box-02 table th { width:220px; padding:5px;border:#CCC solid 1px; color:#096536; padding:10px;}
#system #mleft #box-02 table td { padding:5px; border:#CCC solid 1px; padding:10px;  vertical-align: middle;}
#system #mleft #box-02 table .bk-01{ background-color:#FEF8F8;}

#system #mleft #box-03 { margin-top:-30px;}
#system #mleft #box-03 table { width:460px; margin:auto;}
#system #mleft #box-03 table th { width:200px; padding:5px;border:#CCC solid 1px; color:#096536; padding:10px;}
#system #mleft #box-03 table td { padding:5px; border:#CCC solid 1px; padding:10px;}
#system #mleft #box-03 table .bk-01{ background-color:#FEF8F8;}

#system #mleft h4#h4-01 { background-image:url(../images2/notice/h3-02sp.jpg); width:460px; height:46px; text-indent:-9999px;}
#system #mleft h4#h4-02 { background-image: url(../images2/notice/h3-01sp.jpg); width:460px; height:46px; text-indent:-9999px;}
#system #mleft #box-pink { border:#FA599F solid 2px; background-color:#FEF8F8;padding:20px; margin-bottom:50px;border-bottom-left-radius: 6px; 
border-bottom-right-radius: 6px; 
-webkit-border-bottom-left-radius: 6px; 
-webkit-border-bottom-right-radius: 6px;
-moz-border-radius-bottomleft: 6px;
-moz-border-radius-bottomright: 6px;
}

#system #mleft #box-pink ul { margin:10px auto;}
#system #mleft #box-pink ul li { background:url(../images2/system/ico.jpg) 0 5px no-repeat; padding-left:23px;}


#system #mleft #box-05 { margin-bottom:50px;}
#system #mleft #box-05 .area-01{ padding:0 10px; margin-bottom:30px;}
#system #mleft #box-05 .area-01 p span{ font-size:18px; font-weight:bold; color:#f859a0;}
#system #mleft #box-05 .area-01 .p-min{ font-size:13px; color:#f00; letter-spacing:normal; padding-top:20px;}
#system #mleft #box-05 .area-02{ text-align:center;}
#system #mleft #box-05 .area-02 h3{ text-align:left; margin-bottom:15px;}
#system #mleft #box-05 .area-02 img{ margin:0 10px; max-width:95%;}
#system #mleft #box-05 .area-02 p{ text-align:left; padding:20px 10px 0;}
#system #mleft #box-05 .area-02 p span{ color:#f859a0;}
#system #mleft #box-05 .area-02 .inner{ background:#f5f5f5; font-size:14px; line-height:1.7em; letter-spacing:normal; padding:20px; text-align:left; margin-top:20px;}



/*▼▼▼▼▼スマホ用メニュー▼▼▼▼▼*/

.menu-box * { -webkit-transition: 0s; -moz-transition: 0s; -ms-transition: 0s; transition: 0s;opacity: 1; filter: alpha(opacity=100);}
.menu-box{ margin-bottom:0px;}

#menu{
  width: 100%;
  max-width: 960px;
  margin: 0 auto;
  padding: 0;
}
#menu li{
  display: block;
  float: left;
  width: 12.5%;
  margin: 0;
  padding: 0;
  border-bottom: 1px solid #444;}
#menu li a{
  display: block;
  padding: 12px 0 10px;
  background: #44c787;
  color: #fff;
  text-align: center;
  text-decoration: none;
}

#toggle{ 
 display: none;
}
@media only screen and (max-width: 768px) {
    #menu li{
    width: 25%;
    border-bottom: 1px solid #444;
  }
}
@media only screen and (max-width: 480px) {
  #menu{
    display: none;
  }
  #menu li{
    width: 100%;
  }
  #toggle{
    display: block;
    position: relative;
    width: 100%;
    background: #44c787;
	border-bottom: 1px solid #444;
  }
  #toggle a{
    display: block;
    position: relative;
    padding: 12px 0 10px;
    color: #fff;
    text-align: center;
    text-decoration: none;
  }
  
    #toggle a:hover{
	 transition: 0s;opacity: 1; filter: alpha(opacity=100);
  }
  #toggle:before{
    display: block;
    content: "";
    position: absolute;
    top: 50%;
    left: 10px;
    width: 20px;
    height: 20px;
    margin-top: -10px;
    background: #fff;
  }
  #toggle a:before, #toggle a:after{
    display: block;
    content: "";
    position: absolute;
    top: 50%;
    left: 10px;
    width: 20px;
    height: 4px;
    background: #44c787;
  }
  #toggle a:before{
    margin-top: -6px;
  }
  #toggle a:after{
    margin-top: 2px;
  }