@charset "utf-8";

img {
	-webkit-backface-visibility: hidden;
}
main {
    display: block;
}
.fax a{
	pointer-events: none;
    text-decoration: none;
}
.wpcf7-list-item {
	display: inline-block;
	white-space: nowrap;
}
/* =========================================
   mov_reveal (画像リビールアニメーション)
========================================= */
.mov_reveal {
  position: relative;
  overflow: hidden; /* カバーが外にはみ出さないように */
  --reveal-scale: 1; /* 初期状態はJSから付与されますが念のため */
}

.mov_reveal::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #003951;
  z-index: 10; /* 背景画像より前に出す */
  
  /* 左から右に小さくなる（右端を固定して縮める）ための設定 */
  transform-origin: right center; 
  transform: scaleX(var(--reveal-scale));
  pointer-events: none;
}


/*===============================================
●画面の横幅が769px以上
===============================================*/
@media screen and (min-width : 769px ){
#pc------------------------------------------- {
}
.sp {
	display: none;
}
a img {
  transition: 0.5s;
}
a img:hover {
  opacity: 0.6;
}


header {
	position: fixed;
	left: 0px;
	right: 0px;
	top: 0px;
	z-index: 99999;
	transition: 0.3s;
}
header .inner {
	width: 90%;
	min-width: 1040px;
	margin-left: auto;
	margin-right: auto;
	display: flex;
	justify-content: space-between;
	height: 82px;
}
header .inner .logo {
	padding-top: 14px;
	transition: 0.3s;
}
header .inner nav {
	display: flex;
	justify-content: space-between;
}
header .inner nav ul {
	display: flex;
	justify-content: space-between;
}
header .inner nav ul li a {
	height: 80px;
	line-height: 80px;
	text-decoration: none;
	padding-left: 15px;
	padding-right: 15px;
	font-size: 16px;
	display: block;
	color: #fff;
	font-weight: 500;
	transition: 0.3s;
}
header .inner nav ul li a:hover {
	color: #FF433E;
}
header .inner nav p a {
	width: 182px;
height: 40px;
display: block;
border-radius: 100px;
background: #D83935;
line-height: 40px;
display: block;
color: #FFF;
font-size: 16px;
text-decoration: none;
position: relative;
top: 20px;
margin-left: 15px;
transition: 0.3s;
}
header .inner nav p a::after {
	display: block;
	width: 28px;
	height: 28px;
	background-color: #E37070;
	content: "";
	border-radius: 100px;
	position: absolute;
	right: 5px;
	top: 0px;
	bottom: 0px;
	margin: auto;
	background-image: url("../images/arrow.png");
	background-size: 11px 10px;
	background-repeat: no-repeat;
	background-position: center center;
}
header .inner nav p a:hover {
	background-color: #FF433E;
}
header .inner nav p a:hover::after {
	background-color: #F76262;
}

header.sc {
	background-color: #fff;
	transition: 0.3s;
	height: 62px;
}
header.sc .logo {
	padding-top: 3px;
	transition: 0.3s;
}
header.sc .inner nav ul li a {
	color: #000;
	transition: 0.3s;
	height: 60px;
	line-height: 60px;
}
header.sc .inner nav ul li a:hover {
	color: #FF433E;
}
header.sc .inner nav p a {
	top: 10px;
	transition: 0.3s;
}




main {
	min-width: 1100px;
}
h2.ttl {
	font-size: 50px;
	font-weight: bold;
	color:#D83935;
	position: relative;
	margin-bottom: 60px;
}
h2.ttl span {
	color: #000;
	display: block;
	font-family: 'Inter', 'Noto Serif JP', serif;
	font-size: 24px;
	font-weight: 700;
	letter-spacing: 0em;
	margin-bottom: 25px;
}
h2.ttl::after {
	width: 80px;
	height: 3px;
	content: "";
	background-color: #D83935;
	position: absolute;
	left: 0px;
	right: 0px;
	margin-left: auto;
	margin-right: auto;
	bottom: -35px;
}
h2.ttl+p {
	font-size: 20px;
}


.btn a {
	background-color: #D83935;
	width: 320px;
	height: 60px;
	display: block;
	line-height: 60px;
	color: #fff;
	font-size: 20px;
	text-decoration: none;
	border-radius: 100px;
	position: relative;
	transition: 0.3s;
	margin-left: auto;
	margin-right: auto;
}
.btn a::after {
	display: block;
	width: 28px;
	height: 28px;
	background-color: #E37070;
	content: "";
	border-radius: 100px;
	position: absolute;
	right: 12px;
	top: 0px;
	bottom: 0px;
	margin: auto;
	background-image: url("../images/arrow.png");
	background-size: 11px 10px;
	background-repeat: no-repeat;
	background-position: center center;
	transition: 0.3s;
}
.btn a:hover {
	background-color: #FF433E;
	transition: 0.3s;
}
.btn a:hover::after {
	background-color: #F76262;
	transition: 0.3s;
}



.bg {
  position: relative;
  z-index: 1;
  /* 上下に斜め分の余白を作る（中身が削られないため） */
  padding: 80px 0; 
}

.bg {
  position: relative;
  z-index: 1;
  /* 高低差が大きいため、paddingも少し増やして調整 */
  padding: 12vw 0; 
}

.bg::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #f5f5f5;
  z-index: -1;

  /* ★高低差を10vw（前の倍）に変更 */
  clip-path: polygon(
    0 10vw,              /* 左上を 10vw 下げる */
    100% 0,              /* 右上を 0（最高点）にする */
    100% calc(100% - 10vw), /* 右下を 10vw 上げる */
    0 100%               /* 左下を 100%（最下点）にする */
  );
  
  -webkit-clip-path: polygon(0 10vw, 100% 0, 100% calc(100% - 10vw), 0 100%);
}





.table1 {
	width: 1100px;
	margin-left: auto;
	margin-right: auto;
	text-align: left;
	margin-bottom: 20px;
}
.table1 th {
	background-color: #D72D33;
	color: #fff;
	font-size: 20px;
	font-weight: 500;
	width: 220px;
	padding: 30px;
	border-top-left-radius: 8px;
	border-bottom-left-radius: 8px;
}
.table1 td {
	background-color: #F9DDDD;
	color: #000;
	font-size: 20px;
	padding: 30px;
	line-height: 2em;
	border-top-right-radius: 8px;
	border-bottom-right-radius: 8px;
}





footer {
	background-color: #EFEFEF;
	margin-top: 50px;
}
.footer-inner {
	width: 80%;
	margin-left: auto;
	margin-right: auto;
	display: flex;
	justify-content: space-between;
	text-align: left;
	padding-top: 50px;
	padding-bottom: 50px;
}
.footer-address {
	margin-top: 20px;
	line-height: 1.8em;
	font-size: 16px;
}
.footer-address a {
	color: #000;
	text-decoration: none;
}
.footer-nav-title {
	width: 200px;
	font-size: 16px;
	font-weight: bold;
	border-bottom: 1px solid #000;
	padding-bottom: 5px;
	margin-bottom: 10px;
}
.footer-nav li a {
	font-size: 14px;
	color: #000;
	text-decoration: none;
}
.footer-nav li a:hover {
	text-decoration: underline;
}
.footer-copyright small {
	display: block;
	background-color: #fff;
	padding-top: 5px;
	padding-bottom: 5px;
	font-size: 12px;
	letter-spacing: 0em;
}
}



/*===============================================
●画面の横幅が768pxまで
===============================================*/
@media screen and (max-width:768px){
	
/*===============================================
●sp-tablet
===============================================*/
#sptablet------------------------------------------- {
}
img {
	max-width: 100%;
	height: auto;
	width: 100%;
}
.pc {
	display: none;
}

/* iOSでのデフォルトスタイルをリセット */
input[type="submit"],
input[type="button"] {
  border-radius: 0;
  -webkit-box-sizing: content-box;
  -webkit-appearance: button;
  appearance: button;
  border: none;
  box-sizing: border-box;
  cursor: pointer;
}
input[type="submit"]::-webkit-search-decoration,
input[type="button"]::-webkit-search-decoration {
  display: none;
}
input[type="submit"]::focus,
input[type="button"]::focus {
  outline-offset: -2px;
}





header {
	position: fixed;
	left: 0px;
	right: 0px;
	top: 0px;
	height: 13vw;
	z-index: 99999;
	transition: 0.3s;
}
header .logo {
	width: 50vw;
	padding-top: 3vw;
	padding-left: 3vw;
	position: relative;
	z-index: 99;
	transition: 0.3s;
}
.navbtn {
  /* 30px相当 → 約8vw */
  width: 8vw;
  /* 22px相当 → 約6vw */
  height: 6vw;
  position: fixed;
  right: 3vw;
  top: 3vw;
  cursor: pointer;
  z-index: 9999;
}

.navbtn span {
  display: block;
  position: absolute;
  width: 100%;
  /* 2px相当 → 約0.5vw */
  height: 0.5vw; 
  background-color: #000;
  border-radius: 0.5vw;
  transition: all 0.3s ease;
}

/* 1本目：上端 */
.navbtn span:nth-child(1) { 
  top: 0; 
}

/* 2本目：中央 (全体の高さ 6vw の半分付近) */
.navbtn span:nth-child(2) { 
  top: calc(3vw - 0.25vw); 
}

/* 3本目：下端 */
.navbtn span:nth-child(3) { 
  bottom: 0; 
}

/* ---------------------------
   .open（バツ印）の状態
--------------------------- */

/* 1本目：中央に移動して45度回転 */
.navbtn.open span:nth-child(1) {
  top: calc(3vw - 0.25vw);
  transform: rotate(45deg);
}

/* 2本目：透明にする */
.navbtn.open span:nth-child(2) {
  opacity: 0;
}

/* 3本目：中央に移動して-45度回転 */
.navbtn.open span:nth-child(3) {
  top: calc(3vw - 0.25vw);
  transform: rotate(-45deg);
}


header.sc {
	background-color: #fff;
	transition: 0.3s;
}
header.sc .logo {
	transition: 0.3s;
}
header nav {
  background-color: #fff;
  position: fixed;
  left: 0px;
  right: 0px;
  top: 0px;
  z-index: 1;
  padding-top: 14vw;
  height: 100vh;
  
  /* --- アニメーション用の初期設定 --- */
  display: none;       /* JSで制御するために最初は消しておく */
  opacity: 0;          /* 最初は透明 */
  transform: translateY(-20px); /* 少し上に浮かせておく */
  transition: opacity 0.4s ease, transform 0.4s ease; /* ふわっと動かす設定 */
}

/* headerにopenクラスがついた時のnavの動き */
header.open nav {
  opacity: 1;          /* 不透明にする */
  transform: translateY(0); /* 定位置（top:0）に戻す */
}
header nav ul {
	border-bottom: 1px solid #ccc;
}
header nav ul li a {
	display: block;
	height: 12vw;
	line-height: 12vw;
	color: #000;
	text-decoration: none;
	font-size: 4vw;
	border-top: 1px solid #ccc;
}
header .inner nav p a {
	width: 70%;
	margin-left: auto;
	margin-right: auto;
height: 12vw;
display: block;
border-radius: 100px;
background: #D83935;
line-height: 12vw;
display: block;
color: #FFF;
font-size: 4vw;
text-decoration: none;
position: relative;
top: 4vw;
transition: 0.3s;
}
header .inner nav p a::after {
	display: block;
	width: 10vw;
	height: 10vw;
	background-color: #E37070;
	content: "";
	border-radius: 100px;
	position: absolute;
	right: 1vw;
	top: 0px;
	bottom: 0px;
	margin: auto;
	background-image: url("../images/arrow.png");
	background-size: 3vw 2.5vw;
	background-repeat: no-repeat;
	background-position: center center;
}





h2.ttl {
	font-size: 7vw;
	font-weight: bold;
	color:#D83935;
	position: relative;
	margin-bottom: 8vw;
}
h2.ttl span {
	color: #000;
	display: block;
	font-family: 'Inter', 'Noto Serif JP', serif;
	font-size: 3.5vw;
	font-weight: 700;
	letter-spacing: 0em;
	margin-bottom: 2vw;
}
h2.ttl::after {
	width: 10vw;
	height: 2px;
	content: "";
	background-color: #D83935;
	position: absolute;
	left: 0px;
	right: 0px;
	margin-left: auto;
	margin-right: auto;
	bottom: -5vw;
}
h2.ttl+p {
	font-size: 4vw;
}


.btn a {
	background-color: #D83935;
	width: 90%;
	height: 15vw;
	display: block;
	line-height: 15vw;
	color: #fff;
	font-size: 5vw;
	text-decoration: none;
	border-radius: 100px;
	position: relative;
	transition: 0.3s;
	margin-left: auto;
	margin-right: auto;
}
.btn a::after {
	display: block;
	width: 8vw;
	height: 8vw;
	background-color: #E37070;
	content: "";
	border-radius: 100px;
	position: absolute;
	right: 4vw;
	top: 0px;
	bottom: 0px;
	margin: auto;
	background-image: url("../images/arrow.png");
	background-size: 3vw 2.5vw;
	background-repeat: no-repeat;
	background-position: center center;
	transition: 0.3s;
}
.btn a:hover {
	background-color: #FF433E;
	transition: 0.3s;
}
.btn a:hover::after {
	background-color: #F76262;
	transition: 0.3s;
}



.bg {
  position: relative;
  z-index: 1;
  /* 上下に斜め分の余白を作る（中身が削られないため） */
  padding: 20vw 0; 
}

.bg {
  position: relative;
  z-index: 1;
  /* 高低差が大きいため、paddingも少し増やして調整 */
  padding: 15vw 0; 
}

.bg::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #f5f5f5;
  z-index: -1;

  /* ★高低差を10vw（前の倍）に変更 */
  clip-path: polygon(
    0 10vw,              /* 左上を 10vw 下げる */
    100% 0,              /* 右上を 0（最高点）にする */
    100% calc(100% - 10vw), /* 右下を 10vw 上げる */
    0 100%               /* 左下を 100%（最下点）にする */
  );
  
  -webkit-clip-path: polygon(0 10vw, 100% 0, 100% calc(100% - 10vw), 0 100%);
}



.table1 {
	width: 90%;
	margin-left: auto;
	margin-right: auto;
	text-align: left;
	margin-bottom: 3vw;
}
.table1 th {
	background-color: #D72D33;
	color: #fff;
	font-size: 4vw;
	font-weight: 500;
	width: 90%;
	padding: 5vw;
	padding-top: 2vw;
	padding-bottom: 2vw;
	border-top-left-radius: 8px;
	border-top-right-radius: 8px;
	display: block;
}
.table1 td {
	background-color: #F9DDDD;
	width: 90%;
	display: block;
	color: #000;
	padding: 5vw;
	padding-top: 3vw;
	padding-bottom: 3vw;
	line-height: 2em;
	border-bottom-left-radius: 8px;
	border-bottom-right-radius: 8px;
}






footer {
	background-color: #EFEFEF;
	margin-top: 15vw;
}
.footer-logo {
	width: 50vw;
	margin-left: auto;
	margin-right: auto;
}
.footer-inner {
	width: 90%;
	margin-left: auto;
	margin-right: auto;
	text-align: left;
	padding-top: 8vw;
	padding-bottom: 8vw;
}
.footer-address {
	margin-top: 5vw;
	line-height: 1.8em;
	font-size: 3.5vw;
	margin-bottom: 8vw;
}
.footer-address a {
	color: #000;
	text-decoration: none;
}
.footer-nav-title {
	width: 100%;
	font-size: 4.5vw;
	font-weight: bold;
	border-bottom: 1px solid #000;
	padding-bottom: 5px;
	margin-bottom: 10px;
	margin-top: 10vw;
}
.footer-nav li a {
	font-size: 3.5vw;
	color: #000;
	text-decoration: none;
}
.footer-nav li a:hover {
	text-decoration: underline;
}
.footer-copyright small {
	display: block;
	background-color: #fff;
	padding-top: 5px;
	padding-bottom: 5px;
	font-size: 3vw;
	letter-spacing: 0em;
}
}



/*===============================================
●画面の横幅が400pxまで
===============================================*/
@media screen and (max-width:400px){
/*===============================================
●sp400
===============================================*/
#sp400------------------------------------------- {
}
}



/*===============================================
●画面の横幅が320pxまで
===============================================*/
@media screen and (max-width:320px){
/*===============================================
●sp320
===============================================*/
#sp320------------------------------------------- {
}
}



/*===============================================
●画面の横幅が481pxから768pxまで
===============================================*/
@media screen and (min-width:481px) and (max-width:768px) {
/*===============================================
●tablet
===============================================*/
#tab------------------------------------------- {
}
.sp.tab {
	display: none;
}
}