:root {
  --p: 1366 * 100;
  --s: 375 * 100;
  --hel: 'Helvetica', sans-serif !important;
}

.lp-wrapper {
  padding: 125px 0 0;
}
.lp-container {
}


.lp-header {
  border-bottom: 2px solid #707070;
  display: flex;
  justify-content: center;
  margin-bottom: min(calc(44vw / var(--p)), 44px);
}
.lp-year {
  font-size: min(calc(48vw / var(--p)), 48px);
  letter-spacing: .2em;
  font-weight: lighter;
}
.-sp-br {
  display: none;
}

p {
  letter-spacing: var(--ls-pc);  
}

@media screen and (max-width: 768px) {
  p {
    letter-spacing: var(--ls-sp);  
  }
  .-sp-br {
    display: inline;
  }
  .lp-header {
    margin-bottom: calc(31.4vw / var(--s));
  }
  .lp-year {
    font-size: calc(23vw / var(--s));
  }
}

.lp-title {
  width: min(calc(922.93vw / var(--p)), 922.93px);
  margin: auto;
  margin-bottom: max(calc(25vw / var(--p) * -1), -25px);
  text-align: center;
  position: relative;
  z-index: 1;
}
@media screen and (max-width: 768px) {
  .lp-title {
    width: calc(340.42vw / var(--s));
    margin-bottom: calc(13vw / var(--s) * -1);
  }
}

.content1 {
  position: relative;
  max-width: 1366px;
  width: 100%;
  margin: auto;
  padding-bottom: min(calc(105.3vw / var(--p)), 105.3px);
}
.content1-content {
  display: flex;
  flex-direction: row-reverse;
}
.content1-main-image {
  width: min(calc(806vw / var(--p)), 806px);
}
.content1-main-image img {
  width: 100%;
}
.content1-info {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: min(calc(63vw / var(--p)), 63px);
}
.content1-title {
  width: min(calc(408.77vw / var(--p)), 408.77px);
}
.content1-title img {
  width: 100%;
}
.content1-left {
  width: min(calc(330vw / var(--p)), 330px);
}
.content1-left h3 {
  font-size: min(calc(13vw / var(--p)), 13px); 
  margin-bottom: min(calc(19vw / var(--p)), 19px);
}
.content1-left p {
  font-size: min(calc(15vw / var(--p)), 15px);
  line-height: 2;
}
.content1-right {
  position: absolute;
  width: min(calc(383.54vw / var(--p)), 383.54px);
  right: min(calc(55vw / var(--p)), 55px);
  bottom: max(calc(71vw / var(--p) * -1), -71px);
}
.content1-sub-image {
  width: min(calc(891.88vw / var(--p)), 891.88px);
  margin-top: max(calc(51vw / var(--p) * -1), -51px);
}
@media screen and (max-width: 768px) {
  .content1 {
    padding-bottom: calc(77.7vw / var(--s));
  }
  .content1-content {
    flex-direction: column;
  }
  .content1-main-image {
    width: 100%;
  }
  .content1-info {
    padding: calc(22.5vw / var(--s)) 0 0;
    gap: calc(22.7vw / var(--dw));
  }
  .content1-title {
    width: calc(300vw / var(--s));
    margin-bottom: calc(50.3vw / var(--s));
  }
  .content1-column {
    display: flex;
    gap: calc(32.2vw / var(--s));    
    width: 100%;
    padding-left: calc(17vw / var(--s));
  }
  .content1-right {
    position: static;
    width: auto;
    flex: 1;
    margin-top: calc(24vw / var(--s));
  }
  .content1-left {
    width: calc(171vw / var(--s));
  }
  .content1-left h3 {
    font-size: calc(10vw / var(--s));
    margin-bottom: calc(14vw / var(--s));
  }
  .content1-left p {
    font-size: calc(10vw / var(--s));
  }

  .content1-sub-image {
    margin-top: calc(22vw / var(--s));
    width: calc(336vw / var(--s));
  }
}

.content2 {
  border-top: 2px solid #707070;
  padding-bottom: min(calc(91.5vw / var(--p)), 91.5px);
}
.content2-content {
  padding: 0 min(calc(55vw / var(--p)), 55px);
  max-width: min(calc(1366vw / var(--p)), 1366px);
  width: 100%;
  margin: auto;
  position: relative;
}
.content2-title {
  margin-bottom: min(calc(104.9vw / var(--p)), 104.9px);
  margin-top: -2px;
}
.content2-title img {
  width: min(calc(359.48vw / var(--p)), 359.48px);
}
.content2-column {
  display: flex;
  gap: min(calc(315.7vw / var(--p)), 315.7px);
  justify-content: center;
}
.content2-item1 {
  width: min(calc(433.78vw / var(--p)), 433.78px);
  /* margin-left: min(calc(36vw / var(--p)), 36px); */
}
.content2-item1 .-img {
  width: min(calc(384.28vw / var(--p)), 384.28px);
  margin-right: 0;
  margin-left: auto;
  margin-bottom: min(calc(118.5vw / var(--p)), 118.5px);
}

.content2-item1 .-bigger {
  width: min(calc(549.9vw / var(--p)), 549.9px);
  position: absolute;
  top: max(calc(24vw / var(--p) * -1), -24px);
  left: 0;
  right: 0;
  margin-inline: auto;
}
.content2-item1 .-bigger img {
  width: 100%;
}

.content2-item1 .-info h4 {
  margin-bottom: min(calc(12.2vw / var(--p)), 12.2px);
  margin-left: min(calc(60vw / var(--p)), 60px);
}
.content2-item1 .-info h4 img {
  width: min(calc(184.93vw / var(--dw)), 184.93px);
}
.content2-item1 .-info p {
  font-size: min(calc(12vw /var(--p)), 12px);
  line-height: 2;
  width: min(calc(300vw / var(--p)), 300px);
}

.content2-item2 {
  width: min(calc(384.28vw / var(--p)), 384.28px);
}
.content2-item2 .-info h4 {
  margin-bottom: min(calc(12.2vw / var(--p)), 12.2px);
  text-align: right;
}
.content2-item2 .-info h4 img {
  width: min(calc(235.4vw / var(--dw)), 235.4px);
}
.content2-item2 .-info p {
  font-size: min(calc(12vw /var(--p)), 12px);
  line-height: 2;
  width: min(calc(300vw / var(--p)), 300px);
  margin-left: auto;
  margin-right: 0;
}

.content2-item2 .-img {
  margin-top: min(calc(34vw / var(--p)), 34px);
}

.content2-item3 {
  margin-top: min(calc(144vw / var(--p)), 144px);
  display: flex;
  gap: min(calc(35vw / var(--p)), 35px);
  justify-content: center;
}
.content2-item3 .-imgs {
  display: flex;
  gap: min(calc(34.8vw / var(--p)), 34.8px);
  width: min(calc(525vw / var(--p)), 525px);
}
.content2-item3 .-info {
  width: min(calc(300vw / var(--p)), 300px);
}
.content2-item3 .-info h4 {
  text-align: center;
  margin-bottom: min(calc(21.2vw / var(--p)), 21.2px);
}
.content2-item3 .-info img {
  width: min(calc(228.58vw / var(--p)), 228.58px);
}
.content2-item3 .-info p {
  font-size: min(calc(12vw / var(--p)), 12px);
  line-height: 2;
}

@media screen and (max-width: 767px) {
  .content2 {
    padding: 0;
  }
  .content2-content {
  }
  .content2-title {
    margin-bottom: calc(29.8vw / var(--s));
    padding-left: calc(17vw / var(--s));
  }
  .content2-title img {
    width: calc(189.2vw / var(--s));
  }
  .content2-column {
    flex-direction: column;
    gap: 0;
  }
  .content2-item1 {
    width: 100%;
    overflow: hidden;
    margin: 0;
    border-bottom: 1px solid #707070;
    padding-bottom: calc(86vw / var(--s));
  }
  .content2-item1 .-img {
    margin-left: 0;
    margin-right: auto;
    margin-bottom: calc(24vw / var(--s));
    width: calc(209.11vw / var(--s));
    padding-left: calc(17vw / var(--s));
  }
  .content2-item1 .-info {
    padding-left: calc(17vw / var(--s));
    margin-left: calc(9vw / var(--s));
  }
  .content2-item1 .-info h4 {
    margin-bottom: calc(22vw / var(--s));
    margin-left: 0;
  }
  .content2-item1 .-info h4 img {
    width: calc(103vw / var(--s));
  }
  .content2-item1 .-info p {
    font-size: calc(10vw / var(--s));
    width: calc(160vw / var(--s));
  }
  .content2-item1 .-bigger {
    width: calc(187vw / var(--s));
    top: calc(42vw / var(--s) * -1);
    right: 0;
    left: auto;
    margin-inline: 0;
  }
  .content2-item2 {
    width: 100%;
    border-bottom: 1px solid #707070;
    padding-bottom: calc(98vw / var(--s));
  }
  .content2-item2 {
    display: flex;
    flex-direction: column-reverse;
    gap: calc(32vw / var(--s));
  }
  .content2-item2 .-img {
    width: calc(248vw / var(--s));
    left: 0;
    right: 0;
    margin: 0 auto;
    margin-top: calc(24vw / var(--s) * -1);
  }
  .content2-item2 .-info h4 {
    text-align: center;
    margin-bottom: calc(21.5vw / var(--s));
  }
  .content2-item2 .-info h4 img {
    width: calc(128.4vw / var(--s));
  }
  .content2-item2 .-info p {
    margin: auto;
    font-size: calc(10vw / var(--s));
    width: calc(283vw / var(--s));
  }

  .content2-item3 {
    flex-direction: column;
    gap: calc(32.2vw / var(--s));
    margin: 0;
    padding-bottom: calc(71vw / var(--s));
  }
  .content2-item3 .-imgs {
    width: calc(300.88vw / var(--s));
    margin: calc(24vw / var(--s) * -1) auto 0;
    gap: calc(13.2vw / var(--s));
  }
  .content2-item3 .-imgs picture {
    width: calc(100% / 2 - 13.3vw / var(--s) / 2);
  }
  .content2-item3 .-info {
    width: calc(283vw / var(--s));
    margin: auto;
  }
  .content2-item3 .-info h4 {
    text-align: center;
    margin-bottom: calc(21.5vw / var(--s));
  }
  .content2-item3 .-info h4 img {
    width: calc(124.68vw / var(--s));
  }
  .content2-item3 .-info p {
    font-size: calc(10vw / var(--s));
  }
}

.wires {
  display: flex;
  justify-content: center;
  gap: min(calc(90vw / var(--p)), 90px);

  padding: min(calc(51.5vw / var(--p)), 51.5px) 0;
  border-top: 2px solid #707070;
  border-bottom: 2px solid #707070;
}
.wires a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: min(calc(467vw / var(--p)), 467px);
  aspect-ratio: 467 / 75;
  border: 1px solid #000000;
  border-radius: min(calc(14vw / var(--p)), 14px);
  gap: min(calc(23.5vw / var(--p)), 23.5px);
  font-family: var(--hel);
  font-weight: lighter;
  text-decoration: none;

  position: relative;
  padding-right: min(calc(40vw / var(--p)), 40px);
  line-height: 1;
  
  transition: .25s opacity;
}
.wires a:hover {
  color: #333;
  opacity: .6;
}
.wires a em {
  font-size: min(calc(42vw / var(--p)), 42px);
}
.wires a span {
  font-size: min(calc(30vw / var(--p)), 30px);
}
.wires a::after {
  content: "";
  display: block;
  width: min(calc(18vw / var(--p)), 18px);
  aspect-ratio: 18 / 17;
  background: url(/ourwacoal/assets/lp/autumn_winter/arrow.svg) center center no-repeat;
  background-size: contain;

  position: absolute;
  top: 0;
  right: min(calc(23vw / var(--p)), 23px);
  bottom: 0;
  margin: auto;
}
@media screen and (max-width: 767px) {
  .wires {
    padding: calc(43vw / var(--s)) 0;
    flex-direction: column;
    gap: calc(28vw / var(--s));
    justify-content: center;
    align-items: center;
    border-width: 1px;
  }
  .wires a {
    width: calc(232vw / var(--s));
    aspect-ratio: 232 / 37;
    gap: calc(13.5vw / var(--s));
    padding-right: calc(20vw / var(--s));
    border-radius: calc(6vw / var(--s));
  }
  .wires a em {
    font-size: calc(20vw / var(--s));
  }
  .wires a span {
    font-size: calc(14vw / var(--s));
  }
  .wires a::after {
    width: calc(9vw / var(--s));
    right: calc(11vw / var(--s));
  }
}


.content3 {
  margin-top: min(calc(52.4vw / var(--p)), 52.4px);
  padding-bottom: min(calc(55vw / var(--p)), 55px);
}
.content3-content {
  padding: 0 55px;
  max-width: 1366px;
  width: 100%;
  margin: auto;
  position: relative;

  display: flex;
}
.content3 .-mark {
  position: absolute;
  right: 55px;
  top: 0;
  font-size: min(calc(13vw / var(--p)), 13px);
}
.content3 .-imgs {
  display: flex;
  gap: min(calc(18vw / var(--p)), 18px);
  width: min(calc(683vw / var(--p)), 683px);
}
.content3 .-imgs .-left {
  width: min(calc(452vw / var(--p)), 452px);
}
.content3 .-imgs .-right {
  width: min(calc(213vw / var(--p)), 213px);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.content3 .-info {
  width: min(calc(426vw / var(--p)), 426px);
  margin-right: min(calc(44vw / var(--p)), 44px);
  margin-left: auto;
  padding-top: min(calc(89vw / var(--p)), 89px);
}
.content3 .-info .-title {
  text-align: center;
  margin-bottom: min(calc(42.7vw / var(--p)), 42.7px);
}
.content3 .-info .-title img {
  width: min(calc(280.57vw / var(--p)), 280.57px);
}
.content3 .-info .-text {
  font-size: min(calc(12vw / var(--p)), 12px);
  text-align: center;
  line-height: 2;
}
.content3 .-info .-btn {
  margin-top: min(calc(52vw / var(--p)), 52px);
  display: flex;
  justify-content: center;
}
.content3 .-info .-btn a {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: min(calc(16vw / var(--p)), 16px);
  border: 1px solid #000000;
  border-radius: min(calc(7vw / var(--p)), 7px);

  width: min(calc(189vw / var(--p)), 189px);
  height: min(calc(31vw / var(--p)), 31px);
  text-decoration: none;
  line-height: 1;

  position: relative;
  transition: .25s opacity;
}
.content3 .-info .-btn a:hover {
  color: #333;
  opacity: .6;
}

.content3 .-info .-btn a::after {
  content: "";
  display: block;
  width: min(calc(8vw / var(--p)), 8px);
  aspect-ratio: 1;
  background: url(/ourwacoal/assets/lp/autumn_winter/arrow2.svg) center center no-repeat;
  background-size: contain;

  position: absolute;
  top: 0;
  right: min(calc(10vw / var(--p)), 10px);
  bottom: 0;
  margin: auto;
}
.content3 .-sp-title {
  display: none;
}

@media screen and (max-width: 767px) {
  .content3 {
    margin: 0;
    padding: 0 0 calc(76.7vw / var(--s));
  }
  .content3-content {
    padding: calc(73vw / var(--s)) calc(17vw / var(--s)) 0;
    flex-direction: column;
    align-items: center;
    gap: 0;
  }
  .content3 .-mark {
    top: calc(13.5vw / var(--s));
    font-size: calc(10vw / var(--s));
    right: calc(17vw / var(--s));
  }
  .content3 .-sp-title {
    display: flex;
    justify-content: center;
    margin-bottom: calc(20.1vw / var(--s));
  }
  .content3 .-sp-title img {
    width: calc(292.93vw / var(--s));
  }
  .content3 .-imgs {
    width: calc(301vw / var(--s));
    gap: calc(7.9vw / var(--s));
    margin: auto;
  }
  .content3 .-imgs .-left {
    width: calc(199.2vw / var(--s));
  }
  .content3 .-imgs .-right {
    flex: 1;
    width: auto;
  }
  .content3 .-info {
    width: calc(283vw / var(--s));
    margin: auto;
  }
  .content3 .-info .-title {
    display: none;
  }
  .content3 .-info .-text {
    font-size: calc(10vw / var(--s));
    text-align: left;
  }
  .content3 .-info .-text br {
    display: none;
  }
  .content3 .-info .-btn {
    margin-top: calc(27vw / var(--s));
  }
  .content3 .-info .-btn a {
    width: calc(189vw / var(--s));
    height: auto;
    aspect-ratio: 189 / 29.4;
    border-radius: calc(7vw / var(--s));
    font-size: calc(13vw / var(--s));
  }
  .content3 .-info .-btn a::after {
    width: calc(8vw / var(--s));
    right: calc(10vw / var(--s));
  }
}


.content-footer {
  border-top: 2px solid #707070;
  padding: min(calc(68.7vw / var(--p)), 68.7px) 0;
  display: flex;
  justify-content: center;
}
.content-footer p {
  font-size: min(calc(21vw / var(--p)), 21px);
}

.global-footer {
  margin-top: 0;
}

@media screen and (max-width: 767px) {
  .content-footer {
    border-width: 1px;
    padding: calc(19.4vw / var(--s)) 0;
  }
  .content-footer p {
    font-size: calc(12vw / var(--s));
  }
  
}