@charset "utf-8";
@media (prefers-reduced-motion: no-preference) { 
  html:focus-within {
    scroll-behavior: smooth;
  }
  /*<div id="point_01" tabindex="-1"></div>*/
}
:root {
  --main-color: #185c9a;/*青*/
  --sub-color: #0190c7;/*水色*/
  --font-color: #333333;/*黒*/
  
  --Regular: 400;
  --Medium: 500;
  --SemiBold: 600;
  --Bold: 700;
  --ExtraBold: 800;
  --Black: 900;
  
  --font-size14: clamp(1.0rem,1.2vw,1.4rem);
  --font-size18: clamp(1.4rem,1.6vw,1.8rem);
  --font-size19: clamp(1.5rem,1.7vw,1.9rem);
  --font-size20: clamp(1.5rem,1.8vw,2.0rem);
  --font-size24: clamp(1.6rem,2.0vw,2.4rem);
  --font-size28: clamp(1.7rem,2.2vw,2.8rem);
  --font-size32: clamp(1.7rem,2.2vw,3.2rem);
  --font-size36: clamp(1.8rem,2.8vw,3.6rem); 
  --font-size40: clamp(2.0rem,3.5vw,4.0rem); 
  --font-size48: clamp(2.2rem,5vw,4.8rem);
  --font-size60: clamp(2.6rem,5vw,6.0rem);
  --font-size80: clamp(3.0rem,7vw,8.0rem);
  
  --px10: clamp(5px,1.0vw,10px);
  --px20: clamp(10px,2vw,20px);
  --px30: clamp(15px,2vw,30px);
  --px35: clamp(17px,2.3vw,35px);
  --px40: clamp(15px,3vw,40px);  
  --px50: clamp(25px,4vw,50px);
  --px60: clamp(30px,5vw,60px);
  --px70: clamp(35px,6vw,70px);
  --px80: clamp(40px,7vw,80px);
  --px85: clamp(43px,7.5vw,85px);
  --px90: clamp(45px,8vw,90px);
  --px100: clamp(40px,8vw,100px);
  --px120: clamp(60px,11vw,120px);
  --px140: clamp(70px,13vw,140px);
  
  
  --shadow:0 4px 12px rgba(0,0,0,.08);

}
/***********共通 sp ***********/
html{
	/* ルートのフォントサイズを10pxに設定*/
	font-size: 62.5%;
	height:100%;
	-webkit-overflow-scrolling: touch;
	 /*iphoneで勝手に文字サイズ大きくしない*/
	-webkit-text-size-adjust: 100%;
}
body{
    /* ルートのフォントサイズを1.4em（14pxと同等のサイズ）に設定 */
    font-size: 1.4em;
    margin: 0;
    padding: 0;
    font-family: 'Noto Sans JP', sans-serif;
    font-style: normal;
    font-weight: var(--Regular);
    overflow-x: hidden;
    line-height: 1.6;
	  color: var(--font-color);
    background-color: #efebe8;
}

/*----- Googl Fonts -----*/
/*Noto Sans JP ゴシック/100/Extra Light 200/Light 300/Regular 400/Medium 500/SemiBold 600/Bold 700/Extra Bold 800/Black 900*/
.noto_sans {
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
}
/*Noto Serif JP 明朝/Extra Light 200/Light 300/Regular 400/Medium 500/SemiBold 600/Bold 700/Extra Bold 800/Black 900*/
.noto-serif {
  font-family: "Noto Serif JP", serif;
  font-optical-sizing: auto;
  font-style: normal;
}
/*ポピンズ/Regular 400/Medium 500/SemiBold 600/Bold 700/ExtraBold 800/Black 900*/
.poppins {
  font-family: "Poppins", system-ui;
  font-style: normal;
  font-weight: var(--SemiBold);
}

.clear::after{
	content: '';
	display: block;
	height:0;
	font-size:0;
	clear:both;
	visibility:hidden;
}
img{
	width:100%;
	vertical-align: top;
}
*, *:before, *:after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}
a{
	text-decoration: none;
	color: #333333;
	transition: .3s;
}
a:hover{
	opacity: 0.7;
	transition: .3s;
}
h1,h2,h3,h4,h5,p,div,ul,li{
	margin:0;
	padding: 0;
	font-weight: var(--Regular);
}
li{
	list-style-type: none;
}
.sp{
	display: block;
}
.tab{
	display: none;
}
.sptab{
	display: block;
}
.pc{
	display: none;
}
.tabpc{
	display: none;
}
.pc1270{
			display: none;
		}
/*iphoneのボタン勝手にまるくしない*/
input[type="button"],input[type="submit"],nput[type="reset"] {
    -webkit-appearance: none;
  }


@media (min-width:768px){
/***********共通 tab ***********/
	body {
		/* ルートのフォントサイズを1.5em（15pxと同等のサイズ）に設定 */
		font-size: 1.5em;
	}
	/*タブレットPCでは電話かけない*/
	a[href^="tel:"]{
		pointer-events: none;
	}
	.sp{
			display: none;
		}
	.tab{
		display: block;
	}
	.sptab{
		display: block;
	}
	.pc{
			display: none;
		}

	.tabpc{
		display: block;
	}

}

@media (min-width:1024px){
/***********共通 pc ***********/
	body {
		/* ルートのフォントサイズを1.6em（16pxと同等のサイズ）に設定 */
		font-size: 1.6em;
	}
	.sp{
			display: none;
		}
	.pc{
			display: block;
		}
	.tab{
		display: none;
	}
	.tabpc{
		display: block;
	}
	.sptab{
		display: none;
	}
}
@media (min-width:1270px){
  .pc1270{
			display: block;
		}
}