@charset "utf-8";
@media only screen 
	and (min-device-width: 600px) 
	and (max-device-width: 1280px) 
	and (-webkit-min-device-pixel-ratio: 1) {

/* iPadのSafariだけで適用 
.mac.safari .CLASS{
	
}
/* Chrome 
.iPad.safari .CLASS{
	
}
*/
/* アンドロイドタブレットだけで適用 
.android .CLASS{
	
}
*/


/* ////////////////////////////////////////////
 *                 base & layout
 * //////////////////////////////////////////// */

/* Typography
------------------------------------------*/
html {
	font-size: 1.6vw;
}

/* Layout
------------------------------------------*/
body {
	min-width: unset;
}

.pc-parts{
	display: none;
}
.tab-parts{
	display: block;
}

/* general
------------------------------------------*/
.common{
	padding: 5vw 2vw;
	h2{
		margin-bottom: 2vw;
		span{
			display: block;
			&.ja{
				font-size: 4vw;
			}
			&.en{
				font-size: 1.6vw;
			}
		}
	}
	.main{
		.btns{
			a{
				margin: 3vw auto 0;
				font-size: 1.7vw;
				min-width: 20vw;
				height: 4vw;
				line-height: 4vw;
				-webkit-border-radius: 2vw;
				-moz-border-radius: 2vw;
				border-radius: 2vw;
				&::before{
					right: 1.5vw;
				}
			}
		}
	}
}

/* drawer
------------------------------------------*/
.drawer-bg,
.drawer-menu{
	display: none;
}
.is-drawer-open {
	.drawer-menu {
		z-index: 99999;
		position: fixed !important;
		top: 10vw !important;
		right: 0 !important;
		left: auto !important;
		width: 50vw;
		padding: 4vw 2vw;
		background: var(--keyColor);
		text-align: left;
		color: var(--bodyBgColor);

		a {
			color: inherit;
		}

		> ul {
			line-height: 2;

			> li {
				> a {
					.ja{
						font-size: 2.5vw;
					}
					&:before {
						content: '\f138';
						padding-right: 2vw;
						color: #62c0b4;
						font-size: 2vw;
						font-weight: bold;
						font-family: 'Font Awesome 5 Free';
						line-height: 1;
						-webkit-font-smoothing: antialiased;
						-moz-osx-font-smoothing: grayscale;
					}
				}

				> ul {
					padding: 0.2em 0 1em 2vw;

					> li {
						> a {
							font-size: 2.3vw;
							&:before {
								content: '\f105';
								padding-right: 2vw;
								color: #62c0b4;
								font-size: 2vw;
								font-weight: bold;
								font-family: 'Font Awesome 5 Free';
								line-height: 1;
								-webkit-font-smoothing: antialiased;
								-moz-osx-font-smoothing: grayscale;
							}
						}
					}
				}
			}
		}
	}
}

.simple-accordion-is-animation {
	.simple-accordion-btn {
		&::after,
		&::before {
			background: var(--bodyBgColor);
		}
	}
}


/* fixed
------------------------------------------*/
.fixed-btn{
	top: 15vw;
	right: 1vw;
	ul{
		display: grid;
		grid-template-columns: repeat(1, 1fr);
		gap: 1vw;
		li{
			a{
				font-size: 1.8vw;
				width: 5vw;
				&.instagram{
					background: var(--instaColor);
					-webkit-border-radius: .3vw;
					-moz-border-radius: .3vw;
					border-radius: .3vw;
				}
				&.x{
					font-size: 2.5vw;
					height: 5vw;
					line-height: 5vw;
				}
				&:not(.x){
					padding: 1.0em .5em 1.5em;
					-ms-writing-mode: tb-rl;
					writing-mode: vertical-rl;
				}
			}
		}
	}
}



/* header
------------------------------------------*/
#header {
	padding: 0 0 0 2vw;
	.main{
		height: 10vw;
		.logo{
			width: 20vw;
		}
		.hnav{
			gap: 3vw;
			.gnav{
				.gnav-list {
					gap: 1vw;
					li{
						a{
							span{
								display: block;
								&.ja{
									font-size: 1.5vw;
								}
								&.en{
									font-size: 1.2vw;
								}
							}
						}
						ul {
							display: none;
							position: absolute;
							top: calc(100% + 15px);
							left: 0;
							width: 150%;
							background: rgba(255,255,255,.8);
							li{
								a{
									display: block;
									padding: 5px 10px;
									color: inherit;
									font-size: 14px;
									text-align: left;
									zoom: 1;
									&:hover {
										text-decoration: none;
										background: #fff;
									}
								}
								ul {
									top: 0;
									left: 100%;
									width: 100%;
								}
							}
						}
					}
				}
			}
			.contact{
				gap: 2vw;
				.tel{
					a{
						font-size: 3vw;
						i{
							font-size: 2.5vw;
						}
					}
				}
				.btns{
					a{
						width: 25vw;
						height: 4vw;
						line-height: 4vw;
						font-size: 2vw;
						i{
							font-size: 2.1vw;
						}
						&::before{
							right: 1vw;
						}
					}
				}
			}
		}
	}
}

/* header-btn */
.header-btn-group {
	margin-left: auto;
	.drawer-btn {
		position: relative;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		text-align: center;
		width:  10vw;
		height: 10vw;
		background: var(--keyColor);
		.drawer-btn-bar {
			margin: 0 0 0 -2vw;
			width: 4vw;
			height: .5vw;
			background-color: var(--bodyBgColor);
			&:nth-child(1) {
				-webkit-transform: translateY(-1vw);
				transform: translateY(-1vw);
			}
			&:nth-child(3) {
				-webkit-transform: translateY(1vw);
				transform: translateY(1vw);
			}
		}
	}
}
.is-drawer-open{
	.drawer-btn {
		.drawer-btn-bar {
			&:nth-child(1) {
				-webkit-transform: translateY(0) rotate(45deg);
				transform: translateY(0) rotate(45deg);
			}
			&:nth-child(3) {
				-webkit-transform: translateY(0) rotate(-45deg);
				transform: translateY(0) rotate(-45deg);
			}
		}
	}
}

/* mainimage
------------------------------------------*/
/* 横スライド
.slideshow .slick-list {overflow: visible;}
*/

#mainimage {
	.main{
		.slideshow {
			.slick-slide {
				.mv-catch{
					left: 7vw;
					h2{
						font-size: 4vw;
					}
					.copy{
						font-size: 2vw;
					}
				}
			}
			.slick-arrow{
				width: 5vw;
				height: 5vw;
				&::before {
					width: 5vw;
					height: 5vw;
					font-size: 2vw
				}
				&.slick-prev {
					left: 0;
				}
				&.slick-next {
					right: 0;
				}
			}
			.slick-dotted {
				margin-bottom: 3vw;
				.slick-dots {
					bottom: -2vw;
					li{
						button{
							width: 1.2vw;
							height: 1.2vw;
							&::before {
								width: 1.2vw;
								height: 1.2vw;
								font-size: 1.2vw;
							}
						}
					}
				}
			}
		}
	}
}


/* content main
------------------------------------------*/
/* main */
/*news*/
.main-news-wrapper{
	padding: 2vw;
	.main-news{
		height: 7vw;
		background: var(--bodyBgColor);
		h2{
			width: 15vw;
			height: 7vw;
			padding-left: 2vw;
			.ja{
				font-size: 2.5vw;
			}
			.en{
				font-size: 1.6vw;
			}
			&::before{
				top: 1vw;
				bottom: 1vw;
			}
		}
		.main{
			width: 78vw;
			padding: 0 20vw 0 2vw;
			ul{
				li{
					h3{
						line-height: 7vw;
						span{
							font-size: 1.6vw;
							&.cat{
								a{
									height: 2.2vw;
									line-height: 2.2vw;
									font-size: 1.4vw;
								}
							}
						}
					}
				}
			}
			.btns{
				a{
					right: 2vw;
					font-size: 1.4vw;
					width: 15vw;
					height: 3vw;
					line-height: 3vw;
					text-align: center;
					-webkit-border-radius: 2vw;
					-moz-border-radius: 2vw;
					border-radius: 2vw;
					&::before{
						right: 1vw;
					}
				}
			}
		}
	}
}

/*imagetext*/
.main-imagetext{
	.main{
		.image{
			width: 48vw;
		}
		.texts{
			width: 44vw;
			h3{
				font-size: 2.3vw;
			}
			.text{
				font-size: 1.5vw;
				margin-bottom: 0;
			}
		}
	}
}

/*alternate*/
.main-alternate {
	.main{
		ul{
			gap: 4vw;
			li{
				.texts{
					width: 44vw;
					h3{
						font-size: 2.3vw;
					}
					.text{
						font-size: 1.5vw;
						margin-bottom: 0;
					}
				}
				.image{
					margin: 0;
					width: 48vw;
				}
				&:nth-child(even){
					.image{
						margin: 0;
					}
				}
			}
		}
	}
}

/*cols*/
.main-cols {
	.main{
		ul{
			grid-template-columns: repeat(2, 1fr);
			gap: 2vw;
			li{
				.texts{
					padding: 2vw;
					h3{
						font-size: 2.3vw;
					}
					.text{
						font-size: 1.5vw;
						margin-bottom: 0;
					}
				}
			}
		}
	}
}

/*blog*/
.main-blog {
	background: var(--bgColorSub);
	.main{
		ul{
			margin-bottom: 0;
			grid-template-columns: repeat(2, 1fr);
			gap: 3vw 2vw;
			li{
				.image{
					.cat{
						a{
							height: 3vw;
							line-height: 3vw;
							font-size: 1.5vw;
						}
					}
					a{
						display: block;
						position: relative;
					}
				}
				h3{
					font-size: 2vw;
				}
			}
		}
	}
}

.main-gallery {
	.main{
		ul{
			margin: 0 -60vw;
			li{
				margin: 0 1vw;
				.image{
					position: relative;
					.cat{
						position: absolute;
						top: 0;
						left: 0;
						a{
							height: 3vw;
							line-height: 3vw;
							font-size: 1.5vw;
						}
					}
					a{
						display: block;
						position: relative;
					}
				}
				h3{
					font-size: 2vw;
				}
			}
		}
	}
}

.main-beforeafter {
	.main{
		ul{
			grid-template-columns: repeat(2, 1fr);
			gap: 3vw 2vw;
			li{
				h3{
					font-size: 2vw;
					.meta{
						height: 3vw;
						.date{
							line-height: 3vw;
						}
						.cat{
							a{
								line-height: 3vw;
								font-size: 1.8vw;
							}
						}
					}
				}
			}
		}
	}
}

.main-access{
	.main{
		.texts{
			width: 44vw;
			.image{
				width: 35vw;
				margin-bottom: 2vw;
			}
			.text{
				font-size: 1.5vw;
				margin-bottom: 2.0em;
			}
		}
		.map{
			width: 48vw;
			.googlemap{
				height: 30vw;
				iframe{
					height: 30vw;
				}
			}
		}
	}
}


/* content sidebar
------------------------------------------*/
.template-type-blog #sidebar {
	padding: 0 2vw;
	max-width: 100%;
}

/* footer
------------------------------------------*/
#footer {
	.main{
		padding: 5vw 0;
		width: 100%;
		.logo{
			margin: 0 auto 3vw;
			width: 30vw;
		}
		.fnav{
			ul{
				li{
					a{
						font-size: 1.6vw;
					}
				}
			}
		}
	}
	.copyright{
		height: 5vw;
		line-height: 5vw;
		font-size: 1.3vw;
	}
}

.pagetop-btn-wrap {
	bottom: 7vw;
	right: 2vw;
	.pagetop-btn{
		width: 5vw;
		height: 5vw;
	}
}


/* Lower
------------------------------------------*/
.entry{
	padding: 0 2vw;
}
/* blog-nav
------------------------------------------*/
.blog-nav-group {
	display: flex;
	justify-content: space-between;
	margin-top: 10vw;
}
.blog-nav {width: 23%;}
.blog-nav-title{text-align: center;}








































}