@charset "UTF-8";
/**
 * メディアクエリ
 * @param {string} $mode - max または min
 * @param {number} $width - 設定値
 */
/**
 * メディアクエリ PC
 * @param {number} [$width:$breakpoin] - 設定値
 */
/**
 * メディアクエリ TABLET
 * @param {number} [$width:$breakpoin] - 設定値
 */
/**
 * メディアクエリ SP
 * @param {number} [$width:$breakpoin] - 設定値
 */
/**
 * メディアクエリによるIE11ハック（ChromiumベースのEdgeは除外できる。旧Edgeは除外できない）
 */
/**
 * VW計算
 * @param {string} $property  - プロパティ
 * @param {number} $value - 基準となる値
 * @param {number} $basewidth - 基準となるウィンドウ幅
 * @param {number} [$maxwidth:0] - 拡大を停止するウィンドウ幅
 * @param {number} [$minwidth:0] - 縮小を停止するウィンドウ幅
 */
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&display=swap");
@font-face {
  font-family: "Lacoste";
  src: url("../../assets/fonts/Lacoste-Regular.woff") format("woff");
}

@font-face {
  font-family: "Lacoste Bold";
  src: url("../../assets/fonts/Lacoste-Bold.woff") format("woff");
}

@font-face {
  font-family: "Lacoste Heavy";
  src: url("../../assets/fonts/Lacoste-Heavy.woff") format("woff");
}

/**
 * イージングプロパティ
 * https://github.com/dmnsgn/sass-easing
 */
@font-face {
  font-family: "Lacoste";
  src: url("/static/fonts/Lacoste-Regular.woff") format("woff");
}

@font-face {
  font-family: "Lacoste Black";
  src: url("/static/fonts/Lacoste-Black.woff") format("woff");
}

@font-face {
  font-family: "Lacoste Bold";
  src: url("/static/fonts/Lacoste-Bold.woff") format("woff");
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
}

#mens-polo-guide {
  --base-font: "Noto Sans JP", "Meiryo", "メイリオ", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", Helvetica, Arial, sans-serif;
  --lacoste-font: "Lacoste", "Meiryo", "メイリオ", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", Helvetica, Arial, sans-serif;
  --lacoste-font-bold: "Lacoste Bold", "Meiryo", "メイリオ", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", Helvetica, Arial, sans-serif;
  --lacoste-font-black: "Lacoste Black", "Meiryo", "メイリオ", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", Helvetica, Arial, sans-serif;
  --color-green: #0F5A33;
  background: #ffffff;
  color: #292929;
  font-family: var(--base-font);
  line-height: 1.5;
  overflow: hidden;
}

#mens-polo-guide div, #mens-polo-guide span, #mens-polo-guide applet, #mens-polo-guide object, #mens-polo-guide iframe,
#mens-polo-guide h1, #mens-polo-guide h2, #mens-polo-guide h3, #mens-polo-guide h4, #mens-polo-guide h5, #mens-polo-guide h6, #mens-polo-guide p, #mens-polo-guide blockquote, #mens-polo-guide pre,
#mens-polo-guide a, #mens-polo-guide abbr, #mens-polo-guide acronym, #mens-polo-guide address, #mens-polo-guide big, #mens-polo-guide cite, #mens-polo-guide code,
#mens-polo-guide del, #mens-polo-guide dfn, #mens-polo-guide em, #mens-polo-guide img, #mens-polo-guide ins, #mens-polo-guide kbd, #mens-polo-guide q, #mens-polo-guide s, #mens-polo-guide samp,
#mens-polo-guide small, #mens-polo-guide strike, #mens-polo-guide strong, #mens-polo-guide sub, #mens-polo-guide sup, #mens-polo-guide tt, #mens-polo-guide var,
#mens-polo-guide b, #mens-polo-guide u, #mens-polo-guide i, #mens-polo-guide center,
#mens-polo-guide dl, #mens-polo-guide dt, #mens-polo-guide dd, #mens-polo-guide ol, #mens-polo-guide ul, #mens-polo-guide li,
#mens-polo-guide fieldset, #mens-polo-guide form, #mens-polo-guide label, #mens-polo-guide legend,
#mens-polo-guide table, #mens-polo-guide caption, #mens-polo-guide tbody, #mens-polo-guide tfoot, #mens-polo-guide thead, #mens-polo-guide tr, #mens-polo-guide th, #mens-polo-guide td,
#mens-polo-guide article, #mens-polo-guide aside, #mens-polo-guide canvas, #mens-polo-guide details, #mens-polo-guide embed,
#mens-polo-guide figure, #mens-polo-guide figcaption, #mens-polo-guide footer, #mens-polo-guide header, #mens-polo-guide hgroup,
#mens-polo-guide menu, #mens-polo-guide nav, #mens-polo-guide output, #mens-polo-guide ruby, #mens-polo-guide section, #mens-polo-guide summary,
#mens-polo-guide time, #mens-polo-guide mark, #mens-polo-guide audio, #mens-polo-guide video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}

#mens-polo-guide article, #mens-polo-guide aside, #mens-polo-guide details, #mens-polo-guide figcaption, #mens-polo-guide figure,
#mens-polo-guide footer, #mens-polo-guide header, #mens-polo-guide hgroup, #mens-polo-guide menu, #mens-polo-guide nav, #mens-polo-guide section {
  display: block;
}

#mens-polo-guide ol, #mens-polo-guide ul {
  list-style: none;
}

#mens-polo-guide blockquote, #mens-polo-guide q {
  quotes: none;
}

#mens-polo-guide blockquote:before, #mens-polo-guide blockquote:after,
#mens-polo-guide q:before, #mens-polo-guide q:after {
  content: '';
  content: none;
}

#mens-polo-guide table {
  border-collapse: collapse;
  border-spacing: 0;
}

#mens-polo-guide button {
  background-color: transparent;
  border: none;
  outline: none;
  padding: 0;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

#mens-polo-guide * {
  box-sizing: border-box;
}

#mens-polo-guide a {
  color: inherit;
  text-decoration: none;
  transition: opacity 0.3s ease;
}

#mens-polo-guide a:hover {
  opacity: 0.85;
}

#mens-polo-guide img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
}

#mens-polo-guide picture {
  display: block;
}

@media screen and (max-width: 767px) {
  #mens-polo-guide .pc {
    display: none !important;
  }
}

@media screen and (min-width: 768px) {
  #mens-polo-guide .sp {
    display: none !important;
  }
}

#mens-polo-guide .lacoste-font {
  font-family: var(--lacoste-font);
}

#mens-polo-guide .lacoste-font-bold {
  font-family: var(--lacoste-font-bold);
  font-weight: normal;
}

#mens-polo-guide .lacoste-font-black {
  font-family: var(--lacoste-font-black);
  font-weight: normal;
}

#mens-polo-guide .lacoste-color {
  color: var(--color-green);
}

@media screen and (min-width: 768px) {
  #mens-polo-guide .page-container {
    padding-bottom: calc(clamp(0px, calc(120 / 1440 * 100vw), calc(120 / 1440 * 1440 * 1px)) * 1);
  }
}

@media screen and (max-width: 767px) {
  #mens-polo-guide .page-container {
    padding-bottom: calc(clamp(0px, calc(100 / 390 * 100vw), calc(100 / 390 * 100vw)) * 1);
  }
}

#mens-polo-guide .keyvisual {
  text-align: center;
  background-color: #002D18;
  color: #fff;
}

@media screen and (min-width: 768px) {
  #mens-polo-guide .keyvisual {
    padding-block: calc(clamp(0px, calc(100 / 1440 * 100vw), calc(100 / 1440 * 1440 * 1px)) * 1) calc(clamp(0px, calc(100 / 1440 * 100vw), calc(100 / 1440 * 1440 * 1px)) * 1);
  }
}

@media screen and (max-width: 767px) {
  #mens-polo-guide .keyvisual {
    padding-block: calc(clamp(0px, calc(30 / 390 * 100vw), calc(30 / 390 * 100vw)) * 1) calc(clamp(0px, calc(60 / 390 * 100vw), calc(60 / 390 * 100vw)) * 1);
  }
}

#mens-polo-guide .keyvisual .keyvisual__title {
  font-family: var(--lacoste-font-bold);
}

@media screen and (min-width: 768px) {
  #mens-polo-guide .keyvisual .keyvisual__title {
    font-size: calc(clamp(0px, calc(48 / 1440 * 100vw), calc(48 / 1440 * 1440 * 1px)) * 1);
  }
}

@media screen and (max-width: 767px) {
  #mens-polo-guide .keyvisual .keyvisual__title {
    line-height: 1.1;
    font-size: calc(clamp(0px, calc(40 / 390 * 100vw), calc(40 / 390 * 100vw)) * 1);
  }
}

#mens-polo-guide .keyvisual .keyvisual__text {
  font-weight: 600;
}

@media screen and (min-width: 768px) {
  #mens-polo-guide .keyvisual .keyvisual__text {
    margin-top: calc(clamp(0px, calc(10 / 1440 * 100vw), calc(10 / 1440 * 1440 * 1px)) * 1);
    font-size: calc(clamp(0px, calc(20 / 1440 * 100vw), calc(20 / 1440 * 1440 * 1px)) * 1);
  }
}

@media screen and (max-width: 767px) {
  #mens-polo-guide .keyvisual .keyvisual__text {
    margin-top: calc(clamp(0px, calc(16 / 390 * 100vw), calc(16 / 390 * 100vw)) * 1);
    font-size: calc(clamp(0px, calc(16 / 390 * 100vw), calc(16 / 390 * 100vw)) * 1);
  }
}

@media screen and (min-width: 768px) {
  #mens-polo-guide .classic {
    margin-top: calc(clamp(0px, calc(60 / 1440 * 100vw), calc(60 / 1440 * 1440 * 1px)) * 1);
  }
}

@media screen and (max-width: 767px) {
  #mens-polo-guide .classic {
    margin-top: calc(clamp(0px, calc(40 / 390 * 100vw), calc(40 / 390 * 100vw)) * 1);
  }
}

#mens-polo-guide .classic .classic__title {
  text-align: center;
  font-weight: 600;
}

@media screen and (min-width: 768px) {
  #mens-polo-guide .classic .classic__title {
    font-size: calc(clamp(0px, calc(32 / 1440 * 100vw), calc(32 / 1440 * 1440 * 1px)) * 1);
  }
}

@media screen and (max-width: 767px) {
  #mens-polo-guide .classic .classic__title {
    font-size: calc(clamp(0px, calc(18 / 390 * 100vw), calc(18 / 390 * 100vw)) * 1);
  }
}

@media screen and (min-width: 768px) {
  #mens-polo-guide .classic .classic__form {
    display: flex;
    justify-content: center;
    margin-top: calc(clamp(0px, calc(40 / 1440 * 100vw), calc(40 / 1440 * 1440 * 1px)) * 1);
    gap: calc(clamp(0px, calc(28 / 1440 * 100vw), calc(28 / 1440 * 1440 * 1px)) * 1);
  }
}

@media screen and (max-width: 767px) {
  #mens-polo-guide .classic .classic__form {
    margin-top: calc(clamp(0px, calc(30 / 390 * 100vw), calc(30 / 390 * 100vw)) * 1);
    padding-inline: calc(clamp(0px, calc(27 / 390 * 100vw), calc(27 / 390 * 100vw)) * 1);
  }
}

@media screen and (min-width: 768px) {
  #mens-polo-guide .classic .classic__form__select {
    display: flex;
    align-items: center;
    gap: calc(clamp(0px, calc(8 / 1440 * 100vw), calc(8 / 1440 * 1440 * 1px)) * 1);
  }
}

@media screen and (max-width: 767px) {
  #mens-polo-guide .classic .classic__form__select:has(.silhouette__form__input) {
    margin-top: calc(clamp(0px, calc(20 / 390 * 100vw), calc(20 / 390 * 100vw)) * 1);
    padding-top: calc(clamp(0px, calc(20 / 390 * 100vw), calc(20 / 390 * 100vw)) * 1);
    border-top: 1px solid #BDBDBD;
  }
}

#mens-polo-guide .classic .silhouette__form__title {
  display: flex;
  align-items: center;
}

@media screen and (min-width: 768px) {
  #mens-polo-guide .classic .silhouette__form__title {
    gap: calc(clamp(0px, calc(8 / 1440 * 100vw), calc(8 / 1440 * 1440 * 1px)) * 1);
  }
}

@media screen and (max-width: 767px) {
  #mens-polo-guide .classic .silhouette__form__title {
    gap: calc(clamp(0px, calc(5 / 390 * 100vw), calc(5 / 390 * 100vw)) * 1);
  }
}

#mens-polo-guide .classic .silhouette__form__title .silhouette__form__title--icon {
  cursor: pointer;
}

@media screen and (min-width: 768px) {
  #mens-polo-guide .classic .silhouette__form__title .silhouette__form__title--icon {
    width: calc(clamp(0px, calc(23 / 1440 * 100vw), calc(23 / 1440 * 1440 * 1px)) * 1);
  }
}

@media screen and (max-width: 767px) {
  #mens-polo-guide .classic .silhouette__form__title .silhouette__form__title--icon {
    width: calc(clamp(0px, calc(16 / 390 * 100vw), calc(16 / 390 * 100vw)) * 1);
  }
}

#mens-polo-guide .classic .classic__form__title {
  font-weight: 600;
  line-height: 1;
}

@media screen and (min-width: 768px) {
  #mens-polo-guide .classic .classic__form__title {
    font-size: calc(clamp(0px, calc(20 / 1440 * 100vw), calc(20 / 1440 * 1440 * 1px)) * 1);
  }
}

@media screen and (max-width: 767px) {
  #mens-polo-guide .classic .classic__form__title {
    font-size: calc(clamp(0px, calc(14 / 390 * 100vw), calc(14 / 390 * 100vw)) * 1);
    margin-bottom: calc(clamp(0px, calc(15 / 390 * 100vw), calc(15 / 390 * 100vw)) * 1);
  }
}

#mens-polo-guide .classic .classic__form__input {
  display: flex;
}

@media screen and (min-width: 768px) {
  #mens-polo-guide .classic .classic__form__input {
    gap: calc(clamp(0px, calc(8 / 1440 * 100vw), calc(8 / 1440 * 1440 * 1px)) * 1);
  }
}

@media screen and (max-width: 767px) {
  #mens-polo-guide .classic .classic__form__input {
    gap: calc(clamp(0px, calc(8 / 390 * 100vw), calc(8 / 390 * 100vw)) * 1);
  }
}

#mens-polo-guide .classic .classic__form__label {
  border-radius: 200px;
  border: 1px solid var(--color-green);
  color: var(--color-green);
  background-color: #fff;
  align-items: center;
  transition: background-color .3s ease, color .3s ease;
  font-weight: 600;
  cursor: pointer;
  display: flex;
}

@media screen and (min-width: 768px) {
  #mens-polo-guide .classic .classic__form__label {
    height: calc(clamp(0px, calc(38 / 1440 * 100vw), calc(38 / 1440 * 1440 * 1px)) * 1);
    padding-inline: calc(clamp(0px, calc(16 / 1440 * 100vw), calc(16 / 1440 * 1440 * 1px)) * 1);
    font-size: calc(clamp(0px, calc(16 / 1440 * 100vw), calc(16 / 1440 * 1440 * 1px)) * 1);
  }
}

@media screen and (max-width: 767px) {
  #mens-polo-guide .classic .classic__form__label {
    padding-block: calc(clamp(0px, calc(4 / 390 * 100vw), calc(4 / 390 * 100vw)) * 1);
    padding-inline: calc(clamp(0px, calc(14 / 390 * 100vw), calc(14 / 390 * 100vw)) * 1);
    font-size: calc(clamp(0px, calc(13 / 390 * 100vw), calc(13 / 390 * 100vw)) * 1);
  }
}

#mens-polo-guide .classic .classic__form__label:has(.classic__form__checkbox:checked) {
  background-color: var(--color-green);
  color: #fff;
}

#mens-polo-guide .classic .classic__form__label:has(.classic__form__checkbox:checked) .classic__form__icon {
  opacity: 1;
  overflow: auto;
  width: auto;
}

#mens-polo-guide .classic .classic__form__checkbox {
  display: none;
}

#mens-polo-guide .classic .classic__form__icon {
  display: inline-block;
  overflow: hidden;
  opacity: 0;
  width: 0;
  transition: overflow .3s ease, opacity .3s ease;
}

@media screen and (min-width: 768px) {
  #mens-polo-guide .classic .classic__form__icon img {
    width: calc(clamp(0px, calc(16 / 1440 * 100vw), calc(16 / 1440 * 1440 * 1px)) * 1);
    height: calc(clamp(0px, calc(16 / 1440 * 100vw), calc(16 / 1440 * 1440 * 1px)) * 1);
    margin-right: calc(clamp(0px, calc(4 / 1440 * 100vw), calc(4 / 1440 * 1440 * 1px)) * 1);
  }
}

@media screen and (max-width: 767px) {
  #mens-polo-guide .classic .classic__form__icon img {
    width: calc(clamp(0px, calc(10 / 390 * 100vw), calc(10 / 390 * 100vw)) * 1);
    height: calc(clamp(0px, calc(10 / 390 * 100vw), calc(10 / 390 * 100vw)) * 1);
    margin-right: calc(clamp(0px, calc(5 / 390 * 100vw), calc(5 / 390 * 100vw)) * 1);
  }
}

#mens-polo-guide .classic .classic__form__text {
  flex-shrink: 0;
}

@media screen and (min-width: 768px) {
  #mens-polo-guide .classic .classic__contents {
    background-color: #F4F4F4;
    margin-top: calc(clamp(0px, calc(40 / 1440 * 100vw), calc(40 / 1440 * 1440 * 1px)) * 1);
    padding-top: calc(clamp(0px, calc(5 / 1440 * 100vw), calc(5 / 1440 * 1440 * 1px)) * 1);
    padding-bottom: calc(clamp(0px, calc(80 / 1440 * 100vw), calc(80 / 1440 * 1440 * 1px)) * 1);
  }
}

#mens-polo-guide .classic .classic__contents__inner {
  max-width: 1252px;
  margin-inline: auto;
  box-sizing: content-box;
  transition: opacity 0.3s ease-in-out;
  opacity: 1;
}

@media screen and (min-width: 768px) {
  #mens-polo-guide .classic .classic__contents__inner {
    padding-inline: calc(clamp(0px, calc(94 / 1440 * 100vw), calc(94 / 1440 * 1440 * 1px)) * 1);
  }
}

#mens-polo-guide .classic .classic__contents__inner.is-transparent {
  opacity: 0;
}

#mens-polo-guide .classic .classic__panel {
  display: block;
}

#mens-polo-guide .classic .classic__panel.is-hidden {
  display: none;
}

@media screen and (max-width: 767px) {
  #mens-polo-guide .classic .classic__panel:last-of-type .classic__panel__inner {
    padding-bottom: calc(clamp(0px, calc(95 / 390 * 100vw), calc(95 / 390 * 100vw)) * 1);
  }
}

#mens-polo-guide .classic .classic__panel__inner {
  background-color: #fff;
}

@media screen and (min-width: 768px) {
  #mens-polo-guide .classic .classic__panel__inner {
    padding: calc(clamp(0px, calc(40 / 1440 * 100vw), calc(40 / 1440 * 1440 * 1px)) * 1);
    display: flex;
    gap: calc(clamp(0px, calc(40 / 1440 * 100vw), calc(40 / 1440 * 1440 * 1px)) * 1);
    margin-top: calc(clamp(0px, calc(60 / 1440 * 100vw), calc(60 / 1440 * 1440 * 1px)) * 1);
  }
}

@media screen and (max-width: 767px) {
  #mens-polo-guide .classic .classic__panel__inner {
    padding-block: calc(clamp(0px, calc(40 / 390 * 100vw), calc(40 / 390 * 100vw)) * 1);
  }
}

#mens-polo-guide .classic .panel__image {
  position: relative;
  aspect-ratio: 1 / 1;
}

@media screen and (min-width: 768px) {
  #mens-polo-guide .classic .panel__image {
    width: calc(clamp(0px, calc(540 / 1440 * 100vw), calc(540 / 1440 * 1440 * 1px)) * 1);
    flex-shrink: 0;
  }
}

#mens-polo-guide .classic .panel__image img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: auto;
  opacity: 0;
  visibility: hidden;
}

#mens-polo-guide .classic .panel__image img.is-active {
  opacity: 1;
  visibility: visible;
}

@media screen and (min-width: 768px) {
  #mens-polo-guide .classic .panel__column {
    display: flex;
    flex-direction: column;
  }
}

@media screen and (max-width: 767px) {
  #mens-polo-guide .classic .panel__column {
    margin-top: calc(clamp(0px, calc(20 / 390 * 100vw), calc(20 / 390 * 100vw)) * 1);
  }
}

@media screen and (max-width: 767px) {
  #mens-polo-guide .classic .panel__head {
    padding-inline: calc(clamp(0px, calc(24 / 390 * 100vw), calc(24 / 390 * 100vw)) * 1);
  }
}

#mens-polo-guide .classic .panel__title {
  font-weight: 600;
}

@media screen and (min-width: 768px) {
  #mens-polo-guide .classic .panel__title {
    font-size: calc(clamp(0px, calc(20 / 1440 * 100vw), calc(20 / 1440 * 1440 * 1px)) * 1);
  }
}

@media screen and (max-width: 767px) {
  #mens-polo-guide .classic .panel__title {
    font-size: calc(clamp(0px, calc(16 / 390 * 100vw), calc(16 / 390 * 100vw)) * 1);
  }
}

#mens-polo-guide .classic .panel__label {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

@media screen and (min-width: 768px) {
  #mens-polo-guide .classic .panel__label {
    margin-top: calc(clamp(0px, calc(20 / 1440 * 100vw), calc(20 / 1440 * 1440 * 1px)) * 1);
  }
}

@media screen and (max-width: 767px) {
  #mens-polo-guide .classic .panel__label {
    margin-top: calc(clamp(0px, calc(12 / 390 * 100vw), calc(12 / 390 * 100vw)) * 1);
  }
}

#mens-polo-guide .classic .panel__tag {
  border: 1px solid #000;
  border-radius: 2px;
  font-family: var(--lacoste-font);
}

@media screen and (min-width: 768px) {
  #mens-polo-guide .classic .panel__tag {
    font-size: calc(clamp(0px, calc(16 / 1440 * 100vw), calc(16 / 1440 * 1440 * 1px)) * 1);
    padding: calc(clamp(0px, calc(2 / 1440 * 100vw), calc(2 / 1440 * 1440 * 1px)) * 1) calc(clamp(0px, calc(8 / 1440 * 100vw), calc(8 / 1440 * 1440 * 1px)) * 1);
  }
}

@media screen and (max-width: 767px) {
  #mens-polo-guide .classic .panel__tag {
    font-size: calc(clamp(0px, calc(14 / 390 * 100vw), calc(14 / 390 * 100vw)) * 1);
    padding: calc(clamp(0px, calc(1 / 390 * 100vw), calc(1 / 390 * 100vw)) * 1) calc(clamp(0px, calc(8 / 390 * 100vw), calc(8 / 390 * 100vw)) * 1);
  }
}

#mens-polo-guide .classic .panel__price {
  font-weight: bold;
}

@media screen and (min-width: 768px) {
  #mens-polo-guide .classic .panel__price {
    font-size: calc(clamp(0px, calc(20 / 1440 * 100vw), calc(20 / 1440 * 1440 * 1px)) * 1);
  }
}

@media screen and (max-width: 767px) {
  #mens-polo-guide .classic .panel__price {
    font-size: calc(clamp(0px, calc(18 / 390 * 100vw), calc(18 / 390 * 100vw)) * 1);
  }
}

@media screen and (min-width: 768px) {
  #mens-polo-guide .classic .panel__color {
    margin-top: calc(clamp(0px, calc(20 / 1440 * 100vw), calc(20 / 1440 * 1440 * 1px)) * 1);
  }
}

@media screen and (max-width: 767px) {
  #mens-polo-guide .classic .panel__color {
    margin-top: calc(clamp(0px, calc(16 / 390 * 100vw), calc(16 / 390 * 100vw)) * 1);
  }
}

#mens-polo-guide .classic .panel__color__number {
  font-family: var(--lacoste-font);
}

@media screen and (min-width: 768px) {
  #mens-polo-guide .classic .panel__color__number {
    font-size: calc(clamp(0px, calc(14 / 1440 * 100vw), calc(14 / 1440 * 1440 * 1px)) * 1);
  }
}

@media screen and (max-width: 767px) {
  #mens-polo-guide .classic .panel__color__number {
    font-size: calc(clamp(0px, calc(14 / 390 * 100vw), calc(14 / 390 * 100vw)) * 1);
    padding-inline: calc(clamp(0px, calc(24 / 390 * 100vw), calc(24 / 390 * 100vw)) * 1);
  }
}

#mens-polo-guide .classic .panel__color__list {
  display: grid;
}

@media screen and (min-width: 768px) {
  #mens-polo-guide .classic .panel__color__list {
    margin-top: calc(clamp(0px, calc(20 / 1440 * 100vw), calc(20 / 1440 * 1440 * 1px)) * 1);
    gap: calc(clamp(0px, calc(10 / 1440 * 100vw), calc(10 / 1440 * 1440 * 1px)) * 1);
    grid-template-columns: repeat(11, 1fr);
  }
}

@media screen and (max-width: 767px) {
  #mens-polo-guide .classic .panel__color__list {
    margin-top: calc(clamp(0px, calc(16 / 390 * 100vw), calc(16 / 390 * 100vw)) * 1);
    padding-inline: calc(clamp(0px, calc(24 / 390 * 100vw), calc(24 / 390 * 100vw)) * 1);
    gap: calc(clamp(0px, calc(10 / 390 * 100vw), calc(10 / 390 * 100vw)) * 1);
    grid-auto-columns: calc((100% - (clamp(0px, calc(10 / 390 * 100vw), calc(10 / 390 * 100vw)) * 1) * 6) / 7);
    overflow-x: auto;
  }
}

#mens-polo-guide .classic .panel__color__item {
  position: relative;
  cursor: pointer;
}

#mens-polo-guide .classic .panel__color__item::after {
  content: "";
  display: block;
  position: absolute;
  inset: 0;
  border: 4px solid;
  border-color: transparent;
  opacity: 0;
  transition: opacity .2s ease, border-color .2s ease;
}

#mens-polo-guide .classic .panel__color__item.is-active::after {
  border-color: #A4A4A4;
  opacity: 1;
}

@media screen and (min-width: 768px) {
  #mens-polo-guide .classic .panel__link {
    order: 1;
    padding-top: calc(clamp(0px, calc(20 / 1440 * 100vw), calc(20 / 1440 * 1440 * 1px)) * 1);
  }
}

@media screen and (max-width: 767px) {
  #mens-polo-guide .classic .panel__link {
    margin-top: calc(clamp(0px, calc(16 / 390 * 100vw), calc(16 / 390 * 100vw)) * 1);
    padding-inline: calc(clamp(0px, calc(24 / 390 * 100vw), calc(24 / 390 * 100vw)) * 1);
  }
}

#mens-polo-guide .classic .panel__link a {
  text-align: center;
  background-color: var(--color-green);
  color: #fff;
  font-weight: 600;
}

@media screen and (min-width: 768px) {
  #mens-polo-guide .classic .panel__link a {
    display: inline-block;
    padding: calc(clamp(0px, calc(12 / 1440 * 100vw), calc(12 / 1440 * 1440 * 1px)) * 1) calc(clamp(0px, calc(55 / 1440 * 100vw), calc(55 / 1440 * 1440 * 1px)) * 1);
    font-size: calc(clamp(0px, calc(16 / 1440 * 100vw), calc(16 / 1440 * 1440 * 1px)) * 1);
  }
}

@media screen and (max-width: 767px) {
  #mens-polo-guide .classic .panel__link a {
    display: block;
    padding-block: calc(clamp(0px, calc(12 / 390 * 100vw), calc(12 / 390 * 100vw)) * 1);
    font-size: calc(clamp(0px, calc(14 / 390 * 100vw), calc(14 / 390 * 100vw)) * 1);
  }
}

@media screen and (min-width: 768px) {
  #mens-polo-guide .classic .panel__text {
    line-height: 1.8;
    /*order: 2;*/
    font-size: calc(clamp(0px, calc(16 / 1440 * 100vw), calc(16 / 1440 * 1440 * 1px)) * 1);
    margin-top: calc(clamp(0px, calc(20 / 1440 * 100vw), calc(20 / 1440 * 1440 * 1px)) * 1);
  }
}

@media screen and (max-width: 767px) {
  #mens-polo-guide .classic .panel__text {
    line-height: 2;
    margin-top: calc(clamp(0px, calc(16 / 390 * 100vw), calc(16 / 390 * 100vw)) * 1);
    font-size: calc(clamp(0px, calc(14 / 390 * 100vw), calc(14 / 390 * 100vw)) * 1);
    padding-inline: calc(clamp(0px, calc(24 / 390 * 100vw), calc(24 / 390 * 100vw)) * 1);
  }
}

#mens-polo-guide .slide__contents {
  /* ページネーション全体を中央に配置 */
}

@media screen and (min-width: 768px) {
  #mens-polo-guide .slide__contents {
    margin-top: calc(clamp(0px, calc(80 / 1440 * 100vw), calc(80 / 1440 * 1440 * 1px)) * 1);
  }
}

#mens-polo-guide .slide__contents .slide__head {
  text-align: center;
  border-bottom: 2px solid #E5E5E5;
}

@media screen and (min-width: 768px) {
  #mens-polo-guide .slide__contents .slide__head {
    padding-bottom: calc(clamp(0px, calc(30 / 1440 * 100vw), calc(30 / 1440 * 1440 * 1px)) * 1);
  }
}

@media screen and (max-width: 767px) {
  #mens-polo-guide .slide__contents .slide__head {
    padding-bottom: calc(clamp(0px, calc(20 / 390 * 100vw), calc(20 / 390 * 100vw)) * 1);
  }
}

#mens-polo-guide .slide__contents .slide__title {
  font-weight: bold;
}

@media screen and (min-width: 768px) {
  #mens-polo-guide .slide__contents .slide__title {
    font-size: calc(clamp(0px, calc(32 / 1440 * 100vw), calc(32 / 1440 * 1440 * 1px)) * 1);
  }
}

@media screen and (max-width: 767px) {
  #mens-polo-guide .slide__contents .slide__title {
    font-size: calc(clamp(0px, calc(17 / 390 * 100vw), calc(17 / 390 * 100vw)) * 1);
  }
}

#mens-polo-guide .slide__contents .slide__lead {
  font-weight: 600;
}

@media screen and (min-width: 768px) {
  #mens-polo-guide .slide__contents .slide__lead {
    margin-top: calc(clamp(0px, calc(12 / 1440 * 100vw), calc(12 / 1440 * 1440 * 1px)) * 1);
    font-size: calc(clamp(0px, calc(16 / 1440 * 100vw), calc(16 / 1440 * 1440 * 1px)) * 1);
  }
}

@media screen and (max-width: 767px) {
  #mens-polo-guide .slide__contents .slide__lead {
    line-height: 1.7;
    margin-top: calc(clamp(0px, calc(12 / 390 * 100vw), calc(12 / 390 * 100vw)) * 1);
    font-size: calc(clamp(0px, calc(13 / 390 * 100vw), calc(13 / 390 * 100vw)) * 1);
  }
}

@media screen and (min-width: 768px) {
  #mens-polo-guide .slide__contents .slide__block {
    margin-top: calc(clamp(0px, calc(50 / 1440 * 100vw), calc(50 / 1440 * 1440 * 1px)) * 1);
  }
}

@media screen and (max-width: 767px) {
  #mens-polo-guide .slide__contents .slide__block {
    margin-top: calc(clamp(0px, calc(30 / 390 * 100vw), calc(30 / 390 * 100vw)) * 1);
  }
}

#mens-polo-guide .slide__contents .slide__name {
  font-family: var(--lacoste-font-bold);
  text-align: center;
}

@media screen and (min-width: 768px) {
  #mens-polo-guide .slide__contents .slide__name {
    font-size: calc(clamp(0px, calc(32 / 1440 * 100vw), calc(32 / 1440 * 1440 * 1px)) * 1);
  }
}

@media screen and (max-width: 767px) {
  #mens-polo-guide .slide__contents .slide__name {
    font-size: calc(clamp(0px, calc(22 / 390 * 100vw), calc(22 / 390 * 100vw)) * 1);
  }
}

@media screen and (min-width: 768px) {
  #mens-polo-guide .slide__contents .slide__wrap {
    margin-top: calc(clamp(0px, calc(30 / 1640 * 100vw), calc(30 / 1640 * 1640 * 1px)) * 1);
    width: calc(clamp(0px, calc(1600 / 1640 * 100vw), calc(1600 / 1640 * 1640 * 1px)) * 1);
    margin-inline: auto;
  }
}

@media screen and (max-width: 767px) {
  #mens-polo-guide .slide__contents .slide__wrap {
    margin-top: calc(clamp(0px, calc(20 / 390 * 100vw), calc(20 / 390 * 100vw)) * 1);
  }
}

#mens-polo-guide .slide__contents .slide__image {
  position: relative;
}

@media screen and (min-width: 768px) {
  #mens-polo-guide .slide__contents .slide__image {
    height: calc(clamp(0px, calc(465 / 1640 * 100vw), calc(465 / 1640 * 1640 * 1px)) * 1);
  }
}

@media screen and (max-width: 767px) {
  #mens-polo-guide .slide__contents .slide__image {
    height: calc(clamp(0px, calc(340 / 390 * 100vw), calc(340 / 390 * 100vw)) * 1);
  }
}

#mens-polo-guide .slide__contents .slide__image img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: auto;
  opacity: 0;
  visibility: hidden;
}

#mens-polo-guide .slide__contents .slide__image img.is-active {
  opacity: 1;
  visibility: visible;
}

#mens-polo-guide .slide__contents .slide__color__list {
  display: grid;
}

@media screen and (min-width: 768px) {
  #mens-polo-guide .slide__contents .slide__color__list {
    grid-template-columns: repeat(10, 1fr);
    margin-top: calc(clamp(0px, calc(16 / 1440 * 100vw), calc(16 / 1440 * 1440 * 1px)) * 1);
    gap: calc(clamp(0px, calc(10 / 1440 * 100vw), calc(10 / 1440 * 1440 * 1px)) * 1);
  }
}

@media screen and (max-width: 767px) {
  #mens-polo-guide .slide__contents .slide__color__list {
    grid-template-columns: repeat(7, 1fr);
    margin-top: calc(clamp(0px, calc(16 / 390 * 100vw), calc(16 / 390 * 100vw)) * 1);
    gap: calc(clamp(0px, calc(10 / 390 * 100vw), calc(10 / 390 * 100vw)) * 1);
  }
}

#mens-polo-guide .slide__contents .slide__color__item {
  position: relative;
}

#mens-polo-guide .slide__contents .slide__color__item[data-image] {
  cursor: pointer;
}

#mens-polo-guide .slide__contents .slide__color__item::after {
  content: "";
  display: block;
  position: absolute;
  inset: 0;
  border: 4px solid;
  border-color: transparent;
  opacity: 0;
  transition: opacity .2s ease, border-color .2s ease;
}

#mens-polo-guide .slide__contents .slide__color__item.is-active::after {
  border-color: #A4A4A4;
  opacity: 1;
}

#mens-polo-guide .slide__contents .slide__pagination__wrap {
  display: flex;
  justify-content: center;
}

@media screen and (min-width: 768px) {
  #mens-polo-guide .slide__contents .slide__pagination__wrap {
    margin-top: calc(clamp(0px, calc(40 / 1440 * 100vw), calc(40 / 1440 * 1440 * 1px)) * 1);
  }
}

@media screen and (max-width: 767px) {
  #mens-polo-guide .slide__contents .slide__pagination__wrap {
    margin-top: calc(clamp(0px, calc(40 / 390 * 100vw), calc(40 / 390 * 100vw)) * 1);
  }
}

#mens-polo-guide .slide__contents .slide__pagination {
  position: relative;
  display: flex;
  align-items: center;
  padding: 0;
  margin: 0;
  bottom: 0;
}

#mens-polo-guide .slide__contents .slide__pagination li {
  transition: all 0.3s ease;
  /* 滑らかな動きの要 */
}

#mens-polo-guide .slide__contents .slide__pagination li.is-large .splide__pagination__page {
  transform: scale(1);
}

#mens-polo-guide .slide__contents .slide__pagination li.is-medium .splide__pagination__page {
  transform: scale(0.75);
  /* 75%の大きさ */
}

#mens-polo-guide .slide__contents .slide__pagination li.is-small .splide__pagination__page {
  transform: scale(0.5);
  /* 50%の大きさ */
}

#mens-polo-guide .slide__contents .slide__pagination li.is-hidden-dot {
  width: 0;
  margin: 0;
  overflow: hidden;
  opacity: 0;
}

#mens-polo-guide .slide__contents .slide__pagination li.is-hidden-dot .splide__pagination__page {
  transform: scale(0);
}

#mens-polo-guide .slide__contents .slide__pagination .splide__pagination__page {
  background-color: #E4E4E4;
  transition: all 0.3s ease;
  opacity: 1;
  cursor: pointer;
}

@media screen and (min-width: 768px) {
  #mens-polo-guide .slide__contents .slide__pagination .splide__pagination__page {
    width: calc(clamp(0px, calc(12 / 1440 * 100vw), calc(12 / 1440 * 1440 * 1px)) * 1);
    height: calc(clamp(0px, calc(12 / 1440 * 100vw), calc(12 / 1440 * 1440 * 1px)) * 1);
    margin: calc(clamp(0px, calc(5 / 1440 * 100vw), calc(5 / 1440 * 1440 * 1px)) * 1);
  }
}

@media screen and (max-width: 767px) {
  #mens-polo-guide .slide__contents .slide__pagination .splide__pagination__page {
    width: calc(clamp(0px, calc(8 / 390 * 100vw), calc(8 / 390 * 100vw)) * 1);
    height: calc(clamp(0px, calc(8 / 390 * 100vw), calc(8 / 390 * 100vw)) * 1);
    margin: calc(clamp(0px, calc(3 / 390 * 100vw), calc(3 / 390 * 100vw)) * 1);
  }
}

#mens-polo-guide .slide__contents .slide__pagination .splide__pagination__page.is-active {
  background-color: var(--color-green);
}

@media screen and (max-width: 767px) {
  #mens-polo-guide .slide__contents .slide__arrow__wrap {
    display: none;
  }
}

@media screen and (min-width: 768px) {
  #mens-polo-guide .slide__contents .slide__arrow__wrap .slide__arrow {
    background: transparent;
    opacity: 1;
    width: calc(clamp(0px, calc(56 / 1440 * 100vw), calc(56 / 1440 * 1440 * 1px)) * 1);
    height: calc(clamp(0px, calc(56 / 1440 * 100vw), calc(56 / 1440 * 1440 * 1px)) * 1);
    top: 40%;
    transition: opacity .2s ease;
  }
}

@media screen and (min-width: 768px) {
  #mens-polo-guide .slide__contents .slide__arrow__wrap .slide__arrow:disabled {
    pointer-events: none;
    opacity: 0;
  }
}

@media screen and (min-width: 768px) {
  #mens-polo-guide .slide__contents .slide__arrow__wrap .splide__arrow--prev {
    left: 0;
  }
}

@media screen and (min-width: 768px) {
  #mens-polo-guide .slide__contents .slide__arrow__wrap .splide__arrow--next {
    right: 0;
  }
}

@media screen and (max-width: 767px) {
  #mens-polo-guide .sports {
    margin-top: calc(clamp(0px, calc(50 / 390 * 100vw), calc(50 / 390 * 100vw)) * 1);
  }
}

@media screen and (max-width: 767px) {
  #mens-polo-guide .new {
    margin-top: calc(clamp(0px, calc(100 / 390 * 100vw), calc(100 / 390 * 100vw)) * 1);
  }
}

@media screen and (max-width: 767px) {
  #mens-polo-guide .fashion {
    margin-top: calc(clamp(0px, calc(100 / 390 * 100vw), calc(100 / 390 * 100vw)) * 1);
  }
}

#mens-polo-guide .all__link {
  text-align: center;
}

@media screen and (min-width: 768px) {
  #mens-polo-guide .all__link {
    margin-top: calc(clamp(0px, calc(100 / 1440 * 100vw), calc(100 / 1440 * 1440 * 1px)) * 1);
  }
}

@media screen and (max-width: 767px) {
  #mens-polo-guide .all__link {
    margin-top: calc(clamp(0px, calc(80 / 390 * 100vw), calc(80 / 390 * 100vw)) * 1);
    padding-inline: calc(clamp(0px, calc(20 / 390 * 100vw), calc(20 / 390 * 100vw)) * 1);
  }
}

#mens-polo-guide .all__link a {
  font-weight: 600;
  color: #fff;
  background-color: var(--color-green);
}

@media screen and (min-width: 768px) {
  #mens-polo-guide .all__link a {
    display: inline-block;
    font-size: calc(clamp(0px, calc(16 / 1440 * 100vw), calc(16 / 1440 * 1440 * 1px)) * 1);
    padding-block: calc(clamp(0px, calc(20 / 1440 * 100vw), calc(20 / 1440 * 1440 * 1px)) * 1);
    padding-inline: calc(clamp(0px, calc(71 / 1440 * 100vw), calc(71 / 1440 * 1440 * 1px)) * 1);
  }
}

@media screen and (max-width: 767px) {
  #mens-polo-guide .all__link a {
    display: block;
    font-size: calc(clamp(0px, calc(16 / 390 * 100vw), calc(16 / 390 * 100vw)) * 1);
    padding-block: calc(clamp(0px, calc(12 / 390 * 100vw), calc(12 / 390 * 100vw)) * 1);
  }
}

#mens-polo-guide .modal {
  width: 100%;
  height: 100dvh;
  position: fixed;
  top: 0;
  left: 0;
  background-color: rgba(0, 0, 0, 0.2);
  transition: opacity .3s ease-out, visibility .3s ease-out;
  overflow: hidden;
  opacity: 0;
  visibility: hidden;
  z-index: 10;
  display: grid;
  place-content: center;
}

#mens-polo-guide .modal.is-open {
  opacity: 1;
  visibility: visible;
}

#mens-polo-guide .modal .modal__inner {
  position: relative;
}

#mens-polo-guide .modal .modal__close {
  position: absolute;
}

@media screen and (min-width: 768px) {
  #mens-polo-guide .modal .modal__close {
    top: 24px;
    right: 26px;
    width: 14px;
  }
}

@media screen and (max-width: 767px) {
  #mens-polo-guide .modal .modal__close {
    top: calc(clamp(0px, calc(24 / 390 * 100vw), calc(24 / 390 * 100vw)) * 1);
    right: calc(clamp(0px, calc(26 / 390 * 100vw), calc(26 / 390 * 100vw)) * 1);
    width: calc(clamp(0px, calc(14 / 390 * 100vw), calc(14 / 390 * 100vw)) * 1);
  }
}

@media screen and (min-width: 768px) {
  #mens-polo-guide .modal .modal__image {
    width: 380px;
  }
}

@media screen and (max-width: 767px) {
  #mens-polo-guide .modal .modal__image {
    width: calc(clamp(0px, calc(308 / 390 * 100vw), calc(308 / 390 * 100vw)) * 1);
  }
}
/*# sourceMappingURL=common.css.map */
