@charset "utf-8";


/*----------------------------------------------
	Overall settings
-----------------------------------------------*/
body{
	color:#645E49;
	text-align:center;
}
#wrapper{ position: relative;}
a{ color:#645E49; text-decoration:none; -webkit-transition: all .2s; transition: all .2s;}
a:hover{ opacity: .7; text-decoration:none;}
img.imgalpha, .svg path, .svg polygon{ -webkit-transition: all .2s; transition: all .2s;}
.svg{ vertical-align: middle;}
/* font */
.gothic{ font-family: "Noto Sans JP","Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;}
.mincho{ font-family: "Shippori Mincho", 游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN",HGS明朝E,メイリオ,Meiryo,serif;}
.noto-sans-jp {
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
}
.shippori {
  font-family: "Shippori Mincho", serif;
  font-style: normal;
}
.playfair {
  font-family: "Playfair Display", serif;
  font-optical-sizing: auto;
  font-style: normal;
}
.belleza {
  font-family: "Belleza", sans-serif;
  font-weight: 400;
  font-style: normal;
}
.bodoni-moda {
  font-family: "Bodoni Moda", serif;
  font-optical-sizing: auto;
  font-style: normal;
}
/* color */
.f-green{ color: #5AB5B2;}
.f-red{ color: #D71519;}

/*------------------------------ responsive ------------------------------*/
@media screen and (max-width: 959px) {
	a:hover{ opacity: 1;}
}
@media screen and (max-width: 559px) {
}




/*----------------------------------------------
	header
-----------------------------------------------*/
header{
	width: 100%;
	height: 120px;
	margin: 0 auto;
	position: fixed;
	z-index: 99;
	top: 0;
	left: 0;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	transition: all .2s;
}
header .headerwrap{
	display: flex;
	justify-content: space-between;
	align-items: center;
	z-index: 999;
	padding-top: 20px;
}
header .logo{
	width: 240px;
	margin-left : 20px;
}
header .logo a:hover{ opacity: 1;}
header .logo .off{ display: none;}
header .headerwrap .exclusive{
	color: #5AB5B2;
	font-size: 15px;
	line-height: 1.2;
	font-weight: 500;
	border: 2px solid #5AB5B2;
	padding: 5px 15px;
	background: #fff;
	margin-left: 15px;
}
header .spmenu{ display: none;}
/* nav */
header nav{
	font-size: 14px;
	line-height: 1.4;
	display: flex;
	justify-content: flex-end;
	padding: 25px 25px 0 0;
	position: relative;
	z-index: 99;
}
header nav a{ display: block;}
header nav ul li span,header nav .header-contact span{
	color: #000;
	font-size: 16px;
}
header nav em{ color: #A08101; display: block; font-family: "Playfair Display", serif;}
header nav ul{
	display: flex;
	padding: 0 5px;
	border-radius: 199px;
	background: #fff;
	box-shadow: 0 0 13px rgba(0,0,0,.1);
}
header nav ul li{
	padding: 11px 15px 10px;
	position: relative;
}
header nav ul li div{
	font-family: "Playfair Display", serif;
	text-align: left;
	position: absolute;
	top: 100%;
	left: 0;
	width: 280px;
	height: 0;
	overflow: hidden;
	background: #fff;
}
header nav ul li:hover div{
	height: auto;
	padding-bottom: 5px;
}
header nav ul li div a{
	color: #645E49;
	padding: 5px 15px 5px 2em;
	position: relative;
}
header nav ul li div a:last-child{ margin-bottom: 0;}
header nav ul li div a:before{
	content: "・";
	position: absolute;
	top: .45em;
	left: .8em;
}
header nav .header-contact{
	text-align: center;
	padding: 0 5px;
	border-radius: 199px;
	background: #5AB5B2;
	box-shadow: 0 0 13px rgba(0,0,0,.1);
	margin-left: 12px;
}
header nav .header-contact a{ padding: 11px 32px 10px;}
header nav .header-contact a span,header nav .header-contact a em{ color: #fff;}
header nav .nav-sp{ display: none;}

@media screen and (max-width: 1250px) {
	header nav ul li{  padding: 13px 10px 14px;}
}
@media screen and (max-width: 1200px) {
	header.bg-white{
		height: 70px;
		background: #fff;
	}
	header .headerwrap{
		padding-top: 8px;
		justify-content: flex-start;
	}
	header .logo{
		min-width: 152px;
		width: 40%;
		margin-left: 8px;
	}
	header.open .logo .on{ display: none;}
	header.open .logo .off{ display: inline-block;}
	header .headerwrap .exclusive{
		font-size: 13px;
		padding: 3px 10px;
		margin-left: 10px;
	}
	header.open .headerwrap .exclusive{
		color: #fff;
		border: 2px solid #fff;
		background: none;
	}
	header .spmenu{
		color: #A08101;
		font-size: 10px;
		font-family: "Shippori Mincho", serif;
		display: block;
		float: right;
		width: 55px;
		height: 55px;
		cursor: pointer;
		z-index: 101;
		position: absolute;
		top: 8px;
		right: 8px;
		border-radius: 99px;
		background: #fff;
		padding-top: 27px;
		box-shadow: 0 0 13px rgba(0,0,0,.1);
	}
	header.open .spmenu{ background: none; box-shadow: none;}
	header .spmenu span,
	header .spmenu span:before,
	header .spmenu span:after{
		position: absolute;
		display: block;
		width: 4px;
		height: 4px;
		border-radius: 4px;
		background: #707070;
	}
	header .spmenu span{
		top: 22px;
		left: 15px;
	}
	header .spmenu span:before,header .spmenu span:after{ content: ""; left: 0;}
	header .spmenu span:before{ left: 11px;}
	header .spmenu span:after{ left: 22px;}
	header.open .spmenu span,
	header.open .spmenu span:after{
		width: 40px;
		height: 1px;
		background: #fff;
	}
	header.open .spmenu span{
		top: -5px;
		left: 7px;
		-webkit-transform: translateY(20px) rotate(-40deg);
		transform: translateY(20px) rotate(-40deg);
	}
	header.open .spmenu span:after{
		-webkit-transform: translateY(-20px) rotate(80deg);
		transform: translateY(-20px) rotate(80deg);
		top: 20px;
		left: 0;
	}
	header.open .spmenu span:before{ opacity: 0;}
	header .spmenu em.off{ display: none;}
	header.open .spmenu em.on{ display: none;}
	header.open .spmenu em.off{ color: #fff; display: block;}
	/* nav */
	header nav{
		text-align: left;
		font-size: 5.33vw;
		overflow: auto;
		display: block;
		position: absolute;
		z-index: 99;
		top: 0;
		width: 100%;
		left: 0;
		-webkit-transform: scale(1, 0);
		transform: scale(1, 0);
		-webkit-transform-origin: center top;
		transform-origin: center top;
		opacity: 0;
		height: 100vh;
	}
	header.open nav{
		padding: 80px 5vw 10vw 10vw;
		opacity: 1;
		-webkit-transform: scale(1);
		transform: scale(1);
		background-image: linear-gradient(90deg, #75D6D3 0, #5AB5B2 100%);
	}
	header.open nav:before{
		content: "";
		position: fixed;
		left: 0;
		top: -80px;
		display: block;
		width: 100%;
		height: 100%;
		z-index: -1;
	}
	header nav ul{
		display: block;
		background: none;
		border-radius: 0;
		box-shadow: none;
	}
	header nav em{ color: #000;}
	header nav ul li{
		padding: 3vw 0;
	}
	header nav ul li span{ display: none;}
	header nav ul li span, header nav .header-contact span{ font-size: 3.2vw;}
	header nav .header-contact{
		color: #645E49;
		line-height: 1;
		background: rgba(255,255,255,.65);
		width: 80%;
		margin-top: 8vw;
	}
	header nav .header-contact a{ padding: 3vw;}
	header nav .header-contact a span, header nav .header-contact a em{ color: #645E49;}
	header nav .nav-sp{ display: block;}
	header nav ul li div{
		font-size: 4vw;
		position: static;
		width: auto;
		height: auto;
		background: none;
		padding-top: 2vw;
	}
	header nav ul li div a{
		color: #000;
		padding-left: 1.5em;
	}
	header nav ul li div a::before{ left: 0;}
	header nav ul li div a strong{ font-weight: normal;}
	header nav ul li .outside{
		display: inline-block;
		padding-right: 25px;
		padding-left: 0;
		background: url("../images/ic-outside.svg") right center no-repeat;
	}
	header nav ul li:hover div{ padding-bottom: 0;}
	header nav .sp-f13vw{ font-weight: 300;}
}
@media screen and (max-width: 365px) {
	header .headerwrap .exclusive{ font-size: 3.2vw; padding:  1vw;}
}



/*----------------------------------------------
	contents
-----------------------------------------------*/
.wrap,
.wrap1000{
	clear: both;
	box-sizing: content-box;
	max-width: 1100px;
	margin-left: auto;
	margin-right: auto;
	padding-left: 4%;
	padding-right: 4%;
}
.wrap1000{
	max-width: 1000px;
}
.f16{ font-size: 16px; line-height: 1.6;}
.f20{ font-size: 20px; line-height: 1.6;}

.ttl1{
	color: #B99A19;
	font-size: 46px;
	font-weight: 300;
	font-family: "Playfair Display", serif;
	text-align: left;
	line-height: 1.4;
}
.ttl1 span.sub{
	color: #645E49;
	font-size: 24px;
	display: block;
}
.ttl1 small{
	color: #645E49;
	font-size: 14px;
	font-family: "Noto Sans JP", sans-serif;
	display: block;
}
.ttl2{
	padding-bottom: .5em;
	font-size: 20px;
	font-weight: 600;
	line-height: 1.5;
	text-align: left;
	border-bottom: 1px solid #5AB5B2;
}
.ttl3{
	font-size: 22px;
	font-weight: 600;
	line-height: 1.5;
}
.ttl4{
	font-size: 18px;
	font-weight: normal;
	text-align: left;
}
.ttl4 span{
	font-size: 30px;
}
.ttl5{
	font-size: 18px;
	font-weight: normal;
}
.ttl5 span{
	font-size: 30px;
	font-weight: 600;
}
.btn1{
	color: #A0A0A0;
	font-size: 16px;
	text-align: center;
	font-family: "Playfair Display", serif;
	background: url("../images/btn.svg") center no-repeat, url("../images/ic-arrow.svg") right 15px center no-repeat;
	width: 154px;
	line-height: 51px;
	padding: 10px 25px;
	display: inline-block;
}
.btn2{
	display: inline-block;
	color: #fff;
	font-size: 20px;
	text-align: center;
	font-family: "Shippori Mincho", 游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN",HGS明朝E,メイリオ,Meiryo,serif;
	background: url("../images/ic-arrow-white2.svg") right 1.5em center no-repeat #5AB5B2;
	width: 100%;
	max-width: 380px;
	line-height: 3.7;
	border-radius: 100px;
}
.arrow{
	color: #A0A0A0;
	display: inline-block;
	padding-right: 20px;
	background: url("../images/ic-arrow.svg") right center no-repeat;
}
.outside{
	display: inline-block;
	padding-left: 20px;
	background: url("../images/ic-outside.svg") left center no-repeat;
}
.arrow.outside{
	color: #645E49;
	background: url("../images/ic-arrow.svg") right center no-repeat,
				url("../images/ic-outside.svg") left center no-repeat;
}
.lower-main{
	height: 308px;
	padding-top: 150px;
	background: url("../images/lower-ttl.jpg") center / cover no-repeat;
}
.pnav{
	display: flex;
	justify-content: end;
	color: #A0A0A0;
	font-size: 12px;
	padding: 1em 0 50px;
}
.pnav li:not(:last-child):after{
	content: "/";
	display: inline-block;
	margin: 0 .5em;
}
.table1{
	width: 100%;
	text-align: left;
	line-height: 2;
}
.table1 th{
	width: 8em;
	padding: 1em 0;
	border-bottom: 1px solid #D6D6D6;
}
.table1 th.w12em{ width: 12em;}
.table1 td{
	padding: 1em 0;
	border-bottom: 1px solid #D6D6D6;
}
.anc-wrap{ position: relative;}
.anc-wrap .anc{
	position: absolute;
	top: -120px;
	left: 0;
	height: 0;
	display: block;
}
.link-no{ pointer-events: none;}

/*------------------------------ responsive ------------------------------*/
@media screen and (max-width: 1200px) { .anc-wrap .anc{ top: -70px;}}
@media screen and (max-width: 559px) {
	.f16{ font-size: 4.8vw;}
	.f20{ font-size: 5.33vw;}
	.ttl1{ font-size: 8vw;}
	.ttl1 span.sub{ font-size: 4.8vw; line-height: 1; margin-top: -.3em;}
	.ttl1 small{ font-size: 4.266vw;}
	.ttl2{
		font-size: 4.8vw;
	}
	.ttl3{
		font-size: 5.86vw;
	}
	.ttl4{
		font-size: 4.266vw;
	}
	.ttl4 span{
		font-size: 8vw;
	}
	.ttl5{
		font-size: 3.73vw;
	}
	.ttl5 span{
		font-size: 8vw;
	}
	.btn1{
		font-size: 16px;
	}
	.btn2{
		font-size: 5.33vw;
		max-width: inherit;
	}
	.lower-main{
		height: 46vw;
		padding-top: 23vw;
		background: url("../images/lower-ttl-sp.jpg") center / cover no-repeat;
	}
	.pnav{
		display: none;
	}
	.table1{
		line-height: 2;
	}
	.table1 th{
		display: block;
		width: auto;
		padding: 1em 0 0;
		border-bottom: none;
	}
	.table1 td{
		display: block;
		padding: 0 0 1em;
		border-bottom: 1px solid #D6D6D6;
	}
}



/*----------------------------------------------
	footer
-----------------------------------------------*/
dl.fix-bnr{
	color: #fff;
	position: fixed;
	z-index: 99;
	right: 0;
	bottom: 0;
	width: 320px;
	padding: 12px 0;
	background-image: linear-gradient(90deg, #75D6D3 0, #5AB5B2 100%);
	border-radius: 10px 0 0 0;
}
dl.fix-bnr dt{
	font-size: 16px;
	letter-spacing: .12em;
	line-height: 1.4;
	margin-bottom: 5px;
}
dl.fix-bnr dd{
	font-size: 18px;
	font-weight: 600;
	line-height: 1.4;
	text-align: left;
	display: flex;
}
dl.fix-bnr dd a{
	color: #fff;
	padding: 0 40px 0 15px;
	width: 50%;
	display: block;
	background: url("../images/ic-arrow-white.svg") right 15px center no-repeat;
	border-left: 1px solid #D6D6D6;
}
dl.fix-bnr dd a:first-child{ border-left: none;}
footer{
	color: #000;
	font-size: 16px;
	padding: 25px 3% 20px;
	background-image: linear-gradient(90deg, #75D6D3 0, #5AB5B2 100%);
}
footer a{ color: #000;}
footer .footer-logo{ margin-bottom: 25px;}
footer .footer-logo img{ width: 195px;}
footer .footer-logo a:hover{ opacity: 1;}
footer nav{
	line-height: 1.4;
	display: flex;
	justify-content: space-between;
	padding: 0 2%;
	margin-bottom: 10px;
}
footer nav dl{
	text-align: left;
	font-family: "Playfair Display", serif;
	margin-left: 1em;
}
footer nav dl dt{
	font-size: 18px;
	margin-bottom: 25px;
}
footer nav dl dt.f15{
	font-weight: 200;
	margin-bottom: 15px;
}
footer nav dl dd{
	font-family: "Shippori Mincho", serif;
	margin-bottom: 1.5em;
}
footer nav dl dd a{
	display: block;
	padding: 5px 0 5px 1em;
	position: relative;
}
footer nav dl dd a:before{
	content: "・";
	position: absolute;
	top: .45em;
	left: 0;
}
footer nav dl dd a strong{ font-weight: normal;}
footer nav dl dd a .outside{
	padding: 0 25px 0 0;
	background: url("../images/ic-outside.svg") right center no-repeat;
}
footer nav div{ max-width: 250px; margin-left: 1em;}
footer nav div .footer-contact{
	font-size: 18px;
	font-family: "Playfair Display", serif;
	line-height: 1.2;
}
footer nav div .footer-contact a{
	color: #645E49;
	border-radius: 199px;
	background: rgba(255,255,255,.65);
	box-shadow: 0 0 13px rgba(0,0,0,.1);
	padding: 13px 32px 14px;
	display: block;
}
footer nav div .footer-contact span{ font-size: 16px;}
footer .footer2{
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
}
footer .footer2 dl{
	color: #fff;
	display: flex;
	align-items: center;
}
footer .footer2 dl dt{
	margin-right: 15px;
}
footer .footer2 dl dd{
	display: flex;
	align-items: center;
}
footer .footer2 dl dd a{
	display: block;
	margin-left: 30px;
}
footer .footer2 .copy{
	color: #898888;
	font-size: 14px;
}

/*------------------------------ responsive ------------------------------*/
@media screen and (max-width: 1230px) {
	footer{ padding: 25px 2% 20px;}
}
@media screen and (max-width: 768px) {
	footer{
		font-size: 4.266vw;
		padding: 6vw 3vw;
	}
	footer .footer-logo{ margin-bottom: 7vw;}
	footer nav{
		display: block;
		margin-bottom: 2vw;
	}
	footer nav dl{
		margin: 0 0 7vw;
		padding: 0 0 0 8vw;
	}
	footer nav dl dt{
		font-size: 5.066vw;
		margin-bottom: 5vw;
	}
	footer nav dl dt.f15{ margin-bottom: 1em;}
	footer nav dl dd a{ padding: 1vw 0 1vw 1.2em;}
	footer nav div{ max-width: 250px; margin: 10vw auto 0;}
	footer nav div .footer-contact{ font-size: 5.6vw;}
	footer nav div .footer-contact a{ padding: 4vw;}
	footer nav div .footer-contact span{ font-size: 3.466vw;}
	footer .footer2{ display: block;}
	footer .footer2 dl{
		justify-content: center;
		margin-bottom: 2vw;
	}
	footer .footer2 dl dt{ margin-right: 3vw;}
	footer .footer2 dl dd a{ margin-left: 7vw;}
	footer .footer2 .copy{ font-size: 4.266vw;}
}
@media screen and (max-width: 559px) {
	dl.fix-bnr{
		padding: 2vw 0;
		width: 100%;
		border-radius: 0;
	}
	dl.fix-bnr dt{
		font-size: 4.266vw;
		margin-bottom: 1vw;
	}
	dl.fix-bnr dd{ font-size: 4.8vw;}
	dl.fix-bnr dd a{ padding: 0 10vw 0 8vw;}
}


















































/*--------------------------------------------------------------------------------------------
	Sub-page settings
----------------------------------------------------------------------------------------------*/
/*----------------------------------------------
	/
-----------------------------------------------*/
.top1{
	text-align: left;
	padding: 50px 0 110px;
	background: url("../images/top-bg1.jpg") center top / cover no-repeat;
}
.top1 .top-product{
	margin-bottom: 100px;
}
.top1 ul.product-list{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
.top1 ul.product-list li{
	font-size: 15px;
	line-height: 1.8;
	width: 50%;
	position: relative;
	display: flex;
	margin-bottom: 60px;
}
.top1 ul.product-list li:nth-child(2n){ padding-left: 4%;}
.top1 ul.product-list li:nth-child(2n+1){ padding-right: 5%;}
.top1 ul.product-list li:nth-child(2n+1):after{
	content: "";
	width: 1px;
	height: 80%;
	position: absolute;
	top: 0;
	right: 0;
	background: #E6E6E6;
}
.top1 ul.product-list li figure{
	text-align: center;
	width: 42%;
	margin-bottom: 30px;
}
.top1 ul.product-list li div{
	flex: 1;
	position: relative;
	padding-bottom: 80px;
}
.top1 ul.product-list li div .product-name{
	color: #5AB5B2;
	font-size: 21px;
	line-height: 1.6;
	font-weight: 600;
}
.top1 ul.product-list li div .bd-top{
	margin-top: 8px;
	border-top: 1px solid #E6E6E6;
	padding-top: 8px;
}
.top1 ul.product-list li div .btn1{
	position: absolute;
	right: 0;
	bottom: 0;
}
.top1 .top-product dl.hope{
	display: flex;
	align-items: center;
	padding-bottom: 10px;
	border-bottom: 1px solid #A0A0A0;
	margin-bottom: 30px;
}
.top1 .top-product dl.hope dt{
	font-size: 24px;
	margin-right: 80px;
}
.top1 .top-product .btn-area{
	display: flex;
	justify-content: space-between;
}
.top1 .top-product .btn-area a{
	display: block;
	background: #fff;
	padding: 40px 20px 10px 45px;
	position: relative;
	width: 49%;
}
.top1 .top-product .btn-area a strong{
	color: #B99A19;
	font-size: 35px;
	font-weight: normal;
}
.top1 .top-about .imgleft{
	display: flex;
	justify-content: space-between;
}
.top1 .top-about .imgleft figure{ width: 50%;}
.top1 .top-about .imgleft figure img{ border-radius: 500px;}
.top1 .top-about .imgleft div{
	font-size: 15px;
	width: 34%;
}
.top2{
	text-align: left;
	padding: 6vw 0;
	background: url("../images/top-bg2.jpg") right center / cover no-repeat;
}
.top2 .top-before-after{ margin-bottom: 15px;}
.top2 section a{
	display: block;
	background: #fff;
	padding: 40px 20px 15px calc(50% - 500px);
	width: 49%;
	position: relative;
}
.top2 section a{
	background: transparent;
	/* Note: currently only Safari supports backdrop-filter */
	backdrop-filter: blur(14px);
	--webkit-backdrop-filter: blur(14px);
	background-color: rgba(255, 255, 255, 0.03);
}
.top3{
	padding: 70px 0 80px;
	background: url("../images/top-bg3.jpg") center / cover no-repeat;
}
.top3 .top-support h2{
	color: #A0A0A0;
	font-size: 24px;
	line-height: 1.2;
	font-weight: normal;
	margin-bottom: 50px;
}
.top3 .top-support .btn-area{
	text-align: left;
	display: flex;
	justify-content: space-between;
}
.top3 .top-support .btn-area a{
	line-height: 1.9;
	display: block;
	width: 49%;
	border: 2px solid #aedad8;
	padding: 8px;
	background: rgba(255,255,255,.47);
}
.top3 .top-support .btn-area a div{
	border: 1px solid #DBEAE9;
	padding: 30px 15px 5px 45px;
	height: 100%;
}
.top3 .top-support .btn-area a div .read{
	font-size: 20px;
	margin-bottom: 5px;
}
.top3 .top-support .btn-area a div .f-green{
	color: #5AB5B2;
	font-size: 35px;
	line-height: 1.1;
}
/*------------------------------ responsive ------------------------------*/
@media screen and (max-width: 559px) {
	.top1{
		padding: 5vw 0 15vw;
		background: url("../images/top-bg1-sp.jpg") center / cover no-repeat;
	}
	.top1 .top-product{ margin-bottom: 20vw;}
	.top1 ul.product-list{
		display: block;
	}
	.top1 ul.product-list li{
		font-size: 4vw;
		width: 100%;
		display: block;
		margin-bottom: 12vw;
	}
	.top1 ul.product-list li:nth-child(2n){ padding-left: 0;}
	.top1 ul.product-list li:nth-child(2n+1){ padding-right: 0;}
	.top1 ul.product-list li:nth-child(2n+1):after{ content: none;}
	.top1 ul.product-list li figure{
		width: 100%;
		margin-bottom: 0;
	}
	.top1 ul.product-list li div{
		padding-bottom: 0;
	}
	.top1 ul.product-list li div .product-name{ font-size: 5.866vw;}
	.top1 ul.product-list li div .bd-top{
		margin-top: 1vw;
		padding-top: 1vw;
		margin-bottom: 1vw;
	}
	.top1 ul.product-list li div .btn1{ position: static;}
	.top1 .top-product dl.hope{
		display: block;
		padding-bottom: 4vw;
		margin-bottom: 2vw;
	}
	.top1 .top-product dl.hope dt{
		font-size: 6.4vw;
		line-height: 1.4;
		margin: 0 0 1vw;
	}
	.top1 .top-product .btn-area{ display: block;}
	.top1 .top-product .btn-area a{
		padding: 12vw 2vw 1vw 5vw;
		width: 100%;
		margin-bottom: 5vw;
	}
	.top1 .top-product .btn-area a strong{ font-size: 8vw; line-height: 1.2;}
	.top1 .top-about .imgleft{
		display: block;
	}
	.top1 .top-about .imgleft figure{ width: 100%; margin-bottom: 8vw;}
	.top1 .top-about .imgleft div{
		font-size: 4vw;
		width: 100%;
	}
	.top2{
		padding: 92vw 3% 10vw;
		background: url("../images/top-bg2-sp.jpg") center top / cover no-repeat;
	}
	.top2 .top-before-after{ margin-bottom: 5vw;}
	.top2 section a{
		padding: 8vw 2vw 2vw 5vw;
		width: 100%;
	}
	.top3{
		padding: 15vw 0 8vw;
		background: url("../images/top-bg3-sp.jpg") center top / cover no-repeat;
	}
	.top3 .top-support h2{
		font-size: 6.4vw;
		margin-bottom: 5vw;
	}
	.top3 .top-support .btn-area{ display: block;}
	.top3 .top-support .btn-area a{
		width: 100%;
		padding: 1.6vw;
		margin-bottom: 5vw;
	}
	.top3 .top-support .btn-area a div{ padding: 8vw 2vw 2vw 3vw;}
	.top3 .top-support .btn-area a div .read{
		font-size: 5.066vw;
		margin-bottom: 1vw;
	}
	.top3 .top-support .btn-area a div .f-green{ font-size: 8vw;}
}



/*----------------------------------------------
	product/
-----------------------------------------------*/
.product1{
	display: flex;
	justify-content: space-between;
	margin-bottom: 30px;
}
.product1 figure{
	width: 45%;
	text-align: center;
}
.product1 figure img{
	width: 80%;
}
.product1 div{
	width: 49%;
	text-align: left;
}
.product1 div h2{
	margin-bottom: .3em;
	line-height: 1.5;
	font-weight: 600;
}
.product1 div .honbun{
	padding-top: 1em;
	line-height: 1.6;
	border-top: 1px solid #E6E6E6;
}
.product1 div h3{
	margin-bottom: .3em;
	font-weight: 600;
}
.product1 div table{
	width: 100%;
	line-height: 1.5;
}
.product1 div table th{
	width: 10.5em;
	height: 5em;
	padding: 1em .5em 1em 1.5em;
	vertical-align: middle;
	border: 1px solid #E6E6E6;
}
.product1 div table td{
	padding: 1em;
	vertical-align: middle;
	border: 1px solid #E6E6E6;
}
.product2{
	display: flex;
	flex-wrap: wrap;
	gap: 4.1%;
	margin-bottom: 50px;
}
.product2 li{
	width: 30.6%;
	text-align: left;
}
.product2 li dl{
	padding: 1.3em 0 0 3em;
	position: relative;
}
.product2 li dl dt{
	position: absolute;
	left: 0;
	top: 1em;
	color: #fff;
	font-weight: bold;
	text-align: center;
	width: 1.6em;
	line-height: 1.5;
	padding-bottom: .1em;
	background: #5AB5B2;
	border-radius: 50%;
}
.product3{
	padding: 1.7em 2.5em;
	margin-bottom: 50px;
	font-weight: bold;
	line-height: 2;
	text-align: left;
	background: #ECFAFA;
	border-radius: .8em;
}
.product4{
	display: flex;
	justify-content: space-between;
	margin-bottom: 80px;
}
.product4 a{
	display: flex;
	justify-content: space-between;
	width: 30.6%;
	padding: .5em 0;
	text-align: left;
	border: 1px solid #5AB5B2;
	border-radius: 1.5em;
	position: relative;
}
.product4 a:before,
.product4 a:after{
	content: "";
	display: block;
	position: absolute;
	z-index: 1;
	width: 10px;
	height: 10px;
	background: #fff;
}
.product4 a:before{ left: 1.5em; bottom: -1px;}
.product4 a:after{ right: .2em; top: 0;}
.product4 a figure{
	width: 35%;
}
.product4 a figure img{
	border-radius: 1.5em;
}
.product4 a div{
	flex: 1;
	padding: 1.5em .1em 2em 0;
	position: relative;
}
.product4 a div .ttl{
	margin-bottom: .5em;
	font-weight: 600;
	line-height: 1.5;
}
.product4 a div .more{
	position: absolute;
	right: 1em;
	bottom: 0;
	padding-right: 1.5em;
	color: #A0A0A0;
	background: url(../images/ic-arrow.svg) right center no-repeat;
}
.product5{
	display: flex;
	justify-content: space-between;
	margin-bottom: 50px;
}
.product5 figure{
	width: 30.6%;
}
.product5 p{
	width: 68%;
	text-align: left;
}
/*------------------------------ responsive ------------------------------*/
@media screen and (max-width: 559px) {
	.product1{
		display: block;
		margin-bottom: 3em;
		padding-top: 3em;
	}
	.product1 figure{
		width: auto;
	}
	.product1 figure img{
		margin-top: 0;
		width: 68%;
	}
	.product1 div{
		width: auto;
	}
	.product1 div table{
		border-top: 1px solid #E6E6E6;
	}
	.product1 div table th{
		display: block;
		width: auto;
		height: auto;
		padding: .5em 1em;
		border-top: none;
	}
	.product1 div table td{
		display: block;
		border-top: none;
	}
	.product2{
		display: block;
		margin-bottom: 3em;
	}
	.product2 li{
		width: auto;
		padding: 0 1.5em;
		margin-bottom: 2em;
	}
	.product3{
		margin-bottom: 3em;
	}
	.product4{
		display: block;
		padding: 0 1.5em;
		margin-bottom: 3em;
		overflow: hidden;
	}
	.product4 a{
		width: auto;
		margin-bottom: 2.5em;
	}
	.product4 a div .txt{
		font-size: 3.73vw;
	}
	.product4 a div .more{
		font-size: 4.8vw;
	}
	.product5{
		display: block;
		padding: 0 1.5em;
		margin-bottom: 3em;
	}
	.product5 figure{
		width: auto;
		margin-bottom: 1em;
	}
	.product5 p{
		width: auto;
	}
}



/*----------------------------------------------
	about/
-----------------------------------------------*/
.about1{
	padding-top: 50px;
	background: url(../images/about1-bg.png) center top / 1875px auto no-repeat;
}
.about1 .wrap1000{
	display: flex;
	justify-content: space-between;
	margin-bottom: 5em;
	text-align: left;
}
.about1 .wrap1000 div{
	width: 47%;
	margin-left: 7%;
}
.about1 .wrap1000 div h3{
	margin-bottom: .5em;
	font-weight: normal;
}
.about1 .wrap1000 figure{
	width: 37%;
	font-size: 15px;
	line-height: 1.33;
}
.about1 .wrap1000 figure img{
	margin-bottom: .5em;
}
.about1 .wrap1000 figure span{
	line-height: 2;
		font-weight: 600;
}
/*------------------------------ responsive ------------------------------*/
@media screen and (max-width: 559px) {
	.about1{
		padding-top: 3em;
		background: url(../images/about1-bg-sp.png) center top / 100% auto no-repeat;
		overflow: hidden;
	}
	.about1 .wrap1000{
		display: block;
	}
	.about1 .wrap1000 div{
		width: auto;
		margin-left: 2.5em;
	}
	.about1 .wrap1000 div h3{
		margin-bottom: .5em;
	}
	.about1 .wrap1000 figure{
		width: auto;
		font-size: 4.533vw;
		padding: 0 3%;
	}
}



/*----------------------------------------------
	beforeafter/
-----------------------------------------------*/
.bfaf1{
	display: flex;
	justify-content: space-between;
	margin-bottom: 30px;
}
.bfaf1 .leftcol{
	width: 49.4%;
	text-align: left;
}
.bfaf1 .rightcol{
	display: flex;
	justify-content: space-between;
	width: 49.4%;
}
.bfaf1 .rightcol figure{ width: 48%;}
.bfaf2 .fix-wrap{
	display: flex;
	justify-content: space-between;
	margin-bottom: 10px;
}
.bfaf2 .fix-wrap p{
	font-size: 20px;
	font-weight: 500;
	width: 47%;
	text-align: center;
	padding: 2px;
}
.bfaf2 .fix-wrap p.fix-before{ background: #DBDBDB;}
.bfaf2 .fix-wrap p.fix-after{ background: #BDE0DF;}
.bfaf2 h2{
	margin-bottom: .5em;
	font-weight: normal;
	text-align: left;
}
.bfaf2 ul{
	display: flex;
	justify-content: space-between;
	border-bottom: 1px solid #E6E6E6;
	margin-bottom: 1em;
}
.bfaf2 ul:last-child{ border-bottom: none;}
.bfaf2 ul li{
	display: flex;
	justify-content: space-between;
	width: 47%;
	margin-bottom: 1.3em;
}
.bfaf2 ul li:first-child{ position: relative; z-index: 1;}
.bfaf2 ul li:first-child:after{
	content: "";
	position: absolute;
	z-index: 2;
	top: 0;
	right: -50px;
	bottom: 0;
	background: url("../images/before-after-arrow.png") center / 35px 56px no-repeat;
	width: 35px;
	height: 56px;
	display: block;
	margin: auto 0;
}
.bfaf2 ul li figure{ width: 49.5%;}
/*------------------------------ responsive ------------------------------*/
@media screen and (max-width: 559px) {
	.bfaf1{
		display: block;
		margin-bottom: 3em;
	}
	.bfaf1 .leftcol{
		width: auto;
		margin-bottom: 1em;
	}
	.bfaf1 .rightcol{ width: auto;}
	.bfaf2 .fix-wrap{
		position: sticky;
		z-index: 2;
		top: 70px;
		margin-bottom: 2vw;
	}
	.bfaf2 .fix-wrap p{
		font-size: 5.33vw;
		line-height: 1.4;
		width: 45.4%;
		padding: .5vw;
	}
	.bfaf2 ul li{
		display: block;
		width: auto;
		width: 45.4%;
	}
	.bfaf2 ul li:first-child:after{
		right: -7.5vw;
		background: url("../images/before-after-arrow.jpg") center / 6.4vw auto no-repeat;
		width: 6.4vw;
		height: 8vw;
	}
	.bfaf2 ul li figure{
		width: 100%;
		margin-bottom: 1.2vw;
	}
	.bfaf2 ul li figure:last-child{ margin-bottom: 0;}
}



/*----------------------------------------------
	qa/
-----------------------------------------------*/
.qa1 dl{
	margin-bottom: 2em;
	font-weight: 600;
	text-align: left;
}
.qa1 dl dt{
	padding: .8em 5em .8em 2em;
	line-height: 1.5;
	position: relative;
	background: #ECFAFA;
	cursor: pointer;
}
.qa1 dl dt:before{
	display: inline-block;
	content: "";
	position: absolute;
	right: 2em;
	top: 50%;
	transform: translateY(-50%);
	width: 21px;
	height: 1px;
	background: #5AB5B2;
}
.qa1 dl dt:after{
	display: inline-block;
	content: "";
	position: absolute;
	right: 2.5em;
	top: 50%;
	transform: translateY(-50%);
	width: 1px;
	height: 21px;
	background: #5AB5B2;
}
.qa1 dl dt.open:after{
	display: none;
}
.qa1 dl dt span{
	display: block;
	padding-left: 1.5em;
	position: relative;
}
.qa1 dl dt span:before{
	content: "Q";
	position: absolute;
	left: 0;
	top: 0;
}
.qa1 dl dd{
	display: none;
	border: 1px solid #F2F2F2;
	padding: 1.2em 3em 1.2em 2em;
}
.qa1 dl dd .answer{
	padding-left: 1.5em;
	position: relative;
}
.qa1 dl dd .answer:before{
	content: "A";
	position: absolute;
	left: 0;
	top: 0;
}
.qa1 dl dd .morning,
.qa1 dl dd .night{
	padding-left: 1.5em;
	position: relative;
}
.qa1 dl dd .morning:before{
	display: inline-block;
	content: "朝";
	position: absolute;
	left: -.3em;
	top: 0;
	width: 1.5em;
	line-height: 1.4;
	text-align: center;
	border: 1px solid #645E49;
	border-radius: 50%;
}
.qa1 dl dd .night:before{
	display: inline-block;
	content: "夜";
	position: absolute;
	left: -.3em;
	top: 0;
	width: 1.5em;
	line-height: 1.4;
	text-align: center;
	border: 1px solid #645E49;
	border-radius: 50%;
}
.qa1 dl dd a{
	display: inline-block;
	padding-right: 1em;
	background: url(../images/ic-arrow.svg) right center no-repeat;
}
.qa1 dl dd a[target="_blank"]{
	padding-left: 1.5em;
	background: url(../images/ic-arrow.svg) right center no-repeat, url(../images/ic-blank.svg) left center no-repeat;
}
/*------------------------------ responsive ------------------------------*/
@media screen and (max-width: 559px) {
	.qa1 dl{
		margin-bottom: 1.5em;
	}
	.qa1 dl dt{
		padding: .8em 40px .8em 1.5em;
	}
	.qa1 dl dt:before{
		right: 15px;
	}
	.qa1 dl dt:after{
		right: 25px;
	}
	.qa1 dl dd{
		padding: 1.2em 1.5m 1.2em 2em;
	}
	.qa1 dl dd .answer{
		padding-left: 1.5em;
		position: relative;
	}
	.qa1 dl dd .answer:before{
		content: "A";
		position: absolute;
		left: 0;
		top: 0;
	}
	.qa1 dl dd a{
		background-size: .5em auto;
	}
	.qa1 dl dd a[target="_blank"]{
		background-size: .5em auto, 1em auto;
	}
}



/*----------------------------------------------
	contact/
-----------------------------------------------*/
.contact1{
	text-align: left;
	overflow: hidden;
}
.contact1 em{
	padding-left: .5em;
	font-weight: bold;
}
.contact1 input{
	width: 80%;
	font-size: 18px;
	padding: 0 1em;
	border: 1px solid #D6D6D6;
	border-radius: 6px;
}
.contact1 input::placeholder{
	color: #B5B4B4;

}
.contact1 input.max{
	width: 100%;
}
.contact1 textarea{
	font-size: 18px;
	padding: .5em 1em;
	border: 1px solid #D6D6D6;
	border-radius: 6px;
}
.contact2{
	padding: 2em;
	height: 350px;
	line-height: 2;
	background: #fff;
	border: 1px solid #D6D6D6;
	overflow-y: auto;
	word-break: break-all;
}
/*------------------------------ responsive ------------------------------*/
@media screen and (max-width: 559px) {
	.contact1 input{
		width: 100%;
		font-size: 16px;
	}
	.contact1 textarea{
		font-size: 16px;
	}
	.contact2{
		padding: 1em;
		height: 250px;
	}
}



/*----------------------------------------------
	handling/
-----------------------------------------------*/
.handling1{
	margin: 0 30px 3em;
	padding-top: 5em;
	background: #ECFAFA;
	border-radius: 10px;
}
/*------------------------------ responsive ------------------------------*/
@media screen and (max-width: 559px) {
	.handling1{
		margin: 0 5% 2em;
		padding-top: 2em;
	}
}



/*----------------------------------------------
	service/
-----------------------------------------------*/
.service1{
	display: flex;
	flex-wrap: wrap;
	gap: 2%;
}
.service1 article{
	width: 49%;
	border: 1px solid #D6D6D6;
	border-radius: 6px;
	margin-bottom: 30px;
}
.service1 article h3{
	line-height: 1.4;
	font-weight: 400;
	background: #ECFAFA;
	padding: 10px;
	border-radius: 6px 6px 0 0;
	border-bottom: 1px solid #D6D6D6;
}
.service1 article h3 span{ display: block;}
.service1 article .box{
	text-align: left;
	padding: 20px;
}
.service1 article .box1{
	display: flex;
	padding-bottom: 20px;
	border-bottom: 1px solid #D6D6D6;
	margin-bottom: 20px;
}
.service1 article .box1 figure{
	width: 180px;
	margin-right: 30px;
}
.service1 article .box1 figure img{ border-radius: 180px;}
.service1 article .box1 div{ flex: 1;}
.service1 article .box1 div h4{
	font-weight: 400;
	margin-bottom: 5px;
}
.service1 article .box1 div p{ margin-bottom: 5px;}
.service1 article .box2{
	display: flex;
	align-items: flex-start;
}
.tag{
	color: #000;
	display: inline-block;
	background: #9ED2D1;
	border-radius: 99px;
	padding: 5px .5em;
}
.service1 article .box2 .tag{
	width: 7em;
	margin-right: 15px;
}
.service1 article .box2 div{ flex: 1;}
/*------------------------------ responsive ------------------------------*/
@media screen and (max-width: 559px) {
	.service1{ display: block;}
	.service1 article{
		width: 100%;
		margin-bottom: 6vw;
	}
	.service1 article h3{ padding: 2vw;}
	.service1 article .box{ padding: 4vw;}
	.service1 article .box1{
		display: block;
		padding-bottom: 4vw;
		margin-bottom: 6vw;
	}
	.service1 article .box1 figure{
		text-align: center;
		width: auto;
		margin: 0 0 5vw;
	}
	.service1 article .box2 .tag{ width: fit-content;}
	.service1 article .box1 figure img{ width: 150px;}
	.service1 article .box2{ display: block;}
	.tag{ padding: .5vw .5em;}
	.service1 article .box2 .tag{ margin: 0 0 3vw;}
}



/*----------------------------------------------
	medical/
-----------------------------------------------*/
.medical1 article{
	text-align: left;
	display: flex;
	border: 1px solid #D6D6D6;
	border-radius: 6px;
	min-height: 120px;
	margin-bottom: 20px;
}
.medical1 article .bg-green{
	background: #ECFAFA;
	padding: 5px 50px 5px 30px;
	width: 35.7%;
	border-radius: 6px 0 0 6px;
}
.medical1 article .bg-green a{
	color: #5AB5B2;
	text-decoration: underline;
	display: flex;
	align-items: center;
	height: 100%;
	background: url("../images/ic-outside2.svg") right center no-repeat;
	padding-right: 15px;
}
.medical1 article .bg-green a.link-no{
	color: #999;
	text-decoration: none;
	background: none;
}
.medical1 article .tel-box{
	width: 26%;
	padding: 5px 25px;
}
.medical1 article .address-box{
	justify-content: flex-start;
	flex: 1;
	padding: 25px;
	border-radius: 0 6px 6px 0;
}
.medical1 article .tel-box,.medical1 article .address-box{ border-left: 1px solid #D6D6D6;}
.medical1 article .tel-box p,.medical1 article .address-box p{
	display: flex;
	align-items: center;
	height: 100%;
}
.medical1 article .tel-box p{ justify-content: center;}
.medical1 article .address-box p{ text-align: left;}
/*------------------------------ responsive ------------------------------*/
@media screen and (max-width: 559px) {
	.medical1 article{
		display: block;
		min-height: inherit;
		margin-bottom: 1em;
	}
	.medical1 article .bg-green{
		padding: 4vw 8vw;
		width: auto;
	}
	.medical1 article .tel-box{
		width: auto;
		padding: 4vw 8vw;
	}
	.medical1 article .tel-box p,.medical1 article .address-box p{ display: block;}
	.medical1 article .address-box{ padding: 4vw 8vw;}
	.medical1 article .tel-box,.medical1 article .address-box{
		border-left: none;
		border-top: 1px solid #D6D6D6;
	}
	.medical1 article .tel-box p{ justify-content: flex-start;}
}