@import url("//fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;400;700&display=swap");

html {
	font-size: 62.5%;
	box-sizing: border-box
}

body {
	margin: 0;
	padding: 0;
	font-size: 1.6rem;
	font-weight: 400;
	line-height: 1.8;
	letter-spacing: 0.08em;
	font-family: YakuHanMP, "Noto Sans JP", sans-serif;
	color: #616161;
	-ms-word-break: break-word;
	word-break: break-word
}

@media screen and (max-width: 768px) {
	body {
		font-size: 1.25rem;
		font-weight: 400
	}
}

b {
	font-weight: 800
}

a {
	color: #FFD7B7;
	text-decoration: none;
	-webkit-transition: all .2s;
	transition: all .2s
}

a::before, a::after {
	-webkit-transition: all .2s;
	transition: all .2s
}

a:hover, a:focus, a:active {
	outline: none;
	color: #FFD7B7
}

a img {
	-webkit-transition: all .2s;
	transition: all .2s
}

a img::before, a img::after {
	-webkit-transition: all .2s;
	transition: all .2s
}

a img:hover {
	filter: brightness(104%)
}

::selection {
	background: #FFD7B7;
	color: #fff
}

::-moz-selection {
	background: #FFD7B7;
	color: #fff
}

*:focus {
	outline: none
}

@media screen and (max-width: 768px) {
	.pc-only {
		display: none !important
	}
}

@media screen and (max-width: 768px) {
	.tb-over {
		display: none !important
	}
}

@media screen and (min-width: 769px) {
	.sp-only {
		display: none !important
	}
}

.text-center {
	text-align: center
}

.text-center img {
	margin-left: auto;
	margin-right: auto
}

.text-left {
	text-align: left
}

.text-right {
	text-align: right
}

img {
	max-width: 100%;
	height: auto
}

@media screen and (max-width: 768px) {
	img.sp-w-50 {
		zoom: 0.5;
		margin-left: auto;
		margin-right: auto
	}
}

picture {
	display: block
}

.clear {
	clear: both
}

.clear::after {
	content: "";
	display: block;
	clear: both
}

.m-0 {
	margin: 0 !important
}

.m-t-0 {
	margin-top: 0rem !important
}

.m-t-1 {
	margin-top: 1rem !important
}

.m-t-2 {
	margin-top: 2rem !important
}

.m-t-4 {
	margin-top: 4rem !important
}

.m-t-6 {
	margin-top: 6rem !important
}

.m-t-8 {
	margin-top: 8rem !important
}

.m-t-10 {
	margin-top: 10rem !important
}

.m-t-16 {
	margin-top: 16rem !important
}

@media screen and (max-width: 768px) {
	.m-t-4 {
		margin-top: 3rem !important
	}

	.m-t-6 {
		margin-top: 4rem !important
	}

	.m-t-8 {
		margin-top: 5rem !important
	}

	.m-t-10 {
		margin-top: 5rem !important
	}

	.m-t-16 {
		margin-top: 8rem !important
	}
}

.flex-conts {
	display: flex;
	flex-flow: row wrap;
	align-items: center
}

.flex-conts.row-reverse {
	flex-direction: row-reverse
}

.flex-conts.align-top {
	align-items: flex-start
}

.flex-conts.space-between {
	justify-content: space-between
}

.font-l {
	font-size: 1.9rem !important
}

.font-m {
	font-size: 1.7rem !important
}

.font-n {
	font-size: 1.6rem !important
}

.font-s {
	font-size: 1.4rem !important;
	line-height: 1.4
}

.font-xs {
	font-size: 1.0rem !important;
	line-height: 1.4
}

@media screen and (max-width: 768px) {
	.font-l {
		font-size: 1.6rem !important
	}

	.font-m {
		font-size: 1.3rem !important
	}

	.font-n {
		font-size: 1.25rem !important
	}

	.font-s {
		font-size: 1.1rem !important;
		line-height: 1.4
	}

	.font-xs {
		font-size: 1.0rem !important;
		line-height: 1.4
	}
}

.uppercase {
	text-transform: uppercase
}

.line-height22 {
	line-height: 2.2
}

@media screen and (max-width: 768px) {
	.line-height22 {
		margin: 0 4vw;
		width: calc(100% - 8vw)
	}
}

.fadein, .fadein-pc {
	opacity: 0;
	transform: translate(0, 100px);
	transition: all 2400ms
}

.fadein.scrollin, .fadein-pc.scrollin {
	opacity: 1;
	transform: translate(0, 0)
}

@media screen and (max-width: 768px) {
	.fadein-pc {
		opacity: 1
	}
}

.fadein-right {
	opacity: 0;
	transform: translateX(50px);
	transition: all 2400ms
}

.fadein-right.scrollin {
	opacity: 1;
	transform: translateX(0)
}

.fadein-left {
	opacity: 0;
	transform: translateX(-50px);
	transition: all 2400ms
}

.fadein-left.scrollin {
	opacity: 1;
	transform: translateX(0)
}

.module-2 {
	width: 50%;
	display: block
}

@media screen and (max-width: 768px) {
	.module-2 {
		width: 100%
	}
}

.module-2.narrow {
	width: 38.2%
}

.module-2.wide {
	width: 61.8%
}

.module-3 {
	width: 33.33333%;
	display: block;
	float: left
}

@media screen and (max-width: 768px) {
	.module-3 {
		width: 100%;
		float: none
	}
}

.module-4 {
	width: 25%;
	display: block;
	float: left
}

@media screen and (max-width: 768px) {
	.module-4 {
		width: 50%
	}
}

h1, h2, h3, h4, h5 {
	margin: 0;
	font-size: 100%;
	font-weight: normal
}

p {
	margin: 0
}

.wrap {
	clear: both;
	position: relative;
	margin: 0 auto;
	width: 900px;
	height: 100%
}

@media screen and (max-width: 768px) {
	.wrap {
		margin: 0 4vw;
		width: calc(100% - 8vw)
	}
}

.wrap.wide {
	margin: 0;
	width: 100%
}

.wrap.narrow {
	margin: 0 4vw;
	width: calc(38.2% - 8vw)
}

@media screen and (max-width: 768px) {
	.wrap.narrow {
		width: calc(100% - 8vw)
	}
}

.common-cts {
	max-width: 100%
}

@media screen and (max-width: 768px) {
	.common-cts {
		padding: 0
	}
}

.bg-pale {
	background-color: #FFD7B7
}

.pickup {
	overflow: hidden
}

.first {
	overflow: hidden;
	padding-bottom: 60px
}

.first .conts {
	width: 920px;
	background-color: #FFFFF6;
	border-radius: 10px;
	overflow: hidden;
	padding-bottom: 60px
}

@media screen and (max-width: 768px) {
	.first .conts {
		width: calc(100% - 8vw);
		padding: 0 4vw
	}
}

.first .first-last {
	position: relative
}

.first .first-last .upper {
	position: absolute;
	right: 0;
	bottom: 0;
	z-index: 1
}

@media screen and (max-width: 768px) {
	.first .first-last .upper {
		width: 38.2vw;
		right: -8vw
	}
}

.second .point {
	align-content: flex-start
}

.second .point picture {
	margin-top: 5px;
	width: 50%
}

@media screen and (max-width: 768px) {
	.second .point picture {
		width: 100%
	}
}

.product {
	width: 450px;
	margin-left: auto;
	margin-right: auto
}

@media screen and (max-width: 768px) {
	.product {
		width: 100%
	}
}

.product .module-2 {
	width: calc(50% - 10px);
	display: block
}

.product a {
	color: #616161
}

.product .font-xs {
	font-weight: bold
}

@media screen and (max-width: 768px) {
	.feeling .item {
		width: calc(50% - 1vw)
	}
}

.about {
	padding-bottom: 60px;
	background-color: #fff;
	border: 15px solid #FDECEE
}

@media screen and (max-width: 768px) {
	.about {
		padding: 2vw;
		padding-bottom: 60px;
		border: 10px solid #FDECEE
	}

	.about .font-l {
		font-size: 1.2rem !important
	}
}

.lower-button {
	margin-top: 140px
}

.lower-button a {
	display: block;
	margin-top: 100px
}

.lower-button a img {
	-webkit-transition: all .2s;
	transition: all .2s
}

.lower-button a img::before, .lower-button a img::after {
	-webkit-transition: all .2s;
	transition: all .2s
}

.lower-button a img:hover {
	filter: brightness(102%)
}

@media screen and (max-width: 768px) {
	.lower-button {
		margin-top: 70px
	}

	.lower-button a {
		display: block;
		margin-top: 60px
	}
}

@media screen and (max-width: 768px) {
	.past-banner {
		padding: 0 4vw
	}
}

.kannahashimotocollaboration2022ss .first .first-last .upper {
	right: 80px
}

@media screen and (max-width: 768px) {
	.kannahashimotocollaboration2022ss .first .first-last .upper {
		right: -8vw
	}
}

.kannahashimotocollaboration2022ss .top-img-wrap {
	position: relative
}

.kannahashimotocollaboration2022ss .top-img-wrap .product {
	position: absolute;
	left: 40px;
	bottom: 75px;
	z-index: 2;
	justify-content: flex-start
}

@media screen and (max-width: 768px) {
	.kannahashimotocollaboration2022ss .top-img-wrap .product {
		transform: scale(0.5);
		transform-origin: left bottom;
		left: 20px;
		bottom: 30px
	}
}

.kannahashimotocollaboration2022ss .top-img-wrap .product .module-2 {
	width: calc(50% - 35px)
}

.kannahashimotocollaboration2022ss .top-img-wrap .top-img-conts {
	z-index: 1
}

.kannahashimotocollaboration2022ss .about {
	padding: 4rem;
	background-color: #FFF5EF;
	border: none
}

.kannahashimotocollaboration2022ss .about.hashimoto {
	background-color: #FFF9F2
}

.kannahashimotocollaboration2022ss .about.hashimoto .module-2.narrow {
	width: 261px
}

.kannahashimotocollaboration2022ss .about.hashimoto .module-2.wide {
	width: calc(100% - 261px);
	padding-left: 2rem
}

@media screen and (max-width: 768px) {
	.kannahashimotocollaboration2022ss .about {
		padding: 2rem
	}

	.kannahashimotocollaboration2022ss .about.hashimoto .module-2.narrow {
		width: 100%
	}

	.kannahashimotocollaboration2022ss .about.hashimoto .module-2.wide {
		width: 100%;
		padding-left: 0;
		line-height: 2;
		margin-top: 2rem
	}

	.kannahashimotocollaboration2022ss .about .line-height22 {
		margin: 0;
		width: 100%
	}
}

.kannahashimotocollaboration2022ss .profile-hashimoto .title {
	border-bottom: 1px solid #4D4D4D
}

.kannahashimotocollaboration2022ss .profile-hashimoto .module-2.narrow {
	width: 201px
}

.kannahashimotocollaboration2022ss .profile-hashimoto .module-2.wide {
	width: calc(100% - 201px);
	padding-left: 20px
}

@media screen and (max-width: 768px) {
	.kannahashimotocollaboration2022ss .profile-hashimoto .module-2.narrow {
		width: 100%
	}

	.kannahashimotocollaboration2022ss .profile-hashimoto .module-2.wide {
		width: 100%;
		padding-left: 0
	}
}

/** 20220601
/**************************************/
.top-img {
	text-align: center;
}
