/*
 * 【はじめに】
 * 最終的には可能な限り、コメントは削除してください。
 * 変数の使い方
 * $ec_dir ･･･ それぞれ各ECの絶対パス(現状)
 * $ec_id ･･･ それぞれ各ECのID(CSVで設定している分)
 */
@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:ital,wght@0,700;1,500;1,700&family=Noto+Sans+JP:wght@100..900&display=swap');
.sport_sale {
  font-family: "Noto Sans JP", sans-serif;
  font-style: normal;
  background-color: #fff;
  color: #222; }

.sport_sale header, .sport_sale main, .sport_sale section, .sport_sale nav, .sport_sale ol, .sport_sale ul, .sport_sale div {
  display: block;
  float: none; }

.sport_sale img {
  display: block;
  max-width: 100%;
  height: auto; }

.sport_sale h3 {
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(to right, #1e3c72, #2a5298);
  color: #fff;
  font-family: "Barlow Condensed", sans-serif;
  font-style: italic;
  font-weight: 700;
  font-size: 10.7vw;
  line-height: 1.2;
  padding: 0.3em 0;
  margin: 0;
  position: relative; }

.sport_sale h3::before {
  content: '';
  position: absolute;
  left: 5%;
  top: 50%;
  transform: translateY(-50%);
  width: 10vw;
  height: 10vw; }

.sport_sale h3 small {
  display: block;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 0.5em;
  font-weight: 700;
  margin-left: 0.6em; }

@media screen and (min-width: 768px) {
  .sport_sale h3 {
    font-size: 5.6vw; }

  .sport_sale h3::before {
    width: 5.5vw;
    height: 5.5vw; }

  .sport_sale h3 small {
    font-weight: 500;
    margin-top: 0.5em; } }

@media screen and (min-width: 1024px) {
  .sport_sale h3 {
    font-size: 56px; }

  .sport_sale h3::before {
    width: 55px;
    height: 55px; } }

.sp {
  display: block; }

@media screen and (min-width: 768px) {
  .sp {
    display: none; } }

.sport_sale nav.nav_btn ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: stretch;
  gap: 2.5%;
  padding: 8vw 3%;
  margin: 0 auto; }

.sport_sale nav.nav_btn ul li {
  width: 32%; }

.sport_sale nav.nav_btn ul li a {
  display: flex;
  align-items: center;
  height: 100%;
  background: linear-gradient(to bottom, #2a5298, #1e3c72);
  border-radius: 3em;
  padding: 0.5em 3% 0.5em 4%;
  box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.7);
  position: relative;
  box-sizing: border-box; }

.sport_sale nav.nav_btn ul li a:hover {
  background: linear-gradient(to bottom, #ce0600, #b8000f); }

.sport_sale header nav.nav_btn ul, .sport_sale nav.nav_btn.bottom_nav ul {
  flex-direction: column;
  gap: 5vw; }

.sport_sale header nav.nav_btn ul li, .sport_sale nav.nav_btn.bottom_nav ul li {
  width: 100%; }

.sport_sale header nav.nav_btn ul li a, .sport_sale nav.nav_btn.bottom_nav ul li a {
  padding: 0.8em 5%; }

.sport_sale nav.nav_btn ul li a .label::before {
  content: '';
  display: block;
  width: 11vw;
  height: 11vw;
  position: absolute;
  left: 14vw;
  top: 50%;
  transform: translateY(-50%); }

.sport_sale nav.nav_btn ul li a.nav_size .label::before {
  background: url("/autoway/dp/lp/sport_sale/img/icon_size.png") center / contain no-repeat; }

.sport_sale nav.nav_btn ul li a.nav_brand .label::before {
  background: url("/autoway/dp/lp/sport_sale/img/icon_brand.png") center / contain no-repeat;
  height: 14vw; }

.sport_sale nav.nav_btn ul li a.nav_flow .label::before {
  background: url("/autoway/dp/lp/sport_sale/img/icon_flow.png") center / contain no-repeat; }

.sport_sale header nav.nav_btn ul li a .label strong, .sport_sale nav.nav_btn.bottom_nav ul li a .label strong {
  font-size: 8vw; }

.sport_sale header nav.nav_btn ul li a .label small, .sport_sale nav.nav_btn.bottom_nav ul li a .label small {
  font-size: 4.8vw; }

.sport_sale nav.nav_btn ul li a .ico {
  width: 7vw;
  margin-right: 3%; }

.sport_sale nav.nav_btn ul li a .label {
  flex: 1;
  color: #fff;
  line-height: 1.15;
  text-align: center; }

.sport_sale nav.nav_btn ul li a .label strong {
  display: block;
  font-family: "Barlow Condensed", sans-serif;
  font-style: italic;
  font-size: 4.3vw;
  font-weight: bold; }

.sport_sale nav.nav_btn ul li a .label small {
  display: block;
  font-family: "Noto Sans JP", sans-serif;
  font-style: normal;
  font-size: 2.3vw;
  font-weight: bold; }

.sport_sale nav.nav_btn ul li a::after {
  content: '';
  position: absolute;
  right: 18vw;
  top: 50%;
  width: 5vw;
  height: 5vw;
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: translateY(-70%) rotate(45deg); }

.sport_sale #flow nav.nav_btn ul.fixed {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  z-index: 50;
  background-color: rgba(255, 255, 255, 0.92);
  padding: 3vw 0;
  box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.2);
  box-sizing: border-box;
  gap: 1%; }

.sport_sale nav.nav_btn ul.fixed li a .label {
  padding-left: 1em; }

.sport_sale nav.nav_btn ul.fixed li a .label::before {
  left: 3vw;
  width: 5vw;
  height: 6vw; }

.sport_sale nav.nav_btn ul.fixed li a::after {
  content: none; }

.sport_sale #flow nav.nav_btn ul.relative {
  position: relative; }

@media screen and (min-width: 768px) {
  .sport_sale nav.nav_btn ul {
    padding: 5vw 0; }

  .sport_sale nav.nav_btn ul li a {
    padding: 0.6em 5%;
    transition: 0.3s; }

  .sport_sale nav.nav_btn ul li a:hover {
    box-shadow: none;
    transform: translate(2px, 2px); }

  .sport_sale nav.nav_btn ul li a .label strong {
    font-size: 3vw; }

  .sport_sale nav.nav_btn ul li a .label small {
    font-size: 1.8vw;
    font-weight: 500; }

  .sport_sale header nav.nav_btn ul, .sport_sale nav.nav_btn.bottom_nav ul {
    flex-direction: row;
    width: 90%;
    justify-content: space-between;
    max-width: 1024px;
    gap: 0; }

  .sport_sale header nav.nav_btn ul li, .sport_sale nav.nav_btn.bottom_nav ul li {
    width: 30%;
    max-width: 290px; }

  .sport_sale header nav.nav_btn ul li a, .sport_sale nav.nav_btn.bottom_nav ul li a {
    padding: 0.6em 5%;
    border-radius: 0.5em; }

  .sport_sale nav.nav_btn ul li a::after {
    right: 2vw;
    width: 2vw;
    height: 2vw; }

  .sport_sale nav.nav_btn ul li a .label::before {
    width: 5vw;
    height: 5vw;
    left: 1.5vw; }

  .sport_sale nav.nav_btn ul li a.nav_brand .label::before {
    height: 6vw;
    left: 1vw; }

  .sport_sale nav.nav_btn ul.fixed li a .label::before {
    left: 2vw; }

  .sport_sale header nav.nav_btn ul li a .label strong, .sport_sale nav.nav_btn.bottom_nav ul li a .label strong {
    font-size: 3vw; }

  .sport_sale header nav.nav_btn ul li a .label small, .sport_sale nav.nav_btn.bottom_nav ul li a .label small {
    font-size: 1.8vw;
    font-weight: 500; } }

@media screen and (min-width: 1024px) {
  .sport_sale nav.nav_btn ul {
    padding: 50px 0; }

  .sport_sale #flow nav.nav_btn ul.fixed {
    padding: 30px 0; }

  .sport_sale nav.nav_btn ul li {
    width: 320px; }

  .sport_sale nav.nav_btn ul li a .label strong {
    font-size: 30px; }

  .sport_sale nav.nav_btn ul li a .label small {
    font-size: 18px; }

  .sport_sale header nav.nav_btn ul li a, .sport_sale nav.nav_btn.bottom_nav ul li a {
    padding: 1em 5%;
    border-radius: 1em; }

  .sport_sale header nav.nav_btn ul li a .label strong, .sport_sale nav.nav_btn.bottom_nav ul li a .label strong {
    font-size: 30px; }

  .sport_sale header nav.nav_btn ul li a .label small, .sport_sale nav.nav_btn.bottom_nav ul li a .label small {
    font-size: 18px; }

  .sport_sale nav.nav_btn ul li a .label::before, .sport_sale nav.nav_btn ul.fixed li a .label::before {
    width: 54px;
    height: 54px;
    left: 15px; }

  .sport_sale nav.nav_btn ul li a.nav_brand .label::before {
    height: 66px;
    left: 10px; }

  .sport_sale nav.nav_btn ul.fixed li a .label::before {
    height: 60px;
    left: 20px; }

  .sport_sale nav.nav_btn ul li a::after {
    right: 20px;
    width: 20px;
    height: 20px; } }

.sport_sale header {
  display: block;
  position: relative;
  width: 100%;
  height: auto;
  min-height: 0;
  max-height: none;
  overflow: visible;
  padding: 0;
  margin: 0;
  border: none; }

.sport_sale header .fv {
  display: block;
  position: relative;
  width: 100%;
  background: url("/autoway/dp/lp/sport_sale/img/bg_fv_sp.jpg") center / cover no-repeat;
  border: 5px solid #00336b;
  border-top: none;
  box-sizing: border-box;
  padding: 2vw 5vw;
  box-shadow: 0 3px 3px rgba(2, 2, 2, 0.42); }

.sport_sale header .fv picture {
  display: block;
  width: 100%; }

.sport_sale header .fv .fv_bg {
  width: 100%; }

.sport_sale header .fv .fv_txt {
  width: 100%;
  height: 100%; }

.sport_sale header nav.nav_btn {
  display: block;
  width: 100%; }

.sport_sale .catch {
  padding: 8vw 0 6vw;
  background-color: #fff; }

.sport_sale .catch .catch_inner {
  position: relative;
  width: 92%;
  max-width: 960px;
  margin: 0 auto;
  padding: 4vw 0;
  background: url("/autoway/dp/lp/sport_sale/img/bg_catch_sp.png") top center / contain no-repeat; }

.sport_sale .catch .catch_txt {
  text-align: center; }

.sport_sale .catch .catch_txt h3 {
  display: block;
  background: none;
  color: #ce0600;
  font-size: 8vw;
  font-family: "Noto Sans JP", sans-serif;
  font-style: normal;
  font-weight: 900;
  padding: 0;
  margin: 0;
  line-height: 1.3;
  letter-spacing: 0; }

.sport_sale .catch .catch_txt h3 span {
  font-weight: 700; }

.sport_sale .catch .catch_txt h3 span span {
  font-size: 0.8em;
  text-shadow: 1px 1px 0 #fff, -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff, 0px 1px 0 #fff, 1px 0px 0 #fff, 0px -1px 0 #fff, -1px 0px 0 #fff; }

.sport_sale .catch .catch_txt h3 > span::after {
  content: '';
  display: block;
  width: 53%;
  height: 4vw;
  margin: 0.1em auto 0;
  background: url("/autoway/dp/lp/sport_sale/img/bg_catch_line_sp.png") center / contain no-repeat; }

.sport_sale .catch .catch_txt p {
  font-size: 5.4vw;
  font-weight: 700;
  color: #1f3e76;
  margin-top: 0.6em;
  line-height: 1.5; }

@media screen and (min-width: 768px) {
  .sport_sale header .fv {
    background: url("/autoway/dp/lp/sport_sale/img/bg_fv_pc.jpg") center / cover no-repeat;
    padding: 3vw 2vw;
    max-width: 1366px;
    margin: 0 auto;
    box-shadow: 0 2px 8px rgba(2, 2, 2, 0.5); }

  .sport_sale header .fv .fv_txt {
    max-width: 1269px;
    margin: 0 auto; }

  .sport_sale .catch {
    padding: 5vw 0; }

  .sport_sale .catch .catch_inner {
    width: 100%;
    max-width: 1024px;
    padding: 4vw 0;
    background: url("/autoway/dp/lp/sport_sale/img/bg_catch_pc.png") top left 6vw / contain no-repeat; }

  .sport_sale .catch .catch_txt {
    transform: translateX(-2vw); }

  .sport_sale .catch .catch_txt h3 {
    font-size: 4.5vw; }

  .sport_sale .catch .catch_txt h3 br {
    display: none; }

  .sport_sale .catch .catch_txt h3 > span::after {
    width: 60%;
    height: 3vw;
    margin: 0.1em auto 0;
    background: url("/autoway/dp/lp/sport_sale/img/bg_catch_line_pc.png") center / contain no-repeat; }

  .sport_sale .catch .catch_txt p {
    font-size: 3vw;
    margin-top: 0.4em; } }

@media screen and (min-width: 1024px) {
  .sport_sale header .fv {
    padding: 30px 20px; }

  .sport_sale .catch {
    padding: 50px 0; }

  .sport_sale .catch .catch_inner {
    padding: 48px 0;
    background: url("/autoway/dp/lp/sport_sale/img/bg_catch_pc.png") top left 60px / contain no-repeat; }

  .sport_sale .catch .catch_txt {
    transform: translateX(-20px); }

  .sport_sale .catch .catch_txt h3 {
    font-size: 45px; }

  .sport_sale .catch .catch_txt h3 > span::after {
    height: 30px; }

  .sport_sale .catch .catch_txt p {
    font-size: 27px; } }

.sport_sale .search_size {
  width: 95%;
  max-width: 1160px;
  margin: 8vw auto 0;
  background-color: #eaedf3;
  border-radius: 1.2em;
  overflow: hidden;
  box-sizing: border-box;
  box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.5); }

.sport_sale .search_size h3 {
  border-radius: 0;
  justify-content: flex-start;
  padding-left: 20%;
  letter-spacing: 0.1em; }

.sport_sale .search_size h3::before {
  background: url("/autoway/dp/lp/sport_sale/img/icon_size.png") center / contain no-repeat; }

.sport_sale .search_size h3 small {
  letter-spacing: 0; }

.sport_sale .search_size .sw_ti_wh ul {
  display: flex; }

.sport_sale .search_size .sw_ti_wh ul li {
  flex: 1;
  text-align: center;
  font-weight: bold;
  font-size: 4vw;
  color: #1e3c72;
  background-color: #fff;
  padding: 0.8em 0;
  border-bottom: 3px solid #1e3c72; }

.sport_sale .search_size .sw_ti_wh ul li.active {
  background-color: #dff0ff;
  border-bottom-color: #ce0600;
  color: #ce0600; }

.sport_sale .search_size > div {
  display: none; }

.sport_sale .search_size > div.active {
  display: block; }

.sport_sale .search_size > div nav.inch ul, .sport_sale .search_size > div nav.pcd_h ul {
  display: flex;
  flex-wrap: wrap;
  margin: 5vw auto;
  width: 95%;
  justify-content: flex-start;
  gap: 2.4vw; }

.sport_sale .search_size > div nav.inch ul li, .sport_sale .search_size > div nav.pcd_h ul li {
  width: 23%;
  font-size: 4.25vw;
  font-weight: 700;
  padding: 0.6em 0;
  text-align: center;
  box-sizing: border-box;
  border-radius: 0.3em;
  background-color: #fff;
  box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.5);
  color: #333; }

.sport_sale .search_size > div nav.inch ul li span, .sport_sale .search_size > div nav.pcd_h ul li span {
  font-size: 0.81em;
  font-weight: 500; }

.sport_sale .search_size > div nav.inch ul li.active, .sport_sale .search_size > div nav.pcd_h ul li.active {
  color: #fff;
  background-color: #ce0600; }

.sport_sale .search_size > div table {
  width: 92%;
  margin: 0 auto 6vw;
  display: none;
  font-size: 4vw;
  border-collapse: collapse;
  border: 1px solid rgba(30, 60, 114, 0.5); }

.sport_sale .search_size > div table th, .sport_sale .search_size > div table td {
  border: 1px solid rgba(30, 60, 114, 0.5); }

.sport_sale .search_size > div table.active {
  display: table; }

.sport_sale .search_size > div table thead th {
  background-color: #bed7ff;
  color: #1e3c72;
  font-weight: bold;
  text-align: center;
  padding: 0.8em 0; }

.sport_sale .search_size > div table .oblateness {
  min-width: 4.5em; }

.sport_sale .search_size > div table .size, .sport_sale .search_size > div table .inset {
  width: 9999px; }

.sport_sale .search_size > div table tbody tr:nth-of-type(odd) {
  background-color: #fff; }

.sport_sale .search_size > div table tbody tr:nth-of-type(even) {
  background-color: #eaf2ff; }

.sport_sale .search_size > div table tbody th {
  padding: 0.8em 0;
  color: #333; }

.sport_sale .search_size > div table tbody th.oblateness {
  font-family: "Barlow Condensed", sans-serif, "Noto Sans JP", sans-serif;
  font-style: normal;
  color: #b8000f;
  vertical-align: top;
  padding-top: 1.5em; }

.sport_sale .search_size > div table tbody td {
  padding: 0.8em 0.4em; }

.sport_sale .search_size > div table tbody td a {
  display: inline-block;
  color: #3e3e3e;
  font-weight: 500;
  text-decoration: none;
  padding: 0.3em 0.6em;
  line-height: 1.2;
  white-space: nowrap;
  border-radius: 0.3em;
  box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.5);
  transition: 0.2s;
  margin: 0.3em 0.3em 0.3em; }

.sport_sale .search_size > div table tbody tr:nth-of-type(odd) td a {
  background-color: #eaf2ff; }

.sport_sale .search_size > div table tbody tr:nth-of-type(even) td a {
  background-color: #fff; }

.sport_sale .search_size > div table tbody tr:nth-of-type(odd) td a:hover, .sport_sale .search_size > div table tbody tr:nth-of-type(even) td a:hover {
  background-color: #ce0600;
  color: #fff; }

.sport_sale .search_size > div nav.pcd_h {
  display: none; }

.sport_sale .search_size > div nav.pcd_h.active {
  display: block; }

@media screen and (min-width: 768px) {
  .sport_sale .search_size {
    margin: 60px auto 0; }

  .sport_sale .search_size h3 {
    padding-left: 15%; }

  .sport_sale .search_size .sw_ti_wh ul li {
    font-size: 18px; }

  .sport_sale .search_size > div nav.inch ul, .sport_sale .search_size > div nav.pcd_h ul {
    width: 92%;
    gap: 2.7vw; }

  .sport_sale .search_size > div nav.inch ul li, .sport_sale .search_size > div nav.pcd_h ul li {
    width: 14%;
    font-size: 2.6vw;
    cursor: pointer;
    transition: 0.3s; }

  .sport_sale .search_size > div nav.inch ul li:hover, .sport_sale .search_size > div nav.pcd_h ul li:hover {
    color: #fff;
    background-color: #ce0600; }

  .sport_sale .search_size > div nav.inch ul li span, .sport_sale .search_size > div nav.pcd_h ul li span {
    font-size: 0.61em; }

  .sport_sale .search_size > div table {
    font-size: 16px; }

  .sport_sale .search_size > div table tbody th.oblateness {
    font-size: 26px;
    padding: 0.6em 0; }

  .sport_sale .search_size > div table tbody td a {
    padding: 0.3em 1em;
    border-radius: 0.5em; } }

@media screen and (min-width: 1024px) {
  .sport_sale .search_size {
    margin: 80px auto 0; }

  .sport_sale .search_size > div table {
    margin: 0 auto 60px; }

  .sport_sale .search_size > div nav.inch ul, .sport_sale .search_size > div nav.pcd_h ul {
    gap: 30px;
    margin: 50px auto; }

  .sport_sale .search_size > div nav.inch ul li, .sport_sale .search_size > div nav.pcd_h ul li {
    width: 11.4%;
    font-size: 26px; } }

@media screen and (min-width: 1220px) {
  .sport_sale .search_size > div nav.inch ul, .sport_sale .search_size > div nav.pcd_h ul {
    gap: 25px; }

  .sport_sale .search_size > div nav.inch ul li, .sport_sale .search_size > div nav.pcd_h ul li {
    width: 10.4%; } }

.sport_sale .brand_area {
  width: 95%;
  max-width: 1160px;
  margin: 8vw auto;
  background-color: #eaedf3;
  border-radius: 1.2em;
  overflow: hidden;
  box-sizing: border-box;
  box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.5);
  padding-bottom: 6vw; }

.sport_sale .brand_area h3 {
  border-radius: 0;
  justify-content: flex-start;
  padding-left: 15%;
  margin-bottom: 5vw; }

.sport_sale .brand_area h3::before {
  background: url("/autoway/dp/lp/sport_sale/img/icon_brand.png") center / contain no-repeat;
  left: 3%;
  height: 12vw; }

.sport_sale .brand_area > nav > ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  padding: 0 2.5%;
  gap: 3%;
  margin-bottom: 5vw; }

.sport_sale .brand_area > nav > ul > li {
  width: 48%;
  position: relative;
  margin-bottom: 3vw; }

.sport_sale .brand_area > nav > ul > li div {
  border: 2px solid #fff;
  border-radius: 0.6em;
  background: #fff;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 2vw;
  cursor: pointer;
  height: 100%;
  box-sizing: border-box;
  transition: 0.3s;
  box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.5); }

.sport_sale .brand_area > nav > ul > li div span {
  display: none; }

.sport_sale .brand_area > nav > ul > li div span.ruby {
  display: block;
  font-size: 3.4vw;
  font-weight: bold;
  color: #1e3c72; }

.sport_sale .brand_area > nav > ul > li.active div {
  border-color: #ce0600;
  border-width: 3px; }

.sport_sale .brand_area > nav > ul > li.active::before {
  content: '';
  position: absolute;
  width: 0;
  height: 0;
  left: 0;
  top: 0;
  border: 5vw solid transparent;
  border-top: 5vw solid #ce0600;
  border-left: 5vw solid #ce0600;
  border-radius: 0.6em; }

.sport_sale .brand_area > nav > ul > li.active::after {
  content: '';
  position: absolute;
  top: 2vw;
  left: -2vw;
  width: 9vw;
  height: 9vw;
  background: url("/autoway/dp/lp/sport_sale/img/yazirusi2.png") no-repeat 0% / contain;
  animation: fuwafuwa 1.5s infinite ease-in-out; }

.sport_sale .brand_area > nav > ul > li.active span.ruby {
  color: #b8000f; }

@keyframes fuwafuwa {
  0% {
    transform: translate(0, 0) rotate(45deg); }

  50% {
    transform: translate(6px, -6px) rotate(45deg); }

  100% {
    transform: translate(0, 0) rotate(45deg); } }

@media screen and (min-width: 768px) {
  .sport_sale .brand_area h3::before {
    left: 5%;
    height: 7vw; }

  .sport_sale .brand_area > nav > ul {
    padding: 0 20px;
    justify-content: flex-start; }

  .sport_sale .brand_area > nav > ul > li {
    width: 22.5%;
    margin-bottom: 2.5vw; }

  .sport_sale .brand_area > nav > ul > li div {
    padding: 0 0 1vw; }

  .sport_sale .brand_area > nav > ul > li div span.ruby {
    font-size: 1.5vw; }

  .sport_sale .brand_area > nav > ul > li div:hover {
    border-color: #ce0600; }

  .sport_sale .brand_area > nav > ul > li.active::before {
    border: 15px solid transparent;
    border-top: 15px solid #b8000f;
    border-left: 15px solid #b8000f; }

  .sport_sale .brand_area > nav > ul > li.active::after {
    width: 30px;
    height: 30px;
    top: 18px;
    left: -20px; }

  .sport_sale .brand_area > nav > ul > li div img {
    max-width: 180px;
    width: 100%;
    margin: 0 auto; } }

@media screen and (min-width: 1024px) {
  .sport_sale .brand_area {
    margin: 80px auto;
    padding-bottom: 60px; }

  .sport_sale .brand_area h3 {
    margin-bottom: 50px; }

  .sport_sale .brand_area h3::before {
    height: 70px; }

  .sport_sale .brand_area > nav > ul {
    margin-bottom: 50px; }

  .sport_sale .brand_area > nav > ul > li {
    margin-bottom: 25px; }

  .sport_sale .brand_area > nav > ul > li div {
    padding: 0 0 10px; }

  .sport_sale .brand_area > nav > ul > li div span.ruby {
    font-size: 15px; } }

.sport_sale .brand_group {
  display: none;
  padding: 0 2.5%; }

.sport_sale .brand_group.active {
  display: block; }

.sport_sale .brand_group .brand_ttl {
  display: block;
  text-align: center;
  color: #1e3c72;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: bold;
  font-size: 6.65vw;
  margin-bottom: 4vw; }

.sport_sale .brand_group .brand_ttl .en {
  font-family: "Barlow Condensed", sans-serif;
  font-style: italic;
  color: #ce0600;
  font-size: 1.4em; }

.sport_sale .item_area {
  border: 3px solid #ce0600;
  border-radius: 1em;
  background: #fff;
  padding: 5vw 2.5% 3vw;
  margin-bottom: 5vw;
  box-sizing: border-box;
  position: relative;
  overflow: hidden; }

.sport_sale .item_area::before {
  content: '';
  position: absolute;
  width: 0;
  height: 0;
  left: 0;
  top: 0;
  border: 5vw solid transparent;
  border-top: 5vw solid #ce0600;
  border-left: 5vw solid #ce0600; }

.sport_sale .item_area .img {
  text-align: center;
  margin-bottom: 3vw;
  height: 55vw;
  overflow: hidden; }

.sport_sale .item_area .img .logo {
  width: 35vw;
  max-width: 250px;
  margin: 0; }

.sport_sale .item_area .img .item {
  width: 60vw;
  max-width: 260px;
  margin: 0 auto; }

.sport_sale .item_area .text .detail h4 {
  text-align: center;
  color: #1e3c72;
  font-family: "Barlow Condensed", sans-serif;
  font-style: italic;
  font-size: 10.6vw;
  margin-bottom: 2vw;
  line-height: 1.3;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center; }

.sport_sale .item_area .text .detail h4 span {
  font-size: 0.5em;
  align-self: flex-end;
  margin-bottom: 0.25em; }

.sport_sale .item_area .text .detail h4 small {
  display: inline-block;
  font-family: "Noto Sans JP", sans-serif;
  font-style: normal;
  font-size: 0.3em;
  font-weight: bold;
  color: #555;
  margin-left: 1em; }

.sport_sale .item_area .text .detail p {
  font-size: 4.25vw;
  font-weight: 500;
  line-height: 1.5;
  margin-bottom: 4vw;
  color: #1e3c72; }

.sport_sale .item_area .text .size p {
  text-align: center;
  font-size: 3.2vw;
  color: #1e3c72;
  margin-bottom: 4vw; }

.sport_sale .item_area .text .size ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: 1.7vw;
  padding-bottom: 2vw; }

.sport_sale .item_area .text .size ul li {
  width: auto;
  margin: 0; }

.sport_sale .item_area .text .size ul li a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 12vw;
  height: 12vw;
  border: 1px solid #1e3c72;
  background-color: #eaf2ff;
  border-radius: 0.2em;
  color: #1e3c72;
  font-family: "Barlow Condensed", sans-serif;
  font-weight: 500;
  font-size: 9.34vw;
  font-style: italic;
  transition: 0.3s;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.5); }

.sport_sale .item_area .text .size ul li a span {
  display: none; }

@media screen and (min-width: 768px) {
  .sport_sale .item_area {
    display: flex;
    align-items: flex-start;
    padding: 2.5%;
    max-width: 900px;
    margin: 0 auto 5vw; }

  .sport_sale .item_area::before {
    border: 3vw solid transparent;
    border-top: 3vw solid #ce0600;
    border-left: 3vw solid #ce0600; }

  .sport_sale .item_area .img {
    width: 32%;
    margin-bottom: 0;
    height: auto; }

  .sport_sale .item_area .img .logo {
    width: 100%;
    margin-bottom: 1vw; }

  .sport_sale .item_area .img .item {
    width: auto;
    height: 25vw; }

  .sport_sale .item_area .text {
    width: 68%;
    padding-left: 2.5%;
    box-sizing: border-box; }

  .sport_sale .item_area .text .detail h4 {
    font-size: 6vw;
    justify-content: flex-start; }

  .sport_sale .item_area .text .detail h4 small {
    font-size: 0.26em; }

  .sport_sale .item_area .text .detail p {
    font-size: 1.6vw;
    line-height: 1.8;
    font-weight: 700;
    margin-bottom: 2vw; }

  .sport_sale .item_area .text .size p {
    font-size: 1.6vw;
    text-align: left;
    margin-bottom: 2vw; }

  .sport_sale .item_area .text .size p br {
    display: none; }

  .sport_sale .item_area .text .size ul li a {
    width: 6vw;
    height: 6vw;
    font-size: 4.7vw;
    cursor: pointer; }

  .sport_sale .item_area .text .size ul li a:hover {
    background-color: #ce0600;
    color: #fff;
    border: 1px solid #ce0600; }

  .sport_sale .item_area .text .size::after {
    font-size: 13px;
    text-align: left; }

  .sport_sale .brand_group .brand_ttl {
    font-size: 3vw;
    margin-bottom: 20px; }

  .sport_sale .brand_group .brand_ttl br {
    display: none; }

  .sport_sale .brand_group .brand_ttl .en {
    font-size: 1.6em; } }

@media screen and (min-width: 1024px) {
  .sport_sale .item_area {
    margin: 0 auto 50px; }

  .sport_sale .item_area::before {
    border: 30px solid transparent;
    border-top: 30px solid #ce0600;
    border-left: 30px solid #ce0600; }

  .sport_sale .item_area .img .logo {
    margin-bottom: 10px; }

  .sport_sale .item_area .img .item {
    height: 250px; }

  .sport_sale .item_area .text .detail h4 {
    font-size: 60px;
    margin-bottom: 20px; }

  .sport_sale .item_area .text .detail p {
    font-size: 16px;
    margin-bottom: 20px; }

  .sport_sale .item_area .text .size p {
    font-size: 16px;
    margin-bottom: 20px; }

  .sport_sale .item_area .text .size ul {
    padding-bottom: 20px;
    gap: 16px; }

  .sport_sale .item_area .text .size ul li a {
    width: 60px;
    height: 60px;
    font-size: 47px; }

  .sport_sale .item_area .text .size::after {
    font-size: 13px;
    text-align: left; }

  .sport_sale .brand_group .brand_ttl {
    font-size: 30px; } }

.sport_sale #flow {
  padding-bottom: 10vw; }

.sport_sale #flow .flow_inner {
  width: 95%;
  max-width: 1160px;
  margin: 8vw auto 0;
  background-color: #eaedf3;
  border-radius: 1.2em;
  overflow: hidden;
  box-sizing: border-box;
  box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.5);
  padding-bottom: 6vw; }

.sport_sale #flow .flow_inner h3 {
  border-radius: 0;
  justify-content: flex-start;
  padding-left: 20%; }

.sport_sale #flow .flow_inner h3::before {
  background: url("/autoway/dp/lp/sport_sale/img/icon_flow.png") center / contain no-repeat; }

.sport_sale #flow .flow_inner > p {
  font-weight: 500;
  width: 95%;
  margin: 5vw auto 10vw;
  line-height: 1.8;
  color: #1e3c72;
  font-size: 3.5vw; }

.sport_sale #flow .flow_inner > p .hl {
  color: #ff0300;
  background-color: #fff100;
  padding: 0.1em 0.3em; }

.sport_sale #flow .mark {
  width: 92%;
  margin: 6vw auto 0; }

.sport_sale #flow .mark picture img {
  margin: 0 auto 5vw;
  border: 1px solid #1e3c72;
  box-sizing: border-box; }

.sport_sale #flow .mark .comment {
  width: 80%;
  margin: 0 auto;
  padding: 5vw;
  background-color: #fff;
  border: 3px solid #1e3c72;
  border-radius: 1.5em;
  text-align: center;
  font-weight: bold;
  position: relative; }

.sport_sale #flow .mark .comment::before, .sport_sale #flow .mark .comment::after {
  content: '';
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 3vw solid transparent;
  border-right: 3vw solid transparent; }

.sport_sale #flow .mark .comment::before {
  top: -9vw;
  border-bottom: 9vw solid #1e3c72; }

.sport_sale #flow .mark .comment::after {
  top: -7vw;
  border-bottom: 9vw solid #fff; }

.sport_sale #flow .mark .comment p {
  font-size: 4.25vw;
  color: #1e3c72;
  margin-bottom: 0.5em;
  color: #2a5298; }

.sport_sale #flow .mark .comment p::before, .sport_sale #flow .mark .comment p::after {
  content: '|';
  display: inline-block; }

.sport_sale #flow .mark .comment p::before {
  margin-right: 0.5em;
  transform: rotate(-30deg); }

.sport_sale #flow .mark .comment p::after {
  margin-left: 0.5em;
  transform: rotate(30deg); }

.sport_sale #flow .mark .comment strong {
  display: inline-block;
  color: #ff0300;
  background-color: #fff100;
  padding: 0.5em;
  font-size: 4.25vw;
  font-weight: 700; }

.sport_sale #flow .flow {
  width: 95%;
  margin: 0 auto; }

.sport_sale #flow .flow li {
  width: 100%;
  margin: 0 auto 30vw;
  position: relative; }

.sport_sale #flow .flow li:first-of-type::after {
  content: '';
  position: absolute;
  bottom: -22vw;
  right: 0;
  left: 0;
  margin: 0 auto;
  width: 0;
  height: 0;
  border-left: 10vw solid transparent;
  border-right: 10vw solid transparent;
  border-top: 15vw solid #ce0600; }

.sport_sale #flow .flow li:last-of-type {
  margin-bottom: 6vw; }

.sport_sale #flow .flow li h4 {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 8vw;
  width: 100%;
  margin: 0 auto 5vw;
  position: relative; }

.sport_sale #flow .flow li h4 .num {
  flex-shrink: 0;
  width: 13.35vw;
  height: 13.35vw;
  line-height: 13.35vw;
  border-radius: 50%;
  background-color: #ce0600;
  color: #fff;
  font-size: 9.35vw;
  font-weight: bold;
  text-align: center; }

.sport_sale #flow .flow li h4 .txt {
  color: #1e3c72;
  font-size: 5.35vw;
  font-weight: 700;
  line-height: 1.5;
  text-align: center; }

.sport_sale #flow .flow li > p {
  font-weight: 500;
  font-size: 4.25vw;
  margin-bottom: 5vw;
  color: #1e3c72;
  text-align: left; }

.sport_sale #flow .flow li picture img {
  border: 1px solid #1e3c72;
  margin: 0 auto 5vw; }

.sport_sale #flow .flow li:last-of-type strong {
  display: block;
  text-align: center;
  color: #ce0600;
  font-size: 5.5vw;
  margin-top: 3vw; }

.sport_sale #flow .caution {
  width: 95%;
  margin: 0 auto;
  font-weight: 500;
  font-size: 12px;
  color: #1e3c72; }

.sport_sale #flow .caution small {
  font-size: 12px;
  display: block;
  text-indent: -1em;
  padding-left: 1em;
  margin-bottom: 0.5em; }

.sport_sale #flow .caution small::before {
  content: '※'; }

@media screen and (min-width: 768px) {
  .sport_sale #flow .flow_inner {
    margin-top: 60px; }

  .sport_sale #flow .flow_inner h3 {
    padding-left: 15%; }

  .sport_sale #flow .flow_inner > p {
    width: 90%;
    font-size: 16px;
    margin: 0 auto 60px;
    text-align: center; }

  .sport_sale #flow .mark {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    margin: 0 auto 30px; }

  .sport_sale #flow .mark picture {
    width: 75%;
    max-width: 721px;
    order: 2; }

  .sport_sale #flow .mark picture img {
    width: 100%;
    margin: 0; }

  .sport_sale #flow .mark .comment {
    order: 1;
    width: 35%;
    padding: 2vw;
    top: 5vw;
    left: 10vw; }

  .sport_sale #flow .mark .comment::before, .sport_sale #flow .mark .comment::after {
    left: 20%; }

  .sport_sale #flow .mark .comment::before {
    top: auto;
    bottom: -3vw;
    border-bottom: none;
    border-top: 3vw solid #1e3c72; }

  .sport_sale #flow .mark .comment::after {
    top: auto;
    bottom: -2.5vw;
    border-bottom: none;
    border-top: 3vw solid #fff; }

  .sport_sale #flow .mark .comment p {
    font-size: 2vw; }

  .sport_sale #flow .mark .comment strong {
    font-size: 2.2vw; }

  .sport_sale #flow .flow {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin: 0 auto 40px;
    width: 90%; }

  .sport_sale #flow .flow li {
    width: 43%;
    margin: 0; }

  .sport_sale #flow .flow li:first-of-type::after {
    bottom: auto;
    top: 50%;
    left: 118%;
    transform: translate(-50%, -50%) rotate(-90deg);
    margin: 0;
    border-left: 2.5vw solid transparent;
    border-right: 2.5vw solid transparent;
    border-top: 4.2vw solid #ce0600; }

  .sport_sale #flow .flow li h4 {
    margin: 0 auto 20px;
    gap: 4vw; }

  .sport_sale #flow .flow li h4 .num {
    width: 6vw;
    height: 6vw;
    line-height: 6vw;
    font-size: 4vw; }

  .sport_sale #flow .flow li h4 .txt {
    font-size: 2.4vw; }

  .sport_sale #flow .flow li > p {
    font-size: 14px;
    margin-bottom: 20px; }

  .sport_sale #flow .flow li:last-of-type {
    margin-bottom: 0; }

  .sport_sale #flow .flow li picture img {
    margin-bottom: 0; }

  .sport_sale #flow .caution small {
    font-size: 14px; } }

@media screen and (min-width: 1024px) {
  .sport_sale #flow {
    padding-bottom: 100px; }

  .sport_sale #flow .flow_inner {
    margin-top: 80px;
    padding-bottom: 60px; }

  .sport_sale #flow .mark .comment {
    padding: 20px;
    top: 50px;
    left: 100px; }

  .sport_sale #flow .mark .comment::before, .sport_sale #flow .mark .comment::after {
    border-left: 30px solid transparent;
    border-right: 30px solid transparent; }

  .sport_sale #flow .mark .comment::before {
    bottom: -30px;
    border-top: 30px solid #1e3c72; }

  .sport_sale #flow .mark .comment::after {
    bottom: -25px;
    border-top: 30px solid #fff; }

  .sport_sale #flow .mark .comment p {
    font-size: 20px; }

  .sport_sale #flow .mark .comment strong {
    font-size: 22px; }

  .sport_sale #flow .flow li:first-of-type::after {
    border-left: 25px solid transparent;
    border-right: 25px solid transparent;
    border-top: 42px solid #ce0600; }

  .sport_sale #flow .flow li h4 {
    gap: 10px; }

  .sport_sale #flow .flow li h4 br {
    display: none; }

  .sport_sale #flow .flow li h4 .num {
    width: 60px;
    height: 60px;
    line-height: 60px;
    font-size: 40px; }

  .sport_sale #flow .flow li h4 .txt {
    font-size: 24px; }

  .sport_sale #flow .caution small {
    font-size: 16px; } }

.sport_sale .line_bnr {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 4vw;
  background-color: #deffec;
  border: 2px solid #06c755;
  border-radius: 1em;
  padding: 5vw;
  max-width: 700px;
  width: 95%;
  margin: 8vw auto;
  font-family: "Noto Sans JP", sans-serif;
  box-sizing: border-box;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5); }

.sport_sale .line_bnr > p {
  color: #06c755;
  font-weight: 700;
  font-size: 5.35vw;
  text-align: center; }

.sport_sale .line_bnr > p::before, .sport_sale .line_bnr > p::after {
  content: '|';
  display: inline-block; }

.sport_sale .line_bnr > p::before {
  margin-right: 0.5em;
  transform: rotate(-30deg); }

.sport_sale .line_bnr > p::after {
  margin-left: 0.2em;
  transform: rotate(30deg); }

.sport_sale .line_bnr > p span {
  font-size: 0.65em; }

.sport_sale .line_bnr .grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-evenly;
  align-items: center; }

.sport_sale .line_bnr .grid img {
  width: 29%; }

.sport_sale .line_bnr .grid p {
  font-size: 4.25vw;
  color: #1e3c72;
  font-weight: 700;
  line-height: 1.5; }

.sport_sale .line_bnr .line_btn {
  display: block;
  text-align: center;
  background-color: #06c755;
  color: #fff;
  border-radius: 2em;
  padding: 0.6em 0;
  font-weight: 700;
  font-size: 5.35vw;
  width: 95%;
  margin-top: 1em; }

@media screen and (min-width: 768px) {
  .sport_sale .line_bnr {
    padding: 30px 40px;
    margin: 0 auto 60px;
    width: 75%;
    max-width: 820px;
    border-radius: 4vw; }

  .sport_sale .line_bnr p {
    font-size: 4vw;
    font-weight: 900; }

  .sport_sale .line_bnr .line_btn {
    grid-column: 2;
    grid-row: 2;
    font-size: 2.4vw;
    transition: 0.3s;
    width: 17em;
    margin: 0; }

  .sport_sale .line_bnr .line_btn:hover {
    transform: translateY(3px); }

  .sport_sale .line_bnr .grid {
    display: grid;
    grid-template-columns: 12vw 1fr;
    grid-template-rows: 1fr auto;
    gap: 0 3vw; }

  .sport_sale .line_bnr .grid img {
    grid-column: 1;
    grid-row: 1 / 3;
    width: 100%; }

  .sport_sale .line_bnr .grid p {
    font-size: 1.6vw;
    grid-column: 2;
    grid-row: 1;
    text-align: center; }

  .sport_sale .line_bnr .grid p br {
    display: none; } }

@media screen and (min-width: 1024px) {
  .sport_sale .line_bnr {
    padding: 60px 40px;
    border-radius: 40px;
    gap: 40px; }

  .sport_sale .line_bnr p {
    font-size: 40px; }

  .sport_sale .line_bnr .line_btn {
    font-size: 24px; }

  .sport_sale .line_bnr .grid {
    grid-template-columns: 120px 1fr;
    gap: 0 30px; }

  .sport_sale .line_bnr .grid p {
    font-size: 16px; } }

.sport_sale .bottom_nav {
  padding-bottom: 10vw; }

@media screen and (min-width: 1024px) {
  .sport_sale .bottom_nav {
    padding-bottom: 60px; } }
