@charset "UTF-8";

.main img{
  vertical-align: top;
}

.main .bg01{
  background-color: #070708;
}
.main .bg02{
  background-color: #d4e1f9;
}
.main .pdt1px{
  padding-top: 1px;
}
.main .pdt005{
  padding-top: 0.5%;
}
.main .mgt005{
  margin-top: 0.5%;
}
.main .shrink0{
  flex-shrink: 0;
}


/* タブ */
.main [data-pagearea]{
  display: none;
}
.main [data-pagearea].selected{
  display: block;
}



/* 商品 */
.main .ttl_row{
  display: flex; align-items: flex-start; justify-content: center; gap: 0 1em;
  font-weight: bold; text-align: center;
}
.main .ttl_left,
.main .ttl_right{
  width: 1.37em;
}
.main .ttl_price{
  font-weight: bold; text-align: center;
}
.main .item_box{
  display: grid; grid-template-columns: calc(416/768*100%) calc(294/768*100%); gap: 0 2%; justify-content: center; align-items: flex-end;
}
.main .item_name{
  font-weight: bold; margin: 0 0 0.5em;
}
.main .item_bar{
  height: 2px; margin: 0 auto;
  background-image: linear-gradient(to right, #373737 min(calc(2/768*100vw), 2px), transparent min(calc(2/768*100vw), 2px));
  background-size: min(calc(6/768*100vw), 6px) min(calc(2/768*100vw), 2px);
  background-repeat: repeat-x;
}
.main .item_icon01{
  display: flex; align-items: center; color: #fff; line-height: 1; background-color: #000; padding: 0.3em 1em;
  border-radius: 1em;
}
.main .item_desc{
  font-weight: bold; margin: 0.75em 0 0;
}
.main .item_like_row{
  display: flex; justify-content: flex-end; margin: 0 4% 0 0;
}
.main .item_main{
  display: flex; flex-direction: column; align-items: center;
  width: min( calc(290/768*100vw), 290px); margin: 0 auto;
}
.main .item_more{
  line-height: 1.2; padding: 0 0.6em; margin: 6% 0 0;
}
.main .item_cart{
  margin:  6% 0 0;
}


/* ナビ */
.main .nav_wrap{
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.2em 3%; margin: 0 0 8%;
}
.main .nav{
  cursor: pointer;
}
.main .nav_fig{
  position: relative; z-index: 0; text-align: center; padding: 12% 0;
  
}
.main .nav_fig::before{
  content: ""; position: absolute; z-index: 0; top: 0; right: 0; bottom: 0; left: 0; 
  border-style: solid; border-color: #b7b7b7; border-width: min(calc(3/768*100vw), 3px);;
}
.main .nav.selected .nav_fig::before{
  border-color: #c75b79;
}

.main .nav_img{
  width: calc(110/138*100%);
}

.main .nav_icon{
  color: #fff; font-weight: 400; line-height: 1.2; background-color: #b7b7b7; text-align: center;
}
.main .nav_icon.ver_adjust{
  opacity: 0;
}
.main .nav.selected .nav_icon{
  background-color: #c75b79;
}
.main .nav_name{
  color: #b7b7b7; font-weight: bold; line-height: 1.2; text-align: center; margin: 0.25em 0 0;
}
.main .nav.selected .nav_name{
  color: #000;
}

/* セレクトボックス */
.main .selectColorWrap select {
  width: 100%; max-width: 100%; background-color: #fff;
}

/* 表示非表示 */
[data-selectarea01]{ display: none; }
[data-selectarea01].selected{ display: block; }
[data-selectarea02]{ display: none; }
[data-selectarea02].selected{ display: block; }
[data-selectarea03]{ display: none; }
[data-selectarea03].selected{ display: block; }
[data-selectarea04]{ display: none; }
[data-selectarea04].selected{ display: block; }


.main .point{
  width: calc(693/768*100%); margin: 0 auto;
}
.main .size{
  width: calc(734/768*100%); margin: 0 auto;
}

/* トップへ戻る */
.main .totop_wrap{
  display: flex; justify-content: flex-end; margin: 0 4% 0 0;
}
.main .totop{
  display: flex; align-items: center; gap: 0 0.3em;
  color: #C4007F; cursor: pointer;
  border-style: solid; border-color: #C4007F; border-width: 0 0 1px;
}
.main .totop::before{
  content: ""; width: 1em; height: 0.75em; background-color: #C4007F;
  clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
}


/* .main .size_table{
  background-color: #fff; padding: 3% 0;
  border-style: solid; border-color: #dcdcdc; border-width: 1px 0;
}
.main .size_table_fig{
  width: min( calc(721/768*100%), 721px); margin: 0 auto;
} */


/* サイズ等 */
/* .main .item_note{
  display: flex; flex-direction: column; gap: 1em 0;
  line-height: 1.5; letter-spacing: 0;
  position: relative; z-index: 1;
}
.main .item_note_row{
  display: flex; flex-wrap: wrap; align-items: center; gap: 0.5em 1em;
}
.main .item_note_l{
  flex-shrink: 0;
  width: 5em; text-align: center; background-color: #fff; margin: -0.1em 0 0;
  border-style: solid; border-color: #d2d2d2; border-width: 1px 1px;
}
.main .item_note_l02{
  flex-shrink: 0;
}
.main .item_note_r{
  display: flex; flex-wrap: wrap;
}
.main .item_note_r02{
  margin: auto 0 auto auto;
}
.main .item_note_size{
  color: inherit; text-decoration: underline;
}
.main .item_note_chui{
	position: relative; color: #333; text-decoration: underline; padding: 0 0 0 1.5em;
}
.main .item_note_chui::before,
.main .item_note_chui::after{
	content: ""; position: absolute;
}
.main .item_note_chui::before{
	top: 0.15em; left: 0; width: 1em; height: 1em; background: #fff; border: 1px solid #000; border-radius: 50%;
}
.main .item_note_chui::after{
	top: 0.5em; left: 0.5em; width: 0.4em; height: 0.45em; background-color: #333;
  clip-path: polygon(0 0, 0% 100%, 100% 50%);
} */
/* .main .item_note_add{
  text-indent: -1em; padding: 0 0 0 1em;
} */


/* ファッション　モーダル */
.main .js_fashion_modal .modal_modmicro_overlay{
  padding: 20px 0;
}
@media screen and (768px <= width) {
	.main .js_fashion_modal .modal_modmicro_overlay{
		padding: 20px 20px;
	}
}
.main .js_fashion_modal .swiper{
	--swiper-pagination-bullet-inactive-color: #b4b4b4;
	--swiper-pagination-color: #000;
	padding: 0 0 10px;
}
.main .js_fashion_modal .modal_modmicro_container{
	max-width: 800px;
}
.main .js_fashion_modal .swiper-slide{
	text-align: center;
}
.main .js_fashion_modal .swiper-slide img{
  width: 100%; max-width: none;
}
.main .js_fashion_modal .swiper-pagination {
	position: static; margin: 10px 0 0;
}
.main .js_fashion_modal .swiper-button-next,
.main .js_fashion_modal .swiper-button-prev{
	display: none;
}
@media screen and (992px <= width) {
	.main .js_fashion_modal .swiper-button-next,
  .main .js_fashion_modal .swiper-button-prev{
		display: block; color: #000;
	}
}
