html,body,div,ul,li,ol,h1,h2,h3,h4,h5,h6,input,textarea,select,p,dl,dt,dd,a,img,button,form,table,th,tr,td,tbody,header,nav,menu,main,article,aside,footer{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}header,nav,menu,main,article,aside,footer{display:block;margin: 0;padding: 0;}input[type=submit],input[type=reset],input[type=button],input{resize:none}img{width:auto\9;display:block;-ms-interpolation-mode:bicubic;border:none}em,i{font-style:normal}ul,li{list-style-type:none}html{font-size:62.5%;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;-webkit-overflow-scrolling:touch}body{width:100%;background:transparent;font: 1.2rem/1.5 Helvetica Neue,Helvetica,Roboto,Segoe UI,Arial,sans-serif;color: #445;}a{text-decoration:none;color:#222;transition: all .25s;}a:hover{color:#f65;text-decoration:none}ul,ol{list-style:none}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight: 400;}input,button,textarea{font-family:microsoft yahei;border:none;outline:none}a:link,a:active,a:visited,a:hover{-webkit-tap-highlight-color:transparent;-webkit-tap-highlight-color:transparent}
.inner:after,.clear:after{content:'';display:block;width:100%;visibility:hidden;height:0;clear:both}
input,.big{font-family: Helvetica Neue,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol;}
input,button,select{-webkit-appearance:none;-moz-appearance:none;outline:none;transition:all .25s;}
button,input[type="button"],select{cursor:pointer;}
select{-webkit-appearance: none;-moz-appearance: none;-ms-appearance: none;appearance: none;cursor: pointer;}
select::-ms-expand { display: none; }
select{border: none;outline: none;background: transparent url('data:image/svg+xml;base64,77u/PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij4KPHBhdGggZmlsbD0iIzc1NzY3OSIgZD0iTTIsNkwxMi4wMTYsMTYuMDE2LDIyLDZsMiwyTDEyLDIwLDAsOFoiLz4KPC9zdmc+Cg==') no-repeat right 1.6rem center;background-size: .6em;}
option:disabled{color:rgb(62, 121, 226);cursor: no-drop;background:#f6faff}
html{background: #f8f8fc;}
.inner{width:1050px;margin:0 auto}
.content{width: 728px;float:left;}
.side{width:300px;float:right;}

#header{padding: 1.8rem 0;height: 6rem;margin-bottom:3.5rem;background: #fff;box-shadow: 0 .1rem 1.2rem rgba(16, 0, 255, 0.02);}
.brand{float: left;}
.brand svg{width:6.5rem;height:2.6rem;fill-rule: evenodd;}
.brand svg .c1{fill: #445;}
.brand svg .c3{fill: #f00;}
#header h1{float: left;margin-left: 2.3rem;padding-left: 2rem;line-height: 2.2rem;position: relative;font-size: 1.6rem;color: #bbbbc1;}
#header h1:before {content: " ";display: block;width: .1rem;height: 1.7rem;position: absolute;background: #dde;left: 0;top: .2rem;}

menu ul{display:flex;width: 100%;line-height:4rem;}
menu li{display:block;width:33.33%;text-align: center;}
menu li a{display:block;height:4rem;padding:0 1.5rem;color: #fff;border-right: 1px solid #48484a;background: #525256;}
menu li a:hover{background: #ff6d6d;color:#fff}
menu li:first-child a{border-radius:.4rem 0 0;}
menu li:last-child a{border-radius:0 .4rem 0 0;border-right:0;}
menu .hover a{color: #fff;background: #f55;box-shadow: 0 0.5rem 1.5rem -.6rem rgba(255, 85, 85, 0.8);}

@media(max-width:760px){
    .inner{width:100%;margin:0;padding:0 1rem;}
    .content{width:100%;float:none;}
    .side{width:100%;float:none;}
    #header{padding: 1.8rem .8rem;margin-bottom:1.8rem;}
    menu li{}
    menu li a{padding:0;font-size:1.2rem;}
}


.box{background:#fff;line-height: 4rem;margin-bottom: 2.3rem;border-radius:.4rem;}
.date-calc{padding:2rem 3rem 3rem;border-radius:0 0 .4rem .4rem;}
.date-calc h2{text-align:center;font-weight:700;font-size:2.2rem;padding:1rem 0 2rem;}
.row-date{display:flex;padding:1rem 0;align-items:center;justify-content:center;}
.row-date select,.row-date input,.from-row input{width: 10rem;height: 4rem;border: 1px solid #d1d2d6;line-height:4rem;padding:0 1.5rem;margin:0 1rem;font-size: 1.5rem;z-index:999990;border-radius: .3rem;box-shadow: 0 0.1rem 0.2rem rgba(62, 81, 109, 0.1);}
.row-date select{background-color: #fdfdfd;}
.row-date select:hover,.row-date input:hover,.from-row input:hover{border-color:#acadb1;z-index:999998;}
.row-date select:focus,.row-date input:focus,.from-row input:focus{border-color: #ff7081;box-shadow: 0 0 0 2px rgba(255,71,99,.2);z-index:999999;}
.row-date span{font-weight:700;font-size:1.5rem;color:#919192}
.row-date label{font-weight:700;}
.row-date .r-line{border-right: 1px dotted #b3b6c1;padding-right: 2rem;}
.row-date button{height:4rem;margin-left:2rem;padding:0 2rem;border-radius: .3rem;border: 1px solid #f3f3f5;background:#f3f3f5}
.row-date button:hover{border-color:#f55;background:#f55;color:#fff;}
.btn-submit{display:block;width:12rem;height:4.4rem;margin:2rem auto;font-size:1.7rem;color:#fff;background:#f55;border-radius: .3rem;}
.btn-submit:hover{background: #ec3d3d;box-shadow:0 .6rem 1rem -.8rem rgb(255, 85, 85);}
.num-date #dnum{width: 16rem;margin-right:-1px;border-radius:.3rem 0 0 .3rem;}
.num-date #dtype{margin-left:0;border-radius:0 .3rem .3rem 0;}

.date-calc .result{background: #fffaf8;border-radius:.4rem;line-height: 3rem;padding: 1.8rem 1rem 2.4rem;text-align:center;}
.date-calc .result .hd{font-size:1.4rem;font-weight:700;color: #f55;}
.date-calc .result .big{resize:vertical;width:100%;height:auto;padding: 1.2rem 1rem 1rem;line-height:120%;text-align:center;font-size:3rem;word-wrap:break-word;color:#222;font-weight: 700;}
.date-calc .result .small{font-size:1.7rem;}

@media(max-width:760px){
    .date-calc{padding:2rem;}
    .sel-date{position:relative;padding-top:5rem;line-height:4.4rem}
    .sel-date span,.sel-date button{top:0;position:absolute;}
    .sel-date span{left:0;}
    .sel-date button{right:0;}
    .sel-date select{height:4.4rem;padding:0 1rem;border-radius:.3rem 0 0 .3rem;margin:0;background-position:right 1rem center;}
    .sel-date label{height:4.4rem;background: #f5f5f7;box-sizing:border-box;border:1px solid #d1d2d6!important;border-left:0!important;border-radius:0 .3rem .3rem 0;padding:0 1rem;margin-right:1rem;box-shadow: 0 0.1rem 0.2rem rgba(62, 81, 109, 0.1);}
	.sel-date label[for="gongli_ri"]{margin-right:0}
    .row-date .r-line{padding-right:1rem;margin-right:0;}
    .row-date button{margin-left:0;padding:0 1rem;border:0;background:#fff}
    .row-date button:hover{color:#f55;background:#fff;}

    .num-date span{display:none;}
    .num-date select{height:4.4rem;margin:0}
    .num-date input{height:4.4rem;}
    .num-date #pom{width:16rem;}

    .btn-submit{width:70%}

    
}

.tab{border-spacing:0;border-collapse:collapse;width:100%;font-size: 1.4rem;}
.tab td,.tab th{text-align:center;padding:1rem;border: 1px solid #e7e7f1;}
.tab th{background: #f3f3fb;}
.tab .xh{border-top:3px solid #e7e7f1;}

.tab tr:nth-child(odd) {background: #fcfcff;}
.tab tr:hover {background: #fffafb;color:#ec3d3d}

.tab-zodiac,.tab-zodiacs{color:#75757d;}
.tab-zodiac th{width:14%;font-weight:500;font-size:1.4rem}
.tab-zodiac .xh+tr td{font-weight:600;color:#292727}
.tab-zodiacs tr:nth-child(odd) td{color:#292727}

.from-box{border: solid #f8f8fc;border-width: 1rem 0;margin: 2rem -3rem;padding:2rem 0 4rem;}

.from-row{display:flex;justify-content: center;line-height: 4.4rem;}
.from-row input{width:40%;line-height: 2rem;height: 4.4rem;}
.from-row .btn-submit{margin:0;}
.zodiac{font-size:1.5rem;line-height:2em;}
.zodiac p{padding:1rem 0;}
.zodiac .zodiac-res{background: #fffaf8;border:1px dashed #daa3a3;text-align:center;font-size:2rem;padding:2rem;margin-bottom:1rem;}

.zodiac-near{display:flex;justify-content:space-between}
.zodiac-near a{display: block;width:49%;padding: 0 .5rem;text-align: center;background: #f6f6f8;}
.zodiac-lnk{padding:2rem 0 0;color:#98999c}
.zodiac-lnk a{margin:0 .8rem}
.constellations{padding:2rem 0 1rem;font-size:1.4rem}


.age-calc .row-date{padding: 1.5rem 0;}
.age-calc .row-date button{width:14%;font-size:1.7rem;color:#fff;background:#f55;border:0;}
.age-calc .row-date button:hover{background: #fd3535;box-shadow: 0 .4rem 1.6rem -0.2rem rgba(255, 85, 85, 0.8);}
.age-calc .row-date select:nth-of-type(n+2){width:8.6rem;}
.age-calc #result{display:none;margin-top:3rem;font-size:1.4rem;padding:.4rem 4rem 3rem;}
.age-calc #result li{position: relative;text-align: left;padding: 1rem 0 1rem 20%;line-height:3rem;border-top:1px solid #f7eeeb;}
.age-calc #result li label{position: absolute;top: 1rem;width:20%;text-align:left;color: #716d6c;left: 0;}
.age-calc #result li span{font-weight:700}
.age-calc #result li i{font-size:1.2rem;margin-left: 1rem;color: #968f8f;}
.age-calc #result #shisui,.age-calc #result #xusui{color:#E00;font-size:1.6rem}
.age-calc #result-hd{padding:1.5rem;}
.age-main{font-size:1.5rem;padding:0 0 4rem;line-height:2em;}
.age-main p,.age-main table{padding:.4rem 0;}
.age-age{background: #fffaf8;border: 1px dashed #daa3a3;text-align: center;font-size:1.7rem;padding: 2rem;margin: 1rem 0;}
.shu-list ul{margin:0 -.5rem;}
.shu-list li{float:left;width:25%;display: block;line-height:4.4rem;padding:.6rem .5rem;}
.shu-list li a{display: block;padding:0 .5rem;text-align:center;background: #f3f3f5;}
.shu-list li a:hover,.caln-more li .now{color: #fff;background:#f55;box-shadow: 0 0.5rem 1.5rem -.6rem rgba(255, 85, 85, 0.8);}
hr{border: dashed #dbdbe0;border-width: 1px 0 0;margin: 1.6rem 0 0;padding: 1.6rem 0 0;}
@media(max-width:760px){
    .tab{font-size: 1.2rem;}
    .tab td,.tab th{padding:.2rem;}
.from-box{margin: 2rem -2rem;}
.from-row input{width:36%;}
.from-row .btn-submit{width:30%}
    .age-calc .row-date{padding:4.4rem 0 7rem;}
    .age-calc .row-date button{width:100%;top:auto;bottom:1.5rem;}
    .shu-list li{width:50%;}
    .age-calc #result{display:none;margin:3rem -2rem;padding:.4rem 2rem 3rem;}
    .age-calc #result li{padding: 1rem 0 1rem 35%;}
    .age-calc #result li label {width: 35%;}

}

.infor{background: #fcfcfe;line-height:180%;padding:2.3rem 3rem;margin-bottom:2.3rem;border-radius:.4rem;font-size:1.4rem;color: #707075;}
.infor h2{font-weight:700;font-size:1.6rem;}
.infor p{padding:.5rem 0;}

.sidenav{margin-top: 2rem;}
.sidenav ul{margin:0 -.3rem;}
.sidenav li{width:50%;display:block;float:left;padding:.3rem;line-height: 3.8rem;text-align: center;}
.sidenav li a{display:block;background: #fcfcfe;border-radius:.3rem;}
.sidenav li a:hover{background:#fff;}

footer{padding: 4rem 0 5rem;margin: 2rem 0 0;text-align:center;color:#96969a;}
footer a{color:#89898e;margin:0 .6rem;}

@media(max-width:760px){
    .tables{display:block;}
    .table:nth-child(2){margin-left:0;}
}

.article{background:#fff;line-height:200%;font-size:1.5rem;padding:2rem 3rem;margin-bottom: 2.3rem;border-radius:.4rem;box-shadow: 0 0.1rem 1rem -0.2rem rgba(93, 90, 138, 0.1);}
.article p,.article div{padding:1rem 0;}
.article h2,.article h3{font-size:1.7rem;font-weight:700;padding: .5rem 0 0;}
.atab table{width:100%;font-size:1.2rem;border-collapse: collapse;margin: 0 0 1rem;}
.atab td {border:1px solid #e7e7f1;text-align:center;line-height:3.6rem;}
.atab th{background: #f3f3fb;line-height:4rem;border:1px solid #e7e7f1;}
.atab tbody tr:nth-child(2n+1) {background: #fcfcff;}
.atab tbody tr:hover {background: #fffafb;color:#ec3d3d}


@media(max-width:760px){
    .article{padding:1rem 2rem;font-size:1.4rem;}
    .ascii .atab tr td:nth-child(2),.ascii .atab tr th:nth-child(2),.ascii .atab tr td:nth-child(4),.ascii .atab tr th:nth-child(4){display:none}

}
.calendar-head{position:relative;background: #525256;text-align:center;color:#fff;line-height:5rem;border-radius:.4rem .4rem 0 0;}
.calendar-head a{position:absolute;display:block;top:0;color: #fff;line-height:5rem;padding:0 2.4rem;background:#f55;}
.calendar-head a:hover{box-shadow: 0 0.5rem 1.5rem -.6rem rgba(255, 85, 85, 0.8);}
.calendar-head .l{left:0;border-radius:.4rem 0 0 0;}
.calendar-head .r{right:0;border-radius:0 .4rem 0 0;}
.calendar-head h2{font-weight:700;font-size:1.7rem;}
.calendars{display:flex;flex-wrap:wrap;}
.calendars .caln-box{width:100%;padding:2.5rem 3rem 4rem;border-bottom:1rem solid #f8f8fc;}
.calendars .caln-head{border-bottom: 1px solid #a8a9ad;}
.caln-head{font-size: 2rem;text-align:center;font-weight: 400;padding:0 0 1.5rem;}
.caln{width:100%;border:0;border-spacing: 0;}
.caln .outter{opacity: .3;}
.caln th div{border-bottom: 1px solid #ececec;margin-bottom:1rem;}
.caln td{width:14.2857%;width:calc(100% / 7);line-height:2rem;font-size:1.8rem;text-align:center;}
.caln td div{padding:1rem 0;border:1px solid #fff;border-radius:.1rem; transition:all .2s;}
.caln td div:hover{border-color: #565658;}
.caln td .weekend{color:#a22}
.caln span{display:block;width:100%;font-size:1.1rem;color:#929294;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
.caln span font{color:#5b5b5d}
.caln td .today{border-color:#f60!important;color:#f00;}
.caln td .today span{color:#222}
.calendar{padding:3rem;}
.calendar .caln th div{background:#f9f9fb;line-height:5rem;margin-bottom:1.5rem;border:0;}
.calendar .caln td div{padding:1.6rem 0;}
.calendars .caln-more{padding:1.5rem 3rem 3rem;width: 100%;}
.calendars .caln-more h3{text-align:center;padding:0 0 1rem}
.calendar .caln-more{padding:3rem 0 1.5rem;margin:3rem 1rem 0;border-top:1px dotted #999;}
.caln-more ul{display:flex;width: 100%;}
.caln-more li{width: 10%;display: block;padding:0 .2rem;}
.caln-more li a{display: block;padding:0 .5rem;text-align:center;background: #f3f3f5;}
.caln-more li a:hover,.caln-more li .now{color: #fff;background:#f55;box-shadow: 0 0.5rem 1.5rem -.6rem rgba(255, 85, 85, 0.8);}

@media(max-width:760px){
    .calendar {padding: 3rem 1.4rem;}
    .calendars .caln-box {padding: 2.5rem 1.4rem 4rem;}
    .caln-more ul{display:block;}
    .caln-more ul:after{content:'';display:block;width:100%;visibility:hidden;height:0;clear:both}
    .caln-more li{float:left;width: 20%;padding:.8rem .2rem;}

}