@media screen and (max-width: 767px) {
  /*----------------------------------------------------------------
  font size
  ----------------------------------------------------------------*/
  .f_10 {
    font-size: 4vw;
  }
  .f_12 {
    font-size: 4vw;
  }
  .f_14 {
    font-size: 4vw;
  }
  .f_16 {
    font-size: 4.4vw;
  }
  .f_18 {
    font-size: 4.8vw;
  }
  .f_20 {
    font-size: 5vw;
  }
  .f_22 {
    font-size: 5.2vw;
  }
  .f_24 {
    font-size: 5.4vw;
  }
  .f_26 {
    font-size: 5.6vw;
  }
  .f_28 {
    font-size: 5.8vw;
  }
  .f_30 {
    font-size: 5.8vw;
  }
  .f_32 {
    font-size: 6vw;
  }
  .f_34 {
    font-size: 6vw;
  }
  .f_36 {
    font-size: 6vw;
  }
  .f_38 {
    font-size: 6.2vw;
  }
  .f_40 {
    font-size: 6.2vw;
  }
  .f_42 {
    font-size: 6.2vw;
  }
  .f_44 {
    font-size: 6.4vw;
  }
  .f_46 {
    font-size: 6.4vw;
  }
  .f_48 {
    font-size: 6.6vw;
  }
  .f_50 {
    font-size: 6.6vw;
  }
  .f_52 {
    font-size: 6.8vw;
  }
  .f_54 {
    font-size: 6.8vw;
  }
  .f_56 {
    font-size: 7vw;
  }
  .f_58 {
    font-size: 7vw;
  }
  .f_60 {
    font-size: 7.2vw;
  }
  .f_62 {
    font-size: 7.2vw;
  }
  .f_64 {
    font-size: 7.4vw;
  }
  .f_66 {
    font-size: 7.4vw;
  }
  .f_68 {
    font-size: 7.6vw;
  }
  .f_70 {
    font-size: 7.6vw;
  }
  .f_72 {
    font-size: 7.8vw;
  }
  .f_74 {
    font-size: 7.8vw;
  }
  .f_76 {
    font-size: 8vw;
  }
  .f_78 {
    font-size: 8vw;
  }
  .f_80 {
    font-size: 8.2vw;
  }
  .f_82 {
    font-size: 8.2vw;
  }
  .f_84 {
    font-size: 8.4vw;
  }
  .f_86 {
    font-size: 8.4vw;
  }
  .f_88 {
    font-size: 8.6vw;
  }
  .f_90 {
    font-size: 8.6vw;
  }
  .f_92 {
    font-size: 8.8vw;
  }
  .f_94 {
    font-size: 8.8vw;
  }
  .f_96 {
    font-size: 9vw;
  }
  .f_98 {
    font-size: 9vw;
  }
  .f_100 {
    font-size: 9.2vw;
  }
  .f_102 {
    font-size: 9.2vw;
  }
  .f_104 {
    font-size: 9.4vw;
  }
  .f_106 {
    font-size: 9.4vw;
  }
  .f_108 {
    font-size: 9.6vw;
  }
  .f_110 {
    font-size: 9.6vw;
  }
  .f_112 {
    font-size: 9.8vw;
  }
  .f_114 {
    font-size: 9.8vw;
  }
  .f_116 {
    font-size: 10vw;
  }
  .f_118 {
    font-size: 10vw;
  }
  .f_120 {
    font-size: 10.2vw;
  }
  .f_122 {
    font-size: 10.2vw;
  }
  .f_124 {
    font-size: 10.4vw;
  }
  .f_126 {
    font-size: 10.4vw;
  }
  .f_128 {
    font-size: 10.6vw;
  }
  .f_130 {
    font-size: 10.6vw;
  }
  .f_132 {
    font-size: 10.8vw;
  }
  .f_134 {
    font-size: 10.8vw;
  }
  .f_136 {
    font-size: 11vw;
  }
  .f_138 {
    font-size: 11vw;
  }
  .f_140 {
    font-size: 11.2vw;
  }
  .f_142 {
    font-size: 11.2vw;
  }
  .f_144 {
    font-size: 11.4vw;
  }
  .f_146 {
    font-size: 11.4vw;
  }
  .f_148 {
    font-size: 11.6vw;
  }
  .f_150 {
    font-size: 11.6vw;
  }
  .f_152 {
    font-size: 11.8vw;
  }
  .f_154 {
    font-size: 11.8vw;
  }
  .f_156 {
    font-size: 12vw;
  }
  .f_158 {
    font-size: 12vw;
  }
  .f_160 {
    font-size: 12.2vw;
  }
  .f_162 {
    font-size: 12.2vw;
  }
  .f_164 {
    font-size: 12.2vw;
  }


  /*----------------------------------------------------------------
  margin/padding
  ----------------------------------------------------------------*/
  .mt10 {
    margin-top: 1vw;
  }
  .mb10 {
    margin-bottom: 1vw;
  }
  .ml10 {
    margin-left: 1vw;
  }
  .mr10 {
    margin-right: 1vw;
  }
  .my10 {
    margin-top: 1vw;
    margin-bottom: 1vw;
  }
  .mx10 {
    margin-left: 1vw;
    margin-right: 1vw;
  }
  .mt20 {
    margin-top: 2vw;
  }
  .mb20 {
    margin-bottom: 2vw;
  }
  .ml20 {
    margin-left: 2vw;
  }
  .mr20 {
    margin-right: 2vw;
  }
  .my20 {
    margin-top: 2vw;
    margin-bottom: 2vw;
  }
  .mx20 {
    margin-left: 2vw;
    margin-right: 2vw;
  }
  .mt30 {
    margin-top: 3vw;
  }
  .mb30 {
    margin-bottom: 3vw;
  }
  .ml30 {
    margin-left: 3vw;
  }
  .mr30 {
    margin-right: 3vw;
  }
  .my30 {
    margin-top: 3vw;
    margin-bottom: 3vw;
  }
  .mx30 {
    margin-left: 3vw;
    margin-right: 3vw;
  }
  .mt40 {
    margin-top: 4vw;
  }
  .mb40 {
    margin-bottom: 4vw;
  }
  .ml40 {
    margin-left: 4vw;
  }
  .mr40 {
    margin-right: 4vw;
  }
  .my40 {
    margin-top: 4vw;
    margin-bottom: 4vw;
  }
  .mx40 {
    margin-left: 4vw;
    margin-right: 4vw;
  }
  .mt50 {
    margin-top: 5vw;
  }
  .mb50 {
    margin-bottom: 5vw;
  }
  .ml50 {
    margin-left: 5vw;
  }
  .mr50 {
    margin-right: 5vw;
  }
  .my50 {
    margin-top: 5vw;
    margin-bottom: 5vw;
  }
  .mx50 {
    margin-left: 5vw;
    margin-right: 5vw;
  }
  .mt60 {
    margin-top: 6vw;
  }
  .mb60 {
    margin-bottom: 6vw;
  }
  .ml60 {
    margin-left: 6vw;
  }
  .mr60 {
    margin-right: 6vw;
  }
  .my60 {
    margin-top: 6vw;
    margin-bottom: 6vw;
  }
  .mx60 {
    margin-left: 6vw;
    margin-right: 6vw;
  }
  .mt70 {
    margin-top: 7vw;
  }
  .mb70 {
    margin-bottom: 7vw;
  }
  .ml70 {
    margin-left: 7vw;
  }
  .mr70 {
    margin-right: 7vw;
  }
  .my70 {
    margin-top: 7vw;
    margin-bottom: 7vw;
  }
  .mx70 {
    margin-left: 7vw;
    margin-right: 7vw;
  }
  .mt80 {
    margin-top: 8vw;
  }
  .mb80 {
    margin-bottom: 8vw;
  }
  .ml80 {
    margin-left: 8vw;
  }
  .mr80 {
    margin-right: 8vw;
  }
  .my80 {
    margin-top: 8vw;
    margin-bottom: 8vw;
  }
  .mx80 {
    margin-left: 8vw;
    margin-right: 8vw;
  }
  .mt90 {
    margin-top: 9vw;
  }
  .mb90 {
    margin-bottom: 9vw;
  }
  .ml90 {
    margin-left: 9vw;
  }
  .mr90 {
    margin-right: 9vw;
  }
  .my90 {
    margin-top: 9vw;
    margin-bottom: 9vw;
  }
  .mx90 {
    margin-left: 9vw;
    margin-right: 9vw;
  }
  .mt100 {
    margin-top: 10vw;
  }
  .mb100 {
    margin-bottom: 10vw;
  }
  .ml100 {
    margin-left: 10vw;
  }
  .mr100 {
    margin-right: 10vw;
  }
  .my100 {
    margin-top: 10vw;
    margin-bottom: 10vw;
  }
  .mx100 {
    margin-left: 10vw;
    margin-right: 10vw;
  }
  .mt110 {
    margin-top: 11vw;
  }
  .mb110 {
    margin-bottom: 11vw;
  }
  .ml110 {
    margin-left: 11vw;
  }
  .mr110 {
    margin-right: 11vw;
  }
  .my110 {
    margin-top: 11vw;
    margin-bottom: 11vw;
  }
  .mx110 {
    margin-left: 11vw;
    margin-right: 11vw;
  }
  .mt120 {
    margin-top: 12vw;
  }
  .mb120 {
    margin-bottom: 12vw;
  }
  .ml120 {
    margin-left: 12vw;
  }
  .mr120 {
    margin-right: 12vw;
  }
  .my120 {
    margin-top: 12vw;
    margin-bottom: 12vw;
  }
  .mx120 {
    margin-left: 12vw;
    margin-right: 12vw;
  }
  .mt130 {
    margin-top: 13vw;
  }
  .mb130 {
    margin-bottom: 13vw;
  }
  .ml130 {
    margin-left: 13vw;
  }
  .mr130 {
    margin-right: 13vw;
  }
  .my130 {
    margin-top: 13vw;
    margin-bottom: 13vw;
  }
  .mx130 {
    margin-left: 13vw;
    margin-right: 13vw;
  }
  .mt140 {
    margin-top: 14vw;
  }
  .mb140 {
    margin-bottom: 14vw;
  }
  .ml140 {
    margin-left: 14vw;
  }
  .mr140 {
    margin-right: 14vw;
  }
  .my140 {
    margin-top: 14vw;
    margin-bottom: 14vw;
  }
  .mx140 {
    margin-left: 14vw;
    margin-right: 14vw;
  }
  .mt150 {
    margin-top: 15vw;
  }
  .mb150 {
    margin-bottom: 15vw;
  }
  .ml150 {
    margin-left: 15vw;
  }
  .mr150 {
    margin-right: 15vw;
  }
  .my150 {
    margin-top: 15vw;
    margin-bottom: 15vw;
  }
  .mx150 {
    margin-left: 15vw;
    margin-right: 15vw;
  }
  .mt160 {
    margin-top: 16vw;
  }
  .mb160 {
    margin-bottom: 16vw;
  }
  .ml160 {
    margin-left: 16vw;
  }
  .mr160 {
    margin-right: 16vw;
  }
  .my160 {
    margin-top: 16vw;
    margin-bottom: 16vw;
  }
  .mx160 {
    margin-left: 16vw;
    margin-right: 16vw;
  }
  .mt170 {
    margin-top: 17vw;
  }
  .mb170 {
    margin-bottom: 17vw;
  }
  .ml170 {
    margin-left: 17vw;
  }
  .mr170 {
    margin-right: 17vw;
  }
  .my170 {
    margin-top: 17vw;
    margin-bottom: 17vw;
  }
  .mx170 {
    margin-left: 17vw;
    margin-right: 17vw;
  }
  .mt180 {
    margin-top: 18vw;
  }
  .mb180 {
    margin-bottom: 18vw;
  }
  .ml180 {
    margin-left: 18vw;
  }
  .mr180 {
    margin-right: 18vw;
  }
  .my180 {
    margin-top: 18vw;
    margin-bottom: 18vw;
  }
  .mx180 {
    margin-left: 18vw;
    margin-right: 18vw;
  }
  .mt190 {
    margin-top: 19vw;
  }
  .mb190 {
    margin-bottom: 19vw;
  }
  .ml190 {
    margin-left: 19vw;
  }
  .mr190 {
    margin-right: 19vw;
  }
  .my190 {
    margin-top: 19vw;
    margin-bottom: 19vw;
  }
  .mx190 {
    margin-left: 19vw;
    margin-right: 19vw;
  }
  .mt200 {
    margin-top: 20vw;
  }
  .mb200 {
    margin-bottom: 20vw;
  }
  .ml200 {
    margin-left: 20vw;
  }
  .mr200 {
    margin-right: 20vw;
  }
  .my200 {
    margin-top: 20vw;
    margin-bottom: 20vw;
  }
  .mx200 {
    margin-left: 20vw;
    margin-right: 20vw;
  }
  .mt210 {
    margin-top: 21vw;
  }
  .mb210 {
    margin-bottom: 21vw;
  }
  .ml210 {
    margin-left: 21vw;
  }
  .mr210 {
    margin-right: 21vw;
  }
  .my210 {
    margin-top: 21vw;
    margin-bottom: 21vw;
  }
  .mx210 {
    margin-left: 21vw;
    margin-right: 21vw;
  }
  .mt220 {
    margin-top: 22vw;
  }
  .mb220 {
    margin-bottom: 22vw;
  }
  .ml220 {
    margin-left: 22vw;
  }
  .mr220 {
    margin-right: 22vw;
  }
  .my220 {
    margin-top: 22vw;
    margin-bottom: 22vw;
  }
  .mx220 {
    margin-left: 22vw;
    margin-right: 22vw;
  }
  .mt230 {
    margin-top: 23vw;
  }
  .mb230 {
    margin-bottom: 23vw;
  }
  .ml230 {
    margin-left: 23vw;
  }
  .mr230 {
    margin-right: 23vw;
  }
  .my230 {
    margin-top: 23vw;
    margin-bottom: 23vw;
  }
  .mx230 {
    margin-left: 23vw;
    margin-right: 23vw;
  }
  .mt240 {
    margin-top: 24vw;
  }
  .mb240 {
    margin-bottom: 24vw;
  }
  .ml240 {
    margin-left: 24vw;
  }
  .mr240 {
    margin-right: 24vw;
  }
  .my240 {
    margin-top: 24vw;
    margin-bottom: 24vw;
  }
  .mx240 {
    margin-left: 24vw;
    margin-right: 24vw;
  }
  .mt250 {
    margin-top: 25vw;
  }
  .mb250 {
    margin-bottom: 25vw;
  }
  .ml250 {
    margin-left: 25vw;
  }
  .mr250 {
    margin-right: 25vw;
  }
  .my250 {
    margin-top: 25vw;
    margin-bottom: 25vw;
  }
  .mx250 {
    margin-left: 25vw;
    margin-right: 25vw;
  }
  .mt260 {
    margin-top: 26vw;
  }
  .mb260 {
    margin-bottom: 26vw;
  }
  .ml260 {
    margin-left: 26vw;
  }
  .mr260 {
    margin-right: 26vw;
  }
  .my260 {
    margin-top: 26vw;
    margin-bottom: 26vw;
  }
  .mx260 {
    margin-left: 26vw;
    margin-right: 26vw;
  }
  .mt270 {
    margin-top: 27vw;
  }
  .mb270 {
    margin-bottom: 27vw;
  }
  .ml270 {
    margin-left: 27vw;
  }
  .mr270 {
    margin-right: 27vw;
  }
  .my270 {
    margin-top: 27vw;
    margin-bottom: 27vw;
  }
  .mx270 {
    margin-left: 27vw;
    margin-right: 27vw;
  }
  .mt280 {
    margin-top: 28vw;
  }
  .mb280 {
    margin-bottom: 28vw;
  }
  .ml280 {
    margin-left: 28vw;
  }
  .mr280 {
    margin-right: 28vw;
  }
  .my280 {
    margin-top: 28vw;
    margin-bottom: 28vw;
  }
  .mx280 {
    margin-left: 28vw;
    margin-right: 28vw;
  }
  .mt290 {
    margin-top: 29vw;
  }
  .mb290 {
    margin-bottom: 29vw;
  }
  .ml290 {
    margin-left: 29vw;
  }
  .mr290 {
    margin-right: 29vw;
  }
  .my290 {
    margin-top: 29vw;
    margin-bottom: 29vw;
  }
  .mx290 {
    margin-left: 29vw;
    margin-right: 29vw;
  }
  .mt300 {
    margin-top: 30vw;
  }
  .mb300 {
    margin-bottom: 30vw;
  }
  .ml300 {
    margin-left: 30vw;
  }
  .mr300 {
    margin-right: 30vw;
  }
  .my300 {
    margin-top: 30vw;
    margin-bottom: 30vw;
  }
  .mx300 {
    margin-left: 30vw;
    margin-right: 30vw;
  }
  .pt10 {
    padding-top: 1vw;
  }
  .pb10 {
    padding-bottom: 1vw;
  }
  .pl10 {
    padding-left: 1vw;
  }
  .pr10 {
    padding-right: 1vw;
  }
  .py10 {
    padding-top: 1vw;
    padding-bottom: 1vw;
  }
  .px10 {
    padding-left: 1vw;
    padding-right: 1vw;
  }
  .pt20 {
    padding-top: 2vw;
  }
  .pb20 {
    padding-bottom: 2vw;
  }
  .pl20 {
    padding-left: 2vw;
  }
  .pr20 {
    padding-right: 2vw;
  }
  .py20 {
    padding-top: 2vw;
    padding-bottom: 2vw;
  }
  .px20 {
    padding-left: 2vw;
    padding-right: 2vw;
  }
  .pt30 {
    padding-top: 3vw;
  }
  .pb30 {
    padding-bottom: 3vw;
  }
  .pl30 {
    padding-left: 3vw;
  }
  .pr30 {
    padding-right: 3vw;
  }
  .py30 {
    padding-top: 3vw;
    padding-bottom: 3vw;
  }
  .px30 {
    padding-left: 3vw;
    padding-right: 3vw;
  }
  .pt40 {
    padding-top: 4vw;
  }
  .pb40 {
    padding-bottom: 4vw;
  }
  .pl40 {
    padding-left: 4vw;
  }
  .pr40 {
    padding-right: 4vw;
  }
  .py40 {
    padding-top: 4vw;
    padding-bottom: 4vw;
  }
  .px40 {
    padding-left: 4vw;
    padding-right: 4vw;
  }
  .pt50 {
    padding-top: 5vw;
  }
  .pb50 {
    padding-bottom: 5vw;
  }
  .pl50 {
    padding-left: 5vw;
  }
  .pr50 {
    padding-right: 5vw;
  }
  .py50 {
    padding-top: 5vw;
    padding-bottom: 5vw;
  }
  .px50 {
    padding-left: 5vw;
    padding-right: 5vw;
  }
  .pt60 {
    padding-top: 6vw;
  }
  .pb60 {
    padding-bottom: 6vw;
  }
  .pl60 {
    padding-left: 6vw;
  }
  .pr60 {
    padding-right: 6vw;
  }
  .py60 {
    padding-top: 6vw;
    padding-bottom: 6vw;
  }
  .px60 {
    padding-left: 6vw;
    padding-right: 6vw;
  }
  .pt70 {
    padding-top: 7vw;
  }
  .pb70 {
    padding-bottom: 7vw;
  }
  .pl70 {
    padding-left: 7vw;
  }
  .pr70 {
    padding-right: 7vw;
  }
  .py70 {
    padding-top: 7vw;
    padding-bottom: 7vw;
  }
  .px70 {
    padding-left: 7vw;
    padding-right: 7vw;
  }
  .pt80 {
    padding-top: 8vw;
  }
  .pb80 {
    padding-bottom: 8vw;
  }
  .pl80 {
    padding-left: 8vw;
  }
  .pr80 {
    padding-right: 8vw;
  }
  .py80 {
    padding-top: 8vw;
    padding-bottom: 8vw;
  }
  .px80 {
    padding-left: 8vw;
    padding-right: 8vw;
  }
  .pt90 {
    padding-top: 9vw;
  }
  .pb90 {
    padding-bottom: 9vw;
  }
  .pl90 {
    padding-left: 9vw;
  }
  .pr90 {
    padding-right: 9vw;
  }
  .py90 {
    padding-top: 9vw;
    padding-bottom: 9vw;
  }
  .px90 {
    padding-left: 9vw;
    padding-right: 9vw;
  }
  .pt100 {
    padding-top: 10vw;
  }
  .pb100 {
    padding-bottom: 10vw;
  }
  .pl100 {
    padding-left: 10vw;
  }
  .pr100 {
    padding-right: 10vw;
  }
  .py100 {
    padding-top: 10vw;
    padding-bottom: 10vw;
  }
  .px100 {
    padding-left: 10vw;
    padding-right: 10vw;
  }
  .pt110 {
    padding-top: 11vw;
  }
  .pb110 {
    padding-bottom: 11vw;
  }
  .pl110 {
    padding-left: 11vw;
  }
  .pr110 {
    padding-right: 11vw;
  }
  .py110 {
    padding-top: 11vw;
    padding-bottom: 11vw;
  }
  .px110 {
    padding-left: 11vw;
    padding-right: 11vw;
  }
  .pt120 {
    padding-top: 12vw;
  }
  .pb120 {
    padding-bottom: 12vw;
  }
  .pl120 {
    padding-left: 12vw;
  }
  .pr120 {
    padding-right: 12vw;
  }
  .py120 {
    padding-top: 12vw;
    padding-bottom: 12vw;
  }
  .px120 {
    padding-left: 12vw;
    padding-right: 12vw;
  }
  .pt130 {
    padding-top: 13vw;
  }
  .pb130 {
    padding-bottom: 13vw;
  }
  .pl130 {
    padding-left: 13vw;
  }
  .pr130 {
    padding-right: 13vw;
  }
  .py130 {
    padding-top: 13vw;
    padding-bottom: 13vw;
  }
  .px130 {
    padding-left: 13vw;
    padding-right: 13vw;
  }
  .pt140 {
    padding-top: 14vw;
  }
  .pb140 {
    padding-bottom: 14vw;
  }
  .pl140 {
    padding-left: 14vw;
  }
  .pr140 {
    padding-right: 14vw;
  }
  .py140 {
    padding-top: 14vw;
    padding-bottom: 14vw;
  }
  .px140 {
    padding-left: 14vw;
    padding-right: 14vw;
  }
  .pt150 {
    padding-top: 15vw;
  }
  .pb150 {
    padding-bottom: 15vw;
  }
  .pl150 {
    padding-left: 15vw;
  }
  .pr150 {
    padding-right: 15vw;
  }
  .py150 {
    padding-top: 15vw;
    padding-bottom: 15vw;
  }
  .px150 {
    padding-left: 15vw;
    padding-right: 15vw;
  }
  .pt160 {
    padding-top: 16vw;
  }
  .pb160 {
    padding-bottom: 16vw;
  }
  .pl160 {
    padding-left: 16vw;
  }
  .pr160 {
    padding-right: 16vw;
  }
  .py160 {
    padding-top: 16vw;
    padding-bottom: 16vw;
  }
  .px160 {
    padding-left: 16vw;
    padding-right: 16vw;
  }
  .pt170 {
    padding-top: 17vw;
  }
  .pb170 {
    padding-bottom: 17vw;
  }
  .pl170 {
    padding-left: 17vw;
  }
  .pr170 {
    padding-right: 17vw;
  }
  .py170 {
    padding-top: 17vw;
    padding-bottom: 17vw;
  }
  .px170 {
    padding-left: 17vw;
    padding-right: 17vw;
  }
  .pt180 {
    padding-top: 18vw;
  }
  .pb180 {
    padding-bottom: 18vw;
  }
  .pl180 {
    padding-left: 18vw;
  }
  .pr180 {
    padding-right: 18vw;
  }
  .py180 {
    padding-top: 18vw;
    padding-bottom: 18vw;
  }
  .px180 {
    padding-left: 18vw;
    padding-right: 18vw;
  }
  .pt190 {
    padding-top: 19vw;
  }
  .pb190 {
    padding-bottom: 19vw;
  }
  .pl190 {
    padding-left: 19vw;
  }
  .pr190 {
    padding-right: 19vw;
  }
  .py190 {
    padding-top: 19vw;
    padding-bottom: 19vw;
  }
  .px190 {
    padding-left: 19vw;
    padding-right: 19vw;
  }
  .pt200 {
    padding-top: 20vw;
  }
  .pb200 {
    padding-bottom: 20vw;
  }
  .pl200 {
    padding-left: 20vw;
  }
  .pr200 {
    padding-right: 20vw;
  }
  .py200 {
    padding-top: 20vw;
    padding-bottom: 20vw;
  }
  .px200 {
    padding-left: 20vw;
    padding-right: 20vw;
  }
  .pt210 {
    padding-top: 21vw;
  }
  .pb210 {
    padding-bottom: 21vw;
  }
  .pl210 {
    padding-left: 21vw;
  }
  .pr210 {
    padding-right: 21vw;
  }
  .py210 {
    padding-top: 21vw;
    padding-bottom: 21vw;
  }
  .px210 {
    padding-left: 21vw;
    padding-right: 21vw;
  }
  .pt220 {
    padding-top: 22vw;
  }
  .pb220 {
    padding-bottom: 22vw;
  }
  .pl220 {
    padding-left: 22vw;
  }
  .pr220 {
    padding-right: 22vw;
  }
  .py220 {
    padding-top: 22vw;
    padding-bottom: 22vw;
  }
  .px220 {
    padding-left: 22vw;
    padding-right: 22vw;
  }
  .pt230 {
    padding-top: 23vw;
  }
  .pb230 {
    padding-bottom: 23vw;
  }
  .pl230 {
    padding-left: 23vw;
  }
  .pr230 {
    padding-right: 23vw;
  }
  .py230 {
    padding-top: 23vw;
    padding-bottom: 23vw;
  }
  .px230 {
    padding-left: 23vw;
    padding-right: 23vw;
  }
  .pt240 {
    padding-top: 24vw;
  }
  .pb240 {
    padding-bottom: 24vw;
  }
  .pl240 {
    padding-left: 24vw;
  }
  .pr240 {
    padding-right: 24vw;
  }
  .py240 {
    padding-top: 24vw;
    padding-bottom: 24vw;
  }
  .px240 {
    padding-left: 24vw;
    padding-right: 24vw;
  }
  .pt250 {
    padding-top: 25vw;
  }
  .pb250 {
    padding-bottom: 25vw;
  }
  .pl250 {
    padding-left: 25vw;
  }
  .pr250 {
    padding-right: 25vw;
  }
  .py250 {
    padding-top: 25vw;
    padding-bottom: 25vw;
  }
  .px250 {
    padding-left: 25vw;
    padding-right: 25vw;
  }
  .pt260 {
    padding-top: 26vw;
  }
  .pb260 {
    padding-bottom: 26vw;
  }
  .pl260 {
    padding-left: 26vw;
  }
  .pr260 {
    padding-right: 26vw;
  }
  .py260 {
    padding-top: 26vw;
    padding-bottom: 26vw;
  }
  .px260 {
    padding-left: 26vw;
    padding-right: 26vw;
  }
  .pt270 {
    padding-top: 27vw;
  }
  .pb270 {
    padding-bottom: 27vw;
  }
  .pl270 {
    padding-left: 27vw;
  }
  .pr270 {
    padding-right: 27vw;
  }
  .py270 {
    padding-top: 27vw;
    padding-bottom: 27vw;
  }
  .px270 {
    padding-left: 27vw;
    padding-right: 27vw;
  }
  .pt280 {
    padding-top: 28vw;
  }
  .pb280 {
    padding-bottom: 28vw;
  }
  .pl280 {
    padding-left: 28vw;
  }
  .pr280 {
    padding-right: 28vw;
  }
  .py280 {
    padding-top: 28vw;
    padding-bottom: 28vw;
  }
  .px280 {
    padding-left: 28vw;
    padding-right: 28vw;
  }
  .pt290 {
    padding-top: 29vw;
  }
  .pb290 {
    padding-bottom: 29vw;
  }
  .pl290 {
    padding-left: 29vw;
  }
  .pr290 {
    padding-right: 29vw;
  }
  .py290 {
    padding-top: 29vw;
    padding-bottom: 29vw;
  }
  .px290 {
    padding-left: 29vw;
    padding-right: 29vw;
  }
  .pt300 {
    padding-top: 30vw;
  }
  .pb300 {
    padding-bottom: 30vw;
  }
  .pl300 {
    padding-left: 30vw;
  }
  .pr300 {
    padding-right: 30vw;
  }
  .py300 {
    padding-top: 30vw;
    padding-bottom: 30vw;
  }
  .px300 {
    padding-left: 30vw;
    padding-right: 30vw;
  }


  /*----------------------------------------------------------------
  header
  ----------------------------------------------------------------*/
  .hamburger .hamburger-contents .sp-logo {
    position: fixed;
    top: 0;
    left: 0;
    height: 60px;
    width: 100%;
    z-index: 1002;
    padding-left: 0px;
    display: flex;
    justify-content: start;
    align-items: center;
    background: #fff;
    border-bottom: 1px solid #004da1;
  }
  .hamburger .hamburger-contents .sp-logo a {
    max-width: 111px;
    width: 30%;
    display: block;
    background-position: left center;
    background-repeat: no-repeat;
    background-size: contain;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    margin-left: 6vw;
  }
  .hamburger .hamburger-contents .menu-trigger {
    z-index: 1003;
    position: fixed;
    top: 0px;
    right: 0px;
    width: 60px;
    height: 60px;
    padding: 20px 16px;
  }
  .hamburger .hamburger-contents .menu-trigger span {
    z-index: 1003;
    display: inline-block;
    box-sizing: border-box;
    position: absolute;
    left: 22px;
    width: 26px;
    height: 2px;
    background-color: #004da1;
    transition: all 0.4s ease;
  }
  .hamburger .hamburger-contents .menu-trigger span:nth-of-type(1) {
    top: 22px;
  }
  .hamburger .hamburger-contents .menu-trigger span:nth-of-type(2) {
    top: 31px;
  }
  .hamburger .hamburger-contents .menu-trigger span:nth-of-type(3) {
    bottom: 18px;
  }
  .hamburger .hamburger-contents .menu-trigger.active span:nth-of-type(1) {
    transform: rotate(-45deg);
    margin-top: 9px;
  }
  .hamburger .hamburger-contents .menu-trigger.active span:nth-of-type(2) {
    opacity: 0;
  }
  .hamburger .hamburger-contents .menu-trigger.active span:nth-of-type(3) {
    transform: rotate(45deg);
    margin-bottom: 9px;
  }
  .hamburger .hamburger-contents nav {
    position: absolute;
    background-color: #004da1;
    width: 100%;
    height: 100%;
    position: fixed;
    bottom: 0%;
    transform: translateY(-150%);
    transition: 0.5s ease-in-out;
    padding: 60px 0 30px;
    overflow: auto;
    z-index: 1000;
  }
  .hamburger .hamburger-contents nav.open {
    transform: translateY(0);
    z-index: 1000;
    transition: 0.5s ease-in-out;
  }
  .hamburger .hamburger-contents nav .nav-inner {
    padding: 4.5vh 5%;
  }
  .hamburger .hamburger-contents nav .nav-inner .sp-menu-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
  .hamburger .hamburger-contents nav .nav-inner .sp-menu-list a {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    width: 47%;
    height: 6vh;
    margin-bottom: 1vh;
    position: relative;
  }
  .hamburger .hamburger-contents nav .nav-inner .sp-menu-list a:hover {
    opacity: 1;
  }
  .hamburger .hamburger-contents nav .nav-inner .sp-menu-list .sp-menu-list-item {
    font-size: 3.8vw;
    border-bottom: 1px solid #fff;
    margin-bottom: 4vw;
  }
  .hamburger .hamburger-contents nav .nav-inner .sp-menu-list .sp-menu-list-item:hover {
    opacity: 1;
    color: #fff;
  }
  .hamburger .hamburger-contents nav .nav-inner .button_box .tel {
    width: 100%;
    height: 24vw;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #00992b;
    background-color: #fff;
    border: 2px solid #00992b;
    border-radius: 10px;
    box-shadow: 5px 5px 0px #00992b, 5px 5px 0px 2px #00992b;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 6vw;
  }
  .hamburger .hamburger-contents nav .nav-inner .button_box .tel a {
    text-align: center;
  }
  .hamburger .hamburger-contents nav .nav-inner .button_box .tel a .subtext {
    font-size: 3.6vw;
    letter-spacing: 0.1em;
  }
  .hamburger .hamburger-contents nav .nav-inner .button_box .tel a .number {
    display: flex;
    align-items: center;
    font-size: 8.4vw;
    line-height: 0.8;
    letter-spacing: 0.1em;
  }
  .hamburger .hamburger-contents nav .nav-inner .button_box .tel a .number .material-icons-outlined {
    font-size: 7.2vw;
    margin-right: 0.5vw;
  }
  .hamburger .hamburger-contents nav .nav-inner .button_box .button_common.form {
    width: 100%;
  }


  /*----------------------------------------------------------------
  common
  ----------------------------------------------------------------*/
  .sp {
    display: block !important;
  }
  .sp_flex {
    display: flex !important;
  }
  .pc {
    display: none !important;
  }
  .pc_flex {
    display: none !important;
  }
  ::placeholder {
    font-size: 3.6vw;
    letter-spacing: 0.12em;
    color: #cccccc;
  }
  .sub_visual {
    padding-top: 90px;
  }
  .sub_visual .sub_visual_inner {
    background-size: 100%;
    max-width: 90%;
    max-height: 124px;
  }
  .sub_visual .sub_visual_inner .title_box {
    max-width: 57vw;
    left: 26vw;
    max-height: 26vw;
  }
  .sub_visual .sub_visual_inner .title_box .title_box_inner {
    max-width: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
  }
  .sub_visual .sub_visual_inner .title_box .title_box_inner .content_number {
    width: 33%;
    height: fit-content;
    font-size: 2.4vw;
    text-align: center;
    margin-left: 0;
    margin-right: 2vw;
    margin-bottom: 0;
  }
  .sub_visual .sub_visual_inner .title_box .title_box_inner h2 {
    width: fit-content;
    border-bottom: none;
    font-size: 3.6vw;
    text-align: left !important;
    margin-bottom: 0;
    padding-bottom: 0;
  }
  .sub_visual .sub_visual_inner .title_box .title_box_inner h3 {
    width: 100%;
    border-top: 1px solid #004da1;
    font-size: 2.8vw;
    text-align: center;
    line-height: 1.4;
    padding-top: 1vw;
    margin-top: 1vw;
  }
  .divider p {
    max-width: 40vw;
    font-size: 2.8vw;
    text-align: center;
  }
  .next_page {
    padding-top: 30px;
  }
  .next_page .next_page_inner {
    background-size: 100%;
    max-width: 95%;
    max-height: 115px;
  }
  .next_page .next_page_inner .title_box {
    max-width: 60vw;
    left: 30vw;
    max-height: 25vw;
  }
  .next_page .next_page_inner .title_box:hover {
    opacity: 1;
  }
  .next_page .next_page_inner .title_box .title_box_inner {
    max-width: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
  }
  .next_page .next_page_inner .title_box .title_box_inner .next_page_text {
    width: 38%;
    height: fit-content;
    font-size: 2.4vw;
    text-align: center;
    margin-left: 0;
    margin-right: 2vw;
    margin-bottom: 0;
  }
  .next_page .next_page_inner .title_box .title_box_inner h2 {
    width: fit-content;
    border-bottom: none;
    font-size: 3.6vw;
    text-align: left !important;
    margin-bottom: 0;
    padding-bottom: 0;
  }
  .next_page .next_page_inner .title_box .title_box_inner h3 {
    width: 100%;
    border-top: 1px solid #004da1;
    font-size: 2.4vw;
    text-align: center;
    line-height: 1.4;
    padding-top: 1vw;
    margin-top: 1vw;
  }


  /*----------------------------------------------------------------
  about
  ----------------------------------------------------------------*/
  #about .intro {
    height: auto;
    margin-top: 30px;
    padding-top: 0;
  }
  #about .intro .image_box {
    position: relative;
    height: 47vw;
  }
  #about .intro .image_box .picture {
    max-width: 90%;
    width: 100vw;
    left: 0;
    right: 0;
    margin: auto;
  }
  #about .intro .message_box {
    max-width: none;
    width: 90%;
    position: relative;
    left: 0;
    top: 0;
  }
  #about .intro .message_box h4 {
    margin-bottom: 3vw;
  }
  #about .intro .message_box h4 span {
    font-size: 5.4vw;
  }
  #about .intro .message_box p {
    font-size: 3.8vw;
  }
  #about .intro .square {
    height: 10vw;
    margin-top: 0;
  }
  #about .reason .head_box {
    max-width: 100%;
  }
  #about .reason .head_box .image {
    max-width: 32vw;
    margin-right: 5vw;
  }
  #about .reason .head_box h4 {
    font-size: 5.4vw;
  }
  #about .reason .head_box h4 span {
    font-size: 5.4vw;
    line-height: 1.4;
    display: block;
  }
  #about .reason .detail_box {
    max-width: 90%;
    margin-bottom: 12vw;
    padding: 0;
  }
  #about .reason .detail_box:nth-child(even) .content_box {
    flex-direction: column-reverse;
  }
  #about .reason .detail_box .oval {
    max-width: 28vw;
    font-size: 2.8vw;
    text-align: center;
  }
  #about .reason .detail_box h5 {
    font-size: 5.4vw;
    text-align: center;
    margin-bottom: 3vw;
  }
  #about .reason .detail_box .content_box {
    flex-direction: column;
  }
  #about .reason .detail_box .content_box .image {
    width: 100%;
    margin-bottom: 3vw;
  }
  #about .reason .detail_box .content_box .text {
    width: 100%;
  }
  #about .reason .detail_box .content_box .text p {
    font-size: 3.8vw;
  }
  #about .training .training_inner {
    max-width: 90%;
    margin-top: 10vw;
    margin-left: auto;
    margin-right: auto;
    padding: 0;
  }
  #about .training .training_inner .head .arrow_box {
    max-width: 100%;
    max-height: 20vw;
    font-size: 4.2vw;
    line-height: 1.4;
    margin-bottom: 10vw;
    padding-right: 20%;
  }
  #about .training .training_inner .head .arrow_image {
    max-width: 30%;
    top: -20px;
    right: -3%;
  }
  #about .training .training_inner .detail_box {
    flex-direction: column;
    gap: 0;
  }
  #about .training .training_inner .detail_box .picture {
    margin-bottom: 3vw;
  }
  #about .training .training_inner .detail_box .text p {
    font-size: 3.8vw;
  }
  #about .activity .activity_inner {
    flex-direction: column;
    max-width: 90%;
    padding: 0;
  }
  #about .activity .activity_inner h5 {
    font-size: 4.8vw;
    text-align: center;
    padding: 3vw 0;
  }
  #about .activity .activity_inner .detail_box {
    width: 100%;
    padding: 5%;
  }
  #about .activity .activity_inner .detail_box:last-child {
    margin-top: 10vw;
  }
  #about .activity .activity_inner .detail_box h6 {
    font-size: 5.4vw;
  }
  #about .activity .activity_inner .detail_box h6 .icon {
    max-width: 50px;
  }
  #about .activity .activity_inner .detail_box p {
    font-size: 3.8vw;
  }

  /*----------------------------------------------------------------
  trouble
  ----------------------------------------------------------------*/
  #trouble .intro {
    padding-bottom: 16vw;
  }
  #trouble .intro .intro_inner {
    max-width: 90%;
  }
  #trouble .intro .intro_inner .head {
    max-width: 90%;
    margin-bottom: 8vw;
  }
  #trouble .intro .intro_inner .head .icon {
    max-width: 20vw;
  }
  #trouble .intro .intro_inner .head h4 {
    font-size: 5.4vw;
  }
  #trouble .intro .intro_inner .head h4 span {
    font-size: 5.4vw;
  }
  #trouble .intro .intro_inner .detail_box {
    flex-direction: column;
    padding: 0;
  }
  #trouble .intro .intro_inner .detail_box .detail {
    width: 100%;
    margin-bottom: 16vw;
  }
  #trouble .intro .intro_inner .detail_box .detail .text .before {
    margin-bottom: 13vw;
  }
  #trouble .intro .intro_inner .detail_box .detail .text .before p {
    font-size: 4.2vw;
  }
  #trouble .intro .intro_inner .detail_box .detail .text .before p span {
    font-size: 5.4vw;
  }
  #trouble .intro .intro_inner .detail_box .detail .text .after {
    min-height: auto;
  }
  #trouble .intro .intro_inner .detail_box .detail .text .after p {
    font-size: 3.8vw;
  }
  #trouble .intro .intro_inner .detail_box .detail:last-child {
    margin-bottom: 0;
  }
  #trouble .intro .intro_inner .comment:after {
    bottom: -9vw;
  }
  #trouble .intro .intro_inner .comment p:first-child {
    font-size: 3.8vw;
  }
  #trouble .intro .intro_inner .comment p:last-child {
    font-size: 4.2vw;
  }
  #trouble .case .case_inner {
    max-width: 90%;
  }
  #trouble .case .case_inner h4 {
    font-size: 5.4vw;
    text-align: center;
  }
  #trouble .case .case_inner .detail_box {
    flex-direction: column;
    padding: 0;
  }
  #trouble .case .case_inner .detail_box .detail {
    width: 100%;
    margin-bottom: 8vw;
  }
  #trouble .case .case_inner .detail_box .detail .picture {
    margin-bottom: 4vw;
  }
  #trouble .case .case_inner .detail_box .detail h5 {
    font-size: 4.2vw;
    text-align: center;
  }
  #trouble .case .case_inner .detail_box .detail p {
    font-size: 3.8vw;
  }

  /*----------------------------------------------------------------
  repair
  ----------------------------------------------------------------*/
  #repair .intro .intro_inner {
    max-width: 90%;
  }
  #repair .intro .intro_inner .head {
    margin-bottom: 8vw;
  }
  #repair .intro .intro_inner .head .image {
    max-width: 25vw;
  }
  #repair .intro .intro_inner .head h4 {
    font-size: 5.4vw;
  }
  #repair .intro .intro_inner .head h4 span {
    font-size: 5.4vw;
  }
  #repair .intro .intro_inner .comment {
    margin-bottom: 8vw;
  }
  #repair .intro .intro_inner .comment p {
    font-size: 3.8vw;
  }
  #repair .intro .intro_inner .button_box .button_common:nth-child(1), #repair .intro .intro_inner .button_box .button_common:nth-child(2), #repair .intro .intro_inner .button_box .button_common:nth-child(3) {
    width: 100%;
    margin-bottom: 6vw;
  }
  #repair .intro .intro_inner .button_box .button_common:nth-child(4), #repair .intro .intro_inner .button_box .button_common:nth-child(5), #repair .intro .intro_inner .button_box .button_common:nth-child(6), #repair .intro .intro_inner .button_box .button_common:nth-child(7) {
    width: 46%;
    font-size: 4vw;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  #repair .intro .intro_inner .button_box .button_common:nth-child(4), #repair .intro .intro_inner .button_box .button_common:nth-child(5) {
    margin-bottom: 6vw;
  }
  #repair .case .divider {
    padding-top: 18vw;
  }
  #repair .case .divider:before {
    bottom: 10px;
  }
  #repair .case .case_inner {
    max-width: 90%;
    margin-bottom: 16vw;
  }
  #repair .case .case_inner:last-child {
    margin-bottom: 8vw;
  }
  #repair .case .case_inner h4 {
    font-size: 5.4vw;
    text-align: center;
  }
  #repair .case .case_inner p {
    font-size: 4.2vw;
    text-align: center;
  }
  #repair .case .case_inner .overview_box {
    flex-direction: column-reverse;
  }
  #repair .case .case_inner .overview_box .text {
    max-width: 100%;
  }
  #repair .case .case_inner .overview_box .text h5 {
    font-size: 4.2vw;
  }
  #repair .case .case_inner .overview_box .text p {
    font-size: 3.8vw;
    text-align: left;
  }
  #repair .case .case_inner .overview_box .picture {
    margin-left: 0;
    margin-bottom: 6vw;
  }
  #repair .case .case_inner .detail_box {
    flex-direction: column;
  }
  #repair .case .case_inner .detail_box .detail {
    width: 100%;
    margin-bottom: 10vw;
  }
  #repair .case .case_inner .detail_box .detail:last-child {
    margin-bottom: 0;
  }
  #repair .case .case_inner .detail_box .detail .picture {
    margin-bottom: 6vw;
  }
  #repair .case .case_inner .detail_box .detail h5 {
    font-size: 4.2vw;
    text-align: left;
  }
  #repair .case .case_inner .detail_box .detail p {
    font-size: 3.8vw;
    text-align: left;
  }
  #repair .case .case_inner .button_box {
    width: fit-content;
    margin-top: 8vw;
    margin-left: auto;
    margin-right: auto;
  }
  #repair .others_repair .others_repair_inner {
    max-width: 90%;
  }
  #repair .others_repair .others_repair_inner h4 {
    font-size: 5.4vw;
    text-align: center;
  }
  #repair .others_repair .others_repair_inner .overview_box {
    flex-direction: column-reverse;
  }
  #repair .others_repair .others_repair_inner .overview_box .text {
    max-width: 100%;
  }
  #repair .others_repair .others_repair_inner .overview_box .text h5 {
    font-size: 4.2vw;
  }
  #repair .others_repair .others_repair_inner .overview_box .text p {
    font-size: 3.8vw;
  }
  #repair .others_repair .others_repair_inner .overview_box .picture {
    margin-left: 0;
    margin-bottom: 4vw;
  }
  #repair .others_repair .others_repair_inner .button_box {
    width: fit-content;
    margin-left: auto;
    margin-right: auto;
  }

  /*----------------------------------------------------------------
  solution
  ----------------------------------------------------------------*/
  #solution .intro .intro_inner {
    max-width: 90%;
  }
  #solution .intro .intro_inner .head {
    margin-bottom: 8vw;
  }
  #solution .intro .intro_inner .head .image {
    max-width: 25vw;
  }
  #solution .intro .intro_inner .head h4 {
    font-size: 4.4vw;
  }
  #solution .intro .intro_inner .head h4 span {
    font-size: 4.4vw;
  }
  #solution .client .client_inner h4 {
    font-size: 4.4vw;
    text-align: center;
  }
  #solution .client .client_inner h4 span {
    font-size: 3.8vw;
    text-align: center;
  }
  #solution .client .client_inner .overview_box {
    max-width: 90%;
  }
  #solution .client .client_inner .overview_box h5 {
    font-size: 4.4vw;
  }
  #solution .client .client_inner .overview_box .overview h6 {
    font-size: 4.2vw;
    margin-bottom: 2vw;
  }
  #solution .client .client_inner .overview_box .overview h6 .icon {
    max-width: 8vw;
    margin-right: 5px;
  }
  #solution .client .client_inner .overview_box .overview p {
    font-size: 3.8vw;
  }
  #solution .client .client_inner .flow_box {
    max-width: 90%;
    margin-left: auto;
    margin-right: auto;
  }
  #solution .client .client_inner .flow_box h5 {
    font-size: 4.4vw;
    margin-bottom: 8vw;
  }
  #solution .client .client_inner .flow_box .flow {
    flex-direction: column;
  }
  #solution .client .client_inner .flow_box .flow .text h6 {
    font-size: 4.4vw;
  }
  #solution .client .client_inner .flow_box .flow .text p {
    font-size: 3.8vw;
    margin-bottom: 4vw;
  }
  #solution .client .client_inner .flow_box .flow .picture {
    margin-left: 0;
  }
  #solution .client .client_inner .voice_box {
    max-width: 88%;
  }
  #solution .client .client_inner .voice_box p {
    font-size: 3.8vw;
    padding: 20px 27% 20px 6%;
  }
  #solution .client .client_inner .voice_box p span {
    font-size: 3.8vw;
  }
  #solution .client .client_inner .voice_box .image {
    max-width: 30%;
    top: auto;
    right: -3%;
    bottom: 0;
  }

  /*----------------------------------------------------------------
  plan
  ----------------------------------------------------------------*/
  #plan .intro .intro_inner {
    max-width: 90%;
  }
  #plan .intro .intro_inner .head {
    margin-bottom: 8vw;
  }
  #plan .intro .intro_inner .head .image {
    max-width: 25vw;
  }
  #plan .intro .intro_inner .head h4 {
    font-size: 4.4vw;
  }
  #plan .intro .intro_inner .head h4 span {
    font-size: 4.4vw;
  }
  #plan .intro .intro_inner .button_box .button_common {
    width: 100%;
    margin-bottom: 6vw;
  }
  #plan .planning .divider {
    padding-top: 18vw;
  }
  #plan .planning .divider:before {
    bottom: 10px;
  }
  #plan .planning .planning_inner {
    max-width: 90%;
  }
  #plan .planning .planning_inner h4 {
    text-align: center;
    margin-bottom: 10vw;
  }
  #plan .planning .planning_inner .price_box {
    max-width: 100%;
  }
  #plan .planning .planning_inner .price_box .example {
    font-size: 3.8vw;
    padding: 3px 36px;
  }
  #plan .planning .planning_inner .price_box .price {
    max-height: 75px;
  }
  #plan .planning .planning_inner .overview {
    max-width: 95%;
    font-size: 3.8vw;
    margin-bottom: 8vw;
  }
  #plan .planning .planning_inner .detail_box {
    flex-direction: column;
  }
  #plan .planning .planning_inner .detail_box .detail {
    width: 100%;
    margin-bottom: 8vw;
  }
  #plan .planning .planning_inner .detail_box .detail img {
    margin-bottom: 4vw;
  }
  #plan .planning .planning_inner .detail_box .detail h5 {
    font-size: 4.2vw;
    text-align: center;
  }
  #plan .planning .planning_inner .detail_box .detail p {
    font-size: 3.8vw;
  }
  #plan .planning .planning_inner .attention_box .icon {
    max-width: 10vw;
    top: -4vw;
    left: -2.5vw;
  }
  #plan .planning .planning_inner .attention_box p {
    width: 95%;
    font-size: 3.8vw;
    margin-left: auto;
    margin-right: auto;
    padding: 8% 5%;
  }

  /*----------------------------------------------------------------
  items
  ----------------------------------------------------------------*/
  #items .intro {
    padding-bottom: 0;
  }
  #items .intro .intro_inner {
    max-width: 90%;
  }
  #items .intro .intro_inner .head {
    margin-bottom: 8vw;
  }
  #items .intro .intro_inner .head .image {
    max-width: 28vw;
  }
  #items .intro .intro_inner .head h4 {
    font-size: 4.4vw;
  }
  #items .intro .intro_inner .head h4 span {
    font-size: 4.4vw;
  }
  #items .sanshu {
    padding-bottom: 16vw;
  }
  #items .sanshu .sanshu_inner {
    max-width: 90%;
    padding: 0;
  }
  #items .sanshu .sanshu_inner .detail_box .detail {
    flex-direction: column-reverse;
  }
  #items .sanshu .sanshu_inner .detail_box .detail .text {
    max-width: 100%;
  }
  #items .sanshu .sanshu_inner .detail_box .detail .text .category {
    font-size: 3.8vw;
    margin-bottom: 2vw;
    padding: 2px 24px;
  }
  #items .sanshu .sanshu_inner .detail_box .detail .text h5 {
    font-size: 5.4vw;
  }
  #items .sanshu .sanshu_inner .detail_box .detail .text .comment {
    font-size: 3.8vw;
  }
  #items .sanshu .sanshu_inner .detail_box .detail .image {
    max-width: 100%;
    margin-bottom: 4vw;
  }
  #items .sanshu .sanshu_inner .lineup_head {
    font-size: 4.4vw;
  }
  #items .sanshu .sanshu_inner .lineup_box .lineup {
    max-width: 48%;
  }
  #items .sanshu .sanshu_inner .lineup_box .lineup:nth-child(1), #items .sanshu .sanshu_inner .lineup_box .lineup:nth-child(2) {
    margin-bottom: 10vw;
  }
  #items .sanshu .sanshu_inner .lineup_box .lineup .picture {
    margin-bottom: 4vw;
  }
  #items .sanshu .sanshu_inner .lineup_box .lineup h6 {
    font-size: 4.2vw;
    margin-bottom: 4vw;
    padding-bottom: 2vw;
  }
  #items .sanshu .sanshu_inner .lineup_box .lineup p {
    min-height: 50vw;
    font-size: 3.8vw;
  }
  #items .sanshu .sanshu_inner .lineup_box .lineup .button_box .button_common {
    max-height: 12vw;
    height: 100vw;
    font-size: 3.8vw;
  }
  #items .colorbest_metal {
    padding-bottom: 16vw;
  }
  #items .colorbest_metal .colorbest_metal_inner {
    max-width: 90%;
    padding: 0;
  }
  #items .colorbest_metal .colorbest_metal_inner .detail_box {
    margin-bottom: 0;
  }
  #items .colorbest_metal .colorbest_metal_inner .detail_box .detail {
    flex-direction: column-reverse;
  }
  #items .colorbest_metal .colorbest_metal_inner .detail_box .detail .text {
    max-width: 100%;
  }
  #items .colorbest_metal .colorbest_metal_inner .detail_box .detail .text .category {
    font-size: 3.8vw;
    margin-bottom: 2vw;
    padding: 2px 24px;
  }
  #items .colorbest_metal .colorbest_metal_inner .detail_box .detail .text h5 {
    font-size: 5.4vw;
  }
  #items .colorbest_metal .colorbest_metal_inner .detail_box .detail .text .comment {
    font-size: 3.8vw;
  }
  #items .colorbest_metal .colorbest_metal_inner .detail_box .detail .text .button_box .button_common {
    width: fit-content;
    max-height: 12vw;
    height: 100vw;
    font-size: 3.8vw;
    margin-top: 4vw;
    margin-left: auto;
    margin-right: auto;
    padding: 0 16vw;
  }
  #items .colorbest_metal .colorbest_metal_inner .detail_box .detail .image {
    max-width: 100%;
    margin-left: 0;
    margin-bottom: 4vw;
  }
  #items .rooga .rooga_inner {
    max-width: 90%;
    padding: 0;
  }
  #items .rooga .rooga_inner .detail_box .detail {
    flex-direction: column-reverse;
  }
  #items .rooga .rooga_inner .detail_box .detail .text {
    max-width: 100%;
  }
  #items .rooga .rooga_inner .detail_box .detail .text .category {
    font-size: 3.8vw;
    margin-bottom: 2vw;
    padding: 2px 24px;
  }
  #items .rooga .rooga_inner .detail_box .detail .text h5 {
    font-size: 5.4vw;
  }
  #items .rooga .rooga_inner .detail_box .detail .text .comment {
    font-size: 3.8vw;
  }
  #items .rooga .rooga_inner .detail_box .detail .image {
    max-width: 100%;
    margin-left: 0;
    margin-bottom: 4vw;
  }
  #items .rooga .rooga_inner .point_box {
    flex-direction: column;
  }
  #items .rooga .rooga_inner .point_box .point {
    width: 100%;
  }
  #items .rooga .rooga_inner .point_box .point img {
    margin-bottom: 4vw;
  }
  #items .rooga .rooga_inner .point_box .point h6 {
    font-size: 4.4vw;
    text-align: center;
  }
  #items .rooga .rooga_inner .point_box .point p {
    font-size: 3.8vw;
  }
  #items .rooga .rooga_inner .button_box .button_common {
    width: fit-content;
    max-height: 12vw;
    height: 100vw;
    font-size: 3.8vw;
    margin-top: 4vw;
    margin-left: auto;
    margin-right: auto;
    padding: 0 16vw;
  }
  #items .solar .solar_inner {
    max-width: 90%;
    padding: 0;
  }
  #items .solar .solar_inner .detail_box .detail {
    flex-direction: column-reverse;
  }
  #items .solar .solar_inner .detail_box .detail .text {
    max-width: 100%;
  }
  #items .solar .solar_inner .detail_box .detail .text .category {
    font-size: 3.8vw;
    margin-bottom: 2vw;
    padding: 2px 24px;
  }
  #items .solar .solar_inner .detail_box .detail .text h5 {
    font-size: 5.4vw;
  }
  #items .solar .solar_inner .detail_box .detail .text .comment {
    font-size: 3.8vw;
  }
  #items .solar .solar_inner .detail_box .detail .image {
    max-width: 100%;
    margin-left: 0;
    margin-bottom: 4vw;
  }

  /*----------------------------------------------------------------
  works
  ----------------------------------------------------------------*/
  #works .intro {
    padding-bottom: 0;
  }
  #works .intro .intro_inner {
    max-width: 90%;
  }
  #works .intro .intro_inner .head {
    margin-bottom: 8vw;
  }
  #works .intro .intro_inner .head .image {
    max-width: 28vw;
  }
  #works .intro .intro_inner .head h4 {
    font-size: 4.4vw;
  }
  #works .intro .intro_inner .head h4 span {
    font-size: 4.4vw;
  }
  #works .gallery .gallery_inner {
    max-width: 90%;
    gap: 4%;
    padding: 0;
  }
  #works .gallery .gallery_inner h4 {
    font-size: 5.4vw;
  }
  #works .gallery .gallery_inner .detail {
    width: 48%;
  }
  #works .gallery .gallery_inner .detail h5 {
    font-size: 4.2vw;
    text-align: center;
  }
  #works .gallery .gallery_inner .detail .comment {
    font-size: 3.8vw;
    text-align: center;
    line-height: 1.2;
    padding: 1vw 0;
  }

  /*----------------------------------------------------------------
  company
  ----------------------------------------------------------------*/
  #company .profile {
    padding-bottom: 20vw;
  }
  #company .profile h4 {
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #company .profile h4 .icon {
    max-width: 12vw;
  }
  #company .profile .profile_inner {
    max-width: 90%;
  }
  #company .profile .profile_inner dt {
    width: 30%;
    font-size: 3.8vw;
    line-height: 1.6;
  }
  #company .profile .profile_inner dd {
    width: 70%;
    font-size: 3.8vw;
    line-height: 1.6;
    padding-left: 1em;
  }
  #company .profile .profile_inner dd a {
    font-size: 3.8vw;
    line-height: 1.6;
  }
  #company .profile .profile_inner dd a:hover {
    opacity: 1;
    color: #002d5e;
  }
  #company .qualification {
    padding-bottom: 20vw;
  }
  #company .qualification .qualification_inner h4 {
    text-align: center;
  }
  #company .qualification .qualification_inner ul {
    max-width: 90%;
    max-height: 100%;
    height: 100%;
  }
  #company .qualification .qualification_inner ul li {
    width: 100%;
    max-height: 40px;
    font-size: 3.8vw;
    line-height: 1.6;
    padding: 0 0.5em;
  }
  #company .access .access_inner {
    width: 90%;
  }
  #company .access .access_inner h4 {
    text-align: center;
  }
  #company .access .access_inner p {
    font-size: 3.8vw;
    text-align: center;
  }
  #company .access .access_inner .button_box {
    width: fit-content;
    margin-left: auto;
    margin-right: auto;
  }

  /*----------------------------------------------------------------
  news
  ----------------------------------------------------------------*/
  #news .intro {
    padding-bottom: 12vw;
  }
  #news .intro h4 {
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #news .intro h4 .icon {
    max-width: 12vw;
  }
  #news .blog .blog_inner {
    display: block;
    max-width: 90%;
    padding: 0;
  }
  #news .blog .blog_inner .blog_inner_left {
    max-width: 100%;
  }
  #news .blog .blog_inner .blog_inner_left .blog_inner_upper .blog_article_list {
    margin-bottom: 5vw;
    padding-bottom: 2.5vw;
  }
  #news .blog .blog_inner .blog_inner_left .blog_inner_upper .blog_article_list .category a, #news .blog .blog_inner .blog_inner_left .blog_inner_upper .blog_article_list .category span {
    width: 100px;
    font-size: 3.2vw;
  }
  #news .blog .blog_inner .blog_inner_left .blog_inner_upper .blog_article_list .date {
    font-size: 3.8vw;
  }
  #news .blog .blog_inner .blog_inner_left .blog_inner_upper .blog_article_list .title {
    font-size: 4.2vw;
  }
  #news .blog .blog_inner .blog_inner_left .blog_inner_upper .blog_article_box {
    border-right: none;
    padding-right: 0;
  }
  #news .blog .blog_inner .blog_inner_left .blog_inner_upper .blog_article_box .category span {
    width: 100px;
    font-size: 3.2vw;
  }
  #news .blog .blog_inner .blog_inner_left .blog_inner_upper .blog_article_box .date {
    font-size: 3.8vw;
  }
  #news .blog .blog_inner .blog_inner_left .blog_inner_upper .blog_article_box .title {
    font-size: 4.2vw;
    margin-bottom: 4vw;
    padding: 3vw 2vw;
  }
  #news .blog .blog_inner .blog_inner_left .blog_inner_lower .wp-pagenavi {
    padding-top: 6vw;
    padding-bottom: 12vw;
  }
  #news .blog .blog_inner .blog_inner_left .blog_inner_lower .wp-pagenavi a, #news .blog .blog_inner .blog_inner_left .blog_inner_lower .wp-pagenavi span,
  #news .blog .blog_inner .blog_inner_left .blog_inner_lower .page-numbers, #news .blog .blog_inner .blog_inner_left .blog_inner_lower .wp-pagenavi .current, #news .blog .blog_inner .blog_inner_left .blog_inner_lower .wp-pagenavi .page, #news .blog .blog_inner .blog_inner_left .blog_inner_lower .previouspostslink, #news .blog .blog_inner .blog_inner_left .blog_inner_lower .nextpostslink, #news .blog .blog_inner .blog_inner_left .blog_inner_lower #pagenavi a.last, #news .blog .blog_inner .blog_inner_left .blog_inner_lower #pagenavi a.first {
    font-size: 4.2vw;
    padding: 8px 6px;
  }
  #news .blog .blog_inner .blog_inner_left .blog_inner_lower .button_box_single {
    display: block;
    text-align: center;
  }
  #news .blog .blog_inner .blog_inner_left .blog_inner_lower .button_box_single .button_area_arrow {
    margin-left: auto;
    margin-right: auto;
  }
  #news .blog .blog_inner .blog_inner_left .blog_inner_lower .button_box_single .button_area_arrow p {
    font-size: 3.8vw;
  }
  #news .blog .blog_inner .blog_inner_left .blog_inner_lower .button_box_single .button_area_arrow.prev {
    margin-bottom: 4vw;
  }
  #news .blog .blog_inner .blog_inner_left .blog_inner_lower .button_box_single .button_area_arrow.prev .material-icons-outlined {
    margin-right: 1vw;
  }
  #news .blog .blog_inner .blog_inner_left .blog_inner_lower .button_box_single .button_area_arrow.next {
    margin-top: 4vw;
  }
  #news .blog .blog_inner .blog_inner_left .blog_inner_lower .button_box_single .button_area_arrow.next .material-icons-outlined {
    margin-left: 1vw;
  }
  #news .blog .blog_inner .blog_inner_left .blog_inner_lower .button_box_single .link_archive {
    display: block;
    width: 64%;
    font-size: 4.2vw;
    margin-left: auto;
    margin-right: auto;
    padding: 6px 0;
  }
  #news .blog .blog_inner .blog_inner_left .blog_inner_lower .button_box_single .link_archive:hover {
    opacity: 1;
    background: #004DA1;
    color: #fff;
    transition: 0.3s ease;
  }
  #news .blog .blog_inner .blog_inner_right {
    max-width: 85%;
    margin-left: auto;
    margin-right: auto;
    padding-left: 0;
  }
  #news .blog .blog_inner .blog_inner_right .wp-block-heading {
    font-size: 3.8vw;
    padding: 1.5vw 0;
  }
  #news .blog .blog_inner .blog_inner_right .wp-block-categories li,
  #news .blog .blog_inner .blog_inner_right .wp-block-archives li {
    margin-bottom: 1vw;
  }
  #news .blog .blog_inner .blog_inner_right .wp-block-categories li:last-child,
  #news .blog .blog_inner .blog_inner_right .wp-block-archives li:last-child {
    margin-bottom: 12vw;
  }
  #news .blog .blog_inner .blog_inner_right .wp-block-categories li a,
  #news .blog .blog_inner .blog_inner_right .wp-block-archives li a {
    font-size: 3.8vw;
  }
  #news .blog .blog_inner .blog_inner_right .side_archive_menu .monthly-archive-title {
    font-size: 3.8vw;
    padding: 0.75vw 0;
  }
  #news .blog .blog_inner .blog_inner_right .side_archive_menu .toggle_btn {
    font-size: 3.8vw;
  }
  #news .blog .blog_inner .blog_inner_right .side_archive_menu .child li a {
    font-size: 3.8vw;
  }

  /*----------------------------------------------------------------
  contact
  ----------------------------------------------------------------*/
  #contact .intro {
    max-width: 90%;
    width: 90%;
    margin-left: auto;
    margin-right: auto;
  }
  #contact .intro h4 {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 5.4vw;
    margin-bottom: 4vw;
  }
  #contact .intro h4 .icon {
    max-width: 12vw;
  }
  #contact .intro p {
    font-size: 3.6vw;
    text-align: center;
  }
  #contact .phone .phone_inner h4 {
    font-size: 5.4vw;
    text-align: center;
  }
  #contact .phone .phone_inner .detail_box {
    max-width: 90%;
    max-height: 48vw;
  }
  #contact .phone .phone_inner .detail_box .comment {
    font-size: 4.2vw;
    text-align: center;
    line-height: 1.4;
    margin-bottom: 3vw;
  }
  #contact .phone .phone_inner .detail_box .number {
    width: 80%;
    margin-bottom: 2vw;
  }
  #contact .phone .phone_inner .detail_box .attention {
    font-size: 4.2vw;
  }
  #contact .form .form_inner {
    max-width: 90%;
  }
  #contact .form .form_inner h4 {
    font-size: 5.4vw;
    text-align: center;
  }
  #contact .form .form_inner p {
    font-size: 3.6vw;
    text-align: center;
  }
  #contact .form .form_inner form {
    flex-direction: column;
  }
  #contact .form .form_inner form .subject {
    width: 100%;
    font-size: 4.2vw;
    text-align: left;
    margin-bottom: 2vw;
  }
  #contact .form .form_inner form .form_input_text {
    width: 100%;
    margin-bottom: 4vw;
  }
  #contact .form .form_inner form .required {
    font-size: 3.4vw;
    margin-left: 2vw;
  }
  #contact .form .form_inner form .form_agree_checkbox {
    font-size: 4.2vw;
    margin-top: 0;
    margin-bottom: 4vw;
    margin-left: auto;
    margin-right: auto;
  }
  #contact .form .form_inner form .button_box {
    width: 80%;
    margin-left: auto;
    margin-right: auto;
  }
  #contact .form .form_inner form .button_box .button_common {
    width: 100%;
    text-align: center;
  }
  #contact .form .form_inner form .button_box .material-icons-outlined {
    font-size: 10vw;
  }
  #contact .form .form_inner form .form_agree_checkbox input[type=checkbox] {
    margin-right: 5vw;
  }
  #contact .form .form_inner .privacy_policy h5 {
    text-align: center;
  }
  #contact .form .form_inner .privacy_policy .detail_box {
    max-height: 60vw;
    padding: 6%;
  }
  #contact .form .form_inner .privacy_policy .detail_box p {
    text-align: left;
  }
}