/* variable */
:root {
    --main_color: #03499a;
    --sub_color: #8691a7;
    --point_color:#00adf1;
    --container:1200px;
    --border_color:#ccc;
    --border-radius:5px;
  }

::-moz-selection { /* Code for Firefox */ color: #fff;  background:var(--main_color);}
::selection {  color: #fff;  background:var(--main_color);}

/* Style */
html { font-size: 10px; scroll-behavior: smooth; box-sizing: border-box;}
body { overflow-x:hidden; font-size: 1.4rem; color:#333; letter-spacing: -0.0125rem; line-height: 1.4; word-break: keep-all;}
body.hidden { position: fixed; overflow-y:hidden;  touch-action: none;}
main { font-size: 1.4rem; line-height:2.1rem; color:#666; display: block;}
a, button { color:#333;}
p, li{word-break: keep-all;}

.clear {clear:both;}
.clear:after { content:""; display:block; clear:both;}
caption > div,
legend,
.hide {overflow: hidden; display:block; position:absolute; border: 0; width: 1px; height: 1px; clip: rect(1px, 1px, 1px, 1px);}

.skip { position: absolute; left: 0; right: 0; top:-100%; transition: all .5s; line-height: 5rem; background: #000; color:#fff; text-align: center; z-index: 100;}
.skip:focus { top: 0; }


/* align */
.left{text-align:left;}
.right{text-align: right;}
.center{text-align: center;}

/* padding */
.pb1{padding-bottom: 1rem;}
.pb2{padding-bottom: 2rem;}
.pb3{padding-bottom: 3rem;}
.pb4{padding-bottom: 4rem;}
.pb5{padding-bottom: 5rem;}
.pb6{padding-bottom: 6rem;}
.pb7{padding-bottom: 7rem;}
.pb8{padding-bottom: 8rem;}
.pb9{padding-bottom: 9rem;}
.pb10{padding-bottom: 10rem;}

.pt1{padding-top: 1rem;}
.pt2{padding-top: 2rem;}
.pt3{padding-top: 3rem;}
.pt4{padding-top: 4rem;}
.pt5{padding-top: 5rem;}
.pt6{padding-top: 6rem;}
.pt7{padding-top: 7rem;}
.pt8{padding-top: 8rem;}
.pt9{padding-top: 9rem;}
.pt10{padding-top: 10rem;}

/* margin*/
.mb1{margin-bottom: 1rem;}
.mb2{margin-bottom: 2rem;}
.mb3{margin-bottom: 3rem;}
.mb4{margin-bottom: 4rem;}
.mb5{margin-bottom: 5rem;}
.mb6{margin-bottom: 6rem;}
.mb7{margin-bottom: 7rem;}
.mb8{margin-bottom: 8rem;}
.mb9{margin-bottom: 9rem;}
.mb10{margin-bottom: 10rem;}

.mt1{margin-top: 1rem;}
.mt2{margin-top: 2rem;}
.mt3{margin-top: 3rem;}
.mt4{margin-top: 4rem;}
.mt5{margin-top: 5rem;}
.mt6{margin-top: 6rem;}
.mt7{margin-top: 7rem;}
.mt8{margin-top: 8rem;}
.mt9{margin-top: 9rem;}
.mt10{margin-top: 10rem;}

