/*------------------------------------------------------------------------------
  PC or ALL 
------------------------------------------------------------------------------*/
/* ----- common ----- */
body.home .page-content {
	max-width: calc(1200px + 4vmin);
	margin-bottom: 0;
}
/* hightlight */
.highlight {
  background: var(--sub-color);
  padding: 4vmin;
}
/* col */
@media screen and (min-width: 600px) {
	.row {
    &.reverse {
      flex-direction: row-reverse;
    }
    .col {
      &.col-1 { flex: 1; }
      &.col-2 { flex: 2; }
      &.col-3 { flex: 3; }
    }
  }
  .sp-only {
    display: none !important;
  }
}
@media screen and (min-width: 1025px) {
  .sp-only02 {
    display: none !important;
  }
}
@media screen and (max-width: 1024px) {
  .pc-only02 {
    display: none !important;
  }
}
@media screen and (max-width: 599px) {
  .pc-only {
    display: none !important;
  }
}
/* h2 */
.title-type02, .title-type04 {
	padding-bottom: 0;
	span:nth-child(2) {
		opacity: 1;
		font-weight: 500;
		font-size: 3.4rem;			
		@media screen and (min-width: 600px) {
			margin-top: 0.9em;	
		}
		@media screen and (max-width: 1024px) {
			font-size: 2.3rem;	
		}
	}
	@media screen and (max-width: 1024px) {
		img {
			max-width: calc( 100% / 2);
		}
	}	
}
.title-type02:before, .title-type04:before {
	content: none;
}
/* button */
.box .btn a,.btn01 a, .btn02 a, .btn03 a,.form-btn input {
	color: #2b2b2b;
	text-align: center;
	font-weight: 400;
	background: #fff;
	border: 1px solid #2b2b2b;
	border-radius: 0;
	display:inline-block;
	min-width: 200px;
	padding: 4px 30px;
	&.inverse {
		background: none;
		color: #fff;
		border: 1px solid #fff;
	}
}
.form-btn input {
	padding: 12px 50px;
}
.box .btn a:after,.btn01 a:after, .btn02 a:after, .btn03 a:after{
	content: none;
}
/* under-title */
.blog-content h2:not([class]), .page-content h2:not([class]),
.blog-content h3:not([class]), .page-content h3:not([class]),
.blog-content h4:not([class]), .page-content h4:not([class]) {
  margin: var(--text-margin) 0 calc(var(--text-margin) / 2);
}
/* col wrap */
.wrap {
	&.row.row-2 {
		flex-wrap: wrap;
		@media screen and (min-width: 600px) {
			.col {
				width: calc((100% / 2) - 15px);
			}
		}	
	}
	&.row.row-3 {
		flex-wrap: wrap;
		@media screen and (min-width: 600px) {
			.col {
				width: calc((100% / 2) - 15px);
			}
		}
		@media screen and (min-width: 1025px) {
			.col {
				width: calc((100% / 3) - 20px);
			}
		}		
	}
}
/* menu-table */
table.menu-table {
	border-collapse: separate;
	border-spacing: 5px;
	
	th,td {
		padding: 15px;
		vertical-align:middle;
	}
	thead {
		th {
			background: #2B2B2B;
			color:  var(--main-color);
			text-align: center;
		}
	}
	tbody {
		th {
			background: var(--main-color);
		}
		td {
			background: var(--sub-color);
		}
		.total {
			th {
				background: #2B2B2B;
				color: var(--main-color);
			}
			td {
				background: var(--main-color-2);
			}
		}
	}
}
/* ----- header ----- */
.drawer-open {
	border-radius: 0 0 0 20px;
}
.header{
	background: var(--sub-color);
	.header-inner {
		padding-left: 0;
		@media screen and (min-width: 1025px) {
			height: 136px;
		}
	}
	.header-nav {
		margin-bottom: 4vh;
	}
	.header-logo {
		max-width: 136px;
		width: 100%;
		height: 100%;
		aspect-ratio: 1 / 1;
		@media screen and (max-width: 1024px) {
			width: auto;
			height: 100px;
		}
		@media screen and (max-width: 599px) {
			height: 60px;
		}			
	}
}
/* ----- mainvisual ----- */
.mainvisual {
	background: var(--sub-color);	
	margin-bottom: 0;		 
	@media screen and (min-width: 1025px) {
		max-height: 800px;
		padding: 2vh 8vw 0;
		.mainvisual-catch {
			bottom: 10vh;
    		left: 16vw;
		}
		.swiper-slide {
			border-radius: 60px;
		}	
	}	
}
/* ----- footer ----- */
.footer {
	padding-top: 70px;
}
.footer-inner {
	font-size: 1.4rem;
	.footer-main {
		margin-bottom: 40px;
		padding-bottom: 40px;
	}
	.footer-main .logo {
		margin-bottom: 13px;
		@media screen and (min-width: 600px) {
			width: 130px;
		}		
	}	
	.footer-main .nav {
		margin-bottom: 15px;
	}
	.footer-main .about {
		line-height: calc(30 / 14);
		letter-spacing: 0.1em;
	}
	.footer-main dl {
		display:flex;
		justify-content: center;
	}
	.footer-main:after {
		background: #555555;
	}
}
.side-sns {
	right: 20px;
	.sns-icon-list {
		&:not(.ex) {
			display: none;
		}
		&.ex {
			gap: 30px;
			a {
				border: none;
				width: 120px;
				height: 120px;
				background: none;
				border-radius: 0;
			}
		}
	}
}
/* pagetop */
.pagetop {
	z-index: 99;
}
/* sns */
.sns-icon-list li a {
	border: 1px solid #fff;
}
/* fixeid */
.fixed-footer {
	background: #fff;
	color: #555;
	gap: 30px;
	@media screen and (max-width:1024px) {
		gap: 15px;
	}
	@media screen and (min-width: 600px) and (max-width: 767px) {
			gap: 10px;
		}
	p.ja {
		font-size: 2.4rem;
		@media screen and (max-width:1300px) {
			display: none;
		}
	}
	.tel a {		
		@media screen and (min-width: 600px) {
			margin: 0;
		}
		@media screen and (min-width: 1025px) {
			font-size: 4rem;
			letter-spacing: 0.1em;
		}
		@media screen and (min-width: 600px) and (max-width: 767px) {
			font-size: 2.5rem;
			letter-spacing: 0;
		}
	}
	.tel a:before {
		color: #555;
	}
	.contact a {
		font-size: 1.6rem;
		font-weight: 400;
		background: #2B2B2B;
		justify-content: center;
		min-width: 200px;
		@media screen and (min-width: 600px) and (max-width: 767px) {
			min-width: 100%;
		}
	}
	.contact a:before {
		content: none;
	}
}
/* ----- sec_check ----- */
.sec_check {
	&.box-wrap.bg {
		padding-block: 8% 0;
		margin-bottom: 0;
		@media screen and (max-width: 599px) {
			padding-block: 12% ;
		}
	}
	&.box-wrap.bg:before {
		height: 50%;
	}
	@media screen and (max-width: 599px) {
		&.box-wrap.bg:before {
			height: 100%;
		}		
	}
	.box.image-text-type02 {
		max-width: calc(1597px + 8vmin);
		margin: 0 auto;		
		gap: 30px;
		&.right .text:before {
			content: none;
		}
		@media screen and (min-width: 600px) {
			padding: 0 4vmin;
		}
		@media screen and (max-width: 1024px) {
			gap: 15px;
		}
	}
	.image-text-type02 .image {		
		@media screen and (min-width: 600px) {
			width: 50%;
			border-radius: 40px;
		}
		@media screen and (min-width: 1025px) {
			max-height: 600px;
			width: 56.5%;
		}
	}
	.image-text-type02 .text {
		padding: 0;
		margin: 0;
		.box-h3,.copy, p, .btn {
			max-width: 100%;
		}
		@media screen and (min-width: 600px) and (max-width: 1024px) {
			width: 50%;
		}
		h3 {
			font-size: 3.6rem;
			line-height: 1.6;
			@media screen and (min-width: 1025px) {
				margin-block: 4.5vh 5vh;
			}
			@media screen and (max-width: 1024px) {
				font-size: 2.8rem;
			}
			@media screen and (max-width: 599px) {
				font-size: 2rem;
				text-align: center;
			}
		}
		h3 span {
			font-size: 5rem;
			@media screen and (max-width: 1024px) {
				font-size: 4rem;
			}
			@media screen and (max-width: 599px) {
				font-size: 2.5rem;
			}
		}
	}
	.list-check-type01 {
		justify-content: flex-start;
		@media screen and (min-width: 1025px) {
			font-size: 2.4rem;
		}
		> ul > li {
			padding-left: 30px;
			@media screen and (min-width: 1025px) {
				padding-left: 35px;
			}
		}
		 > ul > li:before {
			content: '';
			 display: block;
			 width: 25px;
			 height: 20px;
			 background: url(/mwp/wp-content/uploads/2024/06/check.webp)no-repeat;
			 position:absolute;
			 top: 50%;
			 left: 0;
			 transform: translatey(-50%);
		}
		@media screen and (max-width: 599px) {
			> ul > li:before {
				top: 8px;
				transform:none;
			}			
		}
		p {
			margin:calc(var(--text-margin) / 2 )0;
		}		
	}
}
/* ----- sec_concept ----- */
.sec_concept {	
	padding-top: 17%;
	margin-bottom: 0;
	@media screen and (max-width: 599px) {
		padding: 12% 4vmin 0;
	}
	.title-type04 {
		@media screen and (min-width: 1025px) {
			margin-bottom:8vh;
		}		
		img {
			@media screen and (max-width: 1024px) {
				max-width: 90%;
			}
		}	
	}
	.image-text-type02 {		
		@media screen and (min-width: 600px) {
			padding: 0;
			margin: 0;
		}
		@media screen and (max-width: 599px) {
			margin-bottom: 5vh;
		}
		h3,.copy, p, .btn,.text img {
			position:relative;
			z-index:3;
			max-width: 580px;
		}
		.image {					
			@media screen and (min-width: 600px) {
				width: 57%;
				min-height: 32.5vmax;	
			}
		}
		.text {
			padding: 0;
			@media screen and (min-width: 600px) {	
				display: flex;
				flex-direction: column;
				justify-content: center;
				padding-block: 2em;
			}
			@media screen and (min-width: 1025px) {
				width: 31%;
			}
			@media screen and (min-width: 600px) and (max-width: 1024px) {
				padding-inline: 0 4vmin
			}
		}		
		@media screen and (max-width: 599px) {
			.text img {
				display: block;
				margin: 0 auto;
				max-width: calc( 100% / 4)!important;				
			}
		}
		.text h3 {
			background: none;
			padding: 0;			
			font-weight: 500;
			@media screen and (min-width: 600px) {
				font-size: 2.5rem;
			}
			@media screen and (min-width: 1025px) {
				margin: 4vh 0 3vh;
				font-size: 4rem;
			}
			@media screen and (max-width: 599px) {
				text-align: center;
			}
		}
		.text h3:after {
			content: none;
		}
		@media screen and (min-width: 600px) {
			.text p {
				line-height: calc( 40 / 16);			
			}
		}
		.text p {
			margin: 0;
		}
		@media screen and (min-width: 1921px) {
			& .image:before {
				content: '';
				display: block;
				width: 100%;
				height: 100%;
				position: absolute;
				top: 0;
				right: 0;
				z-index: 1;
				background: linear-gradient(90deg, rgba(255, 255, 255, 0) 40%,rgba(255, 255, 255, 0.2) 59%, rgb(255 255 255) 100%);
			}
		}
		& .text:before {
			top:0;
			left: -500px;
			z-index: 1;
   			 background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 193, 73, 1) 20%);
		}
		@media screen and (max-width: 1024px) {
			& .text:before {
				background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 193, 73, 1) 30%);
			}			
		}
		@media screen and (max-width: 599px) {
			& .text:before {
				top: -80px;
				left: 4vmin;
				height: calc(100% + 100px);
				z-index: -1;
			}			
		}
		/* right */
		&.right h3,.copy, p, .btn,.text img {
			max-width: 636px;
		}		
		@media screen and (min-width: 1921px) {
			&.right .image:before {
				background: linear-gradient(-90deg, rgba(255, 255, 255, 0) 40%,rgba(255, 255, 255, 0.2) 59%, rgb(255 255 255) 100%);
			}
		}
		&.right .text {
			@media screen and (min-width: 1025px) {		
				margin-right: 0
			}
			@media screen and (min-width: 600px) and (max-width: 1024px) {
				padding-inline: 4vmin 0;
			}
		}
		&.right .text:before {
   			 background: linear-gradient(-90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 168, 0, 1) 35%);
		}
		@media screen and (max-width: 599px) {
			&.right .text:before {
				left: -4vmin;
			}			
		}
	}
	@media screen and (max-width: 599px) {
		.image-text-type02:last-child {
			margin-bottom: 5%;
		}
	}	
}
/* ----- sec_price ----- */
.sec_price.box-wrap.bg {
	padding-block: 11.5% 0;
	margin-bottom: 0;
	@media screen and (max-width: 599px) {
		padding-block: 17% 0;
	}
	.image-bg-type01 {
		margin-bottom: 5vh;
	}
	.image-bg-type01 .image {
		@media screen and (min-width: 1025px) {
			height: 640px;
		}		
	}
	.image-bg-type01 .text {
		padding: 20px;
		padding-bottom: 20px;
		background: #2B2B2B;
		color: #fff;
		@media screen and (min-width: 1300px) {
			margin-inline: auto;			
			max-width: 1200px;
			.btn.en {
				margin-top: 5.4vh;
			}
		}
		@media screen and (min-width: 1025px) {
			margin-top: -300px;
		}
		@media screen and (max-width: 599px) {
			padding: 10px;
		}
		.inner {
			border: 1px solid #fff;
			padding: 6.1% 8% 7%;
		}
		p {
			line-height: calc( 40 / 16);
		}		
		.box.title-type04 {
			margin-bottom: 5.2vh;
			@media screen and (max-width: 1300px) {
				margin-bottom: 2vh;
			}	
		}
	}
	.box.row.row-3,.box.txt{
		max-width: calc(1200px + 8vmin);
		padding: 0 4vmin;
		font-weight: 600;
	}
	.box.row.row-3 {
		margin-bottom: 2.5vh;
		@media screen and (min-width: 1300px) {
			gap: 0;
		}	
	}
	.box.txt p{
		margin: 0;
	}
}
/* ----- sec_flow ----- */
.sec_flow {
	&.box-wrap.bg {
		padding-block: 13.5% 15%;
		margin-bottom: 0;
		@media screen and (max-width: 599px) {
			padding-block: 17% 12%;
		}
	}
	@media screen and (min-width: 1025px) {
		.box.title-type04 {
			margin-bottom: 8.5vh;
		}
	}
	.list-flow-type01:after {
		background: #EEEEEE;
		width: 20px;
		left: calc(248px + 4vmin);
	}
	@media screen and (max-width: 1200px) {
		.list-flow-type01:after {
			left: calc(242px + 4vmin);
		}
	}
	@media screen and (max-width: 1024px) {
		.list-flow-type01:after {
			width: 20px;
			left: calc(100px + 4vmin);
		}			
	}
	@media screen and (max-width: 599px) {
		.list-flow-type01:after {
			left: calc(10px + 4vmin);
		}
	}
	.list-flow-type01  {
		max-width: calc(1168px + 8vmin);
		padding: 0 4vmin;
		margin-bottom: 5.5%;
		> ul > li {
			@media screen and (min-width: 1025px) {
				padding-bottom:37px;
				justify-content: flex-start;
				gap: 95px;
			}
		}
		@media screen and (min-width: 1025px) {
			> ul > li:first-child .text {
				margin-top: 1vh;
			}
		}		
		> ul > li .icon {
			background: #2B2B2B;
			font-weight: 500;
			letter-spacing: 0.1em;
			@media screen and (min-width: 1025px) {
				width: 240px;
				font-size: 2.4rem;
				line-height: 1.73;
			}
		}
		> ul > li .icon:after {
			border-color: transparent transparent transparent #2B2B2B;
		}
		@media screen and (max-width: 599px) {
			> ul > li .icon:after {
				border-color: #2B2B2B transparent transparent transparent;
			}
		}
		> ul > li .text {
			h3.box-h3 {
				font-size: 2.4rem;
				font-weight: 500;				
				@media screen and (min-width: 1025px) {
					margin-bottom: 3.5vh;
				}
				@media screen and (max-width: 599px) {
					font-size: 2rem;
				}
			}
			@media screen and (min-width: 600px) {
				p {
					line-height: calc(40 / 16);	
				}				
			}				
		}
		> ul > li .text:before {
		background: var(--text-sub-color);	
		}
	}
}
/* ----- sec_qa ----- */
.sec_qa {
	&.box-wrap.bg {
		padding-block: 8.7% 9.5%;
		margin-bottom: 0;
		@media screen and (max-width: 599px) {
			padding-block: 12%;
		}
	}
	&.box-wrap.bg:before {
		background: url(/mwp/wp-content/uploads/2024/06/bg_img003.webp);
		background-size: cover;
		background-position: 72%;
	}	
	h2.box-h2 {
		color: #fff;
	}
	.box.accordion-type01 {
		@media screen and (max-width: 599px) {
			margin-bottom: 4vh;
		}
	}
	.accordion-type01 ul li {
		background: #fff;
		@media screen and (min-width: 1025px) {
			margin-bottom: 50px;
		}
		h3.box-h3 {
			font-size: 3rem;
			font-weight:500;
			@media screen and (max-width: 1024px) {
				font-size: 2rem;
			}
			@media screen and (max-width: 599px) {
				font-size: 1.8rem;
			}
		}
		h3.box-h3:after {
			color: var(--text-color);
		}
		.text {
			background: var(--border-color);
		}
	}	
}
/* ----- sec_blog ----- */
.sec_blog {
	padding-block: 9.8% 11%;
	margin-bottom: 0;
	@media screen and (max-width: 599px) {
		padding-block: 12%;
	}
	.box.title-type04 {
		@media screen and (min-width: 1025px) {
			margin-bottom: 7vh;
		}
	}
	.blog-type01 ul li h3.box-h3 {
		@media screen and (min-width: 600px) {
			font-size: 2rem;
		}
		@media screen and (min-width: 1025px) {
			font-size: 3rem;
		}
	}
}
/* ----- sec_concept ----- */
.sec_contact {
	margin-bottom: 0;
	.title-type04 img {
		@media screen and (max-width: 1024px) {
			max-width: 90%;
		}
	}
	.contact-type02 {		
		@media screen and (min-width: 600px) {
			padding: 8.8% 4vmin;
		}
		@media screen  and (max-width: 767px) {
			display: block;
			.title {
				padding: 0;
			}
		}
	}
	.box.title-type04 h2.box-h2 {
		color: #fff;
		span {
			font-size: 3.4rem;
			@media screen and (max-width: 1024px) {
				font-size: 2.3rem;
			}
		}
	}
	.contact-type02 .text {
		@media screen  and (max-width: 767px) {
			display: flex;
			flex-direction: column;
			justify-content: center;
			align-items: center;
		}
	}
	.contact-type02 .text .tel {
		font-size: 4rem;
		letter-spacing: 0.1em;
		@media screen and (min-width: 600px) {
			margin-bottom: 2.8vh;
		}
		@media screen and (max-width: 599px) {
			font-size: 2.8rem;
		}
	}
	.contact-type02 .text .datetime dl{
		display: flex;
		font-size: 1.4rem;
		line-height: calc(30 / 14);
	}
	.contact-type02 .text .btn {
		gap: 34px;
		@media screen and (max-width: 599px) {
			flex-direction: column;
			gap: 20px;
			margin: 0;
		}
		div {
			margin: 0;
		}		
		div a {
			padding: 4px 30px;
			
			min-width: 200px;
		}
		div a:after {
			content: none;
		}
	}
}
.page-id-898 {
	.box-wrap.bg .list-flow-type01:after{
		background: var(--border-color);
	}
}
.page-id-901 {
	.box-wrap:not(.sec_contact) {
		margin-bottom: 4vh;
	}
}
.form-table td span.required {
	margin: 0 0 0 10px;
    color: #c00;
    font-size: 1.2rem;
    font-weight: normal;
}
.form-table td .w100.pref {
	display: flex;
	align-items: center;
}
/*------------------------------------------------------------------------------
  TABLET and SHONE
------------------------------------------------------------------------------*/
@media screen and (max-width: 1024px) {
}

/*------------------------------------------------------------------------------
  TABLET ONLY
------------------------------------------------------------------------------*/
@media screen and (min-width: 600px) and (max-width: 1024px) {
}

/*------------------------------------------------------------------------------
  SPHONE ONLY
------------------------------------------------------------------------------*/
@media screen and (max-width: 599px) {
	.box-wrap.scroll {
    overflow-x: auto;
    > * {
      width: 1000px !important;
    }
  }
}
