@charset "UTF-8";
/* CSS Document */

/*------------------------------------------------------------
デフォルトスタイル
------------------------------------------------------------*/

html, body, div, p, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center, br, 
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td
footer, header, hgroup, menu, nav, section, time, mark, audio, video{
padding:0; margin: 0;
border:0; outline:0;
font-size:16px; 
}


a{ color:#0064BE; text-decoration:underline; }
a:hover{ color:#319DFF; }

img,abbr,acronym,fieldset { border: 0; }

.clear{ clear:both; }

.clearfix:after{
height:0px;
visibility:hidden;
display:block;
clear:both;
content:".";
}

html { height: 100%; scroll-behavior: smooth; }
body { overflow-x: hidden; }
body {
  background: #fff;
  color: #000;
  font-family: "Noto Sans JP", sans-serif;
  line-height: 160%; margin: 0;
  margin: 0;
  padding: 0;
  padding-top: 80px; /* ヘッダー固定の余白 */
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}


a:hover img { opacity: 0.70; }

* { box-sizing: border-box; }

/* 画像レスポンシブ */
.resp { 
max-width: 100%;
height: auto;
}


/*------------------------------------------------------------
共通 ヘッダー
------------------------------------------------------------*/

header {
  width: 100%; height: 80px;
  background: #fff;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
}

.head_inner { width: 95%; margin: 0px auto; padding: 10px 0 10px 0; 
              display: flex; align-items: center; gap: 10px;}

.logo {
  width: clamp(210px, 18vw, 255px);
  height: auto;
  margin: 5px 0 0 0;
}

/*------------------------------------------------------------
共通 navi
------------------------------------------------------------*/

.header_nav {
  display: block !important;
  flex: 1;
}

.header_nav > ul {
  display: flex;
  align-items: center;
  justify-content: left;
  gap: clamp(18px, 3vw, 40px);
  margin: 30px 0 0 10px;
  padding: 0;
  list-style: none;
  flex-wrap: nowrap;
}

.header_nav > ul > li {
  margin: 0;
  padding: 0;
  position: relative;
}

/* メインメニュー */
.header_nav > ul > li > a,
.header_nav > ul > li > .nav_parent {
  display: inline-block;
  color: #333;
  text-decoration: none;
  font-size: 15px;
  font-weight: 500;
  white-space: nowrap;
  transition: transform 0.2s ease, color 0.2s ease;
  cursor: pointer;
}

/* メインメニュー hover：グレー */
.header_nav > ul > li > a:hover,
.header_nav > ul > li > .nav_parent:hover {
  color: #999;
}

/* ドロップダウン親 */
.has_dropdown {
  position: relative;
}

/* 親メニューとドロップダウンの間の透明な橋 */
.has_dropdown::after {
  content: "";
  position: absolute;
  left: 0;
  top: 100%;
  width: 100%;
  height: 10px;
}

/* PCドロップダウン */
.dropdown_menu {
  position: absolute;
  top: calc(100% + 10px);
  left: 50%;
  transform: translateX(-50%) translateY(8px);

  min-width: 190px;
  background: #fff;
  border: 1px solid #ddd;
  box-shadow: 0 6px 14px rgba(0,0,0,0.15);
  border-radius: 6px;

  opacity: 0;
  visibility: hidden;
  pointer-events: none;

  transition: 0.25s ease;
  z-index: 99999;

  display: block;
  margin: 0;
  padding: 8px 0;
  list-style: none;
}

/* マウスオーバーで表示 */
.has_dropdown:hover .dropdown_menu {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateX(-50%) translateY(0);
}

/* ドロップダウン内 */
.dropdown_menu li {
  border: none;
}

/* ドロップダウン内リンク */
.dropdown_menu a {
  display: block;
  padding: 5px 16px;
  color: #333;
  font-size: 14px;
  font-weight: 400;
  text-decoration: none;
  white-space: nowrap;
  transform: none;
  transition: color 0.2s ease, background 0.2s ease;
}

/* ドロップダウン内 hover：赤 */
.dropdown_menu a:hover {
  background: #f5f5f5;
  color: #e94709;
  transform: none;
}


/* PCヘッダー予約 */
.yoyaku {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 110px;
  height: 53px;
  color: #222;
  text-decoration: none;
  font-weight: 500;
  background: linear-gradient(to bottom, #ffffff 0%, #f3f3f3 55%, #e9e9e9 100%);
  border: 1px solid #bfbfbf;
  border-radius: 8px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 2px rgba(0, 0, 0, 0.18);
  transition: 0.2s ease;
}

.yoyaku_icon {
  color: #002b6f;
  font-size: 24px;
  line-height: 1;
  margin: 0px 0 0 10px;
}

.yoyaku_text {
  display: block;
  font-size: 13px;
}

.yoyaku:hover {
  opacity: 0.85;
  transform: translateY(1px);
  color: #D83E3B ;
}
/* PCヘッダーtel */
.tel {
  display: inline-block;
  width: 180px;
  color: #e94709;
  text-align: center;
  font-weight: 600;
}

.tel_label {
  display: block;
  background: #e94709;
  color: #fff;
  font-size: 13px;
  line-height: 1;
  letter-spacing: 1px;
  padding: 5px 0px 6px;
  border-radius: 4px;
}

.tel_number {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin-top: 4px;
  font-size: 20px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: 0.02em;
}

.tel_number i {
  font-size: 20px;
  transform: rotate(-12deg);
}

/* タブレット以下の設定 ****************************/


/* ハンバーガーボタン：PCでは非表示 */
.menu_btn {
  display: none;
}

@media screen and (max-width: 1024px) {

  body {
    padding-top: 64px;
  }

header {
  width: 100%;
  height: 64px;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
  background: #fff;
}

.head_inner {
  position: relative;
  width: 94%;
  height: 64px;
  margin: 0 auto;
  padding: 0;
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  justify-content: space-between;
  gap: 0;
}

.logo {
  width: 200px;
  height: auto;
  margin: 0;
}

/* ハンバーガーボタン */
.menu_btn {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  width: 42px;
  height: 42px;
  padding: 8px;
  border: none;
  background: #fff;
}

.menu_btn,
.menu_btn:hover,
.menu_btn:focus,
.menu_btn:active {
  transform: none !important;
  box-shadow: none !important;
  outline: none !important;
}

.navbar-toggler-icon {
  position: relative;
  display: block;
  width: 24px;
  height: 2px;
  background: #333;
  background-image: none;
  transition: background 0.2s ease;
}

.navbar-toggler-icon::before,
.navbar-toggler-icon::after {
  content: "";
  position: absolute;
  left: 0;
  width: 24px;
  height: 2px;
  background: #333;
  transition: transform 0.25s ease, top 0.25s ease;
}

.navbar-toggler-icon::before {
  top: -7px;
}

.navbar-toggler-icon::after {
  top: 7px;
}

/* 開いた時：中央線を消す */
.menu_btn[aria-expanded="true"] .navbar-toggler-icon {
  background: transparent;
}

/* 開いた時：上線を斜めに */
.menu_btn[aria-expanded="true"] .navbar-toggler-icon::before {
  top: 0;
  transform: rotate(45deg);
}

/* 開いた時：下線を斜めに */
.menu_btn[aria-expanded="true"] .navbar-toggler-icon::after {
  top: 0;
  transform: rotate(-45deg);
}

/* スマホメニュー本体 */
.header_nav {
  display: block !important;
  position: absolute;
  top: 64px;
  right: -3%;
  width: 80%;
  margin-top: 0;
  background: #FB8C84;
  z-index: 9998;

  max-height: 0;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;

  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(-10px);

  transition:
    opacity 0.25s ease,
    transform 0.25s ease,
    max-height 0.3s ease,
    visibility 0.25s ease;
}

.header_nav.show {
  display: block !important;
  max-height: calc(100vh - 64px);
  overflow-y: auto;

  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0);
}

.header_nav > ul {
  display: block;
  margin: 0;
  padding: 0;
  list-style: none;
}

/* 上層 li */
.header_nav > ul > li {
  border-bottom: 1px solid #ddd;
  background: #FB8C84;
}

/* Home・アクセスなど通常リンク */
.header_nav > ul > li > a {
  display: block;
  width: 100%;
  box-sizing: border-box;
  padding: 5px 10px;
  font-size: 13px !important;
  color: #333 !important;
  text-decoration: none;
  background: #FB8C84 !important;
}

/* 加圧トレーニング・当ジムについて・FAQ */
.header_nav > ul > li.has_dropdown > .nav_parent {
  position: relative;
  display: block;
  width: 100%;
  box-sizing: border-box;
  padding: 5px 45px 5px 10px;
  font-size: 13px !important;
  color: #333 !important;
  text-decoration: none;
  background: #FB8C84 !important;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

/* hover / focus / activeで色を変えない */
.header_nav > ul > li > a:hover,
.header_nav > ul > li > a:focus,
.header_nav > ul > li > a:active,
.header_nav > ul > li.has_dropdown > .nav_parent:hover,
.header_nav > ul > li.has_dropdown > .nav_parent:focus,
.header_nav > ul > li.has_dropdown > .nav_parent:active {
  color: #333 !important;
  background: #FB8C84 !important;
  outline: none !important;
  box-shadow: none !important;
}

/* 親メニュー右端の − / ＋ */
.header_nav > ul > li.has_dropdown > .nav_parent::after {
  content: "−";
  position: absolute;
  right: 16px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 22px;
  font-weight: bold;
  line-height: 1;
}

/* 閉じている時は ＋ */
.header_nav > ul > li.has_dropdown.is_closed > .nav_parent::after {
  content: "＋";
}

/* 下層メニュー */
.header_nav > ul > li.has_dropdown > .dropdown_menu {
  position: static !important;
  display: block !important;
  transform: none !important;
  min-width: auto;
  margin: 0;
  padding: 0;
  list-style: none;
  background: #f7f7f7 !important;
  box-shadow: none;
  border: none;
  border-radius: 0;

  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

/* 閉じている時は下層を非表示 */
.header_nav > ul > li.has_dropdown.is_closed > .dropdown_menu {
  display: none !important;
}

/* 下層 li */
.header_nav > ul > li.has_dropdown > .dropdown_menu > li {
  background: #f7f7f7 !important;
}

/* 下層リンク */
.header_nav > ul > li.has_dropdown > .dropdown_menu > li > a {
  display: block;
  width: 100%;
  box-sizing: border-box;
  padding: 5px 10px 5px 28px;
  font-size: 14px !important;
  color: #333 !important;
  text-decoration: none;
  background: #f7f7f7 !important;
}

/* 下層リンク hover / focus / active */
.header_nav > ul > li.has_dropdown > .dropdown_menu > li > a:hover,
.header_nav > ul > li.has_dropdown > .dropdown_menu > li > a:focus,
.header_nav > ul > li.has_dropdown > .dropdown_menu > li > a:active {
  color: #333 !important;
  background: #f7f7f7 !important;
  outline: none !important;
  box-shadow: none !important;
}

/* スマホ時はhover展開を無効 */
.header_nav .has_dropdown:hover .dropdown_menu {
  transform: none !important;
}

.yoyaku,
.tel {
  display: none;
}



  .yoyaku,
  .tel {
    display: none;
  }
}


/*------------------------------------------------------------
スマホ下部固定
------------------------------------------------------------*/

/* PCでは非表示 */
.sp_fixed_cta {
  display: none;
}


@media screen and (max-width: 1024px) {

  body {
    padding-bottom: 46px; /* 下部固定ボタン分 */
  }

  .sp_fixed_cta {
    display: flex;
    position: fixed;
    left: 0;
    bottom: 0;
    z-index: 9998;
    width: 100%;
    height: 46px;
    background: #e94709;
    border-top: 1px solid #fff;
  }

  .sp_fixed_btn {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 46px;
    color: #fff;
    text-decoration: none;
    background: #e94709;
    font-weight: 600;
    line-height: 1;
  }

  .sp_fixed_yoyaku {
    width: 50%;
    gap: 8px;
    font-size: 16px;
    border-right: 1px solid rgba(255,255,255,0.7);
  }

  .sp_fixed_yoyaku i {
    font-size: 22px;
  }

  .sp_fixed_tel {
  width: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
}

.sp_tel_label {
  display: block;
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
}

.sp_tel_number_wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  line-height: 1;
}

.sp_tel_number_wrap i {
  font-size: 16px;
  transform: rotate(-12deg);
}

.sp_tel_number {
  font-size: 18px;
  font-weight: 700;
  letter-spacing: 0.02em;
}
}

.sp_fixed_btn:hover,
.sp_fixed_btn:hover i,
.sp_fixed_btn:hover span {
  color: #FFD1F5 ;
}





/*------------------------------------------------------------
ページトップに戻る
------------------------------------------------------------*/

.page_top_btn {
  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: 9995;

  width: 58px;
  height: 58px;
  border-radius: 50%;

  background: #f15a24;
  border: none;

  display: flex;
  align-items: center;
  justify-content: center;

  text-decoration: none;
  opacity: 0;
  visibility: hidden;
  transform: translateY(12px);

  transition:
    opacity 0.3s ease,
    visibility 0.3s ease,
    transform 0.3s ease,
    background 0.2s ease;
}

.page_top_btn.is_show {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.page_top_btn:hover {
  background: #e84610;
}

/* 白抜きの ^ */
.page_top_btn span {
  width: 16px;
  height: 16px;
  border-top: 4px solid #fff;
  border-left: 4px solid #fff;
  transform: rotate(45deg);
  margin-top: 8px;
}

@media screen and (max-width: 1024px) {

  .page_top_btn {
    right: 10px;
    bottom: 60px;
    width: 52px;
    height: 52px;
  }

  .page_top_btn span {
    width: 14px;
    height: 14px;
    border-top-width: 4px;
    border-left-width: 4px;
  }

}


/*------------------------------------------------------------
FOOT
------------------------------------------------------------*/

footer { width:100%; background: #e0e0e0; }

.foot_inner { width:90%; margin: 0 auto; padding: 20px 0 20px 0; text-align: center; }

.footlogo { max-width: 62px; height: auto; }

.foot_inner a { color: #000; text-decoration: underline; font-size: 0.85em; }
.foot_inner a:hover { color: #888; }

.footerlink { }
.footerlink ul { width: 100%; display: flex; justify-content: center; flex-wrap: wrap; list-style: none; padding: 0; }
.footerlink ul li { padding: 0 20px;}


.kaatsu_note {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 15px;
  margin: 30px auto;
}

.kaatsu_logo { flex: 0 0 auto; }

.kaatsu_logo img {
  width: 70px;
  height: auto;
  display: block;
}

.kaatsu_text {
  flex: 0 1 auto;
  text-align: left;
}

.kaatsu_text ul {
  margin: 0;
  padding-left: 1.3em;
  list-style: disc;
}

.kaatsu_text li { margin: 0 0px; font-size: 0.75em; line-height: 1.5em; }


@media only screen and (max-width: 768px) {

#foot_wrap { width:100%; background: #154e73; }
.foot_inner { width: 95%; margin: 0 auto; padding: 20px 0px 10px 5px; }

  .kaatsu_note {
    flex-direction: column;
    align-items: center;
    gap: 10px;
    margin: 20px auto;
  }

  .kaatsu_logo { text-align: center; }

  .kaatsu_logo img { width: 60px; margin: 0 auto; }

  .kaatsu_text { text-align: left; }

}

.copyright { font-size: 0.7em; color: #8299a8; text-align: center; padding: 20px 0 30px 0; }


/*------------------------------------------------------------
改行
------------------------------------------------------------*/

/*スマホで改行*/
.br_sp { display: none; }

/*タブレットで改行*/
.br_tb { display: none; }

/*PCで改行*/
.br_pc { display: block; }

@media screen and (max-width:1024px) {
.br_sp { display: block; }
.br_tb { display: block; }
.br_pc { display: none; }
}

@media screen and (max-width:768px) {
.br_sp { display: block; }
.br_tb { display: block; }
.br_pc { display: none; }
}

/*------------------------------------------------------------
flex
------------------------------------------------------------*/

.flx    { display: flex; }
.flx_a_c { display: flex; align-items:  center; }
.flx_j_c { display: flex; justify-content: center;}

/*------------------------------------------------------------
HR
------------------------------------------------------------*/

.hr_01 { width:100%; border-bottom:dotted #555 1px; border-top:0; border-left:0; border-right:0; margin:20px 0 20px 0; }
.hr_02 { width:100%; border-bottom:solid #FFC0B8 10px; border-top:0; border-left:0; border-right:0; margin:20px 0 20px 0; }


/*------------------------------------------------------------
テキスト
------------------------------------------------------------*/

.note_list p {
  margin-bottom: 0.4em;
  padding-left: 1em;
  text-indent: -1em;
}

.alignC { text-align: center; }
.alignR { text-align: right; }
.alignL { text-align: left; }

.fl_left { float: left; }
.fl_right { float: right; }


/*文字サイズ*/

.fs_12 { font-size:12px; }
.fs_13 { font-size:13px; }
.fs_14 { font-size:14px; }
.fs_15 { font-size:15px; }
.fs_16 { font-size:16px; }
.fs_17 { font-size:17px; }
.fs_18 { font-size:18px; }
.fs_19 { font-size:19px; }
.fs_20 { font-size:20px; }
.fs_21 { font-size:21px; }
.fs_22 { font-size:22px; }
.fs_23 { font-size:23px; }
.fs_24 { font-size:24px; }

.fs_em07  { font-size:0.7em; }
.fs_em08  { font-size:0.8em; }
.fs_em085 { font-size:0.85em; }
.fs_em09  { font-size:0.9em; }
.fs_em095 { font-size:0.95em; }
.fs_em1  { font-size:1.0em; }
.fs_em11  { font-size:1.1em; }
.fs_em12  { font-size:1.2em; }
.fs_em13  { font-size:1.3em; }
.fs_em14  { font-size:1.4em; }
.fs_em15 { font-size:1.5em; }
.fs_em16 { font-size:1.6em; }
.fs_em18 { font-size:1.8em; }
.fs_em2 { font-size:2em; }
.fs_em25 { font-size:2.5em; }

/*文字カラー*/

.fc_red { color:#FF0004 !important; }
.fc_enji { color:#bc0909 !important; }
.fc_sian { color:#27909c !important; }
.fc_green { color:#309700 !important; }
.fc_orange { color: #e65900 !important; }
.fc_yellow { color:#fff600 !important; }
.fc_yellow_dark { color: #A47800 !important; }
.fc_blue_dark { color: #00559d !important; }
.fc_white { color: #fff !important; }
.fc_darkred { color: #C3141B !important; }


/*文字weight*/

.fw_b { font-weight: bold; }
.fw_n { font-weight: normal; }

/*背景カラー*/

.bc_gray { background:#eee; }
.bc_gray1 { background:rgba(211, 211, 211, 0.8); }
.bc_sian { background:#27909c; }
.bc_sian2 { background:#55cbd6; }
.bc_darkblue { background:#4d89ad; }
.bc_lightgreen { background:#EBFBE9; }
.bc_orange { background: #f06c46; }
.bs_darkpink { background: #c8547c; }
.bs_yellow { background: #FFFDE1; }
.bs_pink { background: #FFEEEE; }
.bs_pink_touka { background: rgba(255, 238, 238, 0.9); }


/* line height */

.lh_160 { line-height: 160%; }
.lh_180 { line-height: 180%; }
.lh_200 { line-height: 200%; }
.lh_250 { line-height: 250%; }
.lh_300 { line-height: 300%; }


/*------------------------------------------------------------
マージン
------------------------------------------------------------*/
.m0    {margin:0px; padding:0px; }
.mt_02 { margin-top: 2px ; }
.mt_03 { margin-top: 3px ; }
.mt_04 { margin-top: 4px ; }
.mt_05 { margin-top: 5px ; }
.mt_10 { margin-top: 10px ; }
.mt_20 { margin-top: 20px ; }
.mt_30 { margin-top: 30px ; }
.mt_40 { margin-top: 40px ; }
.mt_50 { margin-top: 50px ; }

.mb_03 { margin-bottom: 3px ; }
.mb_05 { margin-bottom: 5px ; }
.mb_10 { margin-bottom: 10px ; }
.mb_15 { margin-bottom: 15px ; }
.mb_20 { margin-bottom: 20px ; }
.mb_30 { margin-bottom: 30px ; }
.mb_40 { margin-bottom: 40px ; }
.mb_50 { margin-bottom: 50px ; }

.ml_05  { margin-left: 5px; }
.ml_10 { margin-left: 10px; }
.ml_20 { margin-left: 20px; }
.ml_30 { margin-left: 30px; }
.ml_40 { margin-left: 40px; }
.ml_50 { margin-left: 50px; }
.ml_60 { margin-left: 60px; }

.mr_05 { margin-right: 5px ; }
.mr_10 { margin-right: 10px ; }
.mr_20 { margin-right: 20px ; }
.mr_30 { margin-right: 30px ; }
.mr_40 { margin-right: 40px ; }

.mx_10 { margin: 0 10px ; }
.mx_20 { margin: 0 20px ; }
.mx_30 { margin: 0 30px ; }
.mx_40 { margin: 0 40px ; }

.my_10 { margin: 10px 0 ; }
.my_20 { margin: 20px 0 ; }
.my_30 { margin: 30px 0 ; }
.my_40 { margin: 40px 0 ; }

.pl_10 { padding-left: 10px; }
.pl_20 { padding-left: 20px; }
.pl_30 { padding-left: 30px; }
.pl_40 { padding-left: 40px; }
.pl_50 { padding-left: 50px; }

.pr_10 { padding-right: 10px; }
.pr_20 { padding-right: 20px; }
.pr_30 { padding-right: 30px; }
.pr_40 { padding-right: 40px; }
.pr_50 { padding-right: 50px; }
.pr_100 { padding-right: 100px; }

.px_10 { padding: 0 10px ; }
.px_20 { padding: 0 20px ; }
.px_30 { padding: 0 30px ; }
.px_40 { padding: 0 40px ; }

.py_10 { padding: 10px 0 ; }
.py_20 { padding: 20px 0 ; }
.py_30 { padding: 30px 0 ; }
.py_40 { padding: 40px 0 ; }

.pt_02 { padding-top: 2px ; }
.pt_03 { padding-top: 3px ; }
.pt_04 { padding-top: 4px ; }
.pt_05 { padding-top: 5px ; }
.pt_10 { padding-top: 10px ; }
.pt_20 { padding-top: 20px ; }
.pt_30 { padding-top: 30px ; }
.pt_40 { padding-top: 40px ; }
.pt_50 { padding-top: 50px ; }


.pb_03 { padding-bottom: 3px ; }
.pb_05 { padding-bottom: 5px ; }
.pb_10 { padding-bottom: 10px ; }
.pb_15 { padding-bottom: 15px ; }
.pb_20 { padding-bottom: 20px ; }
.pb_30 { padding-bottom: 30px ; }
.pb_40 { padding-bottom: 40px ; }
.pb_50 { padding-bottom: 50px ; }


/*------------------------------------------------------------
横幅
------------------------------------------------------------*/
.w_25  { width: 25%; }
.w_30  { width: 30%; }
.w_40  { width: 40%; }
.w_60  { width: 60%; }
.w_70  { width: 70%; }
.w_75  { width: 75%; }
.w_80  { width: 80%; }
.w_85  { width: 85%; }
.w_90  { width: 90%; }
.w_95  { width: 95%; }
.w_100 { width: 100%; }

.w_70_100  { width: 70% }
.w_75_100  { width: 75% }
.w_80_100  { width: 80% }
.w_85_100  { width: 85% }
.w_90_100  { width: 90% }
.w_95_100  { width: 95% }

.w_70_95  { width: 70% }
.w_75_95  { width: 75% }
.w_80_95  { width: 80% }
.w_85_95  { width: 85% }
.w_90_95  { width: 90% }

.w_70_90  { width: 70% }
.w_75_90  { width: 75% }
.w_80_90  { width: 80% }
.w_85_90  { width: 85% }
.w_90_90  { width: 90% }
.w_95_90  { width: 95% }

.w_70_85_90  { width: 70% }
.w_75_85_90  { width: 75% }
.w_80_85_90  { width: 80% }
.w_85_85_90  { width: 85% }
.w_90_85_90  { width: 90% }
.w_95_85_90  { width: 95% }

.w_70_90_90  { width: 70% }
.w_75_90_90  { width: 75% }
.w_80_90_90  { width: 80% }
.w_85_90_90  { width: 85% }
.w_90_90_90  { width: 90% }
.w_95_90_90  { width: 95% }

.w_70_95_85  { width: 70% }
.w_75_95_85  { width: 75% }
.w_80_95_85  { width: 80% }
.w_85_95_85  { width: 85% }
.w_90_95_85  { width: 90% }
.w_95_95_85  { width: 95% }

.w_70_95_90  { width: 70% }
.w_75_95_90  { width: 75% }
.w_80_95_90  { width: 80% }
.w_85_95_90  { width: 85% }
.w_90_95_90  { width: 90% }
.w_95_95_90  { width: 95% }


.w_70_90_100  { width: 70% }
.w_75_90_100  { width: 75% }
.w_80_90_100  { width: 80% }
.w_85_90_100  { width: 85% }
.w_90_90_100  { width: 90% }
.w_95_90_100  { width: 95% }

.w_70_100_100 { width: 70%; }

.w_60_90_90  { width: 60% }



@media (min-width: 768px) and (max-width: 1024px) {
.w_70_85_90  { width: 85% }
.w_75_85_90  { width: 85% }
.w_80_85_90  { width: 85% }
.w_85_85_90  { width: 85% }
.w_90_85_90  { width: 85% }
.w_95_85_90  { width: 85% }

.w_70_90_90  { width: 90% }
.w_75_90_90  { width: 90% }
.w_80_90_90  { width: 90% }
.w_85_90_90  { width: 90% }
.w_90_90_90  { width: 90% }
.w_95_90_90  { width: 90% }

.w_70_95_85  { width: 95% }
.w_75_95_85  { width: 95% }
.w_80_95_85  { width: 95% }
.w_85_95_85  { width: 95% }
.w_90_95_85  { width: 95% }
.w_95_95_85  { width: 95% }

.w_70_95_90  { width: 95% }
.w_75_95_90  { width: 95% }
.w_80_95_90  { width: 95% }
.w_85_95_90  { width: 95% }
.w_90_95_90  { width: 95% }
.w_95_95_90  { width: 95% }

.w_70_90_100  { width: 90% }
.w_75_90_100  { width: 90% }
.w_80_90_100  { width: 90% }
.w_85_90_100  { width: 90% }
.w_90_90_100  { width: 90% }
.w_95_90_100  { width: 90% }

.w_80_100_100 { width: 100%; }
.w_70_100_100 { width: 100%; }

.w_60_90_90  { width: 90% }

}



@media (max-width: 767.98px) {
.w_70_100  { width: 100%; }
.w_75_100  { width: 100%; }
.w_80_100  { width: 100%; }
.w_85_100  { width: 100%; }
.w_90_100  { width: 100%; }
.w_95_100  { width: 100%; }

.w_70_95  { width: 95%; }
.w_75_95  { width: 95%; }
.w_80_95  { width: 95%; }
.w_85_95  { width: 95%; }
.w_90_95  { width: 95%; }

.w_70_90  { width: 90%; }
.w_75_90  { width: 90%; }
.w_80_90  { width: 90%; }
.w_85_90  { width: 90%; }
.w_95_90  { width: 90%; }


.w_70_85_90  { width: 90% }
.w_75_85_90  { width: 90% }
.w_80_85_90  { width: 90% }
.w_85_85_90  { width: 90% }
.w_90_85_90  { width: 90% }
.w_95_85_90  { width: 90% }

.w_70_90_90  { width: 90% }
.w_75_90_90  { width: 90% }
.w_80_90_90  { width: 90% }
.w_85_90_90  { width: 90% }
.w_90_90_90  { width: 90% }
.w_95_90_90  { width: 90% }

.w_70_95_85  { width: 85% }
.w_75_95_85  { width: 85% }
.w_80_95_85  { width: 85% }
.w_85_95_85  { width: 85% }
.w_90_95_85  { width: 85% }
.w_95_95_85  { width: 85% }

.w_70_95_90  { width: 90% }
.w_75_95_90  { width: 90% }
.w_80_95_90  { width: 90% }
.w_85_95_90  { width: 90% }
.w_90_95_90  { width: 90% }
.w_95_95_90  { width: 90% }

.w_70_90_100  { width: 100% }
.w_75_90_100  { width: 100% }
.w_80_90_100  { width: 100% }
.w_85_90_100  { width: 100% }
.w_90_90_100  { width: 100% }
.w_95_90_100  { width: 100% }

.w_80_100_100 { width: 100%; }
.w_70_100_100 { width: 100%; }

.w_60_90_90  { width: 90% }

}