@charset "UTF-8";

/** -- ととのうシリーズ -- **/
.blog_content.totonou {
	color: #231815;
}
.blog_content.totonou .content h2 {
	color: #231815;
}
/** whats_cbd **/
.totonou .whats_cbd {
	margin-bottom: 5vw;
	margin-top: 15vw;
	position: relative;
}
.totonou .whats_cbd h2 {
	border-bottom: solid 1px #231815;
	border-top: solid 1px #231815;
	padding: 2vw 0;
	position: relative;
	text-align: center;
}
.totonou .whats_cbd h2::before {
	border-bottom: solid 3px #231815;
	content: '';
	display: block;
	position: absolute;
	left: 0;
	top: -1vw;
	width: 100%;
}
.totonou .whats_cbd figure {
	margin: 0;
	position: absolute;
	left: -8vw;
	top: -5vw;
	width: calc(100% + 16vw);
	z-index: -1;
}
.totonou .whats_cbd h3 {
	color: #EFE9DD;
	font-family: "Fjalla One", serif;
	font-size: 7vw;
	letter-spacing: 2vw;
	margin: 7vw -5vw 0;
	text-align: center;
}
/** ttl **/
.totonou .ttl {
	padding-top: 3vw;
}
.totonou .ttl p {
	background: url('/wp/wp-content/uploads/2021/10/hukidashi.png') no-repeat 0 0 / 100%;
	font-size: 2vw;
	line-height: 1.4;
	margin: 0 auto 1vw;
	padding-bottom: 1vw;
	text-align: center;
	width: 16vw;
}
.totonou .ttl h2 {
	border-bottom: solid 1px #231815;
	border-top: solid 1px #231815;
	margin-bottom: 0 !important;
	margin-top: 0 !important;
	padding: 2vw 0;
	position: relative;
	text-align: center;
}
.totonou .ttl h2::before {
	border-bottom: solid 3px #231815;
	content: '';
	display: block;
	position: absolute;
	left: 0;
	top: -1vw;
	width: 100%;
}
.totonou .item_ttl {
	background-color: #FAF2EB;
	margin: 0 -21vw;
	padding: 0 21vw;
	padding-top: 5vw;
}

/** item_block **/
.totonou .item_block {
	margin: 0 -21vw 3vw;
	padding: 5vw 21vw;
}
.totonou .item_block.block01 {
	background-color: #FAF2EB;
}
.totonou .item_block.block02 {
	background-color: #F8E0E0;
}
.totonou .item_block.block03 {
	background-color: #DFBEAC;
}
.totonou .item_block.block04 {
	background-color: #DAC6DE;
}
.totonou .item_block.block05 {
	background-color: #F8EAD9;
}
.totonou .item_block figure {
	margin: 0 -21vw !important;
	position: relative;
}
.totonou .item_block figure figcaption {
	margin: 0;
	position: absolute;
	bottom: 5vw;
	left: 0;
	text-align: center;
	width: 100%;
}
.totonou .item_name {
	border-bottom: solid 1vw #231815;
	border-top: solid 1vw #231815;
	margin: 0 -8vw 4vw;
	padding: 1vw 0 1.4vw;
	text-align: center;
}
.totonou .item_name h2 {
	color: #231815 !important;
	font-family: "Fjalla One", serif;
	font-size: 13vw;
	letter-spacing: 1.5vw;
	line-height: 1.3;
	margin-bottom: -4.5vw !important;
	position: relative;
}
.totonou .item_name h2 span {
	letter-spacing: 0;
}
.totonou .item_name h2 .r {
	display: block;
	font-family: '游ゴシック', '游ゴシック体', 'YuGothic', 'Yu Gothic', sans-serif;
	font-size: 6vw;
	letter-spacing: 0;
	position: absolute;
	right: 0;
	top: 0;
}
.totonou .item_block#soundsbetter h2 {
	font-size: 8.6vw;
}
.totonou #soundsbetter .item_name h2 .r {
	font-size: 3.4vw;
}
.totonou .item_name p {
	font-size: 2vw;
	letter-spacing: .5vw;
	margin-bottom: 0 !important;
}
.totonou .item_block h3 {
	font-family: 'Harenosora';
	font-size: 2.6vw;
	letter-spacing: .6vw;
	margin-bottom: 2.4vw;
	text-align: center;
}
/* contact */
.totonou .item_block .contact {
	border-bottom: solid 1px #231815;
	border-top: solid 1px #231815;
	letter-spacing: .1vw;
	line-height: 2.2;
	padding: 1.5vw 0;
	text-align: center;
}
/** shop_block **/
.totonou .shop_block {
	margin-top: 12vw;
}
/* title */
.totonou .shop_block .title {
	text-align: center;
}
.totonou .shop_block .title p {
	font-size: 2.4vw;
	letter-spacing: .2vw;
	margin-bottom: 0 !important;
}
.totonou .shop_block .title h2 {
	font-family: "Fjalla One", serif;
	font-size: 12.4vw;
	letter-spacing: 1.4vw;
	margin: 0 -10vw;
	margin-bottom: 0 !important;
	margin-top: 0 !important;
}
.totonou .shop_block .title h3 {
	font-size: 3.8vw;
	font-weight: bold;
	letter-spacing: .6vw;
	margin-top: -4vw;
}
/* shop_main */
.totonou .shop_block figure.shop_main {
	margin: 0 -21vw;
}
/* intro_box */
.totonou .shop_block .intro_box {
	background-color: #fff;
	border: solid 1px #231815;
	box-sizing: border-box;
	margin: -3vw -13vw 8vw;
	padding: 6vw 13vw;
	position: relative;
	z-index: 1;
}
.totonou .shop_block .intro_box figure {
	margin: 0 0 5vw;
}
.totonou .shop_block .intro_box h3 {
	font-family: 'Harenosora';
	font-size: 2.6vw;
	letter-spacing: .6vw;
	margin-bottom: 2.4vw;
	text-align: center;
}
/* box */
.totonou .shop_block .box {
	margin-bottom: 6vw;
}
.totonou .shop_block .box figure {
	margin: 0 0 2.4vw;
}
.totonou .shop_block .box figure figcaption {
	font-size: 1.3vw;
	margin-top: 2vw;
}
/* shop_info */
.totonou .shop_block .shop_info {
	border-bottom: solid 1px #231815;
	border-top: solid 1px #231815;
	font-size: 1.4vw;
	letter-spacing: .1vw;
	padding: 1.5vw 0;
	text-align: center;
}
/** campaign **/
.totonou .campaign {
	background-color: #F8DFD0;
	border-radius: 4vw;
	margin: 6vw -10vw 0;
	padding: 4vw 0;
	text-align: center;
}
.totonou .campaign h3 {
	background-color: #F3C0B5;
	font-size: 2.3vw;
	font-weight: bold;
	letter-spacing: .2vw;
	margin: 0 5vw 2.5vw;
	position: relative;
	height: 3.6vw;
}
.totonou .campaign h3::before,
.totonou .campaign h3::after {
	border: solid 1.8vw transparent;
	content: '';
	display: block;
	position: absolute;
}
.totonou .campaign h3::before {
	border-left: solid 1.2vw #F8DFD0;
	left: 0;
	top: 0;
}
.totonou .campaign h3::after {
	border-right: solid 1.2vw #F8DFD0;
	right: 0;
	top: 0;
}
.totonou .campaign h2 {
	align-items: center;
	display: flex;
	font-family: "Fjalla One", serif;
	font-size: 6vw;
	letter-spacing: .8vw;
	justify-content: center;
	margin-bottom: 0 !important;
}
.totonou .campaign h2 span {
	font-family: '游ゴシック', '游ゴシック体', 'YuGothic', 'Yu Gothic', sans-serif;
	font-size: 1.8vw;
	font-weight: bold;
	letter-spacing: .2vw;
	margin-bottom: 1.2vw;
}
.totonou .campaign h4 {
	background-color: #fff;
	border-radius: 2vw;
	box-shadow: 5px 5px 5px 0 rgba(0, 0, 0, .1);
	display: table;
	font-weight: bold;
	letter-spacing: .2vw;
	margin: 0 auto 2vw;
	padding: 2vw 2vw 1vw;
}
.totonou .campaign h4 em {
	background: linear-gradient(transparent 65%, #FFFF90 65%);
	font-size: 2.1vw;
	font-style: normal;
}
.totonou .campaign h4 span {
	font-size: 3.1vw;
}
.totonou .campaign p {
	font-size: 1.4vw;
	letter-spacing: .1vw;
	font-weight: bold;
	margin-bottom: 2vw;
}
.totonou .campaign p.exp span {
	font-size: 2vw;
}
.totonou .campaign p.detail {
	background-color: #fff;
	padding: 2vw 0;
}
.totonou .campaign p.detail span {
	color: #F0789B;
}
/** present **/
.totonouPresent h2.headline {
	color: #00B900;
	font-family: 'Cinzel', serif;
	font-size: 8.4vw;
	letter-spacing: 1.6vw;
	line-height: 1.1;
	margin-bottom: 1vw;
}
.totonouPresent .line_friends .innerBox .text {
	border-bottom: dashed 1px #464646;
	margin-bottom: 4vw;
	padding-bottom: 4vw;
	width: 100%;
}
.totonouPresent .line_friends .innerBox .text h2 {
	text-align: center;
}
.totonouPresent .line_friends .innerBox h2 p {
	margin-bottom: 2vw;
}
.totonouPresent .line_friends .innerBox h2 em {
	font-size: 2.1vw;
}
.totonouPresent .line_friends .innerBox h2 span {
	display: block;
	font-size: 3.2vw;
}
.present .line_friends .detailBox {
	width: 100%;
}
.totonouPresent .line_friends .textBox {
	position: relative;
}
.totonouPresent .line_friends .textBox p.borderPresent {
	border: solid 1px #464646;
	border-radius: 5vw;
	display: table;
	font-size: 1.6vw;
	letter-spacing: .2vw;
	margin-bottom: 1vw;
	padding: .5vw 1vw;
}
.totonouPresent .line_friends .detailBox h3 p {
	font-size: 1.7vw;
	font-weight: bold;
	line-height: 1.4;
	margin-bottom: 1vw;
}
.totonouPresent .line_friends .detailBox h3 p span {
	display: inline-block;
	font-size: 1.2vw;
	font-weight: normal;
	margin-bottom: 1vw;
}
.totonouPresent .line_friends .detailBox h3 p span:last-child {
	margin-bottom: 0;
}
.totonouPresent .line_friends .detailBox p.period {
	border-bottom: solid 1px #464646;
	border-top: solid 1px #464646;
	box-sizing: border-box;
	font-size: 1.3vw;
	font-weight: bold;
	margin: 0;
	padding: .5vw 1vw;
	position: absolute;
	bottom: 0;
	left: 1vw;
	width: 96%;
}
@media screen and (min-width: 1000px) {
	/** whats_cbd **/
	.totonou .whats_cbd {
		margin-bottom: 50px;
		margin-top: 150px;
	}
	.totonou .whats_cbd h2 {
		padding: 20px 0;
	}
	.totonou .whats_cbd h2::before {
		top: -10px;
	}
	.totonou .whats_cbd figure {
		left: -80px;
		top: -50px;
		width: calc(100% + 160px);
	}
	.totonou .whats_cbd h3 {
		font-size: 70px;
		letter-spacing: 20px;
		margin: 70px -50px 0;
	}
	/** ttl **/
	.totonou .ttl {
		padding-top: 30px;
	}
	.totonou .ttl p {
		font-size: 20px;
		margin: 0 auto 10px;
		padding-bottom: 10px;
		width: 160px;
	}
	.totonou .ttl h2 {
		padding: 20px 0;
		text-align: center;
	}
	.totonou .ttl h2::before {
		top: -10px;
	}
	.totonou .item_ttl {
		margin: 0 -210px;
		padding: 0 210px;
		padding-top: 50px;
	}

	/** item_block **/
	.totonou .item_block {
		margin: 0 -210px 30px;
		padding: 50px 210px;
	}
	.totonou .item_block figure {
		margin: 0 -210px !important;
	}
	.totonou .item_block figure figcaption {
		bottom: 50px;
	}
	.totonou .item_name {
		border-bottom: solid 10px #231815;
		border-top: solid 10px #231815;
		margin: 0 -80px 40px;
		padding: 10px 0 14px;
	}
	.totonou .item_name h2 {
		font-size: 150px;
		letter-spacing: 15px;
		margin-bottom: -45px !important;
	}
	.totonou .item_name h2 .r {
		font-size: 60px;
	}
	.totonou .item_block#soundsbetter .item_name {
		padding: 20px 0 25px;
	}
	.totonou .item_block#soundsbetter h2 {
		font-size: 103px;
		margin-bottom: -25px !important;
	}
	.totonou #soundsbetter .item_name h2 .r {
		font-size: 34px;
	}
	.totonou .item_name p {
		font-size: 25px;
		letter-spacing: 5px;
	}
	.totonou .item_block h3 {
		font-size: 31px;
		letter-spacing: 6px;
		margin-bottom: 24px;
	}
	/* contact */
	.totonou .item_block .contact {
		letter-spacing: 1px;
		padding: 15px 0;
	}
	/** shop_block **/
	.totonou .shop_block {
		margin-top: 120px;
	}
	/* title */
	.totonou .shop_block .title p {
		font-size: 24px;
		letter-spacing: 2px;
	}
	.totonou .shop_block .title h2 {
		font-size: 124px;
		letter-spacing: 14px;
		margin: 0 -100px;
	}
	.totonou .shop_block .title h3 {
		font-size: 38px;
		letter-spacing: 6px;
		margin-top: -40px;
	}
	/* shop_main */
	.totonou .shop_block figure.shop_main {
		margin: 0 -210px;
	}
	/* intro_box */
	.totonou .shop_block .intro_box {
		margin: -30px -130px 80px;
		padding: 60px 130px;
	}
	.totonou .shop_block .intro_box figure {
		margin: 0 0 50px;
	}
	.totonou .shop_block .intro_box h3 {
		font-size: 26px;
		letter-spacing: 6px;
		margin-bottom: 24px;
	}
	/* box */
	.totonou .shop_block .box {
		margin-bottom: 60px;
	}
	.totonou .shop_block .box figure {
		margin: 0 0 24px;
	}
	.totonou .shop_block .box figure figcaption {
		font-size: 13px;
		margin-top: 20px;
	}
	/* shop_info */
	.totonou .shop_block .shop_info {
		font-size: 14px;
		letter-spacing: 1px;
		padding: 15px 0;
	}
	/** campaign **/
	.totonou .campaign {
		border-radius: 40px;
		margin: 60px -100px 0;
		padding: 40px 0;
	}
	.totonou .campaign h3 {
		font-size: 23px;
		letter-spacing: 2px;
		margin: 0 50px 25px;
		height: 36px;
	}
	.totonou .campaign h3::before,
	.totonou .campaign h3::after {
		border: solid 18px transparent;
	}
	.totonou .campaign h3::before {
		border-left: solid 12px #F8DFD0;
	}
	.totonou .campaign h3::after {
		border-right: solid 12px #F8DFD0;
	}
	.totonou .campaign h2 {
		font-size: 60px;
		letter-spacing: 8px;
	}
	.totonou .campaign h2 span {
		font-size: 18px;
		letter-spacing: 2px;
		margin-bottom: 12px;
	}
	.totonou .campaign h4 {
		border-radius: 20px;
		letter-spacing: 2px;
		margin: 0 auto 20px;
		padding: 20px 20px 10px;
	}
	.totonou .campaign h4 em {
		font-size: 21px;
	}
	.totonou .campaign h4 span {
		font-size: 31px;
	}
	.totonou .campaign p {
		font-size: 14px;
		letter-spacing: 1px;
		margin-bottom: 20px;
	}
	.totonou .campaign p.exp span {
		font-size: 20px;
	}
	.totonou .campaign p.detail {
		background-color: #fff;
		padding: 20px 0;
	}
	/** present **/
	.totonouPresent h2.headline {
		font-size: 84px;
		letter-spacing: 16px;
		margin-bottom: 10px;
	}
	.totonouPresent .line_friends .innerBox .text {
		margin-bottom: 40px;
		padding-bottom: 40px;
	}
	.totonouPresent .line_friends .innerBox h2 p {
		margin-bottom: 20px;
	}
	.totonouPresent .line_friends .innerBox h2 em {
		font-size: 21px;
	}
	.totonouPresent .line_friends .innerBox h2 span {
		font-size: 32px;
	}
	.totonouPresent .line_friends .textBox p.borderPresent {
		border-radius: 50px;
		font-size: 16px;
		letter-spacing: 2px;
		margin-bottom: 10px;
		padding: 5px 10px;
	}
	.totonouPresent .line_friends .detailBox h3 p {
		font-size: 17px;
		margin-bottom: 10px;
	}
	.totonouPresent .line_friends .detailBox h3 p span {
		font-size: 12px;
		margin-bottom: 10px;
	}
	.totonouPresent .line_friends .detailBox p.period {
		font-size: 13px;
		padding: 5px 10px;
		left: 10px;
	}
}
@media screen and (max-width: 780px) {
	/** whats_cbd **/
	.totonou .whats_cbd {
		margin-bottom: 10vw;
		margin-top: 15vw;
	}
	.totonou .whats_cbd h2 {
		font-size: 5vw;
		padding: 3vw 0;
	}
	.totonou .whats_cbd h2::before {
		border-bottom: solid 2px #231815;
		top: -1.5vw;
	}
	.totonou .whats_cbd figure {
		left: 2vw;
		top: 25vw;
		width: calc(100% + -4vw);
	}
	.totonou .whats_cbd h3 {
		margin: 2vw 0 0;
	}
	/** ttl **/
	.totonou .ttl {
		padding-top: 8vw;
	}
	.totonou .ttl p {
		font-size: 6vw;
		margin: 0 auto 5vw;
		padding-bottom: 3vw;
		width: 50vw;
	}
	.totonou .ttl h2 {
		font-size: 5vw;
		padding: 3vw 0;
	}
	.totonou .ttl h2::before {
		border-bottom: solid 2px #231815;
		top: -1.5vw;
	}
	.totonou .item_ttl {
		margin: 0 -8vw;
		padding: 0 8vw;
		padding-top: 8vw;
	}

	/** item_block **/
	.totonou .item_block {
		margin: 0 -8vw 6vw;
		padding: 10vw 8vw;
	}
	.totonou .item_block figure {
		margin: 0 -8vw 10vw !important;
	}
	.totonou .item_block figure figcaption {
		bottom: -2vw;
	}
	.totonou .item_name {
		margin: 0 -2vw 6vw;
		padding: 2vw 0 1.4vw;
	}
	.totonou .item_name h2 {
		font-size: 18vw;
		letter-spacing: 1.5vw;
		line-height: 1.3;
		margin-bottom: -5vw !important;
		position: relative;
	}
	.totonou .item_name h2 .r {
		font-size: 6vw;
		top: 2vw;
	}
	.totonou .item_name p {
		font-size: 3.2vw;
		letter-spacing: .8vw;
	}
	.totonou .item_block h3 {
		font-size: 5.4vw;
		margin-bottom: 4vw;
	}
	.totonou .item_block#soundsbetter h2 {
		font-size: 10vw;
	}
	.totonou #soundsbetter .item_name h2 .r {
		font-size: 4vw;
	}
	.totonou .item_block#UNDBshop h3 {
		margin-left: -4vw;
	}
	.totonou .item_block#UNDBshop h3 span {
		letter-spacing: -5vw;
	}
	/* contact */
	.totonou .item_block .contact {
		letter-spacing: .2vw;
		padding: 3vw 0;
	}
	/** shop_block **/
	.totonou .shop_block {
		margin-top: 15vw;
	}
	/* title */
	.totonou .shop_block .title p {
		font-size: 5.2vw;
		letter-spacing: .4vw;
		margin-bottom: 2vw !important;
	}
	.totonou .shop_block .title h2 {
		font-size: 15vw;
		letter-spacing: 2vw;
		margin: 0 -8vw;
	}
	.totonou .shop_block .title h3 {
		font-size: 5.4vw;
		letter-spacing: .8vw;
		margin-bottom: 4vw;
		margin-top: -4vw;
	}
	/* shop_main */
	.totonou .shop_block figure.shop_main {
		margin: 0 -8vw;
	}
	/* intro_box */
	.totonou .shop_block .intro_box {
		margin: -6vw -4vw 14vw;
		padding: 6vw 5vw;
	}
	.totonou .shop_block .intro_box figure {
		margin: 0 0 5vw;
	}
	.totonou .shop_block .intro_box h3 {
		font-size: 5.4vw;
		letter-spacing: .6vw;
		margin-bottom: 3vw;
	}
	/* box */
	.totonou .shop_block .box {
		margin-bottom: 15vw;
	}
	.totonou .shop_block .box figure {
		margin: 0 0 4vw;
	}
	.totonou .shop_block .box figure figcaption {
		font-size: 2.8vw;
		margin-top: 4vw;
	}
	/* shop_info */
	.totonou .shop_block .shop_info {
		font-size: 3.2vw;
		letter-spacing: .2vw;
		padding: 2vw 0;
	}
	/** campaign **/
	.totonou .campaign {
		border-radius: 6vw;
		margin: 16vw 0 0;
		padding: 6vw 0;
	}
	.totonou .campaign h3 {
		box-sizing: border-box;
		font-size: 4vw;
		letter-spacing: .6vw;
		line-height: 1.2;
		margin: 0 5vw 4vw;
		padding-top: 3vw;
		height: 14vw;
	}
	.totonou .campaign h3::before,
	.totonou .campaign h3::after {
		border: solid 7vw transparent;
	}
	.totonou .campaign h3::before {
		border-left: solid 2vw #F8DFD0;
	}
	.totonou .campaign h3::after {
		border-right: solid 2vw #F8DFD0;
	}
	.totonou .campaign h2 {
		display: block;
		font-size: 11vw;
		letter-spacing: 1vw;
	}
	.totonou .campaign h2 span {
		display: block;
		font-size: 3.6vw;
		letter-spacing: .4vw;
		margin-bottom: 3vw;
		margin-top: -2vw;
	}
	.totonou .campaign h4 {
		border-radius: 4vw;
		display: block;
		letter-spacing: .2vw;
		margin: 0 5vw 4vw;
		padding: 4vw 4vw;
	}
	.totonou .campaign h4 em {
		font-size: 5vw;
	}
	.totonou .campaign h4 span {
		font-size: 8vw;
	}
	.totonou .campaign p {
		font-size: 3.2vw;
		letter-spacing: .2vw;
		font-weight: normal;
		margin-bottom: 2vw;
	}
	.totonou .campaign p.exp span {
		font-size: 4vw;
		font-weight: bold;
	}
	.totonou .campaign p.detail {
		font-weight: bold;
		padding: 4vw 0;
	}
	/** present **/
	.totonouPresent h2.headline {
		font-size: 10vw;
		letter-spacing: 2vw;
		margin-bottom: 2vw;
	}
	.totonouPresent .line_friends .innerBox .text {
		margin-bottom: 8vw;
		padding-bottom: 10vw;
	}
	.totonouPresent .line_friends .innerBox h2 p {
		margin-bottom: 4vw;
		line-height: .6;
	}
	.totonouPresent .line_friends .innerBox h2 em {
		font-size: 4vw;
	}
	.totonouPresent .line_friends .innerBox h2 span {
		font-size: 8vw;
	}
	.totonouPresent .line_friends .textBox p.borderPresent {
		border-radius: 6vw;
		font-size: 3.4vw;
		letter-spacing: .4vw;
		margin-bottom: 2vw;
		padding: .5vw 3vw;
	}
	.totonouPresent .line_friends .detailBox h3 p {
		font-size: 4vw;
		margin-bottom: 5vw;
	}
	.totonouPresent .line_friends .detailBox h3 p span {
		font-size: 3vw;
		margin-bottom: 3vw;
	}
	.totonouPresent .line_friends .detailBox p.period {
		font-size: 3.2vw;
		padding: 3vw 2vw;
		position: relative;
		width: 100%;
	}
	.totonouPresent .line_friends .detailBox p .pc {
		display: none;
	}
}