@charset "utf-8";
/* ====================================================
foundation
==================================================== */
/* reset
----------------------- */
*, *::before, *::after {
	box-sizing: border-box;
}
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {
	margin:0;
	padding:0;
	border:0;
	outline:0;
	font-size:100%;
	vertical-align:baseline;
	background:transparent;
}
article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section {
	display:block;
}
ul {
	list-style:none;
}
blockquote, q {
	quotes:none;
}
blockquote:before, blockquote:after, q:before, q:after {
	content:'';
	content:none;
}
a {
	margin:0;
	padding:0;
	font-size:100%;
	vertical-align:baseline;
	background:transparent;
}
del {
	text-decoration: line-through;
}
abbr[title], dfn[title] {
	border-bottom:1px dotted;
	cursor:help;
}
table {
	border-collapse:collapse;
	border-spacing:0;
}
input, select {
	vertical-align:middle;
}

/* base
----------------------- */
:root {
	--color-wht: #fff;
	--color-blk: #000;
	--color-border: #ccc;
}
body {
	display: flex;
	flex-direction: column;
	position: relative;
	z-index: -1;
	width: 100%;
	min-height: 100vh;
	margin-left: auto;
	margin-right: auto;
	font-size: var(--BodyFontSize);
	font-weight: 400;
	color: var(--BodyFontColor);
	line-height: 1.75;
	-webkit-text-size-adjust: 100%;
	-webkit-font-smoothing: auto !important;
}

/* is-josefin */
.is-josefin .p-slide__btn a,
.is-josefin .c-btn,
.is-josefin .purchaseButton__btn,
.is-josefin .salesPeriodModal__btn,
.is-josefin .purchaseButtonModal__btn,
.is-josefin #contact .inquirySection .control-panel input#buttonLeave,
.is-josefin #contact #inquiryCompleteSection a,
.is-josefin .communityButton,
.is-josefin #MembershipPage .membership .link,
.is-josefin #MembershipPage .membership .edit {
	padding-top: 1.2em !important;
}
.is-josefin .header__logo a .logoText,
.is-josefin .lower__title,
.is-josefin .mailMagazineSubscribe_submit {
	padding-top: 0.3em !important;
}
.is-josefin .gnav__link,
.is-josefin .gnav__menu--child a,
.is-josefin .appsItemCategoryTag_child > a {
	padding: 10px 0 4px !important;
}


/* link */
a {
	word-break: break-all;
	color: var(--BodyLinkColor);
	text-decoration: none;
}

a:focus {
	outline: none;
}
@media (hover: hover) and (pointer: fine) {
	a:hover {
		opacity: 0.7;
		transition: opacity 0.4s ease;
		-webkit-backface-visibility:hidden;
				backface-visibility:hidden;
	}
}

/* image */
.p-thumb__listitem span {
	cursor: pointer;
}
.p-shopinfo__map iframe,
.img__wrap {
	overflow: hidden;
}
#MembershipPage .membership .reward-list .reward-card-list .reward-card a,
.p-thumb__listitem span,
.img__wrap a {
	display: block;
	position: relative;
}
#MembershipPage .membership .reward-list .reward-card-list .reward-card a::after,
.p-thumb__listitem span::after,
.img__wrap a::after {
	display: block;
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	transition: background-color 0.4s ease;
	-webkit-backface-visibility:hidden;
			backface-visibility:hidden;
}
@media (hover: hover) and (pointer: fine) {
	#MembershipPage .membership .reward-list .reward-card-list .reward-card a:hover,
	.p-thumb__listitem span:hover,
	.img__wrap a:hover {
		opacity: 1;
	}
	#MembershipPage .membership .reward-list .reward-card-list .reward-card a:hover::after,
	.p-thumb__listitem span:hover::after,
	.img__wrap a:hover::after {
		background-color: rgba(0, 0, 0, 0.3);
	}
}
.img__wrap img {
	width: 100%;
}
img {
	max-width: 100%;
	height: auto;
	vertical-align: bottom;
	border: 0;
}

/* svg */
.svg__data {
	fill: none;
	stroke-width: 2px;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke: var(--NavTextColor);
}
.bg-on .svg__data,
.is-scroll .svg__data,
.js-open .svg__data,
.l-header .l-gnav .svg__data {
	stroke: var(--NavTextColorBgOn);
}


/* form */
input,
select,
textarea,
button {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	margin-bottom: 0 !important;
	border: none;
	border-radius: 0;
	box-shadow: none !important;
	font: inherit;
	outline: none;
	font-family: inherit !important;
	font-size: 16px;
}
input,
select,
textarea {
	width: 100% !important;
	padding: 8px;
	background: var(--color-wht);
	border: 1px solid var(--color-border);
}
input:focus,
select:focus,
textarea:focus {
	outline: none;
	border: 1px solid var(--BodyFontColor);
}
textarea {
	resize: vertical;
}
button:focus {
	outline:0;
}
input::-webkit-input-placeholder {
	font-size: 14px !important;
	color: #bbb !important;
}
input::-moz-placeholder {
	font-size: 14px !important;
	color: #bbb !important;
}
input:-ms-input-placeholder {
	font-size: 14px !important;
	color: #bbb !important;
}
input::-ms-input-placeholder {
	font-size: 14px !important;
	color: #bbb !important;
}
input::placeholder {
	font-size: 14px !important;
	color: #bbb !important;
}


/* ====================================================
BASE Default
==================================================== */
/* itemCb
----------------------- */
.itemCb #cboxPrevious {
	background: url("https://thebase.com/i/controls.png") no-repeat 0 0;
	bottom: 0;
	height: 20px;
	left: 0;
	overflow: visible;
	text-indent: -9999px;
	width: 20px;
}
.itemCb #cboxNext {
	background: url("https://thebase.com/i/controls.png") no-repeat -22px 0;
	bottom: 0;
	height: 20px;
	left: 30px !important;
	overflow: visible;
	text-indent: -9999px;
	width: 20px;
}
.itemCb #cboxClose {
	background: url("https://thebase.com/i/controls.png") no-repeat -52px 0;
	height: 20px;
	overflow: visible;
	text-indent: -9999px;
	width: 20px;
}
.itemCb #cboxContent button {
	border: none;
}
.itemCb:focus {
	outline: none;
}
a.cboxElement:focus {
	outline: none;
}
.show {
	display: block !important;
}
.hide {
	display: none !important;
}
.overlayBackground {
	background-color: rgba(0, 0, 0, 0.5);
	cursor: pointer;
	display: none;
	height: 100%;
	left: 0;
	overflow: hidden;
	position: fixed;
	top: 0;
	width: 100%;
	z-index: 9999;
}
@font-face {
	font-family: "baseicon";
	font-style: normal;
	font-weight: normal;
	src: url("https://static.thebase.in/font/v1/baseicon.eot?317xhh");
	src: url("https://static.thebase.in/font/v1/baseicon.eot?317xhh#iefix") format("embedded-opentype"),
		url("https://static.thebase.in/font/v1/baseicon.ttf?317xhh") format("truetype"),
		url("https://static.thebase.in/font/v1/baseicon.woff?317xhh") format("woff"),
		url("https://static.thebase.in/font/v1/baseicon.svg?317xhh#baseicon") format("svg");
}
@font-face {
	font-family: "shopicon";
	font-style: normal;
	font-weight: normal;
	src: url("https://static.thebase.in/font/v1/shopicon.eot?317xhh");
	src: url("https://static.thebase.in/font/v1/shopicon.eot?317xhh#iefix") format("embedded-opentype"),
		url("https://static.thebase.in/font/v1/shopicon.ttf?317xhh") format("truetype"),
		url("https://static.thebase.in/font/v1/shopicon.woff?317xhh") format("woff"),
		url("https://static.thebase.in/font/v1/shopicon.svg?317xhh#baseicon") format("svg");
}
[class^="icon-"],
[class*=" icon-"] {
	font-family: "baseicon" !important;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	font-style: normal;
	font-variant: normal;
	font-weight: normal;
	line-height: 1;
	speak: none;
	text-transform: none;
}
.icon-cart:before {
	content: "\e900";
}
.icon-search:before {
	content: "\e912";
}
.icon-information:before {
	content: "\e919";
}
.icon-tipi:before {
	content: "\e922";
}
.icon-pin:before {
	content: "\e929";
}

/* header
----------------------- */
#reportBtn a.cboxElement button {
	cursor: pointer;
}


/* ====================================================
layout
==================================================== */
/* header
----------------------- */
.l-header {
	position: fixed;
	top: 0;
	z-index: 100;
	width: 100%;
	padding-right: constant(safe-area-inset-right);
	padding-right: env(safe-area-inset-right);
	background-color: transparent;
}
.bg-on .l-header,
.l-header.is-scroll {
	background-color: var(--BgColorHeader);
}

/* header wrap */
.header__wrap {
	display: flex;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: center;
	position: relative;
	z-index: 1;
	width: 100%;
	height: 64px;
	padding: 0 0 0 5%;
}
@media screen and (min-width:1200px) {
	.header__wrap {
		height: 80px;
		padding: 0 32px;
	}
}
@media screen and (min-width:1600px) {
	.header__wrap {
		padding: 0 5%;
	}
}

/* logo */
.header__logo {
	flex-shrink: 1;
	height: 100%;
	margin-right: 5%;
}
.header__logo a {
	display: flex;
	align-items: center;
	height: 100%;
	text-decoration: none !important;
}
.header__logo a img {
	max-height: var(--LogoImgSize);
}
.logoImage.change {
	display: none;
}
.bg-on .set-logo .logoImage,
.is-scroll .set-logo .logoImage {
	display: none;
}
.bg-on .logoImage.change,
.is-scroll .logoImage.change {
	display: block;
}
.logoText + .logoImage.change {
	display: none;
}
.header__logo a .logoText {
	font-size: var(--LogoTextSize);
	line-height: 1.4;
	color: var(--NavTextColor);
}
.bg-on .header__logo a .logoText,
.is-scroll .header__logo a .logoText {
	color: var(--LogoTextColorBgOn) !important;
}
@media screen and (min-width: 1200px) {
	.header__logo {
		order: 1;
	}
	.header__logo a img {
		max-height: calc(var(--LogoImgSize) + 4px);
	}
	.header__logo a .logoText {
		font-size: calc(var(--LogoTextSize) * 1.2);
	}
}

/* header menu */
.header__menu {
	display: flex;
	flex-wrap: nowrap;
	flex-shrink: 0;
	position: relative;
	height: 100%;
}
.js-open .header__menu {
	z-index: 100;
}
@media screen and (min-width: 1200px) {
	.header__logo {
		margin-right: 32px;
	}
	.header__menu {
		order: 3;
	}
}

/* base menu
----------------------- */
#baseMenu ul {
	display: flex;
	flex-wrap: nowrap;
	gap: 8px;
	position: relative;
	height: 100%;
}
.l-gnav #baseMenu ul li {
	width: 100%;
	height: 46px;
}
#baseMenu ul li a {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 40px;
	height: 100%;
	cursor: pointer;
	-webkit-font-smoothing: antialiased;
	text-decoration: none;
}
.l-gnav #baseMenu ul li a {
	width: 100%;
}
#baseMenu ul li.cart a img{
	display: none;
}
/* base */
.base {
	display: none;
}
.l-gnav .base {
	display: block;
	order: 2;
}
.l-gnav #baseMenu ul li.base {
	display: none;
}
.l-footer .base {
	display: block;
}
.l-footer #baseMenu ul li.base a {
	height: 40px;
	background-color: var(--color-wht);
	border-radius: 100px;
}
.l-footer #baseMenu ul li.base img {
	width: 20px;
	height: 20px;
}

/* cart */
#baseMenu ul li.cart a {
	display: flex;
	justify-content: center;
	align-items: center;
}
#baseMenu ul li.cart a svg {
	width: 20px;
	height: 20px;
}
.cart {
	position: relative;
}
.cart-badge {
	display: block!important;
}
.cart-qty {
	position: absolute;
	top: 50%;
	right: 50%;
	transform: translate(calc(50% + 10px), calc(-50% - 8px));
	padding: 0 1px;
	min-width: 14px;
	background: #fa5171;
	border-radius: 50%;
	color: #fff;
	font-size: 10px;
	font-weight: 700;
	line-height: 16px;
	text-align: center;
	box-sizing: content-box;
}
.is-scroll .cart-qty.similar,
.l-gnav .cart-qty.similar {
	background: #fff;
	color: #fa5171;
}
.l-footer .cart {
	display: none;
}


/* icon */
#icon-cart,
#icon-bag {
	display: none;
}
.l-header.type-cart #icon-cart {
	display: block;
}
.l-header.type-bag #icon-bag {
	display: block;
}

@media screen and (min-width: 1200px) {
	.l-gnav #baseMenu {
		display: none;
	}
}

/* gnav
----------------------- */
/* btn toggle */
.menu-btn__wrap {
	position: relative;
	z-index: 3;
	width: 56px;
	height: 100%;
	padding: 0;
	border: none;
	outline: none;
	cursor: pointer;
	background-color: transparent;
}
.menu-btn--bar {
	all: unset;
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: 102;
	transform: translate(-50%, -50%);
	height: 2px;
	width: 16px;
	background-color: var(--NavTextColor);
}
.menu-btn--bar::before,
.menu-btn--bar::after {
	display: block;
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	height: 2px;
	width: 16px;
	background-color: var(--NavTextColor);
}
.bg-on .menu-btn--bar::before,
.is-scroll .menu-btn--bar::before,
.js-open .menu-btn--bar::before,
.bg-on .menu-btn--bar::after,
.is-scroll .menu-btn--bar::after,
.js-open .menu-btn--bar::after,
.bg-on .menu-btn--bar,
.is-scroll .menu-btn--bar,
.js-open .menu-btn--bar {
	background-color: var(--NavTextColorBgOn);
}
.menu-btn--bar::before {
	top: -6px;
}
.menu-btn--bar::after {
	top: 6px;
}
/* close */
.l-gnav .menu-btn__close {
	position: -webkit-sticky;
	position: sticky;
	top: 0;
	right: 0;
	z-index: 1;
	background-color: var(--BgColorHeader);
	-webkit-animation: none !important;
			animation: none !important;
}
.l-gnav .menu-btn__wrap {
	position: relative;
	width: 56px;
	height: 64px;
	margin-left: auto;
}
.l-gnav .menu-btn--bar::before {
	top: 0;
	transform: rotate(45deg);
}
.l-gnav .menu-btn--bar {
	background-color: transparent;
}
.l-gnav .menu-btn--bar::after {
	top: 0;
	transform: rotate(-45deg);
}
@media screen and (min-width: 1200px) {
	.menu-btn__wrap {
		display: none;
	}
}

/* gnav */
.js-open {
	overflow: hidden;
}
.hover__overlay,
.gnav__overlay {
	display: none;
}
.js-open .gnav__overlay {
	display: block;
	content: "";
	position: fixed;
	top: 0;
	left: 0;
	z-index: 1;
	width: 100vw;
	height: 100vh;
	background: rgba(0, 0, 0, 0.3);
}
.l-gnav {
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	-ms-overflow-style: none;
	scrollbar-width: none;
}
.l-gnav::-webkit-scrollbar {
	display: none;
}
.l-header .l-gnav {
	position: fixed;
	top: 0;
	right: 0;
	z-index: 101;
	transform: translateX(100%);
	transition: transform ease 0.4s;
	width: 80%;
	max-width: 370px;
	height: 100vh;
	padding-bottom: 120px;
	background-color: var(--BgColorHeader);
}
.l-header .l-gnav .l-gnav__inner {
	display: flex;
	flex-direction: column;
	gap: 24px;
	margin-left: 32px;
	margin-right: 32px;
}
.js-open .l-header .l-gnav {
	transform: translateX(0);
	transition: transform ease 0.4s;
}
.l-header .l-gnav > * {
	-webkit-animation: fadeOut 0.6s ease 0s forwards;
			animation: fadeOut 0.6s ease 0s forwards;
}
.js-open .l-header .l-gnav > * {
	padding-right: constant(safe-area-inset-right);
	padding-right: env(safe-area-inset-right);
	-webkit-animation: fadeIn 0.6s ease 0s forwards;
			animation: fadeIn 0.6s ease 0s forwards;
}
.gnav__menu {
	display: flex;
	flex-direction: column;
}
.gnav__listitem {
	font-weight: var(--NavFontWeight);
}
.gnav__link {
	display: flex;
	align-items: center;
	padding: 8px 0 8px;
	font-size: var(--NavFontSize);
	color: var(--NavTextColorBgOn);
	line-height: 1.4;
}
.bg-on .l-header .gnav__link,
.is-scroll.l-header .gnav__link {
	color: var(--NavTextColorBgOn) !important;
}
.is-dancing .gnav__menu .gnav__link {
	font-size: calc(var(--NavFontSize) * 1.2);
}
.gnav__sub .gnav__link {
	font-size: calc(var(--NavFontSize) - 2px);
	font-weight: 400;
}
@media screen and (min-width: 1200px) {
	.l-header .l-gnav {
		order: 2;
		flex-shrink: 0;
		position: inherit;
		top: auto;
		right: auto;
		transform: none;
		transition: none;
		overflow-y: inherit;
		width: auto;
		max-width: none;
		height: 100%;
		margin-left: auto;
		margin-right: 24px;
		padding: 0;
		background-color: transparent !important;
	}
	.l-header .l-gnav .l-gnav__inner {
		margin-right: 0;
	}
	.l-header .l-gnav > * {
		-webkit-animation: none;
				animation: none;
	}
	.l-header .l-gnav .gnav__menu {
		display: flex;
		flex-direction: row;
		align-items: center;
		gap: 32px;
		height: 100%;
		margin-bottom: 0;
}
	.l-header .l-gnav .gnav__listitem {
		max-width: 280px;
	}
	.l-header .l-gnav .gnav__listitem.gnav--guide,
	.l-header .l-gnav .gnav__listitem.gnav--faq,
	.l-header .l-gnav .gnav__listitem.gnav--privacy,
	.l-header .l-gnav .gnav__listitem.gnav--law {
		display: none;
	}
	.l-header .l-gnav .gnav__link {
		height: 80px;
		padding: 16px 0;
		color: var(--NavTextColor);
	}
	.l-header .l-gnav .gnav__sub {
		display: none;
	}
	.js-hover.hover__overlay {
		display: block;
		content: "";
		position: fixed;
		top: 0;
		left: 0;
		z-index: 99;
		width: 100vw;
		height: 100vh;
		background: rgba(127, 127, 127, 0.3);
	}
}
@media screen and (min-width: 1200px) {
	@media (hover: hover) and (pointer: fine) {
		.l-header .gnav__link {
			position: relative;
			opacity: 1;
			cursor: pointer;
		}
		.l-header .gnav__link::after {
			content: "";
			position: absolute;
			top: 50%;
			left: 0;
			transform: translateY(calc(-50% + 0.9em));
			width: 0;
			height: 1px;
			transition: width 0.4s;
			background-color: var(--NavTextColor);
		}
		.bg-on .l-header .gnav__link::after,
		.is-scroll.l-header .gnav__link::after {
			background-color: var(--NavTextColorBgOn);
		}
		.l-header .gnav__link:hover::after {
			width: 100%;
		}
	}
}

/* category menu & gnav__menu--child
----------------------- */
#shopHeader nav ul#appsItemCategoryTag {
	display: block;
}
#category-menu span {
	display: block;
	-webkit-font-smoothing: antialiased;
	text-transform: uppercase;
	transition-duration: 0.3s;
}
.gnav__menu--child,
#category-menu .category-list {
	margin-left: 8px;
	font-weight: 400;
}
#category-menu:hover .category-list ul li a:hover {
	text-decoration: none;
}
.appsItemCategoryTag_child {
	display: flex;
	flex-wrap: wrap;
}
.gnav__menu--child a,
.appsItemCategoryTag_child a {
	display: flex;
	align-items: center;
	padding: 8px 0 8px;
	font-size: calc(var(--NavFontSize) - 1px);
	color: var(--NavTextColor);
	line-height: 1.4;
}
.cat-bold .appsItemCategoryTag_child > a {
	font-weight: 700;
}
.is-dancing .gnav__menu--child a,
.is-dancing .appsItemCategoryTag_child a {
	font-size: calc(calc(var(--NavFontSize) - 1px) * 1.2);
}
.appsItemCategoryTag_child a {
	width: calc(100% - 40px);
}
.gnav__menu--child a {
	width: 100%;
}
.appsItemCategoryTag_lowerchild {
	display: none;
	width: 100%;
}
.cat-show .appsItemCategoryTag_lowerchild {
	display: block;
}
.appsItemCategoryTag_lowerchild a {
	display: block;
	position: relative;
	padding-left: 14px;
	text-indent: -12px;
}
.appsItemCategoryTag_lowerchild a::before {
	display: inline-block;
	content: "";
	width: 6px;
	height: 1px;
	margin-right: 6px;
	margin-bottom: 2px;
	background-color: var(--NavTextColor);
	vertical-align: middle;
}
.menu-btn__child {
	display: block;
	position: relative;
	z-index: 1;
	width: 40px;
	height: 38px;
	cursor: pointer;
}
.cat-show .menu-btn__child {
	display: none !important;
}
.menu-btn__child::before,
.menu-btn__child::after {
	background-color: var(--NavTextColor);
}
.menu-btn__child::before {
	display: block;
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 12px;
	height: 1px;
}
.menu-btn__child::after {
	display: block;
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 1px;
	height: 12px;
}
.js-child.menu-btn__child::after {
	display: none;
}
.u-tab {
	display: none;
}
@media screen and (min-width: 1200px) {
	#category-menu {
		height: 100%;
		margin-bottom: 0;
	}
	.l-header .gnav--membership,
	.l-header .gnav--category {
		position: relative;
	}
	.l-header .gnav__menu--child::-webkit-scrollbar,
	#appsItemCategoryTag::-webkit-scrollbar {
		display: none;
	}
	.l-header .gnav__menu--child,
	.l-header #appsItemCategoryTag {
		display: none;
		position: absolute;
		top: 80px;
		left: 50%;
		transform: translateX(-50%);
		overscroll-behavior-y: contain;
		overflow-y: scroll !important;
		-webkit-overflow-scrolling: touch;
		-ms-overflow-style: none;
		scrollbar-width: none;
		height: auto;
		max-height: calc(100vh - 96px);
		margin-left: 0;
		padding: 16px 24px;
		background-color: var(--BgColorHeader);
	}
	.l-header #appsItemCategoryTag {
		width: 320px;
	}
	.l-header .gnav__menu--child {
		width: -webkit-max-content;
		width: -moz-max-content;
		width: max-content;
		max-width: 200px;
	}
	.l-header .gnav--membership .gnav__menu--child.js-hover,
	.l-header .gnav--category #appsItemCategoryTag.js-hover {
		display: block;
	}
}



/* item search
----------------------- */
.itemSearch__form {
	display: flex;
	overflow: hidden;
	border: 1px solid var(--NavTextColor);
}
.js-search .itemSearch .itemSearch__form {
	width: 100%;
}
.itemSearch__field {
	margin: 0;
	background-color: #fff !important;
	border-radius: 0 !important;
	color: #333;
}
.itemSearch__field,
.itemSearch__field:focus {
	border: none !important;
}
.itemSearch__btn {
	display: flex;
	justify-content: center;
	align-items: center;
	cursor: pointer;
	margin: 0;
	padding: 0;
	background-color: transparent;
	border: none;
	border-left: 1px solid var(--NavTextColor);
}
.si-search {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 46px;
	height: 46px;
}
.si-search svg {
	width: 20px;
	height: 20px;
}
@media screen and (min-width: 1200px) {
	.l-gnav .itemSearch {
		display: none;
	}
}


/* bnr
----------------------- */
.gnav__bnr {
	display: flex;
	flex-direction: column;
	gap: 16px;
}
.gnav__bnrimg {
	width: 100%;
	max-width: 560px;
	margin-left: auto;
	margin-right: auto;
}
.gnav__bnrimg a {
	display: block;
}
@media screen and (min-width: 1200px) {
	.l-header .gnav__bnr,
	.l-header .gnav__bnrimg {
		display: none;
	}
}


/* sns
----------------------- */
.sns__list {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 16px;
	font-size: 0;
}
.sns__list li a {
	display: block;
}
.sns__list li img {
	width: 24px;
}
.sns__list li img[src*=twicon] {
	padding: 4px;
}
@media screen and (min-width: 1200px) {
	.l-header .l-gnav .sns__list {
		display: none;
	}
}


/* mail magazine
----------------------- */
.mailmagazine__wrap {
	width: 100%;
}
.mailmagazine__txt {
	margin-bottom: 0.5em;
	font-weight: 400;
	font-size: calc(var(--NavFontSize) - 2px);
	color: var(--NavTextColor);
	white-space: pre-line;
}
.mailMagazineSubscribe_field {
	display: flex;
	overflow: hidden;
	height: 46px;
	border: 1px solid var(--NavTextColor);
}
.mailMagazineSubscribe_input {
	margin: 0;
	background-color: #fff !important;
	border: none !important;
	border-radius: 0 !important;
	color: #333;
}
.mailMagazineSubscribe_input:focus {
	border: none;
}
.mailMagazineSubscribe_submit {
	width: 80px;
	margin: 0;
	padding: 0;
	background-color: transparent;
	border-left: 1px solid var(--NavTextColor);
	font-size: calc(var(--NavFontSize) - 2px);
	color: var(--NavTextColor);
}
.mailMagazineSubscribe_submit:hover {
	cursor: pointer;
}
.mailMagazineSubscribe_confirm {
	font-size: calc(var(--NavFontSize) - 2px);
	font-weight: 400;
	color: var(--NavTextColor);
}

@media screen and (min-width: 1200px) {
	.l-header .l-gnav .mailmagazine__wrap {
		display: none;
	}
}


/* i18
----------------------- */
#i18 .lang {
	display: inline-block;
	margin: 0 5px 0 0;
	position: relative;
}
#i18 .currency {
	display: inline-block;
	position: relative;
}
#i18 > div::before {
	content: "▲";
	position: absolute;
	right: 8px;
	top: 50%;
	transform: translateY(-50%) rotate(180deg) scale(0.75);
	font-size: 10px;
	color: var(--NavTextColor);
}
#i18 select {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	min-width: inherit;
	height: auto;
	padding: 8px 20px 8px 12px !important;
	background-color: transparent;
	border: 1px solid var(--NavTextColor);
	border-radius: 0;
	font-family: inherit;
	font-size: 11px;
	color: var(--NavTextColor);
	line-height: 18px;
	vertical-align: middle;
	cursor: pointer;
}
@media screen and (min-width: 1200px) {
	.l-header .l-gnav #i18 {
		display: none;
	}
}


/* lower header
----------------------- */
.lower__header {
	display: flex;
	align-items: center;
	position: -webkit-sticky;
	position: sticky;
	top: 0;
	left: 0;
	z-index: -1;
	overflow: hidden;
	transform: translate3d(0,0,0);
	-webkit-backface-visibility: hidden;
			backface-visibility: hidden;
	width: 100%;
	height: 70vw;
	background-size: cover;
	background-position: center;
}
#about .lower__header.set-img {
	background-image: var(--AboutLowerHeader);
}
#homeCategory .lower__header.set-img {
	background-image: var(--CategoryLowerHeader);
}
#blog .lower__header {
	background-image: var(--BlogLowerHeader);
}
#community .lower__header.set-img {
	background-image: var(--CommunityLowerHeader);
}
#MembershipPage .lower__header.set-img {
	background-image: var(--MembershipLowerHeader);
}
body.blogPage.p-blogpage__list:not(.bg-on) .lower__header::before,
body:not(.blogPage):not(.bg-on) .lower__header::before {
	display: block;
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.15);
}
.lower__header.noimg {
	position: relative;
	height: auto;
	margin-top: 104px;
}
.lower__header.noimg::before {
	display: none;
}
#blog .lower__header:not(.noimg) {
	display: none;
}
#blog.p-blogpage__list:not(.bg-on) .lower__header:not(.noimg) {
	display: flex;
}
.lower__title {
	width: 90%;
	margin-left: auto;
	margin-right: auto;
	color: #fff;
}
.lower__header.noimg .lower__title {
	padding-top: 0 !important;
	color: var(--TitleColor);
}
.js-initial.lower__header {
	position: initial;
	visibility: hidden;
}
@media screen and (max-height: 599px) and (orientation: landscape) {
	.lower__header {
		height: 55vh;
	}
}
@media screen and (min-height: 600px) {
	.lower__header {
		height: 40vh;
	}
}
@media screen and (min-width: 1200px) {
	.lower__header.noimg {
		margin-top: 160px;
	}
}


/* main
----------------------- */
.l-main {
	position: relative;
	z-index: 1;
	background: inherit;
}
#itemDetail .l-main,
#blog.p-blogpage__detail.bg-on .l-main {
	margin-top: 64px;
}
#home.search .p-item__wrap .c-sec__title {
	display: none;
}
@media screen and (min-width: 1200px) {
	#itemDetail .l-main,
	#blog.p-blogpage__detail.bg-on .l-main {
		margin-top: 80px;
	}
}


/* footer
----------------------- */
.l-footer {
	display: flex;
	justify-content: space-between;
	align-items: center;
	position: relative;
	margin-top: auto;
	padding: 12px 5%;
	background-color: inherit;
}
.p-copyright {
	font-size: 12px;
}


/* ====================================================
keyframes
==================================================== */
@-webkit-keyframes inView {
	0% {opacity: 0;}
	100% {opacity: 1;}
}
@keyframes inView {
	0% {opacity: 0;}
	100% {opacity: 1;}
}
@-webkit-keyframes outView {
	0% {opacity: 0.8}
	100% {opacity: 0;}
}
@keyframes outView {
	0% {opacity: 0.8}
	100% {opacity: 0;}
}
@-webkit-keyframes outView {
	0% {opacity: 0.8}
	100% {opacity: 0;}
}
@keyframes outView {
	0% {opacity: 0.8}
	100% {opacity: 0;}
}
@-webkit-keyframes slideFadeAnime {
	0% {transform: scale(1.05);}
	100% {transform: scale(1);}
}
@keyframes slideFadeAnime {
	0% {transform: scale(1.05);}
	100% {transform: scale(1);}
}
@-webkit-keyframes fadeIn {
	0% {opacity: 0;}
	25% {opacity: 0;}
	100% {opacity: 1;}
}
@keyframes fadeIn {
	0% {opacity: 0;}
	25% {opacity: 0;}
	100% {opacity: 1;}
}
@-webkit-keyframes fadeOut {
	0% {opacity: 1;}
	1% {opacity: 1;}
	100% {opacity: 0;}
}
@keyframes fadeOut {
	0% {opacity: 1;}
	1% {opacity: 1;}
	100% {opacity: 0;}
}
@-webkit-keyframes loading {
	0%,
	80%,
	100% {
		box-shadow: 0 12px 0 -8px;
	}
	40% {
		box-shadow: 0 12px 0 0;
	}
}
@keyframes loading {
	0%,
	80%,
	100% {
		box-shadow: 0 12px 0 -8px;
	}
	40% {
		box-shadow: 0 12px 0 0;
	}
}
.p-slide__list {
	opacity: 0;
	-webkit-animation: inView 2s ease 0s forwards;
			animation: inView 2s ease 0s forwards;
}
.fade-anime .swiper-fade .swiper-slide-active .p-slide__img {
	-webkit-animation: slideFadeAnime 1.2s ease 0s forwards;
			animation: slideFadeAnime 1.2s ease 0s forwards;
}
.p-slide__wrap.active .p-slide__nav,
.p-slide__title,
.p-slide__btn{
	opacity: 0;
	-webkit-animation: inView 1s 0.2s forwards;
			animation: inView 1s 0.2s forwards;
	will-change: animation;
	-webkit-backface-visibility: hidden;
			backface-visibility: hidden;
}
#appsItemDetailCustom,
.review01,
.informationBanner,
.is-inview,
.lower__title,
.header__wrap {
	opacity: 0;
	will-change: animation;
	-webkit-backface-visibility: hidden;
			backface-visibility: hidden;
}
#blog.p-blogpage__detail .lower__header::after {
	display: none !important;
	-webkit-animation: none !important;
			animation: none !important;
}
body.blogPage.p-blogpage__list:not(.bg-on) .lower__header::after,
body:not(.blogPage):not(.bg-on) .lower__header::after {
	display: block;
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 1);
	will-change: animation;
	-webkit-backface-visibility: hidden;
			backface-visibility: hidden;
	-webkit-animation: outView 1.2s ease 0s forwards;
			animation: outView 1.2s ease 0s forwards;
}
.js-load.header__wrap {
	-webkit-animation: inView 0.6s ease 0s forwards;
			animation: inView 0.6s ease 0s forwards;
}
.p-item__listitem.part,
.js-load.informationBanner,
.js-load.is-inview.p-concept__wrap,
.js-load.lower__title {
	-webkit-animation: inView 1.2s ease 0s forwards;
			animation: inView 1.2s ease 0s forwards;
}
.js-start#appsItemDetailCustom,
.js-start.review01,
.js-start.informationBanner,
.js-start.is-inview {
	-webkit-animation: inView 1.2s ease 0s forwards;
			animation: inView 1.2s ease 0s forwards;
}
#community .js-start.is-inview.c-sec__wrap {
	-webkit-animation: inView 1.2s ease 0.2s forwards;
			animation: inView 1.2s ease 0.2s forwards;
}
#blog .js-start.is-inview {
	-webkit-animation-delay: 0.1s;
			animation-delay: 0.1s;
}
::-webkit-full-page-media, :future, :root #blog .js-start.is-inview {
	-webkit-animation-delay: 0.2s;
			animation-delay: 0.2s;
}
@-moz-document url-prefix() {
	#blog .js-start.is-inview {
		-webkit-animation-delay: 0.2s;
				animation-delay: 0.2s;
	}
}


/* ====================================================
object
==================================================== */
/* component
----------------------- */
/* column */
.c-col__wrap {
	display: flex;
	flex-direction: column;
	gap: 40px;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
}
@media screen and (min-width: 1200px) {
	.c-col__wrap {
		flex-direction: row;
		gap: 5%;
		width: 90%;
	}
}

/* col side */
.c-col__side {
	order: 1;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	padding-left: 5%;
	padding-right: 5%;
}
.c-col__side .l-gnav {
	display: flex;
	flex-direction: column;
	gap: 24px;
	position: inherit;
	top: inherit;
	right: inherit;
	z-index: inherit;
	transform: none;
	transition: none;
	width: 100%;
	max-width: 100%;
	height: auto;
	padding: 0;
	background-color: transparent;
}
.c-col__side .mailmagazine__txt,
.c-col__side .mailMagazineSubscribe_confirm,
.c-col__side .gnav__link,
.c-col__side .gnav__menu--child a,
.c-col__side .menu-btn__child,
.c-col__side .appsItemCategoryTag_child a,
.c-col__side #i18 > div::before,
.c-col__side #i18 select {
	color: var(--BodyFontColor);
}
.c-col__side .menu-btn__child::before,
.c-col__side .menu-btn__child::after {
	background-color: var(--BodyFontColor);
}
.c-col__side .appsItemCategoryTag_lowerchild a::before {
	background-color: var(--BodyFontColor);
}
.c-col__side .itemSearch__form {
	border: 1px solid var(--BodyFontColor);
}
.c-col__side .itemSearch__btn {
	background-color: transparent;
	border-left: 1px solid var(--BodyFontColor);
}
.c-col__side .l-gnav .itemSearch {
	display: block;
}
.c-col__side .si-search .svg__data {
	stroke: var(--BodyFontColor);
}
.c-col__side #i18 select,
.c-col__side .itemSearch__form,
.c-col__side .mailMagazineSubscribe_field {
	border: 1px solid var(--BodyFontColor);
}
.c-col__side .mailMagazineSubscribe_submit {
	background-color: transparent;
	border-left: 1px solid var(--BodyFontColor);
	color: var(--BodyFontColor);
}
@media screen and (max-width: 1199px) {
	.c-col__side {
		position: relative;
		margin-top: 80px;
	}
	.c-col__side::before {
		display: block;
		content: "";
		position: absolute;
		top: -40px;
		left: 0;
		width: 100%;
		height: calc(100% + 104px);
	}
}
@media screen and (min-width: 600px) and (max-width: 1199px) {
	.c-col__side::before {
		height: calc(100% + 120px);
	}
	.c-col__side .gnav__bnr {
		flex-direction: row;
		gap: 16px;
	}
}
@media screen and (min-width: 1200px) {
	.c-col__side {
		order: 0;
		width: 280px;
		margin-left: 0;
		margin-right: 0;
		padding-left: 0;
		padding-right: 0;
	}
	.nav-sticky.c-col__side {
		position: -webkit-sticky;
		position: sticky;
		top: 120px;
		left: 0;
	}
	.c-col__side .gnav__menu {
		order: -1;
	}
	.c-col__side .l-gnav .itemSearch {
		order: -1;
	}
}

/* col main */
.c-col__main {
	display: flex;
	flex-direction: column;
	gap: 64px;
}
@media screen and (min-width: 1200px) {
	.c-col__main {
		gap: 80px;
		width: calc(95% - 280px);
	}
}


/* project wrap */
.c-project__wrap {
	padding-top: 40px;
	padding-bottom: 64px;
}
#itemDetail .c-project__wrap,
#blog.p-blogpage__detail.bg-on .c-project__wrap {
	padding-top: 5%;
}
@media screen and (min-width:600px) {
	.c-project__wrap {
		padding-top: 64px;
		padding-bottom: 80px;
	}
}
@media screen and (min-width:1200px) {
	#itemDetail .c-project__wrap,
	#blog.p-blogpage__detail.bg-on .c-project__wrap,
	.c-project__wrap {
		padding-top: 80px;
		padding-bottom: 104px;
	}
}

/* section wrap */
.c-sec__wrap {
	width: 90%;
	margin-left: auto;
	margin-right: auto;
}
@media screen and (min-width: 1200px) {
	.c-sec__wrap {
		width: 100%;
		max-width: 1400px;
	}
	#lawPage .c-sec__wrap,
	#privacyPage .c-sec__wrap,
	#contact .c-sec__wrap,
	#blog .blogDetail,
	#MembershipPage #membership {
		max-width: 1200px;
		margin-left: auto;
		margin-right: auto;
	}
}

/* display */
.c-landscape,
.c-portrait {
	display: none;
}
@media screen and (orientation: landscape) {
	.c-landscape {
		display: block;
	}
}
@media screen and (orientation: portrait) {
	.c-portrait {
		display: block;
	}
}

/* title */
.c-sec__title {
	margin-bottom: 16px;
	color: var(--TitleColor);
	white-space: pre-line;
}
.communityTitle {
	margin-bottom: 0.75em;
	color: var(--TitleColor);
	white-space: pre-line;
}
.bg-on .communityTitle {
	color: var(--BodyFontColor);
}
.lower__title,
.c-sec__title,
.communityTitle {
	word-break: break-word;
	font-weight: var(--TitleFontWeight) !important;
	text-align: var(--TitleAline) !important;
	line-height: 1.4 !important;
}
.lower__title,
.c-sec__title {
	font-size: var(--TitleFontSize) !important;
}
.lower__title.is-ja,
.c-sec__title.is-ja,
.communityTitle {
	font-size: calc(var(--TitleFontSize) - 6px) !important;
}
.is-dancing .lower__title,
.is-dancing .c-sec__title,
.is-dancing .communityTitle {
	font-size: calc(var(--TitleFontSize) * 1.1) !important;
}
@media screen and (min-width: 1200px) {
	.lower__title,
	.c-sec__title {
		font-size: calc(var(--TitleFontSize) + 8px) !important;
	}
	.lower__title.is-ja,
	.c-sec__title.is-ja,
	.communityTitle {
		font-size: calc(var(--TitleFontSize) + 2px) !important;
	}
	.is-dancing .lower__title,
	.is-dancing .c-sec__title,
	.is-dancing .communityTitle {
		font-size: calc(calc(var(--TitleFontSize) + 8px) * 1.1) !important;
	}
}

/* btn */
.c-btn__wrap {
	width: 100%;
	text-align: center;
}
.purchaseButton__btn,
.c-btn {
	display: inline-block;
	min-width: 280px;
	padding: 1em 1.5em;
	background-color: transparent;
	border-radius: var(--BtnRadius);
	box-sizing: border-box;
	font-size: inherit;
	font-weight: var(--BtnTextWeight);
	line-height: 1.4;
	text-align: center;
	text-decoration: none !important;
}
.c-btn {
	color: var(--BtnColor);
}
.purchaseButton__btn {
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	background-color: var(--BtnColor);
	border-radius: var(--BtnRadius);
	font-weight: var(--BtnTextWeight);
	color: var(--BtnTextColor) !important;
}
.purchaseButton__btn:disabled::after {
	border-radius: var(--BtnRadius);
}
#inquiryCompleteSection a,
.inquirySection .control-panel input#buttonLeave,
#MembershipPage .guide .mypage-link .link,
#MembershipPage .login .link {
	width: auto !important;
	min-width: 280px;
	max-width: initial;
	height: auto;
	padding: 1em 1.5em;
	background-color: transparent;
	border-radius: var(--BtnRadius);
	box-sizing: border-box;
	font-size: inherit;
	font-weight: var(--BtnTextWeight);
	text-align: center;
	line-height: 1.4;
	text-decoration: none;
}
#itemDetail .purchaseButtonModal__btn--submit,
#itemDetail #salesPeriodModal .salesPeriodModal__btn--submit,
.salesPeriodModal__btn,
#itemDetail .communityBox .button,
#MembershipPage .guide .register .link {
	width: auto !important;
	min-width: 280px;
	height: auto;
	padding: 1em 1.5em;
	border-radius: var(--BtnRadius);
	box-sizing: border-box;
	font-size: inherit;
	font-weight: var(--BtnTextWeight);
	text-align: center;
	line-height: 1.4;
	text-decoration: none;
}
.c-fill #inquiryCompleteSection a,
.c-fill .inquirySection .control-panel input#buttonLeave,
#MembershipPage .c-fill .guide .mypage-link .link,
#MembershipPage .c-fill .login .link,
/* #MembershipPage .c-fill .mypage .edit, */
.c-fill .c-btn {
	background-color: var(--BtnColor);
	border: none;
	color: var(--BtnTextColor);
}
.c-border #inquiryCompleteSection a,
.c-border .inquirySection .control-panel input#buttonLeave,
#MembershipPage .c-border .guide .mypage-link .link,
#MembershipPage .c-border .login .link,
/* #MembershipPage .c-border .mypage .edit, */
.c-border .c-btn {
	border: 1px solid var(--BtnColor);
	color: var(--BtnColor);
}
.c-border--bold #inquiryCompleteSection a,
.c-border--bold .inquirySection .control-panel input#buttonLeave,
#MembershipPage .c-border--bold .guide .mypage-link .link,
#MembershipPage .c-border--bold .login .link,
/* #MembershipPage .c-border--bold .mypage .edit, */
.c-border--bold .c-btn {
	border: 2px solid var(--BtnColor);
	color: var(--BtnColor);
}
#itemDetail .communityBox .button {
	width: 100% !important;
	min-width: auto;
}
#community .communityMain .communityButton,
#communityPurchase .communitySignin a,
#MembershipPage .leave-modal-button {
	border-radius: var(--BtnRadius) !important;
}
.is-dancing .c-btn,
.is-dancing .purchaseButton__btn,
.is-dancing .salesPeriodModal__btn,
.is-dancing .purchaseButtonModal__btn,
.is-dancing .inquirySection .control-panel input#buttonLeave,
.is-dancing #inquiryCompleteSection a,
.is-dancing .mailMagazineSubscribe_submit,
.is-dancing .communityButton {
	padding: .75em 1.5em !important;
	font-size: calc(var(--BodyFontSize) * 1.25) !important;
}
@media (hover: hover) and (pointer: fine) {
	#MembershipPage .guide .register .link:hover {
		opacity: 0.7;
		transition: opacity 0.4s ease;
	}
}

/* search & notpublic */
.c-search__title {
	margin-bottom: 40px;
	font-size: 24px;
	text-align: var(--TitleAline);
}
.c-message__txt {
	text-align: var(--TitleAline);
}

/* slide nav */
.p-slide__nav .swiper-button-next,
.p-slide__nav .swiper-button-prev {
	display: none;
	position: relative;
	top: auto;
	left: auto;
	right: auto;
	width: 32px;
	height: 32px;
	margin-top: 0;
	z-index: 1;
	cursor: pointer;
	align-items: center;
	justify-content: center;
	border: 1px solid var(--color-wht);
	border-radius: 50%;
	color: var(--color-wht);
}
.p-slide__nav .swiper-button-next::after,
.p-slide__nav .swiper-button-prev::after {
	content: "";
	width: 8px;
	height: 8px;
	border-right: 2px solid var(--color-wht);
	border-bottom: 2px solid var(--color-wht);
	font-family: inherit;
	font-size: inherit;
	text-transform: none!important;
	letter-spacing: 0;
	font-variant: initial;
	line-height: 1;
}
.p-slide__nav .swiper-button-next::after {
	transform: rotate(-45deg);
	margin-left: -3px;
}
.p-slide__nav .swiper-button-prev::after {
	transform: rotate(135deg);
	margin-right: -3px;
}


/* ====================================================
project
==================================================== */
/* お知らせバナーApp
----------------------- */
.informationBanner {
	display: block;
	width: 100%;
	min-height: auto !important;
	padding: 8px 0 !important;
}
.informationBanner__inner {
	display: flex;
	justify-content: space-between;
	flex-wrap: nowrap;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	padding: 0 8px;
}
.informationBannerContainer {
	width: 100%;
}
.informationBannerClose {
	opacity: 0.8 !important;
	color: var(--information-banner-textColor) !important;
}
.informationBannerIcon {
	width: 20px !important;
	height: 20px !important;
	margin-right: 0 !important;
}
.informationBannerIcon i {
	font-size: 20px !important;
	line-height: 20px !important;
}
.informationBannerText {
	margin-left: 8px;
	margin-right: 8px;
}
@media screen and (min-width: 600px) {
	.informationBanner__inner {
		width: 90%;
		padding: 0;
	}
}


/* blog
----------------------- */
/* layout */
.p-blog__list {
	display: grid;
	gap: 4vw;
	margin-bottom: 40px;
}
.p-blog__listitem a {
	color: var(--BodyFontColor);
}
.blogListMain .blog_head_image img,
.p-blog__img img {
	width: 100%;
	height: 100%;
	-o-object-fit: cover;
	   object-fit: cover;
	-o-object-position: center;
		object-position: center;
	aspect-ratio: var(--BlogImgRatio);
}
#blog #about.blogListMain h2,
.p-blog__title {
	margin-bottom: 8px;
	line-height: 1.4;
}
#blog #about.blogListMain h2,
.blog_title a {
	color: var(--BodyFontColor);
	text-decoration: none !important;
}

#blog #about.blogListMain .blog_publish .publish_date,
.p-blog__date {
	font-size: calc(var(--BodyFontSize) - 1px);
	line-height: 1.4;
}

/* l-row */
.l-row .p-blog__list {
	grid-template-columns: 1fr;
}
.l-row .blogListMain .blog_inner,
.l-row .p-blog__listitem {
	display: flex;
	gap: 4vw;
	align-items: flex-start;
	width: 100%;
}
.l-row .blogListMain .blog_head_image,
.l-row .p-blog__img {
	width: calc(40% - 2vw);
}
.l-row .blogListMain .p-blog__detail,
.l-row .p-blog__desc {
	width: calc(60% - 2vw);
}
.blogListMain .blog_contents .text,
.p-blog__content {
	display: none;
	overflow: hidden;
	margin-bottom: 8px;
	font-size: calc(var(--BodyFontSize) - 1px);
	line-height: 1.4;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}

/* l-column */
.l-column .p-blog__list {
	grid-template-columns: 1fr 1fr;
}
.l-column .p-blog__img {
	margin-bottom: 8px;
}
.l-column .blogListMain .blog_contents .text,
.l-column .p-blog__content {
	-webkit-line-clamp: 3;
}
@media screen and (min-width: 600px) {
	#blog #about.blogListMain h2,
	.p-blog__title {
		font-size: calc(var(--BodyFontSize) + 2px);
	}
}
@media screen and (min-width: 600px) and (max-width: 767px) {
	.l-row .blogListMain .blog_contents .text,
	.l-row .p-blog__content {
		-webkit-line-clamp: 3;
	}
}
@media screen and (min-width: 768px) {
	.p-blog__list {
		gap: 2vw;
	}
	.l-row .p-blog__list {
		grid-template-columns: 1fr 1fr;
	}
	.l-row .blogListMain .blog_inner,
	.l-row .p-blog__listitem {
		gap: 2vw;
	}
	.l-row .blogListMain .blog_head_image,
	.l-row .p-blog__img {
		width: calc(40% - 1vw);
	}
	.l-row .blogListMain .p-blog__detail,
	.l-row .p-blog__desc {
		width: calc(60% - 1vw);
	}
}
@media screen and (min-width: 960px) {
	.l-column .p-blog__list {
		grid-template-columns: 1fr 1fr 1fr;
	}
}
@media screen and (min-width: 1600px) {
	#blog #about.blogListMain h2,
	.p-blog__title {
		font-size: calc(var(--BodyFontSize) + 2px);
	}
	#blog #about.blogListMain .blog_publish .publish_date,
	.p-blog__date {
		font-size: var(--BodyFontSize);
	}
	.blogListMain .blog_contents .text,
	.p-blog__content {
		font-size: var(--BodyFontSize);
	}
	.l-row .blogListMain .blog_contents .text,
	.l-row .p-blog__content {
		-webkit-line-clamp: 3;
	}
}


/* item
----------------------- */
/* item list */
#community .communityMain .communityItems,
.p-item__list {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 4vw;
	margin-bottom: 40px;
}

/* item layout */
@media screen and (min-width: 768px) {
	#community .communityMain .communityItems,
	.p-item__list {
		grid-template-columns: 1fr 1fr 1fr;
		gap: 2vw;
	}
}
@media screen and (min-width: 1600px) {
	#community .communityMain .communityItems,
	.p-item__list {
		grid-template-columns: 1fr 1fr 1fr 1fr;
		gap: 2vw;
	}
}

/* item img */
.p-item__listitem .p-item__img {
	position: relative;
	margin-bottom: 8px;
}
.communityItem img,
.p-related__img img,
.p-thumb__listitem img,
.p-itemimg__listitem img,
.p-ranking__img img,
.p-item__img .img__wrap img {
	aspect-ratio: var(--ItemImgRatio);
	-o-object-fit: cover;
	   object-fit: cover;
}
.p-item__listitem .label_image {
	position: absolute;
	top: -4%;
	left: -4%;
	z-index: 1;
	height: auto;
	width: 30%;
}
@media screen and (min-width: 600px) {
	.p-item__listitem .label_image {
		width: min(25%, 80px);
	}
}

/* item title */
#community .communityMain .communityItems .communityItem .communityItemTitle,
.p-related__title,
.p-item__contents {
	color: var(--BodyFontColor);
}
@media screen and (min-width: 600px) {
	#community .communityMain .communityItems .communityItem .communityItemTitle,
	.p-related__title,
	.p-item__title {
		font-size: calc(var(--BodyFontSize) + 2px);
	}
}

/* item text */
.p-item__listitem .p-item__contents {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 4px;
}
#community .communityMain .communityItems .communityItem .communityItemTitle,
.p-related__title,
.p-item__title  {
	display: block;
	width: 100%;
	font-weight: 700;
	line-height: 1.4;
}
.p-item__listitem .p-item__contents .p-item__price {
	margin-right: 4px;
}
.p-related__price,
.p-ranking__price.p-item__price,
.p-item__list .p-item__price,
.discountPrice,
.discountPrice__calcPrice,
.communityItemPrice {
	display: flex;
	align-items: center;
	font-size: calc(var(--BodyFontSize) - 1px);
	font-weight: var(--ItemPriceWeight);
	word-break: initial;
	overflow-wrap: break-word;
}
.p-item__listitem .p-item__contents .discountPrice {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 4px;
}
#community .communityMain .communityItems .communityItem .communityItemPrice.discount,
.discountPrice {
	color: var(--StatusColor);
}
.discountPrice__calcPrice {
	word-break: break-word;
}
.c-item__status,
#itemIndex .soldout_cover,
#itemIndex .comingSoon,
#itemIndex .preOrder,
#itemIndex .lottery,
#itemIndex .takeout,
#itemIndex .community,
#itemIndex .discountPrice__ratio,
#community .communityMain .communityItems .communityItem .communityItemLabel.comingSoon,
#community .communityMain .communityItems .communityItem .communityItemPrice .discount,
#community .communityMain .communityItems .communityItem .communityItemLabel.soldOutText,
#community .communityMain .communityItems .communityItem .communityItemLabelBlock {
	display: inline-block;
	padding: 0.25em 0.5em;
	border: 1px solid var(--StatusColor);
	border-radius: 0;
	color: var(--StatusColor);
	font-size: 11px;
	font-weight: var(--ItemPriceWeight);
}
.discountPrice__ratio,
.communityMain .communityItems .communityItem .communityItemPrice .discount {
	margin-top: 0;
}
.c-item__status {
	margin-top: 0;
	margin-left: 8px;
}


/*item more*/
#loading img {
	display: none !important;
}
#loading,
#loading::before,
#loading::after {
	border-radius: 50%;
	width: 12px;
	height: 12px;
	-webkit-animation: loading 1s infinite ease-in-out both;
			animation: loading 1s infinite ease-in-out both;
}
#loading {
	margin: 8px auto 0;
	position: relative;
	color: var(--BodyFontColor);
	-webkit-animation-delay: -0.16s;
			animation-delay: -0.16s;
}
#loading::before,
#loading::after {
	content: "";
	position: absolute;
	top: 0;
}
#loading::before {
	left: -24px;
	-webkit-animation-delay: -0.32s;
			animation-delay: -0.32s;
}
#loading::after {
	left: 24px;
}

/* item breadcrumb */
.breadcrumb {
	margin-bottom: 40px;
}
.breadcrumb__child {
	display: inline;
}
.breadcrumb__child::after {
	display: inline-block;
	content: "";
	width: 4px;
	height: 4px;
	margin: -2px 8px 0 12px;
	background-color: var(--BodyFontColor);
	border-radius: 50%;
	vertical-align: middle;
}
.breadcrumb__child:last-of-type:after {
	display: none;
}
.breadcrumb__child a {
	opacity: 0.5;
	font-size: calc(var(--BodyFontSize) - 1px);
	color: var(--BodyFontColor) !important;
}
@media screen and (min-width: 600px) {
	.breadcrumb__child a {
		font-size: var(--BodyFontSize);
	}
}
@media (hover: hover) and (pointer: fine) {
	.breadcrumb__child a:hover {
		opacity: 1;
	}
}

/* category child
----------------------- */
.category-child__list {
	display: flex;
	flex-wrap: wrap;
	gap: 4px;
	margin-bottom: 40px;
}
.category-child__link {
	display: inline-block;
	padding: 0.5em 1em;
	background-color: transparent;
	border: 1px solid var(--BodyFontColor);
	border-radius: calc(var(--BtnRadius) - 2px);
	line-height: 1.4;
	text-align: center;
	font-size: calc(var(--BodyFontSize) - 1px);
	color: var(--BodyFontColor);
}


/* instagram
----------------------- */
.p-instagram__wrap.u-sp {
	order: 6;
	margin-bottom: 64px;
}
.p-instagram__wrap.u-pc {
	display: none;
	margin-bottom: 80px;
}
.p-instagram__wrap .c-sec__title,
.snptwdgt__headng,
.snptwdgt__subheadng {
	margin-left: 5%;
	margin-right: 5%;
}
.snptwdgt__headng + .snptwdgt__subheadng {
	margin-top: 8px;
}
.snptwdgt__headng.h1 {
	font-size: 28px;
	line-height: 1.4;
}
.snptwdgt__headng.h2 {
	font-size: 26px;
	line-height: 1.4;
}
.snptwdgt__headng.h3 {
	font-size: 24px;
	line-height: 1.4;
}
.snptwdgt__headng.h4 {
	font-size: 22px;
	line-height: 1.4;
}
.snptwdgt__headng.h5 {
	font-size: 20px;
	line-height: 1.4;
}
.snptwdgt-container .snptwdgt__headr-blok .snptwdgt__headn--1.h6 {
	font-size: 18px;
	line-height: 1.4;
}
.snptwdgt-container .snptwdgt-rtd__f0tr,
.snptwdgt-container .snptwdgt-rtd__f0tr a {
	color: inherit !important;
}
.snptwdgt-container .snptwdgt-rtd__f0tr .snptwdgt__usr-profl .snptwdgt__usr-profl-name {
	background-color: transparent;
	color: inherit !important;
}
.p-instagram__wrap .c-btn__wrap {
	width: 90%;
	margin-left: auto;
	margin-right: auto;
}
@media screen and (min-width: 1200px) {
	.p-instagram__wrap.u-sp {
		display: none;
		width: 100%;
		max-width: 1400px;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 0;
	}
	.p-instagram__wrap.u-pc {
		display: block;
	}
}


/* massage app
----------------------- */
#x_message .msg_startButton {
	display: none;
	-webkit-backface-visibility: hidden;
			backface-visibility: hidden;
	will-change: opacity;
	transform: translate3d(0, 0, 0);
	transition: none !important;
}
.js-open #x_message .msg_startButton {
	z-index: 1 !important;
}
@media screen and (max-width: 480px) {
	#x_message .msg_startButton {
		position: fixed !important;
		left: auto !important;
		right: 2.5% !important;
		bottom: 2.5% !important;
		z-index: 9999 !important;
		width: 60px !important;
		height: 60px !important;
		border-radius: 60px !important;
		box-shadow: 0 0 15px 0 rgba(51,66,88,.2) !important;
		cursor: pointer !important;
	}
	#x_message .msg_startButton__icon {
		display: block !important;
		font-size: 24px !important;
		line-height: 60px!important;
		padding: 0 !important;
	}
	#x_message .msg_startButton__text {
		display: none !important;
	}
}