html.body,div,header,nav,menu,main,article,aside,footer,ul,li,h1,h2,h3,h4,p,label,input,button{display:block;margin:0;padding:0;box-sizing:border-box}
input[type="submit"],input[type="reset"],input[type="button"],input{resize:none}
img{width:auto\9;display:block;-ms-interpolation-mode:bicubic;border:0}button{cursor:pointer;transition:all .25s}
em,i{font-style:normal}ul,li{list-style-type:none}html{background:#fff;font-size:62.5%;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;-webkit-overflow-scrolling:touch}
html{background:#f8f8f9;background-image:linear-gradient(45deg,#fff4fc,#e9efff);height:100%;background:#003}
body{width:100%;margin:0 auto;font:1.4rem/1.5 arial,helvetica,sans-serif}
a{text-decoration:none;color:#3e3e46}a:hover{text-decoration:none}ul,ol{list-style:none}
h1,h2,h3,h4,h5,h6{font-size:100%}input,button,textarea{font-family:arial,helvetica,sans-serif;border:0;outline:0}
a:link,a:active,a:visited,a:hover{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent}
.clear:after,main:after,.container:after{display:table;content:"";line-height:0;clear:both}
body,select,input,textarea,button {font:1.4rem/2em "Trebuchet MS",Helvetica,"Microsoft YaHei",arial,sans-serif;color:#6b6b71}
button{-webkit-tap-highlight-color:rgba(0,0,0,0)}

.container{width:728px;margin:0 auto}
.ggt{min-height: 90px;}
.ggb{display:flex;justify-content:space-between;min-height:280px;margin-bottom: 2.4rem;}
.ggb .ggs{width:49%;}


header{padding:0 0 3rem}
nav{height:6rem;padding:1rem 2rem}
.brand{float:left}
.brand a{display:block;padding:1rem 1rem 0}
.brand svg{width:3.2rem;height:3.2rem}
.brand .c1{fill:#6fa;transition:all .25s}
.brand .c2{fill:#003;fill-rule:evenodd}
.brand .c3{fill:#fff;fill-opacity:0;stroke:#003;stroke-linejoin:round;stroke-width:3px}
.brand a:hover .c1{fill:#5ea}
.navbar{position:relative;float:right;padding:1rem 4.3rem;color:#d6d6e2}
.navbar span{display:block;cursor:pointer;transition:all .25s}
.navbar span:after{position:absolute;top:50%;right:2.5rem;display:block;height:.625em;width:.625em;margin-top:-.4em;pointer-events:none;border:.15rem solid transparent;border-radius:.2rem;border-right:0;border-top:0;content:" ";transform:rotate(-45deg);transform-origin:center;box-sizing:inherit;border-color:#d6d6e2;transition:all .2s}
.navbar-dropdown{position:absolute;top:4.3rem;right:0;width:15rem;max-height:26rem;overflow-y:scroll;z-index:99999;padding:.6rem 0;box-shadow:0 0 3rem rgba(0,0,0,.08);background:#fff;border-radius:.3rem;line-height:3.2rem;display:none}
.navbar-dropdown a{display:block;padding:0 1.6rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition:all .25s}
.navbar-dropdown a:hover{padding:0 1.8rem;background:#6fa}
.navbar-dropdown::-webkit-scrollbar{width:.4rem;height:.4rem}
.navbar-dropdown::-webkit-scrollbar-track{background:rgba(255,255,255,0)}
.navbar-dropdown::-webkit-scrollbar-thumb{background:#c5c5ca;border-radius:.2rem}
.navbar:hover .navbar-dropdown{display:block}
.navbar:hover span{color:#6fa}
.navbar:hover span:after{transform:rotate(135deg);margin-top:-.1em;border-color:#6fa}

@media(max-width:760px){
 .container{width:100%;margin:0}
 .ggb .ggs{width:100%;}
 .is_m{display:none}
 header{padding:0}
 nav{padding:1rem 1.8rem}
.brand a{padding:.6rem 0 0}
.brand svg{width:2.6rem;height:2.6rem}
.navbar{padding:.8rem 2rem}
.navbar span:after {right:0.5rem}
}

h1,h2{text-align:center}
.home_title h1{padding:3.6rem 0 1rem;font-size:3rem;color:#6fa}
.home_title h2{padding:0 0 2rem;font-size:1.5rem;font-weight:400;color:#b2b3b6}
.page_title h1{padding:2rem 0 0;font-size:1rem;font-weight:200;line-height:1em}
.page_title h2{padding:2rem 0 3.8rem;font-size:3rem;color:#6fa}


.calculator{padding:3rem 0 2.8rem;box-sizing:border-box}


.cal_inputs{display:none;transition:opacity .15s linear}
.cal_inputs.active{display:flex}
.cal_inputs label{position:relative;width:37.5%;margin-right:1rem;line-height:6rem;box-sizing:border-box}
.cal_inputs label i{position:absolute;left:.2rem;bottom:4.5rem;color:#b2b3b6}
.cal_inputs label span{position:absolute;right:2rem;bottom:0;animation:unitfirst .15s;-webkit-animation:unitfirst .15s}
@keyframes unitfirst{0%,100%{transform:scale(1)}50%{transform:scale(2)}}
@-webkit-keyframes unitfirst{0%,100%{-webkit-transform:scale(1)}50%{-webkit-transform:scale(2)}}
.enter{height:6rem;padding:1.9rem 4rem 2.1rem 2rem;background:#ebeef5;line-height:2rem;width:100%;border-radius:1rem;transition:all .25s;font-size:2.3rem}
.enter::placeholder,.enter::-webkit-input-placeholder{color:#556;font-size:1.7rem;transition:all .25s}
.enter:focus{background:#fff}
.enter:focus::placeholder{color:#dddfe2}
.cal_inputs button{width:25%;background:#6fa;border-radius:1rem;color:#003;font-weight:700;font-size:1.7rem;transition:all .25s}
.cal_inputs button:hover{background:#5ea}
.cal_inputs label.height{width:24%;}
.cal_inputs label.noright{margin-right:.3rem}

.cal_setting{height:5rem;padding:3rem .5rem;color:#828288}
.use_unit{float:left}
.use_unit span{display:inline-block;padding:0 0 0 1.5rem;user-select:none;cursor:pointer}
.use_unit span:hover{color:#fff}
.use_unit span.active{color:#6fa}
.cal_setting .save{display:none;float:right;cursor:pointer;user-select:none}
.cal_setting .save input{display:inline-block;float:left;width:1rem;height:1rem;margin:.9rem .9rem 0 0;border-radius:.1rem;border:1px solid #828288;vertical-align:middle;outline:none;-webkit-appearance:none}
.cal_setting .save input:checked{background-image:url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxNiAxNiI+PHBhdGggZmlsbD0iIzBmYSIgZD0iTTEuOTksNy41NjFsNC45NSw0Ljk1TDE0LjAxLDUuNDM5LDEyLjYsNC4wMjUsNi45MzksOS42ODIsMy40LDYuMTQ2WiIvPjwvc3ZnPgo=');background-color:#003;border-color:#6fa;background-position:inherit;background-size:100% auto}

@media(max-width:760px){
.home_title h1{padding:3rem 0 1rem}
.page_title h2{padding:2rem 0 3rem}
.calculator{padding:2rem 2rem}
.cal_inputs{display:none}
.cal_inputs.active{flex-wrap:wrap}
.cal_inputs label{width:100%;margin:0 0 1rem}
.cal_inputs button{width:100%;line-height:5.2rem}
.cal_inputs label.height{width:49%}
.cal_inputs label.weight{padding-top:2.6rem}
.cal_setting{padding:2rem .3rem;font-size:1.3rem}
.use_unit span{padding:0 0 0 1rem}
.cal_setting .save input{margin:.6rem .5rem 0 0}

}

.cal_datas{display:flex;padding:2rem 3rem;border:1px solid #3c3d5a;border-radius:4rem}
.cal_datas .para{width:37%;text-align:center;color:#828288}
.cal_datas .para span{display:inline-block;padding:0 2rem;font-size:3rem;color:#6fa}

.results button{width:25%;margin-left:2%;background:rgba(0,0,51,0);border-radius:1rem;color:#828288;font-size:1.7rem;transition:all .25s}
.results button svg{display:inline-block;width:1.3rem;height:1.3rem;margin:0 1rem 0 0;fill:#6fa;fill-rule:evenodd}
.results button:hover{color:#6fa}
.bmi_results{padding:1.6rem 0 2rem;text-align:center;font-weight:700;color:#ddd;line-height:6rem;font-size:1.7rem}
.bmi_results span{display:block}
.bmi_results .big{font-size:13.6rem;line-height:13rem;color:#6fa}

.mean{text-align:center;color:#cfcfd2;font-size:1.6rem;padding: 0 0 2rem;}
.mean .big{font-size: 3.4rem;font-weight: 700;line-height: 1.2;padding: 1.8rem 0;margin: 2rem 0;color:#6fa;border: 1px solid #484967;border-radius: 4rem;}

.bmibar{margin:2.3rem 0 3rem;padding:.5rem .6rem;border:1px solid #27283e;border-radius:3rem;background:rgba(255,255,255,0.08)}
.bmibar dl{position:relative;margin:0;width:auto;height:2.8rem}
.bmibar .icon{position:absolute;display:block;top:-2.2rem;left:67.5%;width:1.4rem;height:1.8rem}
.bmibar .icon svg{display:block;width:1.4rem;height:1.8rem;fill-rule:evenodd;fill:#69f;margin-left:-0.7rem}
.bmibar dd{position:relative;height:2.8rem;float:left;margin:0;font-size:1.2rem;line-height:2.8rem;text-align:center;color:rgba(0,0,0,0.6);transition:all .2s;cursor:pointer;text-overflow:ellipsis;white-space:nowrap}
.bmibar dd span{position:absolute;left:0;bottom:-3.5rem;margin-left:-.8rem;color:#828288;font-weight:800}

.bmibar .rank1{border-radius:3rem 0 0 3rem;background:#b1dbf7}
.bmibar .rank2{background:#91db95}
.bmibar .rank3{background:#ffb973}
.bmibar .rank4{border-radius:0 3rem 3rem 0;background:#e88a8b}
.bmibar .rank2 span{margin-left:-1.3rem}
.bmibar dd:hover{transform:translateY(-.3rem);opacity:.8;color:#000;font-weight:700}

.result_tip{display: none;padding:0 0 2rem;text-align:center;color:#cacad2;line-height:5rem;}
.result_tip span{display:block}

@media(max-width:760px){
.results{padding:0 2rem 1rem}
.cal_datas{display:block;padding:1rem 1rem 2.3rem;border-radius:.4rem}
.cal_datas .para{display:inline-block;float:left;width:50%;line-height:5rem}
.cal_datas .para span{width:auto;font-size:2.6rem;padding:0 .5rem}

.results button{width:60%;margin:.5rem auto 0;line-height:3rem;background:#6fa;border-radius:3rem;color:#003;font-size:1.6rem}
.results button svg{width:1.2rem;height:1.2rem;fill:#003}
.results button:hover{color:#fff}
.bmi_results{padding:1rem 0 2rem}
.bmi_results .big{font-size:10rem;line-height:10rem}
.mean-results{padding:0 2rem 1rem}
.mean .big{font-size: 2.8rem;border-radius:.4rem}
.result_tip{padding:2rem 0 3.6rem}
}


.light{padding: 3rem 0;background:#fff;}
.light h3{font-size:2.3rem;padding:2rem 0}
.light p{margin:0 0 1rem;font-size:1.5rem}
.light ul{padding:0 1.1em 1rem}
.light li{list-style-type:disc;display:list-item;padding:.5rem 0}

.you_infor{padding:2rem 2.8rem;margin:3rem 0;border-bottom:0;background:#e9fff1;border-radius:.3rem}
.you_infor u,.you_infor b{color:#090}
.you_infor font{color:#f60;text-decoration:underline}
.you_infor .green{color:#090}
.you_infor .red{color:#e00}

.blue{padding:4rem 0;background:#003}

.blue{text-align:center}
.blue h3{padding:1rem 0 3.6rem;font-size:2rem;color:#ccc}
.blue a{display:inline-block;margin:0 .5rem 2rem;padding:0 1.3rem;font-size:1.6rem;color:#fff;transition:all .25s}
.blue a:hover{background:#6fa;color:#003}

@media(max-width:760px){
.light{padding:3rem 2rem}
}

.tab{width:90%;margin:0 auto 2rem;text-align:center;border-spacing:0;border-collapse:collapse;line-height:1.4;color:#00a568}
.tab th{padding:1.6rem 1rem;background:#1cc780;color:#fff;}
.tab tr th:first-child{border-top-left-radius:.5rem;}
.tab tr th:last-child{border-top-right-radius:.5rem;}
.tab td{padding:1.6rem 1rem;border-bottom:1px solid #e3f1eb;}
.tab .addb{background:#eaffee}
.tab tbody tr:nth-child(even){background:#f2fff4}
.tab tbody tr.act{font-weight:700;font-size:1.7rem;background:#fffbde;color:#c60}

.formula .quote{padding:2rem 2.8rem;margin:2rem 0;background:#f5f5f6;font-size:1.8rem;border-radius:.6rem;font-family:serif;font-weight:700}

.recents{padding:2.3rem 0 2.2rem;background:#f4f5f7}
.recents li{display:block;float:left;width:33.33%;line-height:3rem}
.recents a{color:#7b7b82}
.recents .wide li{width:50%}

footer{padding:3.2rem 0 3.6rem;text-align:center;color:#6b6b7b}
footer a{color:#6b6b7b}
@media(max-width:760px){
.tab{width:100%;margin:0 0 2rem}
.recents li{width:100%;line-height:3.4rem;text-align:center}
.recents .wide li{width:100%}
}