/* 基本CSS */
@media screen and (min-width:783px) {
.sp{
	display: none
}
}
@media screen and (max-width:782px) {
.pc{
	display: none
}
}


.contents{
	max-width: 1200px; width: 77%; margin: 0px auto
}
.contents_02{
	max-width: 1200px; width: 77%; margin: 0px auto
}
.bg_padding{
	padding: 150px 0
}

@media screen and (max-width:782px) {
.contents{
	width: 90%;
}
.contents_02{
	width: 90%;
}
.bg_padding{
	padding: 15% 0 15%
}
}


/* フォントCSS */
body {
	margin: 0;
	font-family: "Zen Maru Gothic", serif;
}
a img:hover{
	opacity: 0.7
}
/* 
body {
	font-family:'Barlow Semi Condensed', 'Noto Sans JP', sans-serif !important;
	color: #504346 !important
}
.weight100 {font-weight:100 !important}
.weight200 {font-weight:200 !important}
.weight300 {font-weight:300 !important}
.weight400 {font-weight:400 !important}
.weight500 {font-weight:500 !important}
.weight600 {font-weight:600 !important}
.weight700 {font-weight:700 !important}
.weight900 {font-weight:900 !important}
.en{font-size: 120%; letter-spacing: 1px}
*/
h1,h2,h3,h4,p{
	margin: 0;
	color: #43454a
	}

p{
	font-weight:400 !important; margin: 0; letter-spacing:2px;
}
h1{
	font-weight: 500 !important; letter-spacing:2px;
	}
h2 {
	font-weight: 500 !important; letter-spacing:2px; 
	}
h3 {
	font-weight: 500 !important; letter-spacing:2px; 
}
h4 {
	font-weight: 500 !important; letter-spacing:2px; 
}
table tr td{
	font-weight: 400 !important; letter-spacing:2px; 
	border-bottom:0px solid #fff
}
table {
	border-collapse:collapse;
	width: 100%
}
ul {
	padding: 0;
	margin: 0
}

p{
	font-size: 20px; line-height: 40px;
}
h1{
	font-size: 64px; line-height: 90px; 
	}
h2 {
	font-size: 48px; line-height: 68px; 
	}
h3 {
	font-size: 32px; line-height:54px;
}
h4 {
	font-size: 22px; line-height:35px;
}
table tr td{
	font-size: 20px; line-height: 40px;
}


@media screen and (max-width:782px) {
p{
	font-size: 17px !important; line-height: 30px !important;
}
p span{
	font-size: 17px !important; line-height: 24px !important;
}
h1{
	font-size: 32px !important; line-height: 52px !important;
}
h2 {
	font-size: 26px !important; line-height: 42px !important;
}
h3 {
	font-size: 20px !important; line-height: 32px !important;
}
h4 {
	font-size: 17px !important; line-height: 30px !important;
	font-weight:bold !important;
}

table tr td{
	font-size: 13px !important; line-height: 24px !important;
}
table tr td{
	display: block;
	width: 100% !important
}
.luxbar-item a {
	font-size: 15px !important;
	padding: 18px 0 18px 24px !important;
}
}

.center {
	text-align: center
}
.right{
	text-align: right
}
.left{
	text-align: left
}
.wt{
	color: #fff
}
.bb{
	text-decoration:underline
}


/* column_CSS */

.box {
	display: flex;flex-wrap: wrap
}

.box .column4{
	width: 22%;
	margin-right: 3%;
	margin-bottom: 3%
}
.box .column4:nth-child(4n){
	margin-right: 0
}

.box .column3{
	width: 31%;
	margin-right: 3%;
	margin-bottom: 3%
}
.box .column3:nth-child(3n){
	margin-right: 0
}
.box .column2{
	width: 48%;
	margin-right: 3%;
	margin-bottom: 3%
}
.box .column2:nth-child(2n){
	margin-right: 0
}


/* column(SP)_CSS */
@media screen and (max-width:782px) {
.box .column4{
	width: 100%;
	margin-right: 0;
	margin-bottom: 5%
}
.box .column4:nth-child(4n){
	margin-right: 0
}
.box .column3{
	width: 100%;
	margin-right: 0;
	margin-bottom: 5%
}
.box .column3:nth-child(3n){
	margin-right: 0
}
.box .column2{
	width: 100%;
	margin-right: 0;
	margin-bottom: 8%
}
.box .column2:nth-child(2n){
	margin-right: 0
}
}


/* ボタンリンク_CSS */
.btn_link {
	position: relative;
	transition: all 0.3s ease-in-out;
	border: 1px solid #000000;
	border-radius: 50px;
	background: #fff;
	width: 290px;
}
.btn_link:hover{
	opacity: 0.7;
	background: #ccc
}
.btn_link a{
	width: 100%;
	height: 100%;
	position: absolute;
	top:0;
	right:0
}
.btn_link p{
	font-weight: 200;
	padding: 3% 0 3% 10%;
	position: relative;
background: url(http://recelllabo.penginmilk.com/wp-content/uploads/2023/08/icon.png);
	background-repeat: no-repeat;
	background-position: 90%;
	background-size: 4%
}



@media screen and (max-width:1800px) {
.btn_link {
	width: 50%;
}
}

@media screen and (max-width:782px) {
.btn_link {
	width: 100% !important;
}
.btn_link p{
	padding: 3% 0 3% 5% !important;
}
.btn_link p{
	background-size: 2%;
	background-position: 94%;
}
}




/* ヘッダー_CSS */
#header{
	position: fixed;
	width: 90%;
	margin:0 auto !important;
	left: 0;
	right:0;
	padding: 3% 0 0;
	z-index: 99
}
#header .logo{
	float: left;
	width: 30%;
}
#header .btn{
	float: right;
	width: 50%;
}

@media screen and (max-width:782px) {
#header{
	width: 93%;
	padding: 5% 0 0
}
#header .logo{
	float: left;
	width: 50%;
}
#header .btn{
	float: right;
	width: 25%;
}
#header .box{
	display: flex !important;
	width: 100%;
	float: left;
}

#header .column2{
	width: 40% !important;
	margin:0 auto;
	color: #38b9e0
}

}


/* 問い合わせ_CSS */
#contact {
	background: url("http://recelllabo.penginmilk.com/wp-content/uploads/2023/08/top_bg03.png");
	background-size:cover;
}
#contact .box .column2{
	margin-bottom: 0
}
#contact .box .column2:nth-child(2){
	padding-top: 3%;
	filter: drop-shadow(3px 3px 10px rgba(0,0,0,0.5));
}

@media screen and (max-width:782px) {
#contact .box .column2:nth-child(1){
	width: 65%;
	margin: 0 auto 5%
}
#contact .box .column2:nth-child(2){
	width: 70%;
	margin: 0 auto
}
}




/* フッター_CSS */
#footer .logo{
	margin:0 auto;
	width: 40%
}

@media screen and (max-width:782px) {
#footer{
	text-align: center
}
#footer .logo{
	margin:0 auto;
	width: 60%
}

}



#copy {
	background: #38b9e0;
	padding: 5px 0
}
#copy ul  {
	display: flex;
	padding-top: 2%
}
#copy ul li {
	list-style: none !important;
	margin-right: 5%;
}
#copy ul li a {
	color: #fff;
	text-decoration: none
}
#copy p{
	text-align: right;

}
#copy .column2{
	margin-bottom: 0
}
@media screen and (max-width:782px) {
#copy ul  {
	text-align: center;
	display: block;
	margin: 10% 0
}
#copy ul li {
	text-align: center;
	margin-bottom: 5%
}
#copy p{
	text-align: center
}
}