@charset "utf-8";
.freepage { color: #000; font-family: "游ゴシック体", "游ゴシック", "Yu Gothic", YuGothic, sans-serif; background-color: #FFFFFF; overflow: hidden;}
.freepage .op_aya23s_body { max-width: 1366px; margin: auto;}
.freepage h2 { margin: 0; padding: 0; background-color:  transparent;}
.freepage h2:after { display: none;}
.freepage .en { font-family: "Neue Haas Grotesk","Helvetica", "San Francisco","游ゴシック体", "游ゴシック", "Yu Gothic", YuGothic, sans-serif;}
html { scroll-behavior: smooth;}
/* SP ONLY */
@media only screen and (max-width: 767px) {
  .freepage .pc { display: none !important;}
  .freepage #mv { margin-top: -63px; padding-top: 63px;}
}
/* PC ONLY */
@media only screen and (min-width: 768px) {
  .freepage .sp { display: none !important;}
}
/* main */
.main_slide {
  position: relative;
}
.mv_slide_txt {
  position: absolute;
  z-index: 1;
  top: 100px;
  left: 50%;
  transform: translateX(-50%);
  margin: 0;
  padding: 0;
  width: 100%;
  text-align: center;
  padding: 0 20px;
}
.allstyles {
  font-weight: bold;
  font-size: 12px;
  text-decoration: underline;
  color: #909090;
  letter-spacing: 0.014em;
  bottom: 15px;
  right: 15px;
  position: absolute;
}
.main_slide .bx-controls {
  position: absolute;
  bottom: 60px;
  right: 20px;
}
.main_slide .bx-wrapper {
  position: relative;
  z-index: 0;
}
.main_slide .bx-pager-item a {
	display: block;
	width: 8px;
	height: 8px;
	text-indent: -9999px;
	margin: 0;
	background-color: #fff;
	border-radius: 50%;
}
.main_slide .bx-pager-item + .bx-pager-item {
	margin-top: 22px;
}
.main_slide .bx-pager-item a.active {
	background-color: #909090;
}
.mv_lead_txt {
  font-size: 15px;
  text-align: center;
  color: #707070;
  margin: 30px 0 0;
  line-height: 2;
}
@media only screen and (min-width: 768px) {
  .mv_slide_txt {
    top: 50%;
    transform: translate(-50%,-50%);
    padding: 0;
  }
  .allstyles {
    font-size: 14px;
    right: 108px;
  }
  .main_slide .bx-controls {
    bottom: 53px;
    right: 112px;
  }
  .mv_lead_txt {
    font-size: 16px;
    margin: 26px 0 0;
    padding: 0;
  }
}
/*
sec_rashguard
*/
.sec_rashguard {
  padding: 0 0 63px;
}
@media only screen and (min-width: 768px) {
  .sec_rashguard {
    padding: 0 0 97px;
  }
}
/* black */
/* SP ONLY */
@media only screen and (max-width: 767px) {
  .black__inner {
    margin: 23px 0 38px;
  }
  .black__container-img1 {
    padding: 0 5.3vw 0 0;
    margin: 0 0 30px;
  }
  .black__container-img2 {
    padding: 0 0 0 5.3vw;
    margin: 0 0 30px;
    text-align: right;
  }
  .black__container-img3 {
    padding: 0 14.6vw 0 0;
    margin: 0 0 50px;
  }
  .black__container-img4 {
    padding: 0 0 0 29.8vw;
    text-align: right;
    position: relative;
    margin: 0 0 30px;
  }
  .black__container-img4::before {
    content: "";
    display: block;
    height: 82vw;
    width: 13vw;
    background: url(../img/black_rashguard_sp.png) no-repeat top left / contain;
    position: absolute;
    top: -20px;
    left: 5.3vw;
  }
  .iteminfo {
    padding: 0 4vw;
  }
}
@media only screen and (min-width: 768px) {
/* PC ONLY */
  .black__inner {
    margin: 115px 0 75px;
  }
  .freepage h2.black__ttl_rashguard {
    margin: 70px 0 0;
  }
  .black__container {  display: grid;
    grid-template-columns: 56% 30%;
    grid-template-rows: 1fr 1fr;
    gap: 4%;
    grid-auto-flow: row;
    grid-template-areas:
      "img2 img3"
      "item-info img1";
  }
  .black__container-img2 { grid-area: img2; }
  .black__container-img3 { grid-area: img3; }
  .black__container-img1 { grid-area: img1; }
  .iteminfo-box { grid-area: item-info; }

  .black__container-img1 {
    margin-top: -128px;
    width: 30vw;
    max-width: 414px;
  }
  .black__container-img2 {
    margin-top: 92px;
    width: 56vw;
    max-width: 770px;
  }
  .black__container-img3 {
    width: 23vw;
    max-width: 318px;
  }
  .black__container-img4 {
    width: 16vw;
    max-width: 222px;
  }
  .black__ttl_rashguard {
    width: 28vw;
    max-width: 384px;
  }
  .iteminfo-box {  
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-between;
    padding-left: 15%;
  }
}
/* iteminfo */
.iteminfo {
  font-family: "Neue Haas Grotesk","Helvetica", "San Francisco","游ゴシック体", "游ゴシック", "Yu Gothic", YuGothic, sans-serif;
}
.iteminfo__ttl {
  font-size: 15px;
  letter-spacing: -0.02em;
  font-weight: bold;
}
.iteminfo__list {
  font-weight: bold;
  letter-spacing: 0;
  line-height: 2;
}
.iteminfo__txt-name {
  font-size: 15px;
  text-indent: -0.8em;
  padding-left: 0.8em;
  line-height: 1.5;
}
.price_box {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.price_box.__small {
  font-size: 10px;
  max-width: 222px;
  flex-wrap: wrap;
}
.iteminfo__txt-indent {
  margin-left: 1em;
}
.price_box_wrap {
  max-width: 232px;
  margin: 10px 0 0;
  line-height: 1.2;
}
.iteminfo__txt-price {
  font-size: 16px;
}
.iteminfo__list {
  margin: 10px 0 0;
}
@media only screen and (min-width: 768px) {
  .iteminfo__ttl {
    font-size: 16px;
    letter-spacing: -0.015em;
  }
  .iteminfo__txt-name {
    font-size: 15px;
  }
  .price_box_wrap {
    margin: 20px 0 0;
    line-height: 2;
  }
  .iteminfo__list {
    margin: 30px 0 0;
  }
}
/* white */
.white__inner {
  max-width: 1134px;
  margin: auto;
}
.white__img-box1 {
  display: flex;
  gap: 0 8vw;
  padding: 0 5.3vw 0 0;
}
.white__img-box2 {
  margin: 30px 0;
  text-align: center;
}
.white__img-box3 {
  display: flex;
  gap: 0 5.6vw;
  justify-content: flex-end;
  margin: 0 0 29px;
}
.white__img-box3-2 {
  margin-top: 70px;
}
.white__img-box1-1,
.white__img-box1-2,
.white__img-box3-1,
.white__img-box3-2 {
  max-width: 366px;
}
@media only screen and (min-width: 768px) {
  .white__img-box1 {
    gap: 0 66px;
    padding: 0;
  }
  .white__img-box2 {
    margin: 66px auto;
  }
  .white__img-box3 {
    gap: 0 114px;
    margin: 0;
  }
  .white__img-box3-2 {
    margin-top: 0;
  }
  .white__img-box1-1,
  .white__img-box1-2,
  .white__img-box3-1,
  .white__img-box3-2 {
    width: 27vw;
  }
  .white__img-box2 {
    max-width: 846px;
    width: 62vw;
  }
}
/*
sec_surf
*/
.sec_surf .iteminfo,
.surf__ttl-inner {
  max-width: 1134px;
  margin: auto;
  position: relative;
  width: 100%;
}
.sec_surf .iteminfo__list,
.sec_surf .price_box_wrap {
  margin: 0;
}
.sec_surf .price_box_wrap {
  max-width: 242px;
}
/* SP ONLY */
@media only screen and (max-width: 767px) {
  .sec_surf {
    display: flex;
    flex-direction: column;
    margin: 0 0 80px;
  }
  .surf__ttl-img01 {
    order: 1;
  }
  .surf__ttl-box {
    order: 2;
  }
  .surf__ttl-img02 {
    order: 3;
  }
  .sec_surf .iteminfo {
    order: 4;
    margin: 30px 0 0;
  }
}
/* surf__ttl */
.surf__ttl-wrap {
  margin: auto;
}
.surf__ttl-box {
  display: flex;
  justify-content: space-between;
  flex-direction: column;
  gap: 22px;
  margin: -80px 0 28px;
  padding: 116px 5.3vw 10px;
  background-color: #E4E0DA;
}
.surf__ttl {
  max-width: 75vw;
}
.suf__ttl-txt {
  font-size: 12px;
  letter-spacing: 0;
  font-weight: 500;
  line-height: 1.8;
}
.surf__ttl-img01 {
  max-width: 88vw;
}
.surf__ttl-img02 {
  max-width: 87vw;
  margin: 0 0 0 auto;
}
@media only screen and (min-width: 768px) {
  .surf__ttl-wrap {
    margin: 40px calc(50% - 50vw) 138px;
    background: linear-gradient(180deg, #E4E0DA 0%, #E4E0DA 340px, #fff 340px, #fff 100%);
  }
  .surf__ttl {
    max-width: 592px;
  }
  .surf__ttl-img01 {
    max-width: 606px;
    position: absolute;
    bottom: 0;
    right: 0;
  }
  .surf__ttl-img02 {
    max-width: 365px;
    width: 26vw;
    margin: 0;
  }
  .surf__ttl-box {
    flex-direction: row;
    background-color: transparent;
    padding: 0;
    margin: 0;
  }
  .suf__ttl-txt {
    max-width: 447px;
    padding: 45px 0 0;
  }
}
/*
surftote
*/
.sec_surftote {
  position: relative;
}
.sec_surftote::before {
  content: "";
  display: block;
  background: #E4E0DA;
  width: 100vw;
  height: 340px;
  position: absolute;
  left: calc(50% - 50vw);
  top: 60%;
  transform: translateY(-50%);
}
.surftote_inner {
  max-width: 1134px;
  margin: auto;
}
.sec_surftote .iteminfo__list,
.sec_surftote .price_box_wrap {
  margin: 0;
}
.sec_surftote .iteminfo {
  position: relative;
  margin: 0 0 20px;
}
.iteminfo__txt-name.__over {
  position: absolute;
  bottom: -20px;
  left: 0.8em;
}
.surftote__contens-box {
  display: flex;
  position: relative;
  justify-content: space-between;
  align-items: flex-start;
}
.surftote__img01 {
  position: absolute;
  bottom: 0;
  max-width: 558px;
  margin-left: 96px;
  z-index: 2;
}
.surftote__img-box {
  max-width: 298px;
  width: 28vw;
  display: flex;
  flex-direction: column;
  gap: 66px 0;
  margin-right: 116px;
  position: relative;
}
.surftote__img-box::after {
  content: "";
  display: block;
  background-color: #E4E0DA;
  width: 100vw;
  height: 340px;
  position: absolute;
  bottom: 98px;
  left: calc(50% - 50vw);
  z-index: -1;
}
@media only screen and (max-width: 767px) {
  .sec_surftote .iteminfo {
    margin: 30px 0 60px;
  }
  .surftote__contens-box {
    flex-direction: column;
  }
  .surftote__img01 {
    position: static;
    margin-left: 0;
    width: 87vw;
  }
  .surftote__img-box {
    flex-direction: row;
    max-width: none;
    margin-left: 5.3vw;
    width: 100%;
    gap: 0 20px;
  }
  .surftote__img-box::after {
    height: 84vw;
  }
}
/*
ayakaneko
*/
.sec_ayakaneko {
  margin: 162px 0 125px;
}
.ak__inner {
  max-width: 879px;
  width: 100%;
  margin: auto;
}
.ak__box {
  display: flex;
  gap: 0 66px;
  justify-content: space-between;
}
.ak__box-img {
  max-width: 366px;
}
.ak__box-contents {
  max-width: 447px;
  font-size: 12px;
  line-height: 1.8;
  letter-spacing: 0;
}
.freepage h2.ak__box-ttl {
  margin: 0 0 24px;
  padding: 0 0 24px;
  border-bottom: 1px solid #707070 !important;
}
.ak__box-contents-txt {
  margin: 0 0 15px;
  padding: 0 0 15px;
  border-bottom: 1px solid #707070;
}
.ak__box-contents-txt p+p {
  margin: 15px 0 0;
}
.ak__box-contents .ak__box-contents-txt:last-of-type {
  border-bottom: none;
  margin: 0;
  padding: 0;
}
.ak__box-sns {
  font-weight: bold;
}
.ak__box-sns a {
  text-decoration: underline;
}
@media only screen and (max-width: 767px) {
  .sec_ayakaneko {
    margin: 100px 0;
  }
  .ak__box {
    flex-direction: column;
    align-items: center;
    gap: 30px 0;
  }
  .freepage h2.ak__box-ttl {
    text-align: center;
    margin: 0 0 20px;
    padding: 0 0 20px;
  }
  .freepage h2.ak__box-ttl img {
    width: 42vw;
  }
  .ak__box-contents {
    max-width: none;
    padding: 0 5.3vw 10px;
  }
  .ak__box-img {
    width: 66vw;
    margin: auto;
  }
  .ak__box-contents-txt p+p {
    margin: 9px 0 0;
  }
  .ak__box-sns {
    text-align: right;
  }
}
/*
allstyle
*/
.sec_allstyle {
  margin: 0 0 50px;
}
.freepage h2.allstyle__ttl {
  text-align: center;
  margin: 0 0 60px;
  font-size: 25px;
  letter-spacing: 0.05em;
  font-weight: bold;
}
.allstyle__list {
  display: flex;
  gap: 0 9px;
  max-width: 1143px;
  margin: auto;
}
.allstyle__list li {
 width: calc((100% - 27px) / 4);
}
.allstyle__list-iteminfo {
  font-weight: bold;
  font-size: 10px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: 10px 0 0;
  font-family: "Neue Haas Grotesk","Helvetica", "San Francisco","游ゴシック体", "游ゴシック", "Yu Gothic", YuGothic, sans-serif;
}
.allstyle__list-iteminfo-name {
  width: calc(100% - 80px);
}
.allstyle__list-iteminfo-price {
  width: 80px;
  text-align: right;
}
@media only screen and (max-width: 767px) {
  .sec_allstyle {
    margin: 0 0 77px;
  }
  .overflow_scroll {
    width: 100%;
    overflow-x: scroll;
  }
  .allstyle__list {
    width: 304vw;
    padding: 0 5.3vw;
  }
}
/*
pagetop
*/
.op_aya23s_pagetop {
  width: 100%;
  border: 1px solid #707070;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media only screen and (max-width: 767px) {
  .op_aya23s_pagetop-wrap {
    padding: 0 5.3vw;
  }
}
/*
footer
*/
.op_aya23s_footer {
  margin: 162px 0 0;
  padding: 0 0 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.op_aya23s_footer-txt {
  margin: 81px 0 0;
  font-size: 11px;
  color: #909090;
}
@media only screen and (max-width: 767px) {
  .op_aya23s_footer {
    margin: 60px 0 0;
    padding: 0 0 23px;
  }
  .op_aya23s_footer-txt {
    margin: 34px 0 0;
    font-size: 11px;
  }
}