@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;700&family=Josefin+Sans:wght@400;500&display=swap');
img {
  height: auto;
}

.lp-frames {
 font-size: 14px;
 color: #1c1c1c;
 background-color: #fff;
 margin: 0 auto!important;
 font-family: 'Noto Sans JP';
 font-style: normal;
 font-weight: 400;
 position: relative;
 min-width: 0; 
}
/* breadcrumb */

.fp {
 font-size: 14px;
 line-height: 1.6;
 margin: 0 auto;
 margin-top: 0 !important;
}
.fp .pc {
 display: none !important;
}
.fp .breadcrumb {
 padding: 0 20px;
 margin: 0 0 20px;
}
.fp .breadcrumb ul {
 display: -webkit-box;
 display: -ms-flexbox;
 display: flex;
 margin: 0 auto;
}
.fp .breadcrumb li {
 font-size: 12px;
 margin: 0 7px 0 0;
}
.fp .breadcrumb li:last-child {
 margin: 0;
}
.fp .breadcrumb li a {
 position: relative;
 display: block;
 padding: 0 20px 0 0;
}
.fp .breadcrumb li a:after {
 content: '>';
 position: absolute;
 top: -2px;
 right: 0;
 font-size: 14px;
}
@media screen and (min-width:768px) {
 .lp-frames {
  font-size: 16px;
 }
 .fp {
  line-height: 1.9;
  margin: 0 0 20px !important;
 }
 .fp .breadcrumb {
  margin: 20px 0 20px;
 }
 .fp .breadcrumb ul {
  width: 100%;
  margin: 0 auto;
 }
}

/* c-heading */
.c-heading__icon {
 text-align: center;
 position: relative;
 padding: 0 0 20px;
 margin-bottom: 44px;
}
.c-heading__icon img {
 width: 45px;
 height: auto;
}
.c-heading__title {
 font-family: 'Josefin Sans';
 font-style: normal;
 font-weight: 400;
 font-size: 24px;
 line-height: 24px;
 text-align: center;
 position: relative;
 padding: 0 0 16px;
 margin-bottom: 48px;
}
.c-heading__title::after, .c-heading__icon::after {
 position: absolute;
 content: "";
 width: 60px;
 height: 3px;
 /*background-color: #35C5BC;*/
	background-color: #ed8466;
 bottom: 0;
 left: 50%;
 -webkit-transform: translateX(-50%);
 -moz-transform: translateX(-50%);
 -ms-transform: translateX(-50%);
 transform: translateX(-50%);
	border-radius: 9999px;
}
.c-heading__title span {
 display: block;
 margin-bottom: -15px;
 font-size: 16px;
}
@media screen and (min-width:768px) {
 .c-heading__title {
  font-size: 28px;
  margin-bottom: 44px;
 }
 .c-heading__title span {
  font-size: 18px;
  margin-bottom: -5px;
 }
 .c-heading__icon {
  margin-bottom: 70px;
 }
}
.c-bubble {
 margin-bottom: 84px;
}
.c-bubble__text {
 border: 1px solid #a9a9a9;
 border-radius: 30px;
 font-family: 'Noto Sans JP';
 font-style: normal;
 font-weight: 400;
 font-size: 20px;
 letter-spacing: 0.05em;
 line-height: 1.75;
 text-align: center;
 display: flex;
 justify-content: center;
 align-items: center;
 padding: 32px 36px;
 width: 344px;
 margin: 0 auto;
 position: relative;
}
.c-bubble__text::before {
 position: absolute;
 content: '';
 bottom: -1px;
 left: calc(50% - 10px);
 width: 20px;
 height: 1px;
 background: #fff;
}
.c-bubble__text::after {
 position: absolute;
 content: '';
 bottom: -6px;
 left: calc(50% - 3px);
 width: 20px;
 height: 1px;
 background: #a9a9a9;
 -webkit-transform: rotate(300deg);
 transform: rotate(300deg);
}
@media screen and (min-width:768px) {
 .c-bubble__text {
  font-size: 20px;
  padding: 16px 36px;
  width: 493px;
  border-radius: 100vh;
 }
}
/* section */
.p-section {
 padding: 20px 3.2% 64px;
}
@media screen and (min-width:768px) {
 .p-section {
  padding: 30px 0;
 }
}
/* mv */
.p-mv {
 /*background: #FFFFF1;*/
}
.p-mv__image, .p-mv__image img {
 width: 100%;
}
.p-mv__header {
 padding: 48px 5%;
 border-radius: 3px;
 color: #1c1c1c;
}
.p-mv__title {
 font-family: 'Noto Sans JP';
 font-style: normal;
 font-weight: 400;
 font-size: 20px;
 line-height: 1.4;
 letter-spacing: 0.08em;
 margin-bottom: 5px;
 text-align: center;
}
.p-mv__subtitle {
 font-family: 'Noto Sans JP';
 font-style: normal;
 font-weight: 400;
 font-size: 16px;
 line-height: 1.4;
 letter-spacing: 0.08em;
 margin-bottom: 30px;
 text-align: center!important;
}
.p-mv__text {
 font-family: 'Noto Sans JP';
 font-style: normal;
 font-weight: 400;
 font-size: 13px;
 line-height: 2.2;
 letter-spacing: 0.03em;
 text-align: center;
}
.p-mv__text span {
 font-size: 125%;
 font-weight: 500;
}
@media screen and (min-width:768px) {
 .p-mv__header {
  max-width: 800px;
  margin: 0 auto;
  padding: 48px 0;
 }
 .p-mv__title {
  font-size: 32px;
  margin: 0 0 18px;
 }
 .p-mv__subtitle {
  font-size: 24px;
  margin: 0 0 30px;
 }	
 .p-mv__text {
  font-size: 18px;
 }
}
/* LINE UP */
.p-anchor {
 display: -webkit-box;
 display: -ms-flexbox;
 display: flex;
 -webkit-box-pack: justify;
 -ms-flex-pack: justify;
 justify-content: space-between;
 -ms-flex-wrap: wrap;
 flex-wrap: wrap;
 gap: 12px;
}
.p-anchor__item {
 width: calc(50% - 6px);
 position: relative;
}
.p-anchor__item a {
 /*background: #F6FFFB;*/
	background: #f5f5f5;
 border-radius: 3px;
 display: block;
 padding: 20px 8px 40px;
}
.p-anchor__item a:hover {
 text-decoration: none;
 opacity: 0.8;
}
.p-anchor__item-name {
 font-family: 'Josefin Sans';
 font-style: normal;
 font-weight: 500;
 font-size: 18px;
 letter-spacing: 0;
 line-height: 1;
 text-align: center;
 margin-bottom: 8px;
}
.p-anchor__item::after {
 border-bottom: 2px solid #a9a9a9;
 border-right: 2px solid #a9a9a9;
 width: 10px;
 height: 10px;
 position: absolute;
 content: '';
 bottom: 16px;
 left: 50%;
 transform: translateX(-50%) rotate(45deg);
}
.p-anchor02 {
 display: -webkit-box;
 display: -ms-flexbox;
 display: flex;
 -webkit-box-pack: justify;
 -ms-flex-pack: justify;
 justify-content: space-between;
 -ms-flex-wrap: wrap;
 flex-wrap: wrap;
 gap: 12px;
}
.p-anchor__btn01 a {
 color: #333;
 font-size: 15px;
 font-weight: 500;
 background: transparent;
 padding: 12px 15px;
 border: 2px solid #333;
 position: relative;
 z-index: 1;
 transition: .3s;
 display: block;
 margin: 50px auto 10px;
 width: 100%;
 text-align: center;
}
.p-anchor__btn01 a::before {
 content: "";
 width: 100%;
 height: 100%;
 position: absolute;
 top: 0;
 left: 0;
 z-index: -1;
 /*background: #35C5BC;*/
	background: #f6b573;
 transform-origin: 100% 50%;
 transform: scaleX(0);
 transition: transform ease .3s;
}
.p-anchor__btn01 a::after {
 content: '';
 position: absolute;
 top: 0;
 bottom: 0;
 right: 4%;
 width: 9px;
 height: 9px;
 margin: auto;
 border-top: 2px solid #333;
 border-right: 2px solid #333;
 transform: rotate(45deg);
 transition: .2s;
 box-sizing: border-box;
}
.p-anchor__btn01 a span {
 font-family: 'Josefin Sans';
}
.p-anchor__btn01 a:hover, .p-anchor__btn01 a:active {
 /*color: #fff;*/
 text-decoration: none;
}
.p-anchor__btn01 a:hover::before, .p-anchor__btn01a:active::before {
 transform-origin: 0% 50%;
 transform: scaleX(1);
}
.p-anchor__btn01 a:hover::after, .p-anchor__btn01 a:active::after {
 border-top: 2px solid #333;
 border-right: 2px solid #333;
}
@media screen and (min-width:768px) {
	.p-anchor__btn01 a {
 color: #333;
 font-size: 15px;
 font-weight: 500;
 background: transparent;
 padding: 5px 15px;
 border: 2px solid #333;
 position: relative;
 z-index: 1;
 transition: .3s;
 display: block;
 margin: 60px auto 30px;
 width: 100%;
 text-align: center;
	border-radius: 10px;
 }
}
.p-anchor__btn02 {
 margin: 20px auto 30px;
 text-align: center;
 vertical-align: middle;
 height: auto;
}
.p-anchor__btn02 a {
 width: 100%;
 height: 100%;
 /*background-color: #e2a6b4;*/
 border: 2px solid #333;
 /*border-radius: 50px;
  box-shadow: #333 3px 4px 0 0;*/
 color: #333;
 cursor: pointer;
 display: inline-block;
 text-align: center;
 text-decoration: none;
 user-select: none;
 touch-action: manipulation;
 font-size: 16px;
 font-weight: 500;
 padding: 10px auto;
 position: relative;
 transition: all .3s;
 opacity: 1;
 font-family: 'Noto Sans JP';
 white-space: nowrap;
}
.p-anchor__btn02 a span {
 font-family: 'Josefin Sans';
}
.p-anchor__btn02 a::before {
 border-left: 10px solid transparent;
 border-right: 10px solid transparent;
 border-top: 15px solid #333;
 bottom: 0;
 content: "";
 height: 0;
 margin: auto;
 position: absolute;
 right: 10%;
 top: 0;
}
.p-anchor__btn02 a:hover {
 background-color: #e2a6b4;
 color: #fff;
 text-decoration: none;
 opacity: 1;
 box-shadow: 0 0;
 transform: translate(3px, 4px);
}
.p-anchor__btn02 a:hover::before {
 border-top: 15px solid #fff;
}
.p-anchor__btn02 a:active {
 box-shadow: 0 0;
 transform: translate(3px, 3px);
 text-decoration: none;
}
.p-anchor__btn03 a {
 position: relative;
 display: block;
 width: 100%;
 padding: 12px 0;
 background-color: #fff;
 font-size: 15px;
 font-weight: 500;
 color: #333;
 border: 1px solid #333;
 line-height: 1.6;
 text-decoration: none;
 text-align: center;
 transition: .2s;
 box-sizing: border-box;
 margin: 40px auto 10px;
 border-radius: 30px;
}
.p-anchor__btn03 a::after {
 content: '';
 position: absolute;
 top: 0;
 bottom: 0;
 right: 20px;
 width: 9px;
 height: 9px;
 margin: auto;
 border-top: 2px solid #333;
 border-right: 2px solid #333;
 transform: rotate(45deg);
 transition: .2s;
 box-sizing: border-box;
}
.p-anchor__btn03 a span {
 font-family: 'Josefin Sans';
}
/* スライドする背景色のスタイル */
.btn-slide-horizontal a {
 /*border: 2px solid #35C5BC;*/
 /*border: 1px solid #333;*/
 z-index: 1;
}
.btn-slide-horizontal a::before {
 content: '';
 position: absolute;
 top: 0;
 bottom: 0;
 left: 0;
 right: 0;
 background: #fff;
 transform-origin: right top;
 transform: scaleX(0);
 transition: transform .2s ease;
 z-index: -1;
}
/* ホバー時のスタイル */
.btn-slide-horizontal a:hover {
 color: #fff;
}
.btn-slide-horizontal a:hover::before {
 transform-origin: left top;
 transform: scaleX(1);
 background: #319ac4;
 border-radius: 30px;
}
.btn-slide-horizontal a:hover::after {
 border-top: 2px solid #fff;
 border-right: 2px solid #fff;
}
@media screen and (min-width:768px) {
 .p-anchor__btn01 a {
  width: 70%;
  font-size: 18px;
  padding: 18px 30px;
 }
 .p-anchor__btn01 a::after {
  right: 20px;
 }
 .p-anchor__btn02 {
  margin: 80px auto 30px;
 }
 .p-anchor__btn02 a {
  width: 80%;
  font-size: 20px;
  height: 100%;
  font-size: 20px;
  line-height: 40px;
 }
 .p-anchor__btn02 a::before {
  bottom: 0;
  content: "";
  height: 0;
  margin: auto;
  position: absolute;
  right: 160px;
  top: 0;
 }
 .p-anchor__btn03 {
  margin: 80px auto 30px;
  width: 85%;
  font-weight: 700;
 }
 .p-anchor__btn03 a {
  font-size: 20px;
  border: 2px solid #333;
 }
 .p-anchor__btn03 a::after {
  width: 14px;
  height: 14px;
  right: 70px;
 }
 .btn-slide-horizontal a {
  border: 2px solid #333;
 }
}
.p-anchor02__item {
 width: calc(50% - 6px);
 position: relative;
 /*background: #F6FFFB;*/
 border: 1px dotted #a9a9a9;
 border-radius: 10px;
 display: block;
 padding: 20px 5px 10px;
 text-align: center;
}
.p-anchor__btn {
 margin: 10px auto 10px;
 text-align: center;
 width: 90%;
 vertical-align: middle;
}
.p-anchor__btn a {
 width: 100%;
 background: #fff;
 border: 1px solid #333;
 border-radius: 30px;
 box-shadow: 3px 3px 0 #666;
 cursor: pointer;
 display: inline-block;
 text-decoration: none;
 user-select: none;
 touch-action: manipulation;
 font-weight: 500;
 padding: 8px;
 position: relative;
 transition: all .3s;
 opacity: 1;
}
.p-anchor__btn a::before {
 content: '';
 width: 0;
 height: 0;
 border-style: solid;
 border-width: 5px 0 5px 9px;
 border-color: transparent transparent transparent #333333;
 margin: auto;
 position: absolute;
 top: 50%;
 right: 10%;
 transform: translateY(-50%);
}
.p-anchor__btn a:hover {
 text-decoration: none;
 opacity: 1;
 box-shadow: 0 0;
 transform: translate(3px, 3px);
}
.p-anchor__btn a:active {
 box-shadow: 0 0;
 transform: translate(3px, 3px);
 text-decoration: none;
 text-shadow: none;
}
.p-anchor02__item-name {
 font-family: 'Josefin Sans';
 font-style: normal;
 font-weight: 500;
 font-size: 18px;
 letter-spacing: 0;
 line-height: 1;
 text-align: center;
 margin-bottom: 8px;
}
/*
.p-anchor02__item::after {
  border-bottom: 2px solid #a9a9a9;
  border-right: 2px solid #a9a9a9;
  width: 10px;
  height: 10px;
  position: absolute;
  content: '';
  bottom: 16px;
  left: 50%;
  transform: translateX(-50%) rotate(45deg);
}
*/
@media screen and (min-width:768px) {
 .p-anchor {
  max-width: 970px;
  margin: 0 auto;
 }
 .p-anchor__item {
  width: calc(25% - 12px);
 }
 .p-anchor__item a {
  padding: 24px 8px 40px;
 }
 .p-anchor__item::after {
  width: 12px;
  height: 12px;
 }
 /*--2024/02/20 add--*/
 .p-anchor02 {
  max-width: 970px;
  margin: 0 auto;
 }
 .p-anchor02__item {
  width: calc(25% - 12px);
  border: 2px dashed #a9a9a9;
  padding: 35px 8px 10px;
 }
 /*
  .p-anchor02__item a {
    padding: 24px 8px 40px;
  }
  */
 /* 
  .p-anchor02__item::after {
    width: 12px;
    height: 12px;
  }  
 */
 .p-anchor__btn a {
  margin: 15px auto 5px;
  border: 2px solid #333;
 }
 .p-anchor__btn a::before {
  border-width: 6.5px 0 6.5px 12px;
  right: 20px;
 }
}
/* article */
.c-article {
 /*padding: 20px 3.2% 40px;*/
	padding: 20px 3.2% 30px;
 margin: 0;
 /*border-top: 15px solid #F4F4F4;*/
}
@media screen and (min-width:768px) {
	.c-article {
 padding: 20px 3.2% 0;
 margin-bottom: -60px!important;
 /*border-top: 15px solid #F4F4F4;*/
 }
}
hr {
 border: 0;
 height: 10px;
 border-top: 1px solid #777;
 background-image: repeating-linear-gradient(45deg, #777 0px, #777 1px, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 50%);
 background-size: 8px 8px;
}
.c-article__title {
 font-family: 'Josefin Sans';
 font-style: normal;
 font-weight: 500;
 font-size: 28px;
 letter-spacing: 0;
 line-height: 1;
 text-align: center;
 position: relative;
 padding: 0 0 20px;
 margin: 30px 0 16px;
}
.c-article__title::after {
 position: absolute;
 content: "";
 width: 50px;
 height: 2px;
 background-color: #35C5BC;
 bottom: 0;
 left: 50%;
 transform: translateX(-50%);
}
.c-article__title_classic {
 font-family: 'Josefin Sans';
 font-style: normal;
 font-weight: 500;
 font-size: 30px;
 letter-spacing: 0;
 line-height: 1;
 text-align: center;
 position: relative;
 padding: 0 0 20px;
 margin: 30px 0 16px;
 color: #d23150;
 white-space: nowrap;
}
.c-article__title_newwave {
 font-family: 'Josefin Sans';
 font-style: normal;
 font-weight: 500;
 font-size: 30px;
 letter-spacing: 0;
 line-height: 1;
 text-align: center;
 position: relative;
 padding: 0 0 20px;
 margin: 30px 0 16px;
 color: #746fb2;
 white-space: nowrap;
}
.c-article__title_outdoor {
 font-family: 'Josefin Sans';
 font-style: normal;
 font-weight: 500;
 font-size: 30px;
 letter-spacing: 0;
 line-height: 1;
 text-align: center;
 position: relative;
 padding: 0 0 20px;
 margin: 30px 0 16px;
 color: #f78d00;
 white-space: nowrap;
}
.c-article__title_classic span, .c-article__title_newwave span, .c-article__title_outdoor span {
 font-size: 70%;
 display: block;
 margin-top: 15px;
}
.c-article__inner {}
.c-article__outline {}
.c-article__price {
 color: #5B5B5B;
 font-family: 'Noto Sans JP';
 font-style: normal;
 font-weight: 700;
 font-size: 16px;
 text-align: center;
}
.c-article__text {
 font-family: 'Noto Sans JP';
 font-style: normal;
 font-weight: 500;
 font-size: 15px;
 line-height: 1.8;
 margin: 26px 10px 0;
 text-align: justify;
}
.c-article__image {
 margin-top: 30px;
}
.c-article__image a {
 text-decoration: none;
}
.c-article__image figcaption {
 color: #a9a9a9;
 font-family: 'Noto Sans JP';
 font-style: normal;
 font-weight: 400;
 font-size: 12px;
 letter-spacing: 0;
 line-height: 17px;
 text-align: center;
 margin-top: 8px;
}
.c-article__product {
 margin-top: 40px;
}
.c-article__items {
 display: -webkit-box;
 display: -ms-flexbox;
 display: flex;
 -webkit-box-pack: center;
 -ms-flex-pack: center;
 justify-content: center;
 -ms-flex-wrap: wrap;
 flex-wrap: wrap;
 gap: 12px;
 margin: 0 -2%;
}
.c-article__item {
 width: calc(50% - 10px);
 margin-bottom: 20px;
}
.c-article__item a {
 display: block;
}
.c-article__item a:hover {
 text-decoration: none;
}
.c-article__item-image {
 order: 2;
}
.c-article__item-image figcaption {
 color: #a9a9a9;
 font-family: 'Noto Sans JP';
 font-style: normal;
 font-weight: 400;
 font-size: 12px;
 letter-spacing: 0;
 line-height: 17px;
 text-align: center;
 margin-top: 4px;
}
.c-article__item-price {
 font-family: 'Noto Sans JP';
 font-style: normal;
 font-weight: 700;
 font-size: 14px;
 letter-spacing: 0;
 line-height: 20px;
 text-align: center;
 color: #5B5B5B;
 margin-top: 5px;
}
.c-article__item-price span {
 font-size: 11px;
}
.c-article__button {
 text-align: center;
 margin-top: 40px;
}
.c-article__button a {
 border: 2px solid #333;
 border-radius: 3px;
 font-family: 'Noto Sans JP';
 font-style: normal;
 font-weight: 400;
 font-size: 16px;
 line-height: 22px;
 letter-spacing: 0;
 padding: 15px 30px;
 position: relative;
}
.c-article__button a::after {
 border-bottom: 2px solid #333;
 border-right: 2px solid #333;
 width: 8px;
 height: 8px;
 position: absolute;
 content: '';
 top: 51%;
 /*right: 12px;*/
 right: 6%;
 transform: translateY(-50%) rotate(-45deg);
}
.c-article__button a:hover {
 color: #fff;
 text-decoration: none;
 background-color: #35C5C0;
 border: 2px solid #35C5C0;
}
.c-article__button a:hover::after {
 border-color: #fff;
}
.c-article__button.classic a:hover {
 color: #fff;
 text-decoration: none;
 background-color: #d23150;
 border: 2px solid #d23150;
}
.c-article__button.newwave a:hover {
 color: #fff;
 text-decoration: none;
 background-color: #746fb2;
 border: 2px solid #746fb2;
}
.c-article__button.outdoor a:hover {
 color: #fff;
 text-decoration: none;
 background-color: #f78d00;
 border: 2px solid #f78d00;
}
.c-article__table {
 margin: 20px 0 50px;
 order: 3;
}
.c-article__table table {
 position: relative;
 width: 90%;
}
.c-article__table table td {
 padding: 4px 0;
 text-align: left;
 white-space: nowrap;
}
.c-article__table table td a {
 text-decoration: underline;
}
.c-article__table table td:first-child {
 width: 15%;
}
@media screen and (min-width:768px) {
 .c-article {
  padding: 80px 0 110px;
  /*max-width: 926px;*/
  max-width: 950px;
  margin: 0 auto;
 }
 #classic.c-article {
  border: 0;
  margin-top: 40px;
 }
 .c-article__inner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
  -ms-flex-direction: row-reverse;
  flex-direction: row-reverse;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
 }
 .c-article__outline {
  display: block;
  order: 2;
  /*width: calc(52.9% - 12%);*/
  width: calc(65% - 8%);
 }
 .c-article__title {
  text-align: left;
  padding: 0 0 22px;
  margin: 0 0 20px;
 }
 .c-article__title::after {
  left: 0;
  transform: none;
 }
 .c-article__title_classic {
  font-size: 38px;
  text-align: left;
 }
 .c-article__title_newwave {
  font-size: 38px;
  text-align: left;
 }
 .c-article__title_outdoor {
  font-size: 38px;
  text-align: left;
 }
 .c-article__title_classic span, .c-article__title_newwave span, .c-article__title_outdoor span {
  font-size: 60%;
 }
 .c-article__price {
  text-align: left;
  font-weight: 700;
  font-size: 20px;
  line-height: 29px;
 }
 .c-article__text {
  font-size: 16px;
  margin: 45px 0 0;
  text-align: left;
 }
 .c-article__image {
  order: 1;
  width: 43%;
 }
 .c-article__product {
  margin-top: 72px;
 }
 .c-article__items {
  flex-wrap: nowrap;
  justify-content: space-between;
  gap: 44px;
 }
 .c-article__item {
  width: calc(100% / 3);
 }
 .c-article__item img {
  width: 100%;
 }
 .c-article__item-price {
  margin-top: 10px;
 }
 .c-article__item-price span {
  font-size: 11px;
 }
 .c-article__button {
  margin-top: 80px;
 }
 .c-article__button a {
  font-size: 18px;
  padding: 15px 30px;
  /*width: 248px;*/
  width: 350px;
 }
 .c-article__table {
  display: block;
  margin: 90px 0 50px 0;
  order: 2;
 }
 .c-article__table table {}
 .c-article__table table td {
  padding: 6px;
  text-align: left;
 }
}
/* is-animated */
.p-mv__image.is-animated, .p-anchor__item.is-animated, .c-article__main.is-animated, .c-article__product.is-animated, .lineup__menu.is-animated {
 -webkit-transform: translateY(0);
 transform: translateY(0);
 opacity: 1;
}
.p-mv__image, .p-anchor__item, .c-article__main, .c-article__product, .lineup__menu {
 -webkit-transform: translateY(50px);
 transform: translateY(50px);
 opacity: 0;
 -webkit-transition-delay: 0s;
 transition-delay: 0s;
 -webkit-transition-duration: .6s;
 transition-duration: .6s;
 -webkit-transition-property: opacity, -webkit-transform;
 transition-property: opacity, -webkit-transform;
 transition-property: opacity, transform;
 transition-property: opacity, transform, -webkit-transform;
 -webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
 transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
/* utility */
.u-d-b--pc {
 display: none!important;
}
@media screen and (min-width:768px) {
 .u-d-n--pc {
  display: none!important;
 }
 .u-d-b--pc {
  display: block!important;
 }
}
/* RECOMMEND */
.c-recommend {
 margin: 10px auto 40px;
 padding: 40px 0 30px;
 /*background: #fffff1;*/
	background: #f8f8f8;
 position: relative;
 text-align: center;
}
.c-recommend__text {
 text-align: center;
 font-size: 16px;
 display: block;
 line-height: 2.2;
 letter-spacing: 0.03em;
}
.c-recommend__p {
 font-family: 'Noto Sans JP';
 font-style: normal;
 font-weight: 400;
 font-size: 11px;
 letter-spacing: 0.03em;
 text-align: justify;
}
@media screen and (min-width:768px) {
 .c-recommend {
  padding: 40px 0 80px;
 }
 .c-recommend__text {
  font-size: 18px;
  margin-bottom: 44px;
 }
 .c-recommend__p {
  font-size: 16px;
  line-height: 2.2;
 }
}
.lineup__menu {
 flex-direction: column;
 flex-wrap: nowrap;
 margin: 40px auto 10px;
 text-align: center;
}
.lineup__menu > li > a {
 margin: 30px auto;
 border: 2px solid #333;
 border-radius: 30px;
 padding: 16px 14px;
 position: relative;
 display: grid;
 grid-template-columns: 70px auto;
 align-items: center;
 column-gap: 12px;
 background: #fff url("/lp/sunglasslp/img/icon-right.png") center right 16px/17px auto no-repeat;
 box-shadow: 3px 3px 0 #333;
 transition: all .3s;
 text-align: left;
 width: calc(100% - 50px);
}
.lineup__menu > li > a:before {
 content: "";
 position: absolute;
 inset: 7px 55px 7px auto;
 width: 2px;
 background-color: #333
}
.lineup__menu > li > a:hover {
 box-shadow: 0 0;
 transform: translate(3px, 3px);
 opacity: 1;
 color: #333;
 text-decoration: none;
}
.lineup__menu > li > a:active {
 box-shadow: 0 0;
 transform: translate(3px, 3px);
 opacity: 1;
 color: #333;
 text-decoration: none;
}
.lineup__menu-title {
 font-size: 20px;
 font-weight: 400;
 letter-spacing: .04em;
 /*width: 100%;*/
 white-space: nowrap;
}
.lineup__menu-title span {
 border-bottom: solid 1px #333;
}
.lineup__menu-title small {
 font-size: 12px;
 letter-spacing: .1em;
 display: block;
 white-space: nowrap;
}
@media screen and (min-width:768px) {
 .lineup__menu {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 20px;
  width: 100%;
 }
 .lineup__menu > li > a {
  border: 2px solid #000;
  border-radius: 30px;
  padding: 22px 14px;
  position: relative;
  display: grid;
  grid-template-columns: 250px auto;
  align-items: center;
  column-gap: 12px;
  background: #fff url("/lp/sunglasslp/img/icon-right.png") center right 13px/14px auto no-repeat;
  box-shadow: 7px 7px 0 #333;
  width: calc(100% - 7px);
  transition: all .3s;
  text-align: left;
 }
 .lineup__menu > li > a:before {
  inset: 7px 39px 7px auto;
 }
 .lineup__menu-title {
  font-size: 21px;
 }
 .lineup__menu-title small {
  font-size: 13px;
 }
}
/* link */
.c-article.link__btn a {
 color: #333;
 font-size: 15px;
 font-weight: 500;
 background: transparent;
 padding: 18px 15px;
 border: 2px solid #333;
 position: relative;
 z-index: 1;
 transition: .3s;
 display: block;
 margin: 60px auto 30px;
 width: 100%;
 text-align: center;
}
.c-article.link__btn a::before {
 content: "";
 width: 100%;
 height: 100%;
 position: absolute;
 top: 0;
 left: 0;
 z-index: -1;
 background: #35C5BC;
 transform-origin: 100% 50%;
 transform: scaleX(0);
 transition: transform ease .3s;
}
.c-article.link__btn a::after {
 content: '';
 position: absolute;
 top: 0;
 bottom: 0;
 right: 4%;
 width: 9px;
 height: 9px;
 margin: auto;
 border-top: 2px solid #333;
 border-right: 2px solid #333;
 transform: rotate(45deg);
 transition: .2s;
 box-sizing: border-box;
}
.c-article.link__btn a span {
 font-family: 'Josefin Sans';
}
.c-article.link__btn a:hover, .c-article.link__btn a:active {
 color: #fff;
 text-decoration: none;
}
.c-article.link__btn a:hover::before, .c-article.link__btn a:active::before {
 transform-origin: 0% 50%;
 transform: scaleX(1);
}
.c-article.link__btn a:hover::after, .c-article.link__btn a:active::after {
 border-top: 2px solid #fff;
 border-right: 2px solid #fff;
}
@media screen and (min-width:768px) {
 .c-article.link__btn a {
  width: 70%;
  font-size: 18px;
  padding: 18px 30px;
 }
 .c-article.link__btn a::after {
  right: 20px;
 }
}
/* SWIPER SLIDE */
.swiper-slide {
 height: auto;
 margin: 20px auto 30px;
 width: 100%;
}
.swiper .swiper-wrapper {
 transition-timing-function: linear;
}
.swiper__img {
 height: 8.75rem !important;
 width: 18.125rem !important;
}
.swiper__img img {
 /*aspect-ratio: 290/140;*/
 /*aspect-ratio: 190/70;*/
 height: auto;
 width: 100%;
 object-fit: cover;
 aspect-ratio: 2;
}
.top-frame {
 margin-top: 4.00625rem;
}
.frame__slider {
 margin: 1.53125rem auto 0;
 max-width: 60rem;
}
.frame-title {
 font-weight: 400;
 color: #fff;
 display: flex;
 flex-direction: column;
 justify-content: center;
 align-items: center;
 border-radius: 50px;
 background-color: #3E70AD;
 padding: 10px;
 width: 90%;
 margin: 20px auto;
 text-align: center;
}
@media screen and (min-width:768px) {
 .frame-title {
  width: 50%;
 }
}