@charset "utf-8";
/* 共通 */
.mb30{margin-bottom: 30px !important;}
.mb60{margin-bottom: 60px !important;}
.mb80{margin-bottom: 80px !important;}
.fs18{font-size:1.125rem;}
.fs20{font-size:1.25rem;}
.fs22{font-size:1.375rem;}
.center,.center_l{text-align: center;}
.wb{font-weight: bold;}
.fcb{color:#04ade5;}
.fcbl{color:#000;}
.bgb{background: #cdeffa;}
.border{text-decoration: underline;}
.flexbox{
	display: flex;
    flex-wrap: wrap;
	width: 100%;
	justify-content: space-between;
}
.c2 > li,.c2 > div{width: 48%;margin: 0 1%;}
.c3 > li{width: 31%;margin: 0 1%;}
.c2 > li:not(:nth-last-child(-n+2)) {margin-bottom: 30px;}
.c3 > li:not(:nth-last-child(-n+3)) {margin-bottom: 30px;}
.sp_on,.tab_on{display: none;}
.ti2{font-size:30px; color:#04ade5;font-weight: 300;}

/* ヘッダー
------------------------------------------------------------*/
header{border-radius: 10px;}
h1{font-size:.875rem;font-weight: normal;margin-left:4vw;padding:5px 0;}
header .flexbox{
	z-index: 98 !important;
    position: fixed;
    top: 40px;
    left: 50%;
	transform: translateX(-50%);
    width: 93%;
    align-items: center;
    padding: 15px 20px;
    border-radius: 10px;
    background-color: #fff;
    box-shadow: 0 2px 4px 2px rgba(51, 51, 51, .05);
	transition: all .6s cubic-bezier(.165,.84,.44,1);
    transition-property: transform;
    transition-timing-function: cubic-bezier(.165,.84,.44,1);
}
/* ナビゲーション
------------------------------------------------------------*/
/* pc-nav */
.pc-nav > ul{display: flex; justify-content: flex-end;align-items:center;}
.pc-nav a{color:#2b3038;font-size:1rem;}
.pc-nav > ul > li:last-child{margin-left:1vw;}
.pc-nav > ul > li:not(:first-child){margin-left: 1.5vw;}
.pc-nav{
	position: relative;
	z-index: 3;
}
.pc-nav a:hover{
	color: #04ade5;
	opacity: 1.0;
}

/* ドロワー */
.drawer-hamburger {
	display: none !important;
	width: 2rem !important;
	height:2rem;
	padding: 5px 8px 12px !important;
	position: fixed;
	top:45px;
	right:50px !important;
	background: #04ade5!important;
	border-radius:5px;
	z-index: 100 !important;
}
.drawer-hamburger-icon,.drawer-hamburger-icon:after,.drawer-hamburger-icon:before {
	background-color: #fff !important;
	height: 1.0px !important;
}
.drawer-open .drawer-hamburger-icon:before,.drawer-open .drawer-hamburger-icon:after{
	width: 100%!important;
	padding-left: 10px!important;
}
.drawer-open .drawer-hamburger-icon {background-color: transparent !important;}
.drawer-open .drawer-hamburger-icon:after, .drawer-open .drawer-hamburger-icon:before {top: 0 !important;}
.drawer-nav {z-index: 3!important;width: 100% !important;background: #fff;height: 100%!important;}
.drawer-overlay {z-index: 2!important;background: none !important;}
.drawer--top.drawer-open .drawer-nav{
	opacity: 1!important;
	visibility: visible;
}
/* この下でデザイン */
.drawer-nav {
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
	width:100% !important;
	height: 100% !important;
	z-index: 99 !important;
	padding:10vh 0;
}
.drawer-menu{
	max-width: 800px;
	width: 80%;
	height: 100%;
}
.drawer-menu ul{
	padding:20px 0; 
}
.drawer-menu > li:not(:last-child){
	border-bottom: 1px #E6E6E6 solid;
	margin-bottom: 20px;
	padding-bottom: 20px;
}
.drawer-menu > li:last-child a{
	margin: auto;
}
.drawer-menu.drawer-top > li a{
	display: block;
	text-align: center;
	font-weight: bold;
}

/* 共通　コンテンツ
------------------------------------------------------------*/
#pagetop {
    position: fixed;
    right: 1.2%;
	bottom: -150px;
	transition: .3s ease-out;
	z-index: 2!important;
}
#pagetop a:hover {opacity: 0.5;}
#pagetop.is-active {
  bottom: 10px;
}
.inner-box{max-width: 1200px;width: 95%;margin: 0 auto;padding:80px 0;}
.wave{position:relative;padding-bottom:150px;}
.wave::after{
	position: absolute;
	bottom:0px;
	left:0;
	display: block;
	content: "";
	width:100%;
	height: 150px;
	background: url("../images/bg_wave.webp") center / cover no-repeat;
}

/* フッター
------------------------------------------------------------*/
footer .flexbox > div{width:47%;}
.map iframe{width:100%; height: 100%; border-radius: 10px;}
footer img{max-width:600px;width:100%;display:block; height: auto; margin: auto;}
footer img.ftel{max-width:430px;width:100%;height: auto; margin: auto;}
footer dl div{display:flex;padding:5px 0;}
footer dl dt:not(:last-child){width:8em;color:#04ade5;}
footer dl dt:not(:last-child)::before{content: "";display:inline-block; width:7px;height: 7px;background:#04ade5;border-radius: 50%;margin-right: 10px;}
footer dl dt:last-child{max-width:374px; width:100%;margin:30px auto 0;}
footer .copy{text-align:center;background:#04ade5;padding:15px 0;color:#FFF; }

/* 1380px以下から
------------------------------------------------------------*/
@media only screen and (max-width:1380px){
	body {min-width: 1330px!important;}
	.pc-nav > ul > li:not(:first-child){margin-left: 1.1vw;}
	.pc-nav > ul > li a{font-size:0.875rem;}
	header .logo img{width:250px;}
}


/* 1200px以下から
------------------------------------------------------------*/
@media only screen and (max-width:1200px){
	body {min-width: 1150px!important;}
	/* ナビゲーション
	--------------------------------------*/
	.pc-nav{display:none;}
	.drawer-hamburger {display: block!important;}
	.wave::after{
		position: absolute;
		bottom:0px;
		left:0;
		display: block;
		content: "";
		width:100%;
		height: 100px;
		background: url("../images/bg_wave.webp") center bottom / contain no-repeat;
	}
}
/* 1025px以下から
------------------------------------------------------------*/
@media only screen and (max-width:1025px){
	/* 共通 */
	.mb30{margin-bottom: 20px!important;}
	.mb60{margin-bottom: 30px !important;}
	.mb80{margin-bottom: 50px!important;}
	.fs18{font-size:1rem;}
	.fs20,.fs22{font-size:1.125rem;}
	.inner-box{padding:50px 0;}
	/* ヘッダー
	--------------------------------------*/
	h1{font-size:0.875rem;margin-left:1.5vw;}
	header div{width:100%;}
	a[href^="tel:"] {
		pointer-events: auto;
	}
	/*　共通コンテンツ
	--------------------------------------*/
	.ti2{font-size: 20px;}
	.ti2+p{font-size: 14px;}

	/* フッター
	--------------------------------------*/
	.copy{
		font-size: 14px;
		letter-spacing: 2px;
	}
}

/* 768px以下から
------------------------------------------------------------*/
@media only screen and (max-width:768px){
	body {min-width: 700px!important;}
	/* 共通 */
	.center_l{text-align: inherit;}
	.c2 > li,.c2 > div{width: 100%;margin: 0;}
	.c2 > li:not(:last-child),.c2 > div:not(:last-child){margin-bottom: 30px;}
	.c3 > li{width: 48%;}
	.c3 > li:not(:nth-last-child(-n+2)) {margin-bottom: 30px;}
	.sp_non{display: none;}
	/* ドロワー */
	.drawer-hamburger {right:30px !important;}
	
	/*フッター*/
	#pagetop {
		width: 60px;
		bottom:50px;
	}
	footer .flexbox div{width:100%;}
	footer dl dt:last-child{max-width:260px; width:100%;margin:30px auto;}

	.map iframe{width:100%; height: 400px; border-radius: 10px;}
}

/* 500px以下から
------------------------------------------------------------*/
@media only screen and (max-width:500px){
    body {min-width: inherit!important;width: 100%;}
	header .logo img{width:50vw;height: auto;}
	h1{width: 98%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
	/* 共通 */
	.ti2{font-size: 18px;}
	.c3 > li{width: 100%;margin: 0;}
	.c3 > li:not(:last-child){margin-bottom: 20px;}
	.c3 > li img{display: block; margin:auto;}
	.wave{padding-bottom:30px;}
	.wave::after{
		height: 100px;
	}
	/*フッター*/
	footer .copy{font-size:14px; }
	footer dl div{display:block;padding:10px 0;border-bottom:1px dotted #dedede;}
}