:root {
    --primary: #a67f78;
    --primary-rgb: 166, 127, 120;
    --secondary: #414143;
    --secondary-rgb: 65, 65, 67;
    --complement: #8e8781;
    --complement-rgb: 142, 135, 129;
    --triadic1: #e1dcd9;
    --triadic1-rgb: 225, 220, 217;
    --triadic2: #78a67f;
    --triadic2-rgb: 120, 166, 127;
    --info: #313131;
    --info-rgb: 49, 49, 49;
    --white: #fff;
    --white-rgb: 255, 255, 255;
    --black: #000;
    --black-rgb: 0, 0, 0;
    --gray: #666;
    --gray-rgb: 102, 102, 102;
    --width-xs: 550px;
    --width-sm: 640px;
    --width-md: 760px;
    --width-lg: 1024px;
    --width-xl: 1280px;
    --width-xxl: 1440px;
    --font-family: 'Noto Sans TC', 'Noto Sans SC';
  }
  .txt_primary_1 {
    color: #ffffff;
  }
  .bg_primary_1 {
    background: #ffffff;
  }
  .svg_primary_1 {
    fill: #ffffff;
  }
  .txt_primary_2 {
    color: #ffffff;
  }
  .bg_primary_2 {
    background: #ffffff;
  }
  .svg_primary_2 {
    fill: #ffffff;
  }
  .txt_primary_3 {
    color: #f7f4f3;
  }
  .bg_primary_3 {
    background: #f7f4f3;
  }
  .svg_primary_3 {
    fill: #f7f4f3;
  }
  .txt_primary_4 {
    color: #cfb9b5;
  }
  .bg_primary_4 {
    background: #cfb9b5;
  }
  .svg_primary_4 {
    fill: #cfb9b5;
  }
  .txt_primary_5 {
    color: #a67f78;
  }
  .bg_primary_5 {
    background: #a67f78;
  }
  .svg_primary_5 {
    fill: #a67f78;
  }
  .txt_primary_6 {
    color: #6f4f49;
  }
  .bg_primary_6 {
    background: #6f4f49;
  }
  .svg_primary_6 {
    fill: #6f4f49;
  }
  .txt_primary_7 {
    color: #312321;
  }
  .bg_primary_7 {
    background: #312321;
  }
  .svg_primary_7 {
    fill: #312321;
  }
  .txt_primary_8 {
    color: #000000;
  }
  .bg_primary_8 {
    background: #000000;
  }
  .svg_primary_8 {
    fill: #000000;
  }
  .txt_primary_9 {
    color: #000000;
  }
  .bg_primary_9 {
    background: #000000;
  }
  .svg_primary_9 {
    fill: #000000;
  }
  .txt_secondary_1 {
    color: #ffffff;
  }
  .bg_secondary_1 {
    background: #ffffff;
  }
  .svg_secondary_1 {
    fill: #ffffff;
  }
  .txt_secondary_2 {
    color: #dadadc;
  }
  .bg_secondary_2 {
    background: #dadadc;
  }
  .svg_secondary_2 {
    fill: #dadadc;
  }
  .txt_secondary_3 {
    color: #a7a7a9;
  }
  .bg_secondary_3 {
    background: #a7a7a9;
  }
  .svg_secondary_3 {
    fill: #a7a7a9;
  }
  .txt_secondary_4 {
    color: #737377;
  }
  .bg_secondary_4 {
    background: #737377;
  }
  .svg_secondary_4 {
    fill: #737377;
  }
  .txt_secondary_5 {
    color: #414143;
  }
  .bg_secondary_5 {
    background: #414143;
  }
  .svg_secondary_5 {
    fill: #414143;
  }
  .txt_secondary_6 {
    color: #0f0f0f;
  }
  .bg_secondary_6 {
    background: #0f0f0f;
  }
  .svg_secondary_6 {
    fill: #0f0f0f;
  }
  .txt_secondary_7 {
    color: #000000;
  }
  .bg_secondary_7 {
    background: #000000;
  }
  .svg_secondary_7 {
    fill: #000000;
  }
  .txt_secondary_8 {
    color: #000000;
  }
  .bg_secondary_8 {
    background: #000000;
  }
  .svg_secondary_8 {
    fill: #000000;
  }
  .txt_secondary_9 {
    color: #000000;
  }
  .bg_secondary_9 {
    background: #000000;
  }
  .svg_secondary_9 {
    fill: #000000;
  }
  .txt_complement_1 {
    color: #ffffff;
  }
  .bg_complement_1 {
    background: #ffffff;
  }
  .svg_complement_1 {
    fill: #ffffff;
  }
  .txt_complement_2 {
    color: #ffffff;
  }
  .bg_complement_2 {
    background: #ffffff;
  }
  .svg_complement_2 {
    fill: #ffffff;
  }
  .txt_complement_3 {
    color: #eeeded;
  }
  .bg_complement_3 {
    background: #eeeded;
  }
  .svg_complement_3 {
    fill: #eeeded;
  }
  .txt_complement_4 {
    color: #bebab7;
  }
  .bg_complement_4 {
    background: #bebab7;
  }
  .svg_complement_4 {
    fill: #bebab7;
  }
  .txt_complement_5 {
    color: #8e8781;
  }
  .bg_complement_5 {
    background: #8e8781;
  }
  .svg_complement_5 {
    fill: #8e8781;
  }
  .txt_complement_6 {
    color: #595450;
  }
  .bg_complement_6 {
    background: #595450;
  }
  .svg_complement_6 {
    fill: #595450;
  }
  .txt_complement_7 {
    color: #232120;
  }
  .bg_complement_7 {
    background: #232120;
  }
  .svg_complement_7 {
    fill: #232120;
  }
  .txt_complement_8 {
    color: #000000;
  }
  .bg_complement_8 {
    background: #000000;
  }
  .svg_complement_8 {
    fill: #000000;
  }
  .txt_complement_9 {
    color: #000000;
  }
  .bg_complement_9 {
    background: #000000;
  }
  .svg_complement_9 {
    fill: #000000;
  }
  .txt_triadic1_1 {
    color: #ffffff;
  }
  .bg_triadic1_1 {
    background: #ffffff;
  }
  .svg_triadic1_1 {
    fill: #ffffff;
  }
  .txt_triadic1_2 {
    color: #ffffff;
  }
  .bg_triadic1_2 {
    background: #ffffff;
  }
  .svg_triadic1_2 {
    fill: #ffffff;
  }
  .txt_triadic1_3 {
    color: #ffffff;
  }
  .bg_triadic1_3 {
    background: #ffffff;
  }
  .svg_triadic1_3 {
    fill: #ffffff;
  }
  .txt_triadic1_4 {
    color: #ffffff;
  }
  .bg_triadic1_4 {
    background: #ffffff;
  }
  .svg_triadic1_4 {
    fill: #ffffff;
  }
  .txt_triadic1_5 {
    color: #e1dcd9;
  }
  .bg_triadic1_5 {
    background: #e1dcd9;
  }
  .svg_triadic1_5 {
    fill: #e1dcd9;
  }
  .txt_triadic1_6 {
    color: #b4a8a0;
  }
  .bg_triadic1_6 {
    background: #b4a8a0;
  }
  .svg_triadic1_6 {
    fill: #b4a8a0;
  }
  .txt_triadic1_7 {
    color: #857469;
  }
  .bg_triadic1_7 {
    background: #857469;
  }
  .svg_triadic1_7 {
    fill: #857469;
  }
  .txt_triadic1_8 {
    color: #4c423c;
  }
  .bg_triadic1_8 {
    background: #4c423c;
  }
  .svg_triadic1_8 {
    fill: #4c423c;
  }
  .txt_triadic1_9 {
    color: #13110f;
  }
  .bg_triadic1_9 {
    background: #13110f;
  }
  .svg_triadic1_9 {
    fill: #13110f;
  }
  .txt_triadic2_1 {
    color: #ffffff;
  }
  .bg_triadic2_1 {
    background: #ffffff;
  }
  .svg_triadic2_1 {
    fill: #ffffff;
  }
  .txt_triadic2_2 {
    color: #ffffff;
  }
  .bg_triadic2_2 {
    background: #ffffff;
  }
  .svg_triadic2_2 {
    fill: #ffffff;
  }
  .txt_triadic2_3 {
    color: #f3f7f4;
  }
  .bg_triadic2_3 {
    background: #f3f7f4;
  }
  .svg_triadic2_3 {
    fill: #f3f7f4;
  }
  .txt_triadic2_4 {
    color: #b5cfb9;
  }
  .bg_triadic2_4 {
    background: #b5cfb9;
  }
  .svg_triadic2_4 {
    fill: #b5cfb9;
  }
  .txt_triadic2_5 {
    color: #78a67f;
  }
  .bg_triadic2_5 {
    background: #78a67f;
  }
  .svg_triadic2_5 {
    fill: #78a67f;
  }
  .txt_triadic2_6 {
    color: #496f4f;
  }
  .bg_triadic2_6 {
    background: #496f4f;
  }
  .svg_triadic2_6 {
    fill: #496f4f;
  }
  .txt_triadic2_7 {
    color: #213123;
  }
  .bg_triadic2_7 {
    background: #213123;
  }
  .svg_triadic2_7 {
    fill: #213123;
  }
  .txt_triadic2_8 {
    color: #000000;
  }
  .bg_triadic2_8 {
    background: #000000;
  }
  .svg_triadic2_8 {
    fill: #000000;
  }
  .txt_triadic2_9 {
    color: #000000;
  }
  .bg_triadic2_9 {
    background: #000000;
  }
  .svg_triadic2_9 {
    fill: #000000;
  }
  .txt_info_1 {
    color: #fdfdfd;
  }
  .bg_info_1 {
    background: #fdfdfd;
  }
  .svg_info_1 {
    fill: #fdfdfd;
  }
  .txt_info_2 {
    color: #cacaca;
  }
  .bg_info_2 {
    background: #cacaca;
  }
  .svg_info_2 {
    fill: #cacaca;
  }
  .txt_info_3 {
    color: #979797;
  }
  .bg_info_3 {
    background: #979797;
  }
  .svg_info_3 {
    fill: #979797;
  }
  .txt_info_4 {
    color: #646464;
  }
  .bg_info_4 {
    background: #646464;
  }
  .svg_info_4 {
    fill: #646464;
  }
  .txt_info_5 {
    color: #313131;
  }
  .bg_info_5 {
    background: #313131;
  }
  .svg_info_5 {
    fill: #313131;
  }
  .txt_info_6 {
    color: #000000;
  }
  .bg_info_6 {
    background: #000000;
  }
  .svg_info_6 {
    fill: #000000;
  }
  .txt_info_7 {
    color: #000000;
  }
  .bg_info_7 {
    background: #000000;
  }
  .svg_info_7 {
    fill: #000000;
  }
  .txt_info_8 {
    color: #000000;
  }
  .bg_info_8 {
    background: #000000;
  }
  .svg_info_8 {
    fill: #000000;
  }
  .txt_info_9 {
    color: #000000;
  }
  .bg_info_9 {
    background: #000000;
  }
  .svg_info_9 {
    fill: #000000;
  }
  .txt_white_1 {
    color: #ffffff;
  }
  .bg_white_1 {
    background: #ffffff;
  }
  .svg_white_1 {
    fill: #ffffff;
  }
  .txt_white_2 {
    color: #ffffff;
  }
  .bg_white_2 {
    background: #ffffff;
  }
  .svg_white_2 {
    fill: #ffffff;
  }
  .txt_white_3 {
    color: #ffffff;
  }
  .bg_white_3 {
    background: #ffffff;
  }
  .svg_white_3 {
    fill: #ffffff;
  }
  .txt_white_4 {
    color: #ffffff;
  }
  .bg_white_4 {
    background: #ffffff;
  }
  .svg_white_4 {
    fill: #ffffff;
  }
  .txt_white_5 {
    color: #fff;
  }
  .bg_white_5 {
    background: #fff;
  }
  .svg_white_5 {
    fill: #fff;
  }
  .txt_white_6 {
    color: #cccccc;
  }
  .bg_white_6 {
    background: #cccccc;
  }
  .svg_white_6 {
    fill: #cccccc;
  }
  .txt_white_7 {
    color: #999999;
  }
  .bg_white_7 {
    background: #999999;
  }
  .svg_white_7 {
    fill: #999999;
  }
  .txt_white_8 {
    color: #666666;
  }
  .bg_white_8 {
    background: #666666;
  }
  .svg_white_8 {
    fill: #666666;
  }
  .txt_white_9 {
    color: #333333;
  }
  .bg_white_9 {
    background: #333333;
  }
  .svg_white_9 {
    fill: #333333;
  }
  .txt_black_1 {
    color: #cccccc;
  }
  .bg_black_1 {
    background: #cccccc;
  }
  .svg_black_1 {
    fill: #cccccc;
  }
  .txt_black_2 {
    color: #999999;
  }
  .bg_black_2 {
    background: #999999;
  }
  .svg_black_2 {
    fill: #999999;
  }
  .txt_black_3 {
    color: #666666;
  }
  .bg_black_3 {
    background: #666666;
  }
  .svg_black_3 {
    fill: #666666;
  }
  .txt_black_4 {
    color: #333333;
  }
  .bg_black_4 {
    background: #333333;
  }
  .svg_black_4 {
    fill: #333333;
  }
  .txt_black_5 {
    color: #000;
  }
  .bg_black_5 {
    background: #000;
  }
  .svg_black_5 {
    fill: #000;
  }
  .txt_black_6 {
    color: #000000;
  }
  .bg_black_6 {
    background: #000000;
  }
  .svg_black_6 {
    fill: #000000;
  }
  .txt_black_7 {
    color: #000000;
  }
  .bg_black_7 {
    background: #000000;
  }
  .svg_black_7 {
    fill: #000000;
  }
  .txt_black_8 {
    color: #000000;
  }
  .bg_black_8 {
    background: #000000;
  }
  .svg_black_8 {
    fill: #000000;
  }
  .txt_black_9 {
    color: #000000;
  }
  .bg_black_9 {
    background: #000000;
  }
  .svg_black_9 {
    fill: #000000;
  }
  .txt_gray_1 {
    color: #ffffff;
  }
  .bg_gray_1 {
    background: #ffffff;
  }
  .svg_gray_1 {
    fill: #ffffff;
  }
  .txt_gray_2 {
    color: #ffffff;
  }
  .bg_gray_2 {
    background: #ffffff;
  }
  .svg_gray_2 {
    fill: #ffffff;
  }
  .txt_gray_3 {
    color: #cccccc;
  }
  .bg_gray_3 {
    background: #cccccc;
  }
  .svg_gray_3 {
    fill: #cccccc;
  }
  .txt_gray_4 {
    color: #999999;
  }
  .bg_gray_4 {
    background: #999999;
  }
  .svg_gray_4 {
    fill: #999999;
  }
  .txt_gray_5 {
    color: #666;
  }
  .bg_gray_5 {
    background: #666;
  }
  .svg_gray_5 {
    fill: #666;
  }
  .txt_gray_6 {
    color: #333333;
  }
  .bg_gray_6 {
    background: #333333;
  }
  .svg_gray_6 {
    fill: #333333;
  }
  .txt_gray_7 {
    color: #000000;
  }
  .bg_gray_7 {
    background: #000000;
  }
  .svg_gray_7 {
    fill: #000000;
  }
  .txt_gray_8 {
    color: #000000;
  }
  .bg_gray_8 {
    background: #000000;
  }
  .svg_gray_8 {
    fill: #000000;
  }
  .txt_gray_9 {
    color: #000000;
  }
  .bg_gray_9 {
    background: #000000;
  }
  .svg_gray_9 {
    fill: #000000;
  }
  .row {
    margin-left: 15px;
    margin-right: 15px;
  }
  .col_1 {
    width: 8.33333333%;
  }
  .col_offset_1 {
    width: calc(8.33333333% - 30px);
  }
  .col_2 {
    width: 16.66666667%;
  }
  .col_offset_2 {
    width: calc(16.66666667% - 30px);
  }
  .col_3 {
    width: 25%;
  }
  .col_offset_3 {
    width: calc(25% - 30px);
  }
  .col_4 {
    width: 33.33333333%;
  }
  .col_offset_4 {
    width: calc(33.33333333% - 30px);
  }
  .col_5 {
    width: 41.66666667%;
  }
  .col_offset_5 {
    width: calc(41.66666667% - 30px);
  }
  .col_6 {
    width: 50%;
  }
  .col_offset_6 {
    width: calc(50% - 30px);
  }
  .col_7 {
    width: 58.33333333%;
  }
  .col_offset_7 {
    width: calc(58.33333333% - 30px);
  }
  .col_8 {
    width: 66.66666667%;
  }
  .col_offset_8 {
    width: calc(66.66666667% - 30px);
  }
  .col_9 {
    width: 75%;
  }
  .col_offset_9 {
    width: calc(75% - 30px);
  }
  .col_10 {
    width: 83.33333333%;
  }
  .col_offset_10 {
    width: calc(83.33333333% - 30px);
  }
  .col_11 {
    width: 91.66666667%;
  }
  .col_offset_11 {
    width: calc(91.66666667% - 30px);
  }
  .col_12 {
    width: 100%;
  }
  .col_offset_12 {
    width: calc(100% - 30px);
  }
  .over_auto {
    overflow: auto;
  }
  .over_hid {
    overflow: hidden;
  }
  .over_vis {
    overflow: visible;
  }
  .over_scr {
    overflow: scroll;
  }
  .pos_stat {
    position: static;
  }
  .pos_rel {
    position: relative;
  }
  .pos_abs {
    position: absolute;
  }
  .pos_fix {
    position: fixed;
  }
  .pos_stic {
    position: sticky;
  }
  .d_none {
    display: none;
  }
  .d_inblock {
    display: inline-block;
  }
  .d_block {
    display: block;
  }
  .d_grid {
    display: grid;
  }
  .d_flex {
    display: flex;
  }
  .d_inflex {
    display: inline-flex;
  }
  .talign_right {
    text-align: right;
  }
  .talign_left {
    text-align: left;
  }
  .talign_center {
    text-align: center;
  }
  .talign_justify {
    text-align: justify;
  }
  @media (min-width: 551px) {
    .col_xs_1 {
      width: 8.33333333%;
    }
    .col_xs_offset_1 {
      width: calc(8.33333333% - 30px);
    }
    .col_xs_2 {
      width: 16.66666667%;
    }
    .col_xs_offset_2 {
      width: calc(16.66666667% - 30px);
    }
    .col_xs_3 {
      width: 25%;
    }
    .col_xs_offset_3 {
      width: calc(25% - 30px);
    }
    .col_xs_4 {
      width: 33.33333333%;
    }
    .col_xs_offset_4 {
      width: calc(33.33333333% - 30px);
    }
    .col_xs_5 {
      width: 41.66666667%;
    }
    .col_xs_offset_5 {
      width: calc(41.66666667% - 30px);
    }
    .col_xs_6 {
      width: 50%;
    }
    .col_xs_offset_6 {
      width: calc(50% - 30px);
    }
    .col_xs_7 {
      width: 58.33333333%;
    }
    .col_xs_offset_7 {
      width: calc(58.33333333% - 30px);
    }
    .col_xs_8 {
      width: 66.66666667%;
    }
    .col_xs_offset_8 {
      width: calc(66.66666667% - 30px);
    }
    .col_xs_9 {
      width: 75%;
    }
    .col_xs_offset_9 {
      width: calc(75% - 30px);
    }
    .col_xs_10 {
      width: 83.33333333%;
    }
    .col_xs_offset_10 {
      width: calc(83.33333333% - 30px);
    }
    .col_xs_11 {
      width: 91.66666667%;
    }
    .col_xs_offset_11 {
      width: calc(91.66666667% - 30px);
    }
    .col_xs_12 {
      width: 100%;
    }
    .col_xs_offset_12 {
      width: calc(100% - 30px);
    }
    .over_xs_auto {
      overflow: auto;
    }
    .over_xs_hid {
      overflow: hidden;
    }
    .over_xs_vis {
      overflow: visible;
    }
    .over_xs_scr {
      overflow: scroll;
    }
    .pos_xs_stat {
      position: static;
    }
    .pos_xs_rel {
      position: relative;
    }
    .pos_xs_abs {
      position: absolute;
    }
    .pos_xs_fix {
      position: fixed;
    }
    .pos_xs_stic {
      position: sticky;
    }
    .d_xs_none {
      display: none;
    }
    .d_xs_inblock {
      display: inline-block;
    }
    .d_xs_block {
      display: block;
    }
    .d_xs_grid {
      display: grid;
    }
    .d_xs_flex {
      display: flex;
    }
    .d_xs_inflex {
      display: inline-flex;
    }
    .talign_xs_right {
      text-align: right;
    }
    .talign_xs_left {
      text-align: left;
    }
    .talign_xs_center {
      text-align: center;
    }
    .talign_xs_justify {
      text-align: justify;
    }
  }
  @media (min-width: 641px) {
    .col_sm_1 {
      width: 8.33333333%;
    }
    .col_sm_offset_1 {
      width: calc(8.33333333% - 30px);
    }
    .col_sm_2 {
      width: 16.66666667%;
    }
    .col_sm_offset_2 {
      width: calc(16.66666667% - 30px);
    }
    .col_sm_3 {
      width: 25%;
    }
    .col_sm_offset_3 {
      width: calc(25% - 30px);
    }
    .col_sm_4 {
      width: 33.33333333%;
    }
    .col_sm_offset_4 {
      width: calc(33.33333333% - 30px);
    }
    .col_sm_5 {
      width: 41.66666667%;
    }
    .col_sm_offset_5 {
      width: calc(41.66666667% - 30px);
    }
    .col_sm_6 {
      width: 50%;
    }
    .col_sm_offset_6 {
      width: calc(50% - 30px);
    }
    .col_sm_7 {
      width: 58.33333333%;
    }
    .col_sm_offset_7 {
      width: calc(58.33333333% - 30px);
    }
    .col_sm_8 {
      width: 66.66666667%;
    }
    .col_sm_offset_8 {
      width: calc(66.66666667% - 30px);
    }
    .col_sm_9 {
      width: 75%;
    }
    .col_sm_offset_9 {
      width: calc(75% - 30px);
    }
    .col_sm_10 {
      width: 83.33333333%;
    }
    .col_sm_offset_10 {
      width: calc(83.33333333% - 30px);
    }
    .col_sm_11 {
      width: 91.66666667%;
    }
    .col_sm_offset_11 {
      width: calc(91.66666667% - 30px);
    }
    .col_sm_12 {
      width: 100%;
    }
    .col_sm_offset_12 {
      width: calc(100% - 30px);
    }
    .over_sm_auto {
      overflow: auto;
    }
    .over_sm_hid {
      overflow: hidden;
    }
    .over_sm_vis {
      overflow: visible;
    }
    .over_sm_scr {
      overflow: scroll;
    }
    .pos_sm_stat {
      position: static;
    }
    .pos_sm_rel {
      position: relative;
    }
    .pos_sm_abs {
      position: absolute;
    }
    .pos_sm_fix {
      position: fixed;
    }
    .pos_sm_stic {
      position: sticky;
    }
    .d_sm_none {
      display: none;
    }
    .d_sm_inblock {
      display: inline-block;
    }
    .d_sm_block {
      display: block;
    }
    .d_sm_grid {
      display: grid;
    }
    .d_sm_flex {
      display: flex;
    }
    .d_sm_inflex {
      display: inline-flex;
    }
    .talign_sm_right {
      text-align: right;
    }
    .talign_sm_left {
      text-align: left;
    }
    .talign_sm_center {
      text-align: center;
    }
    .talign_sm_justify {
      text-align: justify;
    }
  }
  @media (min-width: 761px) {
    .col_md_1 {
      width: 8.33333333%;
    }
    .col_md_offset_1 {
      width: calc(8.33333333% - 30px);
    }
    .col_md_2 {
      width: 16.66666667%;
    }
    .col_md_offset_2 {
      width: calc(16.66666667% - 30px);
    }
    .col_md_3 {
      width: 25%;
    }
    .col_md_offset_3 {
      width: calc(25% - 30px);
    }
    .col_md_4 {
      width: 33.33333333%;
    }
    .col_md_offset_4 {
      width: calc(33.33333333% - 30px);
    }
    .col_md_5 {
      width: 41.66666667%;
    }
    .col_md_offset_5 {
      width: calc(41.66666667% - 30px);
    }
    .col_md_6 {
      width: 50%;
    }
    .col_md_offset_6 {
      width: calc(50% - 30px);
    }
    .col_md_7 {
      width: 58.33333333%;
    }
    .col_md_offset_7 {
      width: calc(58.33333333% - 30px);
    }
    .col_md_8 {
      width: 66.66666667%;
    }
    .col_md_offset_8 {
      width: calc(66.66666667% - 30px);
    }
    .col_md_9 {
      width: 75%;
    }
    .col_md_offset_9 {
      width: calc(75% - 30px);
    }
    .col_md_10 {
      width: 83.33333333%;
    }
    .col_md_offset_10 {
      width: calc(83.33333333% - 30px);
    }
    .col_md_11 {
      width: 91.66666667%;
    }
    .col_md_offset_11 {
      width: calc(91.66666667% - 30px);
    }
    .col_md_12 {
      width: 100%;
    }
    .col_md_offset_12 {
      width: calc(100% - 30px);
    }
    .over_md_auto {
      overflow: auto;
    }
    .over_md_hid {
      overflow: hidden;
    }
    .over_md_vis {
      overflow: visible;
    }
    .over_md_scr {
      overflow: scroll;
    }
    .pos_md_stat {
      position: static;
    }
    .pos_md_rel {
      position: relative;
    }
    .pos_md_abs {
      position: absolute;
    }
    .pos_md_fix {
      position: fixed;
    }
    .pos_md_stic {
      position: sticky;
    }
    .d_md_none {
      display: none;
    }
    .d_md_inblock {
      display: inline-block;
    }
    .d_md_block {
      display: block;
    }
    .d_md_grid {
      display: grid;
    }
    .d_md_flex {
      display: flex;
    }
    .d_md_inflex {
      display: inline-flex;
    }
    .talign_md_right {
      text-align: right;
    }
    .talign_md_left {
      text-align: left;
    }
    .talign_md_center {
      text-align: center;
    }
    .talign_md_justify {
      text-align: justify;
    }
  }
  @media (min-width: 1025px) {
    .col_lg_1 {
      width: 8.33333333%;
    }
    .col_lg_offset_1 {
      width: calc(8.33333333% - 30px);
    }
    .col_lg_2 {
      width: 16.66666667%;
    }
    .col_lg_offset_2 {
      width: calc(16.66666667% - 30px);
    }
    .col_lg_3 {
      width: 25%;
    }
    .col_lg_offset_3 {
      width: calc(25% - 30px);
    }
    .col_lg_4 {
      width: 33.33333333%;
    }
    .col_lg_offset_4 {
      width: calc(33.33333333% - 30px);
    }
    .col_lg_5 {
      width: 41.66666667%;
    }
    .col_lg_offset_5 {
      width: calc(41.66666667% - 30px);
    }
    .col_lg_6 {
      width: 50%;
    }
    .col_lg_offset_6 {
      width: calc(50% - 30px);
    }
    .col_lg_7 {
      width: 58.33333333%;
    }
    .col_lg_offset_7 {
      width: calc(58.33333333% - 30px);
    }
    .col_lg_8 {
      width: 66.66666667%;
    }
    .col_lg_offset_8 {
      width: calc(66.66666667% - 30px);
    }
    .col_lg_9 {
      width: 75%;
    }
    .col_lg_offset_9 {
      width: calc(75% - 30px);
    }
    .col_lg_10 {
      width: 83.33333333%;
    }
    .col_lg_offset_10 {
      width: calc(83.33333333% - 30px);
    }
    .col_lg_11 {
      width: 91.66666667%;
    }
    .col_lg_offset_11 {
      width: calc(91.66666667% - 30px);
    }
    .col_lg_12 {
      width: 100%;
    }
    .col_lg_offset_12 {
      width: calc(100% - 30px);
    }
    .over_lg_auto {
      overflow: auto;
    }
    .over_lg_hid {
      overflow: hidden;
    }
    .over_lg_vis {
      overflow: visible;
    }
    .over_lg_scr {
      overflow: scroll;
    }
    .pos_lg_stat {
      position: static;
    }
    .pos_lg_rel {
      position: relative;
    }
    .pos_lg_abs {
      position: absolute;
    }
    .pos_lg_fix {
      position: fixed;
    }
    .pos_lg_stic {
      position: sticky;
    }
    .d_lg_none {
      display: none;
    }
    .d_lg_inblock {
      display: inline-block;
    }
    .d_lg_block {
      display: block;
    }
    .d_lg_grid {
      display: grid;
    }
    .d_lg_flex {
      display: flex;
    }
    .d_lg_inflex {
      display: inline-flex;
    }
    .talign_lg_right {
      text-align: right;
    }
    .talign_lg_left {
      text-align: left;
    }
    .talign_lg_center {
      text-align: center;
    }
    .talign_lg_justify {
      text-align: justify;
    }
  }
  @media (min-width: 1281px) {
    .col_xl_1 {
      width: 8.33333333%;
    }
    .col_xl_offset_1 {
      width: calc(8.33333333% - 30px);
    }
    .col_xl_2 {
      width: 16.66666667%;
    }
    .col_xl_offset_2 {
      width: calc(16.66666667% - 30px);
    }
    .col_xl_3 {
      width: 25%;
    }
    .col_xl_offset_3 {
      width: calc(25% - 30px);
    }
    .col_xl_4 {
      width: 33.33333333%;
    }
    .col_xl_offset_4 {
      width: calc(33.33333333% - 30px);
    }
    .col_xl_5 {
      width: 41.66666667%;
    }
    .col_xl_offset_5 {
      width: calc(41.66666667% - 30px);
    }
    .col_xl_6 {
      width: 50%;
    }
    .col_xl_offset_6 {
      width: calc(50% - 30px);
    }
    .col_xl_7 {
      width: 58.33333333%;
    }
    .col_xl_offset_7 {
      width: calc(58.33333333% - 30px);
    }
    .col_xl_8 {
      width: 66.66666667%;
    }
    .col_xl_offset_8 {
      width: calc(66.66666667% - 30px);
    }
    .col_xl_9 {
      width: 75%;
    }
    .col_xl_offset_9 {
      width: calc(75% - 30px);
    }
    .col_xl_10 {
      width: 83.33333333%;
    }
    .col_xl_offset_10 {
      width: calc(83.33333333% - 30px);
    }
    .col_xl_11 {
      width: 91.66666667%;
    }
    .col_xl_offset_11 {
      width: calc(91.66666667% - 30px);
    }
    .col_xl_12 {
      width: 100%;
    }
    .col_xl_offset_12 {
      width: calc(100% - 30px);
    }
    .over_xl_auto {
      overflow: auto;
    }
    .over_xl_hid {
      overflow: hidden;
    }
    .over_xl_vis {
      overflow: visible;
    }
    .over_xl_scr {
      overflow: scroll;
    }
    .pos_xl_stat {
      position: static;
    }
    .pos_xl_rel {
      position: relative;
    }
    .pos_xl_abs {
      position: absolute;
    }
    .pos_xl_fix {
      position: fixed;
    }
    .pos_xl_stic {
      position: sticky;
    }
    .d_xl_none {
      display: none;
    }
    .d_xl_inblock {
      display: inline-block;
    }
    .d_xl_block {
      display: block;
    }
    .d_xl_grid {
      display: grid;
    }
    .d_xl_flex {
      display: flex;
    }
    .d_xl_inflex {
      display: inline-flex;
    }
    .talign_xl_right {
      text-align: right;
    }
    .talign_xl_left {
      text-align: left;
    }
    .talign_xl_center {
      text-align: center;
    }
    .talign_xl_justify {
      text-align: justify;
    }
  }
  @media (min-width: 1441px) {
    .col_xxl_1 {
      width: 8.33333333%;
    }
    .col_xxl_offset_1 {
      width: calc(8.33333333% - 30px);
    }
    .col_xxl_2 {
      width: 16.66666667%;
    }
    .col_xxl_offset_2 {
      width: calc(16.66666667% - 30px);
    }
    .col_xxl_3 {
      width: 25%;
    }
    .col_xxl_offset_3 {
      width: calc(25% - 30px);
    }
    .col_xxl_4 {
      width: 33.33333333%;
    }
    .col_xxl_offset_4 {
      width: calc(33.33333333% - 30px);
    }
    .col_xxl_5 {
      width: 41.66666667%;
    }
    .col_xxl_offset_5 {
      width: calc(41.66666667% - 30px);
    }
    .col_xxl_6 {
      width: 50%;
    }
    .col_xxl_offset_6 {
      width: calc(50% - 30px);
    }
    .col_xxl_7 {
      width: 58.33333333%;
    }
    .col_xxl_offset_7 {
      width: calc(58.33333333% - 30px);
    }
    .col_xxl_8 {
      width: 66.66666667%;
    }
    .col_xxl_offset_8 {
      width: calc(66.66666667% - 30px);
    }
    .col_xxl_9 {
      width: 75%;
    }
    .col_xxl_offset_9 {
      width: calc(75% - 30px);
    }
    .col_xxl_10 {
      width: 83.33333333%;
    }
    .col_xxl_offset_10 {
      width: calc(83.33333333% - 30px);
    }
    .col_xxl_11 {
      width: 91.66666667%;
    }
    .col_xxl_offset_11 {
      width: calc(91.66666667% - 30px);
    }
    .col_xxl_12 {
      width: 100%;
    }
    .col_xxl_offset_12 {
      width: calc(100% - 30px);
    }
    .over_xxl_auto {
      overflow: auto;
    }
    .over_xxl_hid {
      overflow: hidden;
    }
    .over_xxl_vis {
      overflow: visible;
    }
    .over_xxl_scr {
      overflow: scroll;
    }
    .pos_xxl_stat {
      position: static;
    }
    .pos_xxl_rel {
      position: relative;
    }
    .pos_xxl_abs {
      position: absolute;
    }
    .pos_xxl_fix {
      position: fixed;
    }
    .pos_xxl_stic {
      position: sticky;
    }
    .d_xxl_none {
      display: none;
    }
    .d_xxl_inblock {
      display: inline-block;
    }
    .d_xxl_block {
      display: block;
    }
    .d_xxl_grid {
      display: grid;
    }
    .d_xxl_flex {
      display: flex;
    }
    .d_xxl_inflex {
      display: inline-flex;
    }
    .talign_xxl_right {
      text-align: right;
    }
    .talign_xxl_left {
      text-align: left;
    }
    .talign_xxl_center {
      text-align: center;
    }
    .talign_xxl_justify {
      text-align: justify;
    }
  }
  .webBox *,
  .webBox :before,
  .webBox :after {
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
  }
  .webBox header.scroll {
    transform: translate(0, -80px);
    -webkit-transform: translate(0, -80px);
    -moz-transform: translate(0, -80px);
    -ms-transform: translate(0, -80px);
    -o-transform: translate(0, -80px);
  }
  .webBox header.scroll.show {
    transform: translate(0, 0);
    -webkit-transform: translate(0, 0);
    -moz-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -o-transform: translate(0, 0);
  }
  .webBox header #menubtn[data-type="2"] a span:nth-child(1) {
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
  }
  .webBox header #menubtn[data-type="2"] a span:nth-child(3) {
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
  }
  .webBox header #hSearch {
    transform: translate(30px, 0);
    -webkit-transform: translate(30px, 0);
    -moz-transform: translate(30px, 0);
    -ms-transform: translate(30px, 0);
    -o-transform: translate(30px, 0);
  }
  .webBox header #hSearch[data-type="2"] {
    transform: translate(0, 0);
    -webkit-transform: translate(0, 0);
    -moz-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -o-transform: translate(0, 0);
  }
  @media (min-width: 1281px) {
    .webBox header #webmenu li .menu_body {
      transform: translate(0, 30px);
      -webkit-transform: translate(0, 30px);
      -moz-transform: translate(0, 30px);
      -ms-transform: translate(0, 30px);
      -o-transform: translate(0, 30px);
    }
    .webBox header #webmenu li .menu_body .subOption li .sub2Option {
      transform: translate(-30px, 0);
      -webkit-transform: translate(-30px, 0);
      -moz-transform: translate(-30px, 0);
      -ms-transform: translate(-30px, 0);
      -o-transform: translate(-30px, 0);
    }
    .webBox header #webmenu li .menu_body .subOption li .sub2Option li .sub3Option {
      transform: translate(-30px, 0);
      -webkit-transform: translate(-30px, 0);
      -moz-transform: translate(-30px, 0);
      -ms-transform: translate(-30px, 0);
      -o-transform: translate(-30px, 0);
    }
    .webBox header #webmenu li .menu_body .subOption li .sub2Option li:hover .sub3Option {
      transform: translate(0, 0);
      -webkit-transform: translate(0, 0);
      -moz-transform: translate(0, 0);
      -ms-transform: translate(0, 0);
      -o-transform: translate(0, 0);
    }
    .webBox header #webmenu li .menu_body .subOption li:hover .sub2Option {
      transform: translate(0, 0);
      -webkit-transform: translate(0, 0);
      -moz-transform: translate(0, 0);
      -ms-transform: translate(0, 0);
      -o-transform: translate(0, 0);
    }
    .webBox header #webmenu li:hover .menu_body {
      transform: translate(0, 0);
      -webkit-transform: translate(0, 0);
      -moz-transform: translate(0, 0);
      -ms-transform: translate(0, 0);
      -o-transform: translate(0, 0);
    }
    .webBox header #webmenu li:last-child .menu_body .subOption li .sub2Option {
      transform: translate(30px, 0);
      -webkit-transform: translate(30px, 0);
      -moz-transform: translate(30px, 0);
      -ms-transform: translate(30px, 0);
      -o-transform: translate(30px, 0);
    }
    .webBox header #webmenu li:last-child .menu_body .subOption li .sub2Option li .sub3Option {
      transform: translate(30px, 0);
      -webkit-transform: translate(30px, 0);
      -moz-transform: translate(30px, 0);
      -ms-transform: translate(30px, 0);
      -o-transform: translate(30px, 0);
    }
    .webBox header #webmenu li:last-child .menu_body .subOption li .sub2Option li:hover .sub3Option {
      transform: translate(0, 0);
      -webkit-transform: translate(0, 0);
      -moz-transform: translate(0, 0);
      -ms-transform: translate(0, 0);
      -o-transform: translate(0, 0);
    }
    .webBox header #webmenu li:last-child .menu_body .subOption li:hover .sub2Option {
      transform: translate(0, 0);
      -webkit-transform: translate(0, 0);
      -moz-transform: translate(0, 0);
      -ms-transform: translate(0, 0);
      -o-transform: translate(0, 0);
    }
  }
  .webBox .img_scale img {
    transform: scale(1);
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
  }
  @media (min-width: 1281px) {
    .webBox .img_scale:hover img {
      transform: scale(1.1);
      -webkit-transform: scale(1.1);
      -moz-transform: scale(1.1);
      -ms-transform: scale(1.1);
      -o-transform: scale(1.1);
    }
  }
  .webBox #SeoStarRating font {
    margin-right: 5px;
    display: inline-block;
    line-height: 110%;
    vertical-align: text-bottom;
    color: #ffc107;
  }
  .webBox #SeoStarRating font * {
    color: #ffc107;
  }
  .webBox #SeoStarRating font:first-child {
    font-weight: bold;
    font-size: 18px;
  }
  .webBox #SeoStarRating font:last-child {
    color: #8e8781;
  }
  .webBox #webSeo .seo {
    -webkit-animation: marquee 200s linear infinite;
    animation: marquee 200s linear infinite;
  }
  .webBox #footer_btn a.circ {
    width: 45px;
    height: 45px;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
  }
  /* animation */
  @-webkit-keyframes marquee {
    0% {
      transform: translate(0, 0);
      -webkit-transform: translate(0, 0);
      -moz-transform: translate(0, 0);
      -ms-transform: translate(0, 0);
      -o-transform: translate(0, 0);
    }
    100% {
      transform: translate(-100%, 0);
      -webkit-transform: translate(-100%, 0);
      -moz-transform: translate(-100%, 0);
      -ms-transform: translate(-100%, 0);
      -o-transform: translate(-100%, 0);
    }
  }
  @keyframes marquee {
    0% {
      transform: translate(0, 0);
      -webkit-transform: translate(0, 0);
      -moz-transform: translate(0, 0);
      -ms-transform: translate(0, 0);
      -o-transform: translate(0, 0);
    }
    100% {
      transform: translate(-100%, 0);
      -webkit-transform: translate(-100%, 0);
      -moz-transform: translate(-100%, 0);
      -ms-transform: translate(-100%, 0);
      -o-transform: translate(-100%, 0);
    }
  }