/** normalize.css-v7.0.0 */ 
html{line-height:1.15;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,footer,header,nav,section{display:block}h1{font-size:2em;margin:.67em 0}figcaption,figure,main{display:block}figure{margin:1em 40px}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent;-webkit-text-decoration-skip:objects}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:inherit}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}dfn{font-style:italic}mark{background-color:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}audio,video{display:inline-block}audio:not([controls]){display:none;height:0}img{border-style:none}svg:not(:root){overflow:hidden}button,input,optgroup,select,textarea{font-family:sans-serif;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{display:inline-block;vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details,menu{display:block}summary{display:list-item}canvas{display:inline-block}template{display:none}[hidden]{display:none}

/** varible */
$color:#333;
$lightColor:#999;
$bgColor:#f4f4f4;
$themeColor:#ff9600;
$borderColor:#ddd;
$disabledColor:#eee;
$disableBorder:#ccc;
$radius:4px;

/** device-size */
@custom-media $mobile (max-width:1199px);
@custom-media $pc (min-width:1200px);

/** mixin */
@define-mixin highlight $color:(0,0,0,0){ -webkit-tap-highlight-color:rgba($color); } /* remove click highlight of mobile */
@define-mixin btn-bg $bgColor:$themeColor,$radius:$radius  /* set btton which has theme background */
    { border:none; background-color: $bgColor; color:#fff; border-radius: $radius; }
@define-mixin btn-border $themeColor:$themeColor,$radius:$radius  /* set button which has theme border */
    { background-color: transparent; border:1px solid $themeColor; color:$themeColor; border-radius: $radius; }

/** extend */
@define-extend input { border:1px solid #ddd; background-color: transparent; }  /* clear normal attribute of editable input */

/** m-reset */
*,*::after,*::before { box-sizing: border-box; word-break: break-all; }
a,a:active,a:hover { color:inherit; text-decoration: none; }
img { vertical-align: baseline; }
ul { list-style: none; -webkit-overflow-scrolling:touch; }
table { border-collapse: collapse; border-spacing: 0; }
textarea { resize: none; }

/** m-class */
.pr { position: relative; }
.pa { position: absolute; }
.pf { position: fixed; }
.vh { visibility: hidden; }
.hide { display: none; }
.clear { zoom:1; }
.clear:after { content:''; display: table; clear:both; }
.fl { float:left; }
.fr { float:right; }

/**  text appearance */
.tc { text-align: center; }
.tr { text-align: right; } 
.txtLine { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }  /* only one line text overflow ellipsis */
.txtLines { display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; } /* limited lines text overflow ellipsis */
@for $i from 2 to 5 { .line-$i { -webkit-line-clamp: $i;}}
.color-theme { color:$themeColor; }
.color-light { color:$lightColor; }

/** form & btn */
@each $type in (text,tel,password,search){ input[type=$type] { @extend input; }}
.btn-bg { @mixin btn-bg; }
.btn-border { @mixin btn-border; }
.radius { border-radius: 50%; }
@for $i from 2 to 10 { .radius-$i { border-radius: $(i)px; } }
button:disabled { border-color:$disableBorder; background-color: $disabledColor; color:$lightColor; }
.focus:focus { outline: none; background-color: #fff; border:1px solid $themeColor; 
    box-shadow: 0 0 3px $themeColor, 1px 1px 6px #eee inset ; }

/* project-set */